<?php
require_once('database.php');
$userid = $_POST['userid'];
$query = "select * from products where product_code='$userid'";
$rec=db::getRecord($query);


###ADDON####
$query_add = "select * from products where product_category='addon'";
$rec_add=db::getRecords($query_add);

###ADDON####

//$id_random=rand();
$id_random=$rec['id'].rand();
?>
<html>
    <head>
        <script src="https://unpkg.com/sweetalert/dist/sweetalert.min.js"></script>
  <style>
  .badge-notify{
    background:red;
    position:relative;
    top: -20px;
    right: 10px;
  }
  .my-cart-icon-affix {
    position: fixed;
    z-index: 900;
  }
      .qty_<?=$id_random?> .count_<?=$id_random?> {
    color: #000;
    display: inline-block;
    vertical-align: top;
    font-size: 25px;
    font-weight: 700;
    line-height: 30px;
    padding: 2px 2px
    ;min-width: 55px;
    text-align: center;
}
.qty_<?=$id_random?> .plus_<?=$id_random?> {
    cursor: pointer;
    display: inline-block;
    vertical-align: top;
    color: black;
    width: 40px;
    height: 40px;
    font: 40px/1 Arial,sans-serif;
    text-align: center;
    border-radius: 50%;
    
    }
.qty_<?=$id_random?> .minus_<?=$id_random?> {
    cursor: pointer;
    display: inline-block;
    vertical-align: top;
    color: black;
    width: 40px;
    height: 40px;
    font: 40px/1 Arial,sans-serif;
    text-align: center;
    border-radius: 50%;
    background-clip: padding-box;
}

.minus_<?=$id_random?>:hover{
    background-color:#e93e21 !important;
}
.plus_<?=$id_random?>:hover{
    background-color:#e93e21 !important;
}
/*Prevent text selection*/
span{
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
}
#inp{  
    border: 0;
    width: 4%;
}
#inp::-webkit-outer-spin-button,
.count_<?=$id_random?>::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}
.count_<?=$id_random?>:disabled{
    background-color:white;r
}


#displaynone{
  display: none;
}

 

 </style>
  </head>
<body>
        <div>
         <img  style="width:100%;height:200px" src="images/<?php  echo $rec['product_image'];?>">
        </div>
        <div class="container-fluid">
        <div class="row" style="margin-top:10px">
            <div class="col-lg-6 col-md-6 col-sm-6">
              <h6> <?php  echo $rec['product_name'];?> </h6>
            </div>

        </div>
        
        <div class="row" style="width:100%">
            <div class="col-lg-12 col-md-12 col-sm-12">
              <p> <?php  echo $rec['product_desc'];?> </p>
        
</div>
 <?php foreach($rec_add as $instance) { ?>
<div class="row">
                  <div class="col-lg-1 col-md-1 col-sm-1 col-xs-2">
                 <input style="width:17px;margin-top:-13px;margin-left:12px" type="checkbox" class="addonClass"  data-id="<?php echo  $instance['product_code'];?>" 
                     data-name="<?php echo  $instance['product_name'];?>" data-price="<?php echo  $instance['product_price'];?>" data-quantity="1" data-image="images/<?php echo  $instance['product_image'];?>" >

                  </div>
                  <div class="col-lg-9 col-md-9 col-sm-9 col-xs-7">
                    <p style="font-size:22px"><?=$instance['product_name']?></p>
                  </div>
                  <div class="col-lg-2 col-md-2 col-sm-2 col-xs-3">
                  <p style="font-size:20px">€<?=$instance['product_price']?></p>
                  </div>
             </div>
<?php }  ?>

           
            
              <div class="row" style="width:100%;padding-bottom:20px">
              <div class="col-lg-4 col-md-4 col-sm-4 col-xs-6">
                  <div class="qty_<?=$id_random?>">
                        <span class="minus_<?=$id_random?> ">-</span>
                        <input id="inp" type="number" class="count_<?=$id_random?>" name="qty" value="1">
                        <span class="plus_<?=$id_random?>" >+</span>
                    </div>
                  </div>
                  <div class="col-lg-8 col-md-8 col-sm-8 col-xs-6">
                    <input  type="hidden"  style="width:100%;display: none;" class="hide_my-cart-btn_<?=$id_random?> " id="hide_my-cart-btn_<?=$id_random?>" data-id="<?php echo $rec['product_code'];?>" 
                     data-name="<?php echo $rec['product_name'];?>" data-price="<?php echo $rec['product_price'];?>" data-quantity="1" data-image="images/<?php echo $rec['product_image'];?>">


             <button data-dismiss="modal" style="width:100%;" class="button orange my-cart-btn my-cart-btn_<?=$id_random?> " id="my-cart-btn_<?=$id_random?>" data-id="<?php echo $rec['product_code'];?>" 
                     data-name="<?php echo $rec['product_name'];?>" data-price="<?php echo $rec['product_price'];?>" data-quantity="1" data-image="images/<?php echo $rec['product_image'];?>">Add to cart</button>
                      
            </div>
