Index: branches/1.0.x/elements/ajax/order_details.tpl
===================================================================
diff -u -r14830 -r15019
--- branches/1.0.x/elements/ajax/order_details.tpl	(.../order_details.tpl)	(revision 14830)
+++ branches/1.0.x/elements/ajax/order_details.tpl	(.../order_details.tpl)	(revision 15019)
@@ -1,8 +1,9 @@
 <inp2:m_Include template="elements/content_boxes.elm" strip_nl="2"/>
+<inp2:m_Include template="elements/options.elm" strip_nl="2"/>
 
 <inp2:m_DefineElement name="orderitem_elem">
 	<tr>
-		<td class="item-img">
+		<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 class="item-title">
@@ -18,6 +19,18 @@
 		<td><inp2:Field name="Price" currency="selected"/></td>
 		<td><inp2:Field name="ExtendedPrice" currency="selected"/></td>
 	</tr>
+
+	<inp2:m_if check="HasOptions">
+		<tr>
+			<td class="options-td" colspan="5">
+				<inp2:m_if check="DisplayOptionsPricing">
+					<inp2:PrintOptions render_as="ro_option_element" currency="selected"/>
+				<inp2:m_else/>
+					<inp2:PrintOptions render_as="ro_option_element_no_price" currency="selected"/>
+				</inp2:m_if>
+			</td>
+		</tr>
+	</inp2:m_if>
 </inp2:m_DefineElement>
 
 <div class="cart-detail receipt" style="width: 90%;">
Index: branches/1.0.x/elements/content_boxes/special_deals.elm.tpl
===================================================================
diff -u -r14793 -r15019
--- branches/1.0.x/elements/content_boxes/special_deals.elm.tpl	(.../special_deals.elm.tpl)	(revision 14793)
+++ branches/1.0.x/elements/content_boxes/special_deals.elm.tpl	(.../special_deals.elm.tpl)	(revision 15019)
@@ -9,7 +9,15 @@
 				<dd>
 					<p class="img"><a href="<inp2:ProductLink template='__default__'/>"><inp2:Image render_as="image_element" Primary="1" Thumbnail="1" DefaultImage="img/no_picture.gif" MaxWidth="136" MaxHeight="136"/></a></p>
 					<p class="price-deal"><s class="under"><inp2:Field name="MSRP" currency="selected" decimal_tag="span"/></s><em class="price"><inp2:Field name="Price" currency="selected" decimal_tag="span"/></em></p>
-					<p><a href="<inp2:AddToCartLink template='elements/ajax/cart_bubble' product_template='__default__'/>" class="addtocart" rel="nofollow"><span>Add to Cart</span></a></p>
+					<p>
+						<a href="<inp2:AddToCartLink template='elements/ajax/cart_bubble' product_template='__default__'/>" class="addtocart" rel="nofollow">
+							<inp2:m_if check="Field" name="HasRequiredOptions" db="db">
+								<span>Click to See</span>
+							<inp2:m_else/>
+								<span>Add to Cart</span>
+							</inp2:m_if>
+						</a>
+					</p>
 				</dd>
 			</dl>
 		</div>
Index: branches/1.0.x/products/details.tpl
===================================================================
diff -u -r14909 -r15019
--- branches/1.0.x/products/details.tpl	(.../details.tpl)	(revision 14909)
+++ branches/1.0.x/products/details.tpl	(.../details.tpl)	(revision 15019)
@@ -12,11 +12,29 @@
 </inp2:m_DefineElement>
 
 <inp2:m_DefineElement name="before_content">
-<div class="block-fixed">
-	<div>
-		<a href="<inp2:p_AddToCartLink template='elements/ajax/cart_bubble' product_template='__default__'/>" class="button-addtocart" qty_id="product-qty" rel="nofollow"><span><img src="<inp2:m_TemplatesBase/>img/bg-button-cart-add.png" width="24" height="24" alt="" /><i>Add to Cart</i></span></a>
-	</div>
-</div>
+	<inp2:m_ifnot check="p_OptionsUpdateMode">
+		<inp2:m_ifnot check="p_FieldEquals" field="OptionsSelectionMode" value="1">
+			<div class="block-fixed">
+				<div>
+					<a href="<inp2:p_AddToCartLink template='elements/ajax/cart_bubble' product_template='__default__'/>" class="button-addtocart" qty_id="product-qty" rel="nofollow"><span><img src="<inp2:m_TemplatesBase/>img/bg-button-cart-add.png" width="24" height="24" alt="" /><i>Add to Cart</i></span></a>
+				</div>
+			</div>
+
+			<script type="text/javascript">
+				$(document).ready(
+					function () {
+						$('.button-addtocart').click(
+							function ($e) {
+								$('#add-to-cart-btn').click();
+
+								return false;
+							}
+						);
+					}
+				);
+			</script>
+		</inp2:m_ifnot>
+	</inp2:m_ifnot>
 </inp2:m_DefineElement>
 
 <!--## MAIN CONTENT ##-->
