81 lines
2.6 KiB
JavaScript
81 lines
2.6 KiB
JavaScript
// ==UserScript==
|
|
// @name Armyfroge Cards
|
|
// @namespace https://git.euph.dev/Snoweuph
|
|
// @match https://army-forge.onepagerules.com/view*
|
|
// @grant none
|
|
// @version 1.0.2
|
|
// @author Snoweuph
|
|
// @require https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js
|
|
// @require https://html2canvas.hertzen.com/dist/html2canvas.min.js
|
|
// ==/UserScript==
|
|
|
|
// Bind to Ctrl + S
|
|
document.addEventListener("keydown", (event) => {
|
|
if (event.ctrlKey && event.key === "s") {
|
|
event.preventDefault();
|
|
generateCards();
|
|
generateRules();
|
|
}
|
|
});
|
|
|
|
function generateCards() {
|
|
const cards_root =
|
|
document.getElementsByClassName("MuiContainer-root")[0].firstElementChild;
|
|
|
|
Array.from(cards_root.children).forEach((child) => {
|
|
const card = child.firstElementChild;
|
|
const header = card.firstElementChild;
|
|
|
|
const marker_section = document.createElement("div");
|
|
marker_section.style.display = "flex";
|
|
marker_section.style.gap = "0.5rem";
|
|
marker_section.style.padding = "0.5rem";
|
|
marker_section.style.marginBottom = "0.5rem";
|
|
for (let i = 0; i < 10; i++) {
|
|
const maker_space = document.createElement("div");
|
|
maker_space.style.width = "3rem";
|
|
maker_space.style.aspectRatio = "1";
|
|
maker_space.style.borderRadius = "100%";
|
|
maker_space.style.border = "dashed 1px lightgray";
|
|
marker_section.appendChild(maker_space);
|
|
}
|
|
card.insertBefore(marker_section, header.nextSibling);
|
|
|
|
html2canvas(card, { scale: 15, backgroundColor: null }).then((canvas) => {
|
|
const link = document.createElement("a");
|
|
link.download = getHeaderTitle(header) + ".png";
|
|
link.href = canvas.toDataURL();
|
|
document.body.appendChild(link);
|
|
link.click();
|
|
});
|
|
});
|
|
}
|
|
|
|
function generateRules() {
|
|
const rules_root = document.getElementsByClassName("MuiContainer-root")[0].lastElementChild.firstElementChild.firstElementChild.firstElementChild.firstElementChild.lastElementChild
|
|
rules_root.style.display = "flex"
|
|
rules_root.style.flexDirection = "column"
|
|
rules_root.style.gap = "1rem"
|
|
|
|
html2canvas(rules_root, { scale: 15, backgroundColor: null }).then((canvas) => {
|
|
const link = document.createElement("a");
|
|
link.download = "Rules.png";
|
|
link.href = canvas.toDataURL();
|
|
document.body.appendChild(link);
|
|
link.click();
|
|
});
|
|
}
|
|
|
|
|
|
// Extract Title of Card
|
|
function getHeaderTitle(pElement) {
|
|
let textContent = "";
|
|
pElement.firstElementChild.firstElementChild.firstElementChild.childNodes.forEach(
|
|
(node) => {
|
|
if (node.nodeType === Node.TEXT_NODE) {
|
|
textContent += node.textContent;
|
|
}
|
|
},
|
|
);
|
|
return textContent;
|
|
}
|