Download as
Browse Code »

Commit 87ec73ab681da877fa25881847e8bd13f4fb13f7

Authored by Evandro Junior
2 parents 96f66caf d8083699
Exists in community_hub_submodule

Merge branch 'AI3074-community_dashboard' of gitlab.com:participa/noosfero into … 

…AI3074-community_dashboard
Showing 3 changed files with 224 additions and 34 deletions   Show diff stats
public/javascripts/community_hub.js
  Diff comments   View file @87ec73a
... ... @@ -173,7 +173,7 @@ function update_mediation_comments(mediation) {
173 173  
174 174 function update_mediations() {
175 175  
176   - if (jQuery("#mediation-section.show").size() != 0) {
  176 + if (jQuery("#right-tab.show").size() != 0) {
177 177  
178 178 var hub_id = jQuery(".hub").attr('id');
179 179  
... ... @@ -206,7 +206,7 @@ function update_mediations() {
206 206  
207 207 function update_live_stream() {
208 208  
209   - if (jQuery("#live-section.show").size() != 0) {
  209 + if (jQuery("#left-tab.show").size() != 0) {
210 210  
211 211 var hub_id = jQuery(".hub").attr('id');
212 212  
... ... @@ -243,17 +243,22 @@ function update_live_stream() {
243 243 }
244 244  
245 245 function hub_left_tab_click() {
246   - jQuery("#mediation-section").removeClass('show');
247   - jQuery("#mediation-section").addClass('hide');
248   - jQuery("#live-section").removeClass('hide');
249   - jQuery("#live-section").addClass('show');
  246 + jQuery("#right-tab").removeClass('show');
  247 + jQuery("#right-tab").addClass('hide');
  248 + jQuery("#left-tab").removeClass('hide');
  249 + jQuery("#left-tab").addClass('show');
250 250 }
251 251  
252 252 function hub_right_tab_click() {
253   - jQuery("#live-section").removeClass('show');
254   - jQuery("#live-section").addClass('hide');
255   - jQuery("#mediation-section").removeClass('hide');
256   - jQuery("#mediation-section").addClass('show');
  253 + jQuery("#left-tab").removeClass('show');
  254 + jQuery("#left-tab").addClass('hide');
  255 + jQuery("#right-tab").removeClass('hide');
  256 + jQuery("#right-tab").addClass('show');
  257 + jQuery(".hub #left-tab.hide").click(hub_left_tab_click);
  258 +}
  259 +
  260 +function marcelo() {
  261 + console.log('teste!');
257 262 }
258 263  
259 264 jQuery(document).ready(function() {
... ... @@ -261,8 +266,7 @@ jQuery(document).ready(function() {
261 266 live_scroll_position = jQuery("#live-posts").scrollTop();
262 267 });
263 268  
264   - jQuery(".hub #left-tab").click(hub_left_tab_click);
265   - jQuery(".hub #right-tab").click(hub_right_tab_click);
  269 + jQuery(".hub #right-tab.hide").click(hub_right_tab_click);
266 270  
267 271 setTimeout(update_live_stream, 5000);
268 272 setTimeout(update_mediations, 7000);
... ...
public/style.css
  Diff comments   View file @87ec73a
1   -div.content-tab.show {
  1 +/*div.content-tab.show {
2 2 display: block;
3 3 }
4 4  
5 5 div.content-tab.hide {
6 6 display: none;
7   -}
  7 +}*/
8 8  
9 9 #banner-embed-container {
10 10 width: 49%;
... ... @@ -17,17 +17,17 @@ div.content-tab.hide {
17 17 height: 350px;
18 18 }
19 19  
20   -.hub #left-tab {
21   - /*border: 0px solid lightGray;*/
  20 +/*.hub #left-tab {
  21 + comentado-border: 0px solid lightGray;-comentado
22 22 border: 1px solid red;
23 23 display: inline-block;
24 24 float: left;
25 25 width: 49%;
26 26 margin-bottom: 2em;
27 27 cursor: pointer;
28   -}
  28 +}*/
29 29  
30   -.hub #right-tab {
  30 +/*.hub #right-tab {
31 31 border: 1px solid green;
32 32 display: inline-block;
33 33 clear: right;
... ... @@ -36,12 +36,12 @@ div.content-tab.hide {
36 36 width: 50%;
37 37 margin-bottom: 2em;
38 38 cursor: pointer;
39   -}
  39 +}*/
40 40  
41 41 .hub #content-tab {
42 42 }
43 43  
44   -.hub #left-tab .on-air {
  44 +/*.hub #left-tab .on-air {
45 45 background-color: #d40000;
46 46 border-radius: 10px 10px 10px 10px;
47 47 color: white;
... ... @@ -69,7 +69,7 @@ div.content-tab.hide {
69 69 vertical-align: top;
70 70 width: 20%;
71 71 }
72   -
  72 +*/
73 73  
74 74 #hub-loading {
75 75 /*margin-top: 18px;*/
... ... @@ -141,18 +141,29 @@ div.content-tab.hide {
141 141 }*/
142 142  
143 143 .hub .message {
144   -display: inline-block;
145   -width: 69%;
146   -float: none;
147   -clear: both;
  144 + display: inline-block;
  145 + width: 65%;
  146 + float: none;
  147 + clear: both;
148 148 }
149 149  
150   -.hub .message .author {
  150 +.hub .show .message {
  151 + width: 80%;
  152 +}
  153 +
  154 +/*.hub .message .author {
151 155 font-weight: bold;
152 156 float: left;
153 157 display: inline-block;
154 158 line-height: 16px;
155 159 margin-right: 5px;
  160 +}*/
  161 +
  162 +.hub .message .author {
  163 + font-weight: bold;
  164 + display: inline-block;
  165 + margin-right: 5px;
  166 + padding-bottom: 0px;
156 167 }
157 168  
158 169 .hub .mediation-bar {
... ... @@ -236,10 +247,6 @@ clear: both;
236 247 display: block;
237 248 }
238 249  
239   -.hub ul#mediation-posts .post {
240   - padding-bottom: 10px;
241   -}
242   -
243 250 /**/
244 251  
245 252 .hub .live {
... ... @@ -269,8 +276,10 @@ clear: both;
269 276 .hub ul#mediation-posts .post{
270 277 background-color:#eee;
271 278 border-color: #fff;
  279 + padding-bottom: 10px;
272 280 }
273 281  
  282 +
274 283 #content .main-block .hub .live h1{
275 284 background-color: #f4f4f4;
276 285 border: 1px solid lightGray
... ... @@ -312,6 +321,74 @@ clear: both;
312 321 width: 20%;
313 322 }
314 323  
  324 +/****aba live fechada****/
  325 +
  326 +
  327 +.hub .live.hide {
  328 + width: 10%;
  329 +}
  330 +
  331 +.hub .live.hide ul#live-posts{
  332 + overflow-x: visible;
  333 + overflow-y: visible;
  334 + background-color: lightGray;
  335 +}
  336 +
  337 +.hub .live.hide ul#live-posts li{
  338 + display: none;
  339 +}
  340 +
  341 +#content .hub .live.hide h1 {
  342 + text-align: center;
  343 +}
  344 +
  345 +#content .hub .live.hide h1 .title {
  346 + /*display: inline-block;*/
  347 + display: none;
  348 +}
  349 +#content .hub .live.hide .on-air,
  350 +#content .hub .live.hide .off-air {
  351 + width: auto;
  352 +}
  353 +
  354 +
  355 +
  356 +/****fim aba live fechada****/
  357 +
  358 +/****aba live aberta****/
  359 +
  360 +.hub .live.show {
  361 + width: 85%;
  362 +}
  363 +
  364 +/*.hub .live.show ul#live-posts{
  365 + overflow-x: hidden;
  366 + overflow-y: scroll;
  367 + background-color: #fff;
  368 +}*/
  369 +
  370 +.hub .live.show ul#live-posts .li{
  371 +
  372 +}
  373 +
  374 +#content .hub .live.show .on-air,
  375 +#content .hub .live.show .off-air{
  376 +float: right;
  377 +margin-right: 10px;
  378 +}
  379 +
  380 +/*#content .hub .live.show .on-air,
  381 +#content .hub .live.show .off-air {
  382 + width: 20%;
  383 +}*/
  384 +
  385 +
  386 +
  387 +/****fim aba mlive aberta****/
  388 +
  389 +
  390 +/**************************************/
  391 +
315 392  
316 393 .hub .mediation {
317 394 border: 0px solid lightGray;
... ... @@ -341,6 +418,108 @@ clear: both;
341 418 float: right;
342 419 padding-right: 1em;
343 420 }
  421 +
  422 +/****aba mediation fechada****/
  423 +
  424 +.hub .mediation.hide {
  425 + border: 0px solid lightGray;
  426 + display: inline-block;
  427 + clear: right;
  428 + float: none;
  429 + margin-left: 1%;
  430 + width: 10%;
  431 + margin-bottom: 0em;
  432 +}
  433 +
  434 +#content .main-block .hub .mediation.hide h1{
  435 + background-color: #ed8e01;
  436 + border: 1px solid lightGray;
  437 + text-align: center;
  438 + padding-left: 0;
  439 +}
  440 +
  441 +#content .hub .mediation.hide .title {
  442 + color: white;
  443 + display: inline-block;
  444 + font-size: 14px;
  445 + font-family: Arial Black, arial, sans-serif;
  446 + padding-right: 0;
  447 + width: 100%;
  448 + /*font-variant: normal;*/
  449 +}
  450 +.hub .mediation.hide .expand {
  451 + display: none;
  452 +}
  453 +
  454 +
  455 +.hub .mediation.hide ul#mediation-posts {
  456 +height: 500px;
  457 +overflow-x: visible;
  458 +overflow-y: visible;
  459 +border-width: 0 1px 1px;
  460 +border-style: solid;
  461 +border-color: lightGray;
  462 +padding-top: 10px;
  463 +background-color: lightgray;
  464 +}
  465 +
  466 +.hub .mediation.hide ul#mediation-posts li{
  467 +display: none;
  468 +}
  469 +
  470 +/****fim aba mediation fechada****/
  471 +
  472 +/****aba mediation aberta****/
  473 +
  474 +.hub .mediation.show {
  475 + border: 0px solid lightGray;
  476 + display: inline-block;
  477 + clear: right;
  478 + float: none;
  479 + margin-left: 1%;
  480 + width: 85%;
  481 + margin-bottom: 2em;
  482 +}
  483 +
  484 +#content .main-block .hub .mediation.show h1{
  485 + background-color: #ed8e01;
  486 + border: 1px solid lightGray
  487 +}
  488 +
  489 +#content .hub .mediation.show .title {
  490 + color: white;
  491 + display: inline-block;
  492 + font-size: 20px;
  493 + font-family: Arial Black, arial, sans-serif;
  494 + padding-right: 0;
  495 + width: 100%;
  496 + /*font-variant: normal;*/
  497 +}
  498 +.hub .mediation.show .expand {
  499 + float: right;
  500 + padding-right: 1em;
  501 + display: block;
  502 +}
  503 +
  504 +
  505 +.hub .mediation.show ul#mediation-posts {
  506 +height: 500px;
  507 +overflow-x: hidden;
  508 +overflow-y: scroll;
  509 +border-width: 0 1px 1px;
  510 +border-style: solid;
  511 +border-color: lightGray;
  512 +padding-top: 10px;
  513 +background-color: #f9f9f9;
  514 +}
  515 +
  516 +.hub .mediation.show ul#mediation-posts li{
  517 +
  518 +}
  519 +
  520 +
  521 +/****fim aba mediation aberta****/
  522 +
