no-muse/musescore-downloader
1
0
Fork 0
Code Issues Pull requests Projects Releases Wiki Activity

v0.4.0 - use Web Worker to generate PDF faster

Browse source
This commit is contained in:
Xmader 2019-12-01 18:30:38 -05:00
parent 3b038bf2e1
commit ac127c7b25
5 changed files with 25730 additions and 25379 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

349
dist/main.js vendored
View file

@ -3,7 +3,7 @@
// @namespace https://www.xmader.com/
// @homepageURL https://github.com/Xmader/musescore-downloader/
// @supportURL https://github.com/Xmader/musescore-downloader/issues
// @version 0.3.4
// @version 0.4.0
// @description download sheet music from musescore.com for free, no login or Musescore Pro required | 免登录、免 Musescore Pro，免费下载 musescore.com 上的曲谱
// @author Xmader
// @match https://musescore.com/*/*
@ -43,6 +43,22 @@
typeof self !== "undefined" ? self :
typeof window !== "undefined" ? window : {});
const PDFWorker = function () {
(function () {
function __awaiter(thisArg, _arguments, P, generator) {
return new (P || (P = Promise))(function (resolve, reject) {
function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
function step(result) { result.done ? resolve(result.value) : new P(function (resolve) { resolve(result.value); }).then(fulfilled, rejected); }
step((generator = generator.apply(thisArg, _arguments || [])).next());
});
}
var global$1$1 = (typeof global$1 !== "undefined" ? global$1 :
typeof self !== "undefined" ? self :
typeof window !== "undefined" ? window : {});
var lookup = [];
var revLookup = [];
var Arr = typeof Uint8Array !== 'undefined' ? Uint8Array : Array;
@ -270,8 +286,8 @@
* We detect these buggy browsers and set `Buffer.TYPED_ARRAY_SUPPORT` to `false` so they
* get the Object implementation, which is slower but behaves correctly.
*/
Buffer.TYPED_ARRAY_SUPPORT = global$1.TYPED_ARRAY_SUPPORT !== undefined
? global$1.TYPED_ARRAY_SUPPORT
Buffer.TYPED_ARRAY_SUPPORT = global$1$1.TYPED_ARRAY_SUPPORT !== undefined
? global$1$1.TYPED_ARRAY_SUPPORT
: true;
function kMaxLength () {
@ -2481,10 +2497,10 @@
}
var cachedSetTimeout = defaultSetTimout;
var cachedClearTimeout = defaultClearTimeout;
if (typeof global$1.setTimeout === 'function') {
if (typeof global$1$1.setTimeout === 'function') {
cachedSetTimeout = setTimeout;
}
if (typeof global$1.clearTimeout === 'function') {
if (typeof global$1$1.clearTimeout === 'function') {
cachedClearTimeout = clearTimeout;
}
@ -2605,7 +2621,7 @@
};
// from https://github.com/kumavis/browser-process-hrtime/blob/master/index.js
var performance = global$1.performance || {};
var performance = global$1$1.performance || {};
var performanceNow =
performance.now ||
performance.mozNow ||
@ -2683,7 +2699,7 @@
// If --no-deprecation is set, then it is a no-op.
function deprecate(fn, msg) {
// Allow for deprecating things in the process of starting up.
if (isUndefined(global$1.process)) {
if (isUndefined(global$1$1.process)) {
return function() {
return deprecate(fn, msg).apply(this, arguments);
};
@ -3142,8 +3158,8 @@
* We detect these buggy browsers and set `Buffer.TYPED_ARRAY_SUPPORT` to `false` so they
* get the Object implementation, which is slower but behaves correctly.
*/
Buffer$1.TYPED_ARRAY_SUPPORT = global$1.TYPED_ARRAY_SUPPORT !== undefined
? global$1.TYPED_ARRAY_SUPPORT
Buffer$1.TYPED_ARRAY_SUPPORT = global$1$1.TYPED_ARRAY_SUPPORT !== undefined
? global$1$1.TYPED_ARRAY_SUPPORT
: true;
function kMaxLength$1 () {
@ -6948,10 +6964,10 @@
}
var cachedSetTimeout$1 = defaultSetTimout$1;
var cachedClearTimeout$1 = defaultClearTimeout$1;
if (typeof global$1.setTimeout === 'function') {
if (typeof global$1$1.setTimeout === 'function') {
cachedSetTimeout$1 = setTimeout;
}
if (typeof global$1.clearTimeout === 'function') {
if (typeof global$1$1.clearTimeout === 'function') {
cachedClearTimeout$1 = clearTimeout;
}
@ -7072,7 +7088,7 @@
};
// from https://github.com/kumavis/browser-process-hrtime/blob/master/index.js
var performance$1 = global$1.performance || {};
var performance$1 = global$1$1.performance || {};
var performanceNow$1 =
performance$1.now ||
performance$1.mozNow ||
@ -13528,7 +13544,7 @@
}
}
var commonjsGlobal = typeof globalThis !== 'undefined' ? globalThis : typeof window !== 'undefined' ? window : typeof global !== 'undefined' ? global : typeof self !== 'undefined' ? self : {};
var commonjsGlobal = typeof globalThis !== 'undefined' ? globalThis : typeof window !== 'undefined' ? window : typeof global$1 !== 'undefined' ? global$1 : typeof self !== 'undefined' ? self : {};
function createCommonjsModule(fn, module) {
return module = { exports: {} }, fn(module, module.exports), module.exports;
@ -25982,12 +25998,264 @@ Please pipe the document into a Node stream.\
mixin(ImagesMixin);
mixin(OutputDocumentBrowser);
/// <reference lib="webworker" />
const generatePDF = (imgDataUrlList, width, height) => __awaiter(void 0, void 0, void 0, function* () {
// @ts-ignore
const pdf = new PDFDocument({
// compress: true,
size: [width, height],
autoFirstPage: false,
margin: 0,
layout: "portrait",
});
imgDataUrlList.forEach((data) => {
pdf.addPage();
pdf.image(data, {
width,
height,
});
});
// @ts-ignore
const buf = yield pdf.getBuffer();
return buf.buffer;
});
const getDataURL = (blob) => {
return new Promise((resolve, reject) => {
const reader = new FileReader();
reader.onload = () => {
const result = reader.result;
resolve(result);
};
reader.onerror = reject;
reader.readAsDataURL(blob);
});
};
onmessage = (e) => __awaiter(void 0, void 0, void 0, function* () {
const [imgDataBlobList, width, height,] = e.data;
const dataURLs = yield Promise.all(imgDataBlobList.map(getDataURL));
const pdfBuf = yield generatePDF(dataURLs, width, height);
postMessage(pdfBuf, [pdfBuf]);
});
}());
return Worker
};
const scriptUrlFromFunction = (fn) => {
const blob = new Blob(["(" + fn.toString() + ")()"], { type: "application/javascript" });
return URL.createObjectURL(blob);
};
class PDFWorkerHelper extends Worker {
constructor() {
const url = scriptUrlFromFunction(PDFWorker);
super(url);
}
generatePDF(imgDataBlobList, width, height) {
const msg = [
imgDataBlobList,
width,
height,
];
this.postMessage(msg);
return new Promise((resolve) => {
this.addEventListener("message", (e) => {
resolve(e.data);
});
});
}
}
var commonjsGlobal = typeof globalThis !== 'undefined' ? globalThis : typeof window !== 'undefined' ? window : typeof global !== 'undefined' ? global : typeof self !== 'undefined' ? self : {};
function createCommonjsModule(fn, module) {
return module = { exports: {} }, fn(module, module.exports), module.exports;
}
var FileSaver = createCommonjsModule(function (module, exports) {
(function (global, factory) {
{
factory();
}
})(commonjsGlobal, function () {
/*
* FileSaver.js
* A saveAs() FileSaver implementation.
*
* By Eli Grey, http://eligrey.com
*
* License : https://github.com/eligrey/FileSaver.js/blob/master/LICENSE.md (MIT)
* source : http://purl.eligrey.com/github/FileSaver.js
*/
// The one and only way of getting global scope in all environments
// https://stackoverflow.com/q/3277182/1008999
var _global = typeof window === 'object' && window.window === window ? window : typeof self === 'object' && self.self === self ? self : typeof commonjsGlobal === 'object' && commonjsGlobal.global === commonjsGlobal ? commonjsGlobal : void 0;
function bom(blob, opts) {
if (typeof opts === 'undefined') opts = {
autoBom: false
};else if (typeof opts !== 'object') {
console.warn('Deprecated: Expected third argument to be a object');
opts = {
autoBom: !opts
};
} // prepend BOM for UTF-8 XML and text/* types (including HTML)
// note: your browser will automatically convert UTF-16 U+FEFF to EF BB BF
if (opts.autoBom && /^\s*(?:text\/\S*|application\/xml|\S*\/\S*\+xml)\s*;.*charset\s*=\s*utf-8/i.test(blob.type)) {
return new Blob([String.fromCharCode(0xFEFF), blob], {
type: blob.type
});
}
return blob;
}
function download(url, name, opts) {
var xhr = new XMLHttpRequest();
xhr.open('GET', url);
xhr.responseType = 'blob';
xhr.onload = function () {
saveAs(xhr.response, name, opts);
};
xhr.onerror = function () {
console.error('could not download file');
};
xhr.send();
}
function corsEnabled(url) {
var xhr = new XMLHttpRequest(); // use sync to avoid popup blocker
xhr.open('HEAD', url, false);
try {
xhr.send();
} catch (e) {}
return xhr.status >= 200 && xhr.status <= 299;
} // `a.click()` doesn't work for all browsers (#465)
function click(node) {
try {
node.dispatchEvent(new MouseEvent('click'));
} catch (e) {
var evt = document.createEvent('MouseEvents');
evt.initMouseEvent('click', true, true, window, 0, 0, 0, 80, 20, false, false, false, false, 0, null);
node.dispatchEvent(evt);
}
}
var saveAs = _global.saveAs || ( // probably in some web worker
typeof window !== 'object' || window !== _global ? function saveAs() {}
/* noop */
// Use download attribute first if possible (#193 Lumia mobile)
: 'download' in HTMLAnchorElement.prototype ? function saveAs(blob, name, opts) {
var URL = _global.URL || _global.webkitURL;
var a = document.createElement('a');
name = name || blob.name || 'download';
a.download = name;
a.rel = 'noopener'; // tabnabbing
// TODO: detect chrome extensions & packaged apps
// a.target = '_blank'
if (typeof blob === 'string') {
// Support regular links
a.href = blob;
if (a.origin !== location.origin) {
corsEnabled(a.href) ? download(blob, name, opts) : click(a, a.target = '_blank');
} else {
click(a);
}
} else {
// Support blobs
a.href = URL.createObjectURL(blob);
setTimeout(function () {
URL.revokeObjectURL(a.href);
}, 4E4); // 40s
setTimeout(function () {
click(a);
}, 0);
}
} // Use msSaveOrOpenBlob as a second approach
: 'msSaveOrOpenBlob' in navigator ? function saveAs(blob, name, opts) {
name = name || blob.name || 'download';
if (typeof blob === 'string') {
if (corsEnabled(blob)) {
download(blob, name, opts);
} else {
var a = document.createElement('a');
a.href = blob;
a.target = '_blank';
setTimeout(function () {
click(a);
});
}
} else {
navigator.msSaveOrOpenBlob(bom(blob, opts), name);
}
} // Fallback to using FileReader and a popup
: function saveAs(blob, name, opts, popup) {
// Open a popup immediately do go around popup blocker
// Mostly only available on user interaction and the fileReader is async so...
popup = popup || open('', '_blank');
if (popup) {
popup.document.title = popup.document.body.innerText = 'downloading...';
}
if (typeof blob === 'string') return download(blob, name, opts);
var force = blob.type === 'application/octet-stream';
var isSafari = /constructor/i.test(_global.HTMLElement) || _global.safari;
var isChromeIOS = /CriOS\/[\d]+/.test(navigator.userAgent);
if ((isChromeIOS || force && isSafari) && typeof FileReader === 'object') {
// Safari doesn't allow downloading of blob URLs
var reader = new FileReader();
reader.onloadend = function () {
var url = reader.result;
url = isChromeIOS ? url : url.replace(/^data:[^;]*;/, 'data:attachment/file;');
if (popup) popup.location.href = url;else location = url;
popup = null; // reverse-tabnabbing #460
};
reader.readAsDataURL(blob);
} else {
var URL = _global.URL || _global.webkitURL;
var url = URL.createObjectURL(blob);
if (popup) popup.location = url;else location.href = url;
popup = null; // reverse-tabnabbing #460
setTimeout(function () {
URL.revokeObjectURL(url);
}, 4E4); // 40s
}
});
_global.saveAs = saveAs.saveAs = saveAs;
{
module.exports = saveAs;
}
});
});
const saveAs = FileSaver.saveAs;
let pdfBlob;
const svgToPng = (svgURL) => __awaiter(void 0, void 0, void 0, function* () {
const imgToBlob = (imgURL) => __awaiter(void 0, void 0, void 0, function* () {
const imageElement = document.createElement("img");
imageElement.style.display = "none";
document.body.appendChild(imageElement);
imageElement.src = svgURL;
imageElement.src = imgURL;
// wait until image loaded
yield new Promise((resolve) => {
imageElement.onload = () => resolve();
@ -26001,39 +26269,23 @@ Please pipe the document into a Node stream.\
document.body.appendChild(canvas);
canvasContext.clearRect(0, 0, width, height);
canvasContext.drawImage(imageElement, 0, 0);
const data = canvas.toDataURL("image/png");
const data = yield new Promise(resolve => canvas.toBlob(resolve, "image/png"));
canvas.remove();
imageElement.remove();
return data;
});
const generatePDF = (svgURLs, name) => __awaiter(void 0, void 0, void 0, function* () {
if (pdfBlob) {
return FileSaver(pdfBlob, `${name}.pdf`);
return saveAs(pdfBlob, `${name}.pdf`);
}
const cachedImg = document.querySelector("img[id^=score_]");
const { naturalWidth: width, naturalHeight: height } = cachedImg;
const imgDataList = yield Promise.all(svgURLs.map(svgToPng));
// @ts-ignore
const pdf = new PDFDocument({
// compress: true,
size: [width, height],
autoFirstPage: false,
margin: 0,
layout: "portrait",
});
imgDataList.forEach((data) => {
pdf.addPage();
pdf.image(data, {
width,
height,
});
});
// TODO: webworker
// @ts-ignore
return pdf.getBlob().then((blob) => {
pdfBlob = blob;
FileSaver(blob, `${name}.pdf`);
});
const imgDataBlobList = yield Promise.all(svgURLs.map(imgToBlob));
const worker = new PDFWorkerHelper();
const pdfArrayBuffer = yield worker.generatePDF(imgDataBlobList, width, height);
worker.terminate();
pdfBlob = new Blob([pdfArrayBuffer]);
saveAs(pdfBlob, `${name}.pdf`);
});
const getPagesNumber = (scorePlayerData) => {
try {
@ -26043,6 +26295,17 @@ Please pipe the document into a Node stream.\
return document.querySelectorAll("img[id^=score_]").length;
}
};
const getImgType = () => {
try {
const imgE = document.querySelector("img[id^=score_]");
const { pathname } = new URL(imgE.src);
const imgtype = pathname.match(/\.(\w+)$/)[1];
return imgtype;
}
catch (_) {
return null;
}
};
const getTitle = (scorePlayerData) => {
try {
return scorePlayerData.json.metadata.title;
@ -26052,7 +26315,7 @@ Please pipe the document into a Node stream.\
}
};
const getScoreFileName = (scorePlayerData) => {
return getTitle(scorePlayerData).replace(/\W+/g, "_");
return getTitle(scorePlayerData).replace(/[\s<>:"/\\|?*~\0\cA-\cZ]+/g, "_");
};
const main = () => {
// @ts-ignore
@ -26071,8 +26334,9 @@ Please pipe the document into a Node stream.\
const btnsDiv = document.querySelector(".score-right .buttons-wrapper") || document.querySelectorAll("aside section > div")[3];
const downloadBtn = btnsDiv.querySelector("button, .button");
downloadBtn.onclick = null;
const imgType = getImgType() || "svg";
const svgURLs = Array.from({ length: getPagesNumber(scorePlayer) }).fill(null).map((_, i) => {
return baseURL + `score_${i}.svg`;
return baseURL + `score_${i}.${imgType}`;
});
const downloadURLs = {
"MSCZ": msczURL,
@ -26090,8 +26354,7 @@ Please pipe the document into a Node stream.\
btn.dataset.target = "";
}
const textNode = [...btn.childNodes].find((x) => {
return x.nodeName.toLowerCase() == "#text"
&& x.textContent.includes("Download");
return x.textContent.includes("Download");
});
textNode.textContent = `Download ${name}`;
return {

3
package.json
View file

@ -1,6 +1,6 @@
{
"name": "musescore-downloader",
"version": "0.3.4",
"version": "0.4.0",
"description": "download sheet music from musescore.com for free, no login or Musescore Pro required | 免登录、免 Musescore Pro，免费下载 musescore.com 上的曲谱",
"main": "dist/main.js",
"repository": {
@ -18,6 +18,7 @@
},
"devDependencies": {
"@rollup/plugin-json": "^4.0.0",
"@types/file-saver": "^2.0.1",
"@types/pdfkit": "^0.10.4",
"rollup": "^1.26.3",
"rollup-plugin-commonjs": "^10.1.0",

61
src/main.ts
View file

@ -3,17 +3,19 @@ import "./meta"
import { ScorePlayerData } from "./types"
import { waitForDocumentLoaded } from "./utils"
import PDFDocument from "pdfkit/lib/document"
import saveAs from "file-saver/dist/FileSaver.js"
import { PDFWorkerHelper } from "./worker-helper"
import FileSaver from "file-saver/dist/FileSaver.js"
const saveAs: typeof import("file-saver").saveAs = FileSaver.saveAs
let pdfBlob: Blob
const svgToPng = async (svgURL: string) => {
const imgToBlob = async (imgURL: string) => {
const imageElement = document.createElement("img")
imageElement.style.display = "none"
document.body.appendChild(imageElement)
imageElement.src = svgURL
imageElement.src = imgURL
// wait until image loaded
await new Promise((resolve) => {
@ -34,7 +36,7 @@ const svgToPng = async (svgURL: string) => {
canvasContext.clearRect(0, 0, width, height)
canvasContext.drawImage(imageElement, 0, 0)
const data = canvas.toDataURL("image/png")
const data: Blob = await new Promise(resolve => canvas.toBlob(resolve, "image/png"))
canvas.remove()
imageElement.remove()
@ -50,32 +52,15 @@ const generatePDF = async (svgURLs: string[], name?: string) => {
const cachedImg = document.querySelector("img[id^=score_]") as HTMLImageElement
const { naturalWidth: width, naturalHeight: height } = cachedImg
const imgDataList = await Promise.all(svgURLs.map(svgToPng))
const imgDataBlobList = await Promise.all(svgURLs.map(imgToBlob))
// @ts-ignore
const pdf = new (PDFDocument as typeof import("pdfkit"))({
// compress: true,
size: [width, height],
autoFirstPage: false,
margin: 0,
layout: "portrait",
})
const worker = new PDFWorkerHelper()
const pdfArrayBuffer = await worker.generatePDF(imgDataBlobList, width, height)
worker.terminate()
imgDataList.forEach((data) => {
pdf.addPage()
pdf.image(data, {
width,
height,
})
})
pdfBlob = new Blob([pdfArrayBuffer])
// TODO: webworker
// @ts-ignore
return pdf.getBlob().then((blob: Blob) => {
pdfBlob = blob
saveAs(blob, `${name}.pdf`)
})
saveAs(pdfBlob, `${name}.pdf`)
}
const getPagesNumber = (scorePlayerData: ScorePlayerData) => {
@ -86,6 +71,17 @@ const getPagesNumber = (scorePlayerData: ScorePlayerData) => {
}
}
const getImgType = (): "svg" | "png" => {
try {
const imgE: HTMLImageElement = document.querySelector("img[id^=score_]")
const { pathname } = new URL(imgE.src)
const imgtype = pathname.match(/\.(\w+)$/)[1]
return imgtype as "svg" | "png"
} catch (_) {
return null
}
}
const getTitle = (scorePlayerData: ScorePlayerData) => {
try {
return scorePlayerData.json.metadata.title
@ -95,7 +91,7 @@ const getTitle = (scorePlayerData: ScorePlayerData) => {
}
const getScoreFileName = (scorePlayerData: ScorePlayerData) => {
return getTitle(scorePlayerData).replace(/\W+/g, "_")
return getTitle(scorePlayerData).replace(/[\s<>:"/\\|?*~\0\cA-\cZ]+/g, "_")
}
const main = () => {
@ -121,8 +117,10 @@ const main = () => {
const downloadBtn = btnsDiv.querySelector("button, .button") as HTMLElement
downloadBtn.onclick = null
const imgType = getImgType() || "svg"
const svgURLs = Array.from({ length: getPagesNumber(scorePlayer) }).fill(null).map((_, i) => {
return baseURL + `score_${i}.svg`
return baseURL + `score_${i}.${imgType}`
})
const downloadURLs = {
@ -143,8 +141,7 @@ const main = () => {
}
const textNode = [...btn.childNodes].find((x) => {
return x.nodeName.toLowerCase() == "#text"
&& x.textContent.includes("Download")
return x.textContent.includes("Download")
})
textNode.textContent = `Download ${name}`

29
src/worker-helper.ts Normal file
View file

@ -0,0 +1,29 @@
import { PDFWorkerMessage } from "./worker"
import { PDFWorker } from "../dist/cache/worker"
const scriptUrlFromFunction = (fn: Function) => {
const blob = new Blob(["(" + fn.toString() + ")()"], { type: "application/javascript" })
return URL.createObjectURL(blob)
}
export class PDFWorkerHelper extends Worker {
constructor() {
const url = scriptUrlFromFunction(PDFWorker)
super(url)
}
generatePDF(imgDataBlobList: Blob[], width: number, height: number): Promise<ArrayBuffer> {
const msg: PDFWorkerMessage = [
imgDataBlobList,
width,
height,
]
this.postMessage(msg)
return new Promise((resolve) => {
this.addEventListener("message", (e) => {
resolve(e.data)
})
})
}
}

61
src/worker.ts Normal file
View file

@ -0,0 +1,61 @@
/// <reference lib="webworker" />
import PDFDocument from "pdfkit/lib/document"
const generatePDF = async (imgDataUrlList: string[], width: number, height: number): Promise<ArrayBuffer> => {
// @ts-ignore
const pdf = new (PDFDocument as typeof import("pdfkit"))({
// compress: true,
size: [width, height],
autoFirstPage: false,
margin: 0,
layout: "portrait",
})
imgDataUrlList.forEach((data) => {
pdf.addPage()
pdf.image(data, {
width,
height,
})
})
// @ts-ignore
const buf: Uint8Array = await pdf.getBuffer()
return buf.buffer
}
const getDataURL = (blob: Blob): Promise<string> => {
return new Promise((resolve, reject) => {
const reader = new FileReader()
reader.onload = () => {
const result = reader.result
resolve(result as string)
}
reader.onerror = reject
reader.readAsDataURL(blob)
})
}
export type PDFWorkerMessage = [Blob[], number, number];
onmessage = async (e) => {
const [
imgDataBlobList,
width,
height,
] = e.data as PDFWorkerMessage
const dataURLs = await Promise.all(imgDataBlobList.map(getDataURL))
const pdfBuf = await generatePDF(
dataURLs,
width,
height,
)
postMessage(pdfBuf, [pdfBuf])
}