mirror of
https://github.com/BetterSEQTA/BetterSEQTA-Plus.git
synced 2026-06-06 03:34:40 +00:00
added support for multiple image and video backgrounds to be uploaded at once
This commit is contained in:
@@ -8,6 +8,27 @@
|
||||
body {
|
||||
margin: 0 !important;
|
||||
}
|
||||
|
||||
video, img {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
|
||||
object-fit: cover;
|
||||
|
||||
animation: fade 0.2s ease-in-out;
|
||||
}
|
||||
|
||||
@keyframes fade {
|
||||
0% {
|
||||
opacity: 0;
|
||||
}
|
||||
100% {
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
@@ -13,12 +13,18 @@ const openDB = () => {
|
||||
});
|
||||
};
|
||||
|
||||
// Read data from IndexedDB
|
||||
// Modified Read Data from IndexedDB
|
||||
const readData = async () => {
|
||||
const selectedBackground = localStorage.getItem("selectedBackground");
|
||||
if (!selectedBackground) {
|
||||
console.log("No selected background in local storage.");
|
||||
return null;
|
||||
}
|
||||
|
||||
const db = await openDB();
|
||||
const tx = db.transaction("backgrounds", "readonly");
|
||||
const store = tx.objectStore("backgrounds");
|
||||
const request = store.get("customBackground");
|
||||
const request = store.get(selectedBackground);
|
||||
|
||||
return await new Promise((resolve, reject) => {
|
||||
request.onsuccess = () => resolve(request.result);
|
||||
@@ -26,8 +32,8 @@ const readData = async () => {
|
||||
});
|
||||
};
|
||||
|
||||
// Main function to run on page load
|
||||
const main = async () => {
|
||||
// Function to update the background
|
||||
const updateBackground = async () => {
|
||||
try {
|
||||
const data = await readData();
|
||||
if (!data) {
|
||||
@@ -37,6 +43,7 @@ const main = async () => {
|
||||
|
||||
const url = URL.createObjectURL(data.blob);
|
||||
const container = document.getElementById("media-container");
|
||||
container.innerHTML = ""; // Clear previous background
|
||||
|
||||
if (data.type === "image") {
|
||||
const imgElement = document.createElement("img");
|
||||
@@ -56,5 +63,17 @@ const main = async () => {
|
||||
}
|
||||
};
|
||||
|
||||
// Main function to run on page load
|
||||
const main = async () => {
|
||||
await updateBackground(); // Initial background update
|
||||
|
||||
// Listen for changes to local storage
|
||||
window.addEventListener("storage", async (event) => {
|
||||
if (event.key === "selectedBackground") {
|
||||
await updateBackground(); // Update background if 'selectedBackground' changes
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
// Run the main function when the document is ready
|
||||
document.addEventListener("DOMContentLoaded", main);
|
||||
|
||||
Reference in New Issue
Block a user