/*
* @title ZIP化！「260815_超かぐや姫おつかれさま本」
* @description Dropboxから「260815_超かぐや姫おつかれさま本」の画像をZIP形式でダウンロードする
* @include https://www.dropbox.com/*
* @license MIT License
* @require
* @javascript_url
*/
/*
//「260815_超かぐや姫おつかれさま本」公開ページはこちら↓
// https://www.dropbox.com/scl/fi/2dz2rnch41n0ym6svx2v1/260815_.pdf?rlkey=79hr9bq43shkosbwhe93003lu&st=z03mvt95&e=1&dl=0
// ※関連ツイート(ポスト) → https://x.com/momocyo/status/2088566368677331068
*/
(async () => {
const wait = msec => new Promise(resolve => setTimeout(resolve, msec));
const script = document.createElement('script');
script.nonce = document.querySelector('script[nonce]').nonce;
script.src = 'https://cdnjs.cloudflare.com/ajax/libs/jszip/3.10.1/jszip.min.js';
document.documentElement.append(script);
for (let ci=0; ci < 50; ci++) {
if (typeof JSZip !== 'undefined') break;
await wait(100);
}
if (typeof JSZip === 'undefined') {
alert('Failed to load JSZIP');
return;
}
const document_title = document.querySelector('title').textContent;
const max_page = [...document.querySelector('[data-testid="page-count"],[role="document"]>div>.dig-Layer>div>.dig-Text').childNodes].filter(elem=>elem.nodeName=='#text').map(elm=>elm.nodeValue).join('').match(/\/\s*(\d+)/)[1] - 0;
const max_page_strlen = `${max_page*2-2}`.length;
const sample_img = document.querySelector('[data-testid="preview-viewport"] [id^="pageContainer"][data-index] img');
const img_url = new URL(sample_img.src);
const img_ext = img_url.pathname.match(/\.[^.]+$/)[0];
const progress_container = document.createElement('div');
Object.assign(progress_container.style, {
position: 'fixed',
top: '4px',
left: '8px',
zIndex: 10000,
padding: '4px',
fontFamily: 'monospace',
color: 'black',
backgroundColor: 'lightyellow',
});
document.documentElement.append(progress_container);
const show_progress = page_number => progress_container.textContent = `ZIP: ${page_number} / ${max_page}`;
const canvas = document.createElement('canvas');
Object.assign(canvas.style, {
display: 'none',
});
document.documentElement.append(canvas);
const context = canvas.getContext('2d');
const canvas_to_blob = () => new Promise(resolve => canvas.toBlob(blob => resolve(blob), 'image/png', 1));
const get_img_filename = img_number => `${(''+img_number).padStart(max_page_strlen, 0)}.png`;
const zip = new JSZip();
for (let page_number=0, img_number=1; page_number < max_page; page_number++) {
show_progress(page_number+1);
img_url.searchParams.set('page', page_number);
const response = await fetch(img_url.href);
if (! response.ok) {
console.error(`Fetch failure ${page_number+1}: ${img_url.href}`);
continue;
}
const img_data = await response.blob();
const img_bitmap = await createImageBitmap(img_data);
console.log(`${page_number+1}: ${img_bitmap.width}x${img_bitmap.height}`);
if (img_bitmap.width <= img_bitmap.height) {
zip.file(`${(''+img_number).padStart(max_page_strlen, 0)}${img_ext}`, img_data);
img_number++;
}
else {
const slice_width = Math.floor(img_bitmap.width / 2);
canvas.width = slice_width;
canvas.height = img_bitmap.height;
context.drawImage(img_bitmap, 0, 0, slice_width, img_bitmap.height, 0, 0, slice_width, img_bitmap.height);
zip.file(`${get_img_filename(img_number)}`, await canvas_to_blob());
img_number++;
const slice_width2 = img_bitmap.width - slice_width;
canvas.width = slice_width2;
context.drawImage(img_bitmap, slice_width, 0, slice_width2, img_bitmap.height, 0, 0, slice_width2, img_bitmap.height);
zip.file(`${get_img_filename(img_number)}`, await canvas_to_blob());
img_number++;
}
}
const blob = await zip.generateAsync({type: 'blob', compression: 'STORE'});
const download_link = document.createElement('a');
const blob_url = URL.createObjectURL(blob);
download_link.href = blob_url;
download_link.download = `${document_title.replace(/\.[^.]+$/,'')}.zip`;
document.documentElement.append(download_link);
download_link.click();
download_link.remove();
URL.revokeObjectURL(blob_url);
canvas.remove();
progress_container.remove();
})();
