mirror of
https://github.com/EmulatorJS/EmulatorJS.git
synced 2024-09-20 02:46:23 +00:00
Various cleanup
This commit is contained in:
parent
1cff22cf3c
commit
8ea6db2b47
2 changed files with 59 additions and 5 deletions
|
@ -13,6 +13,9 @@
|
||||||
width: 100%;
|
width: 100%;
|
||||||
height: 100%;
|
height: 100%;
|
||||||
color: #bcbcbc;
|
color: #bcbcbc;
|
||||||
|
outline-width: 0;
|
||||||
|
outline: none;
|
||||||
|
font-size: 14px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.ejs_parent ::-webkit-scrollbar{
|
.ejs_parent ::-webkit-scrollbar{
|
||||||
|
@ -322,6 +325,15 @@
|
||||||
.ejs_control_bar:hover {
|
.ejs_control_bar:hover {
|
||||||
background-color: #2d2d2d;
|
background-color: #2d2d2d;
|
||||||
}
|
}
|
||||||
|
.ejs_control_set_button {
|
||||||
|
float: none;
|
||||||
|
padding: .1rem .5rem;
|
||||||
|
background-color: rgba(var(--ejs-primary-color),1);
|
||||||
|
color: #fff !important;
|
||||||
|
border-radius: .25rem;
|
||||||
|
cursor: pointer;
|
||||||
|
font-size: 14px;
|
||||||
|
}
|
||||||
|
|
||||||
.ejs_popup_box {
|
.ejs_popup_box {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
|
|
|
@ -105,6 +105,7 @@ class EmulatorJS {
|
||||||
parent: this.game.parentElement
|
parent: this.game.parentElement
|
||||||
}
|
}
|
||||||
this.elements.parent.classList.add("ejs_parent");
|
this.elements.parent.classList.add("ejs_parent");
|
||||||
|
this.elements.parent.setAttribute("tabindex", -1);
|
||||||
}
|
}
|
||||||
// Start button
|
// Start button
|
||||||
createStartButton() {
|
createStartButton() {
|
||||||
|
@ -467,6 +468,7 @@ class EmulatorJS {
|
||||||
this.setupSettingsMenu();
|
this.setupSettingsMenu();
|
||||||
this.handleResize();
|
this.handleResize();
|
||||||
this.updateCheatUI();
|
this.updateCheatUI();
|
||||||
|
this.elements.parent.focus();
|
||||||
}
|
}
|
||||||
bindListeners() {
|
bindListeners() {
|
||||||
this.createContextMenu();
|
this.createContextMenu();
|
||||||
|
@ -474,8 +476,12 @@ class EmulatorJS {
|
||||||
this.createControlSettingMenu();
|
this.createControlSettingMenu();
|
||||||
this.createCheatsMenu()
|
this.createCheatsMenu()
|
||||||
this.setVirtualGamepad();
|
this.setVirtualGamepad();
|
||||||
this.addEventListener(document, "keydown keyup", this.keyChange.bind(this));
|
this.addEventListener(this.elements.parent, "keydown keyup", this.keyChange.bind(this));
|
||||||
|
this.addEventListener(this.elements.parent, "mousedown mouseup click touchstart touchend touchcancel", (e) => {
|
||||||
|
this.elements.parent.focus();
|
||||||
|
})
|
||||||
this.addEventListener(window, "resize", this.handleResize.bind(this));
|
this.addEventListener(window, "resize", this.handleResize.bind(this));
|
||||||
|
//this.addEventListener(window, "blur", e => console.log(e), true); //TODO - add "click to make keyboard keys work" message
|
||||||
//this.gamepad = new GamepadHandler(); //https://github.com/ethanaobrien/Gamepad
|
//this.gamepad = new GamepadHandler(); //https://github.com/ethanaobrien/Gamepad
|
||||||
//keyboard, etc...
|
//keyboard, etc...
|
||||||
}
|
}
|
||||||
|
@ -603,6 +609,9 @@ class EmulatorJS {
|
||||||
file.click();
|
file.click();
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
isPopupOpen() {
|
||||||
|
return this.cheatMenu.style.display !== "none" || this.controlMenu.style.display !== "none";
|
||||||
|
}
|
||||||
createBottomMenuBar() {
|
createBottomMenuBar() {
|
||||||
this.elements.menu = this.createElement("div");
|
this.elements.menu = this.createElement("div");
|
||||||
this.elements.menu.classList.add("ejs_menu_bar");
|
this.elements.menu.classList.add("ejs_menu_bar");
|
||||||
|
@ -616,6 +625,7 @@ class EmulatorJS {
|
||||||
|
|
||||||
this.addEventListener(this.elements.parent, 'mousemove click', (e) => {
|
this.addEventListener(this.elements.parent, 'mousemove click', (e) => {
|
||||||
if (!this.started) return;
|
if (!this.started) return;
|
||||||
|
if (this.isPopupOpen()) return;
|
||||||
if (timeout !== null) clearTimeout(timeout);
|
if (timeout !== null) clearTimeout(timeout);
|
||||||
timeout = setTimeout(hide, 3000);
|
timeout = setTimeout(hide, 3000);
|
||||||
this.elements.menu.classList.remove("ejs_menu_bar_hidden");
|
this.elements.menu.classList.remove("ejs_menu_bar_hidden");
|
||||||
|
@ -769,10 +779,31 @@ class EmulatorJS {
|
||||||
});
|
});
|
||||||
exit.style.display = "none";
|
exit.style.display = "none";
|
||||||
|
|
||||||
|
this.addEventListener(document, "webkitfullscreenchange mozfullscreenchange fullscreenchange", (e) => {
|
||||||
|
if (e.target !== this.elements.parent) return;
|
||||||
|
if (document.fullscreenElement === null) {
|
||||||
|
exit.style.display = "none";
|
||||||
|
enter.style.display = "";
|
||||||
|
} else {
|
||||||
|
//not sure if this is possible, lets put it here anyways
|
||||||
|
exit.style.display = "";
|
||||||
|
enter.style.display = "none";
|
||||||
|
}
|
||||||
|
})
|
||||||
|
|
||||||
}
|
}
|
||||||
createControlSettingMenu() {
|
createControlSettingMenu() {
|
||||||
|
let buttonListeners = [];
|
||||||
this.controls = this.defaultControllers;
|
this.controls = this.defaultControllers;
|
||||||
const body = this.createPopup("Control Settings", {
|
const body = this.createPopup("Control Settings", {
|
||||||
|
"Reset": () => {
|
||||||
|
this.controls = JSON.parse(JSON.stringify(this.defaultControllers));
|
||||||
|
buttonListeners.forEach(elem => elem());
|
||||||
|
},
|
||||||
|
"Clear": () => {
|
||||||
|
this.controls = {0:{},1:{},2:{},3:{}};
|
||||||
|
buttonListeners.forEach(elem => elem());
|
||||||
|
},
|
||||||
"Close": () => {
|
"Close": () => {
|
||||||
this.controlMenu.style.display = "none";
|
this.controlMenu.style.display = "none";
|
||||||
}
|
}
|
||||||
|
@ -839,7 +870,6 @@ class EmulatorJS {
|
||||||
}
|
}
|
||||||
body.appendChild(playerSelect);
|
body.appendChild(playerSelect);
|
||||||
|
|
||||||
|
|
||||||
const controls = this.createElement("div");
|
const controls = this.createElement("div");
|
||||||
for (let i=0; i<4; i++) {
|
for (let i=0; i<4; i++) {
|
||||||
const player = this.createElement("div");
|
const player = this.createElement("div");
|
||||||
|
@ -915,6 +945,17 @@ class EmulatorJS {
|
||||||
textBox2.setAttribute("placeholder", "");
|
textBox2.setAttribute("placeholder", "");
|
||||||
textBox2Parent.appendChild(textBox2);
|
textBox2Parent.appendChild(textBox2);
|
||||||
|
|
||||||
|
buttonListeners.push(() => {
|
||||||
|
textBox2.value = "";
|
||||||
|
textBox1.value = "";
|
||||||
|
if (this.controls[i][k] && this.controls[i][k].value) {
|
||||||
|
textBox2.value = this.controls[i][k].value;
|
||||||
|
}
|
||||||
|
if (this.controls[i][k] && this.controls[i][k].value2) {
|
||||||
|
textBox1.value = this.controls[i][k].value2;
|
||||||
|
}
|
||||||
|
})
|
||||||
|
|
||||||
if (this.controls[i][k] && this.controls[i][k].value) {
|
if (this.controls[i][k] && this.controls[i][k].value) {
|
||||||
textBox2.value = this.controls[i][k].value;
|
textBox2.value = this.controls[i][k].value;
|
||||||
}
|
}
|
||||||
|
@ -931,7 +972,8 @@ class EmulatorJS {
|
||||||
|
|
||||||
const setButton = this.createElement("div");
|
const setButton = this.createElement("div");
|
||||||
setButton.style = "width:25%;float:left;";
|
setButton.style = "width:25%;float:left;";
|
||||||
const button = this.createElement("button");
|
const button = this.createElement("a");
|
||||||
|
button.classList.add("ejs_control_set_button");
|
||||||
button.innerText = "Set";
|
button.innerText = "Set";
|
||||||
setButton.appendChild(button);
|
setButton.appendChild(button);
|
||||||
|
|
||||||
|
@ -948,7 +990,7 @@ class EmulatorJS {
|
||||||
this.addEventListener(buttonText, "mousedown", (e) => {
|
this.addEventListener(buttonText, "mousedown", (e) => {
|
||||||
e.preventDefault();
|
e.preventDefault();
|
||||||
this.controlPopup.parentElement.removeAttribute("hidden");
|
this.controlPopup.parentElement.removeAttribute("hidden");
|
||||||
this.controlPopup.innerText = "[ " + buttons[k] + " ]\ntest";
|
this.controlPopup.innerText = "[ " + buttons[k] + " ]\n";
|
||||||
this.controlPopup.setAttribute("button-num", k);
|
this.controlPopup.setAttribute("button-num", k);
|
||||||
this.controlPopup.setAttribute("player-num", i);
|
this.controlPopup.setAttribute("player-num", i);
|
||||||
this.updateTextBoxes = () => {
|
this.updateTextBoxes = () => {
|
||||||
|
@ -1058,7 +1100,7 @@ class EmulatorJS {
|
||||||
controls;
|
controls;
|
||||||
keyChange(e) {
|
keyChange(e) {
|
||||||
if (!this.started) return;
|
if (!this.started) return;
|
||||||
if (this.cheatMenu.style.display !== "none" || this.settingsMenu.style.display !== "none") return;
|
if (this.settingsMenu.style.display !== "none" || this.cheatMenu.style.display !== "none") return;
|
||||||
e.preventDefault();
|
e.preventDefault();
|
||||||
if (this.controlPopup.parentElement.getAttribute("hidden") === null) {
|
if (this.controlPopup.parentElement.getAttribute("hidden") === null) {
|
||||||
const num = this.controlPopup.getAttribute("button-num");
|
const num = this.controlPopup.getAttribute("button-num");
|
||||||
|
|
Loading…
Reference in a new issue