Swatch.js.liquid

                                        


--------------------------------------------------------------------------------------------------------------------

--------------------------------------------------------------------------------------------------------------------

/* ================ SLATE ================ */ window.theme = window.theme || {}; /** * Variant Selection scripts * ------------------------------------------------------------------------------ * * Handles change events from the variant inputs in any `cart/add` forms that may * exist. Also updates the master select and triggers updates when the variants * price or image changes. * * @namespace variants */ /** * Variant Selection scripts slate.Variants = CHANGE * ------------------------------------------------------------------------------ * * Handles change events from the variant inputs in any `cart/add` forms that may * exist. Also updates the master select and triggers updates when the variants * price or image changes. * * @namespace variants */ slate.Variants = (function() { /** * Variant constructor * * @param {object} options - Settings from `product.js` */ function Variants(options) { this.$container = options.$container; this.product = options.product; this.singleOptionSelector = options.singleOptionSelector; this.originalSelectorId = options.originalSelectorId; this.enableHistoryState = options.enableHistoryState; this.currentVariant = this._getVariantFromOptions(); $(this.singleOptionSelector, this.$container).on( 'change', this._onSelectChange.bind(this) ); } Variants.prototype = _.assignIn({}, Variants.prototype, { /** * Get the currently selected options from add-to-cart form. Works with all * form input elements. * * @return {array} options - Values of currently selected variants */ _getCurrentOptions: function() { var currentOptions = _.map( $(this.singleOptionSelector, this.$container), function(element) { var $element = $(element); var type = $element.attr('type'); var currentOption = {}; if (type === 'radio' || type === 'checkbox') { if ($element[0].checked) { currentOption.value = $element.val(); currentOption.index = $element.data('index'); return currentOption; } else { return false; } } else { currentOption.value = $element.val(); currentOption.index = $element.data('index'); return currentOption; } } ); // remove any unchecked input values if using radio buttons or checkboxes currentOptions = _.compact(currentOptions); return currentOptions; }, /** * Find variant based on selected values. * * @param {array} selectedValues - Values of variant inputs * @return {object || undefined} found - Variant object from product.variants */ _getVariantFromOptions: function() { var selectedValues = this._getCurrentOptions(); var variants = this.product.variants; var found = _.find(variants, function(variant) { return selectedValues.every(function(values) { return _.isEqual(variant[values.index], values.value); }); }); return found; }, /** * Event handler for when a variant input changes. */ _onSelectChange: function() { var variant = this._getVariantFromOptions(); this.$container.trigger({ type: 'variantChange', variant: variant }); if (!variant) { return; } this._updateMasterSelect(variant); this._updateImages(variant); this._updatePrice(variant); this._updateSKU(variant); this.currentVariant = variant; if (this.enableHistoryState) { this._updateHistoryState(variant); } }, /** * Trigger event when variant image changes * * @param {object} variant - Currently selected variant * @return {event} variantImageChange */ _updateImages: function(variant) { var variantImage = variant.featured_image || {}; var currentVariantImage = this.currentVariant.featured_image || {}; if ( !variant.featured_image || variantImage.src === currentVariantImage.src ) { return; } this.$container.trigger({ type: 'variantImageChange', variant: variant }); }, /** * Trigger event when variant price changes. * * @param {object} variant - Currently selected variant * @return {event} variantPriceChange */ _updatePrice: function(variant) { if ( variant.price === this.currentVariant.price && variant.compare_at_price === this.currentVariant.compare_at_price ) { return; } this.$container.trigger({ type: 'variantPriceChange', variant: variant }); }, /** * Trigger event when variant sku changes. * * @param {object} variant - Currently selected variant * @return {event} variantSKUChange */ _updateSKU: function(variant) { if (variant.sku === this.currentVariant.sku) { return; } this.$container.trigger({ type: 'variantSKUChange', variant: variant }); }, /** * Update history state for product deeplinking * * @param {variant} variant - Currently selected variant * @return {k} [description] */ _updateHistoryState: function(variant) { if (!history.replaceState || !variant) { return; } var newurl = window.location.protocol + '//' + window.location.host + window.location.pathname + '?variant=' + variant.id; window.history.replaceState({ path: newurl }, '', newurl); }, /** * Update hidden master select of variant change * * @param {variant} variant - Currently selected variant */ _updateMasterSelect: function(variant) { $(this.originalSelectorId, this.$container).val(variant.id); } }); return Variants; })(); theme.Product = (function() { var defaults = { smallBreakpoint: 750, productThumbIndex: 0, productThumbMax: 0, ajaxCart: false, stockSetting: false }; function Product(container) { var $container = (this.$container = $(container)); var sectionId = $container.attr('data-section-id'); this.selectors = { originalSelectorId: '#ProductSelect-' + sectionId, modal: 'ProductModal', productZoomImage: '#ProductZoomImg', addToCart: '#AddToCart-' + sectionId, productPrice: '#ProductPrice-' + sectionId, comparePrice: '#ComparePrice-' + sectionId, addToCartText: '#AddToCartText-' + sectionId, SKU: '.js-variant-sku', productImageContainers: '.product__photo-container-' + sectionId, productImageWrappers: '.product__photo-wrapper-' + sectionId, productThumbContainers: '.product-single__thumbnail-item-' + sectionId, productThumbsWrapper: '.product-single__thumbnails-' + sectionId, productThumbs: '.product-single__thumbnail-' + sectionId, saleTag: '#ProductSaleTag-' + sectionId, productStock: '#ProductStock-' + sectionId, singleOptionSelector: '.single-option-selector-' + sectionId, shopifyPaymentButton: '.shopify-payment-button', availability: '.product-single__availability', hurrify : '.js-hurrify' }; this.settings = $.extend({}, defaults, { sectionId: sectionId, ajaxCart: $container.data('ajax'), stockSetting: $container.data('stock'), enableHistoryState: $container.data('enable-history-state') || false, namespace: '.product-' + sectionId }); // Stop parsing if we don't have the product json script tag if (!$('#ProductJson-' + sectionId).html()) { return; } this.productSingleObject = JSON.parse( $('#ProductJson-' + sectionId).html() ); this.addVariantInfo(); this.init(); } Product.prototype = _.assignIn({}, Product.prototype, { init: function() { this._stringOverrides(); this._initVariants(); this._productZoomImage(); this._productThumbSwitch(); this._productThumbnailSlider(); this._initQtySelector(); if (this.settings.ajaxCart) { theme.AjaxCart = new window.AjaxCart( $('#AddToCartForm-' + this.settings.sectionId) ); } }, _stringOverrides: function() { window.productStrings = window.productStrings || {}; $.extend(theme.strings, window.productStrings); }, addVariantInfo: function() { if (!this.productSingleObject || !this.settings.stockSetting) { return; } var variantInfo = JSON.parse( $('#VariantJson-' + this.settings.sectionId).html() ); for (var i = 0; i < variantInfo.length; i++) { $.extend(this.productSingleObject.variants[i], variantInfo[i]); } }, _initVariants: function() { var options = { $container: this.$container, enableHistoryState: this.settings.enableHistoryState, product: this.productSingleObject, singleOptionSelector: this.selectors.singleOptionSelector, originalSelectorId: this.selectors.originalSelectorId }; // eslint-disable-next-line no-new this.variants = new slate.Variants(options); this.$container.on( 'variantChange' + this.settings.namespace, this._updateAddToCartBtn.bind(this) ); this.$container.on( 'variantPriceChange' + this.settings.namespace, this._updatePrice.bind(this) ); this.$container.on( 'variantSKUChange' + this.settings.namespace, this._updateSKU.bind(this) ); this.$container.on( 'variantImageChange' + this.settings.namespace, this._updateImages.bind(this) ); }, _updateStock: function(variant) { if (!this.settings.stockSetting) return; var $stock = $(this.selectors.productStock), $hurrify = $(this.selectors.hurrify); // If we don't track variant inventory, hide stock if (!variant || !variant.inventory_management) { $stock.addClass('hide'); $hurrify.addClass('hide'); return; } if (variant.inventory_quantity < 10 && variant.inventory_quantity > 0) { $stock .html( theme.strings.stockAvailable.replace( '1', variant.inventory_quantity ) ) .removeClass('hide'); $hurrify.removeClass('hide').find('.progress-bar').css('width',variant.inventory_quantity*10+'%'); return; } if (variant.inventory_quantity <= 0 && variant.incoming) { $stock .html( theme.strings.willNotShipUntil.replace( '[date]', variant.next_incoming_date ) ) .removeClass('hide'); $hurrify.addClass('hide'); return; } // If there's more than 10 available, hide stock $stock.addClass('hide'); $hurrify.addClass('hide'); }, _updateIncomingInfo: function(variant) { if (!this.settings.stockSetting) return; var $stock = $(this.selectors.productStock); if (variant.incoming) { $stock .html( theme.strings.willBeInStockAfter.replace( '[date]', variant.next_incoming_date ) ) .removeClass('hide'); return; } // If there is no stock incoming, hide stock $stock.addClass('hide'); }, _updateAddToCartBtn: function(evt) { var variant = evt.variant; var cache = { $addToCart: $(this.selectors.addToCart), $addToCartText: $(this.selectors.addToCartText) }; if (variant) { // Select a valid variant if available theme.noticeSoldout.init(variant); if (variant.available) { // We have a valid product variant, so enable the submit button cache.$addToCart.removeClass('btn--sold-out').prop('disabled', false); cache.$addToCartText.html(theme.strings.addToCart); $(this.selectors.shopifyPaymentButton, this.$container).show(); // Show how many items are left, if below 10 this._updateStock(variant); //update availability - available $(this.selectors.availability).find('span').text(theme.strings.available); } else { // Variant is sold out, disable the submit button cache.$addToCart.prop('disabled', true).addClass('btn--sold-out'); cache.$addToCartText.html(theme.strings.soldOut); $(this.selectors.shopifyPaymentButton, this.$container).hide(); // Update when stock will be available this._updateIncomingInfo(variant); //update availability - soldout $(this.selectors.availability).find('span').text(theme.strings.soldOut); } } else { cache.$addToCart.prop('disabled', true).removeClass('btn--sold-out'); cache.$addToCartText.html(theme.strings.unavailable); //update availability - unavailable $(this.selectors.availability).find('span').text(theme.strings.unavailable); $(this.selectors.shopifyPaymentButton, this.$container).hide(); // Hide stock display this._updateStock(); } }, _updatePrice: function(evt) { var variant = evt.variant; if (variant) { $(this.selectors.productPrice).html( theme.Currency.formatMoney(variant.price, theme.moneyFormat) ); // Update and show the product's compare price if necessary if (variant.compare_at_price > variant.price) { $(this.selectors.comparePrice) .html( theme.Currency.formatMoney( variant.compare_at_price, theme.moneyFormat ) ) .removeClass('hide'); $(this.selectors.saleTag).removeClass('hide'); } else { $(this.selectors.comparePrice).addClass('hide'); $(this.selectors.saleTag).addClass('hide'); } theme.updateCurrencies(); } else { $(this.selectors.comparePrice).addClass('hide'); } }, _updateSKU: function(evt) { var variant = evt.variant; if (variant) { $(this.selectors.SKU).html(variant.sku); } }, _updateImages: function(evt) { var variant = evt.variant; if (variant && variant.featured_image) { var imageId = variant.featured_image.id; this.switchProductImage(imageId); this.setActiveThumbnail(imageId); } }, switchProductImage: function(imageId) { var $imageToShow = $( this.selectors.productImageContainers + "[data-image-id='" + imageId + "']", this.$container ); var $imagesToHide = $( this.selectors.productImageContainers + ":not([data-image-id='" + imageId + "'])", this.$container ); $imagesToHide.addClass('hide'); $imageToShow.removeClass('hide'); }, setActiveThumbnail: function(imageId) { var $thumbnailToShow = $( this.selectors.productThumbContainers + "[data-image-id='" + imageId + "']", this.$container ); var $thumbnailsToHide = $( this.selectors.productThumbContainers + ":not([data-image-id='" + imageId + "'])", this.$container ); $thumbnailsToHide.removeClass('is-active'); $thumbnailToShow.addClass('is-active'); var $thumbnails = $(this.selectors.productThumbsWrapper, this.$container); // If there is a slick carousel, get the slide index, and position it into view with animation. if ($thumbnails.hasClass('slick-initialized')) { // eslint-disable-next-line shopify/jquery-dollar-sign-reference var currentActiveSlideIndex = $thumbnails.slick('slickCurrentSlide'); var newActiveSlideIndex = parseInt( $thumbnailToShow.attr('data-slick-index') ); if (currentActiveSlideIndex !== newActiveSlideIndex) { $thumbnails.slick('slickGoTo', newActiveSlideIndex, false); } } }, _productThumbSwitch: function() { if (!$(this.selectors.productThumbs).length) { return; } var self = this; $(this.selectors.productThumbs).on( 'click' + this.settings.namespace, function(evt) { evt.preventDefault(); var imageId = $(this) .parent() .data('image-id'); self.setActiveThumbnail(imageId); self.switchProductImage(imageId); } ); //trigger hover thumb // $(this.selectors.productThumbs).on('mouseover',function(){ // $(this).trigger('click'); // }); }, /* Thumbnail slider */ _initQtySelector: function() { this.$container.find('.product-form__quantity').each(function(i, el) { // eslint-disable-next-line no-new new QtySelector($(el)); }); }, onUnload: function() { $(this.selectors.productImageWrappers).off(this.settings.namespace); $(this.selectors.productThumbs).off(this.settings.namespace); $(this.selectors.productThumbs).slick('unslick'); if (this.ProductModal) { this.ProductModal.$modal.off(this.settings.namespace); } } }); return Product; })(); theme.swatchCard2 = (function(){ function initVariant(id){ var productJson = JSON.parse($('.customJson-' + id).html()); var $selectorForm = $('.customform-' + id); var $button = $('.js-customform-addtocart-' + id); var $buttontext = $button.find('span'); var $wrapObject = $selectorForm.closest('.js-product-card'); var options = { $container: $selectorForm, enableHistoryState: false, product: productJson, singleOptionSelector: '.single-option-selector-' + id, originalSelectorId: '#ProductSelect-' + id }; var variants = new slate.Variants(options); var AjaxCart = new window.AjaxCart($selectorForm); var _updateButton = function (evt){ var variant = evt.variant; if (variant === undefined){ $button.prop('disabled', true).removeClass('btn--sold-out'); $buttontext.html(theme.strings.unavailable); }else{ if (variant.available){ $button.removeClass('btn--sold-out').prop('disabled', false); $buttontext.html(theme.strings.addToCart); }else{ $button.prop('disabled', true).addClass('btn--sold-out'); $buttontext.html(theme.strings.soldOut); } } } var _updateImage = function (evt){ var variant = evt.variant; var $mainImage = $wrapObject.find('.product-card__image').find('img'); if (variant !== undefined && variant.featured_image !== null){ var variantImage = variant.featured_image; $mainImage.attr('srcset',variantImage.src); } } var _updatePrice = function (evt){ var $price = $wrapObject.find('.product-card__price'); var variant = evt.variant; if (variant !== undefined){ var htmlComparePrice = variant.compare_at_price !== null ? '<s class="product-card__regular-price"><span class="money">'+variant.compare_at_price+'</span></s>' : ''; var htmlPrice = htmlComparePrice + '<span class="money">'+variant.price+'</span>'; $price.html(htmlPrice); theme.updateCurrencies(); } } variants.$container.on( 'variantChange' , _updateButton ); variants.$container.on( 'variantChange' , _updateImage ); variants.$container.on( 'variantChange' , _updatePrice ); } function initForm(){ $('.js-customform').each(function(){ var id = $(this).data('id'); initVariant(id); }) } initForm(); return{ load:initForm } })() // Anchor scroll // Notice when soldout theme.noticeSoldout = (function(){ var $soldoutWrapFormClass = $('.js-contact-soldout'), $textClass = $('.js-notify-text'), $soldoutValueId = $('#ContactProduct'); function noticeSoldout(variant){ $soldoutWrapFormClass.find('.form-success').remove() if (variant.available){ $textClass.find('span').text(''); $soldoutWrapFormClass.addClass('hide'); }else{ $textClass.find('span').text(': ' + variant.name); $soldoutWrapFormClass.removeClass('hide'); $soldoutValueId.val(variant.name).attr('value',variant.name); } } return { init : noticeSoldout } })() window.theme = window.theme || {};

-----------------------------------------------------------------------------------------------------------------------

Comments

Post a Comment

Popular posts from this blog

jj

By AYESHA KHAN -
  https://www.ofoct.com/image-editor/bear-image-editor-online.html?fileurl=%2F%2Fct3.ofoct.com%2Fget-file.php%3Ftype%3Dget%26genfpath%3D%252Ftmp%252FtmpD8Tlzf.jpg%26downloadsavename%3Dmerge_from_ofoct.jpg%26converter%3D%26informat%3D%26outformat%3Dpdf%26insize%3D%26outsize%3D1315737 https://cts.ofoct.com/get-file.php?type=get&genfpath=%2Ftmp%2FtmpD8Tlzf.jpg&downloadsavename=merge_from_ofoct.jpg&converter=&informat=&outformat=pdf&insize=&outsize=1315737 https://ibb.co/y8n5tK4 https://ibb.co/WFjPMrs https://ibb.co/0yZRsKZ https://ibb.co/2PkYKQW https://ibb.co/4jyGZKX https://ibb.co/jVSsPLj https://ibb.co/3YDPjxr https://ibb.co/VVTbVVL https://ibb.co/nbQgH9Y https://ibb.co/M6ZWg6p
Read more

bootstrap.min.css

By AYESHA KHAN -
/* ! * Bootstrap v4. 1.3 (https://getbootstrap.com/) * Copyright 2011 - 2018 The Bootstrap Authors * Copyright 2011 - 2018 Twitter, Inc. * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE) */:root{--blue: #007bff;--indigo:#6610f2;--purple:#6f42c1;--pink:#e83e8c;--red:#dc3545;--orange:#fd7e14;--yellow:#ffc107;--green:#28a745;--teal:#20c997;--cyan:#17a2b8;--white:#fff;--gray:#6c757d;--gray-dark:#343a40;--primary:#007bff;--secondary:#6c757d;--success:#28a745;--info:#17a2b8;--warning:#ffc107;--danger:#dc3545;--light:#f8f9fa;--dark:#343a40;--breakpoint-xs:0;--breakpoint-sm:576px;--breakpoint-md:768px;--breakpoint-lg:992px;--breakpoint-xl:1200px;--font-family-sans-serif:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";--font-family-monospace:SFMono-Regular,Menlo,Monaco,Consolas,"Libera
Read more

Theme.js SLATE RATE CODE CHANGE

By AYESHA KHAN -
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - Theme.js SLATE RATE CODE CHANGE - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - / * * * iFrames SLATE RATE CODE CHANGE * - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - * Wrap videos in div to force responsive layout. * * @namespace iframes * / slate . rte = { wrapTable: function ( ) { $ ( '.rte table' ) .wrap ( '<div class="rte__table-wrapper"></div>' ) ; } , iframeReset: function ( ) { var $iframeVideo = $ ( '.rte iframe[src*="youtube.com/embed"], .rte iframe[src*="player.vimeo"]' ) ; var $iframeReset = $if
Read more