progress_upload_field 0.0.1

data/LICENSE.txt

@@ -0,0 +1,20 @@
+Copyright (c) 2011 Andi Altendorfer
+
+Permission is hereby granted, free of charge, to any person obtaining
+a copy of this software and associated documentation files (the
+"Software"), to deal in the Software without restriction, including
+without limitation the rights to use, copy, modify, merge, publish,
+distribute, sublicense, and/or sell copies of the Software, and to
+permit persons to whom the Software is furnished to do so, subject to
+the following conditions:
+
+The above copyright notice and this permission notice shall be
+included in all copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
+EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF
+MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND
+NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE
+LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION
+OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION
+WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.

data/README.md

@@ -0,0 +1,64 @@
+progress_upload_field (for Rails 3.1)
+=====================
+
+_progress_upload_field_ provides a FormHelper function to display all necessary divtags and a javascript
+for progress-bar display while uploading files. 
+
+Usage
+-----
+
+**Gemfile**
+
+Add the following line
+
+    gem 'progress_upload_field', '~> 0.0.1'
+
+**application.js**
+
+Add the following line
+
+    //= require progress_upload_field
+    
+**application.css**
+
+Add the following line
+
+    @import "progress.css.scss";
+    
+    
+**Use the gem in your view**
+
+Here an example how to use it with HAML. Obviosly it works with html.erm too
+
+
+      = form_for([@posting,@attachment], :html => { :multipart => true, :name => 'new_attachment' } ) do |f|
+        .field
+          =f.label :file
+          =f.file_field :file, :onchange => "fileSelected('new_attachment','attachment_file','#{posting_attachments_path(@posting)}');"
+
+        .field
+          =f.label :submit
+          =f.submit t(:submit), :onclick => "uploadFile('new_attachment'); return false;"
+          =progress_upload_field('attachment_file')
+
+The keywords are 'new_attachment' and 'attachment_file'. 
+You can choose any names you want. 
+The name of the form should be provided at `:onclick => "uploadFile('your_forms_name')"`
+The name of the model + the name of the upload field should be provided at `progress_upload_field('your_model_your_field')`
+
+
+Contributing to progress_upload_field
+=====================================
+ 
+  * Check out the latest master to make sure the feature hasn't been implemented or the bug hasn't been fixed yet
+  * Check out the issue tracker to make sure someone already hasn't requested it and/or contributed it
+  * Fork the project
+  * Start a feature/bugfix branch
+  * Commit and push until you are happy with your contribution
+  * Make sure to add tests for it. This is important so I don't break it in a future version unintentionally.
+  * Please try not to mess with the Rakefile, version, or history. If you want to have your own version, or is otherwise necessary, that is fine, but please isolate to its own commit so I can cherry-pick around it.
+
+Copyright
+=========
+
+Copyright (c) 2011 Andi Altendorfer. See LICENSE.txt for further details.

data/lib/generators/progress_upload_field/install/install_generator.rb

@@ -0,0 +1,43 @@
+require 'rails'
+
+module ProgressUploadField
+  module Generators
+    class InstallGenerator < ::Rails::Generators::Base
+
+      desc "This generator installs ProgressUploadField for rails < 3.1"
+      def copy_files
+        say_status("copying", "NOT IMPLEMENTED YET. Please copy assets manually")
+      end
+
+      #class_option :ui, :type => :boolean, :default => false, :desc => "Include jQueryUI"
+      #source_root File.expand_path('../../../../../vendor/assets/javascripts', __FILE__)
+      #
+      #def remove_prototype
+      #  Rails::PROTOTYPE_JS.each do |name|
+      #    remove_file "public/javascripts/#{name}.js"
+      #  end
+      #end
+      #
+      #def copy_jquery
+      #  say_status("copying", "jQuery (#{Jquery::Rails::JQUERY_VERSION})", :green)
+      #  copy_file "jquery.js", "public/javascripts/jquery.js"
+      #  copy_file "jquery.min.js", "public/javascripts/jquery.min.js"
+      #end
+      #
+      #def copy_jquery_ui
+      #  if options.ui?
+      #    say_status("copying", "jQuery UI (#{Jquery::Rails::JQUERY_UI_VERSION})", :green)
+      #    copy_file "jquery-ui.js", "public/javascripts/jquery-ui.js"
+      #    copy_file "jquery-ui.min.js", "public/javascripts/jquery-ui.min.js"
+      #  end
+      #end
+      #
+      #def copy_ujs_driver
+      #  say_status("copying", "jQuery UJS adapter (#{Jquery::Rails::JQUERY_UJS_VERSION[0..5]})", :green)
+      #  remove_file "public/javascripts/rails.js"
+      #  copy_file "jquery_ujs.js", "public/javascripts/jquery_ujs.js"
+      #end
+
+    end
+  end
+end if ::Rails.version < "3.1"

