custom/static-plugins/PixupWishlistSW6/src/Resources/views/storefront/layout/header/header.html.twig line 1

Open in your IDE?
  1. {% sw_extends '@Storefront/storefront/layout/header/header.html.twig' %}
  3. {% block layout_header_actions_cart %}
  4.     <div class="col-auto">
  5.         <div class="header-cart">
  6.             <a class="btn header-cart-btn header-actions-btn PixupWishlistPageIcon"
  7.                href="{{ path('frontend.pixup.wishlist.overview') }}"
  8.                title="{{  "pixup-wishlist.actions.name"|trans }}">
  10.                 <div class="PixupWishlistProductCount d-none" id="wishlistProductCount">
  11.                     {{ page.header.pixup.wishlistProductCount }}
  12.                 </div>
  14.                 <span class="header-cart-icon">
  15.                     {% sw_icon 'star' style { 'pack' : 'globus_icons', 'class': 'wishlist', 'size': size, 'color': 'transparent' } %}
  16.                 </span>
  17.                 <span class="action-btn-label d-none d-xl-block">
  18.                     {{"pixup-wishlist.actions.name"|trans }}
  19.                 </span>
  20.             </a>
  21.         </div>
  22.     </div>
  25.     {#Content for: add-to-wishlist-button.html.twig #}
  27.     <!-- Modal -->
  29.     <div class="modal fade" id="pixupWishlist_chooseWishlistModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
  30.         <div class="modal-dialog" role="document">
  31.             <div class="modal-content">
  32.                 <div class="modal-header">
  33.                     <h5 class="modal-title" style="margin-left:0.3em;"><span>{% sw_icon 'px-heart' style{"pack":"pixup","class":"PixupAddToWishlistRemoveIcon pixupBaseIcon pxOutlineWhite"} %} &thinsp;</span><span id="pixupWishlistSelect_title">{{  "pixup-wishlist.product-detail.modal.add.title"|trans }}</span></h5>
  34.                     <br>
  35.                     <button type="button" class="close" data-dismiss="modal" aria-label="Close">
  36.                         <span aria-hidden="true">&times;</span>
  37.                     </button>
  38.                 </div>
  39.                 <div class="modal-body" style="padding:0">
  40.                     <div class="modal-title PixupCechBoxGroupTitle" id="pixupWishlist_description">{{  "pixup-wishlist.product-detail.modal.add.description"|trans }}</div>
  42.                     <div id="pixupWishlist_chooseWishlistModal_body_select">
  44.                     </div>
  45.                 </div>
  46.                 <div class="modal-footer">
  47.                     <button type="button" class="btn btn-secondary" data-dismiss="modal">{{  "pixup-wishlist.product-detail.modal.close"|trans }}</button>
  48.                     <button id="pixupWishlist_save" type="button" class="btn btn-primary">{{  "pixup-wishlist.product-detail.modal.add.confirm"|trans }}</button>
  49.                 </div>
  50.             </div>
  51.         </div>
  52.     </div>
  53.     <script>
  54.         function substrectOneFromWLHeader(){
  55.             wishlistCount = document.getElementById("wishlistProductCount");
  56.             if (wishlistCount === null){
  57.                 return;
  58.             }
  59.             currentCount = wishlistCount.innerHTML;
  60.             wishlistCount.innerHTML = (parseInt(currentCount,0)-1).toString();
  61.         }
  62.         function addOneFromWLHeader(){
  63.             wishlistCount = document.getElementById("wishlistProductCount");
  64.             if (wishlistCount === null){
  65.                 return;
  66.             }
  67.             currentCount = wishlistCount.innerHTML;
  68.             wishlistCount.innerHTML = (parseInt(currentCount,0)+1).toString();
  69.         }
  70.         function pixupWishlist_changeProductWishlistStateInit(elem,remove,productID,wishlistId=null,applyStyle=true, lineItemData=null){
  71.             if(remove === 'true' || remove === true) {
  72.                 baseUrl = "{{ url('frontend.pixup.wishlist.ajax.remove_product', {'productId': '--product-id--','wishlistId': '--wishListId--'})  }}";
  73.                 baseUrl = baseUrl.replace(/--product-id--/, productID).replace(/--wishListId--/,wishlistId);
  75.                 csrfToken = document.querySelector('#change-remove-product-csrf input').value;
  77.                 pixupWishlist_ajaxCore("POST", baseUrl, csrfToken, pixupWishlist_changeProductWishlistStateHandler,[elem,baseUrl,productID,remove,wishlistId,applyStyle]);
  78.             } else if(remove === 'custom') {
  79.                 baseUrl = "{{ url('frontend.pixup.wishlist.ajax.add_product', {'productId': '--product-id--','wishlistId': '--wishListId--'})  }}";
  80.                 baseUrl = baseUrl.replace(/--product-id--/, productID).replace(/--wishListId--/,wishlistId);
  82.                 csrfToken = document.querySelector('#change-add-product-csrf input').value;
  84.                 if(lineItemData) {
  85.                     pixupWishlist_ajaxCore("POST", baseUrl, csrfToken, pixupWishlist_changeProductWishlistStateHandler,[elem,baseUrl,productID,remove,wishlistId,applyStyle], lineItemData);
  86.                 } else {
  87.                     pixupWishlist_ajaxCore("POST", baseUrl, csrfToken, pixupWishlist_changeProductWishlistStateHandler,[elem,baseUrl,productID,remove,wishlistId,applyStyle]);
  88.                 }
  89.             } else {
  90.                 return false;
  91.             }
  92.         }
  93.         function pixupWishlist_changeProductWishlistStateHandler(xhttp,elem,baseUrl,productID,removeProduct,wishlistId=null,applyStyle=true){
  94.             removeProductMsg = "{{ "pixup-wishlist.product-detail.deleteProduct"|trans }}";
  95.             addProductMsg = "{{ "pixup-wishlist.product-detail.addProduct"|trans }}";
  96.             data = JSON.parse(xhttp.responseText).data;
  97.             if(data.productOnWishlist === false && data.success) { // product removed
  98.                 substrectOneFromWLHeader();
  99.                 if(elem !== null) {
  100.                     elem.title = addProductMsg;
  101.                     elem.children[0].style.display = "inline-block";
  102.                     elem.children[1].style.display = "none";
  103.                     elem.dataset.remove = false;
  104.                 }
  105.             }else if(data.success){ // product added
  106.                 addOneFromWLHeader();
  107.                 if(elem !== null) {
  108.                     elem.title = removeProductMsg;
  109.                     elem.children[0].style.display = "none";
  110.                     elem.children[1].style.display = "inline-block";
  111.                     elem.dataset.remove = true;
  112.                 }
  113.             }else if(!data.success && data.wishListIdRequired){ // cant perform action on product because multiple wishlists exsist
  114.                 //get all wishlists
  115.                 url = "{{ url('frontend.pixup.wishlist.ajax.get_wishlists',{'productId': '--product-id--'})  }}";
  116.                 url = url.replace(/--product-id--/, "");
  117.                 pixupWishlist_ajaxCore("GET", url, '', pixupWishlists_selectWishlist,[elem,productID])
  118.             }
  119.         }
  120.         function pixupWishlists_selectWishlist(xhttp,elem,productID){
  121.             var safeBtn = document.getElementById('pixupWishlist_save');
  122.             var description = document.getElementById('pixupWishlist_description');
  123.             var title = document.getElementById("pixupWishlistSelect_title");
  124.             var select = document.getElementById("pixupWishlist_chooseWishlistModal_body_select");
  125.             var data = JSON.parse(xhttp.responseText).data.wishlists;
  126.             var addDescription = "{{  "pixup-wishlist.product-detail.modal.add.description"|trans }}";
  127.             var addConfirm = "{{  "pixup-wishlist.product-detail.modal.add.confirm"|trans }}";
  128.             var addTitle = "{{  "pixup-wishlist.product-detail.modal.add.title"|trans }}";
  129.             var removeDescription = "{{  "pixup-wishlist.product-detail.modal.remove.description"|trans }}";
  130.             var removeConfirm = "{{  "pixup-wishlist.product-detail.modal.remove.confirm"|trans }}";
  131.             var removeTitle = "{{  "pixup-wishlist.product-detail.modal.remove.title"|trans }}";
  133.             //clear old event Listener ( so only one function can listen on it )
  134.             safeBtnClone = safeBtn.cloneNode(true);
  135.             //set listener
  136.             safeBtnClone.addEventListener("click", function(){
  137.                 //get all selected checkboxes and send the value to the changeState function
  138.                 var all_checkboxes = document.querySelectorAll('input[name="pixupWishlistCheckBoxWishlistSelector[]"]');
  139.                 productOnOneWishlist = false;
  140.                 for(var x = 0, l = all_checkboxes.length; x < l;  x++) {
  141.                     if(all_checkboxes[x].checked === true)
  142.                         productOnOneWishlist = true;
  143.                     if(all_checkboxes[x].dataset.isOnWishlist === "true" && all_checkboxes[x].checked === true && all_checkboxes[x].value !== "-1" ||
  144.                         all_checkboxes[x].dataset.isOnWishlist === "false"  && all_checkboxes[x].checked === false)
  145.                         continue;
  147.                     pixupWishlist_changeProductWishlistStateInit(
  148.                         elem,
  149.                         !all_checkboxes[x].checked,
  150.                         productID,
  151.                         all_checkboxes[x].value,
  152.                         false
  153.                     );
  154.                 }
  156.                 if(productOnOneWishlist === true){
  157.                     elem.title = removeProductMsg;
  158.                     elem.children[0].style.display = "none";
  159.                     elem.children[1].style.display = "inline-block";
  160.                     elem.dataset.remove = true;
  161.                 }else{
  162.                     elem.title = addProductMsg;
  163.                     elem.children[0].style.display = "inline-block";
  164.                     elem.children[1].style.display = "none";
  165.                     elem.dataset.remove = false;
  166.                 }
  167.                 $('#pixupWishlist_chooseWishlistModal').modal('hide')
  168.             });
  169.             safeBtn = safeBtn.parentNode.replaceChild(safeBtnClone, safeBtn);
  171.             //delete options
  172.             select.innerHTML = "";
  174.             //set proper messages
  175.             if(elem.dataset.remove === 'true'){
  176.                 safeBtn.innerHTML = removeConfirm;
  177.                 description.innerHTML = removeDescription;
  178.                 title.innerHTML = removeTitle;
  179.             }else{
  180.                 safeBtn.innerHTML = addConfirm;
  181.                 description.innerHTML = addDescription;
  182.                 title.innerHTML = addTitle;
  183.             }
  185.             //create a checkbox for every recieved wishlist ( subscribed wishlists excluded )
  186.             ownWishlistAdded = false;
  187.             for(i=0;i<data.length;i++){
  188.                 if(data[i].subscribed === true)
  189.                     continue;
  191.                 ownWishlistAdded = true;
  192.                 select.appendChild(createCheckbox(data[i],productID));
  193.             }
  194.             //if no wishlist exsist
  195.             if(ownWishlistAdded === false){
  196.                 customData = {name:"{{ "pixup-wishlist.product-detail.modal.createNewWishlist"|trans }}",id:-1,products:[-1]};
  197.                 select.appendChild(createCheckbox(customData,-1));
  198.             }
  200.             //add checkboxes for subcribed wishlists
  201.             match = 0;
  202.             for(i=0;i<data.length;i++){
  203.                 if(data[i].subscribed === false)
  204.                     continue;
  205.                 if(data[i].editable !== true)
  206.                     continue;
  207.                 match++;
  208.                 if(match === 1) {
  209.                     var hr = document.createElement("hr");
  210.                     var div = document.createElement("div");
  211.                     div.classList = "center PixupCechBoxGroupTitle";
  212.                     div.innerHTML = "{{ "pixup-wishlist.product-detail.modal.subscribedWishlists"|trans }}";
  213.                     select.appendChild(hr);
  214.                     select.appendChild(div);
  215.                 }
  216.                 select.appendChild(createCheckbox(data[i],productID,"PixupCheckBoxRow2"));
  217.             }
  219.             // $('#pixupWishlist_chooseWishlistModal').modal()
  220.         }
  221.         function createCheckbox(data,productId,className = ""){
  222.             var div = document.createElement("div");
  223.             div.className = "custom-control custom-checkbox PixupCheckBoxRow "+className;
  224.             var input = document.createElement("input");
  225.             input.type = "checkbox";
  226.             input.className = "custom-control-input";
  227.             input.id = "pixupWishlist"+i;
  228.             input.name = "pixupWishlistCheckBoxWishlistSelector[]";
  229.             input.value = data.id;
  230.             input.dataset.isOnWishlist = false;
  231.             isOnWishlist = false;
  232.             products = Object.values(data.products);
  233.             for(let x = 0; products.length > x;x++){
  234.                 if(products[x] === productId) {
  235.                     isOnWishlist = true;
  236.                     break;
  237.                 }
  238.             }
  239.             if (isOnWishlist) {
  240.                 input.checked = true;
  241.                 input.dataset.isOnWishlist = true;
  242.             }
  243.             var label = document.createElement("label");
  244.             label.className = "custom-control-label";
  245.             label.htmlFor ="pixupWishlist"+i;
  246.             label.innerHTML = data.name;
  248.             div.appendChild(input);
  249.             div.appendChild(label);
  250.             return div
  251.         }
  252.         function pixupWishlist_ajaxCore(requestType, url, csrfToken, callback,options=null, lineItemData=null){
  253.             var xhttp = new XMLHttpRequest();
  254.             xhttp.onreadystatechange = function() {
  255.                 if (this.readyState == 4 && this.status == 200) {
  256.                     if(options !== null) {
  257.                         callback(this, ...options);
  258.                     }
  259.                 }
  260.             };
  261.             xhttp.open(requestType, url, true);
  262.             if(csrfToken !== ''){
  263.                 var formData = new FormData();
  264.                 formData.append("_csrf_token", csrfToken);
  266.                 //lineitem for cuttingservice
  267.                 if(lineItemData)
  268.                     formData.append("lineItem", lineItemData)
  270.                 xhttp.send(formData);
  271.             } else {
  272.                 xhttp.send();
  273.             }
  275.         }
  276.     </script>
  277.     {#end of content for add-to.wishlist.button.html.twig#}
  279.     {{ parent() }}
  280. {% endblock%}