v0.3.3 - debug generate PDF when page > 2
This commit is contained in:
parent
f8060aaf07
commit
0c3dccb1f3
|
@ -3,7 +3,7 @@
|
||||||
// @namespace https://www.xmader.com/
|
// @namespace https://www.xmader.com/
|
||||||
// @homepageURL https://github.com/Xmader/musescore-downloader/
|
// @homepageURL https://github.com/Xmader/musescore-downloader/
|
||||||
// @supportURL https://github.com/Xmader/musescore-downloader/issues
|
// @supportURL https://github.com/Xmader/musescore-downloader/issues
|
||||||
// @version 0.3.2
|
// @version 0.3.3
|
||||||
// @description 免登录、免 Musescore Pro,下载 musescore.com 上的曲谱
|
// @description 免登录、免 Musescore Pro,下载 musescore.com 上的曲谱
|
||||||
// @author Xmader
|
// @author Xmader
|
||||||
// @match https://musescore.com/*/*
|
// @match https://musescore.com/*/*
|
||||||
|
@ -15,6 +15,30 @@
|
||||||
(function () {
|
(function () {
|
||||||
'use strict';
|
'use strict';
|
||||||
|
|
||||||
|
/*! *****************************************************************************
|
||||||
|
Copyright (c) Microsoft Corporation. All rights reserved.
|
||||||
|
Licensed under the Apache License, Version 2.0 (the "License"); you may not use
|
||||||
|
this file except in compliance with the License. You may obtain a copy of the
|
||||||
|
License at http://www.apache.org/licenses/LICENSE-2.0
|
||||||
|
|
||||||
|
THIS CODE IS PROVIDED ON AN *AS IS* BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
|
||||||
|
KIND, EITHER EXPRESS OR IMPLIED, INCLUDING WITHOUT LIMITATION ANY IMPLIED
|
||||||
|
WARRANTIES OR CONDITIONS OF TITLE, FITNESS FOR A PARTICULAR PURPOSE,
|
||||||
|
MERCHANTABLITY OR NON-INFRINGEMENT.
|
||||||
|
|
||||||
|
See the Apache Version 2.0 License for specific language governing permissions
|
||||||
|
and limitations under the License.
|
||||||
|
***************************************************************************** */
|
||||||
|
|
||||||
|
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());
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
const waitForDocumentLoaded = () => {
|
const waitForDocumentLoaded = () => {
|
||||||
if (document.readyState !== "complete") {
|
if (document.readyState !== "complete") {
|
||||||
return new Promise(resolve => {
|
return new Promise(resolve => {
|
||||||
|
@ -25974,23 +25998,33 @@ Please pipe the document into a Node stream.\
|
||||||
mixin(OutputDocumentBrowser);
|
mixin(OutputDocumentBrowser);
|
||||||
|
|
||||||
let pdfBlob;
|
let pdfBlob;
|
||||||
const generatePDF = (name) => {
|
const svgToPng = (svgURL) => __awaiter(void 0, void 0, void 0, function* () {
|
||||||
if (pdfBlob) {
|
const imageElement = document.createElement("img");
|
||||||
return FileSaver(pdfBlob, `${name}.pdf`);
|
imageElement.style.display = "none";
|
||||||
}
|
document.body.appendChild(imageElement);
|
||||||
const scoreImgs = document.querySelectorAll("img[id^=score_]");
|
imageElement.src = svgURL;
|
||||||
const { naturalWidth: width, naturalHeight: height } = scoreImgs[0];
|
// wait until image loaded
|
||||||
|
yield new Promise((resolve) => {
|
||||||
|
imageElement.onload = () => resolve();
|
||||||
|
});
|
||||||
|
const { naturalWidth: width, naturalHeight: height } = imageElement;
|
||||||
const canvas = document.createElement("canvas");
|
const canvas = document.createElement("canvas");
|
||||||
const canvasContext = canvas.getContext("2d");
|
const canvasContext = canvas.getContext("2d");
|
||||||
canvas.width = width;
|
canvas.width = width;
|
||||||
canvas.height = height;
|
canvas.height = height;
|
||||||
canvas.style.display = "none";
|
canvas.style.display = "none";
|
||||||
document.body.appendChild(canvas);
|
document.body.appendChild(canvas);
|
||||||
const imgDataList = [...scoreImgs].map((i) => {
|
|
||||||
canvasContext.clearRect(0, 0, width, height);
|
canvasContext.clearRect(0, 0, width, height);
|
||||||
canvasContext.drawImage(i, 0, 0);
|
canvasContext.drawImage(imageElement, 0, 0);
|
||||||
return canvas.toDataURL("image/png");
|
return canvas.toDataURL("image/png");
|
||||||
});
|
});
|
||||||
|
const generatePDF = (svgURLs, name) => __awaiter(void 0, void 0, void 0, function* () {
|
||||||
|
if (pdfBlob) {
|
||||||
|
return FileSaver(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
|
// @ts-ignore
|
||||||
const pdf = new PDFDocument({
|
const pdf = new PDFDocument({
|
||||||
// compress: true,
|
// compress: true,
|
||||||
|
@ -26012,6 +26046,14 @@ Please pipe the document into a Node stream.\
|
||||||
pdfBlob = blob;
|
pdfBlob = blob;
|
||||||
FileSaver(blob, `${name}.pdf`);
|
FileSaver(blob, `${name}.pdf`);
|
||||||
});
|
});
|
||||||
|
});
|
||||||
|
const getPagesNumber = (scorePlayerData) => {
|
||||||
|
try {
|
||||||
|
return scorePlayerData.json.metadata.pages;
|
||||||
|
}
|
||||||
|
catch (_) {
|
||||||
|
return document.querySelectorAll("img[id^=score_]").length;
|
||||||
|
}
|
||||||
};
|
};
|
||||||
const getTitle = (scorePlayerData) => {
|
const getTitle = (scorePlayerData) => {
|
||||||
try {
|
try {
|
||||||
|
@ -26041,6 +26083,9 @@ Please pipe the document into a Node stream.\
|
||||||
const btnsDiv = document.querySelector(".score-right .buttons-wrapper") || document.querySelectorAll("aside section > div")[3];
|
const btnsDiv = document.querySelector(".score-right .buttons-wrapper") || document.querySelectorAll("aside section > div")[3];
|
||||||
const downloadBtn = btnsDiv.querySelector("button, .button");
|
const downloadBtn = btnsDiv.querySelector("button, .button");
|
||||||
downloadBtn.onclick = null;
|
downloadBtn.onclick = null;
|
||||||
|
const svgURLs = Array.from({ length: getPagesNumber(scorePlayer) }).fill(null).map((_, i) => {
|
||||||
|
return baseURL + `score_${i}.svg`;
|
||||||
|
});
|
||||||
const downloadURLs = {
|
const downloadURLs = {
|
||||||
"Musescore": msczURL,
|
"Musescore": msczURL,
|
||||||
"PDF": null,
|
"PDF": null,
|
||||||
|
@ -26077,8 +26122,9 @@ Please pipe the document into a Node stream.\
|
||||||
else {
|
else {
|
||||||
btn.onclick = () => {
|
btn.onclick = () => {
|
||||||
const text = textNode.textContent;
|
const text = textNode.textContent;
|
||||||
|
const filename = getScoreFileName(scorePlayer);
|
||||||
textNode.textContent = "Processing…";
|
textNode.textContent = "Processing…";
|
||||||
generatePDF(getScoreFileName(scorePlayer)).then(() => {
|
generatePDF(svgURLs, filename).then(() => {
|
||||||
textNode.textContent = text;
|
textNode.textContent = text;
|
||||||
});
|
});
|
||||||
};
|
};
|
||||||
|
|
|
@ -1,6 +1,6 @@
|
||||||
{
|
{
|
||||||
"name": "musescore-downloader",
|
"name": "musescore-downloader",
|
||||||
"version": "0.3.2",
|
"version": "0.3.3",
|
||||||
"description": "download sheet music from musescore.com for free, no login or Musescore Pro required | 免登录、免 Musescore Pro,免费下载 musescore.com 上的曲谱",
|
"description": "download sheet music from musescore.com for free, no login or Musescore Pro required | 免登录、免 Musescore Pro,免费下载 musescore.com 上的曲谱",
|
||||||
"main": "dist/main.js",
|
"main": "dist/main.js",
|
||||||
"repository": {
|
"repository": {
|
||||||
|
|
|
@ -47,6 +47,21 @@ export default {
|
||||||
dirname: false,
|
dirname: false,
|
||||||
filename: false,
|
filename: false,
|
||||||
baseDir: false,
|
baseDir: false,
|
||||||
})
|
}),
|
||||||
|
{
|
||||||
|
/**
|
||||||
|
* remove tslib license comments
|
||||||
|
* @param {string} code
|
||||||
|
* @param {string} id
|
||||||
|
*/
|
||||||
|
transform(code, id) {
|
||||||
|
if (id.includes("tslib")) {
|
||||||
|
code = code.split(/\r?\n/g).slice(15).join("\n")
|
||||||
|
}
|
||||||
|
return {
|
||||||
|
code
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
]
|
]
|
||||||
}
|
}
|
||||||
|
|
50
src/main.ts
50
src/main.ts
|
@ -8,14 +8,19 @@ import saveAs from "file-saver/dist/FileSaver.js"
|
||||||
|
|
||||||
let pdfBlob: Blob
|
let pdfBlob: Blob
|
||||||
|
|
||||||
const generatePDF = (name?: string) => {
|
const svgToPng = async (svgURL: string) => {
|
||||||
if (pdfBlob) {
|
const imageElement = document.createElement("img")
|
||||||
return saveAs(pdfBlob, `${name}.pdf`)
|
imageElement.style.display = "none"
|
||||||
}
|
document.body.appendChild(imageElement)
|
||||||
|
|
||||||
const scoreImgs: NodeListOf<HTMLImageElement> = document.querySelectorAll("img[id^=score_]")
|
imageElement.src = svgURL
|
||||||
|
|
||||||
const { naturalWidth: width, naturalHeight: height } = scoreImgs[0]
|
// wait until image loaded
|
||||||
|
await new Promise((resolve) => {
|
||||||
|
imageElement.onload = () => resolve()
|
||||||
|
})
|
||||||
|
|
||||||
|
const { naturalWidth: width, naturalHeight: height } = imageElement
|
||||||
|
|
||||||
const canvas = document.createElement("canvas")
|
const canvas = document.createElement("canvas")
|
||||||
const canvasContext = canvas.getContext("2d")
|
const canvasContext = canvas.getContext("2d")
|
||||||
|
@ -26,11 +31,21 @@ const generatePDF = (name?: string) => {
|
||||||
|
|
||||||
document.body.appendChild(canvas)
|
document.body.appendChild(canvas)
|
||||||
|
|
||||||
const imgDataList = [...scoreImgs].map((i) => {
|
|
||||||
canvasContext.clearRect(0, 0, width, height)
|
canvasContext.clearRect(0, 0, width, height)
|
||||||
canvasContext.drawImage(i, 0, 0)
|
canvasContext.drawImage(imageElement, 0, 0)
|
||||||
|
|
||||||
return canvas.toDataURL("image/png")
|
return canvas.toDataURL("image/png")
|
||||||
})
|
}
|
||||||
|
|
||||||
|
const generatePDF = async (svgURLs: string[], name?: string) => {
|
||||||
|
if (pdfBlob) {
|
||||||
|
return saveAs(pdfBlob, `${name}.pdf`)
|
||||||
|
}
|
||||||
|
|
||||||
|
const cachedImg = document.querySelector("img[id^=score_]") as HTMLImageElement
|
||||||
|
const { naturalWidth: width, naturalHeight: height } = cachedImg
|
||||||
|
|
||||||
|
const imgDataList = await Promise.all(svgURLs.map(svgToPng))
|
||||||
|
|
||||||
// @ts-ignore
|
// @ts-ignore
|
||||||
const pdf = new (PDFDocument as typeof import("pdfkit"))({
|
const pdf = new (PDFDocument as typeof import("pdfkit"))({
|
||||||
|
@ -58,6 +73,14 @@ const generatePDF = (name?: string) => {
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
|
||||||
|
const getPagesNumber = (scorePlayerData: ScorePlayerData) => {
|
||||||
|
try {
|
||||||
|
return scorePlayerData.json.metadata.pages
|
||||||
|
} catch (_) {
|
||||||
|
return document.querySelectorAll("img[id^=score_]").length
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
const getTitle = (scorePlayerData: ScorePlayerData) => {
|
const getTitle = (scorePlayerData: ScorePlayerData) => {
|
||||||
try {
|
try {
|
||||||
return scorePlayerData.json.metadata.title
|
return scorePlayerData.json.metadata.title
|
||||||
|
@ -93,6 +116,10 @@ const main = () => {
|
||||||
const downloadBtn = btnsDiv.querySelector("button, .button") as HTMLElement
|
const downloadBtn = btnsDiv.querySelector("button, .button") as HTMLElement
|
||||||
downloadBtn.onclick = null
|
downloadBtn.onclick = null
|
||||||
|
|
||||||
|
const svgURLs = Array.from({ length: getPagesNumber(scorePlayer) }).fill(null).map((_, i) => {
|
||||||
|
return baseURL + `score_${i}.svg`
|
||||||
|
})
|
||||||
|
|
||||||
const downloadURLs = {
|
const downloadURLs = {
|
||||||
"Musescore": msczURL,
|
"Musescore": msczURL,
|
||||||
"PDF": null,
|
"PDF": null,
|
||||||
|
@ -133,8 +160,11 @@ const main = () => {
|
||||||
} else {
|
} else {
|
||||||
btn.onclick = () => {
|
btn.onclick = () => {
|
||||||
const text = textNode.textContent
|
const text = textNode.textContent
|
||||||
|
const filename = getScoreFileName(scorePlayer)
|
||||||
|
|
||||||
textNode.textContent = "Processing…"
|
textNode.textContent = "Processing…"
|
||||||
generatePDF(getScoreFileName(scorePlayer)).then(() => {
|
|
||||||
|
generatePDF(svgURLs, filename).then(() => {
|
||||||
textNode.textContent = text
|
textNode.textContent = text
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
|
Loading…
Reference in New Issue