[Workflow] Remove "next" button and make things automatic

Fernando Brito
1 parent d6ef46dd
Showing 8 changed files with 32 additions and 23 deletions Show diff stats
app/assets/javascripts/v_libras/requests/new.js
app/helpers/application_helper.rb
app/views/v_libras/requests/_position_step.haml
app/views/v_libras/requests/_service_step.haml
app/views/v_libras/requests/_size_step.haml
app/views/v_libras/requests/_video_step.haml
app/views/v_libras/requests/new.haml
vendor/assets/stylesheets/jquery.steps.css
@@ -7,6 +7,8 @@ $(function () {
         enablePagination: true,
         forceMoveForward: true,
+        // startIndex: 1,
+
         onStepChanged: stepChanged,
         onFinished: finished,
@@ -110,12 +112,13 @@ $(function () {
         console.debug("Serviço: video-legenda");
         $("#vlibras-form").addHidden('service', 'video-legenda');
-        $("#subtitle-upload").parent().parent().show();
-        $("#menu").show();
+        // $("#subtitle-upload-container").show();
+        $("#subtitle-upload").click();
+        // $("#menu").show();
-        $('html, body').animate({
-            scrollTop: $("#subtitle-upload").offset().top
-        }, 600);
+        // $('html, body').animate({
+        //     scrollTop: $("#subtitle-upload").offset().top
+        // }, 600);
         return false;
     });
@@ -129,6 +132,12 @@ $(function () {
         return false;
     });
+    $("#vlibras-wizard").on("click", "#btn-video-upload", function() {
+        $("#video-upload").click();
+
+        return false;
+    });
+
     /*
@@ -150,9 +159,8 @@ $(function () {
         var isValidFile = checkType(input, acceptedFileTypes);
         if (isValidFile) {
-            activateNextButton();
+            $("#vlibras-wizard").steps('next');
         } else {
-            deactivateNextButton();
             input.val(null);
             alert("Apenas os formatos abaixo são aceitos:\n\n" + acceptedFileTypes.join(", "));
         }
@@ -46,14 +46,14 @@ module ApplicationHelper
                 :data => { 'toggle' => "tooltip" }, :title => request.response)
   end
-  def html5_video_tag(url, id, classes, data_options, *args)
+  def html5_video_tag(url, id, classes, data_options = nil, *args)
     options = args.first || {}
     options[:id] = id
     options[:class] = "video-js vjs-default-skin vjs-big-play-centered #{classes}"
     options[:width] = 'auto'
     options[:height] = 'auto'
-    options['data-setup'] = data_options
+    options['data-setup'] = data_options if data_options != nil
     content_tag(:video, options) do
       if url.class == String
@@ -2,15 +2,15 @@
   .video_wrapper
   = html5_video_tag(['/system/videos/workflow/localizacao.webm', '/system/videos/workflow/localizacao.mp4'],
-        'id-4', 'video-wizard', '{ "preload": true, "controls": false }')
+        'id-4', 'video-wizard', '{ "preload": "none", "controls": false }')
 - content_for :javascript_code do
   :javascript
     $(function () {
       var optionsPosition = {
           video: { width: 940, height: 530 },
-          buttons: [ { id: 'btn-red-light3', path: '/system/images/video/red-button.png', clickable: false, start: 0.1, end: 19.5, x: 440, y: 510, delay: 300, value: null },
-                     { id: 'btn-green-light3', path: '/system/images/video/green-button.png', clickable: false, start: 19.5, end: 999, x: 440, y: 510, delay: 300, value: null },
+          buttons: [ { id: 'btn-red-light3', path: '/system/images/video/red-button.png', clickable: false, start: 0.1, end: 19.1, x: 440, y: 510, delay: 300, value: null },
+                     { id: 'btn-green-light3', path: '/system/images/video/green-button.png', clickable: false, start: 19.1, end: 999, x: 440, y: 510, delay: 300, value: null },
                      { id: 'b_loc_1', path: '/system/images/loc/p_1.png', clickable: false, start: 7.6, end: 8.5, x: 670, y: 340, delay: 300, value: null },
                      { id: 'b_loc_2', path: '/system/images/loc/p_2.png', clickable: false, start: 10, end: 10.5, x: 160, y: 340, delay: 300, value: null },
                      { id: 'b_loc_3', path: '/system/images/loc/p_3.png', clickable: false, start: 12, end: 12.5, x: 210, y: 40, delay: 300, value: null },
@@ -2,7 +2,7 @@
   .video_wrapper
   = html5_video_tag(['/system/videos/workflow/sub_audio.webm', '/system/videos/workflow/sub_audio.mp4'],
-      'id-2', 'video-wizard', '{ "preload": true, "controls": false }')
+      'id-2', 'video-wizard', '{ "preload": "none", "controls": false }')
   .row-fluid.hide
     .span1.offset3
@@ -17,8 +17,8 @@
     $(function () {
       var optionsService = {
           video: { width: 940, height: 530 },
-          buttons: [ { id: 'btn-red-light2', path: '/system/images/video/red-button.png', clickable: false, start: 0.1, end: 26.5, x: 440, y: 510, delay: 300, value: null },
-                     { id: 'btn-green-light2', path: '/system/images/video/green-button.png', clickable: false, start: 26.5, end: 999, x: 440, y: 510, delay: 300, value: null },
+          buttons: [ { id: 'btn-red-light2', path: '/system/images/video/red-button.png', clickable: false, start: 0.1, end: 26, x: 440, y: 510, delay: 300, value: null },
+                     { id: 'btn-green-light2', path: '/system/images/video/green-button.png', clickable: false, start: 26, end: 999, x: 440, y: 510, delay: 300, value: null },
                      { id: 'b_aS_1', path: '/system/images/sub_audio/p_1.png', clickable: false, start: 20, end: 21, x: 700, y: 390, delay: 300, value: null },
                      { id: 'b_aS_2', path: '/system/images/sub_audio/p_2.png', clickable: false, start: 24.5, end: 25.5, x: 150, y: 410, delay: 300, value: null },
                      { id: 'btn-video-legenda', path: '/system/images/sub_audio/p_1.png', clickable: true, start: 26, end: 9999, x: 790, y: 410, delay: 300 },
@@ -2,7 +2,7 @@
   .video_wrapper
   = html5_video_tag(['/system/videos/workflow/tamanho.webm', '/system/videos/workflow/tamanho.mp4'],
-        'id-3', 'video-wizard', '{ "preload": true, "controls": false }')
+        'id-3', 'video-wizard', '{ "preload": "none", "controls": false }')
 - content_for :javascript_code do
@@ -10,8 +10,8 @@
     $(function () {
       var optionsSize = {
           video: { width: 940, height: 530 },
-          buttons: [ { id: 'btn-red-light4', path: '/system/images/video/red-button.png', clickable: false, start: 0.1, end: 11.5, x: 440, y: 510, delay: 300, value: null },
-                     { id: 'btn-green-light4', path: '/system/images/video/green-button.png', clickable: false, start: 11.5, end: 999, x: 440, y: 510, delay: 300, value: null },
+          buttons: [ { id: 'btn-red-light4', path: '/system/images/video/red-button.png', clickable: false, start: 0.1, end: 11.3, x: 440, y: 510, delay: 300, value: null },
+                     { id: 'btn-green-light4', path: '/system/images/video/green-button.png', clickable: false, start: 11.3, end: 999, x: 440, y: 510, delay: 300, value: null },
                      { id: 'b1_size_small', path: '/system/images/size/p_1.png', clickable: false, start: 6.8, end: 7.8, x: 688, y: 338, delay: 300, value: null },
                      { id: 'b1_size_med', path: '/system/images/size/p_2.png', clickable: false, start: 8.2, end: 9.2, x: 628, y: 292, delay: 300, value: null },
                      { id: 'b1_size_big', path: '/system/images/size/p_3.png', clickable: false, start: 9.7, end: 10.7, x: 560, y: 240, delay: 300, value: null},
@@ -2,9 +2,9 @@
   .video_wrapper
   = html5_video_tag(['/system/videos/workflow/video.webm', '/system/videos/workflow/video.mp4'],
-    'id-1', 'video-wizard', '{ "autoplay": true, "controls": false }')
+    'video-video', 'video-wizard', '{ "autoplay": true, "controls": false } ')
-  .row-fluid
+  .row-fluid.hide
     .span1.offset3
       = label_tag :video, t('videos.url'), :class => "bold"
@@ -21,7 +21,8 @@
       var optionsVideo = {
           video: { width: 940, height: 530 },
           buttons: [ { id: 'btn-red-light1', path: '/system/images/video/red-button.png', clickable: false, start: 0.1, end: 25, x: 440, y: 510, delay: 300, value: null },
-                     { id: 'btn-green-light1', path: '/system/images/video/green-button.png', clickable: false, start: 25, end: 999, x: 440, y: 510, delay: 300, value: null }
+                     { id: 'btn-green-light1', path: '/system/images/video/green-button.png', clickable: false, start: 25, end: 999, x: 440, y: 510, delay: 300, value: null },
+                     { id: 'btn-video-upload', path: '/system/images/sub_audio/p_2.png', clickable: true, start: 25, end: 9999, x: 415, y: 410, delay: 300 }
           ]
       };
@@ -32,7 +32,7 @@
       %section
         = render :partial => 'size_step'
-    #menu.center
+    #menu.center.hide
       = button_tag 'Próximo', :class => "btn btn-large btn-success", :id => 'btn-next', :disabled => true
 .row-fluid
@@ -142,7 +142,7 @@
     background: #eee;
     display: block;
     margin: 0.5em;
-    min-height: 45em;
+    min-height: 41.5em;
     overflow: hidden;
     position: relative;
     width: auto;
	@@ -46,14 +46,14 @@ module ApplicationHelper		@@ -46,14 +46,14 @@ module ApplicationHelper
46	:data => { 'toggle' => "tooltip" }, :title => request.response)	46	:data => { 'toggle' => "tooltip" }, :title => request.response)
47	end	47	end
48		48
49	- def html5_video_tag(url, id, classes, data_options, *args)	49	+ def html5_video_tag(url, id, classes, data_options = nil, *args)
50	options = args.first \|\| {}	50	options = args.first \|\| {}
51		51
52	options[:id] = id	52	options[:id] = id
53	options[:class] = "video-js vjs-default-skin vjs-big-play-centered #{classes}"	53	options[:class] = "video-js vjs-default-skin vjs-big-play-centered #{classes}"
54	options[:width] = 'auto'	54	options[:width] = 'auto'
55	options[:height] = 'auto'	55	options[:height] = 'auto'
56	- options['data-setup'] = data_options	56	+ options['data-setup'] = data_options if data_options != nil
57		57
58	content_tag(:video, options) do	58	content_tag(:video, options) do
59	if url.class == String	59	if url.class == String
	@@ -32,7 +32,7 @@		@@ -32,7 +32,7 @@
32	%section	32	%section
33	= render :partial => 'size_step'	33	= render :partial => 'size_step'
34		34
35	- #menu.center	35	+ #menu.center.hide
36	= button_tag 'Próximo', :class => "btn btn-large btn-success", :id => 'btn-next', :disabled => true	36	= button_tag 'Próximo', :class => "btn btn-large btn-success", :id => 'btn-next', :disabled => true
37		37
38	.row-fluid	38	.row-fluid
	@@ -142,7 +142,7 @@		@@ -142,7 +142,7 @@
142	background: #eee;	142	background: #eee;
143	display: block;	143	display: block;
144	margin: 0.5em;	144	margin: 0.5em;
145	- min-height: 45em;	145	+ min-height: 41.5em;
146	overflow: hidden;	146	overflow: hidden;
147	position: relative;	147	position: relative;
148	width: auto;	148	width: auto;