f6c50954f0
per adesso permette solo di aggiungere e togliere punti. tiene conto delle formazioni ma non le fisualizza. il fullscreen e il landscape devono essere fatti manualmente sto guardando come poterlo fare con PWA o javascript.
77 lines
1.8 KiB
Vue
77 lines
1.8 KiB
Vue
<script>
|
|
import NoSleep from "nosleep.js";
|
|
export default {
|
|
name: "HomePage",
|
|
components: {},
|
|
data() {
|
|
return {
|
|
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();
|
|
}
|
|
},
|
|
methods: {
|
|
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) {
|
|
if (this.sp.punt[team] > 0) {
|
|
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')">HOME</div>
|
|
<div class="hea guest" @click="decPunt('guest')">GUEST</div>
|
|
<div class="col home" @click="incPunt('home')">{{ sp.punt.home }}</div>
|
|
<div class="col guest" @click="incPunt('guest')">{{ sp.punt.guest }}</div>
|
|
<div class="bot tal">
|
|
<button @click="fullScreen">Fullscreen</button>
|
|
</div>
|
|
<div class="bot tar">
|
|
<button @click="resetta">RESET</button>
|
|
</div>
|
|
</div>
|
|
</template>
|