Skip to content

Commit a258b57

Browse files
flovilmartflovilmart
committed
removes lazyload.html, puts all js together
1 parent 3be8a30 commit a258b57

File tree

7 files changed

+410
-1602
lines changed

7 files changed

+410
-1602
lines changed

‎_app/UI.js

+259
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,259 @@
1+
var svgNamespace = 'http://www.w3.org/2000/svg';
2+
3+
// Wrapped to provide tag vs svgTag methods
4+
var createElement = function(name, attr, children, svg) {
5+
var tag;
6+
if (svg) {
7+
tag = document.createElementNS(svgNamespace, name);
8+
} else {
9+
tag = document.createElement(name);
10+
}
11+
// We apply attributes after children so that we can set the value of
12+
// a select tag at render time
13+
if (children) {
14+
if (!Array.isArray(children)) {
15+
children = [ children ];
16+
}
17+
for (var i = 0; i < children.length; i++) {
18+
var node = children[i];
19+
if (typeof node === 'string' || typeof node === 'number') {
20+
node = document.createTextNode(node);
21+
}
22+
if (node) {
23+
// Allow falsy entries to be ignored
24+
tag.appendChild(node);
25+
}
26+
}
27+
}
28+
if (attr) {
29+
for (var a in attr) {
30+
if (a === 'style') {
31+
for (var s in attr[a]) {
32+
tag.style[s] = attr[a][s];
33+
}
34+
} else if (a.indexOf('data-') === 0 || svg) {
35+
tag.setAttribute(a, attr[a]);
36+
} else {
37+
tag[a] = attr[a];
38+
}
39+
}
40+
}
41+
return tag;
42+
};
43+
44+
var UI = {
45+
// DOM construction methods
46+
tag: function(name, attr, children) {
47+
return createElement(name, attr, children, false);
48+
},
49+
50+
svgTag: function(name, attr, children) {
51+
return createElement(name, attr, children, true);
52+
},
53+
54+
createIcon: function(icon) {
55+
var i = document.createElement('i');
56+
i.className = 'icon_' + icon;
57+
return i;
58+
},
59+
60+
createTooltip: function(text, options) {
61+
var className = 'tooltip_wrap';
62+
switch (options.direction) {
63+
case 'left':
64+
className += ' to_left';
65+
break;
66+
case 'top-left':
67+
className += ' to_top_left';
68+
break;
69+
case 'top-right':
70+
className += ' to_top_right';
71+
break;
72+
}
73+
return UI.tag('span', { className: className }, [
74+
UI.tag('span', { className: 'tip' }, text)
75+
]);
76+
},
77+
78+
// DOM property methods
79+
hasAncestor: function(node, ancestor) {
80+
var cur = node.parentNode;
81+
while (cur) {
82+
if (cur === ancestor) {
83+
return true;
84+
}
85+
cur = cur.parentNode;
86+
}
87+
return false;
88+
},
89+
90+
addClass: function(node, className) {
91+
var re = new RegExp('\\b' + className + '\\b');
92+
if (!node.className.match(re)) {
93+
node.className += ' ' + className;
94+
}
95+
},
96+
97+
removeClass: function(node, className) {
98+
var re = new RegExp('\\s*\\b' + className + '\\b', 'g');
99+
node.className = node.className.replace(re, '');
100+
},
101+
102+
toggleClass: function(node, className, add) {
103+
if (add === undefined) {
104+
add = !UI.hasClass(node, className);
105+
}
106+
107+
if (add) {
108+
UI.addClass(node, className);
109+
} else {
110+
UI.removeClass(node, className);
111+
}
112+
},
113+
114+
hasClass: function(node, className) {
115+
var re = new RegExp('\\b' + className + '\\b');
116+
return !!node.className.match(re);
117+
},
118+
119+
getStyle: function(node, prop) {
120+
if (node.currentStyle)
121+
return node.currentStyle[styleProp];
122+
if (window.getComputedStyle)
123+
return document.defaultView.getComputedStyle(node, null).getPropertyValue(prop);
124+
return '';
125+
},
126+
127+
documentPosition: function(node) {
128+
var pos = { x: 0, y: 0 };
129+
var cur = node;
130+
while (cur) {
131+
pos.x += cur.offsetLeft;
132+
pos.y += cur.offsetTop;
133+
cur = cur.offsetParent;
134+
}
135+
return pos;
136+
},
137+
138+
windowPosition: function(node) {
139+
var pos = UI.documentPosition(node);
140+
pos.x -= window.scrollX;
141+
pos.y -= window.scrollY;
142+
return pos;
143+
},
144+
145+
// DOM event methods
146+
delegate: function(event, parent, selector, cb) {
147+
if (event === 'focus' || event === 'blur') {
148+
// Focus and blur don't bubble
149+
throw 'Focus and blur delegation are not yet supported';
150+
}
151+
var matches = function() { return false; };
152+
if (typeof selector === 'string') {
153+
selector = selector.toUpperCase();
154+
matches = function(el) {
155+
return el.tagName === selector;
156+
};
157+
} else {
158+
if (selector.className) {
159+
var re = new RegExp('\\b' + selector.className + '\\b');
160+
matches = function(el) {
161+
return el.className.match(re);
162+
};
163+
} else if (selector.id) {
164+
matches = function(el) {
165+
return el.id === selector.id;
166+
};
167+
}
168+
}
169+
parent.addEventListener(event, function(e) {
170+
var node = e.target;
171+
while (node && node !== document) {
172+
if (matches(node)) {
173+
cb.call(node, e);
174+
}
175+
node = node.parentNode;
176+
}
177+
});
178+
},
179+
180+
// formatting methods
181+
prettyNumber: function(num) {
182+
var pre;
183+
var places = Math.ceil(Math.log(Math.abs(num) + 1) / Math.LN10);
184+
if (places > 6 && places < 10) {
185+
pre = (num / 1e6);
186+
if ((pre|0) === pre || Math.round(num % 1e6 / 1e5) === 0) {
187+
return (pre|0) + 'M';
188+
} else {
189+
return (pre|0) + '.' + Math.round(num % 1e6 / 1e5) + 'M';
190+
}
191+
} else if (places > 5) {
192+
pre = (num / 1000);
193+
if ((pre|0) === pre || Math.round(num % 1000 / 100) === 0) {
194+
return (pre|0) + 'K';
195+
} else {
196+
return (pre|0) + '.' + Math.round(num % 1000 / 100) + 'K';
197+
}
198+
} else if (places > 3) {
199+
var post = ((num % 1000)|0);
200+
if (post < 10) {
201+
post = '00' + post;
202+
} else if (post < 100) {
203+
post = '0' + post;
204+
}
205+
return ((num / 1000)|0) + ',' + post;
206+
} else {
207+
return (num|0) + '';
208+
}
209+
},
210+
211+
// animation methods
212+
Animate: {
213+
// The show and hide functions require a "transition: 'opacity' delay"
214+
// CSS class to be present on the element
215+
show: function(el, delay) {
216+
if (delay === 'undefined') {
217+
delay = 0;
218+
}
219+
el.style.display = 'block';
220+
el.style.opacity = 0;
221+
setTimeout(function() {
222+
el.style.opacity = 1;
223+
}, delay);
224+
},
225+
226+
hide: function(el, delay) {
227+
if (window.getComputedStyle(el).opacity > 0) {
228+
if (typeof delay === 'undefined') {
229+
delay = 500;
230+
}
231+
el.style.opacity = 0;
232+
setTimeout(function() {
233+
el.style.display = 'none';
234+
}, delay);
235+
}
236+
}
237+
},
238+
239+
// Methods inherited by components
240+
ComponentProto: {
241+
attach: function(parent) {
242+
if (this.node) {
243+
parent.appendChild(this.node);
244+
return this;
245+
}
246+
return null;
247+
},
248+
249+
remove: function() {
250+
if (this.node && this.node.parentNode) {
251+
this.node.parentNode.removeChild(this.node);
252+
return this;
253+
}
254+
return null;
255+
}
256+
}
257+
};
258+
259+
module.exports = UI;