data/lib/progress_upload_field.rb

@@ -0,0 +1,27 @@
+require "progress_upload_field/rails"
+
+module ActionView
+  module Helpers
+    module FormHelper
+      def progress_upload_field(div_name)
+        fields = ""
+        fields += "<div id='progressIndicator'>"
+          fields += "<div id='#{div_name}Bar'>"
+            fields += "<div id='#{div_name}Response'></div>"
+            fields += "<div id='#{div_name}Number'></div>"
+          fields += "</div>"
+          fields += "<div id='#{div_name}UploadInfo'>"
+            fields += "<span id='#{div_name}TransferSpeedInfo'></span>"
+            fields += "<span id='#{div_name}TimeRemainingInfo'></span>"
+            fields += "<span id='#{div_name}BytesInfo'></span>"
+          fields += "</div>"
+        fields += "</div>"
+        fields += "<div id='#{div_name}Info'></div>"
+        fields += "<div id='#{div_name}Name'></div>"
+        fields += "<div id='#{div_name}Size'></div>"
+        fields += "<div id='#{div_name}Type'></div>"
+        raw(fields)
+      end
+    end
+  end
+end

data/lib/progress_upload_field/rails.rb

@@ -0,0 +1,9 @@
+module ProgressUploadField
+  module Rails
+    if ::Rails.version < "3.1"
+      require 'progress_upload_field/rails/railtie'
+    else
+      require 'progress_upload_field/rails/engine'
+    end
+  end
+end

data/lib/progress_upload_field/rails/engine.rb

@@ -0,0 +1,8 @@
+module ProgressUploadField
+  module Rails
+    # Let Rails 3.1 include our asset-path
+    class Engine < ::Rails::Engine
+    end
+
+  end
+end

data/vendor/assets/javascripts/progress_upload_field.js

