Skip to content
This repository has been archived by the owner on Sep 13, 2022. It is now read-only.

Commit

Permalink
beautify processbar, added capistrano + task
Browse files Browse the repository at this point in the history
  • Loading branch information
rngtng committed Feb 21, 2010
1 parent 3361ed0 commit b75819b
Show file tree
Hide file tree
Showing 6 changed files with 105 additions and 100 deletions.
3 changes: 2 additions & 1 deletion .gitignore
View file
Expand Up @@ -8,4 +8,5 @@ public/images/rails.png
public/system
.DS_Store
db/development.sqlite3
db/test.sqlite3
db/test.sqlite3
tmp/restart.txt
4 changes: 4 additions & 0 deletions Capfile
View file
@@ -0,0 +1,4 @@
load 'deploy' if respond_to?(:namespace) # cap2 differentiator
Dir['vendor/plugins/*/recipes/*.rb'].each { |plugin| load(plugin) }

load 'config/deploy' # remove this line to skip loading any of the default tasks
21 changes: 2 additions & 19 deletions README
View file
Expand Up @@ -70,26 +70,9 @@ nice Fileupload style: http://www.quirksmode.org/dom/inputfile.html
add asset controller:
add asset model:

add ajaxupload for paralell processing: http://valums.com/ajax-upload/




- JSON-P Support
You can also request progress updates by using JSON-P, if you are uploading the file from a different domain or
subdomain than the web server that is handling your original request. Adding a "callback=yourCallbackFunction" parameter
to your request to the progress server will activate this functionality.

For example, a request like:
http://uploads.yourdomain.com/progress?callback=jsonp123&X-Progress-ID=1234

Would return the JSON-P function:
jsonp123(new Object({ 'state' : 'uploading', 'received' : 35587, 'size' : 716595, 'speed' : 35587 }));

The normal JSON request:
http://www.yourdomain.com/progress?X-Progress-ID=1234

Would return the JSON data:
new Object({ 'state' : 'uploading', 'received' : 35587, 'size' : 716595, 'speed' : 35587 })
add capistrano deplox for git+passenger: http://www.zorched.net/2008/06/17/capistrano-deploy-with-git-and-passenger/


########################################################################################################
Expand Down
134 changes: 57 additions & 77 deletions app/views/assets/index.html.erb
View file
Expand Up @@ -4,18 +4,15 @@
<h2>Select a File to upload...</h2>
</div>


<a href="#" id="upload_button">Upload</a>
<a href="#" id="upload_button">Upload</a>

<div class="upload">
<% form_for :asset, :html => { :id => "upload", :multipart => true } do |f| %>



<div id="upload_progress_bar" style="display:none">
<div id="progressbar">&nbsp;</div>
<div id="percents"></div>
</div>
<div id="progressbar">&nbsp;</div>
<div id="percents"></div>
</div>

<%= f.text_area :comment, :rows => 15, :cols => 5 %><br>

Expand All @@ -35,78 +32,61 @@

<hr class="space" />

<% content_for :sidebar do %>
<div id="dropzone">
...or drag and drop in here
</div>
<% end %>


