appscms-tools-theme 2.9.5 → 2.9.6
Sign up to get free protection for your applications and to get access to all the features.
- checksums.yaml +4 -4
- data/LICENSE.txt +21 -21
- data/README.md +50 -50
- data/_data/about/en/about.json +16 -16
- data/_data/blog/alertbar.yml +3 -3
- data/_data/blog/authors.yml +11 -11
- data/_data/blog/blog.yml +4 -4
- data/_data/blog/nav.json +13 -13
- data/_data/blog/share.yml +28 -28
- data/_data/calculators/en/biology-calc/bulb-spacing.json +78 -78
- data/_data/calculators/en/biology-calc/cat-chocolate-toxicity.json +52 -52
- data/_data/calculators/en/chemistry-calc/activation-energy.json +44 -44
- data/_data/calculators/en/finance-calc/401k.json +122 -122
- data/_data/contact/en/contact.json +38 -38
- data/_data/disclaimer/en/disclaimer.json +37 -37
- data/_data/download/en/download.json +35 -35
- data/_data/feature/en/3_shop_posters.json +351 -351
- data/_data/feature/en/allele-frequency.json +246 -246
- data/_data/feature/en/batch-conversion.json +77 -77
- data/_data/feature/en/compress-pdf.json +202 -202
- data/_data/feature/en/face-detection.json +52 -52
- data/_data/feature/en/split-pdf.json +115 -115
- data/_data/feature/en/theframe.json +56 -56
- data/_data/feature/hi/compress-pdf.json +81 -81
- data/_data/feature/tr/compress-pdf.json +80 -80
- data/_data/filecomparison/en/filecomparison.json +38 -38
- data/_data/fileinfo/en/fileinfo.json +15 -15
- data/_data/footer/en/data.json +164 -164
- data/_data/footer/hi/data.json +68 -68
- data/_data/footer/networksites.json +15 -15
- data/_data/header/en/data.json +173 -173
- data/_data/header/hi/data.json +144 -144
- data/_data/home/en/en.json +285 -285
- data/_data/home/en/photoeffects.json +23 -23
- data/_data/home/en/posters.json +323 -323
- data/_data/home/hi/hi.json +86 -86
- data/_data/home-1/en/en.json +229 -229
- data/_data/languagesupport/compress-pdf-langs.json +11 -11
- data/_data/languagesupport/index-langs.json +13 -13
- data/_data/photo-categories.json +104 -104
- data/_data/photoeffects.json +31 -31
- data/_data/privacy/en/privacyPolicy.json +265 -265
- data/_data/termAndCondition/en/termAndCondition.json +358 -358
- data/_includes/Rating/rating.html +92 -92
- data/_includes/Rating/structureddata.html +53 -53
- data/_includes/Usp/usp.html +95 -95
- data/_includes/adblocker.html +135 -135
- data/_includes/adsense/adsense.html +7 -7
- data/_includes/alternates/alternates.html +45 -45
- data/_includes/author_bio.html +16 -16
- data/_includes/authors/authors.html +67 -67
- data/_includes/batch-conversion.html +65 -65
- data/_includes/cssfile/links.html +11 -11
- data/_includes/custom-head.html +136 -136
- data/_includes/customblog/recentposts.html +67 -67
- data/_includes/customblog/relatedposts.html +203 -203
- data/_includes/disqus_comments.html +10 -10
- data/_includes/dropdown/langdropdown.html +22 -22
- data/_includes/feature.html +37 -37
- data/_includes/fileformat/Tabularcompariosn.html +158 -158
- data/_includes/fileformat/comparisonfiles.html +151 -151
- data/_includes/fileformat/fileformatdetail.html +101 -101
- data/_includes/fileformat/fileinfoformat.html +93 -93
- data/_includes/footer/index.html +534 -534
- data/_includes/google-analytics.html +22 -22
- data/_includes/head/index.html +235 -235
- data/_includes/header/blogHeader.html +34 -34
- data/_includes/header/index.html +188 -188
- data/_includes/languages/languages.html +60 -60
- data/_includes/monumetric/ads.html +57 -57
- data/_includes/monumetric/monumetric.html +57 -57
- data/_includes/monumetric/profitablecpmgate.html +51 -51
- data/_includes/nofiletransfer/nofiletransfer.html +38 -38
- data/_includes/paginationBlogPage.html +71 -71
- data/_includes/paginationPostPage.html +14 -14
- data/_includes/postauthorbio.html +17 -17
- data/_includes/postbox.html +31 -31
- data/_includes/script.html +58 -58
- data/_includes/section/alertbar.html +11 -11
- data/_includes/section/count.html +36 -36
- data/_includes/section/recent_posts.html +65 -65
- data/_includes/section/related_categories_post.html +198 -198
- data/_includes/share/socialshare.html +20 -20
- data/_includes/staticfooter.html +67 -67
- data/_layouts/aboutUs.html +34 -34
- data/_layouts/batch.html +102 -102
- data/_layouts/blog-1.html +83 -83
- data/_layouts/blog.html +94 -94
- data/_layouts/calculator.html +89 -89
- data/_layouts/categories.html +33 -33
- data/_layouts/contactUs.html +124 -124
- data/_layouts/default.html +1 -1
- data/_layouts/disclaimer.html +123 -123
- data/_layouts/download.html +299 -299
- data/_layouts/feature-1.html +320 -320
- data/_layouts/feature-download.html +308 -308
- data/_layouts/feature.html +258 -258
- data/_layouts/featureResultPage.html +65 -65
- data/_layouts/fileInfo.html +39 -39
- data/_layouts/filecomparison.html +85 -85
- data/_layouts/frame.html +222 -434
- data/_layouts/help.html +23 -23
- data/_layouts/home-1.html +229 -229
- data/_layouts/home.html +249 -249
- data/_layouts/homeResultPage.html +31 -31
- data/_layouts/imagekit.html +125 -125
- data/_layouts/page.html +5 -5
- data/_layouts/photo-effects-home.html +191 -193
- data/_layouts/post.html +177 -177
- data/_layouts/privacyPolicy.html +637 -637
- data/_layouts/termAndCondition.html +646 -646
- data/assets/cross.svg +4 -4
- data/assets/css/adblocker.css +187 -187
- data/assets/css/batch.css +437 -437
- data/assets/css/blog-1.css +65 -65
- data/assets/css/blog.css +491 -491
- data/assets/css/bootstrap.min.css +6 -6
- data/assets/css/calculators.css +47 -47
- data/assets/css/common.css +550 -550
- data/assets/css/feature-1.css +290 -290
- data/assets/css/filecomparison.css +25 -25
- data/assets/css/frame.css +780 -780
- data/assets/css/home-1.css +187 -187
- data/assets/css/imagekit.css +840 -840
- data/assets/css/tools.css +1278 -1278
- data/assets/facebook.svg +4 -4
- data/assets/images/abp.svg +41 -41
- data/assets/images/adblock.svg +266 -266
- data/assets/images/addimg.svg +2 -2
- data/assets/images/convert.svg +8 -8
- data/assets/images/safevideoconverter.svg +23 -23
- data/assets/images/uo.svg +41 -41
- data/assets/images/vectorpaint.svg +5 -5
- data/assets/instagram.svg +4 -4
- data/assets/js/TopScroll.js +8 -8
- data/assets/js/adBlocker.js +44 -44
- data/assets/js/ads.js +8 -8
- data/assets/js/append-div.js +10 -10
- data/assets/js/batch.js +229 -229
- data/assets/js/calculator-tooltip.js +3 -3
- data/assets/js/face-api.js +38064 -38064
- data/assets/js/face-detection.js +303 -303
- data/assets/js/featureResult.js +48 -48
- data/assets/js/frame.js +263 -263
- data/assets/js/googledrive.js +155 -155
- data/assets/js/homeResult.js +36 -36
- data/assets/js/manifest.json +16 -16
- data/assets/js/multiselect.js +157 -157
- data/assets/js/perspective.min.js +182 -182
- data/assets/js/photo-effects.json +84 -84
- data/assets/js/redirectResult.js +9 -9
- data/assets/js/testing-batch.js +39 -39
- data/assets/js/theme.js +44 -44
- data/assets/linkdin.svg +4 -4
- data/assets/noserverupload.svg +4 -4
- data/assets/pdf.svg +20 -20
- data/assets/secure.svg +43 -43
- data/assets/star.svg +4 -4
- data/assets/twitter.svg +4 -4
- data/assets/youtube.svg +4 -4
- metadata +7 -7
data/assets/js/batch.js
CHANGED
@@ -1,229 +1,229 @@
|
|
1
|
-
const getScript = document.currentScript
|
2
|
-
const pageTool = getScript.dataset.tool
|
3
|
-
const lang = getScript.dataset.lang
|
4
|
-
const inputBox = document.querySelector('#Inputbox')
|
5
|
-
const addFiles = document.querySelector('.add-more-files')
|
6
|
-
const gdrive = document.querySelector('#filepicker')
|
7
|
-
const fileDropBox = document.querySelector('.custom-box')
|
8
|
-
const workspace = document.querySelector('.workspace')
|
9
|
-
const selectedFilesList = document.querySelector('.selectedFilesList')
|
10
|
-
const downloadButton = document.querySelector('#download-button')
|
11
|
-
const submitButton = document.querySelector('#submit-button')
|
12
|
-
const showProcessingFiles = document.querySelector('.files-processing-list')
|
13
|
-
let zipFileType = null
|
14
|
-
let renderFileTypes = null
|
15
|
-
let root = document.querySelector(':root')
|
16
|
-
root.style.setProperty('--maincolor', fileDropBox.dataset.color)
|
17
|
-
|
18
|
-
const getFile = (file) => {
|
19
|
-
handleFile(file)
|
20
|
-
}
|
21
|
-
fileDropBox.addEventListener('dragover', (e) => {
|
22
|
-
e.preventDefault()
|
23
|
-
})
|
24
|
-
fileDropBox.addEventListener('drop', (e) => {
|
25
|
-
e.preventDefault()
|
26
|
-
handleFile(e.dataTransfer.files[0])
|
27
|
-
})
|
28
|
-
const fileOnChange = () => {
|
29
|
-
handleFile(file.files)
|
30
|
-
}
|
31
|
-
inputBox.onclick = function () {
|
32
|
-
document.querySelector('#file').click()
|
33
|
-
}
|
34
|
-
const fileOnChange2 = () => {
|
35
|
-
addMoreFiles(document.querySelector('#file2').files)
|
36
|
-
}
|
37
|
-
addFiles.onclick = function () {
|
38
|
-
document.querySelector('#file2').click()
|
39
|
-
}
|
40
|
-
var files = []
|
41
|
-
let fileName = ''
|
42
|
-
let blobList = []
|
43
|
-
const addMoreFiles = (addFiles) => {
|
44
|
-
handleFile(addFiles)
|
45
|
-
}
|
46
|
-
const onSubmit = (files) => {
|
47
|
-
blobList = []
|
48
|
-
Promise.all(
|
49
|
-
files.map((item, index) => {
|
50
|
-
document.querySelector(
|
51
|
-
`#loader-${index}`
|
52
|
-
).innerHTML = `<span class="processing">processing</span>
|
53
|
-
<div class="spinner-border" role="status"><span class="sr-only">Loading...</span></div>`
|
54
|
-
return new Promise((resolve, reject) => {
|
55
|
-
batchConversion(item, index).then(([indexValue, blob, type]) => {
|
56
|
-
blobList.push({ blob: blob, fileName: item })
|
57
|
-
document.querySelector(
|
58
|
-
`#loader-${indexValue}`
|
59
|
-
).innerHTML = `<span class="done">finished</span>`
|
60
|
-
document.querySelector(`#download-${indexValue}`).style.display =
|
61
|
-
'inline-block'
|
62
|
-
resolve()
|
63
|
-
})
|
64
|
-
}).catch((error) => {
|
65
|
-
console.log(error)
|
66
|
-
})
|
67
|
-
})
|
68
|
-
).then(() => {
|
69
|
-
document.querySelector('.bottom-section-container').style.display = 'flex'
|
70
|
-
document.querySelector('.bottom-section-container').style.padding =
|
71
|
-
'20px .75rem'
|
72
|
-
document.querySelector('#download-zip').style.display = 'block'
|
73
|
-
let zip = new JSZip()
|
74
|
-
let zipFiles = zip.folder(`safeimagekit-batch-images`)
|
75
|
-
|
76
|
-
blobList.map((item) => {
|
77
|
-
zipFiles.file(
|
78
|
-
`safeimagekit-batch-${item.fileName.name.split('.')[0]}.${
|
79
|
-
zipFileType ? zipFileType : 'png'
|
80
|
-
}`,
|
81
|
-
getBase64String(item.blob),
|
82
|
-
{ base64: true }
|
83
|
-
)
|
84
|
-
})
|
85
|
-
|
86
|
-
document.querySelector('#download-zip').addEventListener('click', () => {
|
87
|
-
zip.generateAsync({ type: 'blob' }).then(function (content) {
|
88
|
-
saveAs(content, `safeimagekit-batch-conversion.zip`)
|
89
|
-
if (lang === 'en') {
|
90
|
-
window.location.href = `/download?tool=${pageTool}`
|
91
|
-
} else {
|
92
|
-
window.location.href = `/${lang}/download?tool=${pageTool}`
|
93
|
-
}
|
94
|
-
})
|
95
|
-
})
|
96
|
-
})
|
97
|
-
}
|
98
|
-
let renderFileTypesHtml = ` <option value="png">png</option>
|
99
|
-
<option value="jpg">jpg</option>
|
100
|
-
<option value="jpeg">jpeg</option>
|
101
|
-
<option value="webp">webp</option>
|
102
|
-
`
|
103
|
-
|
104
|
-
const renderFiles = (files) => {
|
105
|
-
if (renderFileTypes !== null) {
|
106
|
-
renderFileTypesHtml = ''
|
107
|
-
renderFileTypes.map((i) => {
|
108
|
-
renderFileTypesHtml += `<option value="${i}">${i}</option>`
|
109
|
-
})
|
110
|
-
}
|
111
|
-
files.map((file, index) => {
|
112
|
-
if (file) {
|
113
|
-
let loader = 'Ready'
|
114
|
-
showProcessingFiles.innerHTML += `
|
115
|
-
<tr>
|
116
|
-
<th scope="row" class="file-icon-row">
|
117
|
-
<img src="/assets/images/file.png" alt="file" class="file-icon">
|
118
|
-
</th>
|
119
|
-
<td class="fileName">${file.name}</td>
|
120
|
-
<td id=loader-${index} class="file-processing"><span class="ready">${loader}</span></td>
|
121
|
-
<td>
|
122
|
-
<div class="download-format ">
|
123
|
-
<select name="image-format" id="image-format">
|
124
|
-
${renderFileTypesHtml}
|
125
|
-
</select>
|
126
|
-
</div>
|
127
|
-
|
128
|
-
</td>
|
129
|
-
<td class="file-download-button text-right">
|
130
|
-
<button style="display:none;" id=download-${index} data-type="image" onclick="handleDownload(this)" class="btn download-file-btn">
|
131
|
-
<svg class="download-icon" width="16px" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"
|
132
|
-
fill="currentColor">
|
133
|
-
<path
|
134
|
-
d="M18 20H5V15H6V19H17V15H18V20ZM12 4V15.19L14.3 13L15 13.6667L11.5 17L8 13.6667L8.7 13L11 15.19V4H12Z">
|
135
|
-
</path>
|
136
|
-
</svg> Download
|
137
|
-
</button>
|
138
|
-
</td>
|
139
|
-
</tr>
|
140
|
-
`
|
141
|
-
}
|
142
|
-
})
|
143
|
-
}
|
144
|
-
|
145
|
-
const handleFile = (file) => {
|
146
|
-
showProcessingFiles.innerHTML = ''
|
147
|
-
if (file) {
|
148
|
-
for (let i = 0; i < file.length; i++) {
|
149
|
-
files.push(file[i])
|
150
|
-
stopLoading()
|
151
|
-
workspace.style.display = 'block'
|
152
|
-
document.querySelector('#file').style.display = 'block'
|
153
|
-
let listItem = document.createElement('li')
|
154
|
-
listItem.style.listStyle = 'none'
|
155
|
-
let getFileSize = formatBytes(file[i].size)
|
156
|
-
listItem.innerHTML = `${file[i].name} (${getFileSize})`
|
157
|
-
// selectedFilesList.appendChild(listItem)
|
158
|
-
}
|
159
|
-
}
|
160
|
-
renderFiles(files)
|
161
|
-
submitButton.addEventListener('click', () => onSubmit(files))
|
162
|
-
}
|
163
|
-
function formatBytes(bytes, decimals = 2) {
|
164
|
-
if (bytes === 0) return '0 Bytes'
|
165
|
-
|
166
|
-
const k = 1024
|
167
|
-
const dm = decimals < 0 ? 0 : decimals
|
168
|
-
const sizes = ['Bytes', 'KB', 'MB', 'GB', 'TB', 'PB', 'EB', 'ZB', 'YB']
|
169
|
-
|
170
|
-
const i = Math.floor(Math.log(bytes) / Math.log(k))
|
171
|
-
|
172
|
-
return parseFloat((bytes / Math.pow(k, i)).toFixed(dm)) + ' ' + sizes[i]
|
173
|
-
}
|
174
|
-
const handleDownload = (e) => {
|
175
|
-
let find = blobList[Number(e.id.replace(/^\D+/g, ''))].blob
|
176
|
-
let fileName = blobList[Number(e.id.replace(/^\D+/g, ''))].fileName.name
|
177
|
-
|
178
|
-
let format = document.querySelector('#image-format').value
|
179
|
-
|
180
|
-
switch (e.dataset.type) {
|
181
|
-
case 'image':
|
182
|
-
let a = document.createElement('a')
|
183
|
-
a.href = find
|
184
|
-
a.download = `safeimagekit-batch-${fileName.split('.')[0]}.${format}`
|
185
|
-
document.body.appendChild(a)
|
186
|
-
a.click()
|
187
|
-
break
|
188
|
-
default:
|
189
|
-
break
|
190
|
-
}
|
191
|
-
}
|
192
|
-
const showLoading = () => {
|
193
|
-
document.querySelector('#file-loader').style.display = 'flex'
|
194
|
-
document.querySelector('.file-input').style.display = 'none'
|
195
|
-
}
|
196
|
-
const stopLoading = () => {
|
197
|
-
fileDropBox.style.display = 'none'
|
198
|
-
}
|
199
|
-
const showDropDown = document.querySelector('.file-pick-dropdown')
|
200
|
-
const icon = document.querySelector('.arrow-sign')
|
201
|
-
const dropDown = document.querySelector('.file-picker-dropdown')
|
202
|
-
showDropDown.addEventListener('click', () => {
|
203
|
-
addScripts()
|
204
|
-
if (dropDown.style.display !== 'none') {
|
205
|
-
dropDown.style.display = 'none'
|
206
|
-
icon.classList.remove('fa-angle-up')
|
207
|
-
icon.classList.add('fa-angle-down')
|
208
|
-
} else {
|
209
|
-
dropDown.style.display = 'block'
|
210
|
-
icon.classList.remove('fa-angle-down')
|
211
|
-
icon.classList.add('fa-angle-up')
|
212
|
-
}
|
213
|
-
})
|
214
|
-
|
215
|
-
const getBase64String = (dataURL) => {
|
216
|
-
const idx = dataURL.indexOf('base64,') + 'base64,'.length
|
217
|
-
return dataURL.substring(idx)
|
218
|
-
}
|
219
|
-
const dataURLtoBlob = (dataurl) => {
|
220
|
-
let arr = dataurl.split(','),
|
221
|
-
mime = arr[0].match(/:(.*?);/)[1],
|
222
|
-
bstr = atob(arr[1]),
|
223
|
-
n = bstr.length,
|
224
|
-
u8arr = new Uint8Array(n)
|
225
|
-
while (n--) {
|
226
|
-
u8arr[n] = bstr.charCodeAt(n)
|
227
|
-
}
|
228
|
-
return new Blob([u8arr], { type: mime })
|
229
|
-
}
|
1
|
+
const getScript = document.currentScript
|
2
|
+
const pageTool = getScript.dataset.tool
|
3
|
+
const lang = getScript.dataset.lang
|
4
|
+
const inputBox = document.querySelector('#Inputbox')
|
5
|
+
const addFiles = document.querySelector('.add-more-files')
|
6
|
+
const gdrive = document.querySelector('#filepicker')
|
7
|
+
const fileDropBox = document.querySelector('.custom-box')
|
8
|
+
const workspace = document.querySelector('.workspace')
|
9
|
+
const selectedFilesList = document.querySelector('.selectedFilesList')
|
10
|
+
const downloadButton = document.querySelector('#download-button')
|
11
|
+
const submitButton = document.querySelector('#submit-button')
|
12
|
+
const showProcessingFiles = document.querySelector('.files-processing-list')
|
13
|
+
let zipFileType = null
|
14
|
+
let renderFileTypes = null
|
15
|
+
let root = document.querySelector(':root')
|
16
|
+
root.style.setProperty('--maincolor', fileDropBox.dataset.color)
|
17
|
+
|
18
|
+
const getFile = (file) => {
|
19
|
+
handleFile(file)
|
20
|
+
}
|
21
|
+
fileDropBox.addEventListener('dragover', (e) => {
|
22
|
+
e.preventDefault()
|
23
|
+
})
|
24
|
+
fileDropBox.addEventListener('drop', (e) => {
|
25
|
+
e.preventDefault()
|
26
|
+
handleFile(e.dataTransfer.files[0])
|
27
|
+
})
|
28
|
+
const fileOnChange = () => {
|
29
|
+
handleFile(file.files)
|
30
|
+
}
|
31
|
+
inputBox.onclick = function () {
|
32
|
+
document.querySelector('#file').click()
|
33
|
+
}
|
34
|
+
const fileOnChange2 = () => {
|
35
|
+
addMoreFiles(document.querySelector('#file2').files)
|
36
|
+
}
|
37
|
+
addFiles.onclick = function () {
|
38
|
+
document.querySelector('#file2').click()
|
39
|
+
}
|
40
|
+
var files = []
|
41
|
+
let fileName = ''
|
42
|
+
let blobList = []
|
43
|
+
const addMoreFiles = (addFiles) => {
|
44
|
+
handleFile(addFiles)
|
45
|
+
}
|
46
|
+
const onSubmit = (files) => {
|
47
|
+
blobList = []
|
48
|
+
Promise.all(
|
49
|
+
files.map((item, index) => {
|
50
|
+
document.querySelector(
|
51
|
+
`#loader-${index}`
|
52
|
+
).innerHTML = `<span class="processing">processing</span>
|
53
|
+
<div class="spinner-border" role="status"><span class="sr-only">Loading...</span></div>`
|
54
|
+
return new Promise((resolve, reject) => {
|
55
|
+
batchConversion(item, index).then(([indexValue, blob, type]) => {
|
56
|
+
blobList.push({ blob: blob, fileName: item })
|
57
|
+
document.querySelector(
|
58
|
+
`#loader-${indexValue}`
|
59
|
+
).innerHTML = `<span class="done">finished</span>`
|
60
|
+
document.querySelector(`#download-${indexValue}`).style.display =
|
61
|
+
'inline-block'
|
62
|
+
resolve()
|
63
|
+
})
|
64
|
+
}).catch((error) => {
|
65
|
+
console.log(error)
|
66
|
+
})
|
67
|
+
})
|
68
|
+
).then(() => {
|
69
|
+
document.querySelector('.bottom-section-container').style.display = 'flex'
|
70
|
+
document.querySelector('.bottom-section-container').style.padding =
|
71
|
+
'20px .75rem'
|
72
|
+
document.querySelector('#download-zip').style.display = 'block'
|
73
|
+
let zip = new JSZip()
|
74
|
+
let zipFiles = zip.folder(`safeimagekit-batch-images`)
|
75
|
+
|
76
|
+
blobList.map((item) => {
|
77
|
+
zipFiles.file(
|
78
|
+
`safeimagekit-batch-${item.fileName.name.split('.')[0]}.${
|
79
|
+
zipFileType ? zipFileType : 'png'
|
80
|
+
}`,
|
81
|
+
getBase64String(item.blob),
|
82
|
+
{ base64: true }
|
83
|
+
)
|
84
|
+
})
|
85
|
+
|
86
|
+
document.querySelector('#download-zip').addEventListener('click', () => {
|
87
|
+
zip.generateAsync({ type: 'blob' }).then(function (content) {
|
88
|
+
saveAs(content, `safeimagekit-batch-conversion.zip`)
|
89
|
+
if (lang === 'en') {
|
90
|
+
window.location.href = `/download?tool=${pageTool}`
|
91
|
+
} else {
|
92
|
+
window.location.href = `/${lang}/download?tool=${pageTool}`
|
93
|
+
}
|
94
|
+
})
|
95
|
+
})
|
96
|
+
})
|
97
|
+
}
|
98
|
+
let renderFileTypesHtml = ` <option value="png">png</option>
|
99
|
+
<option value="jpg">jpg</option>
|
100
|
+
<option value="jpeg">jpeg</option>
|
101
|
+
<option value="webp">webp</option>
|
102
|
+
`
|
103
|
+
|
104
|
+
const renderFiles = (files) => {
|
105
|
+
if (renderFileTypes !== null) {
|
106
|
+
renderFileTypesHtml = ''
|
107
|
+
renderFileTypes.map((i) => {
|
108
|
+
renderFileTypesHtml += `<option value="${i}">${i}</option>`
|
109
|
+
})
|
110
|
+
}
|
111
|
+
files.map((file, index) => {
|
112
|
+
if (file) {
|
113
|
+
let loader = 'Ready'
|
114
|
+
showProcessingFiles.innerHTML += `
|
115
|
+
<tr>
|
116
|
+
<th scope="row" class="file-icon-row">
|
117
|
+
<img src="/assets/images/file.png" alt="file" class="file-icon">
|
118
|
+
</th>
|
119
|
+
<td class="fileName">${file.name}</td>
|
120
|
+
<td id=loader-${index} class="file-processing"><span class="ready">${loader}</span></td>
|
121
|
+
<td>
|
122
|
+
<div class="download-format ">
|
123
|
+
<select name="image-format" id="image-format">
|
124
|
+
${renderFileTypesHtml}
|
125
|
+
</select>
|
126
|
+
</div>
|
127
|
+
|
128
|
+
</td>
|
129
|
+
<td class="file-download-button text-right">
|
130
|
+
<button style="display:none;" id=download-${index} data-type="image" onclick="handleDownload(this)" class="btn download-file-btn">
|
131
|
+
<svg class="download-icon" width="16px" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"
|
132
|
+
fill="currentColor">
|
133
|
+
<path
|
134
|
+
d="M18 20H5V15H6V19H17V15H18V20ZM12 4V15.19L14.3 13L15 13.6667L11.5 17L8 13.6667L8.7 13L11 15.19V4H12Z">
|
135
|
+
</path>
|
136
|
+
</svg> Download
|
137
|
+
</button>
|
138
|
+
</td>
|
139
|
+
</tr>
|
140
|
+
`
|
141
|
+
}
|
142
|
+
})
|
143
|
+
}
|
144
|
+
|
145
|
+
const handleFile = (file) => {
|
146
|
+
showProcessingFiles.innerHTML = ''
|
147
|
+
if (file) {
|
148
|
+
for (let i = 0; i < file.length; i++) {
|
149
|
+
files.push(file[i])
|
150
|
+
stopLoading()
|
151
|
+
workspace.style.display = 'block'
|
152
|
+
document.querySelector('#file').style.display = 'block'
|
153
|
+
let listItem = document.createElement('li')
|
154
|
+
listItem.style.listStyle = 'none'
|
155
|
+
let getFileSize = formatBytes(file[i].size)
|
156
|
+
listItem.innerHTML = `${file[i].name} (${getFileSize})`
|
157
|
+
// selectedFilesList.appendChild(listItem)
|
158
|
+
}
|
159
|
+
}
|
160
|
+
renderFiles(files)
|
161
|
+
submitButton.addEventListener('click', () => onSubmit(files))
|
162
|
+
}
|
163
|
+
function formatBytes(bytes, decimals = 2) {
|
164
|
+
if (bytes === 0) return '0 Bytes'
|
165
|
+
|
166
|
+
const k = 1024
|
167
|
+
const dm = decimals < 0 ? 0 : decimals
|
168
|
+
const sizes = ['Bytes', 'KB', 'MB', 'GB', 'TB', 'PB', 'EB', 'ZB', 'YB']
|
169
|
+
|
170
|
+
const i = Math.floor(Math.log(bytes) / Math.log(k))
|
171
|
+
|
172
|
+
return parseFloat((bytes / Math.pow(k, i)).toFixed(dm)) + ' ' + sizes[i]
|
173
|
+
}
|
174
|
+
const handleDownload = (e) => {
|
175
|
+
let find = blobList[Number(e.id.replace(/^\D+/g, ''))].blob
|
176
|
+
let fileName = blobList[Number(e.id.replace(/^\D+/g, ''))].fileName.name
|
177
|
+
|
178
|
+
let format = document.querySelector('#image-format').value
|
179
|
+
|
180
|
+
switch (e.dataset.type) {
|
181
|
+
case 'image':
|
182
|
+
let a = document.createElement('a')
|
183
|
+
a.href = find
|
184
|
+
a.download = `safeimagekit-batch-${fileName.split('.')[0]}.${format}`
|
185
|
+
document.body.appendChild(a)
|
186
|
+
a.click()
|
187
|
+
break
|
188
|
+
default:
|
189
|
+
break
|
190
|
+
}
|
191
|
+
}
|
192
|
+
const showLoading = () => {
|
193
|
+
document.querySelector('#file-loader').style.display = 'flex'
|
194
|
+
document.querySelector('.file-input').style.display = 'none'
|
195
|
+
}
|
196
|
+
const stopLoading = () => {
|
197
|
+
fileDropBox.style.display = 'none'
|
198
|
+
}
|
199
|
+
const showDropDown = document.querySelector('.file-pick-dropdown')
|
200
|
+
const icon = document.querySelector('.arrow-sign')
|
201
|
+
const dropDown = document.querySelector('.file-picker-dropdown')
|
202
|
+
showDropDown.addEventListener('click', () => {
|
203
|
+
addScripts()
|
204
|
+
if (dropDown.style.display !== 'none') {
|
205
|
+
dropDown.style.display = 'none'
|
206
|
+
icon.classList.remove('fa-angle-up')
|
207
|
+
icon.classList.add('fa-angle-down')
|
208
|
+
} else {
|
209
|
+
dropDown.style.display = 'block'
|
210
|
+
icon.classList.remove('fa-angle-down')
|
211
|
+
icon.classList.add('fa-angle-up')
|
212
|
+
}
|
213
|
+
})
|
214
|
+
|
215
|
+
const getBase64String = (dataURL) => {
|
216
|
+
const idx = dataURL.indexOf('base64,') + 'base64,'.length
|
217
|
+
return dataURL.substring(idx)
|
218
|
+
}
|
219
|
+
const dataURLtoBlob = (dataurl) => {
|
220
|
+
let arr = dataurl.split(','),
|
221
|
+
mime = arr[0].match(/:(.*?);/)[1],
|
222
|
+
bstr = atob(arr[1]),
|
223
|
+
n = bstr.length,
|
224
|
+
u8arr = new Uint8Array(n)
|
225
|
+
while (n--) {
|
226
|
+
u8arr[n] = bstr.charCodeAt(n)
|
227
|
+
}
|
228
|
+
return new Blob([u8arr], { type: mime })
|
229
|
+
}
|
@@ -1,3 +1,3 @@
|
|
1
|
-
$(function () {
|
2
|
-
$('[data-toggle="tooltip"]').tooltip()
|
3
|
-
})
|
1
|
+
$(function () {
|
2
|
+
$('[data-toggle="tooltip"]').tooltip()
|
3
|
+
})
|