You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@ofbiz.apache.org by bu...@apache.org on 2009/11/27 13:52:11 UTC

svn commit: r884864 - in /ofbiz/trunk/framework: common/script/org/ofbiz/common/ common/webcommon/portal/ common/widget/ images/webapp/images/

Author: buscob
Date: Fri Nov 27 12:52:11 2009
New Revision: 884864

URL: http://svn.apache.org/viewvc?rev=884864&view=rev
Log:
A patch from Sascha Rodekamp "Drag'n'Drop update - add directly in the my portal application"
(https://issues.apache.org/jira/browse/OFBIZ-3227) - OFBIZ-3227

Modified:
    ofbiz/trunk/framework/common/script/org/ofbiz/common/PortalPageServices.xml
    ofbiz/trunk/framework/common/webcommon/portal/editPortalPage.ftl
    ofbiz/trunk/framework/common/webcommon/portal/showPortalPage.ftl
    ofbiz/trunk/framework/common/widget/PortalPageScreens.xml
    ofbiz/trunk/framework/images/webapp/images/myportal.css
    ofbiz/trunk/framework/images/webapp/images/myportal.js

Modified: ofbiz/trunk/framework/common/script/org/ofbiz/common/PortalPageServices.xml
URL: http://svn.apache.org/viewvc/ofbiz/trunk/framework/common/script/org/ofbiz/common/PortalPageServices.xml?rev=884864&r1=884863&r2=884864&view=diff
==============================================================================
--- ofbiz/trunk/framework/common/script/org/ofbiz/common/PortalPageServices.xml (original)
+++ ofbiz/trunk/framework/common/script/org/ofbiz/common/PortalPageServices.xml Fri Nov 27 12:52:11 2009
@@ -312,7 +312,7 @@
         </entity-one>
 
         <!-- destination Portlet -->
-        <if-compare operator="equals" field="parameters.mode" value="DRAGDROP">
+        <if-compare operator="equals" field="parameters.mode" value="DRAGDROPBEFORE">
             <entity-one value-field="destiPp" entity-name="PortalPagePortlet">
                 <field-map field-name="portalPageId" value="${parameters.d_portalPageId}"/>
                 <field-map field-name="portalPortletId" value="${parameters.d_portalPortletId}"/>
@@ -325,11 +325,25 @@
                 <condition-expr field-name="sequenceNum" operator="greater-equals" value="${destiPp.sequenceNum}"/>
              </condition-list>
         </entity-condition>
+        </if-compare>
+
+        <if-compare operator="equals" field="parameters.mode" value="DRAGDROPAFTER">
+            <entity-one value-field="destiPp" entity-name="PortalPagePortlet">
+                <field-map field-name="portalPageId" value="${parameters.d_portalPageId}"/>
+                <field-map field-name="portalPortletId" value="${parameters.d_portalPortletId}"/>
+                <field-map field-name="portletSeqId" value="${parameters.d_portletSeqId}"/>
+            </entity-one>
 
+            <entity-condition list="modifyPpList" entity-name="PortalPagePortlet">
+             <condition-list combine="and">
+                <condition-expr field-name="portalPageId" operator="equals" value="${parameters.o_portalPageId}"/>
+                <condition-expr field-name="sequenceNum" operator="greater" value="${destiPp.sequenceNum}"/>
+             </condition-list>
+            </entity-condition>
         </if-compare>
 
         <!-- Portlets to Modify -->
-        <if-compare operator="equals" field="parameters.mode" value="ColBOTTOM">
+        <if-compare operator="equals" field="parameters.mode" value="DRAGDROPBOTTOM">
             <entity-one value-field="pPColumn" entity-name="PortalPageColumn">
                 <field-map field-name="columnSeqId" value="${parameters.destinationColumn}"/>
                 <field-map field-name="portalPageId" value="${parameters.o_portalPageId}"/>

Modified: ofbiz/trunk/framework/common/webcommon/portal/editPortalPage.ftl
URL: http://svn.apache.org/viewvc/ofbiz/trunk/framework/common/webcommon/portal/editPortalPage.ftl?rev=884864&r1=884863&r2=884864&view=diff
==============================================================================
--- ofbiz/trunk/framework/common/webcommon/portal/editPortalPage.ftl (original)
+++ ofbiz/trunk/framework/common/webcommon/portal/editPortalPage.ftl Fri Nov 27 12:52:11 2009
@@ -48,13 +48,12 @@
   <tr>
     <#list portalPageColumnList?if_exists as portalPageColumn>
       <td style="vertical-align: top; <#if portalPageColumn.columnWidthPercentage?has_content> width:${portalPageColumn.columnWidthPercentage}%;</#if>" id="${portalPageColumn.columnSeqId}" name="portalColumn">
-      <script type="text/javascript">makeDroppable("${portalPageColumn.columnSeqId}")</script>
       <#assign firstInColumn = true/>
       <#list portalPagePortletViewList as portlet>
         <#if (!portlet.columnSeqId?has_content && portalPageColumn_index == 0) || (portlet.columnSeqId?if_exists == portalPageColumn.columnSeqId)>
           <#if portlet.screenName?has_content>
               <#assign portletFields = '<input name="portalPageId" value="' + portlet.portalPageId + '" type="hidden"/><input name="portalPortletId" value="' + portlet.portalPortletId + '" type="hidden"/><input name="portletSeqId" value="' + portlet.portletSeqId  + '" type="hidden"/>'>
-              <div class="portlet-config" id="${portlet_index}" name="portalPortlet">
+              <div class="portlet-config" id="${portlet_index}" name="portalPortlet" onMouseOver="javascript:this.style.cursor='move';">
               <div class="portlet-config-title-bar">
                 <#list portalPages as portalPageList>
                   <#if portalPage.portalPageId != portalPageList.portalPageId>

Modified: ofbiz/trunk/framework/common/webcommon/portal/showPortalPage.ftl
URL: http://svn.apache.org/viewvc/ofbiz/trunk/framework/common/webcommon/portal/showPortalPage.ftl?rev=884864&r1=884863&r2=884864&view=diff
==============================================================================
--- ofbiz/trunk/framework/common/webcommon/portal/showPortalPage.ftl (original)
+++ ofbiz/trunk/framework/common/webcommon/portal/showPortalPage.ftl Fri Nov 27 12:52:11 2009
@@ -16,23 +16,29 @@
 specific language governing permissions and limitations
 under the License.
 -->
-
 <#if portalPage?has_content>
 <table width="100%">
   <tr>
     <#list portalPageColumns?if_exists as portalPageColumn>
-      <td style="vertical-align: top; <#if portalPageColumn.columnWidthPercentage?has_content> width:${portalPageColumn.columnWidthPercentage}%;</#if>">
+      <td style="vertical-align: top; <#if portalPageColumn.columnWidthPercentage?has_content> width:${portalPageColumn.columnWidthPercentage}%;</#if>" id="${portalPageColumn.columnSeqId}" name="portalColumn">
       <#assign firstInColumn = true/>
       <#list portalPagePortlets as portlet>
         <#if (!portlet.columnSeqId?has_content && portalPageColumn_index == 0) || (portlet.columnSeqId?if_exists == portalPageColumn.columnSeqId)>
           <#if portlet.screenName?has_content>
-            <div>
+            <#assign portletFields = '<input name="portalPageId" value="' + portlet.portalPageId + '" type="hidden"/><input name="portalPortletId" value="' + portlet.portalPortletId + '" type="hidden"/><input name="portletSeqId" value="' + portlet.portletSeqId  + '" type="hidden"/>'>
+            <form method="post" action="<@o...@ofbizUrl>" name="movePP_${portlet_index}">${portletFields}<input name="newPortalPageId" value="${portlet.portalPageId}" type="hidden"/></form>
+            <div id="${portlet_index}" name="portalPortlet" class="noClass">
             ${setRequestAttribute("portalPageId", portalPage.portalPageId)}
             ${setRequestAttribute("portalPortletId", portlet.portalPortletId)}
             ${setRequestAttribute("portletSeqId", portlet.portletSeqId)}
             ${screens.render(portlet.screenLocation, portlet.screenName)}
             ${screens.setRenderFormUniqueSeq(portlet_index)}
             </div>
+            <#-- DragNDrop is only activated, when the portal Page isn't the Default page -->
+            <#if portalPage.originalPortalPageId?has_content><script>setMousePointer("${portlet_index}")</script></#if>
+            <#if portalPage.originalPortalPageId?has_content><script type="text/javascript">makeDragable("${portlet_index}");</script></#if>
+            <#if portalPage.originalPortalPageId?has_content><script type="text/javascript">makeDroppable("${portlet_index}");</script></#if>
+            <form method="post" action="<@o...@ofbizUrl>" name="freeMove_${portlet_index}">${portletFields}<input name="columnSeqId" value="${portalPageColumn.columnSeqId}" type="hidden"/><input name="mode" value="RIGHT" type="hidden"/></form>
           </#if>
           <#assign firstInColumn = false/>
         </#if>

Modified: ofbiz/trunk/framework/common/widget/PortalPageScreens.xml
URL: http://svn.apache.org/viewvc/ofbiz/trunk/framework/common/widget/PortalPageScreens.xml?rev=884864&r1=884863&r2=884864&view=diff
==============================================================================
--- ofbiz/trunk/framework/common/widget/PortalPageScreens.xml (original)
+++ ofbiz/trunk/framework/common/widget/PortalPageScreens.xml Fri Nov 27 12:52:11 2009
@@ -68,6 +68,8 @@
     <screen name="showPortalPage">
         <section>
             <actions>
+                <set field="layoutSettings.javaScripts[]" value="/images/myportal.js" global="true"/>
+                <set field="layoutSettings.styleSheets[+0]" value="/images/myportal.css" global="true"/>
                 <set field="headerItem" from-field="parameters.portalPageId"/>
             </actions>
             <widgets>
@@ -87,7 +89,9 @@
                                 </entity-and>
                             </actions>
                             <widgets>
-                                <platform-specific><html><html-template location="component://common/webcommon/portal/showPortalPage.ftl"/></html></platform-specific>
+                                <container id="portalContainerId">
+                                    <platform-specific><html><html-template location="component://common/webcommon/portal/showPortalPage.ftl"/></html></platform-specific>
+                                </container>
                             </widgets>
                         </section>
                     </decorator-section>

Modified: ofbiz/trunk/framework/images/webapp/images/myportal.css
URL: http://svn.apache.org/viewvc/ofbiz/trunk/framework/images/webapp/images/myportal.css?rev=884864&r1=884863&r2=884864&view=diff
==============================================================================
--- ofbiz/trunk/framework/images/webapp/images/myportal.css (original)
+++ ofbiz/trunk/framework/images/webapp/images/myportal.css Fri Nov 27 12:52:11 2009
@@ -19,12 +19,12 @@
 
 #loading {
 position: absolute;
-z-index: 100;
-left: 10px;
-top: 250px;
 background-image: url(/images/myportal_load_bg.png);
 background-repeat:repeat;
 background-position:top center;
+z-index: 100;
+top: 0px;
+left: 10px;
 border: 0px !important;
 width: 99%;
 height: 100%;
@@ -35,13 +35,3 @@
 top: 200px;
 left: 50%;
 }
