diff --git a/src/components/Infos.vue b/src/components/Infos.vue
index 4bbc98f..b63c11b 100644
--- a/src/components/Infos.vue
+++ b/src/components/Infos.vue
@@ -18,7 +18,7 @@
Total todo: {{ this.nbItemsFinished }}
- Total sessions: {{ this.$store.getters.nbSessions }}
+ Total sessions: {{ this.nbSessions }}
+
+
(from last session)
+
+
@@ -134,6 +140,9 @@ export default {
console.log(error);
});
},
+ resetStats() {
+ this.$store.commit('resetStats');
+ },
},
mounted() {
this.generateDateOfTheDay();
@@ -141,15 +150,15 @@ export default {
this.getNewWordEveryday();
},
computed: {
- itemsFinished() {
- return this.$store.getters.itemsFinished;
- },
nbItemsFinished() {
- return this.$store.getters.itemsFinished.length;
+ return parseInt(this.$store.getters.globalState.nbItemsFinished) + this.$store.getters.itemsFinished.length
},
colorSelected() {
return this.$store.getters.colorSelected;
},
+ nbSessions() {
+ return parseInt(this.$store.getters.globalState.nbSessions) + this.$store.getters.nbSessions
+ }
},
watch: {
colorSelected: function(color) {
@@ -216,10 +225,19 @@ export default {
text-align: center;
}
-#see-words {
+#hint {
+ font-size: 18px;
+ font-weight: lighter;
+}
+
+#reset {
margin-top: 16px;
}
+#see-words {
+ margin-top: 8px;
+}
+
/* ********** */
/* RESPONSIVE */
/* ********** */
diff --git a/src/components/Pomodoro.vue b/src/components/Pomodoro.vue
index 82e9f5b..59a6a64 100644
--- a/src/components/Pomodoro.vue
+++ b/src/components/Pomodoro.vue
@@ -136,6 +136,7 @@ export default {
alert("SESSION TERMINΓE π");
this.nbSessionsFinished++;
this.$store.commit("updateNbSessionsFinished");
+ localStorage.setItem("nbSessions", this.$store.getters.nbSessions);
if (this.nbSessionsFinished === 4) {
this.setupPauseTimer(LONG_PAUSE);
this.nbSessionsFinished = 0;
diff --git a/src/components/Settings.vue b/src/components/Settings.vue
index fbae9bd..8fd9992 100644
--- a/src/components/Settings.vue
+++ b/src/components/Settings.vue
@@ -2,7 +2,7 @@
@@ -30,6 +30,7 @@ export default {
event.target.style.borderColor = this.activeColor;
document.body.style.backgroundColor = color;
this.$store.commit("setColorSelected", color);
+ localStorage.setItem("themeColor", this.$store.getters.colorSelected)
},
removeActiveColorFromPalette() {
const palette = document.querySelectorAll(".bubble-item");
@@ -38,9 +39,9 @@ export default {
}
},
setFirstColor() {
- // get first div of color-palette
- const palette = document.querySelectorAll(".bubble-item");
- palette[0].style.borderColor = this.activeColor;
+ const color = this.$store.getters.globalState.themeColor;
+ document.getElementById(color).style.borderColor = this.activeColor;
+ document.body.style.backgroundColor = color;
}
},
mounted() {
diff --git a/src/components/ToDoList.vue b/src/components/ToDoList.vue
index 7118f13..2b8688f 100644
--- a/src/components/ToDoList.vue
+++ b/src/components/ToDoList.vue
@@ -32,7 +32,7 @@ export default {
data() {
return {
item: "",
- items: []
+ items: JSON.parse(this.$store.getters.globalState.currentItems)
}
},
methods: {
@@ -47,6 +47,7 @@ export default {
}
this.sortArrayPinnedElements()
this.clearItem()
+ this.saveCurrentItems()
},
removeItem(item) {
this.items = this.items.filter(e =>
@@ -54,6 +55,8 @@ export default {
)
this.$store.commit("addItemFinished", item);
this.clearItem()
+ this.saveCurrentItems()
+ localStorage.setItem("nbItemsFinished", this.$store.getters.itemsFinished.length);
},
clearItem() {
this.item = ""
@@ -69,6 +72,7 @@ export default {
list.scrollTo({top: 0, behavior: 'smooth'});
}
this.sortArrayPinnedElements()
+ this.saveCurrentItems()
}
},
sortArrayPinnedElements() {
@@ -81,6 +85,9 @@ export default {
return 0
}
})
+ },
+ saveCurrentItems(){
+ localStorage.setItem("currentItems", JSON.stringify(this.items));
}
}
}
diff --git a/src/components/YtbPlayer.vue b/src/components/YtbPlayer.vue
index 08883db..a28a892 100644
--- a/src/components/YtbPlayer.vue
+++ b/src/components/YtbPlayer.vue
@@ -30,7 +30,7 @@ export default {
livesId: [],
easterEggs: [],
easterEggsSongsId: -1,
- songId: 0,
+ songId: this.$store.getters.globalState.currentSongIndex,
muted: true
}
},
@@ -42,11 +42,13 @@ export default {
},
nextPlaylist() {
this.songId++ === this.livesId.length - 1 ? this.songId = 0 : this.songId;
+ localStorage.setItem("currentSongIndex", this.songId);
let id = this.livesId[this.songId];
this.loadVideoFromApi(id)
},
prevPlaylist() {
--this.songId === -1 ? this.songId = this.livesId.length - 1 : this.songId;
+ localStorage.setItem("currentSongIndex", this.songId);
let id = this.livesId[this.songId];
this.loadVideoFromApi(id)
},
@@ -73,13 +75,17 @@ export default {
this.muted = !this.muted;
},
loadVideoFromApi(id) {
+ this.saveLocalStorage(id);
player.loadVideoById(id);
},
+ saveLocalStorage(id) {
+ localStorage.setItem("lastSong", id);
+ },
loadApi() {
window.onYouTubeIframeAPIReady = () => {
// eslint-disable-next-line no-unused-vars
player = new window.YT.Player("player", {
- videoId: "XDh0JcxrbPM",
+ videoId: this.$store.getters.globalState.lastSong,
playerVars: {
'autoplay': 1,
'mute': 1,
diff --git a/src/store/index.js b/src/store/index.js
index bcf28cb..a18ec75 100644
--- a/src/store/index.js
+++ b/src/store/index.js
@@ -8,7 +8,15 @@ export default new Vuex.Store({
state: {
itemsFinished: [],
colorSelected: "",
- nbSessions: 0
+ nbSessions: 0,
+ globalState: {
+ currentItems: localStorage.getItem("currentItems") ? localStorage.getItem("currentItems") : JSON.stringify([]),
+ nbItemsFinished: localStorage.getItem("nbItemsFinished") ? localStorage.getItem("nbItemsFinished") : 0,
+ nbSessions: localStorage.getItem("nbSessions") ? localStorage.getItem("nbSessions") : 0,
+ lastSong: localStorage.getItem("lastSong") ? localStorage.getItem("lastSong") : "XDh0JcxrbPM",
+ currentSongIndex: localStorage.getItem("currentSongIndex") ? localStorage.getItem("currentSongIndex") : 0,
+ themeColor: localStorage.getItem("themeColor") ? localStorage.getItem("themeColor") : "#fdde95",
+ }
},
getters: {
itemsFinished(state) {
@@ -19,6 +27,9 @@ export default new Vuex.Store({
},
nbSessions(state) {
return state.nbSessions;
+ },
+ globalState(state) {
+ return state.globalState;
}
},
mutations: {
@@ -30,6 +41,10 @@ export default new Vuex.Store({
},
updateNbSessionsFinished(state) {
state.nbSessions++;
+ },
+ resetStats(state) {
+ state.globalState.nbItemsFinished = 0;
+ state.globalState.nbSessions = 0;
}
},
actions: {