Mirrors/koel
2
0
Fork 0
mirror of https://github.com/koel/koel synced 2025-02-26 04:07:18 +00:00
Code Issues Projects Releases Packages Wiki Activity

Close menu with clickaway

Browse source
This commit is contained in:
An Phan 2016-02-19 15:20:34 +08:00
parent eafa856b02
commit 640d8fc8dc
8 changed files with 64 additions and 61 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

1
package.json
View file

@ -39,6 +39,7 @@
"rangeslider.js": "^2.1.1", "rangeslider.js": "^2.1.1",
"sinon": "^1.17.2", "sinon": "^1.17.2",
"vue": "^1.0.16", "vue": "^1.0.16",
"vue-clickaway": "^1.1.1",
"vue-hot-reload-api": "^1.2.2", "vue-hot-reload-api": "^1.2.2",
"vue-resource": "~0.5.1", "vue-resource": "~0.5.1",
"vueify": "^7.0.2", "vueify": "^7.0.2",

2
resources/assets/js/components/main-wrapper/main-content/album.vue
View file

@ -27,7 +27,7 @@
<button class="play-shuffle" @click.prevent="shuffleSelected" v-if="selectedSongs.length > 1"> <button class="play-shuffle" @click.prevent="shuffleSelected" v-if="selectedSongs.length > 1">
<i class="fa fa-random"></i> Selected <i class="fa fa-random"></i> Selected
</button> </button>
<button class="add-to" @click.prevent="showingAddToMenu = !showingAddToMenu" v-if="selectedSongs.length"> <button class="add-to" @click.prevent.stop="showingAddToMenu = !showingAddToMenu" v-if="selectedSongs.length">
{{ showingAddToMenu ? 'Cancel' : 'Add To…' }} {{ showingAddToMenu ? 'Cancel' : 'Add To…' }}
</button> </button>

2
resources/assets/js/components/main-wrapper/main-content/artist.vue
View file

@ -27,7 +27,7 @@
<button class="play-shuffle" @click.prevent="shuffleSelected" v-if="selectedSongs.length > 1"> <button class="play-shuffle" @click.prevent="shuffleSelected" v-if="selectedSongs.length > 1">
<i class="fa fa-random"></i> Selected <i class="fa fa-random"></i> Selected
</button> </button>
<button class="add-to" @click.prevent="showingAddToMenu = !showingAddToMenu" v-if="selectedSongs.length"> <button class="add-to" @click.prevent.stop="showingAddToMenu = !showingAddToMenu" v-if="selectedSongs.length">
{{ showingAddToMenu ? 'Cancel' : 'Add To…' }} {{ showingAddToMenu ? 'Cancel' : 'Add To…' }}
</button> </button>

2
resources/assets/js/components/main-wrapper/main-content/favorites.vue
View file

@ -26,7 +26,7 @@
<button class="play-shuffle" @click.prevent="shuffleSelected" v-if="selectedSongs.length > 1"> <button class="play-shuffle" @click.prevent="shuffleSelected" v-if="selectedSongs.length > 1">
<i class="fa fa-random"></i> Selected <i class="fa fa-random"></i> Selected
</button> </button>
<button class="add-to" @click.prevent="showingAddToMenu = !showingAddToMenu" v-if="selectedSongs.length"> <button class="add-to" @click.prevent.stop="showingAddToMenu = !showingAddToMenu" v-if="selectedSongs.length">
{{ showingAddToMenu ? 'Cancel' : 'Add To…' }} {{ showingAddToMenu ? 'Cancel' : 'Add To…' }}
</button> </button>

2
resources/assets/js/components/main-wrapper/main-content/playlist.vue
View file

@ -26,7 +26,7 @@
<button class="play-shuffle" @click.prevent="shuffleSelected" v-if="selectedSongs.length > 1"> <button class="play-shuffle" @click.prevent="shuffleSelected" v-if="selectedSongs.length > 1">
<i class="fa fa-random"></i> Selected <i class="fa fa-random"></i> Selected
</button> </button>
<button class="add-to" @click.prevent="showingAddToMenu = !showingAddToMenu" v-if="selectedSongs.length"> <button class="add-to" @click.prevent.stop="showingAddToMenu = !showingAddToMenu" v-if="selectedSongs.length">
{{ showingAddToMenu ? 'Cancel' : 'Add To…' }} {{ showingAddToMenu ? 'Cancel' : 'Add To…' }}
</button> </button>
<button class="del" <button class="del"

2
resources/assets/js/components/main-wrapper/main-content/queue.vue
View file

@ -27,7 +27,7 @@
<button class="play-shuffle" @click.prevent="shuffleSelected" v-if="selectedSongs.length > 1"> <button class="play-shuffle" @click.prevent="shuffleSelected" v-if="selectedSongs.length > 1">
<i class="fa fa-random"></i> Selected <i class="fa fa-random"></i> Selected
</button> </button>
<button class="add-to" @click.prevent="showingAddToMenu = !showingAddToMenu" v-if="state.songs.length > 1"> <button class="add-to" @click.prevent.stop="showingAddToMenu = !showingAddToMenu" v-if="state.songs.length > 1">
{{ showingAddToMenu ? 'Cancel' : 'Add To…' }} {{ showingAddToMenu ? 'Cancel' : 'Add To…' }}
</button> </button>
<button class="clear" @click.prevent="clear" v-if="state.songs.length">Clear</button> <button class="clear" @click.prevent="clear" v-if="state.songs.length">Clear</button>

2
resources/assets/js/components/main-wrapper/main-content/songs.vue
View file

@ -28,7 +28,7 @@
<i class="fa fa-random"></i> Selected <i class="fa fa-random"></i> Selected
</button> </button>
<button class="add-to" @click.prevent="showingAddToMenu = !showingAddToMenu" v-if="selectedSongs.length"> <button class="add-to" @click.prevent.stop="showingAddToMenu = !showingAddToMenu" v-if="selectedSongs.length">
{{ showingAddToMenu ? 'Cancel' : 'Add To…' }} {{ showingAddToMenu ? 'Cancel' : 'Add To…' }}
</button> </button>

6
resources/assets/js/components/shared/add-to-menu.vue
View file

@ -1,5 +1,5 @@
<template> <template>
<div class="add-to-playlist" v-show="showing"> <div class="add-to-playlist" v-show="showing" v-on-clickaway="hideMenu">
<p>Add {{ songs.length }} {{ songs.length | pluralize 'song' }} to</p> <p>Add {{ songs.length }} {{ songs.length | pluralize 'song' }} to</p>
<ul> <ul>
@ -26,6 +26,7 @@
<script> <script>
import _ from 'lodash'; import _ from 'lodash';
import VueClickaway from 'vue-clickaway';
import playlistStore from '../../stores/playlist'; import playlistStore from '../../stores/playlist';
import favoriteStore from '../../stores/favorite'; import favoriteStore from '../../stores/favorite';
@ -33,6 +34,7 @@
export default { export default {
props: ['songs', 'showing', 'settings'], props: ['songs', 'showing', 'settings'],
mixins: [ VueClickaway.mixin ],
data() { data() {
return { return {
@ -128,7 +130,7 @@
clearSelection() { clearSelection() {
this.$parent.$broadcast('song:selection-clear'); this.$parent.$broadcast('song:selection-clear');
} },
}, },
}; };
</script> </script>