Page MenuHomeIn-Portal Phabricator

modern-store
No OneTemporary

File Metadata

Created
Mon, Jun 16, 5:58 AM

modern-store

Index: branches/1.0.x/checkout/cart.tpl
===================================================================
--- branches/1.0.x/checkout/cart.tpl (revision 14797)
+++ branches/1.0.x/checkout/cart.tpl (revision 14798)
@@ -1,182 +1,294 @@
<!--##
<NAME>Shopping Cart</NAME>
<DESC></DESC>
<SECTION>Pages||Checkout</SECTION>
##-->
<inp2:m_DefineElement name="page_title">Shopping Cart</inp2:m_DefineElement>
+<inp2:m_DefineElement name="add_to_head">
+ <script src="<inp2:m_TemplatesBase />inc/js/cart_manager.js" type="text/javascript"></script>
+</inp2:m_DefineElement>
+
<!--## MAIN CONTENT ##-->
<inp2:m_DefineElement name="content">
<ul class="steps">
<li class="step1 active"><a href="<inp2:m_Link pass='m,all'/>"><i></i>Shopping Cart</a></li>
<li class="step2"><span><i></i>One-step Checkout</span></li>
<li class="step3"><span><i></i>Receipt</span></li>
</ul>
<div class="clear"></div>
- <div class="cart-detail receipt shoppingcart">
- <h1>Shopping Cart</h1>
- <div class="buttons-right">
- <a href="#" class="continue-button"><span>Continue Shopping</span></a>
- <a href="#" class="checkout-button"><span>Checkout</span></a>
- </div>
- <div class="clear"></div>
+ <form method="post" id="shopping-cart-form" action="<inp2:m_FormAction />">
+ <div class="cart-detail receipt shoppingcart">
+ <!--<div style="border: 1px dashed blue; padding: 3px; margin-bottom: 5px; font-size: 14px; font-family: 'Courier New', monospace;">
+ <inp2:ord_CheckoutErrorNew/>
+ </div>-->
+
+ <inp2:m_DefineElement name="cart_header_element">
+ <h1>Shopping Cart</h1>
+
+ <div class="buttons-right">
+ <a href="<inp2:ord_ContinueShoppingLink template='__default__'/>" class="continue-button"><span>Continue Shopping</span></a>
+ <a href="<inp2:m_Link template='checkout'/>" class="checkout-button"><span>Checkout</span></a>
+ </div>
+ <div class="clear"></div>
- <table class="items">
- <thead>
- <tr>
- <th colspan="2" style="text-align: left;">Items in your order (4)</th>
- <th>Qty.</th>
- <th>Price</th>
- <th>Total</th>
- <th></th>
- </tr>
- </thead>
- <tbody>
- <tr>
- <td class="item-img" rowspan="2"><img src="<inp2:m_TemplatesBase/>img/samples/good5.jpg" width="58" height="58" alt="" /></td>
- <td class="item-title"><a href="">Nikon D5000 Kit 15-18 Digital Camera</a></td>
- <td>
- <div class="item-quantity">
- <input type="text" id="item-1" name="item-1" value="1" class="field statusSuccess" />
- <div class="formStatus formSuccess">
- <div class="formContent">
- Quantity Updated
- </div>
- <div class="formArrow"></div>
- </div>
- </div>
+ <table class="items">
+ <thead>
+ <tr>
+ <th colspan="2" style="text-align: left;">Items in your order (<span id="item-count"><inp2:orditems_TotalRecords/></span>)</th>
+ <th>Qty.</th>
+ <th>Price</th>
+ <th>Total</th>
+ <th></th>
+ </tr>
+ </thead>
+ <tbody id="shop-cart-table">
+ </inp2:m_DefineElement>
+
+ <inp2:m_DefineElement name="cart_item_element">
+ <tr class="shop-cart-row" row_index="<inp2:RowIndex/>" order_item_id="<inp2:Field name='OrderItemId'/>">
+ <td class="item-img"<inp2:m_if check="HasOptions"> rowspan="2"</inp2:m_if>>
+ <inp2:p_Image render_as="image_element" Primary="1" MaxWidth="58" DefaultWidth="58" DefaultImage="img/no_picture.gif"/>
</td>
- <td>$75.00</td>
- <td class="item-total">$75.00</td>
- <td><a href=""><img src="<inp2:m_TemplatesBase/>img/icon-delete.png" width="13" height="13" alt="" /></a></td>
- </tr>
- <tr>
- <td class="options-td" colspan="5">
- <div class="sel-options">
- <label><strong>Select Size:</strong>
- <select name="select">
- <option value="" selected="selected">22"</option>
- <option value="">23"</option>
- </select>
- </label>
- </div>
- <div class="sel-options">
- <label><strong>Select Color:</strong>
- <select name="select">
- <option value="" selected="selected">Gray Metallic</option>
- <option value="">White Metallic</option>
- <option value="">Black Metallic</option>
- </select>
- </label>
+ <td class="item-title">
+ <div style="font-size: 14px; font-family: 'Courier New', monospace;">
+ [ProductId: <strong><inp2:Field name="ProductId"/></strong>; OptionsSalt: <strong><inp2:Field name="OptionsSalt"/></strong>; BackOrderFlag: <strong><inp2:Field name="BackOrderFlag"/></strong>]
</div>
- </td>
- </tr>
- <tr>
- <td class="item-img"><img src="<inp2:m_TemplatesBase/>img/samples/good5.jpg" width="58" height="58" alt="" /></td>
- <td class="item-title"><a href="">Nikon D5000 Kit 15-18 Digital Camera</a></td>
- <td>
- <div class="item-quantity">
- <input type="text" id="item-2" name="item-2" value="f" class="field statusError" />
- <div class="formStatus formError">
- <div class="formContent">
- Invalid Quantity
- </div>
- <div class="formArrow"></div>
- </div>
+
+ <inp2:m_if check="Field" field="Virtual" equals_to="0" db="db">
+ <a href="<inp2:ProductLink template='__default__'/>"><inp2:Field name="Name" /></a>
+ <inp2:m_if check="FreePromoShippingAvailable">
+ &nbsp;<sup><inp2:m_phrase label="lu_cart_FreeShippingAvailable" /></sup>
+ </inp2:m_if>
+ <inp2:m_else/>
+ <inp2:Field name="Name" />
+ </inp2:m_if>
+
+ <inp2:m_if check="ord_BackorderFlag">
+ <span class="error"><inp2:m_phrase label="lu_cart_BackorderFlag" /></span>
+ </inp2:m_if>
+
+ <inp2:m_if check="p_Field" name="cust_Availability" db="db">
+ <br />
+ <inp2:p_CustomField name="Availability"/>
+ </inp2:m_if>
+
+ <div class="product-discount"<inp2:m_ifnot check="HasDiscount"> style="display: none;"</inp2:m_ifnot>>
+ <inp2:m_Phrase label="lu_comm_RegularPrice" />: <span class="item-price"><inp2:Field name="FlatPrice" currency="selected"/></span><br />
+ <inp2:m_Phrase label="lu_comm_Discount" />: <span class="item-discount"><inp2:Field name="ItemDiscount" currency="selected" negative="1" /></span>
</div>
</td>
- <td>$75.00</td>
- <td class="item-total">$75.00</td>
- <td><a href=""><img src="<inp2:m_TemplatesBase/>img/icon-delete.png" width="13" height="13" alt="" /></a></td>
- </tr>
- <tr>
- <td class="item-img"><img src="<inp2:m_TemplatesBase/>img/samples/good5.jpg" width="58" height="58" alt="" /></td>
- <td class="item-title"><a href="">Nikon D5000 Kit 15-18 Digital Camera</a></td>
<td>
<div class="item-quantity">
- <input type="text" id="item-1" name="item-1" value="1" class="field" />
+ <inp2:m_if check="IsTangible">
+ <input value="<inp2:Field field='Quantity'/>" class="field product-qty" name="<inp2:InputName field='Quantity'/>" id="<inp2:InputName field='Quantity'/>" />
+ <inp2:m_else />
+ <span class="product-qty read-only"><inp2:Field field="Quantity"/></span>
+ </inp2:m_if>
</div>
</td>
- <td>$75.00</td>
- <td class="item-total">$75.00</td>
- <td><a href=""><img src="<inp2:m_TemplatesBase/>img/icon-delete.png" width="13" height="13" alt="" /></a></td>
- </tr>
- <tr>
- <td class="item-img"><img src="<inp2:m_TemplatesBase/>img/samples/good5.jpg" width="58" height="58" alt="" /></td>
- <td class="item-title"><a href="">Nikon D5000 Kit 15-18 Digital Camera</a></td>
+
+ <td class="price-cell">
+ <inp2:Field name="Price" currency="selected" decimal_tag="span"/>
+ </td>
+
+ <td class="item-total extended-price-cell">
+ <inp2:Field name="ExtendedPrice" currency="selected" decimal_tag="span"/>
+ </td>
+
<td>
- <div class="item-quantity">
- <input type="text" id="item-1" name="item-1" value="1" class="field" />
- </div>
+ <a href="<inp2:LinkRemoveFromCart/>" class="delete-cart-link"><img src="<inp2:m_TemplatesBase/>img/icon-delete.png" width="13" height="13" alt="Delete" /></a>
</td>
- <td>$75.00</td>
- <td class="item-total">$75.00</td>
- <td><a href=""><img src="<inp2:m_TemplatesBase/>img/icon-delete.png" width="13" height="13" alt="" /></a></td>
</tr>
- </tbody>
- </table>
- <div class="discount-block">
- <form method="post" action="#" class="form">
- <p><strong>Discounts & Promotional Offers</strong></p>
- <p>If you have a discount or promotional offer code please enter it and click Apply button.</p>
- <div class="num-discount">
- <input type="text" id="discount" name="discount" value="AZ5467338779" class="field statusSuccess" /> <input type="submit" value="Apply" id="submit" class="grey-button" />
- <div class="formStatus formSuccess">
- <div class="formContent">
- Promotion Code Applied
+ <inp2:m_if check="HasOptions">
+ <tr>
+ <td class="options-td" colspan="5">
+ <div class="sel-options">
+ <label><strong>Select Size:</strong>
+ <select name="select">
+ <option value="" selected="selected">22"</option>
+ <option value="">23"</option>
+ </select>
+ </label>
+ </div>
+ <div class="sel-options">
+ <label><strong>Select Color:</strong>
+ <select name="select">
+ <option value="" selected="selected">Gray Metallic</option>
+ <option value="">White Metallic</option>
+ <option value="">Black Metallic</option>
+ </select>
+ </label>
+ </div>
+ </td>
+ </tr>
+ </inp2:m_if>
+ </inp2:m_DefineElement>
+
+ <inp2:m_DefineElement name="cart_footer_element">
+ </tbody>
+ </table>
+
+ <div class="discount-block">
+ <p><strong>Discounts & Promotional Offers</strong></p>
+
+ <div id="coupon-row">
+ <div class="used"<inp2:m_ifnot check="ord_Field" name="CouponId" db="db"> style="display: none;"</inp2:m_ifnot>>
+ <inp2:m_Phrase label="lu_comm_CouponHasBeenApplied" />:&nbsp;
+
+ <div class="num-discount">
+ <span class="coupon-name"><inp2:ord_Field field="CouponName" /></span>&nbsp;&nbsp;
+ <a id="remove-coupon" href="<inp2:ord_RemoveCouponLink type='coupon'/>"><img src="<inp2:m_TemplatesBase/>img/icon-delete.png" title="<inp2:m_Phrase label='lu_comm_RemoveCoupon' no_editing='1'/>" alt="<inp2:m_Phrase label='lu_comm_RemoveCoupon' no_editing='1'/>" width="13" height="13" border="0" /></a>
+ </div>
+ </div>
+
+ <div class="not-used"<inp2:m_if check="ord_Field" name="CouponId" db="db"> style="display: none;"</inp2:m_if>>
+ <p>If you have a discount or promotional offer code please enter it and click Apply button.</p>
+ <div class="num-discount">
+ <input class="field coupon-code" name="coupon_code" value=""/>
+ <input type="button" class="grey-button" id="apply-coupon" value="Apply"/>
+ </div>
+ </div>
+ </div>
+
+ <div id="gift-certificate-row">
+ <div class="used"<inp2:m_ifnot check="ord_Field" name="GiftCertificateId" db="db"> style="display: none;"</inp2:m_ifnot>>
+ <inp2:m_Phrase label="lu_comm_GiftCertificateHasBeenApplied" />:&nbsp;
+
+ <div class="num-discount">
+ <span class="gift-certificate-discount"><inp2:ord_Field field="GiftCertificateDiscount" currency="selected" /></span>&nbsp;&nbsp;
+ <a id="remove-gift-certificate" href="<inp2:ord_RemoveCouponLink type='gift_certificate'/>"><img src="<inp2:m_TemplatesBase/>img/icon-delete.png" title="<inp2:m_Phrase label="lu_comm_RemoveGiftCertificate" no_editing="1"/>" alt="<inp2:m_Phrase label="lu_comm_RemoveGiftCertificate" no_editing="1"/>" width="13" height="13" border="0" /></a>
+ </div>
+ </div>
+
+ <div class="not-used"<inp2:m_if check="ord_Field" name="GiftCertificateId" db="db"> style="display: none;"</inp2:m_if>>
+ <p>If you have a gift certificate code please enter it and click Apply button.</p>
+ <div class="num-discount">
+ <input class="field gift-certificate-code" name="giftcert_code" />
+ <input type="button" class="grey-button" id="apply-gift-certificate" value="Apply"/>
+ </div>
</div>
- <div class="formArrow"></div>
</div>
</div>
- </form>
- </div>
- <div class="buttons-right">
- <dl class="total">
- <dt class="discount">Discount:</dt>
- <dd class="price2">- $10<span>.00</span></dd>
- <dt>Total</dt>
- <dd class="price1">$1,959<span>.99</span></dd>
- </dl>
- <p>(before shipping & taxes)</p>
- <a href="#" class="checkout-grey-button"><span>Checkout</span></a>
+ <div class="buttons-right">
+ <dl class="total">
+ <div id="discount-row"<inp2:m_ifnot check="ord_HasDiscount"> style="display: none;"</inp2:m_ifnot>>
+ <dt class="discount">Discount:</dt>
+ <dd class="price2">- <inp2:ord_Field name="DiscountTotal" currency="selected" decimal_tag="span"/></dd>
+ </div>
+
+ <div>
+ <dt>Total</dt>
+ <dd class="price1" id="sub-total"><inp2:ord_Field field="SubTotal" currency="selected" decimal_tag="span"/></dd>
+ </div>
+ </dl>
+ <p>(before shipping & taxes)</p>
+ <a href="<inp2:m_Link template='checkout'/>" class="checkout-grey-button"><span>Checkout</span></a>
+ </div>
+ <div class="clear"></div>
+
+ <script type="text/javascript">
+ var $aShopCartManager = new ShopCartManager(
+ {
+ updateUrl: '<inp2:m_Link ord_event="OnUpdateCartJSON" currency="selected" pass="m,ord" js_escape="1" no_amp="1"/>',
+ constants: {
+ 'OrderCheckoutErrorType::PRODUCT': <inp2:m_GetConst name="OrderCheckoutErrorType::PRODUCT"/>,
+ 'OrderCheckoutError::FIELD_UPDATE_SUCCESS': <inp2:m_GetConst name="OrderCheckoutError::FIELD_UPDATE_SUCCESS"/>,
+ 'OrderCheckoutError::FIELD_UPDATE_ERROR': <inp2:m_GetConst name="OrderCheckoutError::FIELD_UPDATE_ERROR"/>,
+ 'OrderCheckoutError::QTY_UNAVAILABLE': <inp2:m_GetConst name="OrderCheckoutError::QTY_UNAVAILABLE"/>,
+ 'OrderCheckoutError::QTY_OUT_OF_STOCK': <inp2:m_GetConst name="OrderCheckoutError::QTY_OUT_OF_STOCK"/>,
+ 'OrderCheckoutError::QTY_CHANGED_TO_MINIMAL': <inp2:m_GetConst name="OrderCheckoutError::QTY_CHANGED_TO_MINIMAL"/>,
+
+ 'OrderCheckoutErrorType::COUPON': <inp2:m_GetConst name="OrderCheckoutErrorType::COUPON"/>,
+ 'OrderCheckoutError::COUPON_APPLIED': <inp2:m_GetConst name="OrderCheckoutError::COUPON_APPLIED"/>,
+ 'OrderCheckoutError::COUPON_REMOVED': <inp2:m_GetConst name="OrderCheckoutError::COUPON_REMOVED"/>,
+ 'OrderCheckoutError::COUPON_REMOVED_AUTOMATICALLY': <inp2:m_GetConst name="OrderCheckoutError::COUPON_REMOVED_AUTOMATICALLY"/>,
+ 'OrderCheckoutError::COUPON_CODE_INVALID': <inp2:m_GetConst name="OrderCheckoutError::COUPON_CODE_INVALID"/>,
+ 'OrderCheckoutError::COUPON_CODE_EXPIRED': <inp2:m_GetConst name="OrderCheckoutError::COUPON_CODE_EXPIRED"/>,
+
+
+ 'OrderCheckoutErrorType::GIFT_CERTIFICATE': <inp2:m_GetConst name="OrderCheckoutErrorType::GIFT_CERTIFICATE"/>,
+ 'OrderCheckoutError::GC_APPLIED': <inp2:m_GetConst name="OrderCheckoutError::GC_APPLIED"/>,
+ 'OrderCheckoutError::GC_REMOVED': <inp2:m_GetConst name="OrderCheckoutError::GC_REMOVED"/>,
+ 'OrderCheckoutError::GC_REMOVED_AUTOMATICALLY': <inp2:m_GetConst name="OrderCheckoutError::GC_REMOVED_AUTOMATICALLY"/>,
+ 'OrderCheckoutError::GC_CODE_INVALID': <inp2:m_GetConst name="OrderCheckoutError::GC_CODE_INVALID"/>,
+ 'OrderCheckoutError::GC_CODE_EXPIRED': <inp2:m_GetConst name="OrderCheckoutError::GC_CODE_EXPIRED"/>,
+
+ 'OrderCheckoutErrorType::DISCOUNT': <inp2:m_GetConst name="OrderCheckoutErrorType::DISCOUNT"/>,
+ 'OrderCheckoutError::DISCOUNT_APPLIED': <inp2:m_GetConst name="OrderCheckoutError::DISCOUNT_APPLIED"/>,
+ 'OrderCheckoutError::DISCOUNT_REMOVED': <inp2:m_GetConst name="OrderCheckoutError::DISCOUNT_REMOVED"/>,
+
+ 'PRODUCT_TYPE_TANGIBLE': <inp2:m_GetConst name="PRODUCT_TYPE_TANGIBLE"/>
+ },
+// debugMode: true,
+ currencyMask: '<inp2:ord_CurrencyMask currency="selected" js_escape="1"/>',
+ orderInfo: <inp2:ord_PrintOrderInfo currency="selected"/>
+ }
+ );
+ </script>
+ </inp2:m_DefineElement>
+
+ <inp2:m_DefineElement name="cart_empty_element">
+ <h1>Shopping Cart</h1>
+ <div class="clear"></div>
+
+ <strong><inp2:m_Phrase label="lu_comm_YourCartIsEmpty"/></strong>
+ </inp2:m_DefineElement>
+
+ <inp2:ord_PrintCart item_render_as="cart_item_element" header_render_as="cart_header_element" footer_render_as="cart_footer_element" empty_cart_render_as="cart_empty_element" per_page="-1"/>
</div>
- <div class="clear"></div>
-
- </div>
+ </form>
-</inp2:m_DefineElement>
-<!--## /MAIN CONTENT ##-->
+ <textarea id="product-row-mask" style="display: none;">
+ <tr class="shop-cart-row" row_index="{ROW_INDEX}" order_item_id="{field:OrderItemId}">
+ <td class="item-img">
+ <img src="{field:PrimaryImage}" alt=""/>
+ </td>
+ <td class="item-title">
+ <span class="product-with-link" style="display: none;">
+ <a href="#"></a>
+ </span>
+
+ <span class="product-without-link" style="display: none;"></span>
+
+ <span class="free-shipping">
+ &nbsp;<sup><inp2:m_phrase label="lu_cart_FreeShippingAvailable" /></sup>
+ </span>
+
+ <span class="back-order-mark error"><inp2:m_phrase label="lu_cart_BackorderFlag" /></span>
+
+ <span class="product-availability" style="display: none;"></span>
+
+ <div class="product-discount" style="display: none;">
+ <inp2:m_Phrase label="lu_comm_RegularPrice" />: <span class="item-price"></span><br />
+ <inp2:m_Phrase label="lu_comm_Discount" />: <span class="item-discount"></span>
+ </div>
+ </td>
+ <td>
+ <div class="item-quantity">
+ <input value="{field:Quantity}" style="width:20px" class="field product-qty" name="<inp2:orditems_InputName field='Quantity' force_id="{field:OrderItemId}"/>" id="<inp2:orditems_InputName field='Quantity' force_id="{field:OrderItemId}"/>" />
+ <span class="product-qty read-only">{field:Quantity}</span>
+ </div>
+ </td>
-<inp2:m_DefineElement name="add_to_head">
- <script src="<inp2:m_TemplatesBase />inc/js/jquery.gzoom.js"></script>
- <script src="<inp2:m_TemplatesBase />inc/js/jquery.pikachoose.full.js"></script>
- <script type= "text/javascript">
- /*<![CDATA[*/
- $(function() {
- $("#tabs").tabs();
-
- $("#pikame").PikaChoose({autoPlay:false, showCaption:false});
- });
- window.onload= function () {
- $("#zoom").gzoom({
- sW: 258,
- sH: 258,
- lW: 1400,
- lH: 1050,
- lighbox : false
- });
- };
- /*]]>*/
- </script>
+ <td class="price-cell"></td>
+
+ <td class="item-total extended-price-cell"></td>
+ <td>
+ <a href="#" class="delete-cart-link"><img src="<inp2:m_TemplatesBase/>img/icon-delete.png" width="13" height="13" alt="Delete" /></a>
+ </td>
+ </tr>
+ </textarea>
</inp2:m_DefineElement>
+<!--## /MAIN CONTENT ##-->
<!--## DESIGN TEMPLATE ##-->
<inp2:m_include template="designs/default_design.des" pass_params="1"/>
<!--## /DESIGN TEMPLATE ##-->
\ No newline at end of file
Index: branches/1.0.x/inc/cart.css
===================================================================
--- branches/1.0.x/inc/cart.css (revision 14797)
+++ branches/1.0.x/inc/cart.css (revision 14798)
@@ -1,448 +1,453 @@
@charset "UTF-8";
/* Cart Blocks
*******************************************************************************/
.steps {
margin: 0 auto;
width: 535px;
}
.steps li {
background: url(@templates_base@/img/icon-step.png) no-repeat 100% 40%;
color: #bdbdbd;
float: left;
font-size: 9pt;
font-weight: bold;
padding: 0 85px 0 38px;
text-transform: uppercase;
}
.steps li:first-child {
padding-left: 0;
}
.steps li:last-child {
background: none;
padding-right: 0;
}
.steps li i {
display: block;
height: 36px;
margin: 0 auto 5px;
width: 40px;
}
.steps li.step1 i { background: url(@templates_base@/img/cart-steps.png) no-repeat 0 0; }
.steps li.step2 i { background: url(@templates_base@/img/cart-steps.png) no-repeat 0 -36px; }
.steps li.step3 i { background: url(@templates_base@/img/cart-steps.png) no-repeat 0 -72px; }
.steps li a {
color: #bdbdbd;
text-decoration: none;
}
.steps li.step1.active i { background: url(@templates_base@/img/cart-steps.png) no-repeat -40px 0; }
.steps li.step2.active i { background: url(@templates_base@/img/cart-steps.png) no-repeat -40px -36px; }
.steps li.step3.active i { background: url(@templates_base@/img/cart-steps.png) no-repeat -40px -72px; }
.steps li.active a { color: #878787; }
.cart-detail {
background-color: #fff;
border: 1px solid #d0d0d0;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
margin-top: 10px;
padding: 15px 30px 50px 30px;
width: 100%;
}
.cart-detail h1 {
color: #525252;
font: 1.538em Verdana,Arial,Tahoma,Sans-Serif;
padding: 0 0 20px 0;
}
.cart-detail .halfcol {
border-right: 1px dotted #aeaeae;
float: left;
margin: 0 14px 0 0;
padding: 0 14px 0 0;
width: 465px;
}
.cart-detail .halfcol-last {
border-right: none;
margin: 0;
padding: 0;
position: relative;
}
.cart-detail .halfcol-last .badge-optional {
background: url(@templates_base@/img/badge-optional.png) no-repeat 0 0;
height: 40px;
position: absolute;
top: -44px; left: -20px;
width: 102px;
}
.cart-detail .fieldset {
background: url(@templates_base@/img/bg-form-fieldset.jpg) repeat-x 0 0;
color: #000;
font-weight: bold;
height: 26px;
line-height: 26px;
padding: 0 0 10px 50px;
position: relative;
}
.cart-detail.receipt .fieldset { padding-left: 16px; }
.cart-detail .fieldset .link {
font-weight: normal;
position: absolute;
right: 15px;
}
fieldset { padding: 0 0 15px; }
.firstline { min-height: 140px; padding: 20px 0 0; position: relative; }
.firstline .login-alt {
color: #66c133;
font-size: 1.154em;
font-weight: bold;
padding: 5px 0 20px 50px;
}
.firstline .login-alt .plashka {
right: 194px;
}
.firstline .login-alt .plashka-sel {
margin: -6px 0 0 5px;
}
.checkout-form label {
display: block;
font-weight: bold;
padding-bottom: 3px;
}
.checkout-form p {
clear: both !important;
float: left;
padding: 5px 0 5px 50px;
}
.checkout-form p.alt1 {
clear: none !important;
padding: 5px 10px 5px 50px;
width: 170px;
}
.checkout-form p.alt2 {
clear: none !important;
padding: 5px 0;
width: 120px;
}
.checkout-form .field { width: 300px; }
.checkout-form select.field { width: 311px; }
.field.statusSuccess {
background: url(@templates_base@/img/bg-field-success.jpg) repeat-x 0 0;
border: 1px solid #80d04d;
}
.field.statusError {
background: url(@templates_base@/img/bg-field-error.jpg) repeat-x 0 0;
border: 1px solid #d80000;
}
.checkout-form p.alt1 .field,
.checkout-form p.alt2 .field,
.checkout-form p.pasfield1 .field,
.checkout-form p.pasfield2 .field {
width: 100%;
}
.checkout-form .creditcard .field { width: 250px; }
.checkout-form .creditcard p.alt1.expdate .field { width: 78px; }
.checkout-form .creditcard p.alt2 .field { width: 70px; }
.creditcards { padding: 0 0 0 50px; }
.creditcards span {
display: inline-block;
height: 45px;
}
.creditcards span:first-child {
border-right: 1px solid #d3d3d3;
margin-right: 10px;
padding-right: 15px;
}
.password-block {
border: 1px solid #e3e3e3;
float: right;
padding: 12px 20px;
width: 390px;
}
.password-block p {
clear: none !important;
padding: 0 30px 0 0;
}
.password-block p.pasfield1 {
width: 150px;
}
.colorbar {
display: inline-block;
height: 8px;
width: 29px;
}
.password-strength { display: none; font-weight: bold; }
.password-strength .meterDefault { color: #aaa; }
.password-strength .meterFail { color: #daa; }
.password-strength .meterWarn { color: #fd6; }
.password-strength .meterGood { color: #ada; }
.password-strength .meterExcel { color: #66c133; }
.password-strength .colorbar.meterDefault { background-color: #ddd; }
.password-strength .colorbar.meterFail { background-color: #fdd; }
.password-strength .colorbar.meterWarn { background-color: #feb; }
.password-strength .colorbar.meterGood { background-color: #dfd; }
.password-strength .colorbar.meterExcel { background-color: #66c133; }
.checkout-form .safe-shop {
background: url(@templates_base@/img/safe-shop.jpg) no-repeat 0 40px;
min-height: 160px;
margin: 115px 0 115px 50px;
}
.checkout-form .safe-shop .title {
color: #389901;
font: bold 1.462em Verdana,Arial,Tahoma,Sans-Serif;
padding-left: 18px;
}
.checkout-form .safe-shop ul.list {
float: left;
padding: 10px 0 0 130px;
}
.checkout-form .safe-shop ul.list li {
background: url(@templates_base@/img/icon-galka.png) no-repeat 0 50%;
color: #313030;
font-weight: bold;
padding: 6px 0 6px 25px;
}
dl.total { padding: 20px 0 0; width: 240px; }
dl.total dt,
dl.total dd {
float: left;
font-weight: bold;
padding: 0 0 10px;
text-align: right;
width: 120px;
}
dl.total dt.discount { color: #bf0000; }
dl.total dd { font-size: 1.385em; }
dl.total dd span { font-size: 15px; }
dl.total dd.price1 { color: #333; font-size: 1.538em; }
dl.total dd.price2 { color: #bf0000; }
dl.total dd.price3 { font-weight: normal; }
dl.total dd.price4 { color: #3f911f; font-size: 1.538em; }
+.product-discount .item-price span, .product-discount .item-discount span,
+.shop-cart-row .price-cell span, .shop-cart-row .extended-price-cell span {
+ font-size: 12px;
+}
+
.cart-detail .terms {
text-align: right;
width: 240px;
}
.place-button,
.place-grey-button,
.checkout-button,
.checkout-grey-button {
background: url(@templates_base@/img/order-left.jpg) no-repeat 0 0;
color: #faffed;
display: inline-block;
font-size: 1.385em;
font-weight: bold;
text-shadow: #000 0px 1px 1px;
text-decoration: none;
}
.place-button span,
.place-grey-button span,
.checkout-button span,
.checkout-grey-button span {
background: url(@templates_base@/img/order-right.jpg) no-repeat 100% 0;
display: inline-block;
height: 37px;
line-height: 37px;
padding: 0 50px 0 30px;
}
.place-button:hover,
.place-grey-button:hover,
.checkout-button:hover,
.checkout-grey-button:hover { color: #faffed; }
.checkout-button span {
background: url(@templates_base@/img/checkout-right.jpg) no-repeat 100% 0;
padding: 0 30px 0 20px;
}
.place-grey-button {
background: url(@templates_base@/img/checkout-grey-left.jpg) no-repeat 0 0;
}
.place-grey-button span {
background: url(@templates_base@/img/order-grey-right.jpg) no-repeat 100% 0;
}
.checkout-grey-button {
background: url(@templates_base@/img/checkout-grey-left.jpg) no-repeat 0 0;
margin-top: 20px;
}
.checkout-grey-button span {
background: url(@templates_base@/img/checkout-grey-right.jpg) no-repeat 100% 0;
padding: 0 30px 0 20px;
}
.continue-button {
background: url(@templates_base@/img/bg-button-continue-right.jpg) no-repeat 100% 0;
color: #3c3c3c;
display: inline-block;
font-weight: bold;
margin-right: 20px;
text-decoration: none;
}
.continue-button span {
background: url(@templates_base@/img/bg-button-continue-left.jpg) no-repeat 0 0;
display: inline-block;
height: 26px;
line-height: 26px;
padding: 0 20px 0 25px;
}
.continue-button:hover {
color: #3c3c3c;
}
.cart-detail.receipt .success-order {
background: url(@templates_base@/img/success.png) no-repeat 30px 30px;
border-bottom: 1px solid #d0d0d0;
margin-bottom: 25px;
padding: 0 0 25px 130px;
}
.cart-detail.receipt .success-order .links {
float: right;
padding: 0;
}
.cart-detail.receipt .success-order .links a.link-print {
background: url(@templates_base@/img/icon-print.jpg) no-repeat 0 0;
display: inline-block;
font-weight: bold;
height: 32px;
line-height: 32px;
padding: 0 20px 0 40px;
}
.cart-detail.receipt .success-order .links a.link-download {
background: url(@templates_base@/img/icon-download.jpg) no-repeat 0 0;
display: inline-block;
font-weight: bold;
height: 32px;
line-height: 32px;
padding: 0 0 0 40px;
}
.cart-detail.receipt .success-order .green {
color: #009f00;
font: 1.538em Tahoma,Verdana,Arial,Sans-Serif;
}
.cart-detail.receipt .success-order p {
padding: 5px 0;
}
.cart-detail.receipt p { padding-left: 16px; }
.cart-detail.receipt dl.info {
padding-left: 16px;
}
.cart-detail.receipt dl.info dt {
clear: both !important;
float: left;
font-weight: bold;
padding: 5px 15px 5px 0;
width: 90px;
}
.cart-detail.receipt dl.info dd {
float: left;
padding: 5px 15px 5px 0;
}
.cart-detail.receipt .items {
border-bottom: 1px solid #d1d1d1;
margin-top: 30px;
width: 100%;
}
.cart-detail.shoppingcart .items {
margin-top: 0;
}
.cart-detail.receipt .items thead {
background: url(@templates_base@/img/bg-form-fieldset.jpg) repeat-x 0 0;
border: 1px solid #adadad;
}
.cart-detail.receipt .items th {
color: #000;
font-weight: bold;
padding: 5px 10px;
}
.cart-detail.receipt .items td {
border-top: 1px solid #d1d1d1;
color: #000;
padding: 10px;
text-align: center;
vertical-align: middle;
}
.cart-detail.receipt .items tr:first-child td {
border-top: none;
}
.cart-detail.receipt .items td.options-td {
background-color: #f7f7f7;
border-top: none;
color: #686767;
text-align: left;
}
.cart-detail.receipt .items td.options-td .sel-options { float: left; padding: 0 20px 0 0; }
.cart-detail.receipt .items .item-img { width: 70px; }
.cart-detail.receipt .items .item-total { font-weight: bold; }
.cart-detail.receipt .items .item-title {
color: #333;
font-weight: bold;
text-align: left;
}
.cart-detail.receipt .items .item-quantity { position: relative; }
.cart-detail.receipt .items .item-quantity .field { text-align: center; width: 30px; }
.formStatus {
position: absolute;
top: 37px;
left: 15px;
display: block;
z-index: 5000;
cursor: pointer;
}
.formStatus .formContent {
width: 100%;
position:relative;
z-index:5001;
color: #fff;
white-space: nowrap;
font-family: Arial;
font-size: 12px;
box-shadow: 0 0 3px #444;
-moz-box-shadow: 0 0 3px #444;
-webkit-box-shadow: 0 0 3px #444;
padding: 4px 10px 4px 10px;
border-radius: 3px;
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
}
.formStatus .formArrow {
height: 11px;
margin: -34px 0 0 22px;
position: relative;
width: 21px;
z-index: 5006;
}
.formStatus.formSuccess .formContent { background: #398d1d url(@templates_base@/img/validate/con-success.png) repeat-x 0 0; }
.formStatus.formSuccess .formArrow { background: url(@templates_base@/img/validate/con-success-arrow.png) no-repeat 0 0; }
.formStatus.formError .formContent { background: #990000 url(@templates_base@/img/validate/con-error.png) repeat-x 0 0; }
.formStatus.formError .formArrow { background: url(@templates_base@/img/validate/con-error-arrow.png) no-repeat 0 0; }
.cart-detail.receipt dl.total { float: right; padding-right: 30px; }
.cart-detail.receipt .discount-block {
float: left;
padding: 20px 0 0;
width: 300px;
}
.cart-detail.receipt .discount-block p { padding: 5px 0; }
.cart-detail.receipt .discount-block .field { width: 170px; }
.cart-detail.receipt .discount-block .num-discount { position: relative; }
.cart-detail.receipt .discount-block .formStatus { left: -15px; }
.cart-detail.shoppingcart h1 { float: left; }
.cart-detail.shoppingcart .buttons-right { float: right; text-align: right; }
.cart-detail.shoppingcart .buttons-right dl.total { float: none; padding-right: 0; }
Index: branches/1.0.x/inc/profile.css
===================================================================
--- branches/1.0.x/inc/profile.css (revision 14797)
+++ branches/1.0.x/inc/profile.css (revision 14798)
@@ -1,133 +1,133 @@
@charset "UTF-8";
/* Profile Blocks
*******************************************************************************/
.profile {
background-color: #fff;
border: 1px solid #d0d0d0;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
padding: 20px 30px;
width: auto;
}
.profile.registerpage {
border: none;
padding: 0 30px;
width: 680px;
-webkit-border-radius: 0;
-moz-border-radius: 0;
border-radius: 0;
}
.profile-title {
border-bottom: 1px solid #d0d0d0;
margin-bottom: 15px;
padding-bottom: 15px;
}
.profile, .review h1 {
color: #525252;
float: left;
font: 1.538em Verdana,Arial,Tahoma,Sans-Serif;
}
.profile p.req {
color: #3e85d2;
float: right;
font-size: 1em;
font-weight: bold;
padding-top: 10px;
}
.profile .halfcol {
float: left;
padding: 0 15px 0 0;
width: 315px;
}
.profile .halfcol-last {
padding: 0;
position: relative;
}
.profile-form label {
display: block;
font-weight: bold;
padding-bottom: 3px;
}
.profile-form.left label {
display: inline;
padding-bottom: 0px;
float: left;
padding-top: 3px;
width: 90px;
}
.field-content label {
display: inline;
font-weight: normal;
padding: 0;
}
.red {
color: #cd0000;
font-weight: normal;
padding: 0 0 0 5px;
}
.profile-form p {
clear: both !important;
float: left;
padding: 5px 0;
}
.profile-form .field { width: 270px; }
.profile-form .alt2 .field { width: 150px; }
.field.statusSuccess {
background: url(@templates_base@/img/bg-field-success.jpg) repeat-x 0 0;
- border: 1px solid #80d04d;
+ border: 1px solid #80d04d !important;
}
.field.statusError, .error .field {
background: url(@templates_base@/img/bg-field-error.jpg) repeat-x 0 0;
border: 1px solid #d80000 !important;
}
.review .profile-form .field { float: left; width: 380px; }
.review .profile-form p.buttons { padding: 0 0 0 90px; width: 380px; }
.review .profile-form p.buttons em { float: right; text-align: right; width: 170px; }
.terms {
text-align: center;
width: 100%;
}
.password-block {
display: none;
float: left;
padding: 5px 0;
position: relative;
width: 100%;
}
.registerpage .password-block { display: block; }
.password-block p {
clear: none !important;
padding: 0 15px 0 0;
}
.password-block p.pasfield2 { padding: 0; }
.password-block .field { width: 121px; }
#change-password { color: #267bd1; }
.colorbar {
display: inline-block;
height: 8px;
width: 29px;
}
.password-strength { display: none; font-weight: bold; }
.password-strength .meterDefault { color: #aaa; }
.password-strength .meterFail { color: #daa; }
.password-strength .meterWarn { color: #fd6; }
.password-strength .meterGood { color: #ada; }
.password-strength .meterExcel { color: #66c133; }
.password-strength .colorbar.meterDefault { background-color: #ddd; }
.password-strength .colorbar.meterFail { background-color: #fdd; }
.password-strength .colorbar.meterWarn { background-color: #feb; }
.password-strength .colorbar.meterGood { background-color: #dfd; }
.password-strength .colorbar.meterExcel { background-color: #66c133; }
Index: branches/1.0.x/inc/js/jquery.scripts.js
===================================================================
--- branches/1.0.x/inc/js/jquery.scripts.js (revision 14797)
+++ branches/1.0.x/inc/js/jquery.scripts.js (revision 14798)
@@ -1,140 +1,190 @@
+/* === General usage functions === */
function jq($selector) {
return $selector.replace(/(\[|\]|\.)/g, '\\$1');
}
+function in_array(needle, haystack)
+{
+ return array_search(needle, haystack) != -1;
+}
+
+function array_search(needle, haystack)
+{
+ for (var i=0; i<haystack.length; i++)
+ {
+ if (haystack[i] == needle) return i;
+ }
+ return -1;
+}
+
+Array.prototype.diff = function(a) {
+ return this.filter(
+ function (i) {
+ return a.indexOf(i) == -1;
+ }
+ );
+};
+
+function update_checkbox_options($cb_mask, $hidden_id, $form_id)
+{
+ var $tmp = '',
+ $kf = document.getElementById($form_id !== undefined ? $form_id : $form_name);
+
+ for (var i = 0; i < $kf.elements.length; i++) {
+ if ( $kf.elements[i].id.match($cb_mask) ) {
+ if ($kf.elements[i].checked) {
+ $tmp += '|'+$kf.elements[i].value;
+ }
+ }
+ }
+
+ if ($tmp.length > 0) {
+ $tmp += '|';
+ }
+
+ document.getElementById($hidden_id).value = $tmp.replace(/,$/, '');
+}
+
+/* === DBlocks class === */
function DBlocks() {
var $me = this;
this.selectors = ['#lang', '#currency', '#login', '#login-alt', '#profile'];
$(document).ready(
function () {
$me.init();
}
);
}
DBlocks.prototype.init = function () {
var $manager = this;
$( this.selectors.join(', ') ).click(
function($e, $now) {
var $me = $(this),
$parent = $me.parent();
if ( $parent.is('.plashka-sel') ) {
$parent.removeClass('plashka-sel');
if ( $now === undefined || $now === false ) {
$('#' + $me.attr('id') + '-sel').fadeOut();
}
else {
$('#' + $me.attr('id') + '-sel').hide();
}
}
else {
$manager.hideOthers($me);
$parent.addClass('plashka-sel');
$('#' + $me.attr('id') + '-sel').fadeIn();
}
return false;
}
);
$('.icon-close').click(
function() {
$('#login,#login-alt').parent().removeClass('plashka-sel');
$('#login-sel, #login-alt-sel').fadeOut();
return false;
}
);
}
DBlocks.prototype.hideOthers = function ($current) {
$( this.selectors.join(', ') ).not($current).each(
function () {
var $me = $(this),
$parent = $me.parent();
if ( $parent.is('.plashka-sel') ) {
$me.trigger('click', [true]);
}
}
);
}
+/* === RatingManager class === */
function RatingManager ($url) {
this.Url = $url;
}
RatingManager.prototype.makeVote = function ($vote, $prefix, $id, $size) {
var $url = this.Url.replace('#PREFIX#', $prefix).replace('#VOTE#', $vote).replace('#ID#', $id).replace('#SIZE#', $size);
$.get(
$url,
function ($response) {
if ($response.substring(0, 5) == '@err:') {
alert( $response.substring(5) );
return ;
}
document.getElementById('page_rating_' + $id).innerHTML = $response;
}
)
}
$(document).ready(function()
{
$('#change-password').click(
function($e) {
$('#password-show').hide();
$('#password-block').fadeIn();
return false;
}
);
$('.addtocart, .button-addtocart').click(
function () {
var $me = $(this),
$qty = $me.attr('qty_id') !== undefined ? parseInt($('#' + $me.attr('qty_id')).val()) : 1;
if ( $me.hasClass('addedtocart') ) {
// disabled button
return false;
}
if ( isNaN($qty) ) {
$qty = 1;
}
var $bubble = $('.basketStatus'),
$timer_id = $bubble.data('hide_timer');
clearTimeout($timer_id);
$.get(
$me.attr('href') + '&qty=' + $qty,
function ($bubble_content) {
$('.basketContent', $bubble).html( $bubble_content.replace(/#QTY#/g, $qty) );
- $bubble.stop(true, true).fadeIn();
-
- var $timer = setTimeout(function(){ $bubble.fadeOut('slow'); }, 2000);
- $bubble.data('hide_timer', $timer);
+ $bubble
+ .stop(true, true)
+ .fadeIn(
+ 'slow',
+ function () {
+ var $timer = setTimeout(function(){ $bubble.fadeOut('slow'); }, 2000);
+ $bubble.data('hide_timer', $timer);
+ }
+ );
if ( $me.hasClass('addtocart') ) {
$me.removeClass('addtocart').addClass('addedtocart').html('Added to Cart');
}
}
);
return false;
}
);
});
new DBlocks();
\ No newline at end of file
Index: branches/1.0.x/inc/js/cart_manager.js
===================================================================
--- branches/1.0.x/inc/js/cart_manager.js (nonexistent)
+++ branches/1.0.x/inc/js/cart_manager.js (revision 14798)
@@ -0,0 +1,597 @@
+function ShopCartManager( $settings ) {
+ this.updateUrl = '';
+ this.orderInfo = {};
+ this.constants = {};
+ this.currencyMask = '%s';
+ this.debugMode = false;
+
+ $.extend(this, $settings);
+
+ this.rowTimers = {};
+
+ var $me = this;
+
+ $(document).ready(
+ function () {
+ $me.init();
+ }
+ );
+}
+
+ShopCartManager.prototype.init = function () {
+ var $me = this;
+
+ this.process(this.orderInfo);
+
+ $('.delete-cart-link').click(
+ function ($e) {
+ var $order_item_id = $(this).parents('tr:first').attr('order_item_id');
+
+ $me.apply( [{name: 'delete_id', value: $order_item_id}] );
+
+ return false;
+ }
+ );
+
+ $('.product-qty:input', '#shopping-cart-form')
+ .blur(
+ function ($e) {
+ var $row_index = $(this).parents('tr[row_index]:first').attr('row_index');
+
+ if ( $me.debugMode ) {
+ console.log('blur on ', $row_index, ' row');
+ }
+
+ $me.clearRowTimers($row_index);
+
+ if ( $me.debugMode ) {
+ console.log('doing apply (from blur) on ', $row_index, ' row');
+ }
+
+ $me.apply();
+
+ return false;
+ }
+ )
+ .keyup(
+ function ($e) {
+ var $row_index = $(this).parents('tr[row_index]:first').attr('row_index');
+
+ if ( $me.debugMode ) {
+ console.log('keyup on ', $row_index, ' row');
+ }
+
+ $me.clearRowTimers($row_index);
+
+ $me.rowTimers[$row_index] = setTimeout(
+ function() {
+ if ( $me.debugMode ) {
+ console.log('doing apply (from keyup) on ', $row_index, ' row');
+ }
+
+ $me.apply();
+ }
+ , 2000
+ );
+ }
+ );
+
+
+ $('#remove-coupon').click(
+ function ($e) {
+ $me.apply( [{name: 'remove', value: 'coupon'}] );
+
+ return false;
+ }
+ );
+
+ $('#remove-gift-certificate').click(
+ function ($e) {
+ $me.apply( [{name: 'remove', value: 'gift_certificate'}] );
+
+ return false;
+ }
+ );
+
+ $('#update-cart, #apply-coupon, #apply-gift-certificate').click(
+ function ($e) {
+ $me.apply();
+
+ return false;
+ }
+ );
+}
+
+ShopCartManager.prototype.clearRowTimers = function ($row_index) {
+ if ( this.rowTimers[$row_index] !== undefined ) {
+ if ( this.debugMode ) {
+ console.log('cleartimers on ', $row_index, ' row -> found = delete');
+ }
+
+ clearTimeout(this.rowTimers[$row_index]);
+ delete this.rowTimers[$row_index];
+ }
+ else if ( this.debugMode ) {
+ console.log('cleartimers on ', $row_index, ' row -> not found = skip');
+ }
+}
+
+ShopCartManager.prototype.apply = function ($params) {
+ var $me = this;
+
+ $.post(
+ this.updateUrl,
+ this.getFormData($params),
+ function ($data) {
+ $data = eval('(' + $data + ')');
+
+ $me.process($data);
+ }
+ )
+}
+
+ShopCartManager.prototype.getFormData = function ($params) {
+ var $ret = $('#shopping-cart-form').serializeArray();
+
+ if ( $params !== undefined ) {
+ while( $params.length > 0 ) {
+ $ret.push( $params.shift() );
+ }
+ }
+
+ return $ret;
+}
+
+ShopCartManager.prototype.process = function ($data) {
+ // 1. row missing ajax response -> was deleted in db
+ // 2. row missing in HTML -> was added in db
+ var $me = this,
+ $old_rows = this.getOldRows(),
+ $new_rows = this.getNewRows($data),
+ $add_rows = $new_rows.diff($old_rows),
+ $delete_rows = $old_rows.diff($new_rows);
+
+ if ( this.debugMode ) {
+ console.log('proessing data: ', $data);
+ }
+
+ // add rows
+ $($add_rows).each(
+ function () {
+ $me.addRow( this, $data.items[this] );
+ }
+ );
+
+ // delete rows
+ $($delete_rows).each(
+ function () {
+ var $row = $me.getRowByIndex(this);
+
+// $row.next('tr.separator').remove();
+ $row.remove();
+ }
+ );
+
+ this.updateExistingRows($data);
+
+ this.showErrors($data);
+ this.showFooter($data);
+
+ if ( this.debugMode ) {
+ console.log('old: ', $old_rows, '; new: ', $new_rows, '; add: ', $add_rows, '; delete: ', $delete_rows);
+ }
+}
+
+ShopCartManager.prototype.addRow = function ($row_index, $row_data) {
+ if ( this.debugMode ) {
+ console.log('adding row: ', $row_data);
+ }
+
+ var $html = $('#product-row-mask').val(),
+ $value = '';
+
+ /*f: OrderItemId ; v: 101
+ f: ProductName ; v: Product With Stock Limit = 5; with backorder
+ f: BackOrderFlag ; v: 1
+ f: FlatPrice ; v: 2
+ f: Price ; v: 1.2308
+ f: Quantity ; v: 2
+ f: Virtual ; v: 0
+ f: cust_Availability ; v:*/
+
+ for (var $field in $row_data.fields) {
+ $value = $row_data.fields[$field];
+
+ if ( $field == 'Price' || $field == 'FlatPrice' ) {
+ $value = this.formatPrice($value);
+ }
+
+ $html = $html.replace(new RegExp('{field:' + $field + '}', 'g'), $value);
+
+ if ( this.debugMode ) {
+ console.log('f: ', $field, '; v: ', $value);
+ }
+ }
+
+ $html = $html.replace(/{ROW_INDEX}/g, $row_index);
+// $html = $html.replace(/{DISCOUNT}/g, $row_index);
+// $html = $html.replace(/{EXTENDED_PRICE}/g, $row_index);
+
+// var $separator = $( $('#product-row-separator-mask').val() );
+
+ $('.shop-cart-row:last').after($html);
+ /*$('.shop-cart-row:last').after($separator);
+ $separator.after($html);*/
+}
+
+ShopCartManager.prototype.updateExistingRows = function ($data) {
+ if ( $.isArray($data.items) ) {
+ // todo: hide empty shopping cart & show special message
+ $('#item-count').html(0);
+ return;
+ }
+
+ var $row_count = 0;
+
+ for (var $row_index in $data.items) {
+ var $fields = $data.items[$row_index].fields,
+ $discount = $fields['FlatPrice'] - $fields['Price'],
+ $product_row = this.getRowByIndex($row_index),
+ $discount_container = $('.product-discount', $product_row);
+
+ // update product title
+ var $product_with_link = $('.product-with-link', $product_row);
+
+ $('a:first', $product_with_link)
+ .attr('href', $data.items[$row_index].product_url)
+ .html($fields['ProductName']);
+ $product_with_link.toggle( $fields['Virtual'] == 0 );
+
+ $('.product-without-link', $product_row)
+ .toggle( $fields['Virtual'] == 1 )
+ .html($fields['ProductName']);
+
+ $('.free-shipping', $product_row).toggle( $data.items[$row_index].free_promo_shipping );
+ $('.back-order-mark', $product_row).toggle( $fields['BackOrderFlag'] > 0 );
+
+ $('.product-availability', $product_row)
+ .toggle( $fields['cust_Availability'] != '' )
+ .html('<br/>' + $fields['cust_Availability']);
+
+ $('.product-qty.read-only', $product_row).toggle( $fields['Type'] != this.constants['PRODUCT_TYPE_TANGIBLE'] );
+ $('.product-qty:not(.read-only)', $product_row).toggle( $fields['Type'] == this.constants['PRODUCT_TYPE_TANGIBLE'] );
+
+
+ // update product specific discount
+ $('.item-price', $discount_container).html( this.formatPrice($fields['FlatPrice']) );
+ $('.item-discount', $discount_container).html( '- ' + this.formatPrice($discount) );
+ $discount_container.toggle( $discount > 0 );
+
+ // update product prices
+ $('.price-cell', $product_row).html( this.formatPrice($fields['Price']) );
+ $('.extended-price-cell', $product_row).html( this.formatPrice($fields['Quantity'] * $fields['Price']) );
+
+ $row_count++;
+ }
+
+ $('#item-count').html($row_count);
+}
+
+ShopCartManager.prototype.showErrors = function ($data) {
+ var $error_code = 0, $error_info = [],
+ $row_index = '', $field = '',
+ $tooltip_options = '',
+ $coupon_error_code = this.getErrorByType('OrderCheckoutErrorType::COUPON', $data),
+ $gift_certificate_error_code = this.getErrorByType('OrderCheckoutErrorType::GIFT_CERTIFICATE', $data),
+ $discount_error_code = this.getErrorByType('OrderCheckoutErrorType::DISCOUNT', $data);
+
+ if ( $.isArray($data.errors) ) {
+ // when no error, then it's array
+ return ;
+ }
+
+ if ( $coupon_error_code ) {
+ if ( $coupon_error_code == this.constants['OrderCheckoutError::COUPON_APPLIED'] ) {
+ var $input = $('.coupon-name', '#coupon-row');
+ }
+ else {
+ var $input = $('.coupon-code:input', '#coupon-row');
+ }
+
+ $tooltip_options = this.getCouponErrorOptions($coupon_error_code);
+
+ if ( $tooltip_options ) {
+ this.createTooltip($input, $tooltip_options);
+ }
+ }
+
+ if ( $gift_certificate_error_code ) {
+ if ( $gift_certificate_error_code == this.constants['OrderCheckoutError::GC_APPLIED'] ) {
+ var $input = $('.gift-certificate-discount', '#gift-certificate-row');
+ }
+ else {
+ var $input = $('.gift-certificate-code:input', '#gift-certificate-row');
+ }
+
+ $tooltip_options = this.getGiftCertificateErrorOptions($gift_certificate_error_code);
+
+ if ( $tooltip_options ) {
+ this.createTooltip($input, $tooltip_options);
+ }
+ }
+
+ if ( $discount_error_code ) {
+ $input = $('#sub-total');
+
+ $tooltip_options = this.getDiscountErrorOptions($discount_error_code);
+
+ if ( $tooltip_options ) {
+ this.createTooltip($input, $tooltip_options);
+ }
+ }
+
+ for (var $error_type in $data.errors) {
+ $tooltip_options = '';
+ $error_info = $error_type.split(':');
+ $error_code = parseInt( $data.errors[$error_type] );
+
+ if ( $error_info[0] == this.constants['OrderCheckoutErrorType::PRODUCT'] ) {
+ this.processProductError($error_info, $error_code, $data);
+ }
+
+ if ( this.debugMode ) {
+ console.log('error_type: ', $error_type, '; error_code: ', $error_code, '; row_index: ', $row_index, '; field: ', $field);
+ }
+ }
+}
+
+ShopCartManager.prototype.showFooter = function ($data) {
+ var $discount_total = $data.order['DiscountTotal'];
+
+ // update "Total Savings"
+ $('#discount-row').toggle( $discount_total > 0 );
+ $('.price1', '#discount-row').html( this.formatPrice($discount_total) );
+
+ // update Coupon Info
+ if ( $data.order['CouponId'] == 0 ) {
+ $('.coupon-code', '#coupon-row').val('');
+ }
+
+ $('.used', '#coupon-row').toggle( $data.order['CouponId'] > 0 );
+ $('.not-used', '#coupon-row').toggle( $data.order['CouponId'] == 0 );
+ $('.coupon-name', '#coupon-row').html( $data.order['CouponName'] );
+
+ // update Gift Certificate Info
+ if ( $data.order['GiftCertificateId'] == 0 ) {
+ $('.gift-certificate-code', '#gift-certificate-row').val('');
+ }
+
+ $('.used', '#gift-certificate-row').toggle( $data.order['GiftCertificateId'] > 0 );
+ $('.not-used', '#gift-certificate-row').toggle( $data.order['GiftCertificateId'] == 0 );
+ $('.gift-certificate-discount', '#gift-certificate-row').html( this.formatPrice($data.order['GiftCertificateDiscount']) );
+
+ // update "subtotal"
+ $('#sub-total').html( this.formatPrice($data.order['SubTotal']) );
+}
+
+ShopCartManager.prototype.processProductError = function ($error_info, $error_code, $data) {
+ var $error_type = $error_info.shift(),
+ $field = $error_info.pop(),
+ $row_index = $error_info.join(':');
+
+ if ( this.getRowByIndex($row_index).length == 0 ) {
+ // row was deleted
+ return ;
+ }
+
+ if ( $field == 'Quantity' ) {
+ var $input = $('.product-qty:input', this.getRowByIndex($row_index)),
+ $allow_qty_replace = [
+ this.constants['OrderCheckoutError::FIELD_UPDATE_SUCCESS'],
+ this.constants['OrderCheckoutError::QTY_CHANGED_TO_MINIMAL']
+ ];
+
+ if ( in_array($error_code, $allow_qty_replace) && $input.val() != $data.items[$row_index]['fields']['Quantity'] ) {
+ // qty changed during ord:OnRecalculateItems
+ $input.val( $data.items[$row_index]['fields']['Quantity'] );
+ }
+
+ $tooltip_options = this.getQtyErrorOptions($error_code);
+
+ if ( $tooltip_options ) {
+ this.createTooltip($input, $tooltip_options);
+ }
+ }
+}
+
+ShopCartManager.prototype.getErrorByType = function ($contant_name, $data) {
+ var $error_type = this.constants[$contant_name];
+
+ return $data.errors[$error_type] !== undefined ? $data.errors[$error_type] : false;
+}
+
+ShopCartManager.prototype.getRowByIndex = function ($row_index) {
+ return $("tr.shop-cart-row[row_index='" + $row_index + "']", '#shop-cart-table');
+}
+
+ShopCartManager.prototype.getOldRows = function () {
+ var $ret = [];
+
+ $('tr.shop-cart-row', '#shop-cart-table').each(
+ function () {
+ $ret.push( $(this).attr('row_index') );
+ }
+ );
+
+ return $ret;
+}
+
+ShopCartManager.prototype.getNewRows = function ($data) {
+ var $ret = [];
+
+ if ( $.isArray($data.items) ) {
+ return $data.items;
+ }
+
+ for (var $row_index in $data.items) {
+ $ret.push( $row_index );
+ }
+
+ return $ret;
+}
+
+ShopCartManager.prototype.formatPrice = function ($price) {
+ // TODO: format currency
+
+ var $price_parts = $price.toFixed(2).toString().split('.');
+
+ return this.currencyMask.replace('%s', $price_parts[0] + '.<span>' + $price_parts[1] + '</span>');
+}
+
+ShopCartManager.prototype.getQtyErrorOptions = function ($error_code) {
+ var $ret = false;
+
+ switch ($error_code) {
+ case this.constants['OrderCheckoutError::FIELD_UPDATE_SUCCESS']:
+ $ret = this.getTooltipOptions('FIELD_UPDATE_SUCCESS', 'ui-tooltip-green');
+ break;
+
+ case this.constants['OrderCheckoutError::FIELD_UPDATE_ERROR']:
+ $ret = this.getTooltipOptions('FIELD_UPDATE_ERROR', 'ui-tooltip-red');
+ break;
+
+ case this.constants['OrderCheckoutError::QTY_UNAVAILABLE']:
+ $ret = this.getTooltipOptions('QTY_UNAVAILABLE', 'ui-tooltip-red');
+ break;
+
+ case this.constants['OrderCheckoutError::QTY_OUT_OF_STOCK']:
+ $ret = this.getTooltipOptions('QTY_OUT_OF_STOCK', 'ui-tooltip-red');
+ break;
+
+ case this.constants['OrderCheckoutError::QTY_CHANGED_TO_MINIMAL']:
+ $ret = this.getTooltipOptions('QTY_CHANGED_TO_MINIMAL', 'ui-tooltip-green');
+ break;
+ }
+
+ return $ret;
+}
+
+ShopCartManager.prototype.getCouponErrorOptions = function ($error_code) {
+ var $ret = false;
+
+ switch ($error_code) {
+ case this.constants['OrderCheckoutError::COUPON_APPLIED']: // for label
+ $ret = this.getTooltipOptions('COUPON_APPLIED', 'ui-tooltip-green');
+ break;
+
+ // all next error for input
+ case this.constants['OrderCheckoutError::COUPON_REMOVED']:
+ $ret = this.getTooltipOptions('COUPON_REMOVED', 'ui-tooltip-green');
+ break;
+
+ case this.constants['OrderCheckoutError::COUPON_REMOVED_AUTOMATICALLY']:
+ $ret = this.getTooltipOptions('COUPON_REMOVED_AUTOMATICALLY', 'ui-tooltip-green');
+ break;
+
+ case this.constants['OrderCheckoutError::COUPON_CODE_INVALID']:
+ $ret = this.getTooltipOptions('COUPON_CODE_INVALID', 'ui-tooltip-red');
+ break;
+
+ case this.constants['OrderCheckoutError::COUPON_CODE_EXPIRED']:
+ $ret = this.getTooltipOptions('COUPON_CODE_EXPIRED', 'ui-tooltip-red');
+ break;
+ }
+
+ return $ret;
+}
+
+ShopCartManager.prototype.getGiftCertificateErrorOptions = function ($error_code) {
+ var $ret = false;
+
+ switch ($error_code) {
+ case this.constants['OrderCheckoutError::GC_APPLIED']: // for label
+ $ret = this.getTooltipOptions('GC_APPLIED', 'ui-tooltip-green');
+ break;
+
+ // all next error for input
+ case this.constants['OrderCheckoutError::GC_REMOVED']:
+ $ret = this.getTooltipOptions('GC_REMOVED', 'ui-tooltip-green');
+ break;
+
+ case this.constants['OrderCheckoutError::GC_REMOVED_AUTOMATICALLY']:
+ $ret = this.getTooltipOptions('GC_REMOVED_AUTOMATICALLY', 'ui-tooltip-green');
+ break;
+
+ case this.constants['OrderCheckoutError::GC_CODE_INVALID']:
+ $ret = this.getTooltipOptions('GC_CODE_INVALID', 'ui-tooltip-red');
+ break;
+
+ case this.constants['OrderCheckoutError::GC_CODE_EXPIRED']:
+ $ret = this.getTooltipOptions('GC_CODE_EXPIRED', 'ui-tooltip-red');
+ break;
+ }
+
+ return $ret;
+}
+
+ShopCartManager.prototype.getDiscountErrorOptions = function ($error_code) {
+ var $ret = false;
+
+ switch ($error_code) {
+ case this.constants['OrderCheckoutError::DISCOUNT_APPLIED']:
+ $ret = this.getTooltipOptions('DISCOUNT_APPLIED', 'ui-tooltip-green');
+ break;
+
+ case this.constants['OrderCheckoutError::DISCOUNT_REMOVED']:
+ $ret = this.getTooltipOptions('DISCOUNT_REMOVED', 'ui-tooltip-green');
+ break;
+ }
+
+ return $ret;
+}
+
+ShopCartManager.prototype.createTooltip = function ($input, $tooltip_options) {
+ var $me = this,
+ $tooltip = $input.next('.formStatus'),
+ $is_error = $tooltip_options.classes == 'ui-tooltip-red',
+ $timer = $input.data('timer');
+
+ clearTimeout($timer);
+
+ if ( $tooltip.length == 1 ) {
+ $tooltip.hide().remove();
+ }
+
+ $tooltip = $('<div class="formStatus ' + ($is_error ? 'formError' : 'formSuccess') + '" style="display: none;">\
+ <div class="formContent">' + $tooltip_options.text + '</div>\
+ <div class="formArrow"></div>\
+ </div>');
+
+ $input
+ .after($tooltip)
+ .removeClass('statusSuccess statusError')
+ .addClass($is_error ? 'statusError' : 'statusSuccess');
+
+ $tooltip.fadeIn(
+ 'slow',
+ function () {
+ $timer = setTimeout( function() { $me.removeTooltip($input); }, 2000);
+ $input.data('timer', $timer);
+ }
+ );
+
+ $input.focus( function() { $me.removeTooltip($input); } );
+}
+
+ShopCartManager.prototype.removeTooltip = function ($input) {
+ var $tooltip = $input.next('.formStatus');
+ $input.removeClass('statusError').removeClass('statusSuccess');
+ $tooltip.fadeOut('slow', function() { $tooltip.remove(); });
+}
+
+ShopCartManager.prototype.getTooltipOptions = function ($text, $css_classes) {
+ return {
+ text: $text,
+ classes: $css_classes
+ };
+}
Property changes on: branches/1.0.x/inc/js/cart_manager.js
___________________________________________________________________
Added: svn:eol-style
## -0,0 +1 ##
+LF
\ No newline at end of property
Index: branches/1.0.x/elements/ajax/cart_bubble.tpl
===================================================================
--- branches/1.0.x/elements/ajax/cart_bubble.tpl (revision 14797)
+++ branches/1.0.x/elements/ajax/cart_bubble.tpl (revision 14798)
@@ -1,19 +1,19 @@
<inp2:m_NoDebug/>
<p class="subtitle">Added to cart:</p>
<div class="img">
<!--width="58" height="58"-->
- <img src="<inp2:p_ImageSrc primary='1' MaxWidth='58' DefaultWidth='58'/>" alt="" />
+ <img src="<inp2:p_ImageSrc primary='1' MaxWidth='58' DefaultWidth='58' DefaultImage='img/no_picture.gif'/>" alt="" />
</div>
<div class="info good-item">
<p>#QTY# x <inp2:p_Field name="Name"/></p>
<p class="price"><inp2:p_Field name="Price" currency="selected" decimal_tag="span"/></p>
</div>
<div class="clear"></div>
<script type="text/javascript">
$(document).ready(
function () {
$('.cart .items').html('<inp2:ord_ItemsInCart/> Items: <inp2:ord_Field name="TotalAmount" currency="selected" decimal_tag="i"/>');
}
)
</script>
\ No newline at end of file
Index: branches/1.0.x/elements/content_boxes.elm.tpl
===================================================================
--- branches/1.0.x/elements/content_boxes.elm.tpl (revision 14797)
+++ branches/1.0.x/elements/content_boxes.elm.tpl (revision 14798)
@@ -1,140 +1,140 @@
<!--## DEFAULT CONTENT-TOP ELEMENT ##-->
<inp2:m_DefineElement name="default_content_banner" no_editing="1">
<!-- default banners -->
<inp2:st_ContentBlock num="101" page="index"/>
<!-- //default banners -->
</inp2:m_DefineElement>
<inp2:m_DefineElement name="default_page_title"><inp2:m_GetConfig name="Site_Name"/> &mdash; <inp2:st_PageInfo type="htmlhead_title"/></inp2:m_DefineElement>
<inp2:m_DefineElement name="default_add_to_footer" no_editing="1">
</inp2:m_DefineElement>
<inp2:m_DefineElement name="default_add_to_head" no_editing="1">
</inp2:m_DefineElement>
<inp2:m_DefineElement name="default_sidebar" no_editing="1">
</inp2:m_DefineElement>
<inp2:m_DefineElement name="default_page_title">
<inp2:st_PageInfo type="htmlhead_title"/>
</inp2:m_DefineElement>
<inp2:m_DefineElement name="image_element">
- <img src="<inp2:m_param name="img_path" />" title="<inp2:m_param name="alt" />" alt="<inp2:m_param name="alt" />" <inp2:m_param name="img_size" /> />
+ <img src="<inp2:m_param name='img_path' />" title="<inp2:m_param name='alt' />" alt="<inp2:m_param name='alt' />" <inp2:m_param name="img_size" /> />
</inp2:m_DefineElement>
<inp2:m_DefineElement name="content_box" content_class="" header_class="">
<h2 class="<inp2:m_Param name='header_class'/>"><inp2:m_param name="header"/></h2>
<div class="<inp2:m_Param name='content_class'/>">
<inp2:m_param name="content"/>
</div>
</inp2:m_DefineElement>
<!--## Unused for now
<inp2:m_DefineElement name="side_box" add_class="">
<div class="block <inp2:m_Param name='add_class'/>">
<h2><inp2:m_param name="header"/></h2>
<inp2:m_param name="content"/>
</div>
</inp2:m_DefineElement>
<inp2:m_DefineElement name="side_box_custom" add_class="">
<div class="<inp2:m_Param name='add_class'/>">
<h4><inp2:m_param name="header"/></h4>
<inp2:m_param name="content"/>
</div>
</inp2:m_DefineElement>
<inp2:m_DefineElement name="content_box_scrollable" add_class="">
<div class="block no-border-bottom<inp2:m_Param name='add_class'/>">
<h2><inp2:m_param name="header"/></h2>
<inp2:m_param name="content"/>
</div>
</inp2:m_DefineElement>
##-->
<inp2:m_DefineElement name="rating_percent_element">
<i><inp2:m_Param name="percent"/>%</i>
<span>
<inp2:VotesIndicator rating="$rating" small_style="small-star"/>
<!--##<inp2:m_if check="m_Param" name="rating" equals_to="1|2|3|4|5">
<img src="<inp2:m_TemplatesBase/>img/star-smallest.jpg" width="13" height="13" alt="" />
</inp2:m_if>
<inp2:m_if check="m_Param" name="rating" equals_to="2|3|4|5">
<img src="<inp2:m_TemplatesBase/>img/star-smallest.jpg" width="13" height="13" alt="" />
</inp2:m_if>
<inp2:m_if check="m_Param" name="rating" equals_to="3|4|5">
<img src="<inp2:m_TemplatesBase/>img/star-smallest.jpg" width="13" height="13" alt="" />
</inp2:m_if>
<inp2:m_if check="m_Param" name="rating" equals_to="4|5">
<img src="<inp2:m_TemplatesBase/>img/star-smallest.jpg" width="13" height="13" alt="" />
</inp2:m_if>
<inp2:m_if check="m_Param" name="rating" equals_to="5">
<img src="<inp2:m_TemplatesBase/>img/star-smallest.jpg" width="13" height="13" alt="" />
</inp2:m_if>##-->
</span><br/>
</inp2:m_DefineElement>
<inp2:m_DefineElement name="review_element">
<div class="row-review">
<p class="user"><inp2:Field name="ReviewedBy"/></p>
<div class="text-review"><inp2:Field name="ReviewText"/></div>
<div class="optional-review">
<p>
Was this review helpful to you?&nbsp;&nbsp;<a href="<inp2:HelpfulLink helpful='1'/>" class="yes">Yes</a>&nbsp;&nbsp;<em class="yes-count">(<inp2:Field name="HelpfulCount"/>)</em>&nbsp;&nbsp;<a href="<inp2:HelpfulLink helpful='0'/>" class="no">No</a>&nbsp;&nbsp;<em class="no-count">(<inp2:Field name="NotHelpfulCount"/>)</em>
</p>
<p><a href="<inp2:ItemLink template='elements/ajax/spam_report' width='720' height='350'/>" class="thickbox">Is this Review Inappropriate?</a></p>
<inp2:m_if check="Field" name="Rating" db="db">
<p class="rat">
Rating:
<inp2:VotesIndicator small_style="small-star"/>
<!--##<inp2:m_if check="Field" name="Rating" equals_to="1|2|3|4|5" db="db">
<img src="<inp2:m_TemplatesBase/>img/star-smallest.jpg" width="13" height="13" alt="" />
</inp2:m_if>
<inp2:m_if check="Field" name="Rating" equals_to="2|3|4|5" db="db">
<img src="<inp2:m_TemplatesBase/>img/star-smallest.jpg" width="13" height="13" alt="" />
</inp2:m_if>
<inp2:m_if check="Field" name="Rating" equals_to="3|4|5" db="db">
<img src="<inp2:m_TemplatesBase/>img/star-smallest.jpg" width="13" height="13" alt="" />
</inp2:m_if>
<inp2:m_if check="Field" name="Rating" equals_to="4|5" db="db">
<img src="<inp2:m_TemplatesBase/>img/star-smallest.jpg" width="13" height="13" alt="" />
</inp2:m_if>
<inp2:m_if check="Field" name="Rating" equals_to="5" db="db">
<img src="<inp2:m_TemplatesBase/>img/star-smallest.jpg" width="13" height="13" alt="" />
</inp2:m_if>##-->
</p>
</inp2:m_if>
<p class="date"><strong><inp2:DateField name="CreatedOn" format="F j, Y"/></strong></p>
</div>
</div>
</inp2:m_DefineElement>
<inp2:m_DefineElement no_editing="1" name="prev_next_element" prefix="" id_field="" special="prefix-navigation" main_list="">
<inp2:{$prefix}.{$special}_InitList per_page="-1" main_list="$main_list" skip_quering="1"/>
<inp2:m_if check="{$prefix}.previous_Field" name="$id_field" item="$prefix" list="{$prefix}.{$special}">
<a href="<inp2:{$prefix}.previous_ItemLink template='__default__'/>" class="product-prev" title="Previous"></a>
</inp2:m_if>
<inp2:m_if check="{$prefix}.next_Field" name="$id_field" item="$prefix" list="{$prefix}.{$special}">
<a href="<inp2:{$prefix}.next_ItemLink template='__default__'/>" class="product-next" title="Next"></a>
</inp2:m_if>
</inp2:m_DefineElement>
\ No newline at end of file

Event Timeline