Last played books saving added

Last played books saving added
This commit is contained in:
Alexander I. Chebykin 2022-04-20 01:22:10 +03:00
parent 67dff194d2
commit 7efae6315c
8 changed files with 147 additions and 59 deletions

View File

@ -49,9 +49,12 @@
@bookSelected="loadBook"
@loadChapter="loadChapter"
>
<transition name="fade">
<!--
<transition name="scroll-x-transition">
<component :is="Component"/>
</transition>
-->
<component :is="Component"/>
</router-view>
<v-alert
prominent
@ -224,6 +227,13 @@
alertType: "info",
alertMessage: "",
loading: {
authors: false,
books: false,
book: false,
wiki: false,
},
authors: [],
audioElement: null,
@ -254,6 +264,10 @@
localStorage.autoBookmark = val;
},
"$store.getters.autoLoadBooks" (val) {
localStorage.autoLoadBooks = val;
},
"$store.getters.darkTheme" (val) {
this.setTheme(val == true ? "dark" : "light");
localStorage.darkTheme = val;
@ -313,7 +327,7 @@
},
showProgress () {
return false;
return this.loading.authors || this.loading.books || this.loading.book || this.loading.wiki;
}
},
@ -321,6 +335,9 @@
let autoBookmark = localStorage.autoBookmark ? JSON.parse(localStorage.autoBookmark) : false;
this.$store.commit("setAutoBookmark", autoBookmark);
let autoLoadBooks = localStorage.autoLoadBooks ? JSON.parse(localStorage.autoLoadBooks) : false;
this.$store.commit("setAutoLoadBooks", autoLoadBooks);
let darkTheme = localStorage.darkTheme ? JSON.parse(localStorage.darkTheme) : false;
this.$store.commit("setDarkTheme", darkTheme);
@ -351,6 +368,8 @@
methods: {
fillWikiInfo (searchText, fillAuthorInfo = true) {
this.loading.wiki = true;
this.axios.get(`https://${this.$i18n.locale}.wikipedia.org/w/api.php`, {
params: {
format: "json",
@ -388,9 +407,11 @@
this.$store.commit("setBook", bookInfo);
}
}
this.loading.wiki = false;
})
.catch(error => {
this.isLoading = false;
this.loading.wiki = false;
if (fillAuthorInfo) {
let authorInfo = this.$store.getters.author;
@ -414,23 +435,48 @@
},
loadAuthors () {
this.loading.authors = true;
this.axios.get(`lib/authors.json?r=${Math.random()}`)
.then(response => {
this.$store.commit("setAuthors", response.data);
this.isLoading = false;
let lastAuthorHash = localStorage.lastAuthor ? localStorage.lastAuthor : null;
let authors = [];
let authorToLoad = null;
response.data.forEach(author => {
let authorExt = author;
authorExt.hash = this.getHash(JSON.stringify({
author: authorExt.author,
books: authorExt.books
}));
authors.push(authorExt);
if (lastAuthorHash !== null && lastAuthorHash == authorExt.hash) {
authorToLoad = { ...authorExt };
}
});
this.$store.commit("setAuthors", authors);
if (authorToLoad !== null && this.$store.getters.autoLoadBooks) {
this.loadBooks(authorToLoad);
}
this.loading.authors = false;
})
.catch(error => {
this.showMessage(this.$t("error"), error);
console.error(error);
this.loading.authors = false;
})
},
/**
* Load book data
*
* @param {object} bookData Book data
* @param {object} bookData Book data
* @param {boolean} switchToTab Switch to Book tab after data loading
*/
loadBook (bookData) {
loadBook (bookData, switchToTab = false) {
if (this.audioElement !== null && this.$store.getters.autoBookmark) {
this.setBookmark();
}
@ -448,10 +494,11 @@
reader: bookData.reader !== undefined && bookData.reader.trim() !== ""
? bookData.reader
: "",
hash: bookData.hash,
wiki: ""
});
this.isLoading = true;
this.loading.book = true;
this.axios.get(`${bookData.book}?r=${Math.random()}`)
.then(response => {
@ -473,11 +520,15 @@
}
this.backgroundImage = bookData.image;
this.$router.push({ path: "/book" });
this.isLoading = false;
if (switchToTab) {
this.$router.push({ path: "/book" });
}
this.loading.book = false;
})
.catch(error => {
this.isLoading = false;
this.loading.book = false;
this.showMessage(this.$t("error"), error);
console.error(error);
@ -487,14 +538,16 @@
/**
* Load books data
*
* @param {object} authorData Author data
* @param {object} authorData Author data
* @param {boolean} switchToTab Switch to Books tab after data loading
*/
loadBooks (authorData) {
this.isLoading = true;
loadBooks (authorData, switchToTab = false) {
this.loading.books = true;
this.axios.get(`${authorData.books}?r=${Math.random()}`)
.then(response => {
let books = {};
let bookToLoad = null;
response.data.forEach((book) => {
let cycle = book.cycle !== undefined ? book.cycle : "no_cycle";
@ -503,12 +556,22 @@
books[cycle] = [];
}
books[cycle].push(book);
let bookExt = { ...book };
bookExt.hash = this.getHash(JSON.stringify({
book: bookExt.book,
}));
books[cycle].push(bookExt);
if (localStorage[authorData.hash] && localStorage[authorData.hash] == bookExt.hash) {
bookToLoad = { ...bookExt };
}
});
this.$store.commit("setAuthor", {
name: authorData.author || "",
image: authorData.image || "",
hash: authorData.hash || "",
wiki: ""
});
@ -516,12 +579,18 @@
if (this.useWikipedia) { this.fillWikiInfo(authorData.author); }
this.$router.push({ path: "/books" });
if (bookToLoad !== null && this.$store.getters.autoLoadBooks) {
this.loadBook(bookToLoad);
}
this.isLoading = false;
if (switchToTab) {
this.$router.push({ path: "/books" });
}
this.loading.books = false;
})
.catch(error => {
this.isLoading = false;
this.loading.books = false;
this.showMessage(this.$t("error"), error);
console.error(error);
@ -562,7 +631,7 @@
component.audioElement.removeEventListener("canplay", _listener, true);
}, true);
if (autoplay) this.play();
if (autoplay) { this.play(); }
},
loadNextChapter (autoplay = true) {
@ -593,6 +662,8 @@
play () {
this.status = this.statuses.playing;
this.audioElement.play();
localStorage.lastAuthor = this.$store.getters.author.hash;
localStorage[this.$store.getters.author.hash] = this.$store.getters.book.hash;
},
prevChapter () {
@ -606,7 +677,7 @@
if (this.$store.getters.chapters.length == 0) { return; }
let data = {
chapter: this.$store.getters.curChapter,
chapter: this.$store.getters.curChapter,
progress: this.currentProgress
};

View File

@ -17,6 +17,7 @@
>
<v-card
hover
ripple
outlined
tile
height="127"
@ -66,7 +67,7 @@
methods: {
authorClick (author) {
this.$emit("authorSelected", author);
this.$emit("authorSelected", author, true);
}
}
}

View File

@ -155,7 +155,7 @@
methods: {
bookClick (book) {
this.$emit("bookSelected", book);
this.$emit("bookSelected", book, true);
}
}
}

View File

@ -21,11 +21,19 @@
v-model="darkTheme"
color="blue"
:label="$t('darkTheme')"
class="ml-3"
></v-switch>
<v-switch
v-model="autoBookmark"
color="blue"
:label="$t('autoBookmarks')"
class="ml-3"
></v-switch>
<v-switch
v-model="autoLoadBooks"
color="blue"
:label="$t('autoLoadBooks')"
class="ml-3"
></v-switch>
<div class="mb-7 text-caption">{{ $t("playbackRate") }}</div>
<v-slider
@ -59,7 +67,7 @@
</v-card-text>
<v-card-actions>
<v-spacer></v-spacer>
<v-btn color="primary" flat @click="dialog = false">Ok</v-btn>
<v-btn flat variant="outlined" color="info" @click="dialog = false">Ok</v-btn>
</v-card-actions>
</v-card>
</v-dialog>
@ -70,21 +78,23 @@
export default {
data () {
return {
dialog: false,
activeTab: 0,
autoBookmark: false,
darkTheme: false,
locale: "en",
playbackRate: 1,
dialog: false,
activeTab: 0,
autoBookmark: false,
autoLoadBooks: false,
darkTheme: false,
locale: "en",
playbackRate: 1,
}
},
watch: {
dialog (val) {
if (val) {
this.autoBookmark = this.$store.getters.autoBookmark;
this.darkTheme = this.$store.getters.darkTheme;
this.playbackRate = this.$store.getters.playbackRate;
this.autoBookmark = this.$store.getters.autoBookmark;
this.autoLoadBooks = this.$store.getters.autoLoadBooks;
this.darkTheme = this.$store.getters.darkTheme;
this.playbackRate = this.$store.getters.playbackRate;
let userLocale = navigator.language || navigator.userLanguage;
userLocale = userLocale.indexOf("-") > 0
@ -95,9 +105,10 @@
}
},
autoBookmark (val) { this.$store.commit("setAutoBookmark", val); },
darkTheme (val) { this.$store.commit("setDarkTheme", val); },
playbackRate (val) { this.$store.commit("setPlaybackRate", val); }
autoBookmark (val) { this.$store.commit("setAutoBookmark", val); },
autoLoadBooks (val) { this.$store.commit("setAutoLoadBooks", val); },
darkTheme (val) { this.$store.commit("setDarkTheme", val); },
playbackRate (val) { this.$store.commit("setPlaybackRate", val); }
}
}
</script>

View File

@ -3,6 +3,7 @@ const messages = {
about: "About",
authors: "Authors",
autoBookmarks: "Auto-bookmarks",
autoLoadBooks: "Auto-load last opened books",
book: "Books",
bookmarkSaved: "Bookmark saved",
books: "Book",

View File

@ -3,6 +3,7 @@ const messages = {
about: "О программе",
authors: "Авторы",
autoBookmarks: "Автозакладки",
autoLoadBooks: "Автоматически загружать последние открытые книги",
book: "Книга",
bookmarkSaved: "Закладка сохранена",
books: "Книги",

View File

@ -11,6 +11,7 @@ const store = createStore({
},
authors: [],
autoBookmark: false,
autoLoadBooks: false,
book: {
author: "",
photo: "",
@ -27,27 +28,29 @@ const store = createStore({
},
getters: {
author: state => { return state.author; },
authors: state => { return state.authors; },
autoBookmark: state => { return state.autoBookmark; },
book: state => { return state.book; },
books: state => { return state.books; },
chapters: state => { return state.chapters },
curChapter: state => { return state.curChapter },
darkTheme: state => { return state.darkTheme },
playbackRate: state => { return state.playbackRate },
author: state => { return state.author; },
authors: state => { return state.authors; },
autoBookmark: state => { return state.autoBookmark; },
autoLoadBooks: state => { return state.autoLoadBooks; },
book: state => { return state.book; },
books: state => { return state.books; },
chapters: state => { return state.chapters },
curChapter: state => { return state.curChapter },
darkTheme: state => { return state.darkTheme },
playbackRate: state => { return state.playbackRate },
},
mutations: {
setAuthor (state, payload) { state.author = payload; },
setAuthors (state, payload) { state.authors = payload; },
setAutoBookmark (state, payload) { state.autoBookmark = payload; },
setBook (state, payload) { state.book = payload; },
setBooks (state, payload) { state.books = payload; },
setChapters (state, payload) { state.chapters = payload; },
setCurChapter (state, payload) { state.curChapter = payload; },
setDarkTheme (state, payload) { state.darkTheme = payload; },
setPlaybackRate (state, payload) { state.playbackRate = payload; },
setAuthor (state, payload) { state.author = payload; },
setAuthors (state, payload) { state.authors = payload; },
setAutoBookmark (state, payload) { state.autoBookmark = payload; },
setAutoLoadBooks (state, payload) { state.autoLoadBooks = payload; },
setBook (state, payload) { state.book = payload; },
setBooks (state, payload) { state.books = payload; },
setChapters (state, payload) { state.chapters = payload; },
setCurChapter (state, payload) { state.curChapter = payload; },
setDarkTheme (state, payload) { state.darkTheme = payload; },
setPlaybackRate (state, payload) { state.playbackRate = payload; },
}
});

View File

@ -5191,9 +5191,9 @@ sass-loader@^10.0.0:
semver "^7.3.2"
sass@^1.50.0:
version "1.50.0"
resolved "https://registry.yarnpkg.com/sass/-/sass-1.50.0.tgz#3e407e2ebc53b12f1e35ce45efb226ea6063c7c8"
integrity sha512-cLsD6MEZ5URXHStxApajEh7gW189kkjn4Rc8DQweMyF+o5HF5nfEz8QYLMlPsTOD88DknatTmBWkOcw5/LnJLQ==
version "1.50.1"
resolved "https://registry.yarnpkg.com/sass/-/sass-1.50.1.tgz#e9b078a1748863013c4712d2466ce8ca4e4ed292"
integrity sha512-noTnY41KnlW2A9P8sdwESpDmo+KBNkukI1i8+hOK3footBUcohNHtdOJbckp46XO95nuvcHDDZ+4tmOnpK3hjw==
dependencies:
chokidar ">=3.0.0 <4.0.0"
immutable "^4.0.0"
@ -5942,9 +5942,9 @@ vuetify-loader@^2.0.0-alpha.0:
upath "^2.0.1"
"vuetify@npm:@vuetify/nightly@next":
version "3.0.0-next-20220416.0"
resolved "https://registry.yarnpkg.com/@vuetify/nightly/-/nightly-3.0.0-next-20220416.0.tgz#d3be97e6130900647b51ca924ae60b0812a9b5d2"
integrity sha512-3jgtwcZXmrCeR1gcLyL2jvUnZftc9RyaXHdQpXQhmlFazYEtSymsRoD8RAEv2P2GeVGKVKkR7KfBrVhUBEgaSg==
version "3.0.0-next-20220419.0"
resolved "https://registry.yarnpkg.com/@vuetify/nightly/-/nightly-3.0.0-next-20220419.0.tgz#4ad519eb61721f89b734a4c334a45b40b665ebbb"
integrity sha512-BqgKBxmgtOyA4LByRIQIpSfYyM5GQq2I3+hjkrP2NbZ0n1rSDlov4YRmauqLzII9ys0Lxi0HXwu7dXLEHJkHBQ==
vuex@^4.0.2:
version "4.0.2"