From c32af500dcea77e1756690b718a3b0167939f215 Mon Sep 17 00:00:00 2001
From: jdescottes <julian.descottes@gmail.com>
Date: Wed, 1 Oct 2014 01:21:49 +0200
Subject: [PATCH] add notification if image upload fails

---
 src/js/Constants.js                           |  4 +-
 src/js/controller/NotificationController.js   |  9 ++++-
 .../settings/GifExportController.js           | 38 +++++++++++++------
 src/js/utils/Xhr.js                           |  2 +-
 4 files changed, 36 insertions(+), 17 deletions(-)

diff --git a/src/js/Constants.js b/src/js/Constants.js
index 0ce59ab4..7aa6ed8f 100644
--- a/src/js/Constants.js
+++ b/src/js/Constants.js
@@ -57,8 +57,8 @@ var Constants = {
       SAVE : 'save'
     }
   },
-  IMAGE_SERVICE_UPLOAD_URL : 'http://piskel-imgstore-a.appspot.com/__/upload',
-  IMAGE_SERVICE_GET_URL : 'http://piskel-imgstore-a.appspot.com/img/',
+  IMAGE_SERVICE_UPLOAD_URL : 'http://localhost:12080/__/upload',
+  IMAGE_SERVICE_GET_URL : 'http://localhost:12080/img/',
 
   ZOOMED_OUT_BACKGROUND_COLOR : '#A0A0A0',
 
diff --git a/src/js/controller/NotificationController.js b/src/js/controller/NotificationController.js
index e6554d55..0e7bdf01 100644
--- a/src/js/controller/NotificationController.js
+++ b/src/js/controller/NotificationController.js
@@ -23,10 +23,15 @@
     message.innerHTML = messageInfo.content;
     message.innerHTML = message.innerHTML + "<div title='Close message' class='close'>x</div>";
     document.body.appendChild(message);
-    $(message).find(".close").click($.proxy(this.removeMessage_, this));
-    if(messageInfo.behavior) {
+
+    message.querySelector('.close').addEventListener('click', this.removeMessage_.bind(this));
+    if (messageInfo.behavior) {
       messageInfo.behavior(message);
     }
+
+    if (messageInfo.hideDelay) {
+      window.setTimeout(this.removeMessage_.bind(this), messageInfo.hideDelay);
+    }
   };
 
   /**
diff --git a/src/js/controller/settings/GifExportController.js b/src/js/controller/settings/GifExportController.js
index 02618498..f9a1b27f 100644
--- a/src/js/controller/settings/GifExportController.js
+++ b/src/js/controller/settings/GifExportController.js
@@ -44,25 +44,30 @@
     var zoom = this.getSelectedZoom_(),
         fps = this.piskelController.getFPS();
 
-    this.renderAsImageDataAnimatedGIF(zoom, fps, this.onGifRenderingCompleted_.bind(this));
+    this.renderAsImageDataAnimatedGIF(zoom, fps, this.uploadImageData_.bind(this));
   };
 
   ns.GifExportController.prototype.onDownloadButtonClick_ = function (evt) {
-    var fileName = this.piskelController.getPiskel().getDescriptor().name + '.gif';
     var zoom = this.getSelectedZoom_(),
         fps = this.piskelController.getFPS();
 
-    this.renderAsImageDataAnimatedGIF(zoom, fps, function (imageData) {
-      pskl.utils.BlobUtils.dataToBlob(imageData, "image/gif", function(blob) {
-        pskl.utils.FileUtils.downloadAsFile(blob, fileName);
-      });
-    }.bind(this));
+    this.renderAsImageDataAnimatedGIF(zoom, fps, this.downloadImageData_.bind(this));
   };
 
-  ns.GifExportController.prototype.onGifRenderingCompleted_ = function (imageData) {
+  ns.GifExportController.prototype.downloadImageData_ = function (imageData) {
+    var fileName = this.piskelController.getPiskel().getDescriptor().name + '.gif';
+    pskl.utils.BlobUtils.dataToBlob(imageData, "image/gif", function(blob) {
+      pskl.utils.FileUtils.downloadAsFile(blob, fileName);
+    });
+  };
+
+  ns.GifExportController.prototype.uploadImageData_ = function (imageData) {
     this.updatePreview_(imageData);
     this.previewContainerEl.classList.add("preview-upload-ongoing");
-    pskl.app.imageUploadService.upload(imageData, this.onImageUploadCompleted_.bind(this));
+
+    console.log(imageData.length);
+
+    pskl.app.imageUploadService.upload(imageData, this.onImageUploadCompleted_.bind(this), this.onImageUploadFailed_.bind(this));
   };
 
   ns.GifExportController.prototype.onImageUploadCompleted_ = function (imageUrl) {
@@ -71,6 +76,15 @@
     this.previewContainerEl.classList.remove("preview-upload-ongoing");
   };
 
+  ns.GifExportController.prototype.onImageUploadFailed_ = function (event, xhr) {
+    if (xhr.status === 500) {
+      $.publish(Events.SHOW_NOTIFICATION, [{
+        "content": "Upload failed : " + xhr.responseText,
+        "hideDelay" : 5000
+      }]);
+    }
+  };
+
   ns.GifExportController.prototype.updatePreview_ = function (src) {
     this.previewContainerEl.innerHTML = "<div><img style='max-width:32px;' src='"+src+"'/></div>";
   };
@@ -104,10 +118,10 @@
     var colorCount = pskl.app.currentColorsService.getCurrentColors().length;
     var preserveColors = colorCount < MAX_GIF_COLORS;
     var gif = new window.GIF({
-      workers: 2,
+      workers: 5,
       quality: 1,
-      width: this.piskelController.getWidth()*zoom,
-      height: this.piskelController.getHeight()*zoom,
+      width: this.piskelController.getWidth() * zoom,
+      height: this.piskelController.getHeight() * zoom,
       preserveColors : preserveColors
     });
 
diff --git a/src/js/utils/Xhr.js b/src/js/utils/Xhr.js
index 6b111896..655cd168 100644
--- a/src/js/utils/Xhr.js
+++ b/src/js/utils/Xhr.js
@@ -37,7 +37,7 @@
       };
 
       xhr.onerror = function(e) {
-        error(e);
+        error(e, this);
       };
 
       return xhr;