svn commit: r672493 - in /ofbiz/trunk/applications/ecommerce: webapp/ecommerce/images/checkoutProcess.js webapp/ecommerce/order/OnePageCheckoutProcess.ftl widget/OrderScreens.xml

Previous Topic Next Topic
 
classic Classic list List threaded Threaded
1 message Options
Reply | Threaded
Open this post in threaded view
|

svn commit: r672493 - in /ofbiz/trunk/applications/ecommerce: webapp/ecommerce/images/checkoutProcess.js webapp/ecommerce/order/OnePageCheckoutProcess.ftl widget/OrderScreens.xml

mor-2
Author: mor
Date: Sat Jun 28 04:09:59 2008
New Revision: 672493

URL: http://svn.apache.org/viewvc?rev=672493&view=rev
Log:
Now panels are collapsible in One page checkout

Modified:
    ofbiz/trunk/applications/ecommerce/webapp/ecommerce/images/checkoutProcess.js
    ofbiz/trunk/applications/ecommerce/webapp/ecommerce/order/OnePageCheckoutProcess.ftl
    ofbiz/trunk/applications/ecommerce/widget/OrderScreens.xml

Modified: ofbiz/trunk/applications/ecommerce/webapp/ecommerce/images/checkoutProcess.js
URL: http://svn.apache.org/viewvc/ofbiz/trunk/applications/ecommerce/webapp/ecommerce/images/checkoutProcess.js?rev=672493&r1=672492&r2=672493&view=diff
==============================================================================
--- ofbiz/trunk/applications/ecommerce/webapp/ecommerce/images/checkoutProcess.js (original)
+++ ofbiz/trunk/applications/ecommerce/webapp/ecommerce/images/checkoutProcess.js Sat Jun 28 04:09:59 2008
@@ -16,3 +16,124 @@
  * specific language governing permissions and limitations
  * under the License.
  */
