Files
segnapunti/src/components/HomePage.vue
Attilio Grilli 8a4dc19542 Modifiche per adattare il piu' possibile alla tipologia APP.
Aggiunto un bordo trasparente alle 2 icone.
In manifest forzata la modalità fullscreen landscape, aiutandosi
anche con documentElement.requestFullscreen().
Le formazioni vengono visualizzate cambiando posto con il punteggio.
inseriti opportuni cambiamenti su style.css.
inserito in css-body overscroll-behavior-y: contain;
per prevenire la ricarica della pagina con swipe-down.
modificato il title direttamente in index.html.
2023-06-07 14:46:09 +02:00

107 lines
2.8 KiB
Vue

<script>
import NoSleep from "nosleep.js";
export default {
name: "HomePage",
components: {},
data() {
return {
visuForm: false,
sp: {
punt: { home: 0, guest: 0 },
set: { home: 0, guest: 0 },
form: {
home: ["1", "2", "3", "4", "5", "6"],
guest: ["1", "2", "3", "4", "5", "6"],
},
},
}
},
mounted() {
if (this.isMobile()) {
var noSleep = new NoSleep();
noSleep.enable();
document.documentElement.requestFullscreen();
}
},
methods: {
closeApp() {
if (confirm("Confermi di voler chiudere l'app ?")) {
var win = window.open("", "_self");
win.close();
}
},
fullScreen() {
document.documentElement.requestFullscreen();
},
isMobile() {
if (
/Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(
navigator.userAgent
)
) {
return true;
} else {
return false;
}
},
resetta() {
if (confirm("Confermi il reset del punteggio ?")) {
this.sp.punt.home = 0;
this.sp.punt.guest = 0;
this.sp.form = {
home: ["1", "2", "3", "4", "5", "6"],
guest: ["1", "2", "3", "4", "5", "6"],
}
}
},
incPunt(team) {
this.sp.punt[team]++;
this.sp.form[team].push(this.sp.form[team].shift());
},
decPunt(team) {
// decrementa il punteggio se è > 0 e non siamo in
// visualizza formazioni.
if (this.sp.punt[team] > 0 && !this.visuForm) {
this.sp.punt[team]--;
this.sp.form[team].unshift(this.sp.form[team].pop());
}
}
}
};
</script>
<template>
<div class="campo">
<div class="hea home" @click="decPunt('home')">ANTONIANA
<span v-if="visuForm">- {{ sp.punt.home }}</span>
</div>
<div class="hea guest" @click="decPunt('guest')">GUEST
<span v-if="visuForm">- {{ sp.punt.guest }}</span>
</div>
<span v-if="visuForm">
<div class="col form home">
<div class="formdiv" v-for="x in [3, 2, 1, 4, 5, 0]">
{{ sp.form.home[x] }}
</div>
</div>
<div class="col form guest">
<div class="formdiv" v-for="x in [3, 2, 1, 4, 5, 0]">
{{ sp.form.guest[x] }}
</div>
</div>
</span>
<span v-if="!visuForm">
<div class="col punt home" @click="incPunt('home')">{{ sp.punt.home }}</div>
<div class="col punt guest" @click="incPunt('guest')">{{ sp.punt.guest }}</div>
</span>
<div class="bot tal">
<button @click="visuForm = !visuForm">
<span v-if="visuForm">PUNTEGGI</span>
<span v-if="!visuForm">FORMAZIONI</span>
</button>
<button @click="resetta">RESET</button>
<button v-if="isMobile()" @click="closeApp">exit</button>
</div>
</div>
</template>