http://www.soundandchaosfilm.com/static/ta/50130f1ae4b006ef41174e6b/2097/scripts/fullscreen.js

1YUI.add( 'squarespace-fullscreen', function( Y ) {
2
3  Y.namespace( 'Squarespace' );
4
5  var settings = {
6    container: null,
7    slides: '.slide',     /* string selector of slide elements */
8    elements: {
9      next: '.arrow-wrapper.right',
10      previous: '.arrow-wrapper.left',
11      controls: '#dotControls, #numberControls, #tinyThumbControls'
12    },
13    loop: false,
14    detectColor: false,
15    designOptions: {
16      clickBehavior: true,
17      // easing: Y.Easing.easeInOutExpo,
18      speed: 1,
19      autoHeight: false,
20      preloadCount: 2,
21      transition: 'fade',
22      transitionOptions: { }
23    },
24    loaderOptions: { fill: true },
25    refreshOnResize: true,
26    refreshOnOrientationChange: true,
27    afterInit: null,
28    onSlideChange: null,
29    afterSlideChange: null,
30    touchHandler: {
31      onSwipeDown: null,
32      onSwipeUp: null
33    },
34    isTouchscreen: false,
35    colorDetectCorners: ['topLeft', 'topRight', 'bottomLeft', 'bottomRight', 'suggestedbg']
36  };
37
38  Y.Squarespace.Fullscreen = function(userSettings) {
39
40    settings = Y.merge(settings, userSettings);
41
42    var galleries = [],
43        galleryIndex = 0,
44        $images;
45
46    var autoPlay  = (Y.Squarespace.Template.getTweakValue('gallery-auto-play')+'' === "true"),
47        playSpeed = parseFloat(Y.Squarespace.Template.getTweakValue('galleryPlaySpeed')),
48        fitOrFill = Y.Squarespace.Template.getTweakValue('gallery-style');
49
50    function init() {
51
52      if (!Y.one(settings.slides)) {
53        return false;
54      }
55
56      if (!settings.container) {
57        throw 'container is required';
58      }
59      var galleryConfig = {
60        container: null,
61        slides: settings.slides,
62        elements: {
63          next: settings.elements.next,
64          previous: settings.elements.previous,
65          controls: settings.elements.controls
66        },
67        lazyLoad: true,
68        loop: autoPlay,
69        autoplay: autoPlay,
70        autoplayOptions: {
71          randomize: false,
72          timeout: playSpeed * 1000,
73          pauseOnMouseover: []
74        },
75        design: 'stacked',
76        designOptions: settings.designOptions,
77        keyboard: false,
78        loaderOptions: settings.loaderOptions,
79        refreshOnResize: settings.refreshOnResize,
80        // deeplink urls for gallery collections only (indexes tricky)
81        historyHash: Y.one('body').hasClass('collection-type-gallery')
82      };
83
84      if (settings.container._nodes) {
85        settings.container.each(function(container) {
86          $images = Y.all(settings.slides + ' img[data-src]');
87        });
88
89        for (var i=0; i<settings.container.size(); i++) {
90
91          galleryConfig.container = settings.container.item(i);
92
93          var gallery = new Y.Squarespace.Gallery2(galleryConfig);
94          gallery.on('currentIndexChange', function(event) {
95            Y.fire('fullscreen:on-slide-change', event);
96          });
97
98          gallery.after('currentIndexChange', function(event) {
99            Y.fire('fullscreen:after-slide-change', event);
100          });
101          galleries.push(gallery);
102        }
103      } else {
104        $images = settings.container.all('img[data-src]');
105
106        galleryConfig.container = settings.container;
107        var gallery = new Y.Squarespace.Gallery2(galleryConfig);
108
109        gallery.on('currentIndexChange', function(event) {
110          Y.fire('fullscreen:on-slide-change', event);
111        });
112
113        gallery.after('currentIndexChange', function(event) {
114          Y.fire('fullscreen:after-slide-change', event);
115        });
116        galleries.push(gallery);
117      }
118
119      adjustColors(0);
120
121      setupTweakListener();
122
123      if (typeof settings.afterInit == 'function') {
124        settings.afterInit();
125      }
126      Y.on('fullscreen:on-slide-change', function(e) { onSlideChange(e); });
127      Y.on('fullscreen:after-slide-change', function(e) { afterSlideChange(e); });
128
129    }
130    init();
131
132    this.getGallery = function(value) {
133      return galleries[value];
134    };
135
136    this.getCurrentGallery = function() {
137      return galleries[galleryIndex];
138    };
139
140    this.getGalleries = function() {
141      return galleries;
142    }
143
144    this.refresh = function() {
145      for (var i=0; i<galleries.length; i++) {
146        galleries[i].refresh();
147      }
148    };
149
150    this.getGalleryIndex = function(value) {
151      return galleryIndex;
152    };
153
154    this.setGalleryIndex = function(value) {
155      if (value < 0) {
156        value = 0;
157      }
158      galleryIndex = value;
159    };
160
161    this.isLastEntry = function() {
162      var currentGallery = galleries[galleryIndex];
163      return (currentGallery.get('slides').size()-1 == currentGallery.get('currentIndex'));
164    };
165
166    this.isLastGallery = function() {
167      return (galleryIndex == galleries.length-1);
168    }
169
170    this.destroy = function() {
171      for (var i=0; i<galleries.length; i++) {
172        galleries[i].destructor();
173      }
174    };
175
176    this.adjustColors = function() {
177      adjustColors(galleries[galleryIndex].get('currentIndex'));
178    }
179
180    function onSlideChange(event) {
181      if (typeof settings.onSlideChange == 'function') {
182        settings.onSlideChange(event);
183      }
184    }
185
186    function afterSlideChange(event) {
187      adjustColors(galleries[galleryIndex].get('currentIndex'));
188
189      if (typeof settings.afterSlideChange == 'function') {
190        settings.afterSlideChange(event);
191      }
192
193    }
194
195    function getWindowWidth() {
196      return Y.one('body').get('winWidth');
197    }
198
199    function adjustColors(slideIndex) {
200      var slideImage = galleries[galleryIndex].getSlides().item(slideIndex).one('img'),
201          bodyClasses = Y.one('#canvas').get('className'),
202          currentColor;
203
204      if (!slideImage) return;
205
206      // Adjust foreground colors
207      bodyClasses = bodyClasses.replace(/color-weight-[\w|\-]*\b/g, ''); // remove color weight classes
208      Y.one('#canvas').set('className', bodyClasses);
209      Y.Array.each(settings.colorDetectCorners, function(corner) {
210        corner = corner.toLowerCase();
211        var weight = slideImage.getAttribute('data-weight-'+corner);
212        if (weight) {
213          Y.one('#canvas').addClass('color-weight-'+corner+'-'+weight);
214        }
215      });
216
217      // And background color
218      if (Y.one('body.color-detect-gallery-background')) {
219        var slide = galleries[galleryIndex].getSlides().item(slideIndex),
220            color = slideImage.getAttribute('data-color-suggestedbg');
221        if (color) {
222          Y.one('body').setStyle('backgroundColor',color);
223          if (Y.one('body').get('winWidth') < 640 && slide.one('.has-info')) {
224            slide.one('.image-detail-wrapper').setStyle('backgroundColor', color);
225          }
226        }
227
228        currentColor = color;
229      } else {
230        currentColor = Y.one('body.show-info .sqs-active-slide .imageWrapper.has-info, body.gallery-style-center') ? Y.one('body').getStyle('background-color') : slideImage.getAttribute('data-color-suggestedbg') || slideImage.getAttribute('data-color-topright');
231      }
232
233      if (currentColor) {
234        var rgba = currentColor.match(new RegExp('rgba?\\((\\d+),\\s*(\\d+),\\s*(\\d+)'));
235        if (rgba) {
236          currentColor = rgb2hex(rgba[1],rgba[2],rgba[3]);
237        }
238
239        Y.one('#canvas').addClass('color-weight-' + getLightness(currentColor));
240      }
241    }
242
243    function rgb2hex(r, g, b) {
244      var parts = [r,g,b];
245
246      for (var i = 0; i <= 2; ++i) {
247        parts[i] = parseInt(parts[i], 10).toString(16);
248
249        if (parts[i].length == 1)
250          parts[i] = '0' + parts[i];
251      }
252
253      return '#'+parts.join('');
254    }
255
256    function getLightness(hexcolor) {
257      if (hexcolor && hexcolor.length > 0 && hexcolor.length <= 7) {
258        hexcolor = hexcolor.replace('#', '');
259        return ((parseInt(hexcolor, 16) >

259 0xffffff/2) ? 'light' : 'dark');
260      } else {
261        return '';
262      }
263    }
264
265    function setupTweakListener() {
266
267      var bRefresh = false;
268      new TweakListener('gallery-transition', function(value) {
269        bRefresh = true;
270      });
271
272      new TweakListener('gallery-index-style', function(value) {
273        bRefresh = true;
274      });
275
276      new TweakListener('gallery-initial-view', function(value) {
277        bRefresh = true;
278      });
279
280      new TweakListener('gallery-auto-play', function(value) {
281        for (var i=0; i<galleries.length; i++) {
282          galleries[i].set('autoplay', value);
283        }
284      });
285
286      new TweakListener('galleryPlaySpeed', function(value) {
287        for (var i=0; i<galleries.length; i++) {
288          galleries[i].set('autoplayOptions.timeout', value*1000);
289        }
290      });
291
292      new TweakListener('gallery-style', function(value) {
293        $images.each(function(image) {
294          refreshImageStyle(image, image.hasClass('cover') ? 'Fill' : value);
295        });
296      });
297
298      /*
299      new TweakListener('color-detect-for-fullscreen', function(value) {
300        settings.detectColor = (value === "true");
301        if (settings.detectColor) {
302          adjustColors(galleries[galleryIndex].get('currentIndex'));
303        } else {
304          galleries[galleryIndex].getSlides().setStyle('backgroundColor', null);
305        }
306      }); */
307
308      Y.Global.on('tweak:beforeopen', Y.bind(function(f){
309        Y.later(500, this, function() {
310          for (var i=0; i<galleries.length; i++) {
311            galleries[i].refresh();
312          }
313        });
314      }));
315
316      Y.Global.on('tweak:close', Y.bind(function(f){
317        if (bRefresh) {
318          window.location.reload(true);
319        }
320      }));
321    }
322
323    function refreshImageStyle(image, fitOrFill) {
324      if (image && image.loader) {
325        if (fitOrFill == 'Center') {
326          image.loader.setAttrs({fit: true});
327        } else {
328          image.loader.setAttrs({fill: true});
329        }
330      }
331    }
332
333  };
334
335  var TweakListener = function(tweakName, callBack) {
336    function init() {
337      if (Y.Global) {
338        Y.Global.on('tweak:change', Y.bind(function(f){
339          if ((f.getName() == tweakName) && (typeof callBack === 'function')) {
340            callBack(f.getValue());
341          }
342        }));
343      }
344    }
345    init();
346  };
347
348
349}, '1.0', { requires: [ 'node' ] });