settings mask functional

This commit is contained in:
BluePotato102
2023-09-22 19:55:41 -05:00
parent 87e94fc006
commit aa7a98cc10
3 changed files with 55 additions and 21 deletions
+2 -1
View File
@@ -108,7 +108,8 @@ body.noscript {
.homepage,
.games,
.settings {
.settings
.cloaklaunch {
position: absolute;
top: 0;
left: 0;
+13 -7
View File
@@ -82,6 +82,12 @@
This feature has been disabled by whoever is hosting this MonkeyGG2 instance.
</div>
</dialog>
<div class="cloaklaunch">
<h1>Press Anywhere to cloak</h1>
<h4>(If you want to stop seeing this enable popups)</h4>
</div>
<div class="homepage">
<div class="card-row">
@@ -246,7 +252,7 @@
<div class="settings">
<div class="setting-bg">
<h4>Settings</h4>
<h6>Notice: All changes occur on page refresh</h6>
<div class="setting">
<button class="save-button">Download Game Data</button>
<button class="save-button">Upload Game Data</button>
@@ -262,7 +268,7 @@
<h5>Mask</h5>
<p>Toggles if mask is applied on loading of a page automatically</p>
<label class="switch">
<input type="checkbox" id="maskCheckbox" hidden>
<input id="maskCheckboxInput" type="checkbox" hidden>
<div class="switch__wrapper">
<div class="switch__toggle"></div>
</div>
@@ -271,14 +277,14 @@
<div class="setting">
<h5>Mask Title</h5>
<p>This site's title will replace MonkeyGG2's title in your browser tab.</p>
<input class="text-field" type="text" placeholder="Home">
<button class=submit-button>Submit</button>
<input id="maskTitleInput" class="text-field" type="text" placeholder="Home">
<button id="maskTitleSubmit" class=submit-button>Submit</button>
</div>
<div class="setting">
<h5>Mask Icon URL</h5>
<p>This site's icon will replace MonkeyGG2's icon in your browser tab.</p>
<input class="text-field" type="text" placeholder="https://ssl.gstatic.com/classroom/ic_product_classroom_32.png">
<button class=submit-button>Submit</button>
<p>This site's icon will replace MonkeyGG2's icon in your browser tab. (Don't forget https://)</p>
<input id="maskIconInput" class="text-field" type="text" placeholder="https://ssl.gstatic.com/classroom/ic_product_classroom_32.png">
<button id="maskIconSubmit" class=submit-button>Submit</button>
</div>
<div class="setting">
<h5>Shortcuts</h5>
+40 -13
View File
@@ -297,7 +297,7 @@ function refreshPage() {
*
* @return {void}
*/
function makeclone(url) {
function makecloak(url = preferences.cloakUrl) {
if ((window.top.location.href !== "about:blank")) {
var url = window.location.href;
const win = window.open();
@@ -325,7 +325,7 @@ function makeclone(url) {
*
* @return {void}
*/
function mask(title, iconUrl) {
function mask(title = preferences.maskTitle, iconUrl = preferences.maskIconUrl) {
const e = window.top.document;
e.title = title;
var link = e.querySelector("link[rel*='icon']") || document.createElement('link');
@@ -347,7 +347,7 @@ function popupsAllowed(){
}
}
const prefrenceDefaults = {
const preferencesDefaults = {
cloak: true,
cloakUrl: "https://classroom.google.com",
mask: true,
@@ -356,31 +356,58 @@ const prefrenceDefaults = {
};
if (localStorage.getItem("prefrences") == null) {
localStorage.setItem("prefrences", JSON.stringify(prefrenceDefaults));
if (localStorage.getItem("preferences") == null) {
localStorage.setItem("preferences", JSON.stringify(preferencesDefaults));
}
const prefrences = JSON.parse(localStorage.getItem("prefrences"));
const maskCheckbox = document.getElementById('maskCheckbox');
maskCheckbox.checked = prefrences.mask;
const preferences = JSON.parse(localStorage.getItem("preferences"));
const maskCheckbox = document.getElementById('maskCheckboxInput');
const maskTitle = document.getElementById('maskTitleInput');
const maskIcon = document.getElementById('maskIconInput');
maskCheckbox.checked = preferences.mask;
maskTitle.value = preferences.maskTitle;
maskIcon.value = preferences.maskIconUrl;
if (preferences.cloak && (window.location.href === window.top.location.href)){
currentMenu.fadeOut(300, () => {
$(".cloaklaunch").fadeIn(200);
});
currentMenu = $(".cloaklaunch");
}
maskCheckbox.addEventListener('change', function () {
preferences.mask = maskCheckbox.checked;
localStorage.setItem('preferences', JSON.stringify(preferences));
});
/* if (prefrences.cloak && !localStorage.getItem("cloakTabOpened")){
/* if it is wanted to save on input change wather than submission
document.querySelector('.text-field').addEventListener('change', function () {
preferences.maskTitle = maskTitle.value;
localStorage.setItem('preferences', JSON.stringify(preferences));
});
*/
document.getElementById('maskTitleSubmit').addEventListener('click', function () {
preferences.maskTitle = maskTitle.value;
localStorage.setItem('preferences', JSON.stringify(preferences));
});
document.getElementById('maskIconSubmit').addEventListener('click', function () {
preferences.maskIconUrl = maskIcon.value;
localStorage.setItem('preferences', JSON.stringify(preferences));
});
/* if (preferences.cloak && !localStorage.getItem("cloakTabOpened")){
if (window.top.location.href !== "about:blank"){
localStorage.setItem("cloakTabOpened", "true");
document.addEventListener("click", (event) => {event.preventDefault(); makeclone(prefrences.cloakUrl)});
document.addEventListener("click", (event) => {event.preventDefault(); makecloak()});
}
makeclone(prefrences.cloakUrl);
makecloak();
window.addEventListener("beforeunload", () => {
localStorage.removeItem("cloakTabOpened");
});
} */
if (prefrences.mask){
mask(prefrences.maskTitle, prefrences.maskIconUrl)
if (preferences.mask){
mask()
}