lol_multiple_uploads 0.0.2 → 1.0.0

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA1:
-  metadata.gz: a6548accf5a47d041b92ce662e1becd80d3e8b16
-  data.tar.gz: 3b2559aa35f7e3794e1df826539d8b1d041076bd
+  metadata.gz: 86d948f983e19f849009a7fd2322101bcbebc11d
+  data.tar.gz: a1a7a58af4e1f3a5eb1c7792f8e4143c06444c10
 SHA512:
-  metadata.gz: b57e6ca95070c88dfbdfc0d3c023cc1428c844dd2f4ac785da7b45c0105b3faaeaef0de3f955a188aa06731c05f6e3c079aa92c680a7e2b7642a5f69c61f982b
-  data.tar.gz: 5ac2403f0743ef3bbe0c4e37cf5cf26e87b02d8e40115f0e1ca257e9c9848cbfea54ff3886a0501351d656e327b1c74949ccc2815c2f77f69092bb5be4f3729c
+  metadata.gz: f6270075d06347ba790ece4cfb47c0c98e41eb47b2ad440a7856c5355d958000090f4ec1e28811b7fa22e3e9142ef7923d0c3637802aa9b17fecbebe295c43cd
+  data.tar.gz: dd97cda144696b35f57a5b22faba8f845e3102adba88b7589f0d2322707c19cb893f72860bc0531d3e6e27d9968e483aa728d92fb120e684754b666158cc91d1

data/app/assets/javascripts/lol_multiple_uploads/upload.js

@@ -5,8 +5,45 @@ $(document).ready(function() {
 	if($multipleUploadLink[0]){
 		new MultipleUpload($multipleUploadLink);
 	}
+
+  new MultipleUploadsPhotos();
 });
 
+var MultipleUploadsPhotos = function(){
+  var _this       = this;
+  this.$container = $('.lol-multiple-uploads.images-container'); 
+
+  this.startup = function(){
+    this.$container.on('click', 'figure a', function(event) {
+      _this.removeImage($(this));
+      return false;
+    });
+  },
+
+  this.removeImage = function($link){
+    if(window.confirm("Você tem certeza?")){
+      $.ajax({
+        url: $link.attr('href'),
+        type: 'DELETE',
+        dataType: 'json'
+      })
+      .done(function() {
+        console.log("success");
+        $link.parent().fadeOut('400', function() {
+          $(this).remove();
+        });
+      })
+      .fail(function() {
+        console.log("error");
+      })
+      .always(function() {
+        console.log("complete");
+      });
+    }
+  },
+
+  this.startup();
+}
 
 var MultipleUpload = function(link){
 	var that   					= this;
@@ -26,7 +63,7 @@ var MultipleUpload = function(link){
 	},
 
 	this.filePicker = function(){
-		filepicker.setKey(that.filePickerKey); // -> 'AW4LKXceQXaH71hWtVTdlz'
+		filepicker.setKey(that.filePickerKey);
 
 		filepicker.pickMultiple(function(json){
    		that.storeImages(json);
@@ -57,20 +94,26 @@ var MultipleUpload = function(link){
 	},
 
 	this.appendImage = function(obj){
-		$(this.imageContainer).append("<img src='"+obj.image.url+"' data-id="+obj._id+">");
+    var html =  "<figure data-id="+obj._id+">"
+        html += "<img src='"+obj.image.url+"' >"
+        html += "<a rel=nofollow' data-method='delete' href='/remove-image/"+obj._id+".json'>Remover</a>"
+        html += "</figure>"
+
+		$(this.imageContainer).append(html);
 	},
 
 	this.showLoading = function(){
 		jQuery('<img/>', {
 			src:   '/assets/lol_multiple_uploads/loading.gif',
 			style: 'position: fixed; bottom: 5px; right: 5px; z-index: 400;',
-			class: 'lol-multiple-uploads'
+			class: 'lol-multiple-uploads loading'
 		}).appendTo('body');
 	},
 
 	this.hideLoading = function(){
-		$('.lol-multiple-uploads:first').remove();
+		$('.lol-multiple-uploads.loading:first').remove();
 	}
 
 	this.startup(); 
-}
+}
+

data/app/assets/stylesheets/lol_multiple_uploads/base.css

@@ -0,0 +1,51 @@
+.lol-multiple-uploads.images-container{
+  width: 100%;
+  float: left;
+  overflow: hidden;
+}
+
+.lol-multiple-uploads.images-container figure{
+  width: 120px;
+  height: 120px;
+  float: left;
+  padding: 0px;
+  margin: 5px;
+  position: relative;
+  overflow: hidden;
+}
+
+.lol-multiple-uploads.is-sortable figure{
+  cursor: move;
+}
+
+.lol-multiple-uploads.images-container figure a{
+  position: absolute;
+  bottom: -26px;
+  left: 0px;
+  width: 100%;
+  padding: 5px 0;
+  color: #fff;
+  font-family: Helvetica, Arial, sans-serif;
+  font-size: 14px;
+  text-align: center;
+  background-color: rgba(0, 0, 0, 0.7);
+  background: rgba(0, 0, 0, 0.7);
+  -webkit-transition: all 200ms ease-in-out;
+     -moz-transition: all 200ms ease-in-out;
+      -ms-transition: all 200ms ease-in-out;
+       -o-transition: all 200ms ease-in-out;
+          transition: all 200ms ease-in-out;
+}
+
+.lol-multiple-uploads.images-container figure:hover a{
+  bottom: 0px;
+  -webkit-transition: all 200ms ease-in-out;
+     -moz-transition: all 200ms ease-in-out;
+      -ms-transition: all 200ms ease-in-out;
+       -o-transition: all 200ms ease-in-out;
+          transition: all 200ms ease-in-out;
+}
+
+.lol-multiple-uploads.images-container img{
+  max-width: 100%;
+}

data/app/controllers/photos_controller.rb

@@ -3,17 +3,28 @@ class PhotosController < ActionController::Base
 
 	def create
     @resource = params[:model].classify.constantize.find params[:model_id]
-    @photo    = @resource.photos.build
-    @photo.image.store!(open(params[:photo]))
-    
+    @photo    = @resource.photos.build(remote_image_url: params[:photo])
+
     respond_with(@photo) do |format|
       if @photo.save
-        format.json{ render json: @photo}
+        format.json{ render json: @photo  }
       else
-        format.json{ render nothing: true, status: :error}
+        format.json{ render nothing: true, status: :error }
       end
     end
   rescue Exception
     render nothing: true, status: :error
 	end
+
+  def destroy
+    @photo = Photo.find params[:id]
+    
+    respond_with(@photo) do |format|
+      if @photo.destroy
+        format.json{ render json: @photo }
+      else
+        format.json{ render nothing: true, status: :error }
+      end
+    end
+  end
 end

data/app/helpers/image_helper.rb

@@ -0,0 +1,9 @@
+module ImageHelper 
+
+  def list_photos(resource)
+    content_tag(:div, class: 'lol-multiple-uploads images-container is-sortable', 'data-resource' => 'photo') do
+      render partial: '/layouts/lol_multiple_uploads/photo', collection: resource.photos.prioritized
+    end
+  end
+
+end

data/app/uploaders/image_uploader.rb

@@ -16,12 +16,9 @@ class ImageUploader < CarrierWave::Uploader::Base
   end
 
   # Provide a default URL as a default if there hasn't been a file uploaded:
-  # def default_url
-  #   # For Rails 3.1+ asset pipeline compatibility:
-  #   # ActionController::Base.helpers.asset_path("fallback/" + [version_name, "default.png"].compact.join('_'))
-  #
-  #   "/images/fallback/" + [version_name, "default.png"].compact.join('_')
-  # end
+  def default_url
+    "/assets/fallback/no-image.jpg"
+  end
 
   # Process files as they are uploaded:
   # process :scale => [200, 300]

data/app/views/layouts/lol_multiple_uploads/_photo.html.erb

@@ -0,0 +1,4 @@
+<figure data-id="<%= photo.id %>">
+  <%= image_tag(photo.image.url)%>
+  <%= link_to "Remover", remove_image_path(photo, format: 'json'), method: :delete %>
+</figure>

data/config/routes.rb

@@ -1,5 +1,5 @@
 Rails.application.routes.draw do
 
-	post '/upload-image' => 'photos#create', as: :upload_image
-
+	post   '/upload-image'     => 'photos#create' , as: :upload_image
+  delete '/remove-image/:id' => 'photos#destroy', as: :remove_image
 end

data/lib/lol_multiple_uploads/version.rb

@@ -1,3 +1,3 @@
 module LolMultipleUploads
-  VERSION = "0.0.2"
+  VERSION = "1.0.0"
 end

metadata

@@ -1,14 +1,14 @@
 --- !ruby/object:Gem::Specification
 name: lol_multiple_uploads
 version: !ruby/object:Gem::Version
-  version: 0.0.2
+  version: 1.0.0
 platform: ruby
 authors:
 - Eduardo Zaghi
 autorequire: 
 bindir: bin
 cert_chain: []
-date: 2013-08-27 00:00:00.000000000 Z
+date: 2013-09-09 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: rails
@@ -90,10 +90,13 @@ extra_rdoc_files: []
 files:
 - app/assets/images/lol_multiple_uploads/loading.gif
 - app/assets/javascripts/lol_multiple_uploads/upload.js
+- app/assets/stylesheets/lol_multiple_uploads/base.css
 - app/controllers/photos_controller.rb
+- app/helpers/image_helper.rb
 - app/helpers/upload_helper.rb
 - app/models/photo.rb
 - app/uploaders/image_uploader.rb
+- app/views/layouts/lol_multiple_uploads/_photo.html.erb
 - config/initializers/init_lol_multiple_uploads.rb
 - config/routes.rb
 - lib/generators/lol_multiple_uploads/install_generator.rb