This repository was archived by the owner on Apr 28, 2025. It is now read-only.
-
Notifications
You must be signed in to change notification settings - Fork 3
Expand file tree
/
Copy pathsrcset.js
More file actions
118 lines (115 loc) · 2.66 KB
/
srcset.js
File metadata and controls
118 lines (115 loc) · 2.66 KB
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
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
import { localOption } from '../../utils/get-local-options';
import srcsetUtil from 'srcset';
let imageSrcset;
export default function () {
localOption('image_srcset').then((value) => {
imageSrcset = value;
if (value > 0) {
// TODO clean picture sources
filterImages('srcset');
filterImages('lazy-srcset');
}
});
}
function filterImages(name) {
const imgs = document.querySelectorAll('img[data-' + name + ']');
let cleanedSrcset;
imgs.forEach((img, index) => {
let srcset;
let width = 9999;
if (img.dataset[name]) {
if (img.dataset.width) {
width = img.dataset.width;
} else if (img.width) {
width = img.width;
}
srcset = img.dataset[name];
cleanedSrcset = cleanSrcset(srcset, width);
if (cleanedSrcset) img.dataset[name] = cleanedSrcset;
}
// check srcset
// if (img.srcset !== null) {
// srcset = img.srcset
// cleanedSrcset = cleanSrcset(srcset, width)
// if (cleanedSrcset) img.srcset = cleanedSrcset
// }
});
}
function noRetina(srcset) {
for (let i = srcset.length - 1; i >= 0; i -= 1) {
if (srcset[i].density && srcset[i].density > 1) {
srcset.splice(i, 1);
}
}
return srcset;
}
function smart(srcset, width) {
srcset = noRetina(srcset);
srcset = sortSrcset(srcset);
let newSrcset;
// TEMP
if (srcset.length > 1) {
const lg = Math.round(srcset.length / 2);
newSrcset = srcset.slice(0, lg);
} else {
newSrcset = srcset;
}
// TODO parse sizes or getBoundingClientRect to determine size of the image
return newSrcset;
}
function compare(a, b) {
if (a.width < b.width) {
return -1;
}
if (a.width > b.width) {
return 1;
}
return 0;
}
function sortSrcset(srcset) {
return srcset.sort(compare);
}
function smallest(srcset, width) {
let mini;
let miniWidth = width;
srcset = noRetina(srcset);
srcset.forEach((o) => {
if (mini) {
const w = o.width;
if (w && w < miniWidth) {
mini = o;
}
} else {
mini = o;
if (o.width) {
miniWidth = o.width;
}
}
});
if (mini && mini.url && mini.url !== '') {
return [mini];
} else {
return false;
}
}
// remove all images except the smallest
function cleanSrcset(srcset, width) {
const parsed = srcsetUtil.parse(srcset);
let cleanedSrcset;
switch (imageSrcset) {
case 1:
cleanedSrcset = noRetina(parsed);
break;
case 2:
cleanedSrcset = smallest(parsed, width);
break;
case 3:
cleanedSrcset = smart(parsed, width);
break;
}
if (cleanedSrcset) {
return srcsetUtil.stringify(cleanedSrcset);
} else {
return false;
}
}