Fix event display

Victor Costa
1 parent 4286ac6e
Showing 2 changed files with 41 additions and 65 deletions Show diff stats
index.html
js/main.js
@@ -312,42 +312,9 @@
                     <div class="talk-proposal-container col-sm-12">
                       <section class="talk-proposal box box-propostas">
                         <div class="container-title box-title">Bate-papo com ministras e ministros</div>
-                        <div class="talk__description">
-                          <div class="embed-responsive embed-responsive-16by9">
-                            <iframe src="//www.youtube.com/embed/pe6bePBLZkc?showinfo=0&amp;iv_load_policy=3&amp;controls=0" width="425" height="350"></iframe>
-                          </div>
-                          <p>Confira as datas e horários:</p>
-                        </div>
                         <div class="col-sm-12">
                           <div class="row">
-                            <ul class="calendar saude" data-slick='{"infinite": false, "rows": 2}'>
-                              <li>
-                                <span id='ep0'></span>
-                                <span>Saúde</span>
-                                <div id='ed0' class="date"><i class="fa fa-calendar"></i></div><div class="time"><i class="fa fa-clock-o"></i> 19:00</div>
-                              </li>
-                            </ul>
-                            <ul class="calendar seguranca-publica" data-slick='{"infinite": false, "rows": 2}'>
-                              <li>
-                                <span id='ep1'></span>
-                                <span id='ed1'>Justiça</span>
-                                <div class="date"><i class="fa fa-calendar"></i></div><div class="time"><i class="fa fa-clock-o"></i> 19:00</div>
-                              </li>
-                            </ul>
-                            <ul class="calendar educacao" data-slick='{"infinite": false, "rows": 2}'>
-                              <li>
-                                <span id='ep2'></span>
-                                <span>Educação</span>
-                                <div id='ed2' class="date"><i class="fa fa-calendar"></i></div><div class="time"><i class="fa fa-clock-o"></i> 19:00</div>
-                              </li>
-                            </ul>
-                            <ul class="calendar reducao-da-pobreza" data-slick='{"infinite": false, "rows": 2}'>
-                              <li>
-                                <span id='ep3'></span>
-                                <span>Desenvolvimento Social</span>
-                                <div id='ed3' class="date"><i class="fa fa-calendar"></i></div><div class="time"><i class="fa fa-clock-o"></i> 19:00</div>
-                              </li>
-                            </ul>
+                            <div class="calendar-container"></div>
                           </div>
                         </div>
                         <div class="col-sm-12">
@@ -533,6 +500,26 @@
       </div>
     </script>
+    <script id="calendar-template" type="text/x-handlebars-template">
+      <ul class="calendar {{category_class}}" data-slick='{"infinite": false, "rows": 2}'>
+        <li>
+          <div class="event-body">
+            {{{event.body}}}
+          </div>
+          <div class="event-description">
+            <span id='ep0'>{{event.setting.presenter}}</span>
+            <span>{{category}}</span>
+            <div id='ed0' class="date">
+              <i class="fa fa-calendar"></i> {{date}}
+            </div>
+            <div class="time">
+              <i class="fa fa-clock-o"></i> {{time}}
+            </div>
+          </div>
+        </li>
+      </ul>
+    </script>
+
     <div class="success-panel hide">
       <div class="icon"></div>
       <div class="message"></div>
