Layers:Review:Renamed layers-container to layers-list-container. Extracted URLs to Constant.js

css/style.css

@@ -194,7 +194,7 @@ body {
 /**
  * Layers container
  */
-.layers-container {
+.layers-list-container {
   border: 4px solid #888;
   font-size: medium;
   color: white;

js/Constants.js

@@ -15,7 +15,7 @@ var Constants = {
 
   DEFAULT_PEN_COLOR : '#000000',
   TRANSPARENT_COLOR : 'TRANSPARENT',
-  
+
   /*
    * Fake semi-transparent color used to highlight transparent
    * strokes and rectangles:
@@ -27,15 +27,17 @@ var Constants = {
    * pixel target with this color:
    */
   TOOL_TARGET_HIGHLIGHT_COLOR: 'rgba(255, 255, 255, 0.2)',
-  
+
   /*
    * Default entry point for piskel web service:
    */
   PISKEL_SERVICE_URL: 'http://3.piskel-app.appspot.com',
+  IMAGE_SERVICE_UPLOAD_URL : 'http://screenletstore.appspot.com/__/upload',
+  IMAGE_SERVICE_GET_URL : 'http://screenletstore.appspot.com/img/',
 
   GRID_STROKE_WIDTH: 1,
-  GRID_STROKE_COLOR: "lightgray",
+  GRID_STROKE_COLOR: 'lightgray',
 
-  LEFT_BUTTON : "left_button_1",
-  RIGHT_BUTTON : "right_button_2"
+  LEFT_BUTTON : 'left_button_1',
+  RIGHT_BUTTON : 'right_button_2'
 };

js/controller/LayersController.js

@@ -7,7 +7,7 @@
 
   ns.LayersController.prototype.init = function () {
     this.layerItemTemplate_ = pskl.utils.Template.get('layer-item-template');
-    this.rootEl = document.querySelectorAll('.layers-container')[0];
+    this.rootEl = document.querySelectorAll('.layers-list-container')[0];
     this.layersListEl = document.querySelectorAll('.layers-list')[0];
 
     this.rootEl.addEventListener('click', this.onClick_.bind(this));

js/service/ImageUploadService.js

@@ -1,12 +1,7 @@
 (function () {
   var ns = $.namespace("pskl.service");
-  ns.ImageUploadService = function () {
-    this.serviceUrl_ = "http://screenletstore.appspot.com/__/upload";
-  };
-
-  ns.ImageUploadService.prototype.init = function () {
-    // service interface
-  };
+  ns.ImageUploadService = function () {};
+  ns.ImageUploadService.prototype.init = function () {};
 
   /**
    * Upload a base64 image data to distant service. If successful, will call provided callback with the image URL as first argument;
@@ -18,10 +13,10 @@
     var xhr = new XMLHttpRequest();
     var formData = new FormData();
     formData.append('data', imageData);
-    xhr.open('POST', this.serviceUrl_, true);
+    xhr.open('POST', Constants.IMAGE_SERVICE_UPLOAD_URL, true);
     xhr.onload = function (e) {
       if (this.status == 200) {
-        var imageUrl = "http://screenletstore.appspot.com/img/" + this.responseText;
+        var imageUrl = Constants.IMAGE_SERVICE_GET_URL + this.responseText;
         cbSuccess(imageUrl);
       } else {
         cbError();
@@ -30,5 +25,4 @@
 
     xhr.send(formData);
   };
-
-})();
+})();

templates/layers.html

@@ -1,4 +1,4 @@
-<div class="layers-container">
+<div class="layers-list-container">
   <h3 class="layers-title">Layers</h3>
   <div class="layers-button-container">
     <button class="layers-button" data-action="add"  >Add</button>