Commit ccd01233360d120ea9af9a2617a7d8b3ef613bc0

Authored by Fernando Brito
1 parent 1729021c
Exists in master and in 2 other branches v2, wikilibras

[Workflow] Bigger pictures on size step

app/assets/javascripts/v_libras/requests/workflow.js
... ... @@ -58,7 +58,7 @@ var VLibrasLocalization = function() {
58 58 image.attr('id', _options.buttons[index].id);
59 59 image.data('value', _options.buttons[index].value);
60 60 image.attr('data-value', _options.buttons[index].value);
61   - image.css('position', 'relative');
  61 + image.css('position', 'absolute');
62 62 image.css('top', _options.buttons[index].y);
63 63 image.css('left', _options.buttons[index].x);
64 64  
... ...
app/assets/stylesheets/v_libras/requests.css.scss
1 1 #vlibras-wizard {
2   - .actions {
3   - display: none;
4   - }
5   -
6   - img {
7   - border: 0;
8   - }
  2 + #b1_size_big, #b2_size_big, #b1_size_med, #b2_size_med, #b1_size_small, #b2_size_small {
  3 + opacity: 0.4;
9 4  
10   - .wrapper {
11   - margin: 0 auto;
  5 + &:hover {
  6 + opacity: 1;
  7 + }
12 8 }
13 9  
14   - #b_size_4 {
15   - z-index: 3;
16   - opacity: 0.4;
  10 + #b1_size_big, #b2_size_big {
  11 + img { width: 350px; }
  12 + z-index: 1;
17 13 }
18 14  
19   - #b_size_4:hover {
20   - opacity: 1;
  15 + #b1_size_med, #b2_size_med {
  16 + img { width: 280px; }
  17 + z-index: 2;
21 18 }
22 19  
23   - #b_size_5 {
24   - z-index: 2;
25   - opacity: 0.4;
  20 + #b1_size_small, #b2_size_small {
  21 + img { width: 220px; }
  22 + z-index: 3;
26 23 }
27 24  
28   - #b_size_5:hover {
29   - opacity: 1;
  25 + .actions {
  26 + display: none;
30 27 }
31 28  
32   - #b_size_6 {
33   - z-index: 1;
34   - opacity: 0.4;
  29 + img {
  30 + border: 0;
35 31 }
36 32  
37   - #b_size_6:hover {
38   - opacity: 1;
  33 + .wrapper {
  34 + margin: 0 auto;
39 35 }
40 36  
41 37 label {
... ...
app/views/layouts/application.html.erb
... ... @@ -10,6 +10,8 @@
10 10 <%= yield :css %>
11 11 <%= stylesheet_link_tag "application", :media => "all" %>
12 12  
  13 + <%= yield :css_code %>
  14 +
13 15  
14 16 <%= csrf_meta_tags %>
15 17 <meta name="viewport" content="width=device-width, initial-scale=1.0">
... ...
app/views/v_libras/requests/_position_step.haml
... ... @@ -13,9 +13,9 @@
13 13 { 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 },
14 14 { id: 'b_loc_4', path: '/system/images/loc/p_4.png', clickable: false, start: 14, end: 14.5, x: 650, y: 80, delay: 300, value: null },
15 15 { id: 'b_loc_5', path: '/system/images/loc/p_4.png', clickable: true, start: 19.1, end: 9999, x: 30, y: 30, delay: 300, value: "superior-esquerdo" },
16   - { id: 'b_loc_6', path: '/system/images/loc/p_3.png', clickable: true, start: 19.1, end: 9999, x: 680, y: 30, delay: 300, value: "superior-direito" },
17   - { id: 'b_loc_7', path: '/system/images/loc/p_1.png', clickable: true, start: 19.1, end: 9999, x: 568, y: 410, delay: 300, value: "inferior-direito" },
18   - { id: 'b_loc_8', path: '/system/images/loc/p_2.png', clickable: true, start: 19.1, end: 9999, x: -310, y: 410, delay: 300, value: "inferior-esquerdo" }
  16 + { id: 'b_loc_6', path: '/system/images/loc/p_3.png', clickable: true, start: 19.1, end: 9999, x: 800, y: 30, delay: 300, value: "superior-direito" },
  17 + { id: 'b_loc_7', path: '/system/images/loc/p_1.png', clickable: true, start: 19.1, end: 9999, x: 800, y: 410, delay: 300, value: "inferior-direito" },
  18 + { id: 'b_loc_8', path: '/system/images/loc/p_2.png', clickable: true, start: 19.1, end: 9999, x: 30, y: 410, delay: 300, value: "inferior-esquerdo" }
19 19 ]
20 20 };
21 21  
... ...
app/views/v_libras/requests/_service_step.haml
... ... @@ -19,7 +19,7 @@
19 19 buttons: [ { 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 },
20 20 { 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 },
21 21 { id: 'btn-video-legenda', path: '/system/images/sub_audio/p_1.png', clickable: true, start: 26, end: 9999, x: 790, y: 410, delay: 300 },
22   - { id: 'btn-video', path: '/system/images/sub_audio/p_2.png', clickable: true, start: 26, end: 9999, x: -80, y: 410, delay: 300 }
  22 + { id: 'btn-video', path: '/system/images/sub_audio/p_2.png', clickable: true, start: 26, end: 9999, x: 35, y: 410, delay: 300 }
23 23 ]
24 24 };
25 25  
... ...
app/views/v_libras/requests/_size_step.haml
... ... @@ -3,17 +3,18 @@
3 3  
4 4 = html5_video_tag(['/system/videos/workflow/tamanho.webm', '/system/videos/workflow/tamanho.mp4'], 'id-3', 'video-wizard')
5 5  
  6 +
6 7 - content_for :javascript_code do
7 8 :javascript
8 9 $(function () {
9 10 var optionsSize = {
10 11 video: { width: 940, height: 530 },
11   - buttons: [ { id: 'b_size_1', path: '/system/images/size/p_1.png', clickable: false, start: 6.8, end: 7.8, x: 770, y: 400, delay: 300, value: null },
12   - { id: 'b_size_2', path: '/system/images/size/p_2.png', clickable: false, start: 8.2, end: 9.2, x: 714, y: 355, delay: 300, value: null },
13   - { id: 'b_size_3', path: '/system/images/size/p_3.png', clickable: false, start: 9.7, end: 10.7, x: 658, y: 310, delay: 300, value: null},
14   - { id: 'b_size_4', path: '/system/images/size/p_1.png', clickable: true, start: 11.3, end: 9999, x: 780, y: 320, delay: 300, value: "pequeno" },
15   - { id: 'b_size_5', path: '/system/images/size/p_2.png', clickable: true, start: 11.3, end: 9999, x: 610, y: 320, delay: 300, value: "medio" },
16   - { id: 'b_size_6', path: '/system/images/size/p_3.png', clickable: true, start: 11.3, end: 9999, x: 384, y: 320, delay: 300, value: "grande" }
  12 + buttons: [ { id: 'b1_size_small', path: '/system/images/size/p_1.png', clickable: false, start: 6.8, end: 7.8, x: 770, y: 400, delay: 300, value: null },
  13 + { id: 'b1_size_med', path: '/system/images/size/p_2.png', clickable: false, start: 8.2, end: 9.2, x: 714, y: 355, delay: 300, value: null },
  14 + { id: 'b1_size_big', path: '/system/images/size/p_3.png', clickable: false, start: 9.7, end: 10.7, x: 658, y: 310, delay: 300, value: null},
  15 + { id: 'b2_size_small', path: '/system/images/size/p_1.png', clickable: true, start: 11.3, end: 9999, x: 688, y: 338, delay: 300, value: "pequeno" },
  16 + { id: 'b2_size_med', path: '/system/images/size/p_2.png', clickable: true, start: 11.3, end: 9999, x: 628, y: 292, delay: 300, value: "medio" },
  17 + { id: 'b2_size_big', path: '/system/images/size/p_3.png', clickable: true, start: 11.3, end: 9999, x: 560, y: 240, delay: 300, value: "grande" }
17 18 ]
18 19 };
19 20  
... ...