Advertisement
Not a member of Pastebin yet?
Sign Up,
it unlocks many cool features!
- <form action="/cart/add" method="post" enctype="multipart/form-data" id="AddToCartForm--{{ section.id }}" class="product-single__form">
- {% unless product.has_only_default_variant %}
- {% for option in product.options_with_values %}
- <div class="radio-wrapper js product-form__item">
- <label class="single-option-radio__label{% if option.name == 'Default' or option.name == 'Title' %} hidden-label{% endif %}"
- for="ProductSelect-option-{{ forloop.index0 }}">
- {{ option.name | escape }}
- </label>
- {% if section.settings.product_selector == 'radio' %}
- <fieldset class="single-option-radio"
- name="{{ option.name | handleize }}"
- id="ProductSelect-option-{{ forloop.index0 }}">
- {% assign option_index = forloop.index %}
- {% for value in option.values %}
- {% assign variant_label_state = true %}
- {% if product.options.size == 1 %}
- {% unless product.variants[forloop.index0].available %}
- {% assign variant_label_state = false %}
- {% endunless %}
- {% endif %}
- <input type="radio"
- {% if option.selected_value == value %} checked="checked"{% endif %}
- {% unless variant_label_state %} disabled="disabled"{% endunless %}
- value="{{ value | escape }}"
- data-index="option{{ option_index }}"
- name="{{ option.name | handleize }}"
- class="single-option-selector__radio{% unless variant_label_state %} disabled{% endunless %}"
- id="ProductSelect-option-{{ option.name | handleize }}-{{ value | escape }}">
- <label for="ProductSelect-option-{{ option.name | handleize }}-{{ value | escape }}"{% unless variant_label_state %} class="disabled"{% endunless %}>{{ value | escape }}</label>
- {% endfor %}
- </fieldset>
- {% else %}
- <select class="single-option-selector__radio single-option-selector-{{ section.id }} product-form__input" id="SingleOptionSelector-{{ forloop.index0 }}" data-index="option{{ forloop.index }}">
- {% for value in option.values %}
- <option value="{{ value | escape }}"{% if option.selected_value == value %} selected="selected"{% endif %}>{{ value | escape }}</option>
- {% endfor %}
- </select>
- {% endif %}
- </div>
- {% endfor %}
- {% endunless %}
- <select name="id" id="ProductSelect" class="product-single__variants no-js">
- {% for variant in product.variants %}
- {% if variant.available %}
- <option {% if variant == product.selected_or_first_available_variant %}
- selected="selected" {% endif %}
- data-sku="{{ variant.sku }}"
- value="{{ variant.id }}">
- {{ variant.title }} - {{ variant.price | money_with_currency }}
- </option>
- {% else %}
- <option disabled="disabled">
- {{ variant.title }} - {{ 'products.product.sold_out' | t }}
- </option>
- {% endif %}
- {% endfor %}
- </select>
- {% if section.settings.quantity_enabled %}
- <div class="product-single__quantity">
- <label for="Quantity" class="product-single__quantity-label js-quantity-selector">{{ 'products.product.quantity' | t }}</label>
- <input type="number" hidden="hidden" id="Quantity" name="quantity" value="1" min="1" class="js-quantity-selector">
- </div>
- {% endif %}
- <div class="product-single__add-to-cart">
- <button style="border-radius:7px" type="submit" name="add" id="AddToCart--{{ section.id }}" class="btn add-to-cart{% if section.settings.add_to_cart_button_size == 'large' %} add-to-cart--full-width{% endif %}"{% unless current_variant.available %} disabled="disabled"{% endunless %}>
- <span class="add-to-cart-text">
- {% if current_variant.available %}
- {{ 'products.product.add_to_cart' | t }}
- {% else %}
- {{ 'products.product.sold_out' | t }}
- {% endif %}
- </span>
- </button>
- <br>
- <br>
- <img src="https://cdn.shopify.com/s/files/1/0002/6938/5737/files/product_desc_below_abover.png?12779137995016663574">
- </div>
- </form>
- {% if product.tags contains 'special-order' %}
- <style>#progress_bar{margin-top:15px}.progressbar.progressbar{background:#ffe8e8;border:0px solid whitesmoke;height:11px}.progressbar.progressbar div{background:#d95350;height:11px}.progressbar.progressbar.active div{-webkit-animation:2s linear 0s normal none infinite running progress-bar-stripes;animation:2s linear 0s normal none infinite running progress-bar-stripes}.progress-striped.progressbar.progressbar div{background-image:-webkit-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);background-image:linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, rgba(0, 0, 0, 0) 25%, rgba(0, 0, 0, 0) 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, rgba(0, 0, 0, 0) 75%, rgba(0, 0, 0, 0));background-size:40px 40px}.items-count{margin-top:0px;margin-bottom:0px}.count{color:#a94442;padding:1px}.items-count p{padding-bottom:5px;margin:0;text-transform:uppercase;font-weight:700;text-align:center;font-family:"Open Sans",Arial,sans-serif}.progressbar{position:relative;display:block;background-color:#ca0000;border:1px solid #ddd;margin-bottom:15px;-webkit-box-shadow:inset 0 1px 2px rgba(0, 0, 0, .1);box-shadow:inset 0 1px 2px rgba(0, 0, 0, .1)}.progressbar > div{background-color:#ca0000;width:0;margin-bottom:0;height:15px}.progressbar > div.less-than-ten{background-color:#ca0000 !important}#clock-ticker{display:block;margin-bottom:15px}#clock-ticker .block{position:relative;color:#000;font-weight:bold;float:left;text-align:center;width:25%}#clock-ticker .block .flip-top{width:88px;height:39px;line-height:40px;font-size:40px;text-align:center}#clock-ticker .block .label,span.flip-top{color:#000;font-weight:bold;text-align:center;font-size:14px;text-transform:uppercase;width:88px;line-height:25px;font-family:"Open Sans",Arial,sans-serif}</style>
- <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
- <script type="text/javascript">
- function randomIntFromInterval(min, max) {return Math.floor(Math.random() * (max - min + 1) + min);}
- // Settings are here
- var total_items = 50;
- var d = new Date();
- var min_items_left = 12;
- var max_items_left = 20;
- var remaining_items = randomIntFromInterval(min_items_left, max_items_left);
- var min_of_remaining_items = 1;
- var decrease_after = 1.7;
- var decrease_after_first_item = 0.17;
- // Davy Jones' Locker
- (function($){$.fn.progressbar=function(){var a="<p>Hurry! Only <span class='count'>"+remaining_items+"</span> left in stock.</p>"+"<div class='progressbar'><div style='width:100%'></div></div>";this.addClass('items-count');this.html(a+this.html());updateMeter(this);var b=this;setTimeout(function(){remaining_items--;if(remaining_items<min_of_remaining_items){remaining_items=randomIntFromInterval(min_items_left,max_items_left)}$('.count').css('background-color','#CE0201');$('.count').css('color','#fff');setTimeout(function(){$('.count').css('background-color','#fff');$('.count').css('color','#CE0201')},1000*60*0.03);b.find(".count").text(remaining_items);updateMeter(b)},1000*60*decrease_after_first_item);setInterval(function(){remaining_items--;if(remaining_items<min_of_remaining_items){remaining_items=randomIntFromInterval(min_items_left,max_items_left)}$('.count').css('background-color','#CE0201');$('.count').css('color','#fff');setTimeout(function(){$('.count').css('background-color','#fff');$('.count').css('color','#CE0201')},1000*60*0.03);b.find(".count").text(remaining_items);updateMeter(b)},1000*60*decrease_after)};function updateMeter(a){var b=100*remaining_items/total_items;if(remaining_items<10){a.find('.progressbar div:first').addClass('less-than-ten')}a.find('.progressbar').addClass('active progress-striped');setTimeout(function(){myanimate(a.find('.progressbar div:first'),b);a.find('.progressbar').removeClass('active progress-striped')},1000)}}(jQuery));function myanimate(a,b){var c=0;var d=parseInt(a.closest('.progressbar').css('width'));var e=Math.floor(100*parseInt(a.css('width'))/d);if(e>b){c=e}function frame(){if(e>b){c--}else{c++}a.css('width',c+'%');if(c==b||c<=0||c>=100)clearInterval(f)}var f=setInterval(frame,40)} jQuery.noConflict()(function($){$(document).ready(function(){$("#progress_bar").progressbar();var tag="ctdn-12-12".match(/\d+/g);var hour=14;var theDaysBox=$("#numdays");var theHoursBox=$("#numhours");var theMinsBox=$("#nummins");var theSecsBox=$("#numsecs");var d=new Date();var n=d.getDay();var date=1;var gg=0;var hh=0;var ii=0;var nsec=0-d.getSeconds();if(nsec<0){nsec=60-d.getSeconds();gg=1}var nmin=0-d.getMinutes()-gg;if(nmin<0){nmin=60-d.getMinutes()-gg;hh=1}var nhrs=14-d.getHours()-hh;if(nhrs<0){nhrs=38-d.getHours()-hh;ii=1}var ndat=date-1;if(ndat<0){var mmon=d.getMonth();ndat=30+date-d.getDate()-ii}theSecsBox.html(nsec);theMinsBox.html(nmin);theHoursBox.html(nhrs);theDaysBox.html(ndat);var refreshId=setInterval(function(){var e=theSecsBox.text();var a=theMinsBox.text();var c=theHoursBox.text();var b=theDaysBox.text();if(e==0&&a==0&&c==0&&b==0){}else{if(e==0&&a==0&&c==0){theDaysBox.html(b-1);theHoursBox.html("23");theMinsBox.html("59");theSecsBox.html("59")}else{if(e==0&&a==0){theHoursBox.html(c-1);theMinsBox.html("59");theSecsBox.html("59")}else{if(e==0){theMinsBox.html(a-1);theSecsBox.html("59")}else{theSecsBox.html(e-1)}}}}},1000);});});</script>
- <div class="items-count" id="progress_bar"></div><div id="clock-ticker" class="clearfix"><div class="block"><span class="flip-top" id="numdays">0</span><br><span class="label">Days</span></div><div class="block"><span class="flip-top" id="numhours">1</span><br><span class="label">Hours</span></div><div class="block"><span class="flip-top" id="nummins">23</span><br><span class="label">Minutes</span></div><div class="block"><span class="flip-top" id="numsecs">36</span><br><span class="label">Seconds</span></div>
- </div>
- {% endif %}
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement