mirror of
https://github.com/Poniverse/Pony.fm.git
synced 2024-11-22 04:58:01 +01:00
Uploader for track versions, admin only for now
This commit is contained in:
parent
d9e7846a91
commit
78501007ce
4 changed files with 102 additions and 44 deletions
|
@ -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;
|
||||
}
|
||||
|
|
|
@ -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…</strong>
|
||||
<strong ng-show="upload.isProcessing || (upload.isUploading && upload.progress >= 100)">Processing…</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>
|
||||
|
|
|
@ -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()
|
||||
|
||||
|
|
|
@ -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)
|
||||
])
|
||||
|
|
Loading…
Reference in a new issue