materialize-sass 0.100.2.1 → 1.0.0.alpha1
Sign up to get free protection for your applications and to get access to all the features.
- checksums.yaml +5 -5
- data/README.md +18 -42
- data/Rakefile +17 -17
- data/{app/assets → assets}/javascripts/materialize-sprockets.js +8 -12
- data/assets/javascripts/materialize.js +11877 -0
- data/assets/javascripts/materialize/autocomplete.js +420 -0
- data/assets/javascripts/materialize/buttons.js +388 -0
- data/assets/javascripts/materialize/cards.js +28 -0
- data/assets/javascripts/materialize/carousel.js +791 -0
- data/assets/javascripts/materialize/cash.js +992 -0
- data/assets/javascripts/materialize/characterCounter.js +180 -0
- data/assets/javascripts/materialize/chips.js +555 -0
- data/assets/javascripts/materialize/collapsible.js +275 -0
- data/assets/javascripts/materialize/datepicker.js +898 -0
- data/assets/javascripts/materialize/dropdown.js +530 -0
- data/{app/assets → assets}/javascripts/materialize/extras/nouislider.js +1 -1
- data/{app/assets → assets}/javascripts/materialize/extras/nouislider.min.js +1 -1
- data/assets/javascripts/materialize/forms.js +223 -0
- data/assets/javascripts/materialize/global.js +353 -0
- data/assets/javascripts/materialize/materialbox.js +432 -0
- data/{app/assets → assets}/javascripts/materialize/modal.js +82 -113
- data/assets/javascripts/materialize/parallax.js +135 -0
- data/assets/javascripts/materialize/pushpin.js +158 -0
- data/assets/javascripts/materialize/range.js +305 -0
- data/assets/javascripts/materialize/scrollspy.js +322 -0
- data/assets/javascripts/materialize/select.js +426 -0
- data/assets/javascripts/materialize/sidenav.js +584 -0
- data/assets/javascripts/materialize/slider.js +383 -0
- data/assets/javascripts/materialize/tabs.js +460 -0
- data/assets/javascripts/materialize/tapTarget.js +347 -0
- data/assets/javascripts/materialize/timepicker.js +616 -0
- data/{app/assets → assets}/javascripts/materialize/toasts.js +42 -46
- data/assets/javascripts/materialize/tooltip.js +325 -0
- data/assets/javascripts/materialize/velocity.min.js +782 -0
- data/{app/assets → assets}/javascripts/materialize/waves.js +0 -0
- data/{app/assets → assets}/stylesheets/materialize.scss +5 -6
- data/{app/assets → assets}/stylesheets/materialize/components/_badges.scss +1 -1
- data/{app/assets → assets}/stylesheets/materialize/components/_buttons.scss +34 -2
- data/{app/assets → assets}/stylesheets/materialize/components/_cards.scss +0 -0
- data/{app/assets → assets}/stylesheets/materialize/components/_carousel.scss +1 -1
- data/{app/assets → assets}/stylesheets/materialize/components/_chips.scss +6 -5
- data/{app/assets → assets}/stylesheets/materialize/components/_collapsible.scss +3 -3
- data/{app/assets → assets}/stylesheets/materialize/components/_color.scss +0 -0
- data/assets/stylesheets/materialize/components/_datepicker.scss +180 -0
- data/{app/assets → assets}/stylesheets/materialize/components/_dropdown.scss +16 -15
- data/{app/assets → assets}/stylesheets/materialize/components/_global.scss +49 -14
- data/{app/assets → assets}/stylesheets/materialize/components/_grid.scss +1 -1
- data/{app/assets → assets}/stylesheets/materialize/components/_icons-material-design.scss +0 -0
- data/{app/assets → assets}/stylesheets/materialize/components/_materialbox.scss +0 -0
- data/assets/stylesheets/materialize/components/_mixins.scss +5 -0
- data/{app/assets → assets}/stylesheets/materialize/components/_modal.scss +1 -1
- data/{app/assets → assets}/stylesheets/materialize/components/_navbar.scss +0 -0
- data/assets/stylesheets/materialize/components/_normalize.scss +447 -0
- data/{app/assets → assets}/stylesheets/materialize/components/_preloader.scss +0 -0
- data/{app/assets → assets}/stylesheets/materialize/components/_pulse.scss +0 -0
- data/{app/assets/stylesheets/materialize/components/_sideNav.scss → assets/stylesheets/materialize/components/_sidenav.scss} +23 -21
- data/{app/assets → assets}/stylesheets/materialize/components/_slider.scss +0 -0
- data/{app/assets → assets}/stylesheets/materialize/components/_table_of_contents.scss +3 -3
- data/{app/assets → assets}/stylesheets/materialize/components/_tabs.scss +2 -2
- data/{app/assets → assets}/stylesheets/materialize/components/_tapTarget.scss +0 -0
- data/assets/stylesheets/materialize/components/_timepicker.scss +182 -0
- data/{app/assets → assets}/stylesheets/materialize/components/_toast.scss +0 -0
- data/{app/assets → assets}/stylesheets/materialize/components/_tooltip.scss +1 -0
- data/{app/assets → assets}/stylesheets/materialize/components/_transitions.scss +0 -0
- data/{app/assets → assets}/stylesheets/materialize/components/_typography.scss +8 -8
- data/{app/assets → assets}/stylesheets/materialize/components/_variables.scss +42 -44
- data/{app/assets → assets}/stylesheets/materialize/components/_waves.scss +0 -0
- data/{app/assets → assets}/stylesheets/materialize/components/forms/_checkboxes.scss +24 -24
- data/{app/assets → assets}/stylesheets/materialize/components/forms/_file-input.scss +0 -0
- data/{app/assets → assets}/stylesheets/materialize/components/forms/_forms.scss +0 -0
- data/{app/assets → assets}/stylesheets/materialize/components/forms/_input-fields.scss +49 -35
- data/{app/assets → assets}/stylesheets/materialize/components/forms/_radio-buttons.scss +29 -29
- data/{app/assets → assets}/stylesheets/materialize/components/forms/_range.scss +32 -31
- data/{app/assets → assets}/stylesheets/materialize/components/forms/_select.scss +20 -11
- data/{app/assets → assets}/stylesheets/materialize/components/forms/_switches.scss +0 -0
- data/{app/assets → assets}/stylesheets/materialize/extras/nouislider.css +1 -1
- data/lib/materialize-sass.rb +13 -23
- data/lib/materialize-sass/engine.rb +6 -9
- data/lib/materialize-sass/version.rb +1 -1
- data/materialize-sass.gemspec +2 -1
- metadata +97 -97
- data/app/assets/fonts/roboto/Roboto-Bold.woff +0 -0
- data/app/assets/fonts/roboto/Roboto-Bold.woff2 +0 -0
- data/app/assets/fonts/roboto/Roboto-Light.woff +0 -0
- data/app/assets/fonts/roboto/Roboto-Light.woff2 +0 -0
- data/app/assets/fonts/roboto/Roboto-Medium.woff +0 -0
- data/app/assets/fonts/roboto/Roboto-Medium.woff2 +0 -0
- data/app/assets/fonts/roboto/Roboto-Regular.woff +0 -0
- data/app/assets/fonts/roboto/Roboto-Regular.woff2 +0 -0
- data/app/assets/fonts/roboto/Roboto-Thin.woff +0 -0
- data/app/assets/fonts/roboto/Roboto-Thin.woff2 +0 -0
- data/app/assets/javascripts/materialize.js +0 -10021
- data/app/assets/javascripts/materialize/animation.js +0 -7
- data/app/assets/javascripts/materialize/buttons.js +0 -253
- data/app/assets/javascripts/materialize/cards.js +0 -28
- data/app/assets/javascripts/materialize/carousel.js +0 -543
- data/app/assets/javascripts/materialize/character_counter.js +0 -64
- data/app/assets/javascripts/materialize/chips.js +0 -315
- data/app/assets/javascripts/materialize/collapsible.js +0 -178
- data/app/assets/javascripts/materialize/date_picker/picker.date.js +0 -1399
- data/app/assets/javascripts/materialize/date_picker/picker.js +0 -1196
- data/app/assets/javascripts/materialize/date_picker/picker.time.js +0 -646
- data/app/assets/javascripts/materialize/dropdown.js +0 -257
- data/app/assets/javascripts/materialize/forms.js +0 -806
- data/app/assets/javascripts/materialize/global.js +0 -170
- data/app/assets/javascripts/materialize/hammer.min.js +0 -424
- data/app/assets/javascripts/materialize/initial.js +0 -10
- data/app/assets/javascripts/materialize/jquery.easing.1.4.js +0 -144
- data/app/assets/javascripts/materialize/jquery.hammer.js +0 -33
- data/app/assets/javascripts/materialize/materialbox.js +0 -263
- data/app/assets/javascripts/materialize/parallax.js +0 -54
- data/app/assets/javascripts/materialize/pushpin.js +0 -68
- data/app/assets/javascripts/materialize/scrollFire.js +0 -49
- data/app/assets/javascripts/materialize/scrollspy.js +0 -230
- data/app/assets/javascripts/materialize/sideNav.js +0 -395
- data/app/assets/javascripts/materialize/slider.js +0 -295
- data/app/assets/javascripts/materialize/tabs.js +0 -244
- data/app/assets/javascripts/materialize/tapTarget.js +0 -184
- data/app/assets/javascripts/materialize/tooltip.js +0 -227
- data/app/assets/javascripts/materialize/transitions.js +0 -163
- data/app/assets/javascripts/materialize/velocity.min.js +0 -626
- data/app/assets/stylesheets/materialize/components/_normalize.scss +0 -424
- data/app/assets/stylesheets/materialize/components/_roboto.scss +0 -39
- data/app/assets/stylesheets/materialize/components/date_picker/_default.date.scss +0 -469
- data/app/assets/stylesheets/materialize/components/date_picker/_default.scss +0 -216
- data/app/assets/stylesheets/materialize/components/date_picker/_default.time.scss +0 -267
@@ -1,144 +0,0 @@
|
|
1
|
-
/*
|
2
|
-
* jQuery Easing v1.4.0 - http://gsgd.co.uk/sandbox/jquery/easing/
|
3
|
-
* Open source under the BSD License.
|
4
|
-
* Copyright © 2008 George McGinley Smith
|
5
|
-
* All rights reserved.
|
6
|
-
* https://raw.github.com/gdsmith/jquery-easing/master/LICENSE
|
7
|
-
*/
|
8
|
-
|
9
|
-
(function (factory) {
|
10
|
-
if (typeof define === "function" && define.amd) {
|
11
|
-
define(['jquery'], function ($) {
|
12
|
-
return factory($);
|
13
|
-
});
|
14
|
-
} else if (typeof module === "object" && typeof module.exports === "object") {
|
15
|
-
exports = factory(require('jquery'));
|
16
|
-
} else {
|
17
|
-
factory(jQuery);
|
18
|
-
}
|
19
|
-
})(function ($) {
|
20
|
-
|
21
|
-
// Preserve the original jQuery "swing" easing as "jswing"
|
22
|
-
$.easing['jswing'] = $.easing['swing'];
|
23
|
-
|
24
|
-
var pow = Math.pow,
|
25
|
-
sqrt = Math.sqrt,
|
26
|
-
sin = Math.sin,
|
27
|
-
cos = Math.cos,
|
28
|
-
PI = Math.PI,
|
29
|
-
c1 = 1.70158,
|
30
|
-
c2 = c1 * 1.525,
|
31
|
-
c3 = c1 + 1,
|
32
|
-
c4 = 2 * PI / 3,
|
33
|
-
c5 = 2 * PI / 4.5;
|
34
|
-
|
35
|
-
// x is the fraction of animation progress, in the range 0..1
|
36
|
-
function bounceOut(x) {
|
37
|
-
var n1 = 7.5625,
|
38
|
-
d1 = 2.75;
|
39
|
-
if (x < 1 / d1) {
|
40
|
-
return n1 * x * x;
|
41
|
-
} else if (x < 2 / d1) {
|
42
|
-
return n1 * (x -= 1.5 / d1) * x + .75;
|
43
|
-
} else if (x < 2.5 / d1) {
|
44
|
-
return n1 * (x -= 2.25 / d1) * x + .9375;
|
45
|
-
} else {
|
46
|
-
return n1 * (x -= 2.625 / d1) * x + .984375;
|
47
|
-
}
|
48
|
-
}
|
49
|
-
|
50
|
-
$.extend($.easing, {
|
51
|
-
def: 'easeOutQuad',
|
52
|
-
swing: function (x) {
|
53
|
-
return $.easing[$.easing.def](x);
|
54
|
-
},
|
55
|
-
easeInQuad: function (x) {
|
56
|
-
return x * x;
|
57
|
-
},
|
58
|
-
easeOutQuad: function (x) {
|
59
|
-
return 1 - (1 - x) * (1 - x);
|
60
|
-
},
|
61
|
-
easeInOutQuad: function (x) {
|
62
|
-
return x < 0.5 ? 2 * x * x : 1 - pow(-2 * x + 2, 2) / 2;
|
63
|
-
},
|
64
|
-
easeInCubic: function (x) {
|
65
|
-
return x * x * x;
|
66
|
-
},
|
67
|
-
easeOutCubic: function (x) {
|
68
|
-
return 1 - pow(1 - x, 3);
|
69
|
-
},
|
70
|
-
easeInOutCubic: function (x) {
|
71
|
-
return x < 0.5 ? 4 * x * x * x : 1 - pow(-2 * x + 2, 3) / 2;
|
72
|
-
},
|
73
|
-
easeInQuart: function (x) {
|
74
|
-
return x * x * x * x;
|
75
|
-
},
|
76
|
-
easeOutQuart: function (x) {
|
77
|
-
return 1 - pow(1 - x, 4);
|
78
|
-
},
|
79
|
-
easeInOutQuart: function (x) {
|
80
|
-
return x < 0.5 ? 8 * x * x * x * x : 1 - pow(-2 * x + 2, 4) / 2;
|
81
|
-
},
|
82
|
-
easeInQuint: function (x) {
|
83
|
-
return x * x * x * x * x;
|
84
|
-
},
|
85
|
-
easeOutQuint: function (x) {
|
86
|
-
return 1 - pow(1 - x, 5);
|
87
|
-
},
|
88
|
-
easeInOutQuint: function (x) {
|
89
|
-
return x < 0.5 ? 16 * x * x * x * x * x : 1 - pow(-2 * x + 2, 5) / 2;
|
90
|
-
},
|
91
|
-
easeInSine: function (x) {
|
92
|
-
return 1 - cos(x * PI / 2);
|
93
|
-
},
|
94
|
-
easeOutSine: function (x) {
|
95
|
-
return sin(x * PI / 2);
|
96
|
-
},
|
97
|
-
easeInOutSine: function (x) {
|
98
|
-
return -(cos(PI * x) - 1) / 2;
|
99
|
-
},
|
100
|
-
easeInExpo: function (x) {
|
101
|
-
return x === 0 ? 0 : pow(2, 10 * x - 10);
|
102
|
-
},
|
103
|
-
easeOutExpo: function (x) {
|
104
|
-
return x === 1 ? 1 : 1 - pow(2, -10 * x);
|
105
|
-
},
|
106
|
-
easeInOutExpo: function (x) {
|
107
|
-
return x === 0 ? 0 : x === 1 ? 1 : x < 0.5 ? pow(2, 20 * x - 10) / 2 : (2 - pow(2, -20 * x + 10)) / 2;
|
108
|
-
},
|
109
|
-
easeInCirc: function (x) {
|
110
|
-
return 1 - sqrt(1 - pow(x, 2));
|
111
|
-
},
|
112
|
-
easeOutCirc: function (x) {
|
113
|
-
return sqrt(1 - pow(x - 1, 2));
|
114
|
-
},
|
115
|
-
easeInOutCirc: function (x) {
|
116
|
-
return x < 0.5 ? (1 - sqrt(1 - pow(2 * x, 2))) / 2 : (sqrt(1 - pow(-2 * x + 2, 2)) + 1) / 2;
|
117
|
-
},
|
118
|
-
easeInElastic: function (x) {
|
119
|
-
return x === 0 ? 0 : x === 1 ? 1 : -pow(2, 10 * x - 10) * sin((x * 10 - 10.75) * c4);
|
120
|
-
},
|
121
|
-
easeOutElastic: function (x) {
|
122
|
-
return x === 0 ? 0 : x === 1 ? 1 : pow(2, -10 * x) * sin((x * 10 - 0.75) * c4) + 1;
|
123
|
-
},
|
124
|
-
easeInOutElastic: function (x) {
|
125
|
-
return x === 0 ? 0 : x === 1 ? 1 : x < 0.5 ? -(pow(2, 20 * x - 10) * sin((20 * x - 11.125) * c5)) / 2 : pow(2, -20 * x + 10) * sin((20 * x - 11.125) * c5) / 2 + 1;
|
126
|
-
},
|
127
|
-
easeInBack: function (x) {
|
128
|
-
return c3 * x * x * x - c1 * x * x;
|
129
|
-
},
|
130
|
-
easeOutBack: function (x) {
|
131
|
-
return 1 + c3 * pow(x - 1, 3) + c1 * pow(x - 1, 2);
|
132
|
-
},
|
133
|
-
easeInOutBack: function (x) {
|
134
|
-
return x < 0.5 ? pow(2 * x, 2) * ((c2 + 1) * 2 * x - c2) / 2 : (pow(2 * x - 2, 2) * ((c2 + 1) * (x * 2 - 2) + c2) + 2) / 2;
|
135
|
-
},
|
136
|
-
easeInBounce: function (x) {
|
137
|
-
return 1 - bounceOut(1 - x);
|
138
|
-
},
|
139
|
-
easeOutBounce: bounceOut,
|
140
|
-
easeInOutBounce: function (x) {
|
141
|
-
return x < 0.5 ? (1 - bounceOut(1 - 2 * x)) / 2 : (1 + bounceOut(2 * x - 1)) / 2;
|
142
|
-
}
|
143
|
-
});
|
144
|
-
});
|
@@ -1,33 +0,0 @@
|
|
1
|
-
(function (factory) {
|
2
|
-
if (typeof define === 'function' && define.amd) {
|
3
|
-
define(['jquery', 'hammerjs'], factory);
|
4
|
-
} else if (typeof exports === 'object') {
|
5
|
-
factory(require('jquery'), require('hammerjs'));
|
6
|
-
} else {
|
7
|
-
factory(jQuery, Hammer);
|
8
|
-
}
|
9
|
-
})(function ($, Hammer) {
|
10
|
-
function hammerify(el, options) {
|
11
|
-
var $el = $(el);
|
12
|
-
if (!$el.data("hammer")) {
|
13
|
-
$el.data("hammer", new Hammer($el[0], options));
|
14
|
-
}
|
15
|
-
}
|
16
|
-
|
17
|
-
$.fn.hammer = function (options) {
|
18
|
-
return this.each(function () {
|
19
|
-
hammerify(this, options);
|
20
|
-
});
|
21
|
-
};
|
22
|
-
|
23
|
-
// extend the emit method to also trigger jQuery events
|
24
|
-
Hammer.Manager.prototype.emit = function (originalEmit) {
|
25
|
-
return function (type, data) {
|
26
|
-
originalEmit.call(this, type, data);
|
27
|
-
$(this.element).trigger({
|
28
|
-
type: type,
|
29
|
-
gesture: data
|
30
|
-
});
|
31
|
-
};
|
32
|
-
}(Hammer.Manager.prototype.emit);
|
33
|
-
});
|
@@ -1,263 +0,0 @@
|
|
1
|
-
(function ($) {
|
2
|
-
|
3
|
-
$.fn.materialbox = function () {
|
4
|
-
|
5
|
-
return this.each(function () {
|
6
|
-
|
7
|
-
if ($(this).hasClass('initialized')) {
|
8
|
-
return;
|
9
|
-
}
|
10
|
-
|
11
|
-
$(this).addClass('initialized');
|
12
|
-
|
13
|
-
var overlayActive = false;
|
14
|
-
var doneAnimating = true;
|
15
|
-
var inDuration = 275;
|
16
|
-
var outDuration = 200;
|
17
|
-
var origin = $(this);
|
18
|
-
var placeholder = $('<div></div>').addClass('material-placeholder');
|
19
|
-
var originalWidth = 0;
|
20
|
-
var originalHeight = 0;
|
21
|
-
var ancestorsChanged;
|
22
|
-
var ancestor;
|
23
|
-
var originInlineStyles = origin.attr('style');
|
24
|
-
origin.wrap(placeholder);
|
25
|
-
|
26
|
-
// Start click handler
|
27
|
-
origin.on('click', function () {
|
28
|
-
var placeholder = origin.parent('.material-placeholder');
|
29
|
-
var windowWidth = window.innerWidth;
|
30
|
-
var windowHeight = window.innerHeight;
|
31
|
-
var originalWidth = origin.width();
|
32
|
-
var originalHeight = origin.height();
|
33
|
-
|
34
|
-
// If already modal, return to original
|
35
|
-
if (doneAnimating === false) {
|
36
|
-
returnToOriginal();
|
37
|
-
return false;
|
38
|
-
} else if (overlayActive && doneAnimating === true) {
|
39
|
-
returnToOriginal();
|
40
|
-
return false;
|
41
|
-
}
|
42
|
-
|
43
|
-
// Set states
|
44
|
-
doneAnimating = false;
|
45
|
-
origin.addClass('active');
|
46
|
-
overlayActive = true;
|
47
|
-
|
48
|
-
// Set positioning for placeholder
|
49
|
-
placeholder.css({
|
50
|
-
width: placeholder[0].getBoundingClientRect().width,
|
51
|
-
height: placeholder[0].getBoundingClientRect().height,
|
52
|
-
position: 'relative',
|
53
|
-
top: 0,
|
54
|
-
left: 0
|
55
|
-
});
|
56
|
-
|
57
|
-
// Find ancestor with overflow: hidden; and remove it
|
58
|
-
ancestorsChanged = undefined;
|
59
|
-
ancestor = placeholder[0].parentNode;
|
60
|
-
var count = 0;
|
61
|
-
while (ancestor !== null && !$(ancestor).is(document)) {
|
62
|
-
var curr = $(ancestor);
|
63
|
-
if (curr.css('overflow') !== 'visible') {
|
64
|
-
curr.css('overflow', 'visible');
|
65
|
-
if (ancestorsChanged === undefined) {
|
66
|
-
ancestorsChanged = curr;
|
67
|
-
} else {
|
68
|
-
ancestorsChanged = ancestorsChanged.add(curr);
|
69
|
-
}
|
70
|
-
}
|
71
|
-
ancestor = ancestor.parentNode;
|
72
|
-
}
|
73
|
-
|
74
|
-
// Set css on origin
|
75
|
-
origin.css({
|
76
|
-
position: 'absolute',
|
77
|
-
'z-index': 1000,
|
78
|
-
'will-change': 'left, top, width, height'
|
79
|
-
}).data('width', originalWidth).data('height', originalHeight);
|
80
|
-
|
81
|
-
// Add overlay
|
82
|
-
var overlay = $('<div id="materialbox-overlay"></div>').css({
|
83
|
-
opacity: 0
|
84
|
-
}).click(function () {
|
85
|
-
if (doneAnimating === true) returnToOriginal();
|
86
|
-
});
|
87
|
-
|
88
|
-
// Put before in origin image to preserve z-index layering.
|
89
|
-
origin.before(overlay);
|
90
|
-
|
91
|
-
// Set dimensions if needed
|
92
|
-
var overlayOffset = overlay[0].getBoundingClientRect();
|
93
|
-
overlay.css({
|
94
|
-
width: windowWidth,
|
95
|
-
height: windowHeight,
|
96
|
-
left: -1 * overlayOffset.left,
|
97
|
-
top: -1 * overlayOffset.top
|
98
|
-
});
|
99
|
-
|
100
|
-
// Animate Overlay
|
101
|
-
overlay.velocity({ opacity: 1 }, { duration: inDuration, queue: false, easing: 'easeOutQuad' });
|
102
|
-
|
103
|
-
// Add and animate caption if it exists
|
104
|
-
if (origin.data('caption') !== "") {
|
105
|
-
var $photo_caption = $('<div class="materialbox-caption"></div>');
|
106
|
-
$photo_caption.text(origin.data('caption'));
|
107
|
-
$('body').append($photo_caption);
|
108
|
-
$photo_caption.css({ "display": "inline" });
|
109
|
-
$photo_caption.velocity({ opacity: 1 }, { duration: inDuration, queue: false, easing: 'easeOutQuad' });
|
110
|
-
}
|
111
|
-
|
112
|
-
// Resize Image
|
113
|
-
var ratio = 0;
|
114
|
-
var widthPercent = originalWidth / windowWidth;
|
115
|
-
var heightPercent = originalHeight / windowHeight;
|
116
|
-
var newWidth = 0;
|
117
|
-
var newHeight = 0;
|
118
|
-
|
119
|
-
if (widthPercent > heightPercent) {
|
120
|
-
ratio = originalHeight / originalWidth;
|
121
|
-
newWidth = windowWidth * 0.9;
|
122
|
-
newHeight = windowWidth * 0.9 * ratio;
|
123
|
-
} else {
|
124
|
-
ratio = originalWidth / originalHeight;
|
125
|
-
newWidth = windowHeight * 0.9 * ratio;
|
126
|
-
newHeight = windowHeight * 0.9;
|
127
|
-
}
|
128
|
-
|
129
|
-
// Animate image + set z-index
|
130
|
-
if (origin.hasClass('responsive-img')) {
|
131
|
-
origin.velocity({ 'max-width': newWidth, 'width': originalWidth }, { duration: 0, queue: false,
|
132
|
-
complete: function () {
|
133
|
-
origin.css({ left: 0, top: 0 }).velocity({
|
134
|
-
height: newHeight,
|
135
|
-
width: newWidth,
|
136
|
-
left: $(document).scrollLeft() + windowWidth / 2 - origin.parent('.material-placeholder').offset().left - newWidth / 2,
|
137
|
-
top: $(document).scrollTop() + windowHeight / 2 - origin.parent('.material-placeholder').offset().top - newHeight / 2
|
138
|
-
}, {
|
139
|
-
duration: inDuration,
|
140
|
-
queue: false,
|
141
|
-
easing: 'easeOutQuad',
|
142
|
-
complete: function () {
|
143
|
-
doneAnimating = true;
|
144
|
-
}
|
145
|
-
});
|
146
|
-
} // End Complete
|
147
|
-
}); // End Velocity
|
148
|
-
} else {
|
149
|
-
origin.css('left', 0).css('top', 0).velocity({
|
150
|
-
height: newHeight,
|
151
|
-
width: newWidth,
|
152
|
-
left: $(document).scrollLeft() + windowWidth / 2 - origin.parent('.material-placeholder').offset().left - newWidth / 2,
|
153
|
-
top: $(document).scrollTop() + windowHeight / 2 - origin.parent('.material-placeholder').offset().top - newHeight / 2
|
154
|
-
}, {
|
155
|
-
duration: inDuration,
|
156
|
-
queue: false,
|
157
|
-
easing: 'easeOutQuad',
|
158
|
-
complete: function () {
|
159
|
-
doneAnimating = true;
|
160
|
-
}
|
161
|
-
}); // End Velocity
|
162
|
-
}
|
163
|
-
|
164
|
-
// Handle Exit triggers
|
165
|
-
$(window).on('scroll.materialbox', function () {
|
166
|
-
if (overlayActive) {
|
167
|
-
returnToOriginal();
|
168
|
-
}
|
169
|
-
});
|
170
|
-
|
171
|
-
$(window).on('resize.materialbox', function () {
|
172
|
-
if (overlayActive) {
|
173
|
-
returnToOriginal();
|
174
|
-
}
|
175
|
-
});
|
176
|
-
|
177
|
-
$(document).on('keyup.materialbox', function (e) {
|
178
|
-
// ESC key
|
179
|
-
if (e.keyCode === 27 && doneAnimating === true && overlayActive) {
|
180
|
-
returnToOriginal();
|
181
|
-
}
|
182
|
-
});
|
183
|
-
}); // End click handler
|
184
|
-
|
185
|
-
|
186
|
-
// This function returns the modaled image to the original spot
|
187
|
-
function returnToOriginal() {
|
188
|
-
|
189
|
-
doneAnimating = false;
|
190
|
-
|
191
|
-
var placeholder = origin.parent('.material-placeholder');
|
192
|
-
var windowWidth = window.innerWidth;
|
193
|
-
var windowHeight = window.innerHeight;
|
194
|
-
var originalWidth = origin.data('width');
|
195
|
-
var originalHeight = origin.data('height');
|
196
|
-
|
197
|
-
origin.velocity("stop", true);
|
198
|
-
$('#materialbox-overlay').velocity("stop", true);
|
199
|
-
$('.materialbox-caption').velocity("stop", true);
|
200
|
-
|
201
|
-
// disable exit handlers
|
202
|
-
$(window).off('scroll.materialbox');
|
203
|
-
$(document).off('keyup.materialbox');
|
204
|
-
$(window).off('resize.materialbox');
|
205
|
-
|
206
|
-
$('#materialbox-overlay').velocity({ opacity: 0 }, {
|
207
|
-
duration: outDuration, // Delay prevents animation overlapping
|
208
|
-
queue: false, easing: 'easeOutQuad',
|
209
|
-
complete: function () {
|
210
|
-
// Remove Overlay
|
211
|
-
overlayActive = false;
|
212
|
-
$(this).remove();
|
213
|
-
}
|
214
|
-
});
|
215
|
-
|
216
|
-
// Resize Image
|
217
|
-
origin.velocity({
|
218
|
-
width: originalWidth,
|
219
|
-
height: originalHeight,
|
220
|
-
left: 0,
|
221
|
-
top: 0
|
222
|
-
}, {
|
223
|
-
duration: outDuration,
|
224
|
-
queue: false, easing: 'easeOutQuad',
|
225
|
-
complete: function () {
|
226
|
-
placeholder.css({
|
227
|
-
height: '',
|
228
|
-
width: '',
|
229
|
-
position: '',
|
230
|
-
top: '',
|
231
|
-
left: ''
|
232
|
-
});
|
233
|
-
|
234
|
-
origin.removeAttr('style');
|
235
|
-
origin.attr('style', originInlineStyles);
|
236
|
-
|
237
|
-
// Remove class
|
238
|
-
origin.removeClass('active');
|
239
|
-
doneAnimating = true;
|
240
|
-
|
241
|
-
// Remove overflow overrides on ancestors
|
242
|
-
if (ancestorsChanged) {
|
243
|
-
ancestorsChanged.css('overflow', '');
|
244
|
-
}
|
245
|
-
}
|
246
|
-
});
|
247
|
-
|
248
|
-
// Remove Caption + reset css settings on image
|
249
|
-
$('.materialbox-caption').velocity({ opacity: 0 }, {
|
250
|
-
duration: outDuration, // Delay prevents animation overlapping
|
251
|
-
queue: false, easing: 'easeOutQuad',
|
252
|
-
complete: function () {
|
253
|
-
$(this).remove();
|
254
|
-
}
|
255
|
-
});
|
256
|
-
}
|
257
|
-
});
|
258
|
-
};
|
259
|
-
|
260
|
-
$(document).on('ready turbolinks:load', function () {
|
261
|
-
$('.materialboxed').materialbox();
|
262
|
-
});
|
263
|
-
})(jQuery);
|