+
+Event.observe(window, 'load', function() {
+ // Cart
+    Event.observe($('editShipping'), 'click', function() {
+        displayShippingPanel();
+    });
+
+    Event.observe($('openCartPanel'), 'click', function() {
+        displayCartPanel();
+    });
+
+    // Shipping
+    Event.observe($('editShippingOptions'), 'click', function() {
+     displayShippingOptionPanel();
+    });
+
+    Event.observe($('openShippingPanel'), 'click', function() {
+     displayShippingPanel();
+    });
+
+    // Shipping Options
+    Event.observe($('editBilling'), 'click', function() {
+     displayBillingPanel();
+    });
+
+    Event.observe($('openShippingOptionPanel'), 'click', function() {
+     displayShippingOptionPanel();
+    });
+
+    // Billing
+    Event.observe($('openBillingPanel'), 'click', function() {
+     displayBillingPanel();
+    });
+
+    Event.observe($('openOrderSubmitPanel'), 'click', function() {
+     displayOrderSubmitPanel();
+    });
+});
+
+// Cart
+function displayShippingPanel() {
+    if(!$('editShippingPanel').visible()) {
+        Effect.BlindDown('editShippingPanel', {duration: 0.5});
+        Effect.BlindUp('editCartPanel', {duration: 0.5});
+        Effect.BlindUp('editShippingOptionPanel', {duration: 0.5});
+        Effect.BlindUp('editBillingPanel', {duration: 0.5});
+        Effect.BlindUp('orderSubmitPanel', {duration: 0.5});
+
+        Effect.Fade('shippingSummaryPanel', {duration: 0.5});
+        Effect.Appear('cartSummaryPanel', {duration: 0.5});
+        Effect.Appear('shippingOptionSummaryPanel', {duration: 0.5});
+        Effect.Appear('billingSummaryPanel', {duration: 0.5});
+        //Effect.Appear('orderSubmitPanel', {duration: 0.5});
+    }
+}
+function displayCartPanel() {
+    if(!$('editCartPanel').visible()) {
+        Effect.BlindDown('editCartPanel', {duration: 0.5});
+        Effect.BlindUp('editShippingPanel', {duration: 0.5});
+        Effect.BlindUp('editShippingOptionPanel', {duration: 0.5});
+        Effect.BlindUp('editBillingPanel', {duration: 0.5});
+        Effect.BlindUp('orderSubmitPanel', {duration: 0.5});
+
+        Effect.Fade('cartSummaryPanel', {duration: 0.5});
+        Effect.Appear('shippingSummaryPanel', {duration: 0.5});
+        Effect.Appear('shippingOptionSummaryPanel', {duration: 0.5});
+        Effect.Appear('billingSummaryPanel', {duration: 0.5});
+        //Effect.Appear('orderSubmitPanel', {duration: 0.5});
+    }
+}
+
+// Shipping
+function displayShippingOptionPanel() {
+    if(!$('editShippingOptionPanel').visible()) {
+        Effect.BlindDown('editShippingOptionPanel', {duration: 0.5});
+        Effect.BlindUp('editCartPanel', {duration: 0.5});
+        Effect.BlindUp('editShippingPanel', {duration: 0.5});
+        Effect.BlindUp('editBillingPanel', {duration: 0.5});
+        Effect.BlindUp('orderSubmitPanel', {duration: 0.5});
+
+        Effect.Fade('shippingOptionSummaryPanel', {duration: 0.5});
+        Effect.Appear('cartSummaryPanel', {duration: 0.5});
+        Effect.Appear('shippingSummaryPanel', {duration: 0.5});
+        Effect.Appear('billingSummaryPanel', {duration: 0.5});
+        //Effect.Appear('orderSubmitPanel', {duration: 0.5});
+    }
+}
+
+// Billing
+function displayBillingPanel() {
+    if(!$('editBillingPanel').visible()) {
+        Effect.BlindDown('editBillingPanel', {duration: 0.5});
+        Effect.BlindUp('editCartPanel', {duration: 0.5});
+        Effect.BlindUp('editShippingPanel', {duration: 0.5});
+        Effect.BlindUp('editShippingOptionPanel', {duration: 0.5});
+        Effect.BlindUp('orderSubmitPanel', {duration: 0.5});
+
+        Effect.Fade('billingSummaryPanel', {duration: 0.5});
+        Effect.Appear('cartSummaryPanel', {duration: 0.5});
+        Effect.Appear('shippingSummaryPanel', {duration: 0.5});
+        Effect.Appear('shippingOptionSummaryPanel', {duration: 0.5});
+        //Effect.Appear('orderSubmitPanel', {duration: 0.5});
+    }
+}
+
+// Order Submit
+function displayOrderSubmitPanel() {
+    if(!$('orderSubmitPanel').visible()) {
+        Effect.BlindDown('orderSubmitPanel', {duration: 0.5});
+        Effect.BlindUp('editCartPanel', {duration: 0.5});
+        Effect.BlindUp('editShippingPanel', {duration: 0.5});
+        Effect.BlindUp('editShippingOptionPanel', {duration: 0.5});
+        Effect.BlindUp('editBillingPanel', {duration: 0.5});
+
+        //Effect.Fade('billingSummaryPanel', {duration: 0.5});
+        Effect.Appear('cartSummaryPanel', {duration: 0.5});
+        Effect.Appear('shippingSummaryPanel', {duration: 0.5});
+        Effect.Appear('shippingOptionSummaryPanel', {duration: 0.5});
+        Effect.Appear('billingSummaryPanel', {duration: 0.5});
+    }    
+}
\ No newline at end of file

Modified: ofbiz/trunk/applications/ecommerce/webapp/ecommerce/order/OnePageCheckoutProcess.ftl
URL: http://svn.apache.org/viewvc/ofbiz/trunk/applications/ecommerce/webapp/ecommerce/order/OnePageCheckoutProcess.ftl?rev=672493&r1=672492&r2=672493&view=diff
==============================================================================
--- ofbiz/trunk/applications/ecommerce/webapp/ecommerce/order/OnePageCheckoutProcess.ftl (original)
+++ ofbiz/trunk/applications/ecommerce/webapp/ecommerce/order/OnePageCheckoutProcess.ftl Sat Jun 28 04:09:59 2008
@@ -36,7 +36,7 @@
               <form name="cartForm" id="cartForm" method="post" action="<@ofbizUrl></@ofbizUrl>">
                 Shopping cart information.
               </form>
-              <div><h3><span class="editStep"><a href="javascript:void(0);" id="editShippingAndPersonalDetail"><h3>Continue for step 2</h3></a></span></h3></div>              
+              <div><h3><span class="editStep"><a href="javascript:void(0);" id="editShipping"><h3>Continue for step 2</h3></a></span></h3></div>              
             </div>
           </div>
 
