Fix
[vchess.git] / client / src / views / MyGames.vue
CommitLineData
afd3240d
BA
1<template lang="pug">
2main
3 .row
4 .col-sm-12.col-md-10.col-md-offset-1.col-lg-8.col-lg-offset-2
5 .button-group
910d631b
BA
6 button.tabbtn#liveGames(@click="setDisplay('live',$event)")
7 | {{ st.tr["Live games"] }}
8 button.tabbtn#corrGames(@click="setDisplay('corr',$event)")
9 | {{ st.tr["Correspondance games"] }}
10 GameList(
11 v-show="display=='live'"
12 :games="liveGames"
13 @show-game="showGame"
14 )
15 GameList(
16 v-show="display=='corr'"
17 :games="corrGames"
18 @show-game="showGame"
19 )
afd3240d
BA
20</template>
21
22<script>
afd3240d
BA
23import { store } from "@/store";
24import { GameStorage } from "@/utils/gameStorage";
25import { ajax } from "@/utils/ajax";
26import GameList from "@/components/GameList.vue";
27export default {
89021f18 28 name: "my-my-games",
afd3240d 29 components: {
6808d7a1 30 GameList
afd3240d
BA
31 },
32 data: function() {
33 return {
34 st: store.state,
dac39588 35 display: "live",
2f258c37 36 liveGames: [],
6808d7a1 37 corrGames: []
afd3240d
BA
38 };
39 },
40 created: function() {
6808d7a1
BA
41 GameStorage.getAll(localGames => {
42 localGames.forEach(g => (g.type = this.classifyObject(g)));
2f258c37 43 this.liveGames = localGames;
afd3240d 44 });
6808d7a1
BA
45 if (this.st.user.id > 0) {
46 ajax("/games", "GET", { uid: this.st.user.id }, res => {
47 res.games.forEach(g => (g.type = this.classifyObject(g)));
2f258c37 48 this.corrGames = res.games;
afd3240d
BA
49 });
50 }
51 },
2f258c37
BA
52 mounted: function() {
53 const showType = localStorage.getItem("type-myGames") || "live";
54 this.setDisplay(showType);
55 },
afd3240d 56 methods: {
2f258c37
BA
57 setDisplay: function(type, e) {
58 this.display = type;
59 localStorage.setItem("type-myGames", type);
6808d7a1 60 let elt = e ? e.target : document.getElementById(type + "Games");
2f258c37 61 elt.classList.add("active");
6808d7a1 62 if (elt.previousElementSibling)
2f258c37 63 elt.previousElementSibling.classList.remove("active");
6808d7a1 64 else elt.nextElementSibling.classList.remove("active");
2f258c37
BA
65 },
66 // TODO: classifyObject is redundant (see Hall.vue)
afd3240d 67 classifyObject: function(o) {
6808d7a1 68 return o.cadence.indexOf("d") === -1 ? "live" : "corr";
afd3240d 69 },
afd3240d 70 showGame: function(g) {
afd3240d 71 this.$router.push("/game/" + g.id);
6808d7a1
BA
72 }
73 }
afd3240d
BA
74};
75</script>
2f258c37 76
e2590fa8 77<style lang="sass">
2f258c37
BA
78.active
79 color: #42a983
5fe7e71c
BA
80
81.tabbtn
82 background-color: #f9faee
e2590fa8
BA
83
84table.game-list
85 max-height: 100%
2f258c37 86</style>