Back to top button added
This commit is contained in:
parent
fe13c19a3b
commit
c0b6e35430
@ -11,7 +11,8 @@
|
||||
</head>
|
||||
<body>
|
||||
<noscript>
|
||||
<strong>Извините, данное приложение не работает без JavaScript.</strong>
|
||||
<strong>Извините, данное приложение не работает без JavaScript.</strong><br>
|
||||
<strong>You need JavaScript to run this application.</strong>
|
||||
</noscript>
|
||||
<div id="app"></div>
|
||||
<!-- built files will be auto injected -->
|
||||
|
||||
126
src/App.vue
126
src/App.vue
@ -155,18 +155,33 @@
|
||||
</v-list-tile>
|
||||
</v-list>
|
||||
</v-card>
|
||||
<v-fab-transition>
|
||||
<v-btn
|
||||
class="to-top-button"
|
||||
v-show="scrolled"
|
||||
color="blue"
|
||||
@click="scrollToTop"
|
||||
dark
|
||||
fixed
|
||||
bottom
|
||||
right
|
||||
fab
|
||||
>
|
||||
<v-icon>keyboard_arrow_up</v-icon>
|
||||
</v-btn>
|
||||
</v-fab-transition>
|
||||
<MessageDialog ref="MessageDialog" />
|
||||
</v-app>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import Authors from './components/Authors'
|
||||
import Books from './components/Books'
|
||||
import Book from './components/Book'
|
||||
import MessageDialog from './components/MessageDialog'
|
||||
import Authors from "./components/Authors"
|
||||
import Books from "./components/Books"
|
||||
import Book from "./components/Book"
|
||||
import MessageDialog from "./components/MessageDialog"
|
||||
|
||||
export default {
|
||||
name: 'App',
|
||||
name: "App",
|
||||
|
||||
components: {
|
||||
Authors,
|
||||
@ -179,56 +194,51 @@
|
||||
return {
|
||||
appNet: "CAINet",
|
||||
appName: "Аудиотека",
|
||||
|
||||
activeTab: null,
|
||||
autoBookmark: false,
|
||||
darkTheme: false,
|
||||
isLoading: false,
|
||||
isMounted: false,
|
||||
locale: { flag: 'ru', language: 'ru', title: 'Русский' },
|
||||
locale: { flag: "ru", language: "ru", title: "Русский" },
|
||||
locales: [
|
||||
{ flag: 'us', language: 'en', title: 'English' },
|
||||
{ flag: 'ru', language: 'ru', title: 'Русский' }
|
||||
{ flag: "us", language: "en", title: "English" },
|
||||
{ flag: "ru", language: "ru", title: "Русский" }
|
||||
],
|
||||
scrolled: false,
|
||||
volume: 5//,
|
||||
//locale: []
|
||||
}
|
||||
},
|
||||
|
||||
created () {
|
||||
window.addEventListener("scroll", this.onScroll);
|
||||
},
|
||||
|
||||
mounted () {
|
||||
this.isMounted = true;
|
||||
this.darkTheme = localStorage.darkTheme ? JSON.parse(localStorage.darkTheme) : false;
|
||||
this.autoBookmark = localStorage.autoBookmark ? JSON.parse(localStorage.autoBookmark) : false;
|
||||
this.volume = localStorage.volume ? JSON.parse(localStorage.volume) : 5;
|
||||
this.darkTheme = localStorage.darkTheme
|
||||
? JSON.parse(localStorage.darkTheme)
|
||||
: false;
|
||||
this.autoBookmark = localStorage.autoBookmark
|
||||
? JSON.parse(localStorage.autoBookmark)
|
||||
: false;
|
||||
this.volume = localStorage.volume
|
||||
? JSON.parse(localStorage.volume)
|
||||
: 5;
|
||||
|
||||
this.isLoading = true;
|
||||
|
||||
let userLocale = navigator.language || navigator.userLanguage;
|
||||
//let userLocale = navigator.language || navigator.userLanguage;
|
||||
|
||||
/*
|
||||
this.axios.get("locales/locales.json")
|
||||
.then(response => {
|
||||
let localeLoaded = false;
|
||||
response.data.forEach(element => {
|
||||
if (element.code == userLocale.toLowerCase()) {
|
||||
this.loadLocale(element.file);
|
||||
localeLoaded = true;
|
||||
}
|
||||
});
|
||||
if (!localeLoaded) { this.loadLocale("en"); }
|
||||
})
|
||||
.catch(error => {
|
||||
console.log(error);
|
||||
this.showMessage("Error", error);
|
||||
});
|
||||
*/
|
||||
this.axios.get("config.json")
|
||||
.then(response => {
|
||||
this.appNet = response.data.AppNet;
|
||||
this.appName = response.data.AppName;
|
||||
})
|
||||
.catch(error => {
|
||||
console.log(error);
|
||||
this.showMessage(this.$t("error"), error);
|
||||
console.error(error);
|
||||
});
|
||||
|
||||
this.axios.get("lib/authors.json")
|
||||
@ -237,50 +247,52 @@
|
||||
this.isLoading = false;
|
||||
})
|
||||
.catch(error => {
|
||||
console.log(error);
|
||||
this.showMessage(this.$t("error"), error);
|
||||
console.error(error);
|
||||
});
|
||||
},
|
||||
|
||||
destroyed () {
|
||||
window.removeEventListener("scroll", this.onScroll);
|
||||
},
|
||||
|
||||
computed: {
|
||||
authorName () {
|
||||
return !this.isMounted ? "" : this.$refs.Book.authorName;
|
||||
return this.isMounted ? this.$refs.Book.authorName : "";
|
||||
},
|
||||
|
||||
bookOpened () {
|
||||
return !this.isMounted ? false : this.$refs.Book.items.length > 0;
|
||||
return this.isMounted ? this.$refs.Book.items.length > 0 : false;
|
||||
},
|
||||
|
||||
bookTitle () {
|
||||
return !this.isMounted ? "" : this.$refs.Book.bookTitle;
|
||||
return this.isMounted ? this.$refs.Book.bookTitle : "";
|
||||
},
|
||||
|
||||
currentChapter () {
|
||||
let curChapter = !this.isMounted
|
||||
? ""
|
||||
: this.$refs.Book.items[this.$refs.Book.currentChapter];
|
||||
let curChapter = this.isMounted ? this.$refs.Book.items[this.$refs.Book.currentChapter] : "";
|
||||
return curChapter ? curChapter.title : "";
|
||||
},
|
||||
|
||||
currentTime () {
|
||||
return !this.isMounted ? "00:00" : this.$refs.Book.currentTime;
|
||||
return this.isMounted ? this.$refs.Book.currentTime : "00:00";
|
||||
},
|
||||
|
||||
duration () {
|
||||
return !this.isMounted ? "00:00" : this.$refs.Book.duration;
|
||||
return this.isMounted ? this.$refs.Book.duration : "00:00";
|
||||
},
|
||||
|
||||
isOff () {
|
||||
return !this.isMounted ? true : this.$refs.Book.isOff;
|
||||
return this.isMounted ? this.$refs.Book.isOff : true;
|
||||
},
|
||||
|
||||
isPlaying () {
|
||||
return !this.isMounted ? false : this.$refs.Book.isPlaying;
|
||||
return this.isMounted ? this.$refs.Book.isPlaying : false;
|
||||
},
|
||||
|
||||
progress: {
|
||||
get () {
|
||||
return !this.isMounted ? "" : this.$refs.Book.progress;
|
||||
return this.isMounted ? this.$refs.Book.progress : "";
|
||||
},
|
||||
|
||||
set (newVal) {
|
||||
@ -307,20 +319,13 @@
|
||||
return hash.toString(CryptoJS.enc.Hex);
|
||||
},
|
||||
|
||||
/*
|
||||
loadLocale (langFile) {
|
||||
this.axios.get("locales/" + langFile)
|
||||
.then(response => {
|
||||
this.locale = response.data;
|
||||
})
|
||||
.catch(error => {
|
||||
console.log(error);
|
||||
this.showMessage("Error", error);
|
||||
});
|
||||
nextChapter () {
|
||||
this.$refs.Book.nextChapter();
|
||||
},
|
||||
*/
|
||||
|
||||
nextChapter () { this.$refs.Book.nextChapter(); },
|
||||
onScroll () {
|
||||
this.scrolled = window.scrollY > 0;
|
||||
},
|
||||
|
||||
openBook (val) {
|
||||
this.$refs.Book.authorName = this.$refs.Books.authorName;
|
||||
@ -348,8 +353,8 @@
|
||||
})
|
||||
.catch(error => {
|
||||
this.isLoading = false;
|
||||
console.log(error);
|
||||
this.showMessage(this.$t("error"), error);
|
||||
console.error(error);
|
||||
});
|
||||
|
||||
this.activeTab = 2;
|
||||
@ -368,8 +373,8 @@
|
||||
})
|
||||
.catch(error => {
|
||||
this.isLoading = false;
|
||||
console.log(error);
|
||||
this.showMessage(this.$t("error"), error);
|
||||
console.error(error);
|
||||
});
|
||||
},
|
||||
|
||||
@ -392,6 +397,14 @@
|
||||
if (!silent) { this.showMessage(this.$t("information"), this.$t("bookmarkRemoved")); }
|
||||
},
|
||||
|
||||
scrollToTop () {
|
||||
window.scrollTo({
|
||||
top: 0,
|
||||
left: 0,
|
||||
behavior: "smooth"
|
||||
});
|
||||
},
|
||||
|
||||
setBookmark (silent = true) {
|
||||
if (this.$refs.Book.items.length == 0) { return; }
|
||||
|
||||
@ -466,4 +479,5 @@
|
||||
width: 100%;
|
||||
margin: 0 0 -25px 0;
|
||||
}
|
||||
.to-top-button { margin-bottom: 80px; }
|
||||
</style>
|
||||
|
||||
@ -48,9 +48,11 @@
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data: () => ({
|
||||
items: []
|
||||
}),
|
||||
data () {
|
||||
return {
|
||||
items: []
|
||||
}
|
||||
},
|
||||
|
||||
methods: {
|
||||
authorClick (val) { this.$emit("author_selected", val); }
|
||||
|
||||
@ -60,20 +60,22 @@
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data: () => ({
|
||||
audioElement: null,
|
||||
authorName: "",
|
||||
authorImg: "",
|
||||
bookImg: "",
|
||||
bookTitle: "",
|
||||
currentChapter: 0,
|
||||
currentTime: "00:00",
|
||||
duration: "00:00",
|
||||
items: [],
|
||||
progress: 0,
|
||||
status: 0, //this.statuses.stopped,
|
||||
volume: 5
|
||||
}),
|
||||
data () {
|
||||
return {
|
||||
audioElement: null,
|
||||
authorName: "",
|
||||
authorImg: "",
|
||||
bookImg: "",
|
||||
bookTitle: "",
|
||||
currentChapter: 0,
|
||||
currentTime: "00:00",
|
||||
duration: "00:00",
|
||||
items: [],
|
||||
progress: 0,
|
||||
status: 0, //this.statuses.stopped,
|
||||
volume: 5
|
||||
}
|
||||
},
|
||||
|
||||
computed: {
|
||||
isOff () {
|
||||
@ -94,7 +96,8 @@
|
||||
},
|
||||
|
||||
watch: {
|
||||
volume (val) { this.updateVolume(); }
|
||||
//volume (val) { this.updateVolume(); }
|
||||
volume () { this.updateVolume(); }
|
||||
},
|
||||
|
||||
methods: {
|
||||
|
||||
@ -67,11 +67,13 @@
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data: () => ({
|
||||
authorName: "",
|
||||
authorImg: "",
|
||||
items: []
|
||||
}),
|
||||
data () {
|
||||
return {
|
||||
authorName: "",
|
||||
authorImg: "",
|
||||
items: []
|
||||
}
|
||||
},
|
||||
|
||||
methods: {
|
||||
bookClick (val) {
|
||||
|
||||
24
src/main.js
24
src/main.js
@ -7,14 +7,14 @@
|
||||
* @version 0.9
|
||||
*/
|
||||
|
||||
import '@mdi/font/css/materialdesignicons.css'
|
||||
import Vue from 'vue'
|
||||
import Axios from 'axios'
|
||||
import VueAxios from 'vue-axios'
|
||||
import './plugins/vuetify'
|
||||
import i18n from '@/plugins/i18n';
|
||||
import App from './App.vue'
|
||||
import './registerServiceWorker'
|
||||
import "@mdi/font/css/materialdesignicons.css"
|
||||
import Vue from "vue"
|
||||
import Axios from "axios"
|
||||
import VueAxios from "vue-axios"
|
||||
import "./plugins/vuetify"
|
||||
import i18n from "@/plugins/i18n";
|
||||
import App from "./App.vue"
|
||||
import "./registerServiceWorker"
|
||||
|
||||
Vue.config.productionTip = false
|
||||
|
||||
@ -24,12 +24,12 @@ Vue.use(VueAxios, Axios)
|
||||
* Audioplayer statuses
|
||||
*/
|
||||
Vue.prototype.statuses = {
|
||||
'stopped': 0,
|
||||
'paused': 1,
|
||||
'playing': 2
|
||||
"stopped": 0,
|
||||
"paused": 1,
|
||||
"playing": 2
|
||||
};
|
||||
|
||||
new Vue({
|
||||
i18n,
|
||||
render: h => h(App),
|
||||
}).$mount('#app')
|
||||
}).$mount("#app")
|
||||
|
||||
@ -1,5 +1,5 @@
|
||||
import Vue from 'vue'
|
||||
import VueI18n from 'vue-i18n'
|
||||
import Vue from "vue"
|
||||
import VueI18n from "vue-i18n"
|
||||
|
||||
Vue.use(VueI18n)
|
||||
|
||||
|
||||
@ -1,7 +1,7 @@
|
||||
import Vue from 'vue'
|
||||
import Vuetify from 'vuetify/lib'
|
||||
import 'vuetify/src/stylus/app.styl'
|
||||
import Vue from "vue"
|
||||
import Vuetify from "vuetify/lib"
|
||||
import "vuetify/src/stylus/app.styl"
|
||||
|
||||
Vue.use(Vuetify, {
|
||||
iconfont: 'md',
|
||||
iconfont: "md",
|
||||
})
|
||||
|
||||
@ -1,32 +1,32 @@
|
||||
/* eslint-disable no-console */
|
||||
|
||||
import { register } from 'register-service-worker'
|
||||
import { register } from "register-service-worker"
|
||||
|
||||
if (process.env.NODE_ENV === 'production') {
|
||||
register(`${process.env.BASE_URL}service-worker.js`, {
|
||||
ready () {
|
||||
console.log(
|
||||
'App is being served from cache by a service worker.\n' +
|
||||
'For more details, visit https://goo.gl/AFskqB'
|
||||
)
|
||||
},
|
||||
registered () {
|
||||
console.log('Service worker has been registered.')
|
||||
},
|
||||
cached () {
|
||||
console.log('Content has been cached for offline use.')
|
||||
},
|
||||
updatefound () {
|
||||
console.log('New content is downloading.')
|
||||
},
|
||||
updated () {
|
||||
console.log('New content is available; please refresh.')
|
||||
},
|
||||
offline () {
|
||||
console.log('No internet connection found. App is running in offline mode.')
|
||||
},
|
||||
error (error) {
|
||||
console.error('Error during service worker registration:', error)
|
||||
}
|
||||
})
|
||||
if (process.env.NODE_ENV === "production") {
|
||||
register(`${process.env.BASE_URL}service-worker.js`, {
|
||||
ready () {
|
||||
console.log(
|
||||
"App is being served from cache by a service worker.\n" +
|
||||
"For more details, visit https://goo.gl/AFskqB"
|
||||
)
|
||||
},
|
||||
registered () {
|
||||
console.log("Service worker has been registered.")
|
||||
},
|
||||
cached () {
|
||||
console.log("Content has been cached for offline use.")
|
||||
},
|
||||
updatefound () {
|
||||
console.log("New content is downloading.")
|
||||
},
|
||||
updated () {
|
||||
console.log("New content is available; please refresh.")
|
||||
},
|
||||
offline () {
|
||||
console.log("No internet connection found. App is running in offline mode.")
|
||||
},
|
||||
error (error) {
|
||||
console.error("Error during service worker registration:", error)
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user