make the rules modal more proper
This commit is contained in:
parent
dd79226b57
commit
afcd1f2778
GPG key ID:
EDA5D222A0C270F2
1 changed files with 21 additions and 86 deletions
95
extra.js
95
extra.js
|
|
@ -5,95 +5,31 @@ if(window.PvInternals.services_client) {
|
||||||
// custom rules
|
// custom rules
|
||||||
(() => {
|
(() => {
|
||||||
const pv = window.PvInternals;
|
const pv = window.PvInternals;
|
||||||
//#region custom modal
|
|
||||||
class PvmeRulesModal extends pv.components_pv_popup_pv_popup {
|
class PvmeRulesModal extends pv.components_pv_popup_pv_popup {
|
||||||
constructor() {
|
constructor() {
|
||||||
super();
|
super();
|
||||||
this.message = "yo"
|
this.innerHTML = `<dialog blocking class=popup modal><div class=header><div class=title style=margin-right:20px><i class="fas fa-info-circle"></i> Rules</div><div class=x><i class="fas fa-xmark"></i></div></div><div class=content><div class=message><b>pianoverse.me rules are very simple.</b><ul><li>Don't be annoying<li>Don't be racist<li>Do not argue punishments</ul>That's it! :)</div></div></dialog>`;
|
||||||
|
|
||||||
this.innerHTML = `
|
|
||||||
<dialog class="popup" modal blocking>
|
|
||||||
<div class="header">
|
|
||||||
<div class="title" style="margin-right: 20px">
|
|
||||||
<i class="fas fa-info-circle"></i> Rules
|
|
||||||
</div>
|
|
||||||
<div class="x"><i class="fas fa-xmark"></i></div>
|
|
||||||
</div>
|
|
||||||
<div class="content">
|
|
||||||
<div class="message">
|
|
||||||
<b>pianoverse.me rules are very simple.</b>
|
|
||||||
<ul>
|
|
||||||
<li>Don't be annoying</li>
|
|
||||||
<li>Don't be racist</li>
|
|
||||||
<li>Do not argue punishments</li>
|
|
||||||
</ul>
|
|
||||||
That's it! :)
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</dialog>`;
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
customElements.define("pvme-rules-modal", PvmeRulesModal);
|
customElements.define("pvme-rules-modal", PvmeRulesModal);
|
||||||
pv.Modal.RULES = "pvme-rules-modal";
|
pv.Modal.RULES = "pvme-rules-modal";
|
||||||
|
let oldOpen = pv.PopupManager.open;
|
||||||
//#endregion custom modal
|
|
||||||
//#region break PopupMananger so it takes our new popup into account
|
|
||||||
pv.PopupManager.open = (e, ...t) => {
|
pv.PopupManager.open = (e, ...t) => {
|
||||||
let i;
|
if(pv.Modal.RULES == e) {
|
||||||
if (i = document.querySelector(e),
|
let i = new PvmeRulesModal();
|
||||||
i && !i.querySelector("dialog").hasAttribute("closing"))
|
if (i == document.querySelector(e) && !i.querySelector("dialog").hasAttribute("closing"))
|
||||||
return i.close(),
|
return i.close();
|
||||||
i;
|
|
||||||
switch (e) {
|
document.body.append(i)
|
||||||
case pv.Modal.BAN:
|
i.open(...t)
|
||||||
i = new pv.components_popups_pv_ban_pv_ban;
|
|
||||||
break;
|
return i;
|
||||||
case pv.Modal.PROFILE:
|
} else {
|
||||||
i = new pv.components_popups_pv_profile_pv_profile;
|
return oldOpen(e, ...t)
|
||||||
break;
|
|
||||||
case pv.Modal.SETTINGS:
|
|
||||||
i = new pv.components_popups_pv_settings_pv_settings;
|
|
||||||
break;
|
|
||||||
case pv.Modal.MESSAGE:
|
|
||||||
i = new pv.components_popups_pv_message_pv_message;
|
|
||||||
break;
|
|
||||||
case pv.Modal.NEW_ROOM:
|
|
||||||
i = new pv.components_popups_pv_new_room_pv_new_room;
|
|
||||||
break;
|
|
||||||
case pv.Modal.NEW_ROOM:
|
|
||||||
i = new pv.components_popups_pv_new_room_pv_new_room;
|
|
||||||
break;
|
|
||||||
case pv.Modal.RULES:
|
|
||||||
i = new PvmeRulesModal;
|
|
||||||
break;
|
|
||||||
case pv.Dialog.ROOMS:
|
|
||||||
i = new pv.components_popups_pv_rooms_pv_rooms;
|
|
||||||
break;
|
|
||||||
case pv.Dialog.ACTIONS:
|
|
||||||
i = new pv.components_popups_pv_actions_pv_actions;
|
|
||||||
break;
|
|
||||||
case pv.Dialog.DEVICES:
|
|
||||||
i = new pv.components_popups_pv_devices_pv_devices;
|
|
||||||
break;
|
|
||||||
case pv.Dialog.SOUNDS:
|
|
||||||
i = new pv.components_popups_pv_sounds_pv_sounds;
|
|
||||||
break;
|
|
||||||
case pv.Dialog.TRANSPOSE:
|
|
||||||
i = new pv.components_popups_pv_transpose_pv_transpose;
|
|
||||||
break;
|
|
||||||
case pv.Dialog.VELOCITY:
|
|
||||||
i = new pv.components_popups_pv_velocity_pv_velocity;
|
|
||||||
break;
|
|
||||||
default:
|
|
||||||
throw new Error(`Popup ${e} not found`)
|
|
||||||
}
|
}
|
||||||
return i && (document.body.append(i),
|
|
||||||
i.open(...t)),
|
|
||||||
i
|
|
||||||
}
|
}
|
||||||
//#endregion
|
|
||||||
//#region pvme rules
|
|
||||||
class PvmeRules extends HTMLElement {}
|
class PvmeRules extends HTMLElement {}
|
||||||
customElements.define("pvme-rules", PvmeRules);
|
customElements.define("pvme-rules", PvmeRules);
|
||||||
|
|
||||||
|
|
@ -103,11 +39,10 @@ if(window.PvInternals.services_client) {
|
||||||
let a = document.createElement("pvme-rules");
|
let a = document.createElement("pvme-rules");
|
||||||
a.innerHTML = `<div class="icon" aria-label="Rules" data-tooltip="Rules"><i class="fas fa-scale-balanced"></i></div>`;
|
a.innerHTML = `<div class="icon" aria-label="Rules" data-tooltip="Rules"><i class="fas fa-scale-balanced"></i></div>`;
|
||||||
a.addEventListener("click", () => {
|
a.addEventListener("click", () => {
|
||||||
pv.PopupManager.open(pv.Modal.RULES, null, "Rules.\nDon't be annoying.\n\nThat's it.");
|
pv.PopupManager.open(pv.Modal.RULES, null);
|
||||||
})
|
})
|
||||||
g.appendChild(a);
|
g.appendChild(a);
|
||||||
}
|
}
|
||||||
//#endregion pvme rules
|
|
||||||
})();
|
})();
|
||||||
|
|
||||||
// change title
|
// change title
|
||||||
|
|
|
||||||
Loading…
Reference in a new issue