<script type="text/javascript" charset="utf-8">
$(document).ready(function() {
var interval;

var upload = new AjaxUpload( $('#upload_button'), {
action: '/assets?X-Progress-ID=<%= @file_id %>',
onSubmit : function(file, ext){
var v = $('input[name=authenticity_token]').val();

this.setData({
'authenticity_token': v,
'X-Progress-ID': <%= @file_id %>
});

$('#upload_button').hide();
$('#upload_progress_bar').show();

// If you want to allow uploading only 1 file at time,
// you can disable upload button
this.disable();

// Uploding -> Uploading. -> Uploading...
interval = window.setInterval(function(){

jQuery.ajax({
type: "GET",
url: "/process?X-Progress-ID=<%= @file_id %>",
dataType: "json",
success: function(upload) {
if (upload.state == 'uploading') {
$('#percents').text = upload.received
// upload.percents = Math.floor((upload.received / upload.size)*1000)/10;
//
// var bar = $.browser.safari ? $(options.progressBar, parent.document) : $(options.progressBar);
// bar.css({width: upload.percents+'%'});
// options.uploading(upload);
}

if (upload.state == 'done' || upload.state == 'error') {
//window.clearTimeout(interval);
//options.complete(upload);
}

if (upload.state == 'done') {
//options.success(upload);
}

if (upload.state == 'error') {
//options.error(upload);
}
}
});

}, 1000);
},
onComplete: function(file, response){
alert('done');
window.clearInterval(interval);

// enable upload button
this.enable();

// add file to the list
$('<li></li>').appendTo('#example1 .files').text(file);
}
});
var interval;

var upload = new AjaxUpload( $('#upload_button'), {
action: '/assets?X-Progress-ID=<%= @file_id %>',
onSubmit : function(file, ext){
var v = $('input[name=authenticity_token]').val();

this.setData({
'authenticity_token': v,
'X-Progress-ID': <%= @file_id %>
});

$('#upload_button').hide();
$('#upload_progress_bar').show();
this.disable();

// Uploding -> Uploading. -> Uploading...
interval = window.setInterval(function(){
jQuery.ajax({
type: "GET",
url: "/progress?X-Progress-ID=<%= @file_id %>",
dataType: "json",
success: function(upload) {
if (upload.state == 'uploading') {
upload.percents = Math.floor((upload.received / upload.size)*1000)/10;
$('#percents').html(upload.percents);
//
// var bar = $.browser.safari ? $(options.progressBar, parent.document) : $(options.progressBar);
// bar.css({width: upload.percents+'%'});
// options.uploading(upload);
}

if (upload.state == 'done' || upload.state == 'error') {
window.clearInterval(interval);
$('#upload_button').show();
$('#upload_progress_bar').hide();
this.enable();
}
if (upload.state == 'error') {
alert("Error");
}
}
});
}, 1000);

},
onComplete: function(file, response){
alert(file);
window.clearInterval(interval);
this.enable();
}
});

});
</script>
35 changes: 35 additions & 0 deletions config/deploy.rb
View file
@@ -0,0 +1,35 @@

set :application, "fup"

set :use_sudo, false

# If you aren't deploying to /u/apps/#{application} on the target
# servers (which is the default), you can specify the actual location
# via the :deploy_to variable:
set :deploy_to, "/kunden/warteschlange.de/produktiv/rails/fup"

# If you aren't using Subversion to manage your source code, specify
# your SCM below:
set :scm, :git
set :repository, "git://github.com/rngtng/FileUploadProgress.git"
set :branch, "master"
set :deploy_via, :remote_cache

set :user, 'ssh-21560'
set :ssh_options, { :forward_agent => true }

role :app, "fup.warteschlange.de"
role :web, "fup.warteschlange.de"
role :db, "fup.warteschlange.de", :primary => true

namespace :deploy do
desc "Restarting mod_rails with restart.txt"
task :restart, :roles => :app, :except => { :no_release => true } do
run "touch #{current_path}/tmp/restart.txt"
end

[:start, :stop].each do |t|
desc "#{t} task is a no-op with mod_rails"
task t, :roles => :app do ; end
end
end
8 changes: 5 additions & 3 deletions public/stylesheets/cstyles.css
View file
Expand Up @@ -59,9 +59,7 @@ div.flash.error {

#upload_progress_bar {
width: 400px;
}

#progress {
color: black;
background: #eee;
border: 1px solid #222;
margin-top: 0px;
Expand All @@ -73,6 +71,10 @@ div.flash.error {
background: #333;
}

#percents {
color: black;
}

/**********************************************/

input {
Expand Down

0 comments on commit b75819b

Please sign in to comment.