uploadbox 0.2.0.beta2 → 0.2.0.rc1

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA1:
-  metadata.gz: 3295adc0d84020b0fa9a08e84ddb4d180c8c6e37
-  data.tar.gz: 840dda8db5e411535901274306d796715a62e515
+  metadata.gz: aba403d9c1bac88814e1c15488432993d38693e3
+  data.tar.gz: 7b09672b8ca2e8f1738570137945e7b392e74563
 SHA512:
-  metadata.gz: 608fe895c9d1c576a60537c936d5beb3c358deab7abb0d31a5cfaca589c5c62f811385842d4c5085dc4fb19004e8a157c2d12f9e309816722c5586a99882eee7
-  data.tar.gz: e0792f3cbdb7749b1e0b66e367e80822d6de790454f820134e0e6e72360122182cfc34f00de02917af0c958825d80a86b36e6537bd8b4f6e9a9b98a4f4e21770
+  metadata.gz: 181f7a868b0afedd60a112b8e6ac8a92bda233d45fca23b113d0e722a88bcf957b476bf7c2ef3f05184e7db42fb37f4bf183c9da48ce48dc1c9f0199e05ca20d
+  data.tar.gz: f851aabf4f2e79ba4d7f1460a1914c001cc528faf6c06b0d63aa62d5739fefb91090bf936497e10ca0de1b65766545fc63f5f43f1065cf84c48599415bfd03a9

data/app/assets/javascripts/_gallery_uploader.coffee

@@ -15,6 +15,8 @@ class @GalleryUploader
       done: @done
       fail: @fail
 
+    @setupLabel()
+
   add: (e, data) =>
     if @loader
       @loader.detach()
@@ -63,3 +65,9 @@ class @GalleryUploader
     key = Object.keys(@previews)[@currentIndex]
     @currentIndex++
     @previews[key]
+
+  setupLabel: =>
+    labels = @container.find('.fileupload-actions .fileupload-new, .fileupload-actions .fileupload-exists')
+    labels.each (index, label) ->
+      $(label).css({marginLeft: $(label).outerWidth() * -0.5, marginTop: $(label).outerHeight() * -0.5})
+

data/app/assets/javascripts/_image_uploader.coffee

@@ -8,8 +8,11 @@ class @ImageUploader
     @container.find('a.btn.fileupload-exists').bind('ajax:success', @delete)
     @thumbContainer = @container.find('.fileupload-preview.preview')
 
+    @setupLabel()
+
     @fileInput.show()
 
+
     @fileInput.fileupload
       type: 'POST'
       dataType: 'xml'
@@ -22,14 +25,13 @@ class @ImageUploader
 
   add: (e, data) =>
     @file = data.files[0]
-
     if @loader
       @loader.detach()
 
     if @verifyProcessingInterval
       clearInterval(@verifyProcessingInterval)
 
