Download as
Browse Code »

Commit d5463318aa2bf4b36d1baf7d88f4f9c5a4949b74

Authored by Fernando Brito
1 parent 3259d858
Exists in master and in 1 other branch v2

Progress bar on rapid VLibras

Showing 7 changed files with 121 additions and 15 deletions   Show diff stats
Gemfile
  Diff comments   View file @d546331
... ... @@ -14,6 +14,7 @@ gem 'less-rails'
14 14 gem 'uglifier', '>= 1.3.0'
15 15 gem 'coffee-rails', '~> 4.0.0'
16 16 gem 'jquery-rails'
  17 +gem 'jquery.fileupload-rails'
17 18  
18 19 gem 'httmultiparty'
19 20  
... ...
Gemfile.lock
  Diff comments   View file @d546331
... ... @@ -212,6 +212,9 @@ GEM
212 212 thor (>= 0.14, < 2.0)
213 213 jquery-ui-rails (4.2.1)
214 214 railties (>= 3.2.16)
  215 + jquery.fileupload-rails (1.9.0)
  216 + jquery-ui-rails (>= 3.0, < 5.0)
  217 + railties (>= 3.1)
215 218 json (1.8.1)
216 219 kaminari (0.15.1)
217 220 actionpack (>= 3.0.0)
... ... @@ -447,6 +450,7 @@ DEPENDENCIES
447 450 httmultiparty
448 451 inherited_resources
449 452 jquery-rails
  453 + jquery.fileupload-rails
450 454 kaminari
451 455 kaminari-bootstrap (~> 0.1.3)
452 456 launchy
... ...
app/assets/javascripts/application.js
  Diff comments   View file @d546331
... ... @@ -12,6 +12,6 @@
12 12 //
13 13 //= require jquery
14 14 //= require jquery_ujs
  15 +//= require jquery.fileupload
15 16 //= require twitter/bootstrap
16   -//= require websocket_rails/main
17   -
  17 +//= require websocket_rails/main
18 18 \ No newline at end of file
... ...
app/assets/javascripts/v_libras/requests/rapid.js
  Diff comments   View file @d546331
  1 +/*
  2 + * jquery-File-Upload
  3 + */
  4 +$(function() {
  5 + var videoFile;
  6 + var subtitleFile;
  7 +
  8 + function uploadFiles() {
  9 + if (subtitleFile == null) {
  10 + files = [videoFile];
  11 + params = ['video'];
  12 + } else {
  13 + files = [videoFile, subtitleFile];
  14 + params = ['video', 'subtitle'];
  15 + }
  16 +
  17 + $('#vlibras-rapid-form').fileupload('send',
  18 + { files: files,
  19 + paramName: params });
  20 + }
  21 +
  22 + $('#vlibras-rapid-form').fileupload({
  23 + autoUpload: false,
  24 + singleFileUploads: false,
  25 + limitConcurrentUploads: 1,
  26 +
  27 + always: function(e, data) {
  28 + location.href = data.jqXHR.responseJSON.redirect_to;
  29 + },
  30 +
  31 + add: function(e, data) {
  32 + if (data.fileInput[0].name === 'video') {
  33 + videoFile = data.files[0];
  34 + } else if (data.fileInput[0].name === 'subtitle') {
  35 + subtitleFile = data.files[0];
  36 + };
  37 +
  38 + $("#submit-button").unbind('click').on('click', function(event) {
  39 + $(".field").hide();
  40 + $(".progress").show();
  41 + $("#submit-button").hide();
  42 + $("#vlibras-rapid h2").text("Enviando...");
  43 +
  44 + uploadFiles();
  45 +
  46 + event.preventDefault();
  47 + });
  48 + }
  49 + });
  50 +
  51 + $("#vlibras-rapid-form").bind("fileuploadprogress", function (e, data) {
  52 + var percentage = Math.round(data.loaded / data.total * 100);
  53 + var bitrate = Math.round(data.bitrate / 8 / 1024 * 100) / 100 + " KB/s";
  54 +
  55 + $("#upload-bar").css("width", percentage + "%");
  56 + $("#upload-label").text(percentage + "% (" + bitrate + ")");
  57 + });
  58 +});
  59 +
  60 +
  61 +
  62 +/*
  63 + * Radio box service (video or video-subtitle)
  64 + */
  65 +
1 66 $(function() {
2 67 $("#service-video").click(function() {
3 68 $("#url").show('slow');
4 69 $("#legend").hide('slow');
5 70 });
6 71  
7   - $("#vlibras-rapid").submit(function() {
8   - $("#vlibras-rapid #submit-button").prop('disabled', true);
9   - $("#vlibras-rapid #submit-button").attr("value", "Enviando...");
10   - });
11   -
12 72 $("#service-video-subtitle").click(function() {
13   - $("#url").show('slow');
14   - $("#legend").show('slow');
  73 + $("#url").show("slow");
  74 + $("#legend").show("slow");
15 75 });
16 76  
17 77 /* When user press "Back" on the browser */
... ... @@ -48,7 +108,16 @@ $(function() {
48 108 alert("Apenas os formatos abaixo são aceitos:\n\n" + acceptedFileTypes.join(", "));
49 109 }
50 110  
  111 + updateButton(input);
  112 +
51 113 return true;
52 114 }
  115 +
  116 + function updateButton(input) {
  117 + var filename = input.val().split("\\").pop();
  118 + var buttonText = "Arquivo: " + filename;
  119 +
  120 + input.parent().find(".button-text").text(buttonText);
  121 + }
53 122 });
54 123  
... ...
app/assets/stylesheets/bootstrap_overrides.css.scss
  Diff comments   View file @d546331