@@ -95,36 +113,20 @@
 					</div>
 				</div>
 				<div class="description">
-					<div class="options-har">
-						<div class="sel-options">
-							<label><strong>Select Size:</strong>
-							<select name="select" class="field-alt">
-								<option value="" selected="selected">22"</option>
-								<option value="">23"</option>
-							</select>
-							</label>
+					<inp2:m_if check="p_ShouldListOptions">
+						<inp2:m_Include template="elements/ajax/product_options"/>
+					<inp2:m_else/>
+						<div class="price-block">
+							<p><s class="under"><inp2:p_Field name="MSRP" currency="selected" decimal_tag="span"/></s></p>
+							<p class="redprice"><em class="price"><inp2:p_Field name="Price" currency="selected" decimal_tag="span"/></em></p>
 						</div>
-						<div class="sel-options">
-							<label><strong>Select Color:</strong>
-							<select name="select" class="field-alt">
-								<option value="" selected="selected">Gray Metallic</option>
-								<option value="">White Metallic</option>
-								<option value="">Black Metallic</option>
-							</select>
-							</label>
+						<div class="order-block">
+							<p class="qty form"><strong>Qty.</strong>&nbsp;&nbsp;<input type="text" name="qty" id="product-qty" value="1" class="field" /></p>
+							<p class="but"><a href="<inp2:p_AddToCartLink template='elements/ajax/cart_bubble' product_template='__default__'/>" class="addtocart" id="add-to-cart-btn" qty_id="product-qty" rel="nofollow"><span><i>Add to Cart</i></span></a></p>
+							<p class="avail">Availability: <em><inp2:m_if check="p_Available">In Stock<inp2:m_else/>Not In Stock</inp2:m_if></em></p>
 						</div>
-						<div class="clear"></div>
-					</div>
+					</inp2:m_if>
 
-					<div class="price-block">
-						<p><s class="under"><inp2:p_Field name="MSRP" currency="selected" decimal_tag="span"/></s></p>
-						<p class="redprice"><em class="price"><inp2:p_Field name="Price" currency="selected" decimal_tag="span"/></em></p>
-					</div>
-					<div class="order-block">
-						<p class="qty form"><strong>Qty.</strong>&nbsp;&nbsp;<input type="text" name="qty" id="product-qty" value="1" class="field" /></p>
-						<p class="but"><a href="<inp2:p_AddToCartLink template='elements/ajax/cart_bubble' product_template='__default__'/>" class="addtocart" qty_id="product-qty" rel="nofollow"><span><i>Add to Cart</i></span></a></p>
-						<p class="avail">Availability: <em>In Stock</em></p>
-					</div>
 					<div class="clear"></div>
 
 					<dl class="har">
Index: branches/1.0.x/elements/side_boxes/recently_viewed.elm.tpl
===================================================================
diff -u -r14906 -r15019
--- branches/1.0.x/elements/side_boxes/recently_viewed.elm.tpl	(.../recently_viewed.elm.tpl)	(revision 14906)
+++ branches/1.0.x/elements/side_boxes/recently_viewed.elm.tpl	(.../recently_viewed.elm.tpl)	(revision 15019)
@@ -9,7 +9,15 @@
 			<dd>
 				<p class="img"><a href="<inp2:ProductLink template='__default__'/>"><inp2:Image render_as="image_element" Primary="1" Thumbnail="1" DefaultImage="img/no_picture.gif" MaxWidth="136" MaxHeight="136"/></a></p>
 				<p class="price"><inp2:Field name="Price" currency="selected" decimal_tag="span"/></p>
-				<p><a href="<inp2:AddToCartLink template='elements/ajax/cart_bubble' product_template='__default__'/>" class="addtocart" rel="nofollow"><span>Add to Cart</span></a></p>
+				<p>
+					<a href="<inp2:AddToCartLink template='elements/ajax/cart_bubble' product_template='__default__'/>" class="addtocart" rel="nofollow">
+						<inp2:m_if check="Field" name="HasRequiredOptions" db="db">
+							<span>Click to See</span>
+						<inp2:m_else/>
+							<span>Add to Cart</span>
+						</inp2:m_if>
+					</a>
+				</p>
 			</dd>
 		</inp2:m_DefineElement>
 
