Skip to content

G
gu imageworks extension
Commit 5361f943 authored by edwin's avatar edwin
Browse files
Options

indent

parent 410d6b44
Hide whitespace changes
Inline Side-by-side
Showing with 140 additions and 140 deletions
fetch/fetch.js
View file @ 5361f943
(function(){ (function () {
const baseurl = "https://digitallibrary-external.fastretailing.com/"; const baseurl = "https://digitallibrary-external.fastretailing.com/";
const fetchNumber = 30; const fetchNumber = 30;
...@@ -7,37 +7,37 @@ ...@@ -7,37 +7,37 @@
// adding the lightbox (control panel) to the body // adding the lightbox (control panel) to the body
// by grabbing the lightbox.html // by grabbing the lightbox.html
function addLightBox(){ function addLightBox() {
if(document.URL === baseurl){ if (document.URL === baseurl) {
fetch(chrome.extension.getURL("fetch/lightbox.html")) fetch(chrome.extension.getURL("fetch/lightbox.html"))
.then(response => response.text()) .then(response => response.text())
.then(result => document.body.insertAdjacentHTML('beforeend', result)) .then(result => document.body.insertAdjacentHTML('beforeend', result))
.then(()=>{ .then(() => {
// turn on/ off lightbox // turn on/ off lightbox
document.querySelector("#lightbox-switch").addEventListener("click",function(){ document.querySelector("#lightbox-switch").addEventListener("click", function () {
document.getElementById("fetch-lightbox").classList.add("on"); document.getElementById("fetch-lightbox").classList.add("on");
}); });
document.querySelector("#fetch-lightbox .close-btn").addEventListener("click",function(){ document.querySelector("#fetch-lightbox .close-btn").addEventListener("click", function () {
document.getElementById("fetch-lightbox").classList.remove("on"); document.getElementById("fetch-lightbox").classList.remove("on");
}); });
document.querySelector("#searchSKUs").addEventListener("click", startFetching); document.querySelector("#searchSKUs").addEventListener("click", startFetching);
document.querySelector("#downloadSelectedSKUs").addEventListener("click",downloadFetching); document.querySelector("#downloadSelectedSKUs").addEventListener("click", downloadFetching);
document.querySelector("#downloadAllSKUs").addEventListener("click",extensionDownloading); document.querySelector("#downloadAllSKUs").addEventListener("click", extensionDownloading);
document.querySelector("#filter-date").addEventListener("change",clientSideFilter); document.querySelector("#filter-date").addEventListener("change", clientSideFilter);
document.querySelector("#show-product-box").addEventListener("change",clientSideFilter); document.querySelector("#show-product-box").addEventListener("change", clientSideFilter);
document.querySelector("#show-model-box").addEventListener("change",clientSideFilter); document.querySelector("#show-model-box").addEventListener("change", clientSideFilter);
document.querySelector("#filter-unrelated").addEventListener("change",clientSideFilter); document.querySelector("#filter-unrelated").addEventListener("change", clientSideFilter);
document.querySelector("#fetch-lightbox .debug-box").addEventListener("click",function(event){ document.querySelector("#fetch-lightbox .debug-box").addEventListener("click", function (event) {
if(!event.target.classList.contains("debug-box")){ if (!event.target.classList.contains("debug-box")) {
event.target.closest('.asset-item').classList.toggle("on"); event.target.closest('.asset-item').classList.toggle("on");
} }
}); });
}) })
.catch(error => console.error("Unable to fetch lightbox.html" + error)); .catch(error => console.error("Unable to fetch lightbox.html" + error));
} }
} }
...@@ -47,19 +47,19 @@ ...@@ -47,19 +47,19 @@
return new Promise(resolve => setTimeout(resolve, ms)); return new Promise(resolve => setTimeout(resolve, ms));
} }
function addDebugMessage(str){ function addDebugMessage(str) {
if(allowDebugMessage){ if (allowDebugMessage) {
let div = document.createElement("div"); let div = document.createElement("div");
let content = document.createTextNode(str); let content = document.createTextNode(str);
div.appendChild(content); div.appendChild(content);
document.querySelector("#fetch-lightbox .debug-box").appendChild(div); document.querySelector("#fetch-lightbox .debug-box").appendChild(div);
}else{ } else {
document.querySelector("#fetch-lightbox .info-message").innerHTML = str; document.querySelector("#fetch-lightbox .info-message").innerHTML = str;
} }
} }
function getConfig(){ function getConfig() {
return { return {
"method": "GET", "method": "GET",
"mode": "cors", "mode": "cors",
...@@ -73,20 +73,20 @@ ...@@ -73,20 +73,20 @@
// Reading the textarea and fetch the SKUs one by one // Reading the textarea and fetch the SKUs one by one
// then create DOM and append it // then create DOM and append it
async function startFetching(){ async function startFetching() {
let SKUString = document.getElementById("sku-list").value; let SKUString = document.getElementById("sku-list").value;
if(SKUString.length){ if (SKUString.length) {
let SKUlist = SKUString.split("\n"); let SKUlist = SKUString.split("\n");
let container = document.querySelector("#fetch-lightbox .debug-box"); let container = document.querySelector("#fetch-lightbox .debug-box");
allowDebugMessage = false; allowDebugMessage = false;
// remove container innerHTML // remove container innerHTML
while(container.hasChildNodes()){ while (container.hasChildNodes()) {
container.removeChild(container.firstChild); container.removeChild(container.firstChild);
} }
document.querySelector("#fetch-lightbox .info-message").innerHTML = ""; document.querySelector("#fetch-lightbox .info-message").innerHTML = "";
for(let SKU of SKUlist){ for (let SKU of SKUlist) {
let assetlist = await fetchSKU(SKU); let assetlist = await fetchSKU(SKU);
// determine whether it is product file // determine whether it is product file
...@@ -96,19 +96,19 @@ ...@@ -96,19 +96,19 @@
// determine whether it is product file // determine whether it is product file
let classes = ""; let classes = "";
if( !(asset.file_extension === "jpg" || asset.file_extension === "gif") || if (!(asset.file_extension === "jpg" || asset.file_extension === "gif") ||
asset.filename.includes(`${SKU}_I0`) || asset.filename.includes(`${SKU}_I0`) ||
(asset.filename.includes("goods_") && !asset.filename.includes(SKU))){ (asset.filename.includes("goods_") && !asset.filename.includes(SKU))) {
classes = "is-unrelated"; classes = "is-unrelated";
}else if(asset.filename.includes(`goods_${SKU}_sub`) || } else if (asset.filename.includes(`goods_${SKU}_sub`) ||
asset.filename.includes(`_${SKU}_chip`) || asset.filename.includes(`_${SKU}_chip`) ||
(asset.filename.match(new RegExp(`^goods_[0-9]{2}_${SKU}$`)) && asset.models.length === 0 && asset.products.length === 1) ){ (asset.filename.match(new RegExp(`^goods_[0-9]{2}_${SKU}$`)) && asset.models.length === 0 && asset.products.length === 1)) {
classes = "is-product"; classes = "is-product";
}else { } else {
classes = "is-model"; classes = "is-model";
} }
...@@ -132,27 +132,27 @@ ...@@ -132,27 +132,27 @@
addDebugMessage(`SKU search completed.`); addDebugMessage(`SKU search completed.`);
}else{ } else {
alert("It is empty on SKU list."); alert("It is empty on SKU list.");
} }
} }
// this function base on startFetching, will be used after user selected all assets // this function base on startFetching, will be used after user selected all assets
async function downloadFetching(){ async function downloadFetching() {
// grab selected DOM, and turn from NodeList to Array // grab selected DOM, and turn from NodeList to Array
let DOMArray = [...document.querySelectorAll("#fetch-lightbox .debug-box .asset-item.on")]; let DOMArray = [...document.querySelectorAll("#fetch-lightbox .debug-box .asset-item.on")];
// turn DOM into object array with id and file version // turn DOM into object array with id and file version
let downloadlist = DOMArray.map(x => { let downloadlist = DOMArray.map(x => {
return { return {
"id" : x.querySelector(".asset-id").innerHTML, "id": x.querySelector(".asset-id").innerHTML,
"fileVersion" : x.querySelector(".asset-version").innerHTML "fileVersion": x.querySelector(".asset-version").innerHTML
}; };
}); });
if(downloadlist.length >= 2) if (downloadlist.length >= 2)
await downloadList(downloadlist, `asset_file`); await downloadList(downloadlist, `asset_file`);
else if(downloadlist.length === 1) else if (downloadlist.length === 1)
await downloadList(downloadlist, document.querySelector("#fetch-lightbox .debug-box .asset-item.on .asset-name").innerHTML); await downloadList(downloadlist, document.querySelector("#fetch-lightbox .debug-box .asset-item.on .asset-name").innerHTML);
else else
alert("There is no selected asset."); alert("There is no selected asset.");
...@@ -162,19 +162,19 @@ ...@@ -162,19 +162,19 @@
} }
// perform operation similar to old extension // perform operation similar to old extension
async function extensionDownloading(){ async function extensionDownloading() {
let SKUString = document.getElementById("sku-list").value; let SKUString = document.getElementById("sku-list").value;
if(SKUString.length){ if (SKUString.length) {
let SKUlist = SKUString.split("\n"); let SKUlist = SKUString.split("\n");
let container = document.querySelector("#fetch-lightbox .debug-box"); let container = document.querySelector("#fetch-lightbox .debug-box");
allowDebugMessage = true; allowDebugMessage = true;
while(container.hasChildNodes()){ while (container.hasChildNodes()) {
container.removeChild(container.firstChild); container.removeChild(container.firstChild);
} }
document.querySelector("#fetch-lightbox .info-message").innerHTML = ""; document.querySelector("#fetch-lightbox .info-message").innerHTML = "";
for(let SKU of SKUlist){ for (let SKU of SKUlist) {
let assetlist = await fetchSKU(SKU); let assetlist = await fetchSKU(SKU);
let downloadlist = filtering(assetlist, SKU); let downloadlist = filtering(assetlist, SKU);
await downloadList(downloadlist["product"], `${SKU}_product`); await downloadList(downloadlist["product"], `${SKU}_product`);
...@@ -182,14 +182,14 @@ ...@@ -182,14 +182,14 @@
await downloadList(downloadlist["model"], `${SKU}_model`); await downloadList(downloadlist["model"], `${SKU}_model`);
await sleep(sleepTime); await sleep(sleepTime);
} }
}else{ } else {
alert("It is empty on SKU list."); alert("It is empty on SKU list.");
} }
} }
//grabbing single SKU data //grabbing single SKU data
async function fetchSKU(SKU = ""){ async function fetchSKU(SKU = "") {
if(SKU.length == 0){ if (SKU.length == 0) {
return; return;
} }
...@@ -199,62 +199,62 @@ ...@@ -199,62 +199,62 @@
addDebugMessage(`Start fetching SKU=${SKU}`); addDebugMessage(`Start fetching SKU=${SKU}`);
return await fetch(url,config) return await fetch(url, config)
.then(response => response.json()) .then(response => response.json())
.then(async function(result){ .then(async function (result) {
await sleep(sleepTime); await sleep(sleepTime);
//get json data //get json data
let assetlist = result.assets; let assetlist = result.assets;
let scrollId = result.scrollId; let scrollId = result.scrollId;
let total = result.total; let total = result.total;
// fetch the remaining item by simluating scroll operation // fetch the remaining item by simluating scroll operation
for(let i = total - fetchNumber ; i > 0 ; i -= fetchNumber){ for (let i = total - fetchNumber; i > 0; i -= fetchNumber) {
addDebugMessage(`fetching SKU=${SKU} Process: ${i} remains`); addDebugMessage(`fetching SKU=${SKU} Process: ${i} remains`);
let response = await fetch(`${baseurl}api/asset/more?scrollId=${scrollId}`, config) let response = await fetch(`${baseurl}api/asset/more?scrollId=${scrollId}`, config)
.then(response => response.json()) .then(response => response.json())
.catch(error => { .catch(error => {
addDebugMessage("Fetch error on fetchSKU - Scroll : " + error); addDebugMessage("Fetch error on fetchSKU - Scroll : " + error);
throw new Error("Fetch error on fetchSKU - Scroll : " + error); throw new Error("Fetch error on fetchSKU - Scroll : " + error);
}); });
assetlist = assetlist.concat(response.assets); assetlist = assetlist.concat(response.assets);
await sleep(sleepTime / 2); await sleep(sleepTime / 2);
} }
addDebugMessage(`fetching SKU=${SKU} completed, total item: ${total}`); addDebugMessage(`fetching SKU=${SKU} completed, total item: ${total}`);
return assetlist; return assetlist;
}) })
.catch(error => { .catch(error => {
addDebugMessage("Fetch error on fetchSKU : " + error); addDebugMessage("Fetch error on fetchSKU : " + error);
throw new Error("Fetch error on fetchSKU : " + error); throw new Error("Fetch error on fetchSKU : " + error);
}); });
} }
// filter asset by Date // filter asset by Date
// only used on Search and Download // only used on Search and Download
function clientSideFilter(){ function clientSideFilter() {
let datefilter = 0; let datefilter = 0;
let checkProduct = !document.getElementById("show-product-box").checked; let checkProduct = !document.getElementById("show-product-box").checked;
let checkModel = !document.getElementById("show-model-box").checked; let checkModel = !document.getElementById("show-model-box").checked;
let checkRelated = document.getElementById("filter-unrelated").checked; let checkRelated = document.getElementById("filter-unrelated").checked;
if(document.getElementById("filter-date").value){ if (document.getElementById("filter-date").value) {
datefilter = new Date().setHours(0,0,0,0) / 1000 - document.getElementById("filter-date").value * 86400; datefilter = new Date().setHours(0, 0, 0, 0) / 1000 - document.getElementById("filter-date").value * 86400;
} }
document.querySelectorAll("#fetch-lightbox .debug-box .asset-item").forEach(asset => { document.querySelectorAll("#fetch-lightbox .debug-box .asset-item").forEach(asset => {
asset.classList.remove("on"); asset.classList.remove("on");
asset.style.display = "none"; asset.style.display = "none";
if(asset.querySelector(".asset-date").innerHTML > datefilter && if (asset.querySelector(".asset-date").innerHTML > datefilter &&
(!checkProduct || (checkProduct && !asset.classList.contains("is-product"))) && (!checkProduct || (checkProduct && !asset.classList.contains("is-product"))) &&
(!checkModel || (checkModel && !asset.classList.contains("is-model"))) && (!checkModel || (checkModel && !asset.classList.contains("is-model"))) &&
(!checkRelated || (checkRelated && !asset.classList.contains("is-unrelated"))) (!checkRelated || (checkRelated && !asset.classList.contains("is-unrelated")))
){ ) {
asset.style.display = ""; asset.style.display = "";
} }
}); });
...@@ -265,25 +265,25 @@ ...@@ -265,25 +265,25 @@
// usage: // usage:
// let downloadlist = filtering(assetlist, SKU); // let downloadlist = filtering(assetlist, SKU);
function filtering(assetlist, SKU){ function filtering(assetlist, SKU) {
assetlist = assetlist.filter(asset => asset.file_extension === "jpg" || asset.file_extension === "gif"); assetlist = assetlist.filter(asset => asset.file_extension === "jpg" || asset.file_extension === "gif");
let multilist = assetlist.reduce(function(arrlist, item){ let multilist = assetlist.reduce(function (arrlist, item) {
if( item.filename.includes(`goods_${SKU}_sub`) || if (item.filename.includes(`goods_${SKU}_sub`) ||
item.filename.includes(`_${SKU}_chip`) || item.filename.includes(`_${SKU}_chip`) ||
(item.filename.match(new RegExp(`^goods_[0-9]{2}_${SKU}$`)) && item.models.length === 0 && item.products.length === 1)){ // file name include SKU and no model (item.filename.match(new RegExp(`^goods_[0-9]{2}_${SKU}$`)) && item.models.length === 0 && item.products.length === 1)) { // file name include SKU and no model
arrlist["product"].push(item); arrlist["product"].push(item);
}else if( item.filename.includes(`${SKU}_I0`) || } else if (item.filename.includes(`${SKU}_I0`) ||
(item.filename.includes("goods") && !item.filename.includes(SKU))){ (item.filename.includes("goods") && !item.filename.includes(SKU))) {
// not adding to model // not adding to model
}else{ } else {
arrlist["model"].push(item); arrlist["model"].push(item);
} }
return arrlist; return arrlist;
}, {"product" : [], "model" : []}); // initial value }, { "product": [], "model": [] }); // initial value
return multilist; return multilist;
} }
...@@ -292,14 +292,14 @@ ...@@ -292,14 +292,14 @@
// downloadList usage: // downloadList usage:
// await downloadList(downloadlist["product"], "123456_product"); // await downloadList(downloadlist["product"], "123456_product");
// await downloadList(downloadlist["model"], "123456_model"); // await downloadList(downloadlist["model"], "123456_model");
async function downloadList(assetlist, name){ async function downloadList(assetlist, name) {
if(assetlist.length >= 2){ if (assetlist.length >= 2) {
let id = assetlist.map(asset => asset.id); let id = assetlist.map(asset => asset.id);
let revision = assetlist.map(asset => asset.fileVersion); let revision = assetlist.map(asset => asset.fileVersion);
let json = JSON.stringify({id : id, revision: revision}); let json = JSON.stringify({ id: id, revision: revision });
console.log(json); console.log(json);
// prepare header for POST request // prepare header for POST request
...@@ -309,46 +309,46 @@ ...@@ -309,46 +309,46 @@
postheader.append("origin", "https://digitallibrary-external.fastretailing.com"); postheader.append("origin", "https://digitallibrary-external.fastretailing.com");
// send POST request for getting download token // send POST request for getting download token
let response = await fetch(`${baseurl}api/asset/downloadtoken`,{ let response = await fetch(`${baseurl}api/asset/downloadtoken`, {
"method": "POST", "method": "POST",
"headers": postheader, "headers": postheader,
"mode": "cors", "mode": "cors",
"redirect": "follow", "redirect": "follow",
"body": json "body": json
}) })
.then(response => response.json()) .then(response => response.json())
.catch(error => { .catch(error => {
addDebugMessage("Fetch error on DownloadList - POST request: " + error); addDebugMessage("Fetch error on DownloadList - POST request: " + error);
throw new Error("Fetch error on DownloadList - POST request: " + error); throw new Error("Fetch error on DownloadList - POST request: " + error);
}); });
// send GET request for downloading the zip file // send GET request for downloading the zip file
fetch(`/api/asset/download/${response.token}`, getConfig()) fetch(`/api/asset/download/${response.token}`, getConfig())
.then(response => response.blob()) .then(response => response.blob())
.then(blob => { .then(blob => {
// https://stackoverflow.com/questions/32545632/how-can-i-download-a-file-using-window-fetch // https://stackoverflow.com/questions/32545632/how-can-i-download-a-file-using-window-fetch
let url = window.URL.createObjectURL(blob); let url = window.URL.createObjectURL(blob);
let a = document.createElement('a'); let a = document.createElement('a');
a.href = url; a.href = url;
a.download = `${name}.zip`; a.download = `${name}.zip`;
document.body.appendChild(a); // we need to append the element to the dom -> otherwise it will not work in firefox document.body.appendChild(a); // we need to append the element to the dom -> otherwise it will not work in firefox
a.click(); a.click();
a.remove(); //afterwards we remove the element again a.remove(); //afterwards we remove the element again
addDebugMessage(`download ${name}.zip completed`); addDebugMessage(`download ${name}.zip completed`);
}) })
.catch(error => { .catch(error => {
addDebugMessage("Fetch error on DownloadList - GET request: " + error); addDebugMessage("Fetch error on DownloadList - GET request: " + error);
throw new Error("Fetch error on DownloadList - GET request: " + error); throw new Error("Fetch error on DownloadList - GET request: " + error);
}); });
}else if(assetlist.length === 1){ } else if (assetlist.length === 1) {
// just use anchor tag to download single file // just use anchor tag to download single file
let id = assetlist[0].id; let id = assetlist[0].id;
let filename = assetlist[0].filename; let filename = assetlist[0].filename;
if(filename === undefined) if (filename === undefined)
filename = name; filename = name;
let downloadDOM = document.getElementById("download-trigger"); let downloadDOM = document.getElementById("download-trigger");
downloadDOM.setAttribute('href', `/api/asset/${id}/download/`); downloadDOM.setAttribute('href', `/api/asset/${id}/download/`);
...@@ -356,7 +356,7 @@ ...@@ -356,7 +356,7 @@
downloadDOM.click(); downloadDOM.click();
addDebugMessage(`download file ${filename} completed`); addDebugMessage(`download file ${filename} completed`);
}else{ } else {
addDebugMessage(`asset list is empty.`); addDebugMessage(`asset list is empty.`);
} }
} }
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment