https://photomugs.com/cdn/shop/t/1/compiled_assets/scripts.js?v=121300159449270329481768303466

1/** Shopify CDN: Minification failed
2
3Line 26:2 Transforming class syntax to the configured target environment ("es5") is not supported yet
4Line 27:15 Transforming object literal extensions to the configured target environment ("es5") is not supported yet
5Line 41:13 Transforming object literal extensions to the configured target environment ("es5") is not supported yet
6Line 46:20 Transforming object literal extensions to the configured target environment ("es5") is not supported yet
7Line 53:15 Transforming object literal extensions to the configured target environment ("es5") is not supported yet
8Line 55:6 Transforming const to the configured target environment ("es5") is not supported yet
9Line 60:16 Transforming object literal extensions to the configured target environment ("es5") is not supported yet
10Line 66:17 Transforming object literal extensions to the configured target environment ("es5") is not supported yet
11Line 67:6 Transforming const to the configured target environment ("es5") is not supported yet
12Line 222:0 The JSX syntax extension is not currently enabled
13... and 1 more hidden warnings
14
15**/
16(function() {
17  var __sections__ = {};
18  (function() {
19    for(var i = 0, s = document.getElementById('sections-script').getAttribute('data-sections').split(','); i < s.length; i++)
20      __sections__[s[i]] = true;
21    })();
22    (function() {
23  if (!__sections__["footer"]) return;
24  try {
25    
26  class LocalizationForm extends HTMLElement {
27    constructor() {
28      super();
29      this.elements = {
30        input: this.querySelector('input[name="locale_code"], input[name="country_code"]'),
31        button: this.querySelector('button'),
32        panel: this.querySelector('.disclosure__list-wrapper'),
33      };
34      this.elements.button.addEventListener('click', this.openSelector.bind(this));
35      this.elements.button.addEventListener('focusout', this.closeSelector.bind(this));
36      this.addEventListener('keyup', this.onContainerKeyUp.bind(this));
37
38      this.querySelectorAll('a').forEach(item => item.addEventListener('click', this.onItemClick.bind(this)));
39    }
40
41    hidePanel() {
42      this.elements.button.setAttribute('aria-expanded', 'false');
43      this.elements.panel.setAttribute('hidden', true);
44    }
45
46    onContainerKeyUp(event) {
47      if (event.code.toUpperCase() !== 'ESCAPE') return;
48
49      this.hidePanel();
50      this.elements.button.focus();
51    }
52
53    onItemClick(event) {
54      event.preventDefault();
55      const form = this.querySelector('form');
56      this.elements.input.value = event.currentTarget.dataset.value;
57      if (form) form.submit();
58    }
59
60    openSelector() {
61      this.elements.button.focus();
62      this.elements.panel.toggleAttribute('hidden');
63      this.elements.button.setAttribute('aria-expanded', (this.elements.button.getAttribute('aria-expanded') === 'false').toString());
64    }
65
66    closeSelector(event) {
67      const shouldClose = event.relatedTarget && event.relatedTarget.nodeName === 'BUTTON';
68      if (event.relatedTarget === null || shouldClose) {
69        this.hidePanel();
70      }
71    }
72  }
73
74  customElements.define('localization-form', LocalizationForm);
75
76  } catch(e) { console.error(e); }
77})();
78
79(function() {
80  if (!__sections__["product-brick"] && !Shopify.designMode) return;
81  try {
82    
83  
84  init();
85  $(document).on('shopify:block:select', function(event){
86    init();
87  })
88  $(window).on("resize", function(event){
89    init();
90  })
91  
92  $("a.brick_link").hover(
93    function(){
94      $(this).find("span.brick_mask").css(
95        {"background": "#ffffffba",
96         "opacity": 1, "transition": "all 0.4s"}
97      )
98    },function(){
99      $(this).find("span.brick_mask").css(
100        {"opacity": 0, "transition": "all 0.4s"}
101      )
102    }
103  )
104  function init(){
105    var pageWidth = $(".page-width").width();
106    var gap = 15;
107    var config = setConfig();
108    var windowSize = checkSize(config);
109    // calc each brick width and height
110    //var columnWidth  = (pageWidth - gap*4 / 3;
111    //var columnHeight = columnWidth / 4 * 3
112
113    var columnWidth  = (pageWidth - gap*config[windowSize]["gapCount"]) / config[windowSize]["colCount"];
114    var columnHeight = columnWidth / config[windowSize]["colCount"] * config[windowSize]["gapCount"];
115
116    setBrick(columnWidth, columnHeight, gap, windowSize);
117    shiftBrick(columnWidth, columnHeight, gap, config)
118  }
119
120  function setConfig(){
121    return {
122      big: {
123        range: 800,
124        gapCount: 3,
125        colCount: 4,
126        1: {row: 1, col: 1},
127        2: {row: 1, col: 2},
128        3: {row: 1, col: 3},
129        4: {row: 2, col: 1},
130        5: {row: 3, col: 2},
131        6: {row: 3, col: 3},
132        7: {row: 3, col: 4},
133        8: {row: 4, col: 1},
134        9: {row: 4, col: 3},
135        10: {row: 5, col: 3},
136        11: {row: 4, col: 4}
137      },
138      medium: {
139        range: 552,
140        gapCount: 2,
141        colCount: 3,
142        1: {row: 1, col: 1},
143        2: {row: 1, col: 2},
144        3: {row: 3, col: 1},
145        4: {row: 1, col: 3},
146        5: {row: 2, col: 1},
147        6: {row: 3, col: 3},
148        7: {row: 4, col: 3},
149        8: {row: 5, col: 1},
150        9: {row: 5, col: 3},
151        10: {row: 7, col: 1},
152        11: {row: 6, col: 3}
153      },
154      small: {
155        range: 0,
156        gapCount: 1, // control image size in small screen
157        colCount: 1, 
158        1: {row: 1, col: 1},
159        2: {row: 2, col: 1},
160        3: {row: 3, col: 1},
161        4: {row: 4, col: 1},
162        5: {row: 5, col: 1},
163        6: {row: 6, col: 1},
164        7: {row: 7, col: 1},
165        8: {row: 8, col: 1},
166        9: {row: 9, col: 1},
167        10: {row: 10, col: 1},
168        11: {row: 11, col: 1}
169      },
170    }
171
172  }
173
174  function setBrick(columnWidth, columnHeight, gap, windowSize){

175    $(".type_1_1").css({"width": columnWidth, "height": columnHeight})
176    if(windowSize == "small"){
177      $(".type_1_2, .type_2_2").css({"width": columnWidth, "height": columnHeight})
178    }else{
179      $(".type_1_2").css({"width": columnWidth, "height": columnHeight*2 + gap})
180      $(".type_2_2").css({"width": columnWidth*2 + gap , "height": columnHeight*2 + gap})
181    }
182  }
183
184  function shiftBrick(columnWidth, columnHeight ,gap, config){
185    var biggestHeight = 0;
186    $("span.article").each(function(index){
187      var layoutSize = checkSize(config);
188      var row = config[layoutSize][index+1]['row'];
189      var col = config[layoutSize][index+1]['col'];
190      var image = $(this).data("image"+(index+1));
191      var rowCount = row - 1;
192      var colCount = col - 1;
193      $(this).css({"left": (columnWidth*colCount + gap*colCount), "top": (columnHeight*rowCount + gap*rowCount)})
194      
195      var bricksBottom = (columnHeight*rowCount + gap*rowCount + $(this).height());
196      if( bricksBottom > biggestHeight){
197        biggestHeight = bricksBottom;
198      }
199    })
200    $(".bricks").css("height",biggestHeight);
201  }
202  
203  function checkSize(config){
204    var windowSize = $(window).width();
205
206    if(windowSize > config.big.range){
207      return "big";
208    }else if(windowSize > config.medium.range){
209      return "medium"; 
210    }else{
211      return "small";
212    }
213  }
214
215  } catch(e) { console.error(e); }
216})();
217
218(function() {
219  if (!__sections__["product-recommendations-2"]) return;
220  try {
221    
222<script>
223var loadProductRecommendationsIntoSection = function() {
224  // Look for an element with class 'product-recommendations-2'
225  var productRecommendationsSection = document.querySelector(".product-recommendations-2");
226  if (productRecommendationsSection === null) { return; }
227  // Read product id from data attribute
228  var productId = productRecommendationsSection.dataset.productId;
229  // Read limit from data attribute
230  var limit = productRecommendationsSection.dataset.limit;
231  // Build request URL
232  var requestUrl = "/recommendations/products?section_id=product-recommendations&limit="+limit+"&product_id="+productId;
233  // Create request and submit it using Ajax
234  var request = new XMLHttpRequest();
235  request.open("GET", requestUrl);
236  request.onload = function() {
237    if (request.status >= 200 && request.status < 300) {
238      var container = document.createElement("div");
239      container.innerHTML = request.response;
240      productRecommendationsSection.parentElement.innerHTML = container.querySelector(".product-recommendations-2").innerHTML;
241    }
242  };
243  request.send();
244};
245// If your section has theme settings, the theme editor
246// reloads the section as you edit those settings. When that happens, the
247// recommendations need to be fetched again.
248// See https://help.shopify.com/en/themes/development/sections/integration-with-theme-editor
249document.addEventListener("shopify:section:load", function(event) {
250  if (event.detail.sectionId === "product-recommendations-2") {
251    loadProductRecommendationsIntoSection();
252  }
253});
254// Fetching the recommendations on page load
255loadProductRecommendationsIntoSection();
256  </script>
257
258  } catch(e) { console.error(e); }
259})();
260
261(function() {
262  if (!__sections__["product-recommendations"]) return;
263  try {
264    
265
266var loadProductRecommendationsIntoSection = function() {
267  // Look for an element with class 'product-recommendations'
268  var productRecommendationsSection = document.querySelector(".product-recommendations");
269  if (productRecommendationsSection === null) { return; }
270  // Read product id from data attribute
271  var productId = productRecommendationsSection.dataset.productId;
272  // Read limit from data attribute
273  var limit = productRecommendationsSection.dataset.limit;
274  // Build request URL
275  var requestUrl = "/recommendations/products?section_id=product-recommendations&limit="+limit+"&product_id="+productId;
276  // Create request and submit it using Ajax
277  var request = new XMLHttpRequest();
278  request.open("GET", requestUrl);
279  request.onload = function() {
280    if (request.status >= 200 && request.status < 300) {
281      var container = document.createElement("div");
282      container.innerHTML = request.response;
283      productRecommendationsSection.parentElement.innerHTML = container.querySelector(".product-recommendations").innerHTML;
284    }
285  };
286  request.send();
287};
288// If your section has theme settings, the theme editor
289// reloads the section as you edit those settings. When that happens, the
290// recommendations need to be fetched again.

291// See https://help.shopify.com/en/themes/development/sections/integration-with-theme-editor
292document.addEventListener("shopify:section:load", function(event) {
293  if (event.detail.sectionId === "product-recommendations") {
294    loadProductRecommendationsIntoSection();
295  }
296});
297// Fetching the recommendations on page load
298loadProductRecommendationsIntoSection();
299
300
301  } catch(e) { console.error(e); }
302})();
303})();