mirror of
https://github.com/EmulatorJS/EmulatorJS.git
synced 2024-09-20 02:46:23 +00:00
Ability to create and close popups
This commit is contained in:
parent
86d28b867a
commit
9709e5df9b
2 changed files with 89 additions and 2 deletions
|
@ -198,3 +198,41 @@
|
|||
width: 0;
|
||||
z-index: 2;
|
||||
}
|
||||
|
||||
.ejs_popup_container {
|
||||
background: rgba(0,0,0,0.8);
|
||||
text-align: center;
|
||||
z-index: 9999;
|
||||
height: 100%;
|
||||
overflow: hidden;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
width: 100%;
|
||||
color: #ccc;
|
||||
}
|
||||
|
||||
.ejs_popup_container h4 {
|
||||
color: #ccc;
|
||||
font-size: 24px;
|
||||
margin: 0;
|
||||
padding: 10px;
|
||||
}
|
||||
|
||||
.ejs_button {
|
||||
border-radius: .25rem;
|
||||
font-size: .875rem;
|
||||
padding-left: 1rem;
|
||||
padding-right: 1rem;
|
||||
padding-top: .5rem;
|
||||
padding-bottom: .5rem;
|
||||
display: inline-block;
|
||||
background-color: rgba(var(--ejs-primary-color),1);
|
||||
margin: 0 10px;
|
||||
color: #fff !important;
|
||||
touch-action: manipulation;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.ejs_popup_body {
|
||||
height: calc(100% - 130px);
|
||||
}
|
||||
|
|
|
@ -328,7 +328,10 @@ class EmulatorJS {
|
|||
if (hidden) li.hidden = true;
|
||||
const a = this.createElement("a");
|
||||
if (functi0n instanceof Function) {
|
||||
this.addEventListener(li, 'click', functi0n);
|
||||
this.addEventListener(li, 'click', (e) => {
|
||||
e.preventDefault();
|
||||
functi0n();
|
||||
});
|
||||
}
|
||||
a.href = "#";
|
||||
a.onclick = "return false";
|
||||
|
@ -357,12 +360,58 @@ class EmulatorJS {
|
|||
this.gameManager.quickLoad();
|
||||
hideMenu();
|
||||
});
|
||||
addButton("EmulatorJS", false, () => console.log("4"));
|
||||
addButton("EmulatorJS", false, () => {
|
||||
hideMenu();
|
||||
const body = this.createPopup("EmulatorJS", {
|
||||
"Close": () => {
|
||||
this.closePopup();
|
||||
}
|
||||
});
|
||||
body.innerText = "Todo. Write about, include tabs on side with licenses, links to docs/repo/discord?";
|
||||
|
||||
});
|
||||
|
||||
this.elements.contextmenu.appendChild(parent);
|
||||
|
||||
this.elements.parent.appendChild(this.elements.contextmenu);
|
||||
}
|
||||
closePopup() {
|
||||
if (this.currentPopup !== null) {
|
||||
try {
|
||||
this.currentPopup.remove();
|
||||
} catch(e){}
|
||||
this.currentPopup = null;
|
||||
}
|
||||
}
|
||||
//creates a full box popup.
|
||||
createPopup(popupTitle, buttons) {
|
||||
this.closePopup();
|
||||
this.currentPopup = this.createElement('div');
|
||||
this.currentPopup.classList.add("ejs_popup_container");
|
||||
this.elements.parent.appendChild(this.currentPopup);
|
||||
const title = this.createElement("h4");
|
||||
title.innerText = popupTitle;
|
||||
const main = this.createElement("div");
|
||||
main.classList.add("ejs_popup_body");
|
||||
|
||||
this.currentPopup.appendChild(title);
|
||||
this.currentPopup.appendChild(main);
|
||||
|
||||
for (let k in buttons) {
|
||||
const button = this.createElement("a");
|
||||
if (buttons[k] instanceof Function) {
|
||||
button.addEventListener("click", (e) => {
|
||||
buttons[k]();
|
||||
e.preventDefault();
|
||||
});
|
||||
}
|
||||
button.classList.add("ejs_button");
|
||||
button.innerText = k;
|
||||
this.currentPopup.appendChild(button);
|
||||
}
|
||||
|
||||
return main;
|
||||
}
|
||||
selectFile() {
|
||||
return new Promise((resolve, reject) => {
|
||||
const file = this.createElement("input");
|
||||
|
|
Loading…
Reference in a new issue