nicoeri/filebrowser
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: add a audio player function in shared folder

Browse Source
This commit is contained in:
niubility000 2024-03-22 22:52:59 +08:00 committed by GitHub
parent fa00ce8872
commit ff5f9ff32d
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
1 changed files with 0 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
frontend/src/views/Share.vue
View File

@ -163,7 +163,6 @@
justify-content: space-between;" justify-content: space-between;"
> >
<p style="margin: 0.5em; height: 3em;">{{req.items[this.selected[0]].name}}</p> <p style="margin: 0.5em; height: 3em;">{{req.items[this.selected[0]].name}}</p>
<div style="height:4em; width:100%; position:relative;"> <div style="height:4em; width:100%; position:relative;">
<button @click="play" v-if="!this.tag" style="fontSize:4em !important; left:0; right:0; margin=auto; border:0px; background: white;" class="material-icons">play_circle_filled</button> <button @click="play" v-if="!this.tag" style="fontSize:4em !important; left:0; right:0; margin=auto; border:0px; background: white;" class="material-icons">play_circle_filled</button>
<button @click="play" v-if="this.tag" style="fontSize:4em !important; left:0; right:0; margin=auto; border:0px; background: white;" class="material-icons">pause_circle_filled</button> <button @click="play" v-if="this.tag" style="fontSize:4em !important; left:0; right:0; margin=auto; border:0px; background: white;" class="material-icons">pause_circle_filled</button>
@ -173,16 +172,12 @@
flex-direction: row; flex-direction: row;
justify-content: space-between;" justify-content: space-between;"
> >
<button @click="switchMusic(-1)" style="fontSize:2em !important; border:0px; background: white;" class="material-icons">fast_rewind</button> <button @click="switchMusic(-1)" style="fontSize:2em !important; border:0px; background: white;" class="material-icons">fast_rewind</button>
<button @click="switchLoopMode" v-if="this.loopMode == 'once'" style="fontSize:2em !important; border:0px;outline:none; background: white; " class="material-icons">skip_next</button> <button @click="switchLoopMode" v-if="this.loopMode == 'once'" style="fontSize:2em !important; border:0px;outline:none; background: white; " class="material-icons">skip_next</button>
<button @click="switchLoopMode" v-if="this.loopMode == 'singleLoop'" style="fontSize:2em !important; background: white;" class="material-icons">repeat_one</button> <button @click="switchLoopMode" v-if="this.loopMode == 'singleLoop'" style="fontSize:2em !important; background: white;" class="material-icons">repeat_one</button>
<button @click="switchLoopMode" v-if="this.loopMode == 'listLoop'" style="fontSize:2em !important; background: white; " class="material-icons">repeat</button> <button @click="switchLoopMode" v-if="this.loopMode == 'listLoop'" style="fontSize:2em !important; background: white; " class="material-icons">repeat</button>
<button @click="switchMusic(1)" style="fontSize:2em !important; border:0px; background: white;" class="material-icons">fast_forward</button> <button @click="switchMusic(1)" style="fontSize:2em !important; border:0px; background: white;" class="material-icons">fast_forward</button>
</div> </div>
<audio id="myaudio" <audio id="myaudio"
:src="raw" :src="raw"
:autoplay="tag" :autoplay="tag"
@ -238,7 +233,6 @@
</item> </item>
<div <div
:class="{ active: $store.state.multiple }" :class="{ active: $store.state.multiple }"
id="multiple-selection" id="multiple-selection"
@ -276,7 +270,6 @@ import { mapState, mapMutations, mapGetters } from "vuex";
import { pub as api } from "@/api"; import { pub as api } from "@/api";
import { filesize } from "@/utils"; import { filesize } from "@/utils";
import moment from "moment/min/moment-with-locales"; import moment from "moment/min/moment-with-locales";
import HeaderBar from "@/components/header/HeaderBar.vue"; import HeaderBar from "@/components/header/HeaderBar.vue";
import Action from "@/components/header/Action.vue"; import Action from "@/components/header/Action.vue";
import Breadcrumbs from "@/components/Breadcrumbs.vue"; import Breadcrumbs from "@/components/Breadcrumbs.vue";
@ -307,7 +300,6 @@ export default {
}), }),
watch: { watch: {
$route: function () { $route: function () {
this.fetchData(); this.fetchData();
}, },
}, },
@ -402,13 +394,11 @@ export default {
} else { } else {
this.loopMode = "once"; this.loopMode = "once";
} }
console.log(this.loopMode);
}, },
playEnd() { playEnd() {
if (this.loopMode == "singleLoop") document.getElementById('myaudio').play(); if (this.loopMode == "singleLoop") document.getElementById('myaudio').play();
if (this.loopMode == "listLoop") this.switchMusic(1); if (this.loopMode == "listLoop") this.switchMusic(1);
}, },
fetchData: async function () { fetchData: async function () {
// Reset view information. // Reset view information.
this.$store.commit("setReload", false); this.$store.commit("setReload", false);