-
-td.hover {
-border: 2px dashed #aaa;
-background:#efefef;
-}
-
-div.hover {
-border: 2px dashed #aaa;
-background:#efefef;
-}

Modified: ofbiz/trunk/framework/images/webapp/images/myportal.js
URL: http://svn.apache.org/viewvc/ofbiz/trunk/framework/images/webapp/images/myportal.js?rev=884864&r1=884863&r2=884864&view=diff
==============================================================================
--- ofbiz/trunk/framework/images/webapp/images/myportal.js (original)
+++ ofbiz/trunk/framework/images/webapp/images/myportal.js Fri Nov 27 12:52:11 2009
@@ -19,41 +19,180 @@
 
 //Drag & Drop Functions for myPortal
 
+//global Var for controlling hover Boxes
+var hoverDivBefore = -1;
+var hoverColumnBefore = -1;
+
+//init KeyListener
+window.onload=function(){
+    document.onkeydown = key_event;
+    document.onkeypress = key_event;
+
+    //set a column droppable when it's empty
+    checkIfTabelsContainsDivs();
+}
+
+//if ESC is pressed, remove draged portlet + hoverDiv
+function key_event(evt)
+{
+    if(evt.keyCode == 27)  {
+        //removes the hover div after the portlet is moved to another position
+        if((hd = document.getElementById('hoverDiv')) != null){
+            Droppables.remove(hd);
+            hd.parentNode.removeChild(hd);
+            //the global var must disabled
+            hoverColumnBefore = -1;
+            hoverDivBefore = -1;
+        }
+    }
+}
+
 //makes portlets dragable
 function makeDragable(portletId){
     drag = document.getElementById(portletId);
     new Draggable(drag,
-            {revert: true, reverteffect :
-            function(drag, top_offset, left_offset)
-                { new Effect.MoveBy(drag, -top_offset, -left_offset, {duration:0}); }
+            {revert: true, ghosting: false, reverteffect :
+            function(drag, top_offset, left_offset){
+                    new Effect.MoveBy(drag, -top_offset, -left_offset, {duration:0});
+                    var hd = document.getElementById('hoverDiv');
+                    if(hd != null){
+                        Droppables.remove(hd);
+                        hd.parentNode.removeChild(hd);
+                    }
+                }
             });
 }
 
 //makes columns and portlets droppable
 function makeDroppable(id){
+    //DragDrop mode
+    var mode = null;
     var drop = document.getElementById(id);
     if(drop.nodeName == "DIV"){
         Droppables.add(drop, {
-            accept: 'portlet-config',
-            hoverclass: 'hover',
-                onDrop: function(element) {
-                getDestinationInformationPortlets(element.id, id);
+            accept: ['portlet-config','noClass'],
+            //Hover effekt
+            onHover: function(element){
+
+                //vertical overlapping position
+                var pos = Position.overlap('vertical', drop);
+                //gets the position of the droppable element
+                var hd = document.getElementById('hoverDiv');
+
+                if(pos >= 0.5){
+                    mode = "DRAGDROPBEFORE";
+                    //if the previous DIV is the hoverDiv do nothing
+                    try {
+                        var previous = (drop.previous('DIV')).getAttribute('id');
+                    } catch (ex) {
+                        previous = 'undi';
+                    }
+
+                    if(previous != 'hoverDiv' && previous != element.id){
+                        if(hd != null){
+                            Droppables.remove(hd);
+                            hd.parentNode.removeChild(hd);
+                        }
+
+                        //create previewDiv
+                        var divTopOffset = document.getElementById(element.id).offsetHeight;
+                        var hoverDiv = document.createElement('DIV');
+                        hoverDiv.setAttribute('style', 'height: ' + divTopOffset + 'px; border: 1px dashed #aaa; background:#ffffff; margin-bottom: 5px;')
+                        hoverDiv.setAttribute('id', 'hoverDiv');
+                        var elem = document.getElementById(id);
+
+                        //inseret Before
+                        elem.parentNode.insertBefore(hoverDiv, elem);
+                        hoverDivBefore = id;
+
+                        //the new div have to be droppable
+                        Droppables.add(hoverDiv, {
+                            onDrop: function(element) {
+                                getDestinationInformationPortlets(element.id, id, mode);
+                            }
+                        });
+                    }
+                }else if(pos < 0.5){
+                    mode = "DRAGDROPAFTER";
+                    //if the next DIV is the hoverDiv do nothing
+                    try {
+                        var next = (drop.next('DIV')).getAttribute('id');
+                    }catch (ex){
+                        next = 'undi';
+                    }
+
+                    if(next != 'hoverDiv' && next != element.id){
+                        if(hd != null){
+                            Droppables.remove(hd);
+                            hd.parentNode.removeChild(hd);
+                        }
+
+                        //create previewDiv
+                        var divTopOffset = document.getElementById(element.id).offsetHeight;
+                        var hoverDiv = document.createElement('DIV');
+                        hoverDiv.setAttribute('style', 'height: ' + divTopOffset + 'px; border: 1px dashed #aaa; background:#ffffff; margin-bottom: 5px;')
+                        hoverDiv.setAttribute('id', 'hoverDiv');
+                        var elem = document.getElementById(id);
+
+                        //insert After
+                        elem.parentNode.insertBefore(hoverDiv, elem.nextSibling);
+                        hoverDivBefore = id;
+
+                        //the new div have to be droppable
+                        Droppables.add(hoverDiv, {
+                            onDrop: function(element) {
+                                getDestinationInformationPortlets(element.id, id, mode);
+                            }
+                        });
+                    }
+                }
+            },
+            onDrop: function(element) {
+                getDestinationInformationPortlets(element.id, id, mode);
             }
         });
     }else{
+        mode = "DRAGDROPBOTTOM";
+        //Makes ColumnDroppable
         Droppables.add(drop, {
-        accept: 'portlet-config',
-        hoverclass: 'hover',
+            accept: ['portlet-config','noClass'],
+            //Hover effekt
+            onHover: function(element){
+                var hd = document.getElementById('hoverDiv');
+                if(hd != null){
+                    hd.parentNode.removeChild(hd);
+                }
+
+                //create previewDiv
+                var divTopOffset = document.getElementById(element.id).offsetHeight;
+                var hoverDiv = document.createElement('DIV');
+                hoverDiv.setAttribute('style', 'height: ' + divTopOffset + 'px; border: 1px dashed #aaa; background:#ffffff; margin-bottom: 5px;')
+                hoverDiv.setAttribute('id', 'hoverDiv');
+                var elem = document.getElementById(id);
+
+                //insert After
+                elem.appendChild(hoverDiv);
+                hoverDivBefore = id;
+
+                //the new div have to be droppable
+                Droppables.add(hoverDiv, {
+                    onDrop: function(element) {
+                        getDestinationInformationColumn(element.id, id);
+                    }
+                });
+            },
+
             onDrop: function(element) {
-            getDestinationInformationColumn(element.id, id);
-        }
-        });
+                getDestinationInformationColumn(element.id, id);
+            }
+            });
     }
