<!--prouct-count-->

{% if section.settings.enable_progressbar_text %}
{% include 'product-progress-bar' %}
{% endif %}
{% include 'product-addtocart' %}
{% if section.settings.enable_timer_stg_on == 'enable_timer_stg_on' and template == 'product'%}
{% include 'product-timer' %}
{% endif %}

<!-- for script only  cookies based invetory left number -->
{% if settings.enable_inventory_stock_number == "enable_inventory_stock_number_with_not_desc"  %}

<script type="text/javascript">

  setTimeout(function() {
    var second_db=$(".timer_time").val()-4;
    var left_number=$("#stock_left_num").val();
    var counter_number=second_db/left_number;
    var counter_number_sec=counter_number*1000;
    var stop = 0;

    function decrease(){
      var percent = Number($('#counter_left').text());
      if(percent > stop){
        $('#counter_left').text(percent);
       
        var t = setTimeout(decrease,counter_number_sec);
      }  else{
        $('#counter_left').text(0);
      }
    }
    setTimeout(decrease,counter_number_sec); // mini seconds
    function progress(timeleft, timetotal, $element) {
      var progressBarWidth = timeleft * $element.width() / timetotal;
      // for inventory out of 50
      var totalleftnumber=left_number*2.7;


      $element.find('div').animate({ width:totalleftnumber  }, 0).html(timeleft);
      if(timeleft > counter_number) {
        setTimeout(function() {
          progress(timeleft - counter_number, timetotal, $element);
        }, timetotal);
      }
    };
    progress(second_db, second_db, $('#progressBar'));
    $("#progressBar").removeClass("progress-bar-success");
  }, 2000);

</script>
{% else %}

<script type="text/javascript">
  setTimeout(function() {
    var second_db=$(".timer_time").val()-4;
    var left_number=$("#stock_left_num").val();
    var final_number= $("#stock_final_num").val();

    var counter_number=second_db/left_number;
    var counter_number_sec=counter_number*1000;
    var stop = 0;
    function decrease(){
    var percent = Number($('#counter_left').text());
      if(percent > stop){

        $('#counter_left').text(--percent);
        var t = setTimeout(decrease,counter_number_sec);
      } else{
        $('#counter_left').text(0);
      }
    }
    setTimeout(decrease,counter_number_sec); // mini seconds

    function progress(timeleft, timetotal, $element) {
      var progressBarWidth = timeleft * $element.width() / timetotal;
      $element.find('div').animate({ width: progressBarWidth }, 100).html(timeleft);
      if(timeleft > counter_number) {
        setTimeout(function() {
          progress(timeleft - counter_number, timetotal, $element);
        }, counter_number_sec);
      }
    };
    progress(second_db, second_db, $('#progressBar'));
    $("#progressBar").removeClass("progress-bar-success");

  }, 2000);
  
  
/*=================== MOBILE PROGRESS BAR =========================*/
  setTimeout(function() {
    var second_db=$(".timer_time").val()-4;
    var left_number=$("#stock_left_num1").val();
    var final_number= $("#stock_final_num1").val();

    var counter_number=second_db/left_number;
    var counter_number_sec=counter_number*1000;
    var stop = 0;
    function decrease(){
    var percent = Number($('#counter_left1').text());
      if(percent > stop){

        $('#counter_left1').text(--percent);
        var t = setTimeout(decrease,counter_number_sec);
      } else{
        $('#counter_left1').text(0);
      }
    }
    setTimeout(decrease,counter_number_sec); // mini seconds

    function progress(timeleft, timetotal, $element) {
      var progressBarWidth = timeleft * $element.width() / timetotal;
      $element.find('div').animate({ width: progressBarWidth }, 100).html(timeleft);
      if(timeleft > counter_number) {
        setTimeout(function() {
          progress(timeleft - counter_number, timetotal, $element);
        }, counter_number_sec);
      }
    };
    progress(second_db, second_db, $('#progressBar1'));
    $("#progressBar1").removeClass("progress-bar-success");

  }, 2000);
/*=================== END MOBILE PROGRESS BAR =========================*/  
  
  
  
</script>
{% endif %}
<script type="text/javascript">
  $(window).load(function(){    }); 
  $(".progressBar_back").animate({
    width: 137.5
  }, 1000);
</script>