MyFavMirrors/owntone-server
1
0
Fork 0
mirror of https://github.com/owntone/owntone-server.git synced 2024-12-26 07:05:57 -05:00
Code Issues Packages Projects Releases Wiki Activity

[web-src] PageQueue: new button to add URL streams outside of library to queue

Browse Source
This commit is contained in:
whatdoineed2do/Ray 2019-05-11 14:01:25 +01:00
parent bc8a156132
commit 20c36cb48f
2 changed files with 67 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

54
web-src/src/components/ModalDialogAddUrlStream.vue Normal file
View File

@ -0,0 +1,54 @@
<template>
<div>
<transition name="fade">
<div class="modal is-active" v-if="show">
<div class="modal-background" @click="$emit('close')"></div>
<div class="modal-card">
<section class="modal-card-body">
<form v-on:submit.prevent="add_stream">
<div class="field">
<p class="control is-expanded has-icons-left">
<input class="input is-rounded is-shadowless" type="text" placeholder="URL stream" v-model="url" ref="url_field">
<span class="icon is-left">
<i class="mdi mdi-file-music"></i>
</span>
</p>
</div>
</form>
</section>
<footer class="modal-card-foot">
<button class="button is-success" @click="add_stream" :disabled="url.length < 9">Add</button>
<button class="button" @click="$emit('close')">Cancel</button>
</footer>
</div>
<button class="modal-close is-large" aria-label="close" @click="$emit('close')"></button>
</div>
</transition>
</div>
</template>
<script>
import webapi from '@/webapi'
export default {
name: 'ModalDialogAddUrlStream',
props: [ 'show' ],
data () {
return {
url: ''
}
},
methods: {
add_stream: function () {
this.$emit('close')
webapi.queue_add(this.url)
this.url = ''
}
}
}
</script>
<style>
</style>

14
web-src/src/pages/PageQueue.vue
View File

@ -12,6 +12,12 @@
</span>
<span>Hide previous</span>
</a>
<a class="button is-small" @click="add_stream_dialog">
<span class="icon">
<i class="mdi mdi-web"></i>
</span>
<span>Add URL Stream</span>
</a>
<!--
<a class="button" :class="{ 'is-info': edit_mode }" @click="edit_mode = !edit_mode">
<span class="icon">
@ -60,19 +66,21 @@
import ContentWithHeading from '@/templates/ContentWithHeading'
import ListItemQueueItem from '@/components/ListItemQueueItem'
import ModalDialogQueueItem from '@/components/ModalDialogQueueItem'
import ModalDialogAddUrlStream from '@/components/ModalDialogAddUrlStream'
import webapi from '@/webapi'
import * as types from '@/store/mutation_types'
import draggable from 'vuedraggable'
export default {
name: 'PageQueue',
components: { ContentWithHeading, ListItemQueueItem, draggable, ModalDialogQueueItem },
components: { ContentWithHeading, ListItemQueueItem, draggable, ModalDialogQueueItem, ModalDialogAddUrlStream },
data () {
return {
edit_mode: false,
show_details_modal: false,
show_url_modal: false,
selected_item: {}
}
},
@ -122,6 +130,10 @@ export default {
open_dialog: function (item) {
this.selected_item = item
this.show_details_modal = true
},
add_stream_dialog: function (item) {
this.show_url_modal = true
}
}
}