+
 }
 
 //calls ajax request for dropping container on a portlet
-function getDestinationInformationPortlets(originId, destinationId){
-	loadingImage();
+function getDestinationInformationPortlets(originId, destinationId, mode){
+    loadingImage();
 
     var move = document.forms['freeMove_' + destinationId];
     var d_portalPageId = move.elements['portalPageId'].value;
@@ -68,7 +207,7 @@
     new Ajax.Request('/myportal/control/updatePortalPagePortletSeqAjax',{
         method: "post",
         parameters: {o_portalPageId: o_portalPageId, o_portalPortletId: o_portalPortletId, o_portletSeqId: o_portletSeqId,
-        d_portalPageId: d_portalPageId, d_portalPortletId: d_portalPortletId, d_portletSeqId: d_portletSeqId, mode: "DRAGDROP" },
+        d_portalPageId: d_portalPageId, d_portalPortletId: d_portalPortletId, d_portletSeqId: d_portletSeqId, mode: mode },
 
         onLoading: function(transport){
         },
@@ -77,7 +216,11 @@
             var destination = document.getElementById(destinationId);
             var origin = document.getElementById(originId);
 
-            destination.parentNode.insertBefore(origin, destination);
+            if(mode == 'DRAGDROPBEFORE'){
+                destination.parentNode.insertBefore(origin, destination);
+            }else if(mode == 'DRAGDROPAFTER'){
+                destination.parentNode.insertBefore(origin, destination.nextSibling);
+            }
             //Fix for layout Bug
             origin.style.left = destination.style.left;
             origin.style.top = 0;
@@ -102,7 +245,7 @@
 
     new Ajax.Request('/myportal/control/updatePortalPagePortletSeqAjax',{
             method: "post",
-            parameters: {destinationColumn: destination, o_portalPageId: portalPageId, o_portalPortletId: portalPortletId, o_portletSeqId: portletSeqId, mode: "ColBOTTOM"},
+            parameters: {destinationColumn: destination, o_portalPageId: portalPageId, o_portalPortletId: portalPortletId, o_portletSeqId: portletSeqId, mode: "DRAGDROPBOTTOM"},
 
         onLoading: function(transport){
         },
@@ -125,6 +268,18 @@
 
 //removes the loading image
 function onCompleteRequest() {
+
+    //removes the hover div after the portlet is moved to another position
+    if((hd = document.getElementById('hoverDiv')) != null){
+        hd.parentNode.removeChild(hd);
+        //the global var must disabled
+        hoverColumnBefore = -1;
+        hoverDivBefore = -1;
+    }
+
+    //set a column droppable when it's empty
+    checkIfTabelsContainsDivs()
+
     var loading = document.getElementById("loading");
     if(loading != null){
         //IE Fix (IE treats DOM objects and Javascript objects separately, and you can't extend the DOM objects using Object.prototype)
@@ -135,7 +290,7 @@
 //displays the loading image
 function loadingImage() {
     var container = document.getElementById("portalContainerId");
-    var p = document.createElement("p");
+    var p = document.createElement("div");
     p.setAttribute("id", "loading");
     var img = document.createElement("img");
     img.setAttribute("src", "/images/loader.gif");
@@ -144,6 +299,36 @@
     container.appendChild(p);
 }
 
+//set the MousePointer
+function setMousePointer(elem){
+    var elements = document.getElementById(elem).getElementsByTagName('div');
+    for(i=0; i<elements.length; i++){
+        att = elements[i].getAttribute("class");
+        if(att == 'screenlet-title-bar'){
+            elements[i].setAttribute('onMouseOver','javascript:this.style.cursor="move";');
+            break;
+        }
+    }
+}
+
+//checked if a Tabel contains a portlet, if not make it Droppable
+function checkIfTabelsContainsDivs(){
+    var td = new Array();
+    td = getElementsByName_iefix('TD', 'portalColumn');
+    for(var i=0; i<td.length; i++){
+        //if the next DIV is the hoverDiv do nothing
+
+            var next = (td[i].select('DIV'));
+            if(next.length == 0){
+                //make a column droppable when it's empty
+                makeDroppable(td[i].getAttribute('id'));
+            }else{
+                //removes the column droppable attribute when it's not empty
+                Droppables.remove(td[i]);
+            }
+    }
+}
+
 //Workaround for IE getElementsByName Bug
 function getElementsByName_iefix(tag, name) {
     var elem = document.getElementsByTagName(tag);
@@ -157,4 +342,3 @@
     }
     return arr;
 }
-