-
Notifications
You must be signed in to change notification settings - Fork 2
/
Copy pathAdaptiveImages-light.js
88 lines (83 loc) · 2.97 KB
/
AdaptiveImages-light.js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
/*function adaptImgFix(n){
var i = window.getComputedStyle(n.parentNode).backgroundImage.replace(/\W?\)$/, '').replace(/^url\(\W?|/, '');
n.src = (i && i!='none' ? i : n.src);
}*/
(function (){
// picture polyfill for browser not knowing it
document.createElement('picture');
function htmlAddClass(c){
(function (H){
H.className = H.className+' '+c
})(document.documentElement)
}
// Android 2 media-queries bad support workaround
// multiple rules = multiples downloads : put .android2 on <html>
// use with simple css without media-queries and send compressive image
/*var android2 = (/android 2[.]/i.test(navigator.userAgent.toLowerCase()));
if (android2){
htmlAddClass('android2');
}*/
// slowConnection detection
var slowConnection = false;
if (typeof window.performance!=="undefined"){
var perfData = window.performance.timing;
var speed = ~~(adaptImgDocLength/(perfData.responseEnd-perfData.connectStart)); // approx, *1000/1024 to be exact
//console.log(speed);
slowConnection = (speed && speed<50); // speed n'est pas seulement une bande passante car prend en compte la latence de connexion initiale
}
else {
//https://github.com/Modernizr/Modernizr/blob/master/feature-detects/network/connection.js
var connection = navigator.connection || navigator.mozConnection || navigator.webkitConnection;
if (typeof connection!=="undefined") slowConnection = (connection.type==3 || connection.type==4 || /^[23]g$/.test(connection.type));
}
//console.log(slowConnection);
if (slowConnection){
htmlAddClass('aislow');
}
// inject async style after images have been loaded
// in order to hide 2 top layers and show only lower one
var adaptImg_onload = function (){
var sa = document.createElement('style');
sa.type = 'text/css';
sa.innerHTML = adaptImgAsyncStyles;
var s = document.getElementsByTagName('style')[0];
s.parentNode.insertBefore(sa, s);
// if no way to fire beforePrint : load now in case of
if (!window.matchMedia && !window.onbeforeprint){
beforePrint();
}
};
// http://www.webreference.com/programming/javascript/onloads/index.html
function addLoadEvent(func){
var oldonload = window.onload;
if (typeof window.onload!='function'){
window.onload = func;
} else {
window.onload = function (){
if (oldonload){
oldonload();
}
func();
}
}
}
if (typeof jQuery!=='undefined') jQuery(function (){
jQuery(window).on('load',adaptImg_onload);
}); else addLoadEvent(adaptImg_onload);
// print issue : fix all img
/*var beforePrint = function (){
var is = document.getElementsByClassName('adapt-img-multilayers');
for (var i = 0; i<is.length; i++)
adaptImgFix(is[i]);
};
if (window.matchMedia){
var mediaQueryList = window.matchMedia('print');
mediaQueryList.addListener(function (mql){
// do not test mql.matches as we want to get background-images that are possibly not findable in print
beforePrint();
});
}
if (typeof(window.onbeforeprint)!=="undefined")
window.onbeforeprint = beforePrint;
*/
})();