@@ -0,0 +1,117 @@
+var bytesUploaded = 0;
+var bytesTotal = 0;
+var previousBytesLoaded = 0;
+var intervalTimer = 0;
+var div_id = "";
+var post_action = "";
+var form_div_id = "form1";
+
+function fileSelected(form_id,id,action) {
+  var file = document.getElementById(id).files[0];
+  var fileSize = 0;
+  div_id = id;
+  post_action = action;
+  form_div_id = form_id;
+  if (file.size > 1024 * 1024)
+    fileSize = (Math.round(file.size * 100 / (1024 * 1024)) / 100).toString() + 'MB';
+  else
+    fileSize = (Math.round(file.size * 100 / 1024) / 100).toString() + 'KB';
+  document.getElementById(div_id+'Info').style.display = 'block';
+  document.getElementById(div_id+'Name').innerHTML = 'Name: ' + file.name;
+  document.getElementById(div_id+'Size').innerHTML = 'Size: ' + fileSize;
+  document.getElementById(div_id+'Type').innerHTML = 'Type: ' + file.type;
+}
+
+function uploadFile(formName) {
+  previousBytesLoaded = 0;
+  document.getElementById(div_id+'Response').style.display = 'none';
+  document.getElementById(div_id+'Number').innerHTML = '';
+  var progressBar = document.getElementById(div_id+'Bar');
+  progressBar.style.display = 'block';
+  progressBar.style.width = '0px';        
+  
+  var myform = document.forms[formName];
+  var fd = new FormData(myform);
+  
+  var xhr = new XMLHttpRequest();        
+  xhr.upload.addEventListener("progress", uploadProgress, false);
+  xhr.addEventListener("load", uploadComplete, false);
+  xhr.addEventListener("error", uploadFailed, false);
+  xhr.addEventListener("abort", uploadCanceled, false);
+  xhr.open("POST", post_action);
+  xhr.send(fd);
+
+  intervalTimer = setInterval(updateTransferSpeed, 500);
+}
+
+function updateTransferSpeed() {
+  var currentBytes = bytesUploaded;
+  var bytesDiff = currentBytes - previousBytesLoaded;
+  if (bytesDiff == 0) return;
+  previousBytesLoaded = currentBytes;
+  bytesDiff = bytesDiff * 2;
+  var bytesRemaining = bytesTotal - previousBytesLoaded;
+  var secondsRemaining = bytesRemaining / bytesDiff;
+
+  var speed = "";
+  if (bytesDiff > 1024 * 1024)
+    speed = (Math.round(bytesDiff * 100/(1024*1024))/100).toString() + 'MBps';
+  else if (bytesDiff > 1024)
+    speed =  (Math.round(bytesDiff * 100/1024)/100).toString() + 'KBps';
+  else
+    speed = bytesDiff.toString() + 'Bps';
+  document.getElementById(div_id+'TransferSpeedInfo').innerHTML = speed;
+  document.getElementById(div_id+'TimeRemainingInfo').innerHTML = '| ' + secondsToString(secondsRemaining);        
+}
+
+function secondsToString(seconds) {        
+  var h = Math.floor(seconds / 3600);
+  var m = Math.floor(seconds % 3600 / 60);
+  var s = Math.floor(seconds % 3600 % 60);
+  return ((h > 0 ? h + ":" : "") + (m > 0 ? (h > 0 && m < 10 ? "0" : "") + m + ":" : "0:") + (s < 10 ? "0" : "") + s);
+}
+
+function uploadProgress(evt) {
+  if (evt.lengthComputable) {
+    bytesUploaded = evt.loaded;
+    bytesTotal = evt.total;
+    var percentComplete = Math.round(evt.loaded * 100 / evt.total);
+    var bytesTransfered = '';
+    if (bytesUploaded > 1024*1024)
+      bytesTransfered = (Math.round(bytesUploaded * 100/(1024*1024))/100).toString() + 'MB';
+    else if (bytesUploaded > 1024)
+      bytesTransfered = (Math.round(bytesUploaded * 100/1024)/100).toString() + 'KB';
+    else
+      bytesTransfered = (Math.round(bytesUploaded * 100)/100).toString() + 'Bytes';
+
+    document.getElementById(div_id+'Number').innerHTML = percentComplete.toString() + '%';
+    document.getElementById(div_id+'Bar').style.width = percentComplete.toString() + '%';
+    document.getElementById(div_id+'BytesInfo').innerHTML = bytesTransfered;
+    if (percentComplete == 100) {
+      $('#'+div_id+'Info').hide();
+      var uploadResponse = document.getElementById(div_id+'Response');
+      uploadResponse.innerHTML = '<span style="font-size: 10pt; font-weight: bold;">Please wait...</span>';
+      uploadResponse.style.display = 'block';
+    }
+  }
+  else {
+    document.getElementById(div_id+'Bar').innerHTML = 'unable to process upload';
+  }  
+}
+
+function uploadComplete(evt) {
+  clearInterval(intervalTimer);
+  var uploadResponse = document.getElementById(div_id+'Response');
+  eval(evt.target.responseText);
+  uploadResponse.style.display = 'block';
+}  
+
+function uploadFailed(evt) {
+  clearInterval(intervalTimer);
+  alert("An error occurred while uploading the file.");  
+}  
+
+function uploadCanceled(evt) {
+  clearInterval(intervalTimer);
+  alert("The upload has been canceled by the user or your browser dropped the connection.");  
+}  

data/vendor/assets/stylesheets/progress.css.scss