</div>
            
        </div>
  <script src="js/cart/jquery-2.2.3.min.js"></script>
  <script type='text/javascript' src="js/cart/bootstrap.min.js"></script>
  <script type='text/javascript' src="js/cart/jquery.mycart.js"></script>
  <script type="text/javascript">
  $(function () {

    var goToCartIcon = function($addTocartBtn){
      //console.log($addTocartBtn);
      var $cartIcon = $(".my-cart-icon");
      var $image = $('<img width="30px" height="30px" src="' + $addTocartBtn.data("image") + '"/>').css({"position": "fixed", "z-index": "-80000"});
      $addTocartBtn.prepend($image);
         console.log('Now');
            console.log($image[0]);
      var position = $cartIcon.position();
      $image.animate({
        top: position.top,
        right: position.right
      }, 1000 , "linear", function() {
        $image.remove();
      });


    }


    $('.my-cart-btn_<?=$id_random?>').myCart({
      currencySymbol: '',
      classCartIcon: 'my-cart-icon',
      classCartBadge: 'my-cart-badge',
      classProductQuantity: 'my-product-quantity',
      classProductRemove: 'my-product-remove',
      classCheckoutCart: 'my-cart-checkout',
      affixCartIcon: true,
      showCheckoutModal: true,
      numberOfDecimals: 2,
       // cartItems: [
       //  {id: 1, name: 'product 1', summary: 'summary 1', price: 10, quantity: 1, image: 'images/img_1.png'},
       //  {id: 2, name: 'product 2', summary: 'summary 2', price: 20, quantity: 2, image: 'images/img_2.png'},
       //  {id: 3, name: 'product 3', summary: 'summary 3', price: 30, quantity: 1, image: 'images/img_3.png'}
      
       // ],
      clickOnAddToCart: function($addTocart){
          console.log('oyehoye');
          //console.log($addTocart);
     //var checkedclass= $('.addonClass:checkbox:checked');
    //  var arr = [];
    // $('input.addonClass:checkbox:checked').each(function () {
    //     // goToCartIcon(this);
    //     $addTocart.push($(this));
    // });


      console.log($addTocart);

        goToCartIcon($addTocart);
        //return false;
        //$addTocart='';
      },
      afterAddOnCart: function(products, totalPrice, totalQuantity) {
        console.log("afterAddOnCart", products, totalPrice, totalQuantity);
      },
      clickOnCartIcon: function($cartIcon, products, totalPrice, totalQuantity) {
        console.log("cart icon clicked", $cartIcon, products, totalPrice, totalQuantity);
      },
      checkoutCart: function(products, totalPrice, totalQuantity) {
        var checkoutString = "Total Price: " + totalPrice + "\nTotal Quantity: " + totalQuantity;
        checkoutString += "\n\n id \t name \t summary \t price \t quantity \t image path";
        $.each(products, function(){
          checkoutString += ("\n " + this.id + " \t " + this.name + " \t " + this.summary + " \t " + this.price + " \t " + this.quantity + " \t " + this.image);
        });
        //alert(checkoutString)

         
        cartAction(products);
      




        console.log("checking out", products, totalPrice, totalQuantity);
      },
      getDiscountPrice: function(products, totalPrice, totalQuantity) {
        console.log("calculating discount", products, totalPrice, totalQuantity);
        window.localStorage.setItem('totalPrice', JSON.stringify(totalPrice));
        return totalPrice * 0.9;

      }
    });

  });


 function cartAction(checkoutString)
  {
      var add = JSON.parse(window.localStorage.getItem('address'));
      var dis_result = JSON.parse(window.localStorage.getItem('distanceresultcheck'));
     if(add != null){
         if(dis_result > 5.00){
              window.localStorage.setItem('checkoutString', JSON.stringify(checkoutString));
              localStorage.removeItem("address");
              localStorage.removeItem("distanceresultcheck");
              window.location.href = "checkout.php";
         }
         else{
            window.localStorage.setItem('checkoutString', JSON.stringify(checkoutString));
            window.location.href = "checkout.php";
         }
     }
     else{
        swal({
        title: "Sorry!",
        text: "The Address Field is required.",
        icon: "error",
            }); 
     }
  }
        
        
        $(document).ready(function(){
        $('input[type="checkbox"]').click(function() { 
    if ($(this).is(':checked')) {
        //$(this).prop('checked',false);
            console.log(this.getAttribute('data-price'));

          //var elment = document.getElementById("#hide_my-cart-btn_<?=$id_random?>");
        var newName=this.getAttribute('data-name');
        var old_name=$('#my-cart-btn_<?=$id_random?>').attr("data-name");

              var newID=this.getAttribute('data-id');
        var old_id=$('#my-cart-btn_<?=$id_random?>').attr("data-id");

        var newprice=parseFloat(this.getAttribute('data-price'));
        var old_price=parseFloat($('#my-cart-btn_<?=$id_random?>').attr("data-price"));
        
        //Setting values
      $('#my-cart-btn_<?=$id_random?>').attr("data-price",parseFloat(old_price+newprice));
      $('#my-cart-btn_<?=$id_random?>').attr("data-name",old_name+' , '+newName);
      $('#my-cart-btn_<?=$id_random?>').attr("data-id",old_id+','+newID);


        //console.log( www);
      // var valu=$('#hide_my-cart-btn_<?=$id_random?>').val();
      //       console.log(valu);

           // alert("addon selection");
           // $( ".my-cart-btn_<?=$id_random?>" ).clone().attr({'data-id': this.getAttribute('data-id'),'data-image': this.getAttribute('data-image'),'data-quantity': this.getAttribute('data-quantity'),'data-price': this.getAttribute('data-price'),'data-name': this.getAttribute('data-name')}).prependTo( ".my-cart-btn_<?=$id_random?>" );

    } else {


        var newID="+"+this.getAttribute('data-id');
        console.log(newID);
        var old_name=$('#hide_my-cart-btn_<?=$id_random?>').attr("data-name");
        var old_id=$('#hide_my-cart-btn_<?=$id_random?>').attr("data-id");
        //   old_id=old_id.replace(newID, " ");

        var newprice=parseFloat(this.getAttribute('data-price'));
        var old_price=parseFloat($('#my-cart-btn_<?=$id_random?>').attr("data-price"));
        
        //Setting values
      $('#my-cart-btn_<?=$id_random?>').attr("data-price",parseFloat(old_price-newprice));
      $('#my-cart-btn_<?=$id_random?>').attr("data-name",old_name);
      $('#my-cart-btn_<?=$id_random?>').attr("data-id",old_id);


         //$(this).prop('checked',true);
        //  console.log(this.getAttribute('data-name'));
        // alert("addon selection nos");
    }
});


             

    //           $('input.addonClass:checkbox:checked').each(function () {
    //     // goToCartIcon(this);
    //     console.log($(this));
    // });


        $('.count_<?=$id_random?>').prop('disabled', true);
        $(document).on('click','.plus_<?=$id_random?>',function(){
        
        var cnt=$('.count_<?=$id_random?>').val(parseInt($('.count_<?=$id_random?>').val()) + 1 );
        
        cnt=$('.count_<?=$id_random?>').val(); 
      //console.log(cnt);

        $('#my-cart-btn_<?=$id_random?>').attr("data-quantity",cnt);
//$('.my-cart-btn_<?=$id_random?>').attr("data-quantity",(parseInt($('.count_<?=$id_random?>').val()) + 1 ));
         //console.log($('.count_<?=$id_random?>').val());
        });
          $(document).on('click','.minus_<?=$id_random?>',function(){
          $('.count_<?=$id_random?>').val(parseInt($('.count_<?=$id_random?>').val()) - 1 );


            if ($('.count_<?=$id_random?>').val() == 0) {
            $('.count_<?=$id_random?>').val(1);
          }

            cnt=$('.count_<?=$id_random?>').val(); 
           $('#my-cart-btn_<?=$id_random?>').attr("data-quantity",cnt);


            });
    });
  </script>
    

    
   
    </body>
</html>