-    if @file.type.match /gif|jpe?g|png/
+    if @file.type and @file.type.match /gif|jpe?g|png/
       loadImage @file, @appendThumb, {
         maxWidth: @thumbContainer.data('width'),
         maxHeight: @thumbContainer.data('height'),
@@ -136,3 +138,9 @@ class @ImageUploader
     @container.find('.fileupload').removeClass('fileupload-new').addClass('fileupload-exists')
     @container.find('.fileupload').removeClass('uploading').removeClass('processing')
     @container.closest('form').find('[type=submit]').attr("disabled", false)
+
+  setupLabel: =>
+    labels = @container.find('.fileupload-actions .fileupload-new, .fileupload-actions .fileupload-exists')
+    labels.each (index, label) ->
+      $(label).css({marginLeft: $(label).outerWidth() * -0.5, marginTop: $(label).outerHeight() * -0.5})
+

data/app/assets/javascripts/_uploader_preview.coffee

@@ -26,6 +26,8 @@ class @UploaderPreview
     @idInput = @container.find('[data-item="id"]')
     @thumbContainer = @container.find('.fileupload-preview.thumbnail')
 
+    @setupLabel()
+
   startLoader: =>
     loadImage @file, @appendThumb, {
       maxWidth: @thumbContainer.data('width'),
@@ -147,3 +149,8 @@ class @UploaderPreview
     @idInput.val('')
     @container.detach()
 
+  setupLabel: =>
+    labels = @container.find('.fileupload-actions .fileupload-new, .fileupload-actions .fileupload-exists')
+    labels.each (index, label) ->
+      $(label).css({marginLeft: $(label).outerWidth() * -0.5, marginTop: $(label).outerHeight() * -0.5})
+

data/app/assets/stylesheets/uploadbox.sass

@@ -3,6 +3,8 @@
 .uploadbox-image-container
   background: #eee
   display: inline-block
+  // input[type="file"]
+  //   display: none
   img, canvas
     display: inline-block
     vertical-align: bottom
@@ -90,23 +92,26 @@
       top: 0
       right: 0
       margin: 0
+      background: yellow
       opacity: 0
       filter: alpha(opacity = 0)
-      transform: translate(-300px, 0) scale(4)
-      font-size: 23px
+      font-size: 600px
       direction: ltr
       cursor: pointer
-      width: 100%
+      display: block
+      overflow: hidden
+      &:active
+        outline: none
+        border: none
+
 
     .fileupload-exists
-      margin-left: -9999px
+      display: none
 
     .fileupload-new
       position: absolute
       top: 50%
       left: 50%
-      margin-top: -14px
-      margin-left: -39px
       display: inline-block
       background: #e5e5e5
       font-size: 11px
@@ -184,7 +189,7 @@
 
   .btn.fileupload-exists
     position: absolute
-    top: -10px
+    top: 0px
     right: -10px
     z-index: 3
     padding: 0

data/app/views/uploadbox/images/_uploads_many.slim

@@ -1,41 +1,51 @@
-= form.fields_for :image do
+= form.fields_for upload_name do |f|
+  / forces multipart/form-data
+  = f.file_field :temp, style: 'display: none'
+
   div data-component="GalleryUploader"
-    .uploadbox-image-uploader.uploads-many data-container="uploader" style="width: #{width}px; height: #{height}px;"
+    - if browser.ie? and browser.version.to_i <= 9
       - if namespace
-        input name="[#{resource.class.name.underscore}][#{namespace}]#{upload_name}[]" data-item="id" type="hidden"
+        input name="[#{resource.class.name.underscore}][#{namespace}]#{upload_name}[]" data-item="id" type="file"
       - else
-        input name="[#{resource.class.name.underscore}]#{upload_name}[]" data-item="id" type="hidden"
-
-      .fileupload data-provides="fileupload" class="fileupload-new"
-        .fileupload-preview.thumbnail data-version="#{version}" data-width="#{width}" data-height="#{height}" style="width: #{width}px; height: #{height}px;"
-
-        .fileupload-actions
-          span.btn.btn-file style="width: #{width}px; height: #{height}px;"
-            span.fileupload-new = choose_label
-            span.fileupload-exists = update_label
-            i.icon.icon-plus-1 style="line-height: #{height}px; font-size: #{(width * 0.4).to_i}px"
-
-            input type="file" name="image[file]" data-callback-url="#{uploadbox.images_path}" data-find-url="#{uploadbox.find_images_path(format: :json)}" data-url="https://#{CarrierWave::Uploader::Base.fog_directory}.s3.amazonaws.com/" accept="image/png image/x-png, image/gif, image/jpeg" style="display: none; width: #{width}px; height: #{height}px;" multiple="true"
-            input type="hidden" name="policy" value="#{s3_policy}"
-            input type="hidden" name="signature" value="#{s3_signature}"
-            input type="hidden" name="AWSAccessKeyId" value="#{CarrierWave::Uploader::Base.fog_credentials[:aws_access_key_id]}"
-            input type="hidden" name="acl" value="public-read"
-            input type="hidden" name="key"
-
-            input type="hidden" name="image[imageable_type]" value="#{resource.class.base_class}"
-            input type="hidden" name="image[upload_name]" value="#{upload_name}"
-          - if removable
-            - if resource.send(upload_name).present?
-              = link_to destroy_label, uploadbox.image_path(resource.send(upload_name)), class: 'btn fileupload-exists', remote: true, method: :delete
-            - else
-              = link_to destroy_label, '#', class: 'btn fileupload-exists', remote: true, method: :delete
+        input name="[#{resource.class.name.underscore}]#{upload_name}[]" data-item="id" type="file"
+    - else
 
-    - for image in resource.send(upload_name)
-      .uploadbox-image-uploader.uploads-many data-component="UploaderPreview" data-container="uploader" style="width: #{width}px; height: #{height}px;"
+      .uploadbox-image-uploader.uploads-many data-container="uploader" style="width: #{width}px; height: #{height}px;"
         - if namespace
-          input name="[#{resource.class.name.underscore}][#{namespace}]#{upload_name}[]" data-item="id" type="hidden" value="#{image.id}"
+          input name="[#{resource.class.name.underscore}][#{namespace}]#{upload_name}[]" data-item="id" type="hidden"
         - else
-          input name="[#{resource.class.name.underscore}]#{upload_name}[]" data-item="id" type="hidden" value="#{image.id}"
+          input name="[#{resource.class.name.underscore}]#{upload_name}[]" data-item="id" type="hidden"
+
+        .fileupload data-provides="fileupload" class="fileupload-new"
+          .fileupload-preview.thumbnail data-version="#{version}" data-width="#{width}" data-height="#{height}" style="width: #{width}px; height: #{height}px;"
+
+          .fileupload-actions
+            span.btn.btn-file style="width: #{width}px; height: #{height}px;"
+              span.fileupload-new = choose_label
+              span.fileupload-exists = update_label
+
+              input type="file" name="image[file]" data-callback-url="#{uploadbox.images_path}" data-find-url="#{uploadbox.find_images_path(format: :json)}" data-url="https://#{CarrierWave::Uploader::Base.fog_directory}.s3.amazonaws.com/" accept="image/png image/x-png, image/gif, image/jpeg" style="display: none; width: #{width}px; height: #{height}px;" multiple="true"
+              input type="hidden" name="policy" value="#{s3_policy}"
+              input type="hidden" name="signature" value="#{s3_signature}"
+              input type="hidden" name="AWSAccessKeyId" value="#{CarrierWave::Uploader::Base.fog_credentials[:aws_access_key_id]}"
+              input type="hidden" name="acl" value="public-read"
+              input type="hidden" name="key"
+
+              input type="hidden" name="image[imageable_type]" value="#{resource.class.base_class}"
+              input type="hidden" name="image[upload_name]" value="#{upload_name}"
+            - if removable
+              - if resource.send(upload_name).present?
+                = link_to destroy_label, uploadbox.image_path(resource.send(upload_name)), class: 'btn fileupload-exists', remote: true, method: :delete
+              - else
+                = link_to destroy_label, '#', class: 'btn fileupload-exists', remote: true, method: :delete
+
+    - for image in resource.send(upload_name)
+      .uploadbox-image-uploader.uploads-many data-component="UploaderPreview" data-container="uploader" style="width: #{width}px; height: #{height}px;"
+        - unless browser.ie? and browser.version.to_i <= 9
+          - if namespace
+            input name="[#{resource.class.name.underscore}][#{namespace}]#{upload_name}[]" data-item="id" type="hidden" value="#{image.id}"
+          - else
+            input name="[#{resource.class.name.underscore}]#{upload_name}[]" data-item="id" type="hidden" value="#{image.id}"
 
         .fileupload data-provides="fileupload" class="fileupload-exists"
           .fileupload-preview.thumbnail data-version="#{version}" data-width="#{width}" data-height="#{height}" style="width: #{width}px; height: #{height}px;"

data/app/views/uploadbox/images/_uploads_one.slim

@@ -1,36 +1,46 @@
-= form.fields_for :image do
-  - secure_random = SecureRandom.uuid
-  .uploadbox-image-uploader.uploads-one data-component="ImageUploader" style="width: #{width}px; height: #{height}px;"
+= form.fields_for upload_name do |f|
+  / forces multipart/form-data
+  = f.file_field :temp, style: 'display: none'
+
+  / old browsers
+  - if browser.ie? and browser.version.to_i <= 9
     - if namespace
-      input name="[#{resource.class.name.underscore}][#{namespace}]#{upload_name}" data-item="id" type="hidden" value="#{resource.send(upload_name).try :id}"
+      input name="[#{resource.class.name.underscore}][#{namespace}]#{upload_name}" data-item="id" type="file" accept="image/jpg,image/png"
     - else
-      input name="[#{resource.class.name.underscore}]#{upload_name}" data-item="id" type="hidden" value="#{resource.send(upload_name).try :id}"
+      input name="[#{resource.class.name.underscore}]#{upload_name}" data-item="id" type="file" accept="image/jpg,image/png"
+  - else
+    - secure_random = SecureRandom.uuid
+    .uploadbox-image-uploader.uploads-one data-component="ImageUploader" style="width: #{width}px; height: #{height}px;"
+      - if namespace
+        input name="[#{resource.class.name.underscore}][#{namespace}]#{upload_name}" data-item="id" type="hidden" value="#{resource.send(upload_name).try :id}"
+      - else
+        input name="[#{resource.class.name.underscore}]#{upload_name}" data-item="id" type="hidden" value="#{resource.send(upload_name).try :id}"
 
-    .fileupload data-provides="fileupload" class="fileupload-#{(resource.send("#{upload_name}?") or default) ? 'exists' : 'new'}"
-      .fileupload-preview.preview data-version="#{version}" data-width="#{width}" data-height="#{height}" style="width: #{width}px; height: #{height}px;"
-        - if resource.send("#{upload_name}?")
-          = img resource.send(upload_name).send(version)
-        - elsif default
-          = image_tag default, width: width, height: height
+      .fileupload data-provides="fileupload" class="fileupload-#{(resource.send("#{upload_name}?") or default) ? 'exists' : 'new'}"
+        .fileupload-preview.preview data-version="#{version}" data-width="#{width}" data-height="#{height}" style="width: #{width}px; height: #{height}px;"
+          - if resource.send("#{upload_name}?")
+            = img resource.send(upload_name).send(version)
+          - elsif default
+            = image_tag default, width: width, height: height
 
-      .fileupload-actions
-        span.btn.btn-file style="width: #{width}px; height: #{height}px;"
-          span.fileupload-new = choose_label
-          span.fileupload-exists = update_label
+        .fileupload-actions
+          span.btn.btn-file style="width: #{width}px; height: #{height}px;"
+            span.fileupload-new = choose_label
+            span.fileupload-exists = update_label
 
 
-          input type="file" name="image[file]" data-callback-url="#{uploadbox.images_path}" data-find-url="#{uploadbox.find_images_path(format: :json)}" data-url="https://#{CarrierWave::Uploader::Base.fog_directory}.s3.amazonaws.com/" data-secure-random="#{secure_random}" accept="image/*" style="display: none; width: #{width}px; height: #{height}px;"
-          input type="hidden" name="policy" value="#{s3_policy}"
-          input type="hidden" name="signature" value="#{s3_signature}"
-          input type="hidden" name="AWSAccessKeyId" value="#{CarrierWave::Uploader::Base.fog_credentials[:aws_access_key_id]}"
-          input type="hidden" name="acl" value="public-read"
-          input type="hidden" name="key" value="uploads/#{secure_random}/"
+            input type="file" name="image[file]" data-callback-url="#{uploadbox.images_path}" data-find-url="#{uploadbox.find_images_path(format: :json)}" data-url="https://#{CarrierWave::Uploader::Base.fog_directory}.s3.amazonaws.com/" data-secure-random="#{secure_random}" accept="image/*" style="width: #{width}px; height: #{height}px;"
+            input type="hidden" name="policy" value="#{s3_policy}"
+            input type="hidden" name="signature" value="#{s3_signature}"
+            input type="hidden" name="AWSAccessKeyId" value="#{CarrierWave::Uploader::Base.fog_credentials[:aws_access_key_id]}"
+            input type="hidden" name="acl" value="public-read"
+            input type="hidden" name="key" value="uploads/#{secure_random}/"
 
-          input type="hidden" name="image[imageable_type]" value="#{resource.class.base_class}"
-          input type="hidden" name="image[upload_name]" value="#{upload_name}"
-        - if removable
-          - if resource.send(upload_name).present?
-            = link_to destroy_label, uploadbox.image_path(resource.send(upload_name)), class: 'btn fileupload-exists', remote: true, method: :delete
-          - else
-            = link_to destroy_label, '#', class: 'btn fileupload-exists', remote: true, method: :delete
+            input type="hidden" name="image[imageable_type]" value="#{resource.class.base_class}"
+            input type="hidden" name="image[upload_name]" value="#{upload_name}"
+          - if removable
+            - if resource.send(upload_name).present?
+              = link_to destroy_label, uploadbox.image_path(resource.send(upload_name)), class: 'btn fileupload-exists', remote: true, method: :delete
+            - else
+              = link_to destroy_label, '#', class: 'btn fileupload-exists', remote: true, method: :delete
 

data/lib/uploadbox/engine.rb

@@ -9,6 +9,7 @@ require 'jbuilder'
 require 'resque'
 require 'heroku_resque_auto_scale'
 require 'dotenv-rails'
+require 'browser'
 
 # Allows redirects from https to http as facebook does
 module OpenURI

data/lib/uploadbox/image_uploader.rb

@@ -56,9 +56,13 @@ module Uploadbox
       end
 
       # @post.picture=(id)
-      define_method("#{upload_name}=") do |upload_id|
-        if upload_id.present?
-          self.send("#{upload_name}_upload=", upload_class.find(upload_id))
+      define_method("#{upload_name}=") do |upload_or_id|
+        # deals with ie8 and ie9
+        if upload_or_id.is_a? ActionDispatch::Http::UploadedFile
+          upload = upload_class.create(file: upload_or_id)
+          self.send("#{upload_name}_upload=", upload)
+        elsif upload_or_id.present?
+          self.send("#{upload_name}_upload=", upload_class.find(upload_or_id))
         end
       end
 
@@ -163,9 +167,17 @@ module Uploadbox
 
       # @post.images=([id, id])
       define_method("#{upload_name}=") do |ids|
-        self.send(upload_name).send('replace', [])
-        for id in ids.select(&:present?)
-          self.send(upload_name).send('<<', upload_class.find(id))
+
+
+        # deals with ie8 and ie9
+        if ids[0].is_a? ActionDispatch::Http::UploadedFile
+          upload = upload_class.create(file: ids[0])
+          self.send(upload_name).send('<<', upload)
+        else
+          self.send(upload_name).send('replace', [])
+          for id in ids.select(&:present?)
+            self.send(upload_name).send('<<', upload_class.find(id))
+          end
         end
       end
 

data/lib/uploadbox/version.rb

@@ -1,3 +1,3 @@
 module Uploadbox
-  VERSION = "0.2.0.beta2"
+  VERSION = "0.2.0.rc1"
 end

metadata

@@ -1,7 +1,7 @@
 --- !ruby/object:Gem::Specification
 name: uploadbox
 version: !ruby/object:Gem::Version
-  version: 0.2.0.beta2
+  version: 0.2.0.rc1
 platform: ruby
 authors:
 - Julio Protzek
@@ -9,7 +9,7 @@ authors:
 autorequire: 
 bindir: bin
 cert_chain: []
-date: 2014-04-23 00:00:00.000000000 Z
+date: 2014-04-30 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: rails
@@ -211,6 +211,26 @@ dependencies:
     - - '>='
       - !ruby/object:Gem::Version
         version: 0.10.0
+- !ruby/object:Gem::Dependency
+  name: browser
+  requirement: !ruby/object:Gem::Requirement
+    requirements:
+    - - ~>
+      - !ruby/object:Gem::Version
+        version: '0.4'
+    - - '>='
+      - !ruby/object:Gem::Version
+        version: 0.4.1
+  type: :runtime
+  prerelease: false
+  version_requirements: !ruby/object:Gem::Requirement
+    requirements:
+    - - ~>
+      - !ruby/object:Gem::Version
+        version: '0.4'
+    - - '>='
+      - !ruby/object:Gem::Version
+        version: 0.4.1
 - !ruby/object:Gem::Dependency
   name: jquery-rails
   requirement: !ruby/object:Gem::Requirement