appscms-tools-theme 4.5.6 → 4.5.7
Sign up to get free protection for your applications and to get access to all the features.
- checksums.yaml +4 -4
- data/assets/js/batch.js +123 -160
- metadata +2 -2
checksums.yaml
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
---
|
|
2
2
|
SHA256:
|
|
3
|
-
metadata.gz:
|
|
4
|
-
data.tar.gz:
|
|
3
|
+
metadata.gz: 62fcab5d132be9a3dd849169794f658f8cd6f6636218143967b3e8e2d2c67fd3
|
|
4
|
+
data.tar.gz: 982636ae9b0010b53632fb9bf5d05185c526585d35bf45402c959d35add59545
|
|
5
5
|
SHA512:
|
|
6
|
-
metadata.gz:
|
|
7
|
-
data.tar.gz:
|
|
6
|
+
metadata.gz: 451e6e7f3dc768ebc8ceca7dea39c058946376115c166e53bb555e97974cf51aa4d7f707c06345f5205063a7ecd11a692c598f5119254070d756eaa482c3782f
|
|
7
|
+
data.tar.gz: 15b698813251565ffdf1bf16739e2061570ec7c8b13f0a90350cd3bcfbe70d34d01df7cc77cc29468712fa0b230d19646017a7cd8fe53d701bc0f984f353d18b
|
data/assets/js/batch.js
CHANGED
|
@@ -1,143 +1,121 @@
|
|
|
1
|
-
const getScript = document.currentScript
|
|
2
|
-
const pageTool = getScript.dataset.tool
|
|
3
|
-
const lang = getScript.dataset.lang
|
|
4
|
-
const inputBox = document.querySelector(
|
|
5
|
-
const addFiles = document.querySelector(
|
|
6
|
-
const
|
|
7
|
-
const
|
|
8
|
-
const
|
|
9
|
-
const
|
|
10
|
-
const
|
|
11
|
-
const
|
|
12
|
-
|
|
13
|
-
let
|
|
14
|
-
let renderFileTypes = null
|
|
15
|
-
let root = document.querySelector(':root')
|
|
16
|
-
root.style.setProperty('--maincolor', fileDropBox.dataset.color)
|
|
17
|
-
|
|
1
|
+
const getScript = document.currentScript;
|
|
2
|
+
const pageTool = getScript.dataset.tool;
|
|
3
|
+
const lang = getScript.dataset.lang;
|
|
4
|
+
const inputBox = document.querySelector(".upload-btn");
|
|
5
|
+
const addFiles = document.querySelector(".add-more-files");
|
|
6
|
+
const fileDropBox = document.querySelector(".box");
|
|
7
|
+
const workspace = document.querySelector(".workspace");
|
|
8
|
+
const selectedFilesList = document.querySelector(".selectedFilesList");
|
|
9
|
+
const downloadButton = document.querySelector("#download-button");
|
|
10
|
+
const submitButton = document.querySelector("#submit-button");
|
|
11
|
+
const showProcessingFiles = document.querySelector(".files-processing-list");
|
|
12
|
+
let zipFileType = null;
|
|
13
|
+
let renderFileTypes = null;
|
|
18
14
|
|
|
19
15
|
const showLoader = () => {
|
|
20
|
-
showLoading()
|
|
21
|
-
}
|
|
22
|
-
const closeLoader = () => {
|
|
23
|
-
const mimeTypes = 'image/png,image/jpg,image/jpeg,image/webp'
|
|
24
|
-
const filemimes = ['.png', '.webp', '.jpg', '.jpeg']
|
|
25
|
-
gdrive.addEventListener(
|
|
26
|
-
'click',
|
|
27
|
-
(getFile, mimeTypes, showLoader, closeLoader) => {
|
|
28
|
-
const data = loadPicker()
|
|
29
|
-
}
|
|
30
|
-
)
|
|
31
|
-
const dropbox = document.getElementById('dropbox')
|
|
32
|
-
dropbox.addEventListener(
|
|
33
|
-
'click',
|
|
34
|
-
async (getDropBoxFile, showLoader, closeLoader) => {
|
|
35
|
-
const getFile = chooseFromDropbox()
|
|
36
|
-
}
|
|
37
|
-
)
|
|
16
|
+
showLoading();
|
|
17
|
+
};
|
|
18
|
+
const closeLoader = () => {};
|
|
38
19
|
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
e.
|
|
45
|
-
})
|
|
46
|
-
fileDropBox.addEventListener('drop', (e) => {
|
|
47
|
-
e.preventDefault()
|
|
48
|
-
handleFile(e.dataTransfer.files[0])
|
|
49
|
-
})
|
|
20
|
+
fileDropBox.addEventListener("dragover", (e) => {
|
|
21
|
+
e.preventDefault();
|
|
22
|
+
});
|
|
23
|
+
fileDropBox.addEventListener("drop", (e) => {
|
|
24
|
+
e.preventDefault();
|
|
25
|
+
handleFile(e.dataTransfer.files[0]);
|
|
26
|
+
});
|
|
50
27
|
const fileOnChange = () => {
|
|
51
|
-
handleFile(file.files)
|
|
52
|
-
}
|
|
28
|
+
handleFile(file.files);
|
|
29
|
+
};
|
|
53
30
|
inputBox.onclick = function () {
|
|
54
|
-
document.querySelector(
|
|
55
|
-
}
|
|
31
|
+
document.querySelector("#file").click();
|
|
32
|
+
};
|
|
56
33
|
const fileOnChange2 = () => {
|
|
57
|
-
addMoreFiles(document.querySelector(
|
|
58
|
-
}
|
|
34
|
+
addMoreFiles(document.querySelector("#file2").files);
|
|
35
|
+
};
|
|
59
36
|
addFiles.onclick = function () {
|
|
60
|
-
document.querySelector(
|
|
61
|
-
}
|
|
62
|
-
|
|
63
|
-
let fileName =
|
|
64
|
-
let blobList = []
|
|
37
|
+
document.querySelector("#file2").click();
|
|
38
|
+
};
|
|
39
|
+
let files = [];
|
|
40
|
+
let fileName = "";
|
|
41
|
+
let blobList = [];
|
|
65
42
|
const addMoreFiles = (addFiles) => {
|
|
66
|
-
handleFile(addFiles)
|
|
67
|
-
}
|
|
43
|
+
handleFile(addFiles);
|
|
44
|
+
};
|
|
68
45
|
const onSubmit = (files) => {
|
|
69
|
-
blobList = []
|
|
46
|
+
blobList = [];
|
|
70
47
|
Promise.all(
|
|
71
48
|
files.map((item, index) => {
|
|
72
49
|
document.querySelector(
|
|
73
50
|
`#loader-${index}`
|
|
74
51
|
).innerHTML = `<span class="processing">processing</span>
|
|
75
|
-
<div class="spinner-border" role="status"><span class="sr-only">Loading...</span></div
|
|
52
|
+
<div class="spinner-border" role="status"><span class="sr-only">Loading...</span></div>`;
|
|
76
53
|
return new Promise((resolve, reject) => {
|
|
77
54
|
batchConversion(item, index).then(([indexValue, blob, type]) => {
|
|
78
|
-
blobList.push({ blob: blob, fileName: item })
|
|
55
|
+
blobList.push({ blob: blob, fileName: item });
|
|
79
56
|
document.querySelector(
|
|
80
57
|
`#loader-${indexValue}`
|
|
81
|
-
).innerHTML = `<span class="done">finished</span
|
|
58
|
+
).innerHTML = `<span class="done">finished</span>`;
|
|
82
59
|
document.querySelector(`#download-${indexValue}`).style.display =
|
|
83
|
-
|
|
84
|
-
resolve()
|
|
85
|
-
})
|
|
60
|
+
"inline-block";
|
|
61
|
+
resolve();
|
|
62
|
+
});
|
|
86
63
|
}).catch((error) => {
|
|
87
|
-
console.log(error)
|
|
88
|
-
})
|
|
64
|
+
console.log(error);
|
|
65
|
+
});
|
|
89
66
|
})
|
|
90
67
|
).then(() => {
|
|
91
|
-
document.querySelector(
|
|
92
|
-
document.querySelector(
|
|
93
|
-
|
|
94
|
-
document.querySelector(
|
|
95
|
-
let zip = new JSZip()
|
|
96
|
-
let zipFiles = zip.folder(`safeimagekit-batch-images`)
|
|
68
|
+
document.querySelector(".bottom-section-container").style.display = "flex";
|
|
69
|
+
document.querySelector(".bottom-section-container").style.padding =
|
|
70
|
+
"20px .75rem";
|
|
71
|
+
document.querySelector("#download-zip").style.display = "block";
|
|
72
|
+
let zip = new JSZip();
|
|
73
|
+
let zipFiles = zip.folder(`safeimagekit-batch-images`);
|
|
97
74
|
blobList.map((item) => {
|
|
98
75
|
zipFiles.file(
|
|
99
|
-
`safeimagekit-batch-${item.fileName.name.split(
|
|
76
|
+
`safeimagekit-batch-${item.fileName.name.split(".")[0]}.${
|
|
77
|
+
zipFileType ? zipFileType : "png"
|
|
100
78
|
}`,
|
|
101
79
|
getBase64String(item.blob),
|
|
102
80
|
{ base64: true }
|
|
103
|
-
)
|
|
104
|
-
})
|
|
81
|
+
);
|
|
82
|
+
});
|
|
105
83
|
|
|
106
|
-
document.querySelector(
|
|
107
|
-
zip.generateAsync({ type:
|
|
108
|
-
saveAs(content, `safeimagekit-batch-conversion.zip`)
|
|
109
|
-
if (lang ===
|
|
110
|
-
window.location.href = `/download?tool=${pageTool}
|
|
84
|
+
document.querySelector("#download-zip").addEventListener("click", () => {
|
|
85
|
+
zip.generateAsync({ type: "blob" }).then(function (content) {
|
|
86
|
+
saveAs(content, `safeimagekit-batch-conversion.zip`);
|
|
87
|
+
if (lang === "en") {
|
|
88
|
+
window.location.href = `/download?tool=${pageTool}`;
|
|
111
89
|
} else {
|
|
112
|
-
window.location.href = `/${lang}/download?tool=${pageTool}
|
|
90
|
+
window.location.href = `/${lang}/download?tool=${pageTool}`;
|
|
113
91
|
}
|
|
114
|
-
})
|
|
115
|
-
})
|
|
116
|
-
})
|
|
117
|
-
}
|
|
92
|
+
});
|
|
93
|
+
});
|
|
94
|
+
});
|
|
95
|
+
};
|
|
118
96
|
let renderFileTypesHtml = ` <option value="png">png</option>
|
|
119
97
|
<option value="jpg">jpg</option>
|
|
120
98
|
<option value="jpeg">jpeg</option>
|
|
121
99
|
<option value="webp">webp</option>
|
|
122
|
-
|
|
100
|
+
`;
|
|
123
101
|
|
|
124
102
|
const renderFiles = (files) => {
|
|
125
103
|
if (renderFileTypes !== null) {
|
|
126
|
-
renderFileTypesHtml =
|
|
104
|
+
renderFileTypesHtml = "";
|
|
127
105
|
renderFileTypes.map((i) => {
|
|
128
|
-
renderFileTypesHtml += `<option value="${i}">${i}</option
|
|
129
|
-
})
|
|
106
|
+
renderFileTypesHtml += `<option value="${i}">${i}</option>`;
|
|
107
|
+
});
|
|
130
108
|
}
|
|
131
109
|
files.map((file, index) => {
|
|
132
110
|
if (file) {
|
|
133
|
-
let filename = file.name
|
|
111
|
+
let filename = file.name;
|
|
134
112
|
if (file.name.split(".")[0].length > 10) {
|
|
135
|
-
let fName = file.name.split(".")[0]
|
|
136
|
-
let fExtention = file.name.split(".")[1]
|
|
137
|
-
filename =
|
|
138
|
-
|
|
113
|
+
let fName = file.name.split(".")[0];
|
|
114
|
+
let fExtention = file.name.split(".")[1];
|
|
115
|
+
filename =
|
|
116
|
+
fName.substr(0, 9) + "..." + fName.substr(-3) + "." + fExtention;
|
|
139
117
|
}
|
|
140
|
-
let loader =
|
|
118
|
+
let loader = "Ready";
|
|
141
119
|
showProcessingFiles.innerHTML += `
|
|
142
120
|
<tr>
|
|
143
121
|
<th scope="row" class="file-icon-row">
|
|
@@ -164,93 +142,78 @@ const renderFiles = (files) => {
|
|
|
164
142
|
</button>
|
|
165
143
|
</td>
|
|
166
144
|
</tr>
|
|
167
|
-
|
|
145
|
+
`;
|
|
168
146
|
}
|
|
169
|
-
})
|
|
170
|
-
}
|
|
147
|
+
});
|
|
148
|
+
};
|
|
171
149
|
|
|
172
150
|
const handleFile = (file) => {
|
|
173
|
-
showProcessingFiles.innerHTML =
|
|
151
|
+
showProcessingFiles.innerHTML = "";
|
|
174
152
|
if (file) {
|
|
175
153
|
for (let i = 0; i < file.length; i++) {
|
|
176
|
-
files.push(file[i])
|
|
177
|
-
stopLoading()
|
|
178
|
-
workspace.style.display =
|
|
179
|
-
document.querySelector(
|
|
180
|
-
let listItem = document.createElement(
|
|
181
|
-
listItem.style.listStyle =
|
|
182
|
-
let getFileSize = formatBytes(file[i].size)
|
|
183
|
-
listItem.innerHTML = `${file[i].name} (${getFileSize})
|
|
154
|
+
files.push(file[i]);
|
|
155
|
+
stopLoading();
|
|
156
|
+
workspace.style.display = "block";
|
|
157
|
+
document.querySelector("#file").style.display = "block";
|
|
158
|
+
let listItem = document.createElement("li");
|
|
159
|
+
listItem.style.listStyle = "none";
|
|
160
|
+
let getFileSize = formatBytes(file[i].size);
|
|
161
|
+
listItem.innerHTML = `${file[i].name} (${getFileSize})`;
|
|
184
162
|
// selectedFilesList.appendChild(listItem)
|
|
185
163
|
}
|
|
186
164
|
}
|
|
187
|
-
renderFiles(files)
|
|
188
|
-
submitButton.addEventListener(
|
|
189
|
-
}
|
|
190
|
-
|
|
191
|
-
if (bytes === 0) return
|
|
165
|
+
renderFiles(files);
|
|
166
|
+
submitButton.addEventListener("click", () => onSubmit(files));
|
|
167
|
+
};
|
|
168
|
+
const formatBytes = (bytes, decimals = 2) => {
|
|
169
|
+
if (bytes === 0) return "0 Bytes";
|
|
192
170
|
|
|
193
|
-
const k = 1024
|
|
194
|
-
const dm = decimals < 0 ? 0 : decimals
|
|
195
|
-
const sizes = [
|
|
171
|
+
const k = 1024;
|
|
172
|
+
const dm = decimals < 0 ? 0 : decimals;
|
|
173
|
+
const sizes = ["Bytes", "KB", "MB", "GB", "TB", "PB", "EB", "ZB", "YB"];
|
|
196
174
|
|
|
197
|
-
const i = Math.floor(Math.log(bytes) / Math.log(k))
|
|
175
|
+
const i = Math.floor(Math.log(bytes) / Math.log(k));
|
|
198
176
|
|
|
199
|
-
return parseFloat((bytes / Math.pow(k, i)).toFixed(dm)) +
|
|
200
|
-
}
|
|
177
|
+
return parseFloat((bytes / Math.pow(k, i)).toFixed(dm)) + " " + sizes[i];
|
|
178
|
+
};
|
|
201
179
|
const handleDownload = (e) => {
|
|
202
|
-
let find = blobList[Number(e.id.replace(/^\D+/g,
|
|
203
|
-
let fileName = blobList[Number(e.id.replace(/^\D+/g,
|
|
180
|
+
let find = blobList[Number(e.id.replace(/^\D+/g, ""))].blob;
|
|
181
|
+
let fileName = blobList[Number(e.id.replace(/^\D+/g, ""))].fileName.name;
|
|
204
182
|
|
|
205
|
-
let format = document.querySelector(
|
|
183
|
+
let format = document.querySelector("#image-format").value;
|
|
206
184
|
|
|
207
185
|
switch (e.dataset.type) {
|
|
208
|
-
case
|
|
209
|
-
let a = document.createElement(
|
|
210
|
-
a.href = find
|
|
211
|
-
a.download = `safeimagekit-batch-${fileName.split(
|
|
212
|
-
document.body.appendChild(a)
|
|
213
|
-
a.click()
|
|
214
|
-
break
|
|
186
|
+
case "image":
|
|
187
|
+
let a = document.createElement("a");
|
|
188
|
+
a.href = find;
|
|
189
|
+
a.download = `safeimagekit-batch-${fileName.split(".")[0]}.${format}`;
|
|
190
|
+
document.body.appendChild(a);
|
|
191
|
+
a.click();
|
|
192
|
+
break;
|
|
215
193
|
default:
|
|
216
|
-
break
|
|
194
|
+
break;
|
|
217
195
|
}
|
|
218
|
-
}
|
|
196
|
+
};
|
|
219
197
|
const showLoading = () => {
|
|
220
|
-
document.querySelector(
|
|
221
|
-
document.querySelector(
|
|
222
|
-
}
|
|
198
|
+
document.querySelector("#file-loader").style.display = "flex";
|
|
199
|
+
document.querySelector(".file-input").style.display = "none";
|
|
200
|
+
};
|
|
223
201
|
const stopLoading = () => {
|
|
224
|
-
fileDropBox.style.display =
|
|
225
|
-
}
|
|
226
|
-
const showDropDown = document.querySelector('.file-pick-dropdown')
|
|
227
|
-
const icon = document.querySelector('.arrow-sign')
|
|
228
|
-
const dropDown = document.querySelector('.file-picker-dropdown')
|
|
229
|
-
showDropDown.addEventListener('click', () => {
|
|
230
|
-
addScripts()
|
|
231
|
-
if (dropDown.style.display !== 'none') {
|
|
232
|
-
dropDown.style.display = 'none'
|
|
233
|
-
icon.classList.remove('fa-angle-up')
|
|
234
|
-
icon.classList.add('fa-angle-down')
|
|
235
|
-
} else {
|
|
236
|
-
dropDown.style.display = 'block'
|
|
237
|
-
icon.classList.remove('fa-angle-down')
|
|
238
|
-
icon.classList.add('fa-angle-up')
|
|
239
|
-
}
|
|
240
|
-
})
|
|
202
|
+
fileDropBox.style.display = "none";
|
|
203
|
+
};
|
|
241
204
|
|
|
242
205
|
const getBase64String = (dataURL) => {
|
|
243
|
-
const idx = dataURL.indexOf(
|
|
244
|
-
return dataURL.substring(idx)
|
|
245
|
-
}
|
|
206
|
+
const idx = dataURL.indexOf("base64,") + "base64,".length;
|
|
207
|
+
return dataURL.substring(idx);
|
|
208
|
+
};
|
|
246
209
|
const dataURLtoBlob = (dataurl) => {
|
|
247
|
-
let arr = dataurl.split(
|
|
210
|
+
let arr = dataurl.split(","),
|
|
248
211
|
mime = arr[0].match(/:(.*?);/)[1],
|
|
249
212
|
bstr = atob(arr[1]),
|
|
250
213
|
n = bstr.length,
|
|
251
|
-
u8arr = new Uint8Array(n)
|
|
214
|
+
u8arr = new Uint8Array(n);
|
|
252
215
|
while (n--) {
|
|
253
|
-
u8arr[n] = bstr.charCodeAt(n)
|
|
216
|
+
u8arr[n] = bstr.charCodeAt(n);
|
|
254
217
|
}
|
|
255
|
-
return new Blob([u8arr], { type: mime })
|
|
256
|
-
}
|
|
218
|
+
return new Blob([u8arr], { type: mime });
|
|
219
|
+
};
|
metadata
CHANGED
|
@@ -1,14 +1,14 @@
|
|
|
1
1
|
--- !ruby/object:Gem::Specification
|
|
2
2
|
name: appscms-tools-theme
|
|
3
3
|
version: !ruby/object:Gem::Version
|
|
4
|
-
version: 4.5.
|
|
4
|
+
version: 4.5.7
|
|
5
5
|
platform: ruby
|
|
6
6
|
authors:
|
|
7
7
|
- vivek-appscms
|
|
8
8
|
autorequire:
|
|
9
9
|
bindir: bin
|
|
10
10
|
cert_chain: []
|
|
11
|
-
date: 2024-05-
|
|
11
|
+
date: 2024-05-17 00:00:00.000000000 Z
|
|
12
12
|
dependencies:
|
|
13
13
|
- !ruby/object:Gem::Dependency
|
|
14
14
|
name: jekyll
|