... ... @@ -55,6 +55,23 @@
55 55 overflow: auto;
56 56 }
57 57  
  58 +.fileinput-button {
  59 + position: relative;
  60 + overflow: hidden;
  61 +}
  62 +
  63 +.fileinput-button input {
  64 + position: absolute;
  65 + top: 0;
  66 + right: 0;
  67 + margin: 0;
  68 + opacity: 0;
  69 + -ms-filter: 'alpha(opacity=0)';
  70 + font-size: 200px;
  71 + direction: ltr;
  72 + cursor: pointer;
  73 +}
  74 +
58 75 /* Fix menu */
59 76 @media (max-width: 767px) {
60 77 .nav-collapse.user-menu {
... ...
app/controllers/v_libras/requests_controller.rb
  Diff comments   View file @d546331
... ... @@ -20,7 +20,7 @@ class VLibras::RequestsController &lt; ApplicationController
20 20  
21 21 flash[:success] = 'Sua requisição foi submetida com sucesso!'
22 22  
23   - redirect_to v_libras_videos_path('video-wait' => true)
  23 + render json: { status: 'ok', redirect_to: v_libras_videos_path('video-wait' => true)}, status: 200
24 24 else
25 25 flash[:error] = 'Algo deu errado com a sua requisição. Por favor verifique opções escolhidas.'
26 26 flash[:warning] = @request.errors.full_messages.to_sentence.humanize
... ... @@ -28,7 +28,8 @@ class VLibras::RequestsController &lt; ApplicationController
28 28 # Warning: this code is also present on #perform_request, if the request is successfully done
29 29 @request.files.values.each { |f| f.file.delete }
30 30  
31   - redirect_to :back
  31 + # same as redirect :back
  32 + render json: { status: 'error', redirect_to: request.headers["Referer"]}, status: 400
32 33 end
33 34 end
34 35  
... ...
app/views/v_libras/requests/rapid.haml
  Diff comments   View file @d546331
... ... @@ -7,7 +7,7 @@
7 7 %h2
8 8 = t('videos.new')
9 9  
10   - = form_tag v_libras_requests_path, method: :post, :multipart => true do |f|
  10 + = form_tag v_libras_requests_path, method: :post, :multipart => true, :id => 'vlibras-rapid-form' do |f|
11 11 - if @request.errors.any?
12 12 #error_explanation
13 13 %p/
... ... @@ -30,11 +30,21 @@
30 30  
31 31 #url.field.hide
32 32 = label_tag :video, t('videos.url'), :class => "bold"
33   - = file_field_tag :video, :prompt => "Arquivo de vídeo", :id => 'video-upload'
  33 +
  34 + %span.btn.fileinput-button
  35 + %i.icon-film
  36 + %span.button-text Escolha o vídeo...
  37 + = file_field_tag :video, :prompt => "Arquivo de vídeo", :id => 'video-upload',
  38 + :accept => '.flv, .ts, .avi, .mp4, .mov, .webm, .wmv, .mkv'
34 39  
35 40 #legend.field.hide
36 41 = label_tag :subtitle, t('videos.subtitle'), :class => "bold"
37   - = file_field_tag :subtitle, :prompt => "Legenda", :id => 'subtitle-upload'
  42 +
  43 + %span.btn.fileinput-button
  44 + %i.icon-list-alt
  45 + %span.button-text Escolha a legenda...
  46 + = file_field_tag :subtitle, :prompt => "Arquivo de legenda", :id => 'subtitle-upload',
  47 + :accept => '.srt'
38 48  
39 49 .field
40 50 = label_tag 'params[tamanho]', t('videos.window_size'), :class => "bold"
... ... @@ -51,5 +61,9 @@
51 61 .field.hide
52 62 = label_tag 'params[transparencia]', t('videos.transparency'), :class => "bold"
53 63 = select_tag 'params[transparencia]', options_for_select([['Opaco', 'opaco'], ['Transparente', 'transparente']])
54   - = submit_tag "Confirmar", :class => "btn btn-success btn-large actions", :id => 'submit-button'
55 64  
  65 + .progress.progress-striped.active.hide{:style => 'position: relative;'}
  66 + #upload-bar.bar
  67 + #upload-label.center{:style => 'position: absolute; width: 100%; font-size: 12px;'}
  68 +
  69 + = button_tag "Confirmar", :class => "btn btn-success btn-large actions", :id => 'submit-button'
56 70 \ No newline at end of file
... ...