[Kimchi-devel] [PATCH 3/3] Enable storage volume upload on UI
Aline Manera
alinefm at linux.vnet.ibm.com
Fri May 29 14:23:57 UTC 2015
Also update the code to request the new upload API.
Signed-off-by: Aline Manera <alinefm at 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
More information about the Kimchi-devel
mailing list