added but havent tested backwards compatibility

This commit is contained in:
2025-07-29 21:27:27 -04:00
parent 52f5f4b51b
commit 52f566012d
+93 -64
View File
@@ -11,6 +11,13 @@
display: none; display: none;
} }
.invertedX {
transform: scaleX(-1);
}
.invertedY {
transform: scaleY(-1);
}
/* /*
* CURSOR STUFF * CURSOR STUFF
body { body {
@@ -527,6 +534,8 @@
</div> </div>
</div> </div>
todo: recoloring links and then adding a new one resets the color, and something else. check the refreshing of containers, yo! todo: recoloring links and then adding a new one resets the color, and something else. check the refreshing of containers, yo!
<br />also change add image to "add media" and add youtube iframe support
<br />also mirror images x/y?
</body> </body>
<script> <script>
@@ -1200,73 +1209,73 @@
.replace("rgba(", "") .replace("rgba(", "")
.slice(0, -1) .slice(0, -1)
.split(",")[3] * 100; .split(",")[3] * 100;
// BORDER // BORDER
document.getElementById(this.id + "-settings-border-color").value = document.getElementById(this.id + "-settings-border-color").value =
containerSettings.borderColor; containerSettings.borderColor;
document.getElementById(this.id + "-settings-border-width").value = document.getElementById(this.id + "-settings-border-width").value =
containerSettings.borderWidth; containerSettings.borderWidth;
document.getElementById(this.id + "-settings-border-radius").value = document.getElementById(this.id + "-settings-border-radius").value =
containerSettings.borderRadius; containerSettings.borderRadius;
// FONT // FONT
if (containerSettings.fontName == "") { if (containerSettings.fontName == "") {
document.getElementById(this.id + "-settings-font-name").innerHTML = document.getElementById(this.id + "-settings-font-name").innerHTML =
"system default"; "system default";
} else { } else {
document.getElementById(this.id + "-settings-font-name").innerHTML = document.getElementById(this.id + "-settings-font-name").innerHTML =
containerSettings.fontName; containerSettings.fontName;
} }
// TEXT ALIGNMENT // TEXT ALIGNMENT
document.getElementById(this.id + "-settings-left-align").checked = document.getElementById(this.id + "-settings-left-align").checked =
!containerSettings.textAlign == "left"; !containerSettings.textAlign == "left";
document.getElementById(this.id + "-settings-center-align").checked = document.getElementById(this.id + "-settings-center-align").checked =
containerSettings.textAlign == "center"; containerSettings.textAlign == "center";
document.getElementById(this.id + "-settings-right-align").checked = document.getElementById(this.id + "-settings-right-align").checked =
containerSettings.textAlign == "right"; containerSettings.textAlign == "right";
// BOOKMARK OPTIONS // BOOKMARK OPTIONS
document.getElementById(this.id + "-settings-section-color").value = document.getElementById(this.id + "-settings-section-color").value =
containerSettings.sectionColor; containerSettings.sectionColor;
document.getElementById(this.id + "-settings-section-size").value = document.getElementById(this.id + "-settings-section-size").value =
containerSettings.sectionSize; containerSettings.sectionSize;
document.getElementById(this.id + "-settings-section-bold").checked = document.getElementById(this.id + "-settings-section-bold").checked =
containerSettings.sectionBold; containerSettings.sectionBold;
document.getElementById(this.id + "-settings-section-italic").checked = document.getElementById(this.id + "-settings-section-italic").checked =
containerSettings.sectionItalic; containerSettings.sectionItalic;
document.getElementById(this.id + "-settings-link-color").value = document.getElementById(this.id + "-settings-link-color").value =
containerSettings.linkColor; containerSettings.linkColor;
document.getElementById(this.id + "-settings-link-size").value = document.getElementById(this.id + "-settings-link-size").value =
containerSettings.linkSize; containerSettings.linkSize;
// BACKGROUND COLOR // BACKGROUND COLOR
document.getElementById(this.id + "-settings-bg-color").value = document.getElementById(this.id + "-settings-bg-color").value =
rgbToHex( rgbToHex(
containerSettings.backgroundRgba
.replace("rgba(", "")
.slice(0, -1)
.split(",")
.splice(0, 3)
);
document.getElementById(this.id + "-settings-bg-alpha").value =
containerSettings.backgroundRgba containerSettings.backgroundRgba
.replace("rgba(", "") .replace("rgba(", "")
.slice(0, -1) .slice(0, -1)
.split(",") .split(",")[3] * 100;
.splice(0, 3) // HEADER OPTIONS
); document.getElementById(this.id + "-settings-date-toggle").checked =
document.getElementById(this.id + "-settings-bg-alpha").value = containerSettings.enableDate;
containerSettings.backgroundRgba document.getElementById(this.id + "-settings-clock-toggle").checked =
.replace("rgba(", "") containerSettings.enableClock;
.slice(0, -1) document.getElementById(this.id + "-settings-clock-color").value =
.split(",")[3] * 100; containerSettings.headerColor;
// HEADER OPTIONS document.getElementById(this.id + "-settings-clock-size").value =
document.getElementById(this.id + "-settings-date-toggle").checked = containerSettings.headerSize;
containerSettings.enableDate; document.getElementById(this.id + "-settings-clock-bold").checked =
document.getElementById(this.id + "-settings-clock-toggle").checked = containerSettings.headerBold;
containerSettings.enableClock; document.getElementById(this.id + "-settings-clock-italic").checked =
document.getElementById(this.id + "-settings-clock-color").value = containerSettings.headerItalic;
containerSettings.headerColor; // DIVIDER
document.getElementById(this.id + "-settings-clock-size").value = document.getElementById(this.id + "-settings-divider-toggle").checked =
containerSettings.headerSize; containerSettings.enableDivider;
document.getElementById(this.id + "-settings-clock-bold").checked = document.getElementById(this.id + "-settings-divider-color").value =
containerSettings.headerBold; containerSettings.dividerColor;
document.getElementById(this.id + "-settings-clock-italic").checked =
containerSettings.headerItalic;
// DIVIDER
document.getElementById(this.id + "-settings-divider-toggle").checked =
containerSettings.enableDivider;
document.getElementById(this.id + "-settings-divider-color").value =
containerSettings.dividerColor;
} }
createImageContainerMenuListing() { createImageContainerMenuListing() {
@@ -1405,6 +1414,9 @@
* applies saved cosmetic customizations to container * applies saved cosmetic customizations to container
*/ */
applySettings() { applySettings() {
// makes sure that any old themes will still load
this.ensureBackwardsCompatibility();
/** set options relevant to both image and text containers */ /** set options relevant to both image and text containers */
/** POSITION */ /** POSITION */
document.getElementById(this.id).style.top = this.y; document.getElementById(this.id).style.top = this.y;
@@ -1711,6 +1723,23 @@
} }
} }
ensureBackwardsCompatibility() {
let currentSettings;
if (this.imageUrl == undefined) {
currentSettings = Object.keys(defaultTextContainerSettings);
}
else {
currentSettings = Object.keys(defaultImageContainerSettings);
}
for (let i = 0; i < currentSettings.length; i++) {
if (this.containerSettings[currentSettings[i]] == undefined) {
console.log("found missing option: ");
console.log(currentSettings[i]);
this.containerSettings[currentSettings[i]] = defaultTextContainerSettings[currentSettings[i]];
}
}
}
} }