‎_app/echo.js

+117
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,117 @@
1+
'use strict';
2+
var root = window;
3+
var echo = {};
4+
var callback = function () {};
5+
var offset, poll, delay, useDebounce, unload;
6+
var isHidden = function (element) {
7+
return (element.offsetParent === null);
8+
};
9+
10+
var inView = function (element, view) {
11+
if (isHidden(element)) {
12+
return false;
13+
}
14+
15+
var box = element.getBoundingClientRect();
16+
return (box.right >= view.l && box.bottom >= view.t && box.left <= view.r && box.top <= view.b);
17+
};
18+
19+
var debounceOrThrottle = function () {
20+
if(!useDebounce && !!poll) {
21+
return;
22+
}
23+
clearTimeout(poll);
24+
poll = setTimeout(function(){
25+
echo.render();
26+
poll = null;
27+
}, delay);
28+
};
29+
30+
echo.init = function (opts) {
31+
opts = opts || {};
32+
var offsetAll = opts.offset || 0;
33+
var offsetVertical = opts.offsetVertical || offsetAll;
34+
var offsetHorizontal = opts.offsetHorizontal || offsetAll;
35+
var optionToInt = function (opt, fallback) {
36+
return parseInt(opt || fallback, 10);
37+
};
38+
offset = {
39+
t: optionToInt(opts.offsetTop, offsetVertical),
40+
b: optionToInt(opts.offsetBottom, offsetVertical),
41+
l: optionToInt(opts.offsetLeft, offsetHorizontal),
42+
r: optionToInt(opts.offsetRight, offsetHorizontal)
43+
};
44+
delay = optionToInt(opts.throttle, 250);
45+
useDebounce = opts.debounce !== false;
46+
unload = !!opts.unload;
47+
callback = opts.callback || callback;
48+
echo.render();
49+
if (document.addEventListener) {
50+
root.addEventListener('scroll', debounceOrThrottle, false);
51+
root.addEventListener('load', debounceOrThrottle, false);
52+
} else {
53+
root.attachEvent('onscroll', debounceOrThrottle);
54+
root.attachEvent('onload', debounceOrThrottle);
55+
}
56+
};
57+
58+
echo.render = function (context) {
59+
var nodes = (context || document).querySelectorAll('[data-echo], [data-echo-background]');
60+
var length = nodes.length;
61+
var src, elem;
62+
var view = {
63+
l: 0 - offset.l,
64+
t: 0 - offset.t,
65+
b: (root.innerHeight || document.documentElement.clientHeight) + offset.b,
66+
r: (root.innerWidth || document.documentElement.clientWidth) + offset.r
67+
};
68+
for (var i = 0; i < length; i++) {
69+
elem = nodes[i];
70+
if (inView(elem, view)) {
71+
72+
if (unload) {
73+
elem.setAttribute('data-echo-placeholder', elem.src);
74+
}
75+
76+
if (elem.getAttribute('data-echo-background') !== null) {
77+
elem.style.backgroundImage = 'url(' + elem.getAttribute('data-echo-background') + ')';
78+
}
79+
else if (elem.src !== (src = elem.getAttribute('data-echo'))) {
80+
elem.src = src;
81+
}
82+
83+
if (!unload) {
84+
elem.removeAttribute('data-echo');
85+
elem.removeAttribute('data-echo-background');
86+
}
87+
88+
callback(elem, 'load');
89+
}
90+
else if (unload && !!(src = elem.getAttribute('data-echo-placeholder'))) {
91+
92+
if (elem.getAttribute('data-echo-background') !== null) {
93+
elem.style.backgroundImage = 'url(' + src + ')';
94+
}
95+
else {
96+
elem.src = src;
97+
}
98+
99+
elem.removeAttribute('data-echo-placeholder');
100+
callback(elem, 'unload');
101+
}
102+
}
103+
if (!length) {
104+
echo.detach();
105+
}
106+
};
107+
108+
echo.detach = function () {
109+
if (document.removeEventListener) {
110+
root.removeEventListener('scroll', debounceOrThrottle);
111+
} else {
112+
root.detachEvent('onscroll', debounceOrThrottle);
113+
}
114+
clearTimeout(poll);
115+
};
116+
117+
module.exports = echo;

0 commit comments

Comments
 (0)