Index: branches/1.0.x/checkout.tpl =================================================================== --- branches/1.0.x/checkout.tpl (revision 14829) +++ branches/1.0.x/checkout.tpl (revision 14830) @@ -1,395 +1,395 @@ <!--## <NAME>One Step Checkout</NAME> <DESC></DESC> <SECTION>Pages||Checkout</SECTION> ##--> <inp2:m_DefineElement name="page_title">One Step Checkout</inp2:m_DefineElement> <!--## MAIN CONTENT ##--> <inp2:m_DefineElement name="content"> <ul class="steps"> <li class="step1"><a href="<inp2:m_Link template='cart'/>"><i></i>Shopping Cart</a></li> <li class="step2 active"><a href="#"><i></i>One-step Checkout</a></li> <li class="step3"><span><i></i>Receipt</span></li> </ul> <div class="clear"></div> <div class="cart-detail"> <h1>One-Step Checkout</h1> <form method="post" action="<inp2:m_FormAction/>" id="checkout-form" class="form checkout-form"> <script type="text/javascript"> FormManager.resetFields('ord'); </script> <inp2:ord_ShowDefaultAddress type="billing"/> <inp2:ord_ShowDefaultAddress type="shipping"/> <div class="halfcol"> <fieldset class="firstline"> <inp2:m_ifnot check="m_LoggedIn"> <div class="login-alt"> Continue as Guest or <div class="login"> <a href="" id="login-alt">Log In</a> </div> </div> </inp2:m_ifnot> <inp2:m_RenderElement name="inp_edit_box" prefix="ord" field="BillingEmail" title="lu_fld_YourEmail"/> </fieldset> <fieldset> <div class="fieldset"> Billing Address </div> <inp2:m_RenderElement name="inp_edit_box" prefix="ord" field="BillingTo" title="lu_fld_FullName"/> <inp2:m_RenderElement name="inp_edit_box" prefix="ord" field="BillingCompany" title="lu_fld_Company"/> <inp2:m_RenderElement name="inp_edit_address" prefix="ord" field="BillingAddress1" field2="BillingAddress2" title="lu_fld_Address"/> <inp2:m_RenderElement name="inp_edit_box" prefix="ord" field="BillingCity" title="lu_fld_City"/> <inp2:m_RenderElement name="inp_edit_country" prefix="ord" field="BillingCountry" state_field="BillingState" title="lu_fld_Country" has_empty="1" empty_label="lu_opt_SelectCountry"/> <!-- TODO: preload states by country --> <inp2:m_RenderElement name="inp_edit_options" prefix="ord" field="BillingState" title="lu_fld_State" has_empty="1" row_class="alt1"/> <inp2:m_RenderElement name="inp_edit_box" prefix="ord" field="BillingZip" title="lu_fld_Zip" row_class="alt2"/> <inp2:m_RenderElement name="inp_edit_box" prefix="ord" field="BillingPhone" title="lu_fld_Phone"/> </fieldset> <fieldset class="creditcard"> <div class="fieldset"> Payment Information </div> <div class="creditcards"> <inp2:m_if check='ord_UsingCreditCard'> <span><img src="<inp2:m_TemplatesBase/>img/creditcards.jpg" width="245" height="39" alt="" /></span> </inp2:m_if> <inp2:m_if check="pt.gw-paypal_Field" name="PaymentTypeId" gateway="PayPal"> <span<inp2:m_if check='ord_UsingCreditCard'> class="paypal"</inp2:m_if>> <a href="#" id="paypal" payment_type="<inp2:pt.gw-paypal_Field name='PaymentTypeId' gateway='PayPal'/>"> <img src="<inp2:m_TemplatesBase/>img/paypal.jpg" width="98" height="45" alt="" /> </a> </span> <script type="text/javascript"> $(document).ready( function () { $('#paypal').click( function ($e) { FormManager.getField('ord', 'PaymentType').value = $(this).attr('payment_type'); FormManager.submitForm('ord'); return false; } ); } ); </script> </inp2:m_if> </div> <inp2:m_if check='ord_UsingCreditCard'> <inp2:m_RenderElement name="inp_edit_box" prefix="ord" field="PaymentAccount" title="lu_fld_CreditCardNumber"/> <inp2:m_RenderElement design="form_row" prefix="ord" field="PaymentCCExpDate" title="lu_fld_ExpirationDate" row_class="alt1 expdate" field_type="cc_expiration"> <select class="field" name="<inp2:ord_InputName field='PaymentCCExpMonth'/>" id="<inp2:ord_InputName field='PaymentCCExpMonth'/>"> <inp2:ord_PredefinedOptions field="PaymentCCExpMonth" render_as="inp_option_item" selected="selected"/> </select> / <select class="field" name="<inp2:ord_InputName field='PaymentCCExpYear'/>" id="<inp2:ord_InputName field='PaymentCCExpYear'/>"> <option value=''></option> <inp2:ord_PrintYearOptions field="PaymentCCExpYear" render_as="inp_option_item" selected="selected"/> </select> </inp2:m_RenderElement> <inp2:m_RenderElement name="inp_edit_box" prefix="ord" field="PaymentCVV2" title="lu_fld_SecurityCode" row_class="alt2"/> <input type="hidden" name="check_credit_card" id="check_credit_card" value="true"/> </inp2:m_if> </fieldset> </div> <div class="halfcol halfcol-last"> <inp2:m_ifnot check="m_LoggedIn"> <div class="badge-optional"></div> <fieldset class="firstline" id="create-account-password"> <p> <label><input type="checkbox" id="create_account" name="create_account" value="1"<inp2:m_if check="m_Get" name="create_account"> checked</inp2:m_if>/> Create account for easy purchases and order tracking</label> </p> <inp2:m_RenderElement name="inp_edit_password" prefix="ord" field="UserPassword" title="lu_fld_Password" verify_title="lu_fld_VerifyPassword"/> </fieldset> </inp2:m_ifnot> - + <div class="firstline" style="<inp2:m_ifnot check='m_LoggedIn'>display: none</inp2:m_ifnot>"></div> <fieldset> <div class="fieldset"> <label> <input type="checkbox" id="same_as_billing" name="same_as_billing" value="1"<inp2:m_if check="ord_AddressesTheSame"> checked</inp2:m_if>/> Ship To Address is the same as Billing </label> </div> <div id="shipping-address"<inp2:m_if check="ord_AddressesTheSame"> style="display: none;"</inp2:m_if>> <inp2:m_RenderElement name="inp_edit_box" prefix="ord" field="ShippingTo" title="lu_fld_FullName"/> <inp2:m_RenderElement name="inp_edit_box" prefix="ord" field="ShippingCompany" title="lu_fld_Company"/> <inp2:m_RenderElement name="inp_edit_address" prefix="ord" field="ShippingAddress1" field2="ShippingAddress2" title="lu_fld_Address"/> <inp2:m_RenderElement name="inp_edit_box" prefix="ord" field="ShippingCity" title="lu_fld_City"/> <inp2:m_RenderElement name="inp_edit_country" prefix="ord" field="ShippingCountry" state_field="ShippingState" title="lu_fld_Country" has_empty="1" empty_label="lu_opt_SelectCountry"/> <!-- TODO: preload states by country --> <inp2:m_RenderElement name="inp_edit_options" prefix="ord" field="ShippingState" title="lu_fld_State" has_empty="1" row_class="alt1"/> <inp2:m_RenderElement name="inp_edit_box" prefix="ord" field="ShippingZip" title="lu_fld_Zip" row_class="alt2"/> </div> <p id="shipping-type-container"> <inp2:m_include template="elements/ajax/shipping_type"/> </p> <div class="safe-shop" id="shipping-address-placeholder"<inp2:m_ifnot check="ord_AddressesTheSame"> style="display: none;"</inp2:m_ifnot>> <p class="title">100% Safe & Secure Shopping</p> <ul class="list"> <li>All Transactions are Encrypted</li> <li>Your Information is Protected</li> <li>No Hidden Charges</li> <li>Satisfaction Guaranteed</li> </ul> </div> </fieldset> <fieldset> <div class="fieldset"> Your Order Summary (<inp2:orditems_TotalRecords/> Items) - <a href="#" class="link">View Order Details</a> + <a href="<inp2:m_Link template='elements/ajax/order_details' width='800' height='600'/>" class="thickbox link">View Order Details</a> </div> <dl class="total"> <inp2:m_include template="elements/ajax/order_totals"/> </dl> <div class="clear"></div> <div class="terms"> <label><input type="checkbox" id="terms" name="terms" value="yes" checked="true" /> I Agree to Terms and Conditions</label> </div> <p class="buttons"> <a href="#" class="place-button"><span>Place Order</span></a> </p> </fieldset> </div> <div class="clear"></div> <inp2:m_RenderElement name="inp_edit_hidden" prefix="ord" field="PaymentType" db="db"/> <input type="hidden" name="check_billing_address" id="check_billing_address" value="true"/> <input type="hidden" name="check_shipping_address" id="check_shipping_address" value="true"/> </form> <inp2:m_include template="elements/ajax/payment_form"/> </div> <script type="text/javascript"> function CheckoutManager() {} CheckoutManager.sameAsBilling = <inp2:m_if check="ord_AddressesTheSame">true<inp2:m_else/>false</inp2:m_if>; CheckoutManager.addressFields = ['To', 'Company', 'Address1', 'Address2', 'City', 'Country', 'State', 'Zip']; CheckoutManager.initAddressFields = function () { var $me = this; $(this.addressFields).each( function () { var $field = this.toString(); $( FormManager.getField('ord', 'Billing' + $field) ).change( function ($e) { if ( $me.sameAsBilling ) { $( FormManager.getField('ord', 'Shipping' + $field) ).val( $(this).val() ).change(); } } ); $( FormManager.getField('ord', 'Shipping' + $field) ).change( function ($e) { if ( !$me.isAddressValid('Shipping') ) { $('select', '#shipping-type-container').empty().append('<option value="">Please enter address</option>'); return ; } $me.updateOrder( 'elements/ajax/shipping_type', function ($data) { $('#shipping-type-container').html($data); } ); } ); } ); } CheckoutManager.isAddressValid = function ($type) { var $status = true; $(this.addressFields).each( function () { var $field = this.toString(), $input = $( FormManager.getField('ord', $type + $field) ); if ( $field == 'Address2' || ($input.is('select') && $('option', $input).length <= 2 ) ) { // 2nd address line or empty state dropdown return true; } if ( $input.val() == '' ) { $status = false; return false; } } ); return $status; } CheckoutManager.updateOrder = function ($return_template, $callback, $remove_fields) { var $me = this, $params = $('#checkout-form').serializeArray(); if ( $remove_fields === undefined ) { $remove_fields = ['check_billing_address', 'check_shipping_address', 'check_credit_card']; } for (var $i in $params) { if ( in_array($params[$i].name, $remove_fields) ) { delete $params[$i]; } } $.post( FormManager.getURL('ord', $return_template, 'OnUpdate'), $params, function ($data) { var $redirect = TB.parseRedirect($data); if ( $redirect !== false ) { window.location.href = $redirect; return ; } $callback.apply($me, [$data]); } ) } CheckoutManager.copyAddress = function () { $(this.addressFields).each( function () { var $field = this.toString(); $( FormManager.getField('ord', 'Shipping' + $field) ).val( $( FormManager.getField('ord', 'Billing' + $field) ).val() ); } ); $( FormManager.getField('ord', 'ShippingAddress1') ).change(); } CheckoutManager.init = function () { var $me = this; this.sameAsBilling = $('#same_as_billing').is(':checked'); $('#same_as_billing').click( function ($e) { $me.sameAsBilling = $(this).is(':checked'); if ($me.sameAsBilling) { $me.copyAddress(); } $('#shipping-address').toggle(!$me.sameAsBilling); $('#shipping-address-placeholder').toggle($me.sameAsBilling); } ); $('#create_account').click( function ($e) { $('.password-block').toggle( $(this).is(':checked') ); } ); $('#login-alt').click( function ($e) { var $login_link = $('#login'); if ( !$login_link.parents('.login:first').hasClass('plashka-sel') ) { $login_link.click(); } return false; } ); $('body').bind( 'OnAfterLogin', function ($e, $params) { // 1. remove login button $('.login-alt').remove(); // 2. remove user password controls $('.badge-optional').remove(); $('#create-account-password').fadeOut('slow').remove(); $('.firstline').fadeIn('slow'); FormManager.unregisterField('ord', 'UserPassword'); FormManager.unregisterField('ord', 'VerifyUserPassword'); // 3. put user e-mail into the form FormManager.setFieldStatus('ord', 'BillingEmail'); FormManager.getField('ord', 'BillingEmail').value = $params['user_email']; } ) this.initAddressFields(); } $(document).ready( function () { FormManager.registerForm( { prefix: 'ord', save_event: 'OnUpdateAjax', id: '<inp2:ord_Field name="OrderId"/>', form_id: 'checkout-form', before_close: function ($data, $add_params) { // when all form data is valid CheckoutManager.updateOrder( 'elements/ajax/payment_form', function ($data) { $('#payment-form').replaceWith($data); $('#payment-form').submit(); } ); } } ); $('.place-button').click( function ($e) { FormManager.submitForm('ord'); return false; } ); CheckoutManager.init(); } ); $('.password-block').toggle( $('#create_account').is(':checked') ); </script> </inp2:m_DefineElement> <!--## /MAIN CONTENT ##--> <!--## DESIGN TEMPLATE ##--> <inp2:m_Set check_credit_card="true"/> <inp2:m_include template="designs/default_design.des" pass_params="1"/> <!--## /DESIGN TEMPLATE ##--> \ No newline at end of file Index: branches/1.0.x/elements/ajax/order_details.tpl =================================================================== --- branches/1.0.x/elements/ajax/order_details.tpl (nonexistent) +++ branches/1.0.x/elements/ajax/order_details.tpl (revision 14830) @@ -0,0 +1,38 @@ +<inp2:m_Include template="elements/content_boxes.elm" strip_nl="2"/> + +<inp2:m_DefineElement name="orderitem_elem"> + <tr> + <td class="item-img"> + <inp2:p_Image render_as="image_element" Primary="1" MaxWidth="58" DefaultWidth="58" DefaultImage="img/no_picture.gif"/> + </td> + <td class="item-title"> + <inp2:Field name="ProductName"/><inp2:m_if check="ord_BackorderFlag"> <span><inp2:m_phrase label="lu_cart_BackorderFlag" /></span></inp2:m_if> + + <inp2:m_if check="HasDiscount"> + <br /> + <inp2:m_Phrase label="lu_comm_RegularPrice" />: <inp2:Field name="FlatPrice" currency="selected"/><br /> + <inp2:m_Phrase label="lu_comm_Discount" />: <span><inp2:Field name="ItemDiscount" currency="selected" negative="1"/></span> + </inp2:m_if> + </td> + <td><inp2:Field name="Quantity"/></td> + <td><inp2:Field name="Price" currency="selected"/></td> + <td><inp2:Field name="ExtendedPrice" currency="selected"/></td> + </tr> +</inp2:m_DefineElement> + +<div class="cart-detail receipt" style="width: 90%;"> + <table class="items"> + <thead> + <tr> + <th colspan="2" style="text-align: left;">Items in your order (<inp2:ord_ItemsInCart/>)</th> + <th>Qty.</th> + <th>Price</th> + <th>Total</th> + </tr> + </thead> + + <tbody> + <inp2:ord_ListOrderItems render_as="orderitem_elem"/> + </tbody> + </table> +</div> \ No newline at end of file