1 | (function ($) {
|
2 |
|
3 | Materialize.fadeInImage = function(selectorOrEl) {
|
4 | var element;
|
5 | if (typeof(selectorOrEl) === 'string') {
|
6 | element = $(selectorOrEl);
|
7 | } else if (typeof(selectorOrEl) === 'object') {
|
8 | element = selectorOrEl;
|
9 | } else {
|
10 | return;
|
11 | }
|
12 | element.css({opacity: 0});
|
13 | $(element).velocity({opacity: 1}, {
|
14 | duration: 650,
|
15 | queue: false,
|
16 | easing: 'easeOutSine'
|
17 | });
|
18 | $(element).velocity({opacity: 1}, {
|
19 | duration: 1300,
|
20 | queue: false,
|
21 | easing: 'swing',
|
22 | step: function(now, fx) {
|
23 | fx.start = 100;
|
24 | var grayscale_setting = now/100;
|
25 | var brightness_setting = 150 - (100 - now)/1.75;
|
26 |
|
27 | if (brightness_setting < 100) {
|
28 | brightness_setting = 100;
|
29 | }
|
30 | if (now >= 0) {
|
31 | $(this).css({
|
32 | "-webkit-filter": "grayscale("+grayscale_setting+")" + "brightness("+brightness_setting+"%)",
|
33 | "filter": "grayscale("+grayscale_setting+")" + "brightness("+brightness_setting+"%)"
|
34 | });
|
35 | }
|
36 | }
|
37 | });
|
38 | };
|
39 |
|
40 |
|
41 | Materialize.showStaggeredList = function(selectorOrEl) {
|
42 | var element;
|
43 | if (typeof(selectorOrEl) === 'string') {
|
44 | element = $(selectorOrEl);
|
45 | } else if (typeof(selectorOrEl) === 'object') {
|
46 | element = selectorOrEl;
|
47 | } else {
|
48 | return;
|
49 | }
|
50 | var time = 0;
|
51 | element.find('li').velocity(
|
52 | { translateX: "-100px"},
|
53 | { duration: 0 });
|
54 |
|
55 | element.find('li').each(function() {
|
56 | $(this).velocity(
|
57 | { opacity: "1", translateX: "0"},
|
58 | { duration: 800, delay: time, easing: [60, 10] });
|
59 | time += 120;
|
60 | });
|
61 | };
|
62 |
|
63 |
|
64 | $(document).ready(function() {
|
65 |
|
66 |
|
67 |
|
68 |
|
69 |
|
70 |
|
71 |
|
72 |
|
73 |
|
74 |
|
75 |
|
76 |
|
77 |
|
78 |
|
79 |
|
80 |
|
81 | var swipeLeft = false;
|
82 | var swipeRight = false;
|
83 |
|
84 |
|
85 |
|
86 | $('.dismissable').each(function() {
|
87 | $(this).hammer({
|
88 | prevent_default: false
|
89 | }).bind('pan', function(e) {
|
90 | if (e.gesture.pointerType === "touch") {
|
91 | var $this = $(this);
|
92 | var direction = e.gesture.direction;
|
93 | var x = e.gesture.deltaX;
|
94 | var velocityX = e.gesture.velocityX;
|
95 |
|
96 | $this.velocity({ translateX: x
|
97 | }, {duration: 50, queue: false, easing: 'easeOutQuad'});
|
98 |
|
99 |
|
100 | if (direction === 4 && (x > ($this.innerWidth() / 2) || velocityX < -0.75)) {
|
101 | swipeLeft = true;
|
102 | }
|
103 |
|
104 |
|
105 | if (direction === 2 && (x < (-1 * $this.innerWidth() / 2) || velocityX > 0.75)) {
|
106 | swipeRight = true;
|
107 | }
|
108 | }
|
109 | }).bind('panend', function(e) {
|
110 |
|
111 | if (Math.abs(e.gesture.deltaX) < ($(this).innerWidth() / 2)) {
|
112 | swipeRight = false;
|
113 | swipeLeft = false;
|
114 | }
|
115 |
|
116 | if (e.gesture.pointerType === "touch") {
|
117 | var $this = $(this);
|
118 | if (swipeLeft || swipeRight) {
|
119 | var fullWidth;
|
120 | if (swipeLeft) { fullWidth = $this.innerWidth(); }
|
121 | else { fullWidth = -1 * $this.innerWidth(); }
|
122 |
|
123 | $this.velocity({ translateX: fullWidth,
|
124 | }, {duration: 100, queue: false, easing: 'easeOutQuad', complete:
|
125 | function() {
|
126 | $this.css('border', 'none');
|
127 | $this.velocity({ height: 0, padding: 0,
|
128 | }, {duration: 200, queue: false, easing: 'easeOutQuad', complete:
|
129 | function() { $this.remove(); }
|
130 | });
|
131 | }
|
132 | });
|
133 | }
|
134 | else {
|
135 | $this.velocity({ translateX: 0,
|
136 | }, {duration: 100, queue: false, easing: 'easeOutQuad'});
|
137 | }
|
138 | swipeLeft = false;
|
139 | swipeRight = false;
|
140 | }
|
141 | });
|
142 |
|
143 | });
|
144 |
|
145 |
|
146 |
|
147 |
|
148 |
|
149 |
|
150 |
|
151 |
|
152 |
|
153 |
|
154 |
|
155 |
|
156 |
|
157 |
|
158 |
|
159 |
|
160 |
|
161 |
|
162 |
|
163 |
|
164 |
|
165 |
|
166 |
|
167 |
|
168 | });
|
169 | }( jQuery ));
|