From e604a122a1994becfe2c8a71fdd945896c8ed485 Mon Sep 17 00:00:00 2001
From: Joel Ibaceta <niohnex@gmail.com>
Date: Tue, 9 Sep 2014 21:10:40 -0500
Subject: [PATCH 1/3] upload file  button added

---
 source/javascripts/views/meme-editor.js | 15 +++++++++++++--
 source/partials/_editor.html.erb        |  1 +
 2 files changed, 14 insertions(+), 2 deletions(-)

diff --git a/source/javascripts/views/meme-editor.js b/source/javascripts/views/meme-editor.js
index b5792f8c..4c59d5d1 100644
--- a/source/javascripts/views/meme-editor.js
+++ b/source/javascripts/views/meme-editor.js
@@ -80,7 +80,9 @@ MEME.MemeEditorView = Backbone.View.extend({
     'change [name="overlay"]': 'onOverlayColor',
     'dragover #dropzone': 'onZoneOver',
     'dragleave #dropzone': 'onZoneOut',
-    'drop #dropzone': 'onZoneDrop'
+    'drop #dropzone': 'onZoneDrop',
+    'change #loadinput': 'onFileLoad'
+    
   },
 
   onCredit: function() {
@@ -144,5 +146,14 @@ MEME.MemeEditorView = Backbone.View.extend({
       this.model.loadBackground(dataTransfer.files[0]);
       this.$('#dropzone').removeClass('pulse');
     }
-  }
+  },
+  
+  onFileLoad: function(evt){
+    input = evt.target
+    if (input.files && input.files[0]) {
+      this.model.loadBackground(input.files[0]);
+      this.$('#dropzone').removeClass('pulse');
+    }
+  } 
+  
 });
\ No newline at end of file
diff --git a/source/partials/_editor.html.erb b/source/partials/_editor.html.erb
index 03708220..08df5231 100644
--- a/source/partials/_editor.html.erb
+++ b/source/partials/_editor.html.erb
@@ -1,5 +1,6 @@
 <form class="m-editor" id="meme-editor-view">
   <div class="dropzone" id="dropzone">Drop Image Here</div>
+  <input type="file" id="loadinput"></input>
   
   <h2><label for="image-scale">Resize image</label></h2>
   <input id="image-scale" type="range" max="4" min=".01" step=".01" value="1">

From b99f0d12ce61f5bd837c1bf1f96109d0c7fa553e Mon Sep 17 00:00:00 2001
From: Joel Ibaceta <niohnex@gmail.com>
Date: Tue, 9 Sep 2014 21:28:31 -0500
Subject: [PATCH 2/3] data

---
 source/partials/_editor.html.erb | 2 ++
 1 file changed, 2 insertions(+)

diff --git a/source/partials/_editor.html.erb b/source/partials/_editor.html.erb
index 08df5231..51e1c8ad 100644
--- a/source/partials/_editor.html.erb
+++ b/source/partials/_editor.html.erb
@@ -2,6 +2,8 @@
   <div class="dropzone" id="dropzone">Drop Image Here</div>
   <input type="file" id="loadinput"></input>
   
+  <button id="size1">Tamaño 1 </button>
+  
   <h2><label for="image-scale">Resize image</label></h2>
   <input id="image-scale" type="range" max="4" min=".01" step=".01" value="1">
   

From c158bb3943b3eef323a9f7304d3ce177a97fc5ea Mon Sep 17 00:00:00 2001
From: Joel Ibaceta <niohnex@gmail.com>
Date: Tue, 9 Sep 2014 21:42:08 -0500
Subject: [PATCH 3/3] changes

---
 source/javascripts/views/meme-editor.js | 40 +++++++++++++++++++++++--
 source/partials/_editor.html.erb        |  9 ++++--
 2 files changed, 44 insertions(+), 5 deletions(-)

diff --git a/source/javascripts/views/meme-editor.js b/source/javascripts/views/meme-editor.js
index 4c59d5d1..3e1a8937 100644
--- a/source/javascripts/views/meme-editor.js
+++ b/source/javascripts/views/meme-editor.js
@@ -81,8 +81,12 @@ MEME.MemeEditorView = Backbone.View.extend({
     'dragover #dropzone': 'onZoneOver',
     'dragleave #dropzone': 'onZoneOut',
     'drop #dropzone': 'onZoneDrop',
-    'change #loadinput': 'onFileLoad'
-    
+    'change #loadinput': 'onFileLoad',
+    'click #size1': 'onSizeTwitterChange',
+    'click #size2': 'onSizeFacebookPostChange',
+    'click #size3': 'onSizeFacebookAdd',
+    'click #size4': 'onSizeFacebookCover',
+    'click #size5': 'onSizeInstagram'
   },
 
   onCredit: function() {
@@ -154,6 +158,36 @@ MEME.MemeEditorView = Backbone.View.extend({
       this.model.loadBackground(input.files[0]);
       this.$('#dropzone').removeClass('pulse');
     }
-  } 
+  },
+  
+  onSizeTwitterChange: function(evt){
+    this.model.set('width', 1024);
+    this.model.set('height', 512);
+    evt.preventDefault();
+  },
+
+  onSizeFacebookPostChange: function(evt){
+    this.model.set('width', 940);
+    this.model.set('height', 788);
+    evt.preventDefault();
+  },
+
+  onSizeFacebookAdd: function(evt){
+    this.model.set('width', 1200);
+    this.model.set('height', 627);
+    evt.preventDefault();
+  },
+
+  onSizeFacebookCover: function(evt){
+    this.model.set('width', 851);
+    this.model.set('height', 315);
+    evt.preventDefault();
+  },
+
+  onSizeInstagram: function(evt){
+    this.model.set('width', 612);
+    this.model.set('height', 612);
+    evt.preventDefault();
+  }
   
 });
\ No newline at end of file
diff --git a/source/partials/_editor.html.erb b/source/partials/_editor.html.erb
index 51e1c8ad..6b0ce5fb 100644
--- a/source/partials/_editor.html.erb
+++ b/source/partials/_editor.html.erb
@@ -1,8 +1,13 @@
 <form class="m-editor" id="meme-editor-view">
+   <input type="file" id="loadinput"></input>
   <div class="dropzone" id="dropzone">Drop Image Here</div>
-  <input type="file" id="loadinput"></input>
+ 
   
-  <button id="size1">Tamaño 1 </button>
+  <button id="size1">Tamaño Twitter </button>
+  <button id="size2">Tamaño Facebook Post </button>
+  <button id="size3">Tamaño Facebook Ad </button>
+  <button id="size4">Tamaño Facebook Cover </button>
+  <button id="size5">Tamaño Instagram </button>
   
   <h2><label for="image-scale">Resize image</label></h2>
   <input id="image-scale" type="range" max="4" min=".01" step=".01" value="1">