Uploader for track versions, admin only for now

This commit is contained in:
Josef Citrine 2016-11-28 00:19:16 +00:00
parent d9e7846a91
commit 78501007ce
4 changed files with 102 additions and 44 deletions

View file

@ -534,7 +534,9 @@ class Track extends Model implements Searchable, Commentable, Favouritable
$returnValue['username'] = User::whereId($track->user_id)->first()->username;
// Seasonal
if (Playlist::where('user_id', 22549)->first()) {
$returnValue['hwc_submit'] = Playlist::where('user_id', 22549)->first()->tracks()->get()->contains($track);
}
return $returnValue;
}

View file

@ -118,6 +118,19 @@
<input ng-disabled="isSaving" ng-change="touchModel()" placeholder="Username" type="text" id="username" ng-model="track.username" />
<div class="error">{{errors.username}}</div>
</div>
<div class="col-sm-6 form-row">
<label for="title" class="strong">Upload new version</label>
<input type="file" name="file" onchange="angular.element(this).scope().fileChanged(this)" ng-model="file" />
</div>
<span ng-repeat="upload in data.queue track by $index" ng-class="{'uploading': upload.isUploading, 'has-error': upload.error != null, 'is-processing': upload.isProcessing || (upload.progress >= 100 && upload.error == null)}" ng-show="!upload.success">
<strong ng-show="upload.isUploading && upload.error == null && upload.progress < 100">Uploading&hellip;</strong>
<strong ng-show="upload.isProcessing || (upload.isUploading && upload.progress >= 100)">Processing&hellip;</strong>
<strong ng-show="upload.error != null">Error</strong>
{{::upload.name}} -
<strong ng-show="upload.error != null">{{upload.error}}</strong>
</span>
</div>
<div class="form-row">
<label class="strong">Choose a License:</label>

View file

@ -21,8 +21,8 @@ module.exports = angular.module('ponyfm').directive 'pfmTrackEditor', () ->
trackId: '=trackId'
controller: [
'$scope', '$modal', 'auth', 'account-tracks', 'account-albums', 'taxonomies', 'images'
($scope, $modal, auth, tracks, albums, taxonomies, images) ->
'$scope', '$modal', 'auth', 'account-tracks', 'account-albums', 'taxonomies', 'images', '$state', 'upload'
($scope, $modal, auth, tracks, albums, taxonomies, images, $state, upload) ->
$scope.isDirty = false
$scope.isSaving = false
$scope.taxonomies = taxonomies
@ -33,6 +33,13 @@ module.exports = angular.module('ponyfm').directive 'pfmTrackEditor', () ->
$scope.isAdmin = auth.data.isAdmin
albumsDb = {}
$scope.data = upload
$scope.userSlug = $state.params.slug
$scope.fileChanged = (e) ->
files = e.files
$scope.$apply -> upload.uploadNewVersion(files[0], $scope.userSlug, $scope.trackId)
$scope.$watch 'trackId', (newValue, oldValue) ->
$scope.updateUI()

View file

@ -20,18 +20,23 @@ module.exports = angular.module('ponyfm').factory('upload', [
self =
queue: []
finishUploadWrapper: (upload)->
finishUploadWrapper: (upload, versionUpdate)->
()->
self.finishUpload(upload)
self.finishUpload(upload, versionUpdate)
# Polls for the upload's status
finishUpload: (upload) ->
finishUpload: (upload, versionUpdate) ->
# TODO: update upload status
$http.get("/api/web/tracks/#{upload.trackId}/upload-status").then(
endpoint = "/api/web/tracks/#{upload.trackId}/upload-status"
if versionUpdate
endpoint = "/api/web/tracks/#{upload.trackId}/version-upload-status"
$http.get(endpoint).then(
# handle success or still-processing
(response)->
if response.status == 202
$timeout(self.finishUploadWrapper(upload), 5000)
$timeout(self.finishUploadWrapper(upload, versionUpdate), 5000)
else if response.status == 201
upload.isProcessing = false
@ -46,7 +51,73 @@ module.exports = angular.module('ponyfm').factory('upload', [
upload.error = 'There was an unknown error!'
)
uploadProcess: (upload, formData, trackId) ->
versionUpdate = false
if trackId > 0
versionUpdate = true
xhr = new XMLHttpRequest()
xhr.upload.onprogress = (e) ->
$rootScope.$apply ->
upload.uploadedSize = e.loaded
upload.progress = e.loaded / upload.size * 100
$rootScope.$broadcast 'upload-progress', upload
# TODO: Implement polling here
# event listener
xhr.onload = -> $rootScope.$apply ->
upload.isUploading = false
upload.isProcessing = true
if xhr.status == 200
# kick off polling
upload.trackId = $.parseJSON(xhr.responseText).id
self.finishUpload(upload, versionUpdate)
else
error =
if xhr.getResponseHeader('content-type') == 'application/json'
'Error: ' + $.parseJSON(xhr.responseText)?.errors?.track?.join ', '
else
'There was an unknown error!'
upload.isProcessing = false
upload.error = error
$rootScope.$broadcast 'upload-error', [upload, error]
accountTracks.refresh(null, true)
.done($rootScope.$broadcast('upload-finished', upload))
endpoint = '/api/web/tracks/upload'
if versionUpdate
endpoint = '/api/web/tracks/' + trackId + '/version-upload'
xhr.open 'POST', endpoint, true
xhr.setRequestHeader 'X-XSRF-TOKEN', $.cookie('XSRF-TOKEN')
xhr.send formData
uploadNewVersion: (file, userSlug, trackId) ->
upload =
name: file.name
progress: 0
uploadedSize: 0
size: file.size
index: 0
isUploading: true
isProcessing: false
trackId: trackId
success: false
error: null
self.queue.push upload
$rootScope.$broadcast 'upload-added', upload
formData = new FormData()
formData.append('track', file)
formData.append('user_slug', userSlug)
self.uploadProcess(upload, formData, trackId)
upload: (files, userSlug) ->
_.each files, (file) ->
@ -65,44 +136,9 @@ module.exports = angular.module('ponyfm').factory('upload', [
self.queue.push upload
$rootScope.$broadcast 'upload-added', upload
xhr = new XMLHttpRequest()
xhr.upload.onprogress = (e) ->
$rootScope.$apply ->
upload.uploadedSize = e.loaded
upload.progress = e.loaded / upload.size * 100
$rootScope.$broadcast 'upload-progress', upload
# TODO: Implement polling here
# event listener
xhr.onload = -> $rootScope.$apply ->
upload.isUploading = false
upload.isProcessing = true
if xhr.status == 200
# kick off polling
upload.trackId = $.parseJSON(xhr.responseText).id
self.finishUpload(upload)
else
error =
if xhr.getResponseHeader('content-type') == 'application/json'
'Error: ' + $.parseJSON(xhr.responseText)?.errors?.track?.join ', '
else
'There was an unknown error!'
upload.isProcessing = false
upload.error = error
$rootScope.$broadcast 'upload-error', [upload, error]
accountTracks.refresh(null, true)
.done($rootScope.$broadcast('upload-finished', upload))
# send the track to the server
formData = new FormData()
formData.append('track', file)
formData.append('user_slug', userSlug)
xhr.open 'POST', '/api/web/tracks/upload', true
xhr.setRequestHeader 'X-XSRF-TOKEN', $.cookie('XSRF-TOKEN')
xhr.send formData
self.uploadProcess(upload, formData, 0)
])