Request click for floating actions buttons and add fullscreen toggle for better mobile use
This commit is contained in:
parent
d831b3f835
commit
90545d82fe
2 changed files with 18 additions and 3 deletions
|
@ -45,6 +45,14 @@ socket.on("setSlot", data => {
|
||||||
setSlot(data.name, data.data, ...data.position)
|
setSlot(data.name, data.data, ...data.position)
|
||||||
});
|
});
|
||||||
|
|
||||||
|
document.getElementById("fullScreen").addEventListener("click", ev => {
|
||||||
|
ev.stopPropagation();
|
||||||
|
if (!document.fullscreenElement)
|
||||||
|
document.documentElement.requestFullscreen();
|
||||||
|
else if (document.exitFullscreen)
|
||||||
|
document.exitFullscreen();
|
||||||
|
});
|
||||||
|
|
||||||
deckSelect.addEventListener("change", ev => {
|
deckSelect.addEventListener("change", ev => {
|
||||||
ev.stopPropagation();
|
ev.stopPropagation();
|
||||||
socket.emit("getDeck", deckSelect.value);
|
socket.emit("getDeck", deckSelect.value);
|
||||||
|
@ -74,4 +82,5 @@ function setSlot(name, data, x, y) {
|
||||||
|
|
||||||
document.addEventListener("DOMContentLoaded", () => {
|
document.addEventListener("DOMContentLoaded", () => {
|
||||||
M.AutoInit();
|
M.AutoInit();
|
||||||
|
M.FloatingActionButton.init(document.querySelector(".fixed-action-btn"), {hoverEnabled: false})
|
||||||
});
|
});
|
||||||
|
|
|
@ -4,13 +4,19 @@ block content
|
||||||
h1.center OpenDeck
|
h1.center OpenDeck
|
||||||
.container#deck
|
.container#deck
|
||||||
|
|
||||||
.fixed-action-btn
|
.fixed-action-btn.no-autoinit
|
||||||
a(href="#modal").btn-floating.btn-large.green.modal-trigger
|
a.btn-floating.btn-large.green
|
||||||
i.large.material-icons toc
|
i.large.material-icons menu
|
||||||
ul
|
ul
|
||||||
li
|
li
|
||||||
a(href="/settings").btn-floating.red
|
a(href="/settings").btn-floating.red
|
||||||
i.material-icons settings
|
i.material-icons settings
|
||||||
|
li
|
||||||
|
a(href="#modal").btn-floating.blue.modal-trigger
|
||||||
|
i.material-icons toc
|
||||||
|
li
|
||||||
|
a#fullScreen.btn-floating.yellow
|
||||||
|
i.material-icons fullscreen
|
||||||
|
|
||||||
#modal.modal
|
#modal.modal
|
||||||
.modal-content
|
.modal-content
|
||||||
|
|
Loading…
Reference in a new issue