https://q-bo.in/assets/theme/js/jquery.lighter.js

1// Generated by CoffeeScript 1.8.0
2
3/*
4jQuery Lighter
5Copyright 2015 Kevin Sylvestre
61.2.5
7 */
8
9(function() {
10  "use strict";
11  var $, Animation, Lighter,
12    __bind = function(fn, me){ return function(){ return fn.apply(me, arguments); }; };
13
14  $ = jQuery;
15
16  Animation = (function() {
17    function Animation() {}
18
19    Animation.transitions = {
20      "webkitTransition": "webkitTransitionEnd",
21      "mozTransition": "mozTransitionEnd",
22      "oTransition": "oTransitionEnd",
23      "transition": "transitionend"
24    };
25
26    Animation.transition = function($el) {
27      var el, result, type, _ref;
28      el = $el[0];
29      _ref = this.transitions;
30      for (type in _ref) {
31        result = _ref[type];
32        if (el.style[type] != null) {
33          return result;
34        }
35      }
36    };
37
38    Animation.execute = function($el, callback) {
39      var transition;
40      transition = this.transition($el);
41      if (transition != null) {
42        return $el.one(transition, callback);
43      } else {
44        return callback();
45      }
46    };
47
48    return Animation;
49
50  })();
51
52  Lighter = (function() {
53    Lighter.namespace = "lighter";
54
55    Lighter.prototype.defaults = {
56      padding: 40,
57      dimensions: {
58        width: 480,
59        height: 480
60      },
61      template: "<div class='" + Lighter.namespace + " fade'>\n  <div class='" + Lighter.namespace + "-container'>\n    <span class='" + Lighter.namespace + "-content'></span>\n    <a class='" + Lighter.namespace + "-close'>&times;</a>\n    <a class='" + Lighter.namespace + "-prev'>&lsaquo;</a>\n    <a class='" + Lighter.namespace + "-next'>&rsaquo;</a>\n  </div>\n  <div class='" + Lighter.namespace + "-overlay'></div>\n</div>"
62    };
63
64    Lighter.lighter = function($target, options) {
65      var data;
66      if (options == null) {
67        options = {};
68      }
69      data = $target.data('_lighter');
70      if (!data) {
71        $target.data('_lighter', data = new Lighter($target, options));
72      }
73      return data;
74    };
75
76    Lighter.prototype.$ = function(selector) {
77      return this.$el.find(selector);
78    };
79
80    function Lighter($target, settings) {
81      if (settings == null) {
82        settings = {};
83      }
84      this.show = __bind(this.show, this);
85      this.hide = __bind(this.hide, this);
86      this.observe = __bind(this.observe, this);
87      this.keyup = __bind(this.keyup, this);
88      this.size = __bind(this.size, this);
89      this.align = __bind(this.align, this);
90      this.resize = __bind(this.resize, this);
91      this.preload = __bind(this.preload, this);
92      this.process = __bind(this.process, this);
93      this.href = __bind(this.href, this);
94      this.type = __bind(this.type, this);
95      this.prev = __bind(this.prev, this);
96      this.next = __bind(this.next, this);
97      this.close = __bind(this.close, this);
98      this.$ = __bind(this.$, this);
99      this.$target = $target;
100      this.settings = $.extend({}, this.defaults, settings);
101      this.$el = $(this.settings.template);
102      this.$overlay = this.$("." + Lighter.namespace + "-overlay");
103      this.$content = this.$("." + Lighter.namespace + "-content");
104      this.$container = this.$("." + Lighter.namespace + "-container");
105      this.$close = this.$("." + Lighter.namespace + "-close");
106      this.$prev = this.$("." + Lighter.namespace + "-prev");
107      this.$next = this.$("." + Lighter.namespace + "-next");
108      this.$body = this.$("." + Lighter.namespace + "-body");
109      this.dimensions = this.settings.dimensions;
110      this.align();
111      this.process();
112    }
113
114    Lighter.prototype.close = function(event) {
115      if (event != null) {
116        event.preventDefault();
117      }
118      if (event != null) {
119        event.stopPropagation();
120      }
121      return this.hide();
122    };
123
124    Lighter.prototype.next = function(event) {
125      if (event != null) {
126        event.preventDefault();
127      }
128      return event != null ? event.stopPropagation() : void 0;
129    };
130
131    Lighter.prototype.prev = function() {
132      if (typeof event !== "undefined" && event !== null) {
133        event.preventDefault();
134      }
135      return typeof event !== "undefined" && event !== null ? event.stopPropagation() : void 0;
136    };
137
138    Lighter.prototype.type = function(href) {
139      if (href == null) {
140        href = this.href();
141      }
142      return this.settings.type || (this.href().match(/\.(webp|jpeg|jpg|jpe|gif|png|bmp)$/i) ? "image" : void 0);
143    };
144
145    Lighter.prototype.href = function() {
146      return this.$target.attr("href");
147    };
148
149    Lighter.prototype.process = function() {
150      var href, type;
151      type = this.type(href = this.href());
152      this.$content.html((function() {
153        switch (type) {
154          case "image":
155            return $("<img />").attr({
156              src: href
157            });
158          default:
159            return $(href);
160        }
161      })());
162      switch (type) {
163        case "image":
164          return this.preload(href);
165      }
166    };
167
168    Lighter.prototype.preload = function(href) {
169      var image;
170      image = new Image();
171      image.src = href;
172      return image.onload = (function(_this) {
173        return function() {
174          return _this.resize({
175            width: image.width,
176            height: image.height
177          });
178        };
179      })(this);
180    };
181
182    Lighter.prototype.resize = function(dimensions) {
183      this.dimensions = dimensions;
184      return this.align();
185    };
186
187    Lighter.prototype.align = function() {
188      var size;
189      size = this.size();
190      return this.$container.css({
191        height: size.height,
192        width: size.width,
193        margin: "-" + (size.height / 2) + "px -" + (size.width / 2) + "px"
194      });
195    };
196
197    Lighter.prototype.size = function() {
198      var ratio;
199      ratio = Math.max(this.dimensions.height / ($(window).height() - this.settings.padding), this.dimensions.width / ($(window).width() - this.settings.padding));
200      return {
201        width: ratio > 1.0 ? Math.round(this.dimensions.width / ratio) : this.dimensions.width,
202        height: ratio > 1.0 ? Math.round(this.dimensions.height / ratio) : this.dimensions.height
203      };
204    };
205
206    Lighter.prototype.keyup = function(event) {
207      if (event.target.form != null) {
208        return;
209      }
210      if (event.which === 27) {
211        this.close();
212      }
213      if (event.which === 37) {
214        this.prev();
215      }
216      if (event.which === 39) {
217        return this.next();
218      }
219    };
220
221    Lighter.prototype.observe = function(method) {
222      if (method == null) {
223        method = 'on';
224      }
225      $(window)[method]("resize", this.align);
226      $(document)[method]("keyup", this.keyup);
227      this.$overlay[method]("click", this.close);
228      this.$close[method]("click", this.close);
229      this.$next[method]("click", this.next);
230      return this.$prev[method]("click", this.prev);
231    };
232
233    Lighter.prototype.hide = function() {
234      var alpha, omega;
235      alpha = (function(_this) {
236        return function() {
237          return _this.observe('off');
238        };
239      })(this);
240      omega = (function(_this) {
241        return function() {
242          return _this.$el.remove();
243        };
244      })(this);
245      alpha();
246      this.$el.removeClass('fade');
247      this.$el.position();
248      this.$el.addClass('fade');
249      return Animation.execute(this.$el, omega);
250    };
251
252    Lighter.prototype.show = function() {
253      var alpha, omega;
254      omega = (function(_this) {
255        return function() {
256          return _this.observe('on');
257        };
258      })(this);
259      alpha = (function(_this) {
260        return function() {
261          return $(document.body).append(_this.$el);
262        };
263      })(this);
264      alpha();
265      this.$el.addClass('fade');
266      this.$el.position();
267      this.$el.removeClass('fade');
268      return Animation.execute(this.$el, omega);
269    };
270
271    return Lighter;
272
273  })();
274
275  $.fn.extend({
276    lighter: function(option) {
277      if (option == null) {
278        option = {};
279      }
280      return this.each(function() {
281        var $this, action, options;
282        $this = $(this);
283        options = $.extend({}, $.fn.lighter.defaults, typeof option === "object" && option);
284        action = typeof option === "string" ? option : option.action;
285        if (action == null) {
286          action = "show";
287        }
288        return Lighter.lighter($this, options)[action]();
289      });
290    }
291  });
292
293  $(document).on("click", "[data-lighter]", function(event) {
294    event.preventDefault();
295    event.stopPropagation();
296    return $(this).lighter();
297  });
298
299}).call(this);