修复 json 解析异常未捕获的错误

This commit is contained in:
OLDREDSTONE 2026-01-14 00:55:38 +08:00
parent 006a5fe4f5
commit fb2e0e124b
3 changed files with 154 additions and 92 deletions

View File

@ -136,8 +136,8 @@
<script src="/script/switchLightDarkMode.js"></script>
<script src="/script/otto.js"></script>
<script src="/script/custommethod-search.js"></script>
<script
<!-- <script
src="https://cdn.jsdelivr.net/npm/prismjs@1/components/prism-yaml.js"
></script>
></script> -->
</body>
</html>

View File

@ -728,7 +728,6 @@ function layerHoverInit(layer) {
};
}
function createElementEvent(obj, style) {
console.log(style);
style = {
...new IconStyle(),
...style

View File

@ -23,7 +23,7 @@ let positions = {
"r5": { "y": 78, "name": "二轨时的第二轨/四轨时的第二轨" },
"r6": { "y": 57, "name": "三轨时的第一轨" },
"r7": { "y": 36, "name": "四轨时的第一轨" },
}
};
function themePosition() {
let theme_positions = document.getElementById("theme-positions");
@ -63,45 +63,74 @@ function themePosition() {
rowx = null;
columny = null;
for (let key in positions) {
if (positions[key].x !== null && Math.abs(x - positions[key].x) < 5)
if (
positions[key].x !== null && Math.abs(x - positions[key].x) < 5
) {
rowx = positions[key].x;
if (positions[key].y !== null && Math.abs(y - positions[key].y) < 5)
}
if (
positions[key].y !== null && Math.abs(y - positions[key].y) < 5
) {
columny = positions[key].y;
}
}
if (rowx) {
perx.innerText = (rowx / 3.52).toFixed(2) + "%"
perx.classList.add("c")
pxx.innerText = rowx + "px"
pxx.classList.add("c")
}
else {
perx.innerText = x_percent.toFixed(2) + "%"
perx.classList.remove("c")
pxx.innerText = x + "px"
pxx.classList.remove("c")
perx.innerText = (rowx / 3.52).toFixed(2) + "%";
perx.classList.add("c");
pxx.innerText = rowx + "px";
pxx.classList.add("c");
} else {
perx.innerText = x_percent.toFixed(2) + "%";
perx.classList.remove("c");
pxx.innerText = x + "px";
pxx.classList.remove("c");
}
if (columny) {
pery.innerText = (100 - columny / 1.98).toFixed(2) + "%"
pery.classList.add("c")
pxy.innerText = 198 - columny + "px"
pxy.classList.add("c")
}
else {
pery.innerText = (100 - y_percent).toFixed(2) + "%"
pery.classList.remove("c")
pxy.innerText = 198 - y + "px"
pxy.classList.remove("c")
pery.innerText = (100 - columny / 1.98).toFixed(2) + "%";
pery.classList.add("c");
pxy.innerText = 198 - columny + "px";
pxy.classList.add("c");
} else {
pery.innerText = (100 - y_percent).toFixed(2) + "%";
pery.classList.remove("c");
pxy.innerText = 198 - y + "px";
pxy.classList.remove("c");
}
infobox.style.right = "calc(" + (100 - x_percent) + "% + 10px)";
infobox.style.top = "calc(" + (y_percent) + "% + 10px)";
selectbox.style.left = rowx ? (rowx / 3.52 - 3.41) + "%" : columny ? "0" : "calc(" + x_percent + "% - 3px";
selectbox.style.bottom = columny ? (100 - columny / 1.98 - 5.305) + "%" : rowx ? "0" : "calc(" + (100 - y_percent) + "% - 3px)";
infobox.style.top = "calc(" + y_percent + "% + 10px)";
selectbox.style.left = rowx
? (rowx / 3.52 - 3.41) + "%"
: columny
? "0"
: "calc(" + x_percent + "% - 3px";
selectbox.style.bottom = columny
? (100 - columny / 1.98 - 5.305) + "%"
: rowx
? "0"
: "calc(" + (100 - y_percent) + "% - 3px)";
selectbox.style.width = rowx ? "6.82%" : columny ? "100%" : "6px";
selectbox.style.height = columny ? "10.61%" : rowx ? "100%" : "6px";
let rowname = rowx ? positions[Object.keys(positions).find(key => positions[key].x === rowx)].name : "";
let columnname = columny ? positions[Object.keys(positions).find(key => positions[key].y === columny)].name : "";
theme_positions.querySelector(".other").innerText = rowname && columnname ? columnname + "上的" + rowname : rowname ? rowname : columnname ? columnname : "";
let rowname = rowx
? positions[
Object.keys(positions).find((key) => positions[key].x === rowx)
].name
: "";
let columnname = columny
? positions[
Object.keys(positions).find((key) =>
positions[key].y === columny
)
].name
: "";
theme_positions.querySelector(".other").innerText =
rowname && columnname
? columnname + "上的" + rowname
: rowname
? rowname
: columnname
? columnname
: "";
});
theme_positions.addEventListener("mouseleave", function (event) {
perx.innerText = "100%";
@ -114,13 +143,12 @@ function themePosition() {
selectbox.style.bottom = "50%";
selectbox.style.width = "0";
selectbox.style.height = "0";
perx.classList.remove("c")
pery.classList.remove("c")
pxx.classList.remove("c")
pxy.classList.remove("c")
perx.classList.remove("c");
pery.classList.remove("c");
pxx.classList.remove("c");
pxy.classList.remove("c");
other.innerText = "";
});
}
function rdview() {
@ -131,21 +159,25 @@ function rdview() {
let number = rdview.querySelector(".number");
const textareaStyles = window.getComputedStyle(textarea);
[
'fontFamily', 'fontSize', 'fontWeight',
'letterSpacing', 'lineHeight', 'padding',
].forEach(property => {
"fontFamily",
"fontSize",
"fontWeight",
"letterSpacing",
"lineHeight",
"padding",
].forEach((property) => {
number.style[property] = textareaStyles[property];
});
const canvas = document.createElement('canvas');
const context = canvas.getContext('2d');
const canvas = document.createElement("canvas");
const context = canvas.getContext("2d");
const font = `${textareaStyles.fontSize} ${textareaStyles.fontFamily}`;
context.font = font;
function calcStringLines(sentence, width) {
if (!width) return 0;
const words = sentence.split('');
const words = sentence.split("");
let lineCount = 0;
let currentLine = '';
let currentLine = "";
for (let i = 0; i < words.length; i++) {
const wordWidth = context.measureText(words[i]).width;
const lineWidth = context.measureText(currentLine).width;
@ -156,18 +188,22 @@ function rdview() {
currentLine += words[i];
}
}
if (currentLine.trim() !== '') lineCount++;
if (currentLine.trim() !== "") lineCount++;
return lineCount;
}
function calcLines() {
const lines = textarea.value.split('\n');
const lines = textarea.value.split("\n");
const textareaWidth = textarea.getBoundingClientRect().width;
const textareaScrollWidth = textareaWidth - textarea.clientWidth;
const parseNumber = (v) => v.endsWith('px') ? parseInt(v.slice(0, -2), 10) : 0;
const parseNumber = (v) =>
v.endsWith("px") ? parseInt(v.slice(0, -2), 10) : 0;
const textareaPaddingLeft = parseNumber(textareaStyles.paddingLeft);
const textareaPaddingRight = parseNumber(textareaStyles.paddingRight);
const textareaContentWidth = textareaWidth - textareaPaddingLeft - textareaPaddingRight - textareaScrollWidth;
const numLines = lines.map(lineString => calcStringLines(lineString, textareaContentWidth));
const textareaContentWidth = textareaWidth - textareaPaddingLeft -
textareaPaddingRight - textareaScrollWidth;
const numLines = lines.map((lineString) =>
calcStringLines(lineString, textareaContentWidth)
);
let lineNumbers = [];
let i = 1;
while (numLines.length > 0) {
@ -175,8 +211,8 @@ function rdview() {
lineNumbers.push(i);
if (numLinesOfSentence > 1) {
Array(numLinesOfSentence - 1)
.fill('')
.forEach((_) => lineNumbers.push(''));
.fill("")
.forEach((_) => lineNumbers.push(""));
}
i++;
}
@ -186,18 +222,18 @@ function rdview() {
const lines = calcLines();
const lineDoms = Array.from({
length: lines.length,
}, (_, i) => `<div>${lines[i] || '&nbsp;'}</div>`);
number.innerHTML = lineDoms.join('');
}, (_, i) => `<div>${lines[i] || "&nbsp;"}</div>`);
number.innerHTML = lineDoms.join("");
}
function initCanvas() {
const lang = textarea.value.split('\n')[0]
const code = textarea.value.split('\n').slice(1).join('\n')
rdcanvas.innerHTML = RDViewRender(lang, code)
const lang = textarea.value.split("\n")[0];
const code = textarea.value.split("\n").slice(1).join("\n");
rdcanvas.innerHTML = RDViewRender(lang, code);
}
initCanvas()
initLineNumbers()
textarea.addEventListener('input', initLineNumbers);
textarea.addEventListener('input', initCanvas);
initCanvas();
initLineNumbers();
textarea.addEventListener("input", initLineNumbers);
textarea.addEventListener("input", initCanvas);
}
function rdview2() {
@ -208,21 +244,25 @@ function rdview2() {
let number = rdview.querySelector(".number");
const textareaStyles = window.getComputedStyle(textarea);
[
'fontFamily', 'fontSize', 'fontWeight',
'letterSpacing', 'lineHeight', 'padding',
].forEach(property => {
"fontFamily",
"fontSize",
"fontWeight",
"letterSpacing",
"lineHeight",
"padding",
].forEach((property) => {
number.style[property] = textareaStyles[property];
});
const canvas = document.createElement('canvas');
const context = canvas.getContext('2d');
const canvas = document.createElement("canvas");
const context = canvas.getContext("2d");
const font = `${textareaStyles.fontSize} ${textareaStyles.fontFamily}`;
context.font = font;
function calcStringLines(sentence, width) {
if (!width) return 0;
const words = sentence.split('');
const words = sentence.split("");
let lineCount = 0;
let currentLine = '';
let currentLine = "";
for (let i = 0; i < words.length; i++) {
const wordWidth = context.measureText(words[i]).width;
const lineWidth = context.measureText(currentLine).width;
@ -233,18 +273,22 @@ function rdview2() {
currentLine += words[i];
}
}
if (currentLine.trim() !== '') lineCount++;
if (currentLine.trim() !== "") lineCount++;
return lineCount;
}
function calcLines() {
const lines = textarea.value.split('\n');
const lines = textarea.value.split("\n");
const textareaWidth = textarea.getBoundingClientRect().width;
const textareaScrollWidth = textareaWidth - textarea.clientWidth;
const parseNumber = (v) => v.endsWith('px') ? parseInt(v.slice(0, -2), 10) : 0;
const parseNumber = (v) =>
v.endsWith("px") ? parseInt(v.slice(0, -2), 10) : 0;
const textareaPaddingLeft = parseNumber(textareaStyles.paddingLeft);
const textareaPaddingRight = parseNumber(textareaStyles.paddingRight);
const textareaContentWidth = textareaWidth - textareaPaddingLeft - textareaPaddingRight - textareaScrollWidth;
const numLines = lines.map(lineString => calcStringLines(lineString, textareaContentWidth));
const textareaContentWidth = textareaWidth - textareaPaddingLeft -
textareaPaddingRight - textareaScrollWidth;
const numLines = lines.map((lineString) =>
calcStringLines(lineString, textareaContentWidth)
);
let lineNumbers = [];
let i = 1;
while (numLines.length > 0) {
@ -252,8 +296,8 @@ function rdview2() {
lineNumbers.push(i);
if (numLinesOfSentence > 1) {
Array(numLinesOfSentence - 1)
.fill('')
.forEach((_) => lineNumbers.push(''));
.fill("")
.forEach((_) => lineNumbers.push(""));
}
i++;
}
@ -263,25 +307,46 @@ function rdview2() {
const lines = calcLines();
const lineDoms = Array.from({
length: lines.length,
}, (_, i) => `<div>${lines[i] || '&nbsp;'}</div>`);
number.innerHTML = lineDoms.join('');
}, (_, i) => `<div>${lines[i] || "&nbsp;"}</div>`);
number.innerHTML = lineDoms.join("");
}
function initCanvas() {
// const lang = textarea.value.split('\n')[0]
// const code = textarea.value.split('\n').slice(1).join('\n')
// rdcanvas.innerHTML = RDViewRender(lang, code)
const objs = JSON.parse(`[${textarea.value}]`);
const eventStyle = {"scale": 2.0, "showDuration": false };
// try {
// JSON.parse(`[${textarea.value}]`);
// } catch (e) {
// rdcanvas.innerHTML = `<div style="color: red; font-weight: bold;">JSON解析错误${e.message}</div>`;
// }
let objs = [];
try {
objs = JSON.parse(`[${textarea.value}]`);
} catch (e) {
rdcanvas.innerHTML =
`<div style="color: red; font-weight: bold;">JSON解析错误${e.message}</div>`;
return;
}
const eventStyle = { "scale": 2.0, "showDuration": false };
let maxy = 0;
for (let obj of objs) {
const style = {... eventStyle, enabled: obj.active ?? true };
const style = { ...eventStyle, enabled: obj.active ?? true };
const elem = createElementEvent(obj, style);
elem.eventStyle = style;
elem.style.position = "absolute";
elem.style.left = `${((((obj.bar ?? 1) - 1) * 8) + (obj.beat ?? 1) - 1) * 14 * eventStyle.scale}px`;
elem.style.top = `${(obj.y ?? obj.row ?? 0) * 14 * eventStyle.scale}px`;
if (((obj.y ?? obj.row ?? 0) * 14 * eventStyle.scale) + elem.offsetHeight > maxy) {
maxy = ((obj.y ?? obj.row ?? 0) * 14 * eventStyle.scale) + elem.offsetHeight;
elem.style.left = `${
((((obj.bar ?? 1) - 1) * 8) + (obj.beat ?? 1) - 1) * 14 *
eventStyle.scale
}px`;
elem.style.top = `${
(obj.y ?? obj.row ?? 0) * 14 * eventStyle.scale
}px`;
if (
((obj.y ?? obj.row ?? 0) * 14 * eventStyle.scale) +
elem.offsetHeight > maxy
) {
maxy = ((obj.y ?? obj.row ?? 0) * 14 * eventStyle.scale) +
elem.offsetHeight;
}
elem.addEventListener("mousedown", (event) => {
const eStyle = elem.eventStyle;
@ -308,16 +373,15 @@ function rdview2() {
rdcanvas.style.height = `${maxy + 4 * 14 * eventStyle.scale}px`;
if (elem) {
rdcanvas.appendChild(elem);
}
}
}
//rdcanvas.innerHTML = RDView2Render(json);
}
initCanvas()
initLineNumbers()
textarea.addEventListener('input', initLineNumbers);
textarea.addEventListener('input', initCanvas);
//rdcanvas.innerHTML = RDView2Render(json);
initCanvas();
initLineNumbers();
textarea.addEventListener("input", initLineNumbers);
textarea.addEventListener("input", initCanvas);
}
window.$docsify.plugins = [].concat(window.$docsify.plugins, function (hook) {
hook.doneEach(function () {
themePosition();
@ -328,5 +392,4 @@ window.$docsify.plugins = [].concat(window.$docsify.plugins, function (hook) {
});
import("./docsify.min.js").then(() => {
});
});