@@ -52,23 +52,23 @@
              <form name="shippingForm" id="shippingForm" action="<@ofbizUrl></@ofbizUrl>" method="post">
                Shipping Detail.
              </form>
-              <div><h3><span class="editStep"><a href="javascript:void(0);" id="editShipmentOptions"><h3>Continue for step 3</h3></a></span></h3></div>              
+              <div><h3><span class="editStep"><a href="javascript:void(0);" id="editShippingOptions"><h3>Continue for step 3</h3></a></span></h3></div>              
             </div>
           </div>
 
-          <div id="shipmentOptionPanel" class="screenlet">
-            <div class="screenlet-header"><div class="boxhead" align="left">Step 3: Shipment Options</div></div>
-            <div id="shipmentOptionSummaryPanel">
-              <div align="left" style="width: auto; padding: 10px 40px 30px 40px;"><a href="javascript:void(0);" id="openShipmentOptionPanel"><h3>Click here to edit</h3></a></div>
-              <div id="shipmentOptionSummary" style="display: none;">
+          <div id="shippingOptionPanel" class="screenlet">
+            <div class="screenlet-header"><div class="boxhead" align="left">Step 3: Shipping Options</div></div>
+            <div id="shippingOptionSummaryPanel">
+              <div align="left" style="width: auto; padding: 10px 40px 30px 40px;"><a href="javascript:void(0);" id="openShippingOptionPanel"><h3>Click here to edit</h3></a></div>
+              <div id="shippingOptionSummary" style="display: none;">
                Shipping Methods summary.
               </div>
             </div>
-            <div id="editShipmentOptionPanel" style="display: none;">
-              <form name="shipmentOptionForm" id="shipmentOptionForm" action="<@ofbizUrl></@ofbizUrl>" method="post">
+            <div id="editShippingOptionPanel" style="display: none;">
+              <form name="shippingOptionForm" id="shippingOptionForm" action="<@ofbizUrl></@ofbizUrl>" method="post">
                 Shipping Methods.
               </form>
-              <div><h3><span class="editStep"><a href="javascript:void(0);" id="editBillingAndPayment"><h3>Continue for step 4</h3></a></span></h3></div>
+              <div><h3><span class="editStep"><a href="javascript:void(0);" id="editBilling"><h3>Continue for step 4</h3></a></span></h3></div>
             </div>
           </div>
 
@@ -84,7 +84,7 @@
               <form name="billingForm" id="billingForm" class="theform" action="<@ofbizUrl></@ofbizUrl>" method="post">
                 Billing and Payment Detail.
               </form>
-              <div><h3><span class="editStep"><a href="javascript:void(0);" id=""><h3>Continue for step 5</h3></a></span></h3></div>
+              <div><h3><span class="editStep"><a href="javascript:void(0);" id="openOrderSubmitPanel"><h3>Continue for step 5</h3></a></span></h3></div>
             </div>
           </div>
 

Modified: ofbiz/trunk/applications/ecommerce/widget/OrderScreens.xml
URL: http://svn.apache.org/viewvc/ofbiz/trunk/applications/ecommerce/widget/OrderScreens.xml?rev=672493&r1=672492&r2=672493&view=diff
==============================================================================
--- ofbiz/trunk/applications/ecommerce/widget/OrderScreens.xml (original)
+++ ofbiz/trunk/applications/ecommerce/widget/OrderScreens.xml Sat Jun 28 04:09:59 2008
@@ -612,9 +612,11 @@
         <section>
             <actions>
                 <script location="component://ecommerce/webapp/ecommerce/WEB-INF/actions/cart/showcart.bsh"/>
+                <set field="layoutSettings.javaScripts[+0]" value="/ecommerce/images/checkoutProcess.js" global="true"/>
+                <set field="layoutSettings.javaScripts[+0]" value="/images/prototypejs/scriptaculous.js" global="true"/>
             </actions>
             <widgets>
-                <decorator-screen name="quickAnonCheckoutDecorator">
+                <decorator-screen name="main-decorator" location="${parameters.mainDecoratorLocation}">
                     <decorator-section name="body">
                         <platform-specific><html><html-template location="component://ecommerce/webapp/ecommerce/order/OnePageCheckoutProcess.ftl"/></html></platform-specific>
                     </decorator-section>