MirrorMirror
/
funkwhale
mirror of https://dev.funkwhale.audio/funkwhale/funkwhale.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Merge branch '92-import-default' into 'develop' 

Import form improvements

See merge request funkwhale/funkwhale!73
This commit is contained in:
Eliot Berriot 2018-02-28 18:23:58 +00:00
parent 3db2f380d7 b461149ac0
commit ffc77f9e89
3 changed files with 42 additions and 29 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
front/src/components/library/import/FileUpload.vue
View File

@ -1,8 +1,8 @@
<template>
<div>
<div v-if="batch" class="ui two buttons">
<div v-if="batch" class="ui container">
<file-upload-widget
class="ui icon button"
:class="['ui', 'icon', 'left', 'floated', 'button']"
:post-action="uploadUrl"
:multiple="true"
:size="1024 * 1024 * 30"
@ -19,16 +19,18 @@
<i class="upload icon"></i>
Select files to upload...
</file-upload-widget>
<button class="ui icon teal button" v-if="!$refs.upload || !$refs.upload.active" @click.prevent="$refs.upload.active = true">
<button
:class="['ui', 'right', 'floated', 'icon', {disabled: files.length === 0}, 'button']"
v-if="!$refs.upload || !$refs.upload.active" @click.prevent="$refs.upload.active = true">
<i class="play icon" aria-hidden="true"></i>
Start Upload
</button>
<button type="button" class="ui icon yellow button" v-else @click.prevent="$refs.upload.active = false">
<button type="button" class="ui right floated icon yellow button" v-else @click.prevent="$refs.upload.active = false">
<i class="pause icon" aria-hidden="true"></i>
Stop Upload
</button>
</div>
<div class="ui hidden divider"></div>
<div class="ui hidden clearing divider"></div>
<p v-if="batch">
Once all your files are uploaded, simply head over <router-link :to="{name: 'library.import.batches.detail', params: {id: batch.id }}">import detail page</router-link> to check the import status.
</p>

23
front/src/components/library/import/Main.vue
View File

@ -23,6 +23,18 @@
</div>
</a>
</div>
<div class="ui hidden divider"></div>
<div class="ui centered buttons">
<button @click="currentStep -= 1" :disabled="currentStep === 0" class="ui icon button"><i class="left arrow icon"></i> Previous step</button>
<button @click="currentStep += 1" v-if="currentStep < 2" class="ui icon button">Next step <i class="right arrow icon"></i></button>
<button
@click="$refs.import.launchImport()"
v-if="currentStep === 2"
:class="['ui', 'positive', 'icon', {'loading': isImporting}, 'button']"
:disabled="isImporting || importData.count === 0"
>Import {{ importData.count }} tracks <i class="check icon"></i></button>
</div>
<div class="ui hidden divider"></div>
<div class="ui attached segment">
<template v-if="currentStep === 0">
<p>First, choose where you want to import the music from :</p>
@ -101,17 +113,6 @@
@import-state-changed="updateImportState"
></component>
</div>
<div class="ui hidden divider"></div>
<div class="ui buttons">
<button @click="currentStep -= 1" :disabled="currentStep === 0" class="ui icon button"><i class="left arrow icon"></i> Previous step</button>
<button @click="currentStep += 1" v-if="currentStep < 2" class="ui icon button">Next step <i class="right arrow icon"></i></button>
<button
@click="$refs.import.launchImport()"
v-if="currentStep === 2"
:class="['ui', 'positive', 'icon', {'loading': isImporting}, 'button']"
:disabled="isImporting || importData.count === 0"
>Import {{ importData.count }} tracks <i class="check icon"></i></button>
</div>
</div>
</div>
<div class="ui vertical stripe segment" v-if="currentRequest">

36
front/src/components/library/import/TrackImport.vue
View File

@ -100,8 +100,10 @@ export default Vue.extend({
warnings: [
'live',
'full',
'cover'
'cover',
'mix'
],
customQuery: '',
time
}
},
@ -114,7 +116,7 @@ export default Vue.extend({
$('.ui.checkbox').checkbox()
},
methods: {
search () {
search: function () {
let self = this
this.isLoading = true
let url = 'providers/' + this.currentBackendId + '/search/'
@ -144,17 +146,25 @@ export default Vue.extend({
source: this.importedUrl
}
},
query () {
let queryMapping = [
['artist', this.releaseMetadata['artist-credit'][0]['artist']['name']],
['album', this.releaseMetadata['title']],
['title', this.metadata['recording']['title']]
]
let query = this.customQueryTemplate
queryMapping.forEach(e => {
query = query.split('$' + e[0]).join(e[1])
})
return query
query: {
get: function () {
if (this.customQuery.length > 0) {
return this.customQuery
}
let queryMapping = [
['artist', this.releaseMetadata['artist-credit'][0]['artist']['name']],
['album', this.releaseMetadata['title']],
['title', this.metadata['recording']['title']]
]
let query = this.customQueryTemplate
queryMapping.forEach(e => {
query = query.split('$' + e[0]).join(e[1])
})
return query
},
set: function (newValue) {
this.customQuery = newValue
}
}
},
watch: {