140 lines
3.9 KiB
TypeScript
140 lines
3.9 KiB
TypeScript
import "./meta"
|
|
|
|
import { ScorePlayerData } from "./types"
|
|
import { waitForDocumentLoaded } from "./utils"
|
|
|
|
import pdfmake from "pdfmake/build/pdfmake"
|
|
|
|
const generatePDF = (name?: string) => {
|
|
const scoreImgs: NodeListOf<HTMLImageElement> = document.querySelectorAll("img[id^=score_]")
|
|
|
|
const { naturalWidth: width, naturalHeight: height } = scoreImgs[0]
|
|
|
|
const canvas = document.createElement("canvas")
|
|
const canvasContext = canvas.getContext("2d")
|
|
|
|
canvas.width = width
|
|
canvas.height = height
|
|
canvas.style.display = "none"
|
|
|
|
document.body.appendChild(canvas)
|
|
|
|
const imgDataList = [...scoreImgs].map((i) => {
|
|
canvasContext.clearRect(0, 0, width, height)
|
|
canvasContext.drawImage(i, 0, 0)
|
|
return canvas.toDataURL("image/png")
|
|
})
|
|
|
|
const pdf = pdfmake.createPdf({
|
|
pageMargins: 0,
|
|
// @ts-ignore
|
|
pageOrientation: "PORTRAIT",
|
|
pageSize: { width, height },
|
|
// compress: true,
|
|
content: [
|
|
...imgDataList.map((data) => {
|
|
return {
|
|
image: data,
|
|
width,
|
|
height,
|
|
}
|
|
})
|
|
]
|
|
})
|
|
|
|
return new Promise((resolve) => {
|
|
pdf.download(`${name}.pdf`, resolve)
|
|
})
|
|
}
|
|
|
|
const getTitle = (scorePlayerData: ScorePlayerData) => {
|
|
try {
|
|
return scorePlayerData.json.metadata.title
|
|
} catch (_) {
|
|
return ""
|
|
}
|
|
}
|
|
|
|
const getScoreFileName = (scorePlayerData: ScorePlayerData) => {
|
|
return getTitle(scorePlayerData).replace(/\W+/g, "_")
|
|
}
|
|
|
|
const main = () => {
|
|
|
|
// @ts-ignore
|
|
if (!window.UGAPP || !window.UGAPP.store || !window.UGAPP.store.jmuse_settings) { return }
|
|
|
|
// @ts-ignore
|
|
const scorePlayer: ScorePlayerData = window.UGAPP.store.jmuse_settings.score_player
|
|
|
|
const { id } = scorePlayer.json
|
|
const baseURL = scorePlayer.urls.image_path
|
|
|
|
// const msczURL = `https://musescore.com/static/musescore/scoredata/score/${getIndexPath(id)}/${id}/score_${vid}_${scoreHexId}.mscz`
|
|
|
|
// https://github.com/Xmader/cloudflare-worker-musescore-mscz
|
|
const msczURL = `https://musescore-mscz.99.workers.dev/${id}`
|
|
|
|
const mxlURL = baseURL + "score.mxl"
|
|
const { midi: midiURL, mp3: mp3URL } = scorePlayer.urls
|
|
|
|
const btnsDiv = document.querySelector(".score-right .buttons-wrapper") || document.querySelectorAll("aside section > div")[3]
|
|
const downloadBtn = btnsDiv.querySelector("button, .button") as HTMLElement
|
|
downloadBtn.onclick = null
|
|
|
|
const downloadURLs = {
|
|
"Musescore": msczURL,
|
|
"PDF": null,
|
|
"MusicXML": mxlURL,
|
|
"MIDI": midiURL,
|
|
"MP3": mp3URL,
|
|
}
|
|
|
|
const createBtn = (name: string) => {
|
|
const btn = downloadBtn.cloneNode(true) as HTMLElement
|
|
|
|
if (btn.nodeName.toLowerCase() == "button") {
|
|
btn.setAttribute("style", "width: 205px !important")
|
|
} else {
|
|
btn.dataset.target = ""
|
|
}
|
|
|
|
const textNode = [...btn.childNodes].find((x) => {
|
|
return x.nodeName.toLowerCase() == "#text"
|
|
&& x.textContent.includes("Download")
|
|
})
|
|
textNode.textContent = `Download ${name}`
|
|
|
|
return {
|
|
btn,
|
|
textNode,
|
|
}
|
|
}
|
|
|
|
const newDownloadBtns = Object.keys(downloadURLs).map((name) => {
|
|
const url = downloadURLs[name]
|
|
const { btn, textNode } = createBtn(name)
|
|
|
|
if (name !== "PDF") {
|
|
btn.onclick = () => {
|
|
window.open(url)
|
|
}
|
|
} else {
|
|
btn.onclick = () => {
|
|
const text = textNode.textContent
|
|
textNode.textContent = "Processing…"
|
|
generatePDF(getScoreFileName(scorePlayer)).then(() => {
|
|
textNode.textContent = text
|
|
})
|
|
}
|
|
}
|
|
|
|
return btn
|
|
})
|
|
|
|
downloadBtn.replaceWith(...newDownloadBtns)
|
|
|
|
}
|
|
|
|
waitForDocumentLoaded().then(main)
|