Commit dd55e8f9f6a9a8a7ed600ee0739959bd79d48d03
1 parent
88b5a9ba
Exists in
master
and in
2 other branches
User login page. Menu in partial. CSS tweaks
Showing
11 changed files
with
76 additions
and
252 deletions
Show diff stats
app/assets/stylesheets/application.css.scss
... | ... | @@ -13,68 +13,34 @@ |
13 | 13 | *= require 'bootstrap' |
14 | 14 | *= require 'bootstrap_overrides' |
15 | 15 | *= require 'v_libras/videos' |
16 | + *= require 'components/ribbon' | |
17 | + *= require 'components/video_player' | |
16 | 18 | *= require_self |
17 | 19 | */ |
18 | 20 | |
21 | +.login { | |
22 | + padding: 3% 4%; | |
23 | + text-align: center; | |
19 | 24 | |
20 | -.ribbon-wrapper-green { | |
21 | - margin: 10px auto; | |
22 | - width: 203px; | |
23 | - height: 144px; | |
24 | - overflow: hidden; | |
25 | - top: -3px; | |
26 | - right: -3px; | |
27 | - | |
28 | - padding-top: 3px; | |
29 | -} | |
25 | + -moz-box-shadow: 0 0 5px 5px #888; | |
26 | + -webkit-box-shadow: 0 0 5px 5px #888; | |
27 | + box-shadow: 0 0 5px 5px #888; | |
30 | 28 | |
31 | -.ribbon-content img { | |
32 | - border-radius: 3px; | |
33 | - -webkit-box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.3); | |
34 | - -moz-box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.3); | |
35 | - box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.3); | |
36 | -} | |
29 | + h2 { | |
30 | + color :#000; | |
31 | + text-align: center; | |
32 | + margin-bottom: 20px; | |
37 | 33 | |
38 | -.ribbon-green { | |
39 | - font: bold 15px Sans-Serif; | |
40 | - color: #333; | |
41 | - text-align: center; | |
42 | - text-shadow: rgba(255,255,255,0.5) 0px 1px 0px; | |
43 | - -webkit-transform: rotate(45deg); | |
44 | - -moz-transform: rotate(45deg); | |
45 | - -ms-transform: rotate(45deg); | |
46 | - -o-transform: rotate(45deg); | |
47 | - position: relative; | |
48 | - padding: 5px 0; | |
49 | - left: 118px; | |
50 | - bottom: 124px; | |
51 | - width: 110px; | |
52 | - background-color: #BFDC7A; | |
53 | - background-image: -webkit-gradient(linear, left top, left bottom, from(#BFDC7A), to(#8EBF45)); | |
54 | - background-image: -webkit-linear-gradient(top, #BFDC7A, #8EBF45); | |
55 | - background-image: -moz-linear-gradient(top, #BFDC7A, #8EBF45); | |
56 | - background-image: -ms-linear-gradient(top, #BFDC7A, #8EBF45); | |
57 | - background-image: -o-linear-gradient(top, #BFDC7A, #8EBF45); | |
58 | - color: #6a6340; | |
59 | - -webkit-box-shadow: 0px 0px 3px rgba(0,0,0,0.3); | |
60 | - -moz-box-shadow: 0px 0px 3px rgba(0,0,0,0.3); | |
61 | - box-shadow: 0px 0px 3px rgba(0,0,0,0.3); | |
62 | -} | |
63 | - | |
64 | -.ribbon-green:before, .ribbon-green:after { | |
65 | - content: ""; | |
66 | - border-top: 3px solid #6e8900; | |
67 | - border-left: 3px solid transparent; | |
68 | - border-right: 3px solid transparent; | |
69 | - position:absolute; | |
70 | - bottom: -3px; | |
71 | -} | |
34 | + -moz-box-shadow: 0 0 5px 5px #CCC; | |
35 | + -webkit-box-shadow: 0 0 5px 5px #CCC; | |
36 | + box-shadow: 0 0 5px 5px #CCC; | |
37 | + } | |
72 | 38 | |
73 | -.ribbon-green:before { | |
74 | - left: 0; | |
75 | -} | |
76 | -.ribbon-green:after { | |
77 | - right: 0; | |
39 | + h3 { | |
40 | + text-align:center; | |
41 | + color:#BBB; | |
42 | + text-shadow: 1px 1px #AAA; | |
43 | + } | |
78 | 44 | } |
79 | 45 | |
80 | 46 | @media (max-width: 980px) { | ... | ... |
app/assets/stylesheets/bootstrap.css.less
... | ... | @@ -19,19 +19,15 @@ body { |
19 | 19 | @linkColorHover: darken(@linkColor, 15%); |
20 | 20 | |
21 | 21 | footer { |
22 | + margin-top: 20px; | |
22 | 23 | background-color: #d6d6d6; |
23 | 24 | text-align:center; |
24 | - padding:2%; | |
25 | + padding: 2%; | |
25 | 26 | -moz-box-shadow: 10px 10px 5px #888; |
26 | 27 | -webkit-box-shadow: 10px 10px 5px #888; |
27 | 28 | box-shadow: 10px 10px 5px #888; |
28 | 29 | } |
29 | 30 | |
30 | -#order_chart_user{ | |
31 | - height:300px; | |
32 | - width:700px; | |
33 | - margin-left:150px; | |
34 | -} | |
35 | 31 | .center_box{ |
36 | 32 | margin-left:10%; |
37 | 33 | width:100%; |
... | ... | @@ -54,32 +50,6 @@ footer { |
54 | 50 | |
55 | 51 | } |
56 | 52 | |
57 | -.login{ | |
58 | - min-width:250px; | |
59 | - padding:5%; | |
60 | - margin-left:35%; | |
61 | - margin-right:35%; | |
62 | - -moz-box-shadow: 0 0 5px 5px #888; | |
63 | - -webkit-box-shadow: 0 0 5px 5px#888; | |
64 | - box-shadow: 0 0 5px 5px #888; | |
65 | -} | |
66 | - | |
67 | -.login h2{ | |
68 | - background-color:#FFF; | |
69 | - color:#000; | |
70 | - text-align:center; | |
71 | - margin-bottom:10px; | |
72 | - -moz-box-shadow: 0 0 5px 5px #CCC; | |
73 | - -webkit-box-shadow: 0 0 5px 5px#CCC; | |
74 | - box-shadow: 0 0 5px 5px #CCC; | |
75 | -} | |
76 | - | |
77 | -.login h3{ | |
78 | - text-align:center; | |
79 | - color:#BBB; | |
80 | - text-shadow: 1px 1px #AAA; | |
81 | -} | |
82 | - | |
83 | 53 | .upload{ |
84 | 54 | width: 100%; |
85 | 55 | height: 480px; |
... | ... | @@ -134,11 +104,11 @@ footer { |
134 | 104 | margin-top:10px; |
135 | 105 | } |
136 | 106 | |
137 | -.radio{ | |
107 | +.radio { | |
138 | 108 | font-size:15px; |
139 | 109 | } |
140 | 110 | |
141 | -label{ | |
111 | +label { | |
142 | 112 | font-size:18px; |
143 | 113 | } |
144 | 114 | |
... | ... | @@ -155,58 +125,6 @@ label{ |
155 | 125 | box-shadow: 0 0 1px 1px #888; |
156 | 126 | } |
157 | 127 | |
158 | -#player{ | |
159 | - display:block; | |
160 | - width:600px; | |
161 | - height:300px; | |
162 | - float:right; | |
163 | - | |
164 | - | |
165 | - -moz-box-shadow: 0 0 5px 5px #888; | |
166 | - -webkit-box-shadow: 0 0 5px 5px#888; | |
167 | - box-shadow: 0 0 5px 5px #888; | |
168 | -} | |
169 | - | |
170 | -#player2{ | |
171 | - display:block; | |
172 | - width:200px; | |
173 | - height:150px; | |
174 | - | |
175 | - -moz-box-shadow: 0 0 5px 5px #888; | |
176 | - -webkit-box-shadow: 0 0 5px 5px#888; | |
177 | - box-shadow: 0 0 5px 5px #888; | |
178 | -} | |
179 | - | |
180 | -#player3{ | |
181 | - display:block; | |
182 | - width:200px; | |
183 | - height:150px; | |
184 | - | |
185 | - -moz-box-shadow: 0 0 5px 5px #888; | |
186 | - -webkit-box-shadow: 0 0 5px 5px#888; | |
187 | - box-shadow: 0 0 5px 5px #888; | |
188 | -} | |
189 | - | |
190 | -#player4{ | |
191 | - display:block; | |
192 | - width:200px; | |
193 | - height:150px; | |
194 | - | |
195 | - -moz-box-shadow: 0 0 5px 5px #888; | |
196 | - -webkit-box-shadow: 0 0 5px 5px#888; | |
197 | - box-shadow: 0 0 5px 5px #888; | |
198 | -} | |
199 | - | |
200 | -#player5{ | |
201 | - display:block; | |
202 | - width:500px; | |
203 | - height:380px; | |
204 | - | |
205 | - -moz-box-shadow: 0 0 5px 5px #888; | |
206 | - -webkit-box-shadow: 0 0 5px 5px#888; | |
207 | - box-shadow: 0 0 5px 5px #888; | |
208 | -} | |
209 | - | |
210 | 128 | input{ |
211 | 129 | display: inline-block; |
212 | 130 | *display: inline; | ... | ... |
app/assets/stylesheets/bootstrap_overrides.css.scss
app/assets/stylesheets/v_libras/videos.css.scss
app/controllers/static_controller.rb
app/controllers/v_libras/videos_controller.rb
... | ... | @@ -4,7 +4,7 @@ class VLibras::VideosController < InheritedResources::Base |
4 | 4 | before_filter :check_vlibras_api_status, :only => [ :index, :show ] |
5 | 5 | before_filter :authenticate_user! |
6 | 6 | |
7 | - after_filter :mark_as_seen!, :only => [ :show ] | |
7 | + before_filter :mark_as_seen!, :only => [ :show ] | |
8 | 8 | |
9 | 9 | def index |
10 | 10 | @videos = current_user.videos |
... | ... | @@ -13,6 +13,7 @@ class VLibras::VideosController < InheritedResources::Base |
13 | 13 | |
14 | 14 | protected |
15 | 15 | def mark_as_seen! |
16 | + @video = VLibras::Video.find(params[:id]) | |
16 | 17 | @video.mark_as_seen! |
17 | 18 | end |
18 | 19 | end | ... | ... |
app/helpers/application_helper.rb
... | ... | @@ -47,9 +47,18 @@ module ApplicationHelper |
47 | 47 | end |
48 | 48 | |
49 | 49 | def custom_video_tag(video) |
50 | - content_tag(:video, :id => "video_#{video.id}", :class => 'video-js vjs-default skin vlibras-video', | |
51 | - :controls => 'controls', :preload => 'auto', :width => '100%') do | |
52 | - content_tag(:source, '', :src => '/video.mp4', :type => 'video/mp4') | |
50 | + html5_video_tag('/video.mp4', "#video_#{video.id}") | |
51 | + end | |
52 | + | |
53 | + def html5_video_tag(url, id, classes = nil, *args) | |
54 | + options = args.first || {} | |
55 | + options[:id] = id | |
56 | + options[:class] = "video-js vjs-default skin #{classes}" | |
57 | + options[:controls] = 'controls' | |
58 | + options[:preload] = 'auto' | |
59 | + | |
60 | + content_tag(:video, options) do | |
61 | + content_tag(:source, '', :src => url, :type => 'video/mp4') | |
53 | 62 | end |
54 | 63 | end |
55 | 64 | ... | ... |
app/views/devise/sessions/new.html.haml
1 | -%h2 Sign in | |
2 | -= simple_form_for(resource, :as => resource_name, :url => session_path(resource_name), :html => {:class => 'form-vertical' }) do |f| | |
3 | - = f.input :email, :autofocus => true | |
4 | - = f.input :password | |
5 | - = f.input :remember_me, :as => :boolean if devise_mapping.rememberable? | |
6 | - = f.button :submit, "Sign in", :class => 'btn-primary' | |
7 | -= render "devise/shared/links" | |
1 | +.row-fluid | |
2 | + .span5.offset1 | |
3 | + = html5_video_tag('/video.mp4', 'login', 'video-instructions', :autoplay => 'autoplay') | |
4 | + | |
5 | + .span4.offset1.login | |
6 | + %h2 Entrar | |
7 | + = simple_form_for(resource, :as => resource_name, :url => session_path(resource_name), :html => {:class => 'form-vertical' }) do |f| | |
8 | + = f.input :email, :autofocus => true | |
9 | + = f.input :password, :label => "Senha", :required => false | |
10 | + = f.input :remember_me, :label => "Lembre-me da senha", :as => :boolean if devise_mapping.rememberable? | |
11 | + = f.button :submit, "Entrar", :class => 'btn-primary' | |
12 | + = render "devise/shared/links" | |
13 | + | |
14 | + | |
15 | += javascript_include_tag "plugins/flowplayer-3.2.8.min" | |
16 | += javascript_include_tag "site/user" | |
8 | 17 | \ No newline at end of file | ... | ... |
app/views/layouts/application.html.erb
... | ... | @@ -12,83 +12,9 @@ |
12 | 12 | document.createElement('video');document.createElement('audio');document.createElement('track'); |
13 | 13 | </script> |
14 | 14 | </head> |
15 | -<body> | |
16 | -<div class="navbar navbar-fixed-top"> | |
17 | - <div class="navbar-inner"> | |
18 | - <div class="container"> | |
19 | - <a class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse"> | |
20 | - <span class="icon-bar"></span> | |
21 | - <span class="icon-bar"></span> | |
22 | - <span class="icon-bar"></span> | |
23 | - </a> | |
24 | - <%= link_to "GTAaaS", home_path, :class => "brand" %> | |
25 | - | |
26 | - <%- if current_user.present? %> | |
27 | - <div class="nav-collapse"> | |
28 | - <ul class="nav"> | |
29 | - <li><%= link_to t('shared.main'), home_path %></li> | |
30 | - | |
31 | - <li class="dropdown"> | |
32 | - <a class="dropdown-toggle" href="#" data-toggle="dropdown"> | |
33 | - <%= t('shared.vlibras') %> | |
34 | - | |
35 | - <% if current_user.videos.not_seen.any? %> | |
36 | - <span class="label label-success">Novo vídeo!</span> <strong class="caret"></strong> | |
37 | - <% end %> | |
38 | - </a> | |
39 | - | |
40 | - <ul class="dropdown-menu"> | |
41 | - <li> | |
42 | - <%= link_to v_libras_videos_path do %> | |
43 | - <%= t('wikivideos.my_videos') %> | |
44 | - <% if current_user.videos.not_seen.any? %> | |
45 | - <span class="label label-success"><%= current_user.videos.not_seen.size %> </span> <strong class="caret"></strong> | |
46 | - <% end %> | |
47 | - <% end %> | |
48 | - </li> | |
49 | - <li><%= link_to t('videos.new'), '#' %></li> | |
50 | - <li class="divider"></li> | |
51 | - <li><%= link_to t('shared.form_alternative'), rapid_v_libras_requests_path %></li> | |
52 | - </ul> | |
53 | - </li> | |
54 | - | |
55 | - <li class="dropdown hidden"> | |
56 | - <a class="dropdown-toggle" href="#" data-toggle="dropdown"><%= t('shared.wikilibras') %><strong class="caret"></strong></a> | |
57 | 15 | |
58 | - <ul class="dropdown-menu"> | |
59 | - <li><%= link_to t('wikivideos.my_signals'), '#' %></li> | |
60 | - <li><%= link_to t('wikivideos.cadastro_sinal'), '#' %></li> | |
61 | - <li class="divider"></li> | |
62 | - <li><%= link_to t('wikivideos.dicionario_de_dados'), '#' %></li> | |
63 | - </ul> | |
64 | - </li> | |
65 | - <li class="hidden"><%= link_to t('shared.slibras') %></li> | |
66 | - <li><%= link_to t('shared.about'), "http://gtaaas.lavid.ufpb.br/projeto", :target => "blank" %></li> | |
67 | - </ul> | |
68 | - | |
69 | - | |
70 | - <ul class="nav pull-right"> | |
71 | - <li class="dropdown"> | |
72 | - <%= link_to t('shared.logout'), destroy_user_session_path, :method => 'delete' %> | |
73 | - <!-- <a class="dropdown-toggle" href="#" data-toggle="dropdown"><%#= current_user.email %><strong class="caret"></strong></a> | |
74 | - | |
75 | - <ul class="dropdown-menu"> | |
76 | - <li><%#= link_to t('shared.edit'), edit_user_registration_path %></li> | |
77 | - <li class="divider"></li> | |
78 | - <li><%#= link_to t('shared.logout'), destroy_user_session_path, :method => 'delete' %></li> | |
79 | - </ul> --> | |
80 | - </li> | |
81 | - </ul> | |
82 | - <% end %> | |
83 | - | |
84 | - <ul class="nav secondary-nav"> | |
85 | - <!-- <li><%= link_to image_tag('pt.png'), url_for( :locale => 'pt' ), :title => "Português" %></li> | |
86 | - <li><%= link_to image_tag('en.png'), url_for( :locale => 'en' ), :title => 'English' %></li> --> | |
87 | - </ul> | |
88 | - </div><!--/.nav-collapse --> | |
89 | - </div> | |
90 | - </div> | |
91 | -</div> | |
16 | +<body> | |
17 | +<%= render 'layouts/menu' %> | |
92 | 18 | |
93 | 19 | <div class="container-fluid"> |
94 | 20 | <% if content_for?(:menu) %> |
... | ... | @@ -107,7 +33,9 @@ |
107 | 33 | <%= yield %> |
108 | 34 | |
109 | 35 | <footer> |
110 | - <p>GTAaaS - <%= t('shared.project') %> <a href="http://gtaaas.lavid.ufpb.br" target="_blank">LAVID</a> | © <%= Time.now.year %>. <%= t('shared.copyright') %>.</p> | |
36 | + <p>GTAaaS - <%= t('shared.project') %> | |
37 | + <a href="http://gtaaas.lavid.ufpb.br" target="_blank">LAVID</a> | | |
38 | + © <%= Time.now.year %>. <%= t('shared.copyright') %>.</p> | |
111 | 39 | </footer> |
112 | 40 | </div> |
113 | 41 | ... | ... |
app/views/v_libras/videos/index.haml
... | ... | @@ -27,18 +27,19 @@ |
27 | 27 | %h4= t('requests.list') |
28 | 28 | |
29 | 29 | .row-fluid |
30 | - %table.table.table-hover.table-striped.table-requests.span8.offset2 | |
31 | - %thead | |
32 | - %tr | |
33 | - %th Situação | |
34 | - %th Vídeo | |
35 | - %th Criado há | |
36 | - | |
37 | - - @requests.each do |request| | |
38 | - %tr | |
39 | - %td.span2= request_status_label(request) | |
40 | - %td.span5= request.video_filename | |
41 | - %td.span5= time_ago_in_words(request.created_at) | |
30 | + .span8.offset2 | |
31 | + %table.table.table-hover.table-striped.table-requests | |
32 | + %thead | |
33 | + %tr | |
34 | + %th Situação | |
35 | + %th Vídeo | |
36 | + %th Criado há | |
37 | + | |
38 | + - @requests.each do |request| | |
39 | + %tr | |
40 | + %td.span2= request_status_label(request) | |
41 | + %td.span5= request.video_filename | |
42 | + %td.span5= time_ago_in_words(request.created_at) | |
42 | 43 | |
43 | 44 | |
44 | 45 | ... | ... |