Also update the code to request the new upload API. Signed-off-by: Aline Manera <alinefm@linux.vnet.ibm.com> --- ui/js/src/kimchi.api.js | 25 +++++-- ui/js/src/kimchi.storagepool_add_volume_main.js | 96 +++++++++++++++++++++---- ui/pages/i18n.json.tmpl | 2 + ui/pages/storagepool-add-volume.html.tmpl | 4 +- 4 files changed, 108 insertions(+), 19 deletions(-) diff --git a/ui/js/src/kimchi.api.js b/ui/js/src/kimchi.api.js index 5c36418..9207d7e 100644 --- a/ui/js/src/kimchi.api.js +++ b/ui/js/src/kimchi.api.js @@ -1243,14 +1243,29 @@ var kimchi = { }, /** - * Add a volume to a given storage pool. + * Create a new volume with capacity */ - uploadVolumeToSP: function(settings, suc, err) { - var fd = settings['formData']; - var sp = encodeURIComponent(settings['sp']); + createVolumeWithCapacity: function(poolName, settings, suc, err) { kimchi.requestJSON({ - url : 'storagepools/' + sp + '/storagevolumes', + url : 'storagepools/' + encodeURIComponent(poolName) + '/storagevolumes', type : 'POST', + contentType : "application/json", + data : JSON.stringify(settings), + dataType : "json", + success : suc, + error : err + }); + }, + + /** + * Upload volume content + */ + uploadVolumeToSP: function(poolName, volumeName, settings, suc, err) { + var url = 'storagepools/' + encodeURIComponent(poolName) + '/storagevolumes/' + encodeURIComponent(volumeName); + var fd = settings['formData']; + kimchi.requestJSON({ + url : url, + type : 'PUT', data : fd, processData : false, contentType : false, diff --git a/ui/js/src/kimchi.storagepool_add_volume_main.js b/ui/js/src/kimchi.storagepool_add_volume_main.js index 590ccde..c56f68c 100644 --- a/ui/js/src/kimchi.storagepool_add_volume_main.js +++ b/ui/js/src/kimchi.storagepool_add_volume_main.js @@ -1,7 +1,7 @@ /* * Project Kimchi * - * Copyright IBM, Corp. 2014 + * Copyright IBM, Corp. 2014-2015 * * Licensed under the Apache License, Version 2.0 (the 'License'); * you may not use this file except in compliance with the License. @@ -79,18 +79,90 @@ kimchi.sp_add_volume_main = function() { }; var uploadFile = function() { + var chunkSize = 8 * 1024 * 1024; // 8MB + var uploaded = 0; + var blobFile = $(localFileBox)[0].files[0]; - var fileName = blobFile.name; - var fd = new FormData(); - fd.append('name', fileName); - fd.append('file', blobFile); - kimchi.uploadVolumeToSP({ - sp: kimchi.selectedSP, - formData: fd - }, function(result) { - kimchi.window.close(); - kimchi.topic('kimchi/storageVolumeAdded').publish(); - }, onError); + + var createUploadVol = function() { + kimchi.createVolumeWithCapacity(kimchi.selectedSP, { + name: blobFile.name, + format: '', + capacity: blobFile.size, + upload: true + }, function(result) { + kimchi.window.close(); + trackVolCreation(result.id); + }, onError); + }; + + var uploadRequest = function(blob) { + var fd = new FormData(); + fd.append('chunk', blob); + fd.append('chunk_size', blob.size); + + kimchi.uploadVolumeToSP(kimchi.selectedSP, blobFile.name, { + formData: fd + }, function(result) { + if (uploaded < blobFile.size) + setTimeout(doUpload, 500); + }, onError); + + uploaded += blob.size + }; + + // Check file exists and has read permission + try { + var blob = blobFile.slice(0, 20); + var reader = new FileReader(); + reader.onloadend = function(e) { + if (e.loaded == 0) + kimchi.message.error.code('KCHAPI6008E'); + else + createUploadVol(); + }; + + reader.readAsBinaryString(blob); + } catch (err) { + kimchi.message.error.code('KCHAPI6008E'); + return; + } + + var doUpload = function() { + try { + var blob = blobFile.slice(uploaded, uploaded + chunkSize); + var reader = new FileReader(); + reader.onloadend = function(e) { + if (e.loaded == 0) + kimchi.message.error.code('KCHAPI6009E'); + else + uploadRequest(blob); + }; + + reader.readAsBinaryString(blob); + } catch (err) { + kimchi.message.error.code('KCHAPI6009E'); + return; + } + } + + var trackVolCreation = function(taskid) { + var onTaskResponse = function(result) { + var taskStatus = result['status']; + var taskMsg = result['message']; + if (taskStatus == 'running') { + if (taskMsg != 'ready for upload') { + setTimeout(function() { + trackVolCreation(taskid); + }, 2000); + } else { + kimchi.topic('kimchi/storageVolumeAdded').publish(); + doUpload(); + } + } + }; + kimchi.getTask(taskid, onTaskResponse, onError); + }; }; $(addButton).on('click', function(event) { diff --git a/ui/pages/i18n.json.tmpl b/ui/pages/i18n.json.tmpl index 675d9a6..f705613 100644 --- a/ui/pages/i18n.json.tmpl +++ b/ui/pages/i18n.json.tmpl @@ -39,6 +39,8 @@ "KCHAPI6004E": "$_("This is not a valid URL.")", "KCHAPI6005E": "$_("No such data available.")", "KCHAPI6007E": "$_("Can not contact the host system. Verify the host system is up and that you have network connectivity to it. HTTP request response %1. ")", + "KCHAPI6008E": "$_("Unable to read file.")", + "KCHAPI6009E": "$_("Error while uploading file.")", "KCHAPI6001M": "$_("Delete Confirmation")", "KCHAPI6002M": "$_("OK")", diff --git a/ui/pages/storagepool-add-volume.html.tmpl b/ui/pages/storagepool-add-volume.html.tmpl index b5f365f..048f1ed 100644 --- a/ui/pages/storagepool-add-volume.html.tmpl +++ b/ui/pages/storagepool-add-volume.html.tmpl @@ -1,7 +1,7 @@ #* * Project Kimchi * - * Copyright IBM, Corp. 2014 + * Copyright IBM, Corp. 2014-2015 * * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. @@ -47,7 +47,7 @@ </div> <div class="form-section"> <h2> - <input type="radio" id="volume-type-upload" class="volume-type" name="volumeType" value="upload" disabled/> + <input type="radio" id="volume-type-upload" class="volume-type" name="volumeType" value="upload"/> <label for="volume-type-upload"> $_("Upload a file") </label> -- 2.1.0