@@ -10,6 +10,7 @@ define([&#39;jquery&#39;, &#39;handlebars&#39;, &#39;fastclick&#39;, &#39;handlebars_helpers&#39;, &#39;piwik&#39;], fun
   var loginTemplate = Handlebars.compile(document.getElementById('login-template').innerHTML);
   var resultsTemplate = Handlebars.compile(document.getElementById('results-template').innerHTML);
   var articleTemplate = Handlebars.compile(document.getElementById('article-template').innerHTML);
+  var calendarTemplate = Handlebars.compile(document.getElementById('calendar-template').innerHTML);
   // The div/container that we are going to display the results in
   var resultsPlaceholder = document.getElementById('proposal-result');
@@ -39,12 +40,6 @@ define([&#39;jquery&#39;, &#39;handlebars&#39;, &#39;fastclick&#39;, &#39;handlebars_helpers&#39;, &#39;piwik&#39;], fun
     var cat_educacao = 181;
     var cat_reducao_da_pobreza = 183;
-    window.themes_cat = [];
-    window.themes_cat[0] = cat_saude;
-    window.themes_cat[1] = cat_seguranca_publica;
-    window.themes_cat[2] = cat_educacao;
-    window.themes_cat[3] = cat_reducao_da_pobreza;
-
     window.recaptchaSiteKey = '6LcLPAcTAAAAAKsd0bxY_TArhD_A7OL19SRCW7_i'
   }else{
     var host = 'http://noosfero.com:3001';
@@ -54,8 +49,6 @@ define([&#39;jquery&#39;, &#39;handlebars&#39;, &#39;fastclick&#39;, &#39;handlebars_helpers&#39;, &#39;piwik&#39;], fun
     window.proposal_discussion = '392'
     var cat_saude = 23;
-    window.themes_cat = [];
-    window.themes_cat[0] = cat_saude;
   }
   var BARRA_ADDED = false;
@@ -359,27 +352,29 @@ define([&#39;jquery&#39;, &#39;handlebars&#39;, &#39;fastclick&#39;, &#39;handlebars_helpers&#39;, &#39;piwik&#39;], fun
         $proposal.find('.talk-proposal-container').show();
         $proposal.find('.calendar').hide();
         var active_category = '';
+        var category_id;
         switch($proposal.find('.categories').attr('class')) {
           case 'categories saude':
             active_category = 'saude';
+            category_id = 180;
             break;
           case 'categories educacao':
             active_category = 'educacao';
+            category_id = 181;
             break;
           case 'categories seguranca-publica':
             active_category = 'seguranca-publica';
+            category_id = 182;
             break;
           case 'categories reducao-da-pobreza':
             active_category = 'reducao-da-pobreza';
+            category_id = 183;
             break;
-        }     
-
-        $proposal.find('.calendar.' + active_category).show();
-        $proposal.find('.calendar').slick();
+        }
         var topic_id = proposal_id.split('-').pop();
         this.loadRandomProposal(topic_id);
-        Main.display_events();
+        Main.display_events(category_id, active_category);
       },
       display_proposal_detail: function(proposal_id){
         $('.content').removeClass('background'); /* Remove class background */
@@ -684,24 +679,18 @@ define([&#39;jquery&#39;, &#39;handlebars&#39;, &#39;fastclick&#39;, &#39;handlebars_helpers&#39;, &#39;piwik&#39;], fun
         msg = msg.substring(0, msg.length - 5) + ".";
         return msg;
       },
-      display_events: function() {
-        // /api/v1/communities/64/articles?from=2013-04-04-14:41:43&until=2015-06-11-14:41:43&limit=10&categories_ids[]=7&categories_ids[]=8&private_token=a97b6a5cae2c4c54e4ae18dde1829a49
-        var url;
-        count = 0;
-        for (var i = 0; i < window.themes_cat.length; ++i) {
-          url = host + '/api/v1/communities/' + window.dialoga_community + '/articles?categories_ids[]=' + window.themes_cat[i] + '&content_type=Event&private_token=' + Main.private_token;
-          console.log(url);
-          $.getJSON(url).done(function (data) {
-            console.log(data);
-            $('#ep' + count).text(data.articles[0].setting.presenter);
-            var dt = data.articles[0].start_date;
-            dia = dt.substr(8, 2);
-            mes = dt.substr(5, 2);
-            ano = dt.substr(0, 4);
-            $('#ed' + count).text(dia + '/' + mes + '/' + ano);
-            count++;
-          });
-        }
+      display_events: function(cat_id, active_category) {
+        var url = host + '/api/v1/communities/' + window.dialoga_community + '/articles?categories_ids[]=' + cat_id + '&content_type=Event&private_token=' + Main.private_token;
+        $.getJSON(url).done(function (data) {
+          if(data.articles.length==0) return;
+          var dt = data.articles[0].start_date;
+          var date = dt.substr(8, 2) + '/' + dt.substr(5, 2) + '/' + dt.substr(0, 4);
+          var params = {event: data.articles[0], date: date, time: "19:00", category: data.articles[0].categories[0].name, category_class: active_category};
+          $('.calendar-container').html(calendarTemplate(params));
+
+          $('.calendar-container .calendar.' + active_category).show();
+          $('.calendar-container .calendar').slick();
+        });
       },
       computeBoxHeight: function(){
         var hPerLineOnTitle = 25;