@@ -0,0 +1,25 @@
+#progressIndicator {
+
+  width: 325px; 
+  background: #eee;
+  overflow: hidden;
+
+  #attachment_fileName{}
+  #attachment_fileSize{}
+  #attachment_fileType{}
+  
+  #attachment_fileBar {
+    color: white;
+    display: block;
+    height: 25px;
+    width: 0px;
+    background: #264799;
+    text-align: right;
+    border-radius: 5px;
+  }
+  #attachment_fileNumber{display: inline;}
+  #attachment_fileTransferSpeedInfo{display: inline;}
+  #attachment_fileTimeRemainingInfo{display: inline;}
+  #attachment_fileBytesInfo{display: inline;}
+  #attachment_fileResponse{display: inline;}
+}

metadata

@@ -0,0 +1,116 @@
+--- !ruby/object:Gem::Specification
+name: progress_upload_field
+version: !ruby/object:Gem::Version
+  version: 0.0.1
+  prerelease: 
+platform: ruby
+authors:
+- Andi Altendorfer
+autorequire: 
+bindir: bin
+cert_chain: []
+date: 2011-08-18 00:00:00.000000000 +02:00
+default_executable: 
+dependencies:
+- !ruby/object:Gem::Dependency
+  name: jquery-rails
+  requirement: &70110061111500 !ruby/object:Gem::Requirement
+    none: false
+    requirements:
+    - - ! '>='
+      - !ruby/object:Gem::Version
+        version: '0'
+  type: :runtime
+  prerelease: false
+  version_requirements: *70110061111500
+- !ruby/object:Gem::Dependency
+  name: shoulda
+  requirement: &70110061109500 !ruby/object:Gem::Requirement
+    none: false
+    requirements:
+    - - ! '>='
+      - !ruby/object:Gem::Version
+        version: '0'
+  type: :development
+  prerelease: false
+  version_requirements: *70110061109500
+- !ruby/object:Gem::Dependency
+  name: bundler
+  requirement: &70110061103300 !ruby/object:Gem::Requirement
+    none: false
+    requirements:
+    - - ~>
+      - !ruby/object:Gem::Version
+        version: 1.0.0
+  type: :development
+  prerelease: false
+  version_requirements: *70110061103300
+- !ruby/object:Gem::Dependency
+  name: jeweler
+  requirement: &70110061101520 !ruby/object:Gem::Requirement
+    none: false
+    requirements:
+    - - ~>
+      - !ruby/object:Gem::Version
+        version: 1.6.4
+  type: :development
+  prerelease: false
+  version_requirements: *70110061101520
+- !ruby/object:Gem::Dependency
+  name: rcov
+  requirement: &70110061096500 !ruby/object:Gem::Requirement
+    none: false
+    requirements:
+    - - ! '>='
+      - !ruby/object:Gem::Version
+        version: '0'
+  type: :development
+  prerelease: false
+  version_requirements: *70110061096500
+description: use 'progress_upload_field' in your view, next your file_field
+email: andi@iboard.cc
+executables: []
+extensions: []
+extra_rdoc_files:
+- LICENSE.txt
+- README.md
+files:
+- lib/generators/progress_upload_field/install/install_generator.rb
+- lib/progress_upload_field.rb
+- lib/progress_upload_field/rails.rb
+- lib/progress_upload_field/rails/engine.rb
+- vendor/assets/javascripts/progress_upload_field.js
+- vendor/assets/stylesheets/progress.css.scss
+- LICENSE.txt
+- README.md
+has_rdoc: true
+homepage: http://github.com/iboard/progress_upload_field
+licenses:
+- MIT
+post_install_message: 
+rdoc_options: []
+require_paths:
+- lib
+required_ruby_version: !ruby/object:Gem::Requirement
+  none: false
+  requirements:
+  - - ! '>='
+    - !ruby/object:Gem::Version
+      version: '0'
+      segments:
+      - 0
+      hash: 2605619411404494244
+required_rubygems_version: !ruby/object:Gem::Requirement
+  none: false
+  requirements:
+  - - ! '>='
+    - !ruby/object:Gem::Version
+      version: '0'
+requirements: []
+rubyforge_project: 
+rubygems_version: 1.6.2
+signing_key: 
+specification_version: 3
+summary: FormHelper to display div-tags and a javascript to show a progress-bar while
+  uploading files
+test_files: []