fixes and optimizations
This commit is contained in:
parent
350e88221f
commit
b79a921932
1 changed files with 186 additions and 191 deletions
377
rot.js
377
rot.js
|
@ -2,220 +2,194 @@
|
|||
// one rotten apple spoils the bunch
|
||||
|
||||
(() => {
|
||||
let oldPushState = history.pushState;
|
||||
history.pushState = function pushState() {
|
||||
let ret = oldPushState.apply(this, arguments);
|
||||
window.dispatchEvent(new Event('pushstate'));
|
||||
window.dispatchEvent(new Event('locationchange'));
|
||||
return ret;
|
||||
};
|
||||
|
||||
let oldReplaceState = history.replaceState;
|
||||
history.replaceState = function replaceState() {
|
||||
let ret = oldReplaceState.apply(this, arguments);
|
||||
window.dispatchEvent(new Event('replacestate'));
|
||||
window.dispatchEvent(new Event('locationchange'));
|
||||
return ret;
|
||||
};
|
||||
|
||||
window.addEventListener('popstate', () => {
|
||||
window.dispatchEvent(new Event('locationchange'));
|
||||
});
|
||||
})();
|
||||
|
||||
function getPromiseFromEvent(item, event) {
|
||||
return new Promise((resolve) => {
|
||||
const listener = () => {
|
||||
item.removeEventListener(event, listener);
|
||||
resolve();
|
||||
}
|
||||
item.addEventListener(event, listener);
|
||||
});
|
||||
}
|
||||
|
||||
// MIT Licensed
|
||||
// Author: jwilson8767
|
||||
function waitUntil(selector) {
|
||||
return new Promise((resolve, reject) => {
|
||||
const el = document.querySelector(selector);
|
||||
if (el) resolve(el);
|
||||
new MutationObserver((mutationRecords, observer) => {
|
||||
// Query for elements matching the specified selector
|
||||
Array.from(document.querySelectorAll(selector)).forEach((element) => {
|
||||
resolve(element);
|
||||
//Once we have resolved we don't need the observer anymore.
|
||||
observer.disconnect();
|
||||
});
|
||||
}).observe(document.documentElement, {
|
||||
childList: true,
|
||||
subtree: true
|
||||
function getPromiseFromEvent(item, event) {
|
||||
return new Promise((resolve) => {
|
||||
const listener = () => {
|
||||
item.removeEventListener(event, listener);
|
||||
resolve();
|
||||
}
|
||||
item.addEventListener(event, listener);
|
||||
});
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
// MIT Licensed
|
||||
// Author: jwilson8767
|
||||
function waitUntil(selector) {
|
||||
return new Promise((resolve, reject) => {
|
||||
const el = document.querySelector(selector);
|
||||
if (el) resolve(el);
|
||||
new MutationObserver((mutationRecords, observer) => {
|
||||
// Query for elements matching the specified selector
|
||||
Array.from(document.querySelectorAll(selector)).forEach((element) => {
|
||||
resolve(element);
|
||||
//Once we have resolved we don't need the observer anymore.
|
||||
observer.disconnect();
|
||||
});
|
||||
}).observe(document.documentElement, {
|
||||
childList: true,
|
||||
subtree: true
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
function sex(sex) {
|
||||
return sex // Sex
|
||||
}
|
||||
function sex(sex) {
|
||||
return sex // Sex
|
||||
}
|
||||
|
||||
function rand(list) {
|
||||
return list ? list[list.length * Math.random() | 0] : null;
|
||||
}
|
||||
function rand(list) {
|
||||
return list ? list[list.length * Math.random() | 0] : null;
|
||||
}
|
||||
|
||||
// Rot music player
|
||||
const audio = document.createElement("audio");
|
||||
audio.loop = true;
|
||||
audio.id = "user-music";
|
||||
audio.style = "display:none;";
|
||||
localStorage.audiovolume = (audio.volume = localStorage.audiovolume ? localStorage.audiovolume / 100 : 0.5) * 100;
|
||||
// Rot music player
|
||||
const audio = document.createElement("audio");
|
||||
audio.loop = true;
|
||||
audio.id = "user-music";
|
||||
audio.style = "display:none;";
|
||||
localStorage.audiovolume = (audio.volume = localStorage.audiovolume ? localStorage.audiovolume / 100 : 0.5) * 100;
|
||||
|
||||
function setMusic(url) {
|
||||
if (audio.src == url || (!url && audio.src === ""))
|
||||
return;
|
||||
function setMusic(url) {
|
||||
if (audio.src == url || (!url && audio.src === window.location.toString()))
|
||||
return;
|
||||
|
||||
if (!audio.paused || audio.src != "") {
|
||||
console.log("Stopping music");
|
||||
audio.pause();
|
||||
// This line will cause a lot of errors.
|
||||
// Setting src to "" will cause any pending .play()s to fail.
|
||||
audio.src = "";
|
||||
|
||||
if (url) {
|
||||
console.log("Setting music: " + url);
|
||||
audio.src = url;
|
||||
playMusic();
|
||||
}
|
||||
}
|
||||
|
||||
if (url) {
|
||||
console.log("Setting music: " + url);
|
||||
audio.src = url;
|
||||
playMusic();
|
||||
function playMusic() {
|
||||
//Starts playing the music if it isn't muted and isn't already playing
|
||||
if (audio.src && audio.src != "" && audio.paused && !audio.muted)
|
||||
audio.play().catch(() => getPromiseFromEvent(window, 'click').then(audio.play));
|
||||
}
|
||||
}
|
||||
|
||||
function playMusic() {
|
||||
//Starts playing the music if it isn't muted and isn't already playing
|
||||
if (audio.src && audio.src != "" && audio.paused && !audio.muted)
|
||||
audio.play().catch(() => getPromiseFromEvent(window, 'click').then(audio.play));
|
||||
}
|
||||
function setImage(url) {
|
||||
if (url) {
|
||||
console.log("Setting background: " + url);
|
||||
document.getElementById("app-loaded").style.setProperty("--body-background-image", "url(" + url + ")");
|
||||
}
|
||||
}
|
||||
|
||||
function setImage(url) {
|
||||
if (!url)
|
||||
url = '/static/background.jpg';
|
||||
//Audio control events
|
||||
function volumeSet(number) {
|
||||
localStorage.audiovolume = Math.round((audio.volume = number) * 100);
|
||||
updateVolumeLabel();
|
||||
}
|
||||
function volumeAdd(number) {
|
||||
volumeSet(Math.min(1, Math.max(0, audio.volume + number)));
|
||||
}
|
||||
function updateVolumeLabel() {
|
||||
document.getElementById("user-audio-percentage").innerHTML = Math.round(audio.volume * 100) + "%";
|
||||
}
|
||||
|
||||
console.log("Setting background: " + url);
|
||||
document.getElementById("app-loaded").style.setProperty("--body-background-image", "url(" + url + ")");
|
||||
}
|
||||
|
||||
//Audio control events
|
||||
function volumeSet(number) {
|
||||
localStorage.audiovolume = Math.round((audio.volume = number) * 100);
|
||||
updateVolumeLabel();
|
||||
}
|
||||
function volumeAdd(number) {
|
||||
volumeSet(Math.min(1, Math.max(0, audio.volume + number)));
|
||||
}
|
||||
function updateVolumeLabel() {
|
||||
document.getElementById("user-audio-percentage").innerHTML = Math.round(audio.volume * 100) + "%";
|
||||
}
|
||||
|
||||
//Initialize audio controls
|
||||
waitUntil("#music-controls").then((controls) => {
|
||||
updateVolumeLabel();
|
||||
controls.querySelector("#music-up").onclick = () => volumeAdd(0.05);
|
||||
controls.querySelector("#music-down").onclick = () => volumeAdd(-0.05);
|
||||
})
|
||||
|
||||
waitUntil("#music-slider").then((slider) => {
|
||||
updateVolumeLabel();
|
||||
slider.oninput = () => volumeSet(slider.value / 100);
|
||||
})
|
||||
|
||||
waitUntil("#music-mute").then((box) => {
|
||||
audio.muted = box.checked = localStorage.audiomuted === "true";
|
||||
box.addEventListener('click', () => {
|
||||
localStorage.audiomuted = audio.muted = box.checked;
|
||||
playMusic();
|
||||
//Initialize audio controls
|
||||
waitUntil("#music-controls").then((controls) => {
|
||||
updateVolumeLabel();
|
||||
controls.querySelector("#music-up").onclick = () => volumeAdd(0.05);
|
||||
controls.querySelector("#music-down").onclick = () => volumeAdd(-0.05);
|
||||
})
|
||||
});
|
||||
|
||||
//Theme application
|
||||
function applyMainTheme() {
|
||||
console.log("Applying main theme");
|
||||
setTimeout(() => {
|
||||
let pageMusic = document.querySelector('meta[name="pageMusic"]')?.content || document.getElementById("pageMusic")?.getAttribute("href");
|
||||
setMusic(pageMusic);
|
||||
playMusic();
|
||||
waitUntil("#music-slider").then((slider) => {
|
||||
updateVolumeLabel();
|
||||
slider.oninput = () => volumeSet(slider.value / 100);
|
||||
})
|
||||
|
||||
let pageImage = document.querySelector('meta[name="pageImage"]')?.content || document.getElementById("pageImage")?.getAttribute("href");
|
||||
setImage(pageImage);
|
||||
}, 1000);
|
||||
}
|
||||
waitUntil("#music-mute").then((box) => {
|
||||
audio.muted = box.checked = localStorage.audiomuted === "true";
|
||||
box.addEventListener('click', () => {
|
||||
localStorage.audiomuted = audio.muted = box.checked;
|
||||
playMusic();
|
||||
})
|
||||
});
|
||||
|
||||
function applyUserTheme() {
|
||||
console.log("Applying user theme");
|
||||
setMusic(null);
|
||||
setTimeout(() => {
|
||||
let ptp = findProfileThemingPost();
|
||||
if (ptp) {
|
||||
//Configured by post
|
||||
let musicContainer = ptp.querySelector(".audio-container")
|
||||
if (musicContainer)
|
||||
setMusic(rand(musicContainer.children).src);
|
||||
else
|
||||
setMusic(null);
|
||||
//Theme application
|
||||
function applyMainTheme() {
|
||||
console.log("Applying main theme");
|
||||
setTimeout(() => {
|
||||
let pageMusic = document.querySelector('meta[name="pageMusic"]')?.content || document.getElementById("pageMusic")?.getAttribute("href");
|
||||
setMusic(pageMusic);
|
||||
playMusic();
|
||||
|
||||
let imageContainer = ptp.querySelector(".image-container")
|
||||
if (imageContainer)
|
||||
setImage(rand(imageContainer.getElementsByTagName("img")).src);
|
||||
else
|
||||
setImage(null);
|
||||
return;
|
||||
}
|
||||
|
||||
let fields = [...document.getElementsByClassName("user-profile-field-name")]
|
||||
if (fields.length != 0) {
|
||||
//Configured by fields
|
||||
let musicFields = fields.filter((x) => x.title.toLowerCase().replace(/\s+/g, '') == "music")
|
||||
if (musicFields.length > 0)
|
||||
setMusic(rand(musicFields).nextElementSibling.title);
|
||||
else
|
||||
setMusic(null);
|
||||
|
||||
let imageFields = fields.filter((x) => x.title.toLowerCase().replace(/\s+/g, '') == "image")
|
||||
if (imageFields.length > 0)
|
||||
setImage(rand(imageFields).nextElementSibling.title);
|
||||
else
|
||||
setImage(null);
|
||||
return;
|
||||
}
|
||||
}, 1000);
|
||||
}
|
||||
|
||||
function findProfileThemingPost() {
|
||||
try {
|
||||
let pinnedPosts = document.getElementsByClassName("pin");
|
||||
if (pinnedPosts.length == 0)
|
||||
return null;
|
||||
|
||||
let ptp = [...pinnedPosts].find( // I hate this. It keeps getting worse.
|
||||
(x) => x.nextElementSibling
|
||||
.querySelector(".StatusBody")
|
||||
.querySelector(".text")
|
||||
.innerHTML
|
||||
.replace(/(<([^>]+)>)/ig, '')
|
||||
.search(/profile theming post/ig) != -1
|
||||
)
|
||||
if (!ptp)
|
||||
return null;
|
||||
|
||||
return ptp.nextElementSibling.querySelector(".StatusBody");
|
||||
} catch (e) {
|
||||
//Future-proofing
|
||||
console.error(e);
|
||||
return null;
|
||||
let pageImage = document.querySelector('meta[name="pageImage"]')?.content || document.getElementById("pageImage")?.getAttribute("href");
|
||||
setImage(pageImage);
|
||||
}, 1000);
|
||||
}
|
||||
}
|
||||
|
||||
//Switch-based monkey patching router bullshit
|
||||
{
|
||||
let lastPath = window.location.pathname;
|
||||
addEventListener('locationchange', (event) => {
|
||||
function applyUserTheme() {
|
||||
console.log("Applying user theme");
|
||||
setMusic(null);
|
||||
setTimeout(() => {
|
||||
let ptp = findProfileThemingPost();
|
||||
if (ptp) {
|
||||
//Configured by post
|
||||
let musicContainer = ptp.querySelector(".audio-container")
|
||||
if (musicContainer)
|
||||
setMusic(rand(musicContainer.children).src);
|
||||
else
|
||||
setMusic(null);
|
||||
|
||||
let imageContainer = ptp.querySelector(".image-container")
|
||||
if (imageContainer)
|
||||
setImage(rand(imageContainer.getElementsByTagName("img")).src);
|
||||
else
|
||||
setImage(null);
|
||||
return;
|
||||
}
|
||||
|
||||
let fields = [...document.getElementsByClassName("user-profile-field-name")]
|
||||
if (fields.length != 0) {
|
||||
//Configured by fields
|
||||
let musicFields = fields.filter((x) => x.title.toLowerCase().replace(/\s+/g, '') == "music")
|
||||
if (musicFields.length > 0)
|
||||
setMusic(rand(musicFields).nextElementSibling.title);
|
||||
else
|
||||
setMusic(null);
|
||||
|
||||
let imageFields = fields.filter((x) => x.title.toLowerCase().replace(/\s+/g, '') == "image")
|
||||
if (imageFields.length > 0)
|
||||
setImage(rand(imageFields).nextElementSibling.title);
|
||||
else
|
||||
setImage(null);
|
||||
return;
|
||||
}
|
||||
}, 1000);
|
||||
}
|
||||
|
||||
function findProfileThemingPost() {
|
||||
try {
|
||||
let pinnedPosts = document.getElementsByClassName("pin");
|
||||
if (pinnedPosts.length == 0)
|
||||
return null;
|
||||
|
||||
let ptp = [...pinnedPosts].find( // I hate this. It keeps getting worse.
|
||||
(x) => x.nextElementSibling
|
||||
.querySelector(".StatusBody")
|
||||
.querySelector(".text")
|
||||
.innerHTML
|
||||
.replace(/(<([^>]+)>)/ig, '')
|
||||
.search(/profile theming post/ig) != -1
|
||||
)
|
||||
if (!ptp)
|
||||
return null;
|
||||
|
||||
return ptp.nextElementSibling.querySelector(".StatusBody");
|
||||
} catch (e) {
|
||||
//Future-proofing
|
||||
console.error(e);
|
||||
return null;
|
||||
}
|
||||
}
|
||||
|
||||
//Switch-based monkey patching router bullshit
|
||||
let lastPath = null;
|
||||
function updateRot() {
|
||||
let newPath = window.location.pathname;
|
||||
if (lastPath == newPath)
|
||||
return;
|
||||
|
@ -266,7 +240,28 @@ function findProfileThemingPost() {
|
|||
applyMainTheme();
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
//Monkey patches
|
||||
addEventListener('locationchange', updateRot);
|
||||
|
||||
const oldPushState = history.pushState;
|
||||
history.pushState = function pushState() {
|
||||
const ret = oldPushState.apply(this, arguments);
|
||||
updateRot();
|
||||
return ret;
|
||||
};
|
||||
|
||||
const oldReplaceState = history.replaceState;
|
||||
history.replaceState = function replaceState() {
|
||||
const ret = oldReplaceState.apply(this, arguments);
|
||||
updateRot();
|
||||
return ret;
|
||||
};
|
||||
|
||||
window.addEventListener('popstate', () => {
|
||||
updateRot();
|
||||
});
|
||||
}
|
||||
})();
|
||||
|
||||
console.log("rot.js loaded");
|
Loading…
Reference in a new issue