344 523 .hub .form {
345 524 /*clear: left;*/
346 525 /*float: left;*/
... ...
views/content_viewer/hub.rhtml
  Diff comments   View file @87ec73a
... ... @@ -8,15 +8,22 @@
8 8  
9 9 <br />
10 10  
11   - <span id="left-tab"><%= @page.title %><span class="on-air"><%= _("Live") %></span></span>
12   - <span id="right-tab"><%= _("Mediation") %><span class="expand">&#9660;</span></span>
13   - <div id="live-section" class="content-tab show">
  11 +
  12 +<div id="left-tab" class="live content-tab show">
  13 + <h1>
  14 + <span class="title"><%= @page.title %></span><span class="on-air"><%= _("Live") %></span>
  15 + </h1>
  16 +
14 17 <ul id="live-posts">
15 18 </ul>
16 19 <span><%= check_box_tag 'auto_scrolling', 'yes', true %><%= _("Auto scrolling") %></span>
17 20 </div>
18 21  
19   - <div id="mediation-section" class="content-tab hide">
  22 + <div id="right-tab" class="mediation content-tab hide">
  23 + <h1>
  24 + <span class="title"><%= _("Mediation") %><span class="expand">&#9660;</span></span>
  25 + </h1>
  26 +
20 27 <ul id="mediation-posts">
21 28 </ul>
22 29 </div>
... ...