Index: branches/1.0.x/inc/js/jquery.scripts.js
===================================================================
diff -u -r15015 -r15019
--- branches/1.0.x/inc/js/jquery.scripts.js	(.../jquery.scripts.js)	(revision 15015)
+++ branches/1.0.x/inc/js/jquery.scripts.js	(.../jquery.scripts.js)	(revision 15019)
@@ -234,36 +234,27 @@
 
 function add_to_cart_handler() {
 	var $me = $(this),
-		$qty = $me.attr('qty_id') !== undefined ? parseInt($('#' + $me.attr('qty_id')).val()) : 1;
+		$qty = $me.attr('qty_id') !== undefined ? get_cart_qty('#' + $me.attr('qty_id')) : 1,
+		$url = $me.attr('href');
 
+	if ( $url.indexOf('bubble') == -1 ) {
+		// proceed with regular redirect
+		return true;
+	}
 
 	if ( $me.hasClass('addedtocart') ) {
 		// disabled button
 		return false;
 	}
 
-	if ( isNaN($qty) ) {
-		$qty = 1;
-	}
+	var $timer_id = $('.basketStatus').data('hide_timer');
 
-	var $bubble = $('.basketStatus'),
-		$timer_id = $bubble.data('hide_timer');
-
 	clearTimeout($timer_id);
 
 	$.get(
-		$me.attr('href') + '&qty=' + $qty,
+		$url + '&qty=' + $qty,
 		function ($bubble_content) {
-			$('.basketContent', $bubble).html( $bubble_content.replace(/#QTY#/g, $qty) );
-			$bubble
-			.stop(true, true)
-			.fadeIn(
-				'slow',
-				function () {
-					var $timer = setTimeout(function(){ $bubble.fadeOut('slow'); }, 2000);
-					$bubble.data('hide_timer', $timer);
-				}
-			);
+			display_cart_bubble($bubble_content, $qty);
 
 			if ( $me.hasClass('addtocart') ) {
 				$me.removeClass('addtocart').addClass('addedtocart').html('Added to Cart');
@@ -274,6 +265,31 @@
 	return false;
 }
 
+function get_cart_qty ($qty_selector) {
+	var $ret = parseInt( $($qty_selector).val() );
+
+	if ( isNaN($ret) ) {
+		$ret = 1;
+	}
+
+	return $ret;
+}
+
+function display_cart_bubble ($bubble_content, $qty) {
+	var $bubble = $('.basketStatus');
+
+	$('.basketContent', $bubble).html( $bubble_content.replace(/#QTY#/g, $qty) );
+	$bubble
+	.stop(true, true)
+	.fadeIn(
+		'slow',
+		function () {
+			var $timer = setTimeout(function(){ $bubble.fadeOut('slow'); }, 2000);
+			$bubble.data('hide_timer', $timer);
+		}
+	);
+}
+
 /* === Startup === */
 $(document).ready(
 	function() {
@@ -288,6 +304,6 @@
 			}
 		);
 
-		$('.addtocart, .button-addtocart').click(add_to_cart_handler);
+		$('.addtocart').click(add_to_cart_handler);
 	}
 );
\ No newline at end of file
Index: branches/1.0.x/elements/content_boxes/new_products.elm.tpl
===================================================================
diff -u -r14885 -r15019
--- branches/1.0.x/elements/content_boxes/new_products.elm.tpl	(.../new_products.elm.tpl)	(revision 14885)
+++ branches/1.0.x/elements/content_boxes/new_products.elm.tpl	(.../new_products.elm.tpl)	(revision 15019)
@@ -9,7 +9,15 @@
 				<dd>
 					<p class="img"><a href="<inp2:ProductLink template='__default__'/>"><inp2:Image render_as="image_element" Primary="1" Thumbnail="1" DefaultImage="img/no_picture.gif" MaxWidth="136" MaxHeight="136"/></a></p>
 					<p class="price"><inp2:Field name="Price" currency="selected" decimal_tag="span"/></p>
-					<p><a href="<inp2:AddToCartLink template='elements/ajax/cart_bubble' product_template='__default__'/>" class="addtocart" rel="nofollow"><span>Add to Cart</span></a></p>
+					<p>
+						<a href="<inp2:AddToCartLink template='elements/ajax/cart_bubble' product_template='__default__'/>" class="addtocart" rel="nofollow">
+							<inp2:m_if check="Field" name="HasRequiredOptions" db="db">
+								<span>Click to See</span>
+							<inp2:m_else/>
+								<span>Add to Cart</span>
+							</inp2:m_if>
+						</a>
+					</p>
 				</dd>
 			</dl>
 		</div>
Index: branches/1.0.x/products/compare.tpl
===================================================================
diff -u -r14919 -r15019
--- branches/1.0.x/products/compare.tpl	(.../compare.tpl)	(revision 14919)
+++ branches/1.0.x/products/compare.tpl	(.../compare.tpl)	(revision 15019)
@@ -30,7 +30,15 @@
 							</p>
 							<p class="price"><inp2:Field name="Price" currency="selected" decimal_tag="span"/></p>
 
-							<p><a href="<inp2:AddToCartLink template='elements/ajax/cart_bubble' product_template='__default__'/>" class="addtocart" rel="nofollow"><span>Add to Cart</span></a></p>
+							<p>
+								<a href="<inp2:AddToCartLink template='elements/ajax/cart_bubble' product_template='__default__'/>" class="addtocart" rel="nofollow">
+									<inp2:m_if check="Field" name="HasRequiredOptions" db="db">
+										<span>Click to See</span>
+									<inp2:m_else/>
+										<span>Add to Cart</span>
+									</inp2:m_if>
+								</a>
+							</p>
 						</dd>
 					</dl>
 					<div class="rating">
Index: branches/1.0.x/elements/options.elm.tpl
===================================================================
diff -u
--- branches/1.0.x/elements/options.elm.tpl	(revision 0)
+++ branches/1.0.x/elements/options.elm.tpl	(revision 15019)
@@ -0,0 +1,113 @@
+<!--## editable blocks ##-->
+<inp2:m_DefineElement name="combination_option_element">
+	<strong><inp2:m_Param name="option_name" />: </strong>
+	<inp2:m_Param name="option_value" /><inp2:m_if check="m_ParamEquals" param="is_last" value="1"><inp2:m_else/>, </inp2:m_if>
+</inp2:m_DefineElement>
+
+<inp2:m_DefineElement name="combination_element">
+	<tr class="cart-item-small">
+		<td>
+			<input type="hidden" id="qty[<inp2:p_Field name='ProductId'/>][<inp2:Field name='CombinationId'/>]" name="qty[<inp2:p_Field name='ProductId'/>][<inp2:Field name='CombinationId'/>]" value="0"/>
+			<inp2:ShowCombination render_as="combination_option_element"/>
+		</td>
+		<td><inp2:Field name="FinalPrice" currency="selected"/>&nbsp;&nbsp;</td>
+		<td>
+			<a href="#" onclick="BuyCombination(<inp2:Field name='CombinationId'/>); return false;">Add to Cart</a>
+		</td>
+	</tr>
+</inp2:m_DefineElement>
+
+<inp2:m_DefineElement name="option_select_element">
+	<option value="<inp2:m_param name='id'/>" <inp2:m_param name="selected"/>>
+		<inp2:m_param name="value"/><inp2:m_ifnot check="m_Param" name="price" equals_to="">: (<inp2:m_param name="sign"/><inp2:m_param name="price"/> <inp2:m_param name="price_type"/>)</inp2:m_ifnot>
+	</option>
+</inp2:m_DefineElement>
+
+<inp2:m_DefineElement name="option_cb_element">
+	<input
+		type="checkbox"
+		<inp2:m_param name="selected"/>
+		name="options[<inp2:p_Field name='ProductId'/>][<inp2:Field name='ProductOptionId'/>][]"
+		id="options[<inp2:p_Field name='ProductId'/>][<inp2:Field name='ProductOptionId'/>]_<inp2:m_param name='id'/>"
+		value="<inp2:m_param name='id'/>"
+	/>
+
+	<label for="options[<inp2:p_Field name='ProductId'/>][<inp2:Field name='ProductOptionId'/>]_<inp2:m_param name='id'/>">
+		<inp2:m_param name="value"/><inp2:m_ifnot check="m_Param" name="price" equals_to="">: (<inp2:m_param name="sign"/><inp2:m_param name="price"/> <inp2:m_param name="price_type"/>)</inp2:m_ifnot>&nbsp;&nbsp;
+	</label>
+</inp2:m_DefineElement>
+
+<inp2:m_DefineElement name="option_radio_element">
+	<input
+		type="radio"
+		<inp2:m_param name="selected"/>
+		name="options[<inp2:p_Field name='ProductId'/>][<inp2:Field name='ProductOptionId'/>]"
+		id="options[<inp2:p_Field name='ProductId'/>][<inp2:Field name='ProductOptionId'/>]_<inp2:m_param name='id'/>"
+		value="<inp2:m_param name='id'/>"
+	/>
+
+	<label for="options[<inp2:p_Field name='ProductId'/>][<inp2:Field name='ProductOptionId'/>]_<inp2:m_param name='id'/>">
+		<inp2:m_param name="value"/><inp2:m_ifnot check="m_Param" name="price" equals_to="">: (<inp2:m_param name="sign"/><inp2:m_param name="price"/> <inp2:m_param name="price_type"/>)</inp2:m_ifnot>&nbsp;&nbsp;
+	</label>
+</inp2:m_DefineElement>
+
+<inp2:m_DefineElement name="option_element">
+	<tr>
+		<td style="padding-right: 10px">
+			<inp2:Field name="Name"/><inp2:m_if check="FieldEquals" field="Required" value="1"><span class="star">*</span></inp2:m_if> :
+		</td>
+		<td>
+			<inp2:m_if check="FieldEquals" field="OptionType" value="1"> <!-- drop-down -->
+				<select name="options[<inp2:p_Field name='ProductId'/>][<inp2:Field name='ProductOptionId'/>]">
+					<option value=""></option>
+					<inp2:ShowOptions render_as="option_select_element" currency="selected"/>
+				</select>
+			</inp2:m_if>
+
+			<inp2:m_if check="FieldEquals" field="OptionType" value="5"> <!-- editbox -->
+				<input type="text" name="options[<inp2:p_Field name='ProductId'/>][<inp2:Field name='ProductOptionId'/>]" value="<inp2:OptionData/>"/>
+			</inp2:m_if>
+
+			<inp2:m_if check="FieldEquals" field="OptionType" value="4"> <!-- textarea -->
+				<textarea cols="35" rows="5" class="input-textarea" name="options[<inp2:p_Field name='ProductId'/>][<inp2:Field name='ProductOptionId'/>]"><inp2:OptionData/></textarea>
+			</inp2:m_if>
+
+			<inp2:m_if check="FieldEquals" field="OptionType" value="6"> <!-- checkboxeS -->
+				<inp2:ShowOptions render_as="option_cb_element" currency="selected"/>
+			</inp2:m_if>
+
+			<inp2:m_if check="FieldEquals" field="OptionType" value="3"> <!-- radio buttons -->
+				<inp2:ShowOptions render_as="option_radio_element" currency="selected"/>
+			</inp2:m_if>
+		</td>
+	</tr>
+</inp2:m_DefineElement>
+
+<!--## read only blocks ##-->
+<inp2:m_DefineElement name="ro_option_element">
+	<inp2:m_if check="m_Param" name="type" equals_to="6"> <!-- checkboxes - multiple -->
+		<strong><inp2:m_param name="option"/>:</strong><inp2:PrintOptionValues render_as="ro_option_value_element" currency="selected"/>
+	<inp2:m_else/>
+		<strong><inp2:m_param name="option"/>:</strong> <inp2:m_param name="value"/>
+		<inp2:m_ifnot check="m_Param" name="price" equals_to=""> (<inp2:m_param name="sign"/><inp2:m_param name="price"/> <inp2:m_param name="price_type"/>)</inp2:m_ifnot>
+	</inp2:m_if>
+	<br/>
+</inp2:m_DefineElement>
+
+<inp2:m_DefineElement name="ro_option_value_element">
+	<inp2:m_param name="value"/> <inp2:m_ifnot check="m_Param" name="price" equals_to=""> (<inp2:m_param name="sign"/><inp2:m_param name="price"/> <inp2:m_param name="price_type"/>)</inp2:m_ifnot>
+	<inp2:m_ifnot check="m_Param" name="is_last">, </inp2:m_ifnot>
+</inp2:m_DefineElement>
+
+<inp2:m_DefineElement name="ro_option_element_no_price">
+	<inp2:m_if check="m_Param" name="type" equals_to="6"> <!-- checkboxes - multiple -->
+		<strong><inp2:m_param name="option"/>:</strong><inp2:PrintOptionValues render_as="ro_option_value_element_no_price"/>
+	<inp2:m_else/>
+		<strong><inp2:m_param name="option"/>:</strong> <inp2:m_param name="value"/>
+	</inp2:m_if><br/>
+</inp2:m_DefineElement>
+
+<inp2:m_DefineElement name="ro_option_value_element_no_price">
+	<inp2:m_param name="value"/>
+	<inp2:m_ifnot check="m_Param" name="is_last">, </inp2:m_ifnot>
+</inp2:m_DefineElement>
\ No newline at end of file
Index: branches/1.0.x/cart.tpl
===================================================================
diff -u -r14825 -r15019
--- branches/1.0.x/cart.tpl	(.../cart.tpl)	(revision 14825)
+++ branches/1.0.x/cart.tpl	(.../cart.tpl)	(revision 15019)
@@ -12,6 +12,7 @@
 
 <!--## MAIN CONTENT ##-->
 <inp2:m_DefineElement name="content">
+	<inp2:m_Include template="elements/options.elm" strip_nl="2"/>
 
 	<ul class="steps">
 		<li class="step1 active"><a href="<inp2:m_Link pass='m,all'/>"><i></i>Shopping Cart</a></li>
@@ -108,7 +109,17 @@
 				<inp2:m_if check="HasOptions">
 					<tr>
 						<td class="options-td" colspan="5">
-							<div class="sel-options">
+							<inp2:m_if check="DisplayOptionsPricing">
+								<inp2:PrintOptions render_as="ro_option_element" currency="selected"/>
+							<inp2:m_else/>
+								<inp2:PrintOptions render_as="ro_option_element_no_price" currency="selected"/>
+							</inp2:m_if>
+
+							<inp2:m_if check="FieldEquals" field="OptionsSelectionMode" value="0">
+								<a href="<inp2:p_ProductLink template='__default__' pass='m,p,orditems'/>">Edit Options</a>
+							</inp2:m_if>
+
+							<!--<div class="sel-options">
 								<label><strong>Select Size:</strong>
 								<select name="select">
 									<option value="" selected="selected">22"</option>
@@ -124,7 +135,7 @@
 									<option value="">Black Metallic</option>
 								</select>
 								</label>
-							</div>
+							</div>-->
 						</td>
 					</tr>
 				</inp2:m_if>
Index: branches/1.0.x/elements/ajax/product_options.tpl
===================================================================
diff -u
--- branches/1.0.x/elements/ajax/product_options.tpl	(revision 0)
+++ branches/1.0.x/elements/ajax/product_options.tpl	(revision 15019)
@@ -0,0 +1,166 @@
+<inp2:m_Include template="elements/options.elm" strip_nl="2"/>
+
+<form method="post" id="product-options-form" action="<inp2:m_Link template='elements/ajax/product_options' pass='all,p'/>">
+	<input type="hidden" name="events[ord]" id="events[ord]" value="OnAddToCart"/>
+	<input type="hidden" name="p_id" value="<inp2:p_Field name='ProductId'/>"/>
+	<input type="hidden" name="product_details_template" value="<inp2:m_Get var='t'/>"/>
+
+	<inp2:m_if check="p_OptionsUpdateMode">
+		<input type="hidden" name="shop_cart_template" value="cart"/>
+	<inp2:m_else/>
+		<input type="hidden" name="shop_cart_template" value="elements/ajax/cart_bubble"/>
+	</inp2:m_if>
+
+	<inp2:m_if check="p_FieldEquals" field="OptionsSelectionMode" value="1"> <!-- Listable options (combinations) -->
+		<div class="options-har">
+			<inp2:m_if check="p_OptionsHaveError">
+				<div class="red" style="padding: 0px;">
+					<inp2:p_OptionsError required="lu_comm_OptionsRequired" not_available="lu_comm_OptionsNotAvailable"/>
+					<br/><br/>
+				</div>
+			</inp2:m_if>
+
+			<table>
+				<tr class="cart-header">
+					<th>Options Combination</th>
+					<th>Price</th>
+					<th>&nbsp;</th>
+				</tr>
+
+				<inp2:poc_PrintList render_as="combination_element" per_page="-1"/>
+			</table>
+		</div>
+
+		<div class="price-block">
+			<p><s class="under"><inp2:p_Field name="MSRP" currency="selected" decimal_tag="span"/></s></p>
+			<p class="redprice"><em class="price"><inp2:p_Field name="Price" currency="selected" decimal_tag="span"/></em></p>
+		</div>
+
+		<div class="order-block">
+			<p class="qty form"><strong>Qty.</strong>&nbsp;&nbsp;<input type="text" id="product-qty" value="1" class="field" /></p>
+			<p class="avail">Availability: <em><inp2:m_if check="p_Available">In Stock<inp2:m_else/>Not In Stock</inp2:m_if></em></p>
+		</div>
+	<inp2:m_else/> <!-- Selectable options -->
+		<div class="options-har">
+			<inp2:m_if check="p_OptionsHaveError">
+				<div class="red" style="padding: 0px;">
+					<inp2:p_OptionsError required="lu_comm_OptionsRequired" not_available="lu_comm_OptionsNotAvailable"/>
+					<br/><br/>
+				</div>
+			</inp2:m_if>
+
+			<table>
+				<inp2:po_PrintList render_as="option_element" per_page="-1"/>
+			</table>
+		</div>
+
+		<div class="price-block">
+			<p><s class="under"><inp2:p_Field name="MSRP" currency="selected" decimal_tag="span"/></s></p>
+			<p class="redprice"><em class="price"><inp2:p_Field name="Price" currency="selected" decimal_tag="span"/></em></p>
+		</div>
+
+		<div class="order-block">
+			<p class="qty form"><strong>Qty.</strong>&nbsp;&nbsp;<input type="text" name="qty" id="product-qty" value="<inp2:m_if check='m_Get' name='qty'><inp2:m_Get name='qty'/><inp2:m_else/>1</inp2:m_if>" class="field" /></p>
+			<p class="but">
+				<inp2:m_if check="p_OptionsUpdateMode">
+					<a href="#" id="add-to-cart-btn" onclick="UpdateOptions(); return false;" class="addtocart" rel="nofollow"><span><i>Update Options</i></span></a>
+				<inp2:m_else/>
+					<inp2:m_if check="m_Get" name="already_added">
+						<a href="#" id="add-to-cart-btn" onclick="AddToCart(); return false;" class="addedtocart" rel="nofollow"><span><i>Added to Cart</i></span></a>
+					<inp2:m_else/>
+						<a href="#" id="add-to-cart-btn" onclick="AddToCart(); return false;" class="addtocart" rel="nofollow"><span><i>Add to Cart</i></span></a>
+					</inp2:m_if>
+				</inp2:m_if>
+			</p>
+			<p class="avail">Availability: <em><inp2:m_if check="p_Available">In Stock<inp2:m_else/>Not In Stock</inp2:m_if></em></p>
+		</div>
+	</inp2:m_if>
+</form>
+
+<script type="text/javascript">
+	<inp2:m_if check="p_FieldEquals" field="OptionsSelectionMode" value="1">
+		function BuyCombination(comb_id) {
+			document.getElementById('qty[<inp2:p_Field name="ProductId"/>][' + comb_id + ']').value = get_cart_qty('#product-qty');
+			$('#product-options-form').submit();
+		}
+	<inp2:m_else/>
+		function AddToCart() {
+			$('#product-options-form').submit();
+		}
+
+		function UpdateOptions() {
+			document.getElementById('events[ord]').value = 'OnUpdateItemOptions';
+			$('#product-options-form').submit();
+		}
+	</inp2:m_if>
+
+	$(document).ready(
+		function () {
+			$('#product-options-form').submit(
+				function ($e) {
+					var $form = $(this),
+						$cart_btn = $('#add-to-cart-btn');
+
+					if ( $cart_btn.hasClass('addedtocart') ) {
+						// disabled button
+						return false;
+					}
+
+					$.post(
+						$form.attr('action'),
+						$form.serialize(),
+						function ($response) {
+							var $redirect_url = TB.parseRedirect($response);
+
+							if ( $redirect_url !== false ) {
+								if ( $redirect_url.indexOf('bubble') != -1 ) {
+									var $timer_id = $('.basketStatus').data('hide_timer'),
+										$qty = get_cart_qty('#product-qty');
+
+									// reset options form
+									$form.load($form.attr('action') + '&already_added=1');
+									clearTimeout($timer_id);
+
+									$.get(
+										$redirect_url,
+										function ($bubble_content) {
+											display_cart_bubble($bubble_content, $qty);
+										}
+									);
+								}
+								else {
+									redirect($redirect_url);
+								}
+							}
+							else {
+								// got error, show same form
+								$('#product-options-form').replaceWith($response);
+							}
+						}
+					)
+
+					return false;
+				}
+			);
+		}
+	);
+</script>
+
+<!--<div class="sel-options">
+	<label><strong>Select Size:</strong>
+	<select name="select" class="field-alt">
+		<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" class="field-alt">
+		<option value="" selected="selected">Gray Metallic</option>
+		<option value="">White Metallic</option>
+		<option value="">Black Metallic</option>
+	</select>
+	</label>
+</div>
+<div class="clear"></div>-->
\ No newline at end of file
Index: branches/1.0.x/elements/product_elements.elm.tpl
===================================================================
diff -u -r14922 -r15019
--- branches/1.0.x/elements/product_elements.elm.tpl	(.../product_elements.elm.tpl)	(revision 14922)
+++ branches/1.0.x/elements/product_elements.elm.tpl	(.../product_elements.elm.tpl)	(revision 15019)
@@ -30,7 +30,15 @@
 			<div class="price-block">
 				<p><s class="under"><inp2:Field name="MSRP" currency="selected" decimal_tag="span"/></s></p>
 				<p class="redprice"><em class="price"><inp2:Field name="Price" currency="selected" decimal_tag="span"/></em></p>
-				<p><a href="<inp2:AddToCartLink template='elements/ajax/cart_bubble' product_template='__default__'/>" class="addtocart" rel="nofollow"><span>Add to Cart</span></a></p>
+				<p>
+					<a href="<inp2:AddToCartLink template='elements/ajax/cart_bubble' product_template='__default__'/>" class="addtocart" rel="nofollow">
+						<inp2:m_if check="Field" name="HasRequiredOptions" db="db">
+							<span>Click to See</span>
+						<inp2:m_else/>
+							<span>Add to Cart</span>
+						</inp2:m_if>
+					</a>
+				</p>
 			</div>
 		</div>
 	</li>
@@ -42,7 +50,15 @@
 		<dd>
 			<p class="img"><a href="<inp2:ProductLink template='__default__'/>"><inp2:Image render_as="image_element" Primary="1" Thumbnail="1" DefaultImage="img/no_picture.gif" MaxWidth="136" MaxHeight="136"/></a></p>
 			<p class="price"><inp2:Field name="Price" currency="selected" decimal_tag="span"/></p>
-			<p><a href="<inp2:AddToCartLink template='elements/ajax/cart_bubble' product_template='__default__'/>" class="addtocart" rel="nofollow"><span>Add to Cart</span></a></p>
+			<p>
+				<a href="<inp2:AddToCartLink template='elements/ajax/cart_bubble' product_template='__default__'/>" class="addtocart" rel="nofollow">
+					<inp2:m_if check="Field" name="HasRequiredOptions" db="db">
+						<span>Click to See</span>
+					<inp2:m_else/>
+						<span>Add to Cart</span>
+					</inp2:m_if>
+				</a>
+			</p>
 		</dd>
 	</dl>
 </inp2:m_DefineElement>
Index: branches/1.0.x/receipt.tpl
===================================================================
diff -u -r14829 -r15019
--- branches/1.0.x/receipt.tpl	(.../receipt.tpl)	(revision 14829)
+++ branches/1.0.x/receipt.tpl	(.../receipt.tpl)	(revision 15019)
@@ -15,7 +15,7 @@
 
 <inp2:m_DefineElement name="orderitem_elem">
 	<tr>
-		<td class="item-img">
+		<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 class="item-title">
@@ -31,6 +31,18 @@
 		<td><inp2:Field name="Price" currency="selected"/></td>
 		<td><inp2:Field name="ExtendedPrice" currency="selected"/></td>
 	</tr>
+
+	<inp2:m_if check="HasOptions">
+		<tr>
+			<td class="options-td" colspan="5">
+				<inp2:m_if check="DisplayOptionsPricing">
+					<inp2:PrintOptions render_as="ro_option_element" currency="selected"/>
+				<inp2:m_else/>
+					<inp2:PrintOptions render_as="ro_option_element_no_price" currency="selected"/>
+				</inp2:m_if>
+			</td>
+		</tr>
+	</inp2:m_if>
 </inp2:m_DefineElement>
 
 <inp2:m_DefineElement name="order_form_shipping">
@@ -170,6 +182,7 @@
 
 <!--## MAIN CONTENT ##-->
 <inp2:m_DefineElement name="content">
+	<inp2:m_Include template="elements/options.elm" strip_nl="2"/>
 
 	<ul class="steps">
 		<li class="step1"><span><i></i>Shopping Cart</span></li>
Index: branches/1.0.x/inc/js/cart_manager.js
===================================================================
diff -u -r14832 -r15019
--- branches/1.0.x/inc/js/cart_manager.js	(.../cart_manager.js)	(revision 14832)
+++ branches/1.0.x/inc/js/cart_manager.js	(.../cart_manager.js)	(revision 15019)
@@ -165,10 +165,15 @@
 	// delete rows
 	$($delete_rows).each(
 		function () {
-			var $row = $me.getRowByIndex(this);
+			var $row = $me.getRowByIndex(this),
+				$options_row = $row.next();
 
 //			$row.next('tr.separator').remove();
 			$row.remove();
+
+			if ( $('td.options-td', $options_row).length == 1 ) {
+				$options_row.remove();
+			}
 		}
 	);