From a0b137a9af51642e7b9b852f7e8df4b747283953 Mon Sep 17 00:00:00 2001
From: Leonardo Merlin <leonardo.merlin@gmail.com>
Date: Sun, 6 Sep 2015 12:23:33 -0300
Subject: [PATCH] Small improvements at event-list directive

---
 src/app/components/article-service/article.service.js |  2 +-
 src/app/components/event-list/event-list.directive.js | 18 ++++++++++++++----
 src/app/components/event-list/event-list.html         | 76 +++++++++++-----------------------------------------------------------------
 src/app/components/event-list/event-list.scss         |  5 +++--
 src/app/pages/inicio/inicio.controller.js             |  4 ++--
 src/app/pages/inicio/inicio.html                      |  2 +-
 6 files changed, 32 insertions(+), 75 deletions(-)

diff --git a/src/app/components/article-service/article.service.js b/src/app/components/article-service/article.service.js
index 57f8ebd..10d5cff 100644
--- a/src/app/components/article-service/article.service.js
+++ b/src/app/components/article-service/article.service.js
@@ -138,7 +138,7 @@
       }, params);
 
       UtilService.get(url, {params: paramsExtended}).then(function(data){
-        cbSuccess(data);
+        cbSuccess(data.articles);
       }).catch(function(error){
         cbError(error);
       });
diff --git a/src/app/components/event-list/event-list.directive.js b/src/app/components/event-list/event-list.directive.js
index 165e090..907ab2b 100644
--- a/src/app/components/event-list/event-list.directive.js
+++ b/src/app/components/event-list/event-list.directive.js
@@ -19,18 +19,24 @@
       vm.$log = $log;
 
       vm.init();
+      // vm.attachListeners();
     }
 
     EventListController.prototype.init = function () {
       var vm = this;
 
-      vm.eventList = [];
-      vm.isListVisible = false;
+      if(!vm.events){
+        throw { name: 'NotDefined', message: 'The attribute "events" is undefined.'};
+      }
+
+      if(!vm.isCollapsed){
+        vm.isCollapsed = true;
+      }
     };
 
     EventListController.prototype.toggleView = function () {
       var vm = this;
-      vm.isListVisible = !vm.isListVisible;
+      vm.isCollapsed = !vm.isCollapsed;
     };
 
     EventListController.prototype.subscribe = function (data) {
@@ -42,8 +48,12 @@
     var directive = {
       restrict: 'E',
       templateUrl: 'app/components/event-list/event-list.html',
+      scope: {
+        events: '=',
+        isCollapsed: '='
+      },
       controller: EventListController,
-      controllerAs: 'eventListCtrl',
+      controllerAs: 'vm',
       bindToController: true
     };
 
diff --git a/src/app/components/event-list/event-list.html b/src/app/components/event-list/event-list.html
index a1a12c6..336ac8f 100644
--- a/src/app/components/event-list/event-list.html
+++ b/src/app/components/event-list/event-list.html
@@ -3,7 +3,7 @@
   <section class="color-theme-common-bg">
 
     <div class="container">
-      <div class="event-bar--trigger">
+      <div class="event-bar--trigger" ng-click="vm.toggleView()">
         <div class="event-bar--trigger-top">
           <div class="col-sm-6">
             <h1 class="title">
@@ -12,19 +12,20 @@
             </h1>
           </div>
           <div class="col-sm-6">
-            <h2 class="event-bar--trigger-toggle text-right" ng-click="eventListCtrl.toggleView()">
+            <h2 class="event-bar--trigger-toggle text-right">
               <span><b>18</b> bate papos <b>agendados</b></span>
               <span class="glyphicon glyphicon-menu-down" aria-hidden="true"></span>
             </h2>
           </div>
         </div>
+        <div class="clearfix"></div>
       </div>
     </div>
   </section>
 
   <section class="section-table">
     <div class="container">
-      <!-- <div class="event-tab--trigger" ng-show="!eventListCtrl.isListVisible" ng-click="eventListCtrl.toggleView()">
+      <!-- <div class="event-tab--trigger" ng-show="vm.isCollapsed" ng-click="vm.toggleView()">
         <div class="event-tab--header">
           <div class="event-tab--icon">
             <span class="glyphicon glyphicon-calendar" aria-hidden="true"></span>
@@ -38,81 +39,26 @@
         </button>
       </div> -->
 
-      <div class="event-list--panel ng-hide" ng-show="eventListCtrl.isListVisible">
+      <div class="event-list--panel ng-hide" ng-show="!vm.isCollapsed">
         <div class="event-list--table-wrapper">
           <div class="table-responsive">
             <table class="table event-list--table">
               <!-- <thead></thead> -->
               <tbody>
-                <tr>
+                <tr ng-repeat="event in vm.events">
                   <td>
-                    <span class="date">dd/mm/aaaa</span>
+                    <span class="date">{{event.start_date | date : "dd/MM/yyyy"}}</span>
                     <span class="separator">-</span>
-                    <span class="time">HH:mm</span>
+                    <span class="time">{{event.start_date | date : "HH:mm"}}</span>
                     <span class="separator">-</span>
-                    <span class="description">Mais médicos, Segurança Nacional, SAMU</span>
-                    <button type="button" class="btn color-theme-common-bg" ng-click="eventListCtrl.subscribe('EVENT_ID')">
+                    <span class="description">[DESCRIÇÃO]</span>
+                    <button type="button" class="btn color-theme-common-bg" ng-click="vm.subscribe('EVENT_ID')">
                       Inscreva-se
-                      <span class="sr-only">no bate-papo com (ministro) no dia (date) as (hh:mm) horas</span>
+                      <span class="sr-only">no bate-papo com (ministro) no dia {event.start_date | date : "dd/MM/yyyy"}} as {{event.start_date | date : "HH:mm"}} horas</span>
                     </button>
                     <span class="subscribers">123 inscritos</span>
                   </td>
                 </tr>
-                <tr>
-                  <td>
-                    <span class="date">dd/mm/aaaa</span>
-                    <span class="separator">-</span>
-                    <span class="time">HH:mm</span>
-                    <span class="separator">-</span>
-                    <span class="description">Mais médicos, Segurança Nacional, SAMU</span>
-                    <button type="button" class="btn color-theme-common-bg">Inscreva-se</button>
-                    <span class="subscribers">123 inscritos</span>
-                  </td>
-                </tr>
-                <tr>
-                  <td>
-                    <span class="date">dd/mm/aaaa</span>
-                    <span class="separator">-</span>
-                    <span class="time">HH:mm</span>
-                    <span class="separator">-</span>
-                    <span class="description">Mais médicos, Segurança Nacional, SAMU</span>
-                    <button type="button" class="btn color-theme-common-bg">Inscreva-se</button>
-                    <span class="subscribers">123 inscritos</span>
-                  </td>
-                </tr>
-                <tr>
-                  <td>
-                    <span class="date">dd/mm/aaaa</span>
-                    <span class="separator">-</span>
-                    <span class="time">HH:mm</span>
-                    <span class="separator">-</span>
-                    <span class="description">Mais médicos, Segurança Nacional, SAMU</span>
-                    <button type="button" class="btn color-theme-common-bg">Inscreva-se</button>
-                    <span class="subscribers">123 inscritos</span>
-                  </td>
-                </tr>
-                <tr>
-                  <td>
-                    <span class="date">dd/mm/aaaa</span>
-                    <span class="separator">-</span>
-                    <span class="time">HH:mm</span>
-                    <span class="separator">-</span>
-                    <span class="description">Mais médicos, Segurança Nacional, SAMU</span>
-                    <button type="button" class="btn color-theme-common-bg">Inscreva-se</button>
-                    <span class="subscribers">123 inscritos</span>
-                  </td>
-                </tr>
-                <tr>
-                  <td>
-                    <span class="date">dd/mm/aaaa</span>
-                    <span class="separator">-</span>
-                    <span class="time">HH:mm</span>
-                    <span class="separator">-</span>
-                    <span class="description">Mais médicos, Segurança Nacional, SAMU</span>
-                    <button type="button" class="btn color-theme-common-bg">Inscreva-se</button>
-                    <span class="subscribers">123 inscritos</span>
-                  </td>
-                </tr>
               </tbody>
               <!-- <tfooter></tfooter> -->
             </table>
diff --git a/src/app/components/event-list/event-list.scss b/src/app/components/event-list/event-list.scss
index 1df8cfa..6ef5c75 100644
--- a/src/app/components/event-list/event-list.scss
+++ b/src/app/components/event-list/event-list.scss
@@ -17,8 +17,8 @@
         transition: .3s linear all;
 
         &.ng-hide {
-            height: 0px;
-            line-height: 0px;
+            height: 0;
+            line-height: 0;
         }
 
         // .event-list--header {
@@ -72,6 +72,7 @@
 
     .event-bar--trigger {
         color: #fff;
+        cursor: pointer;
 
         h1 {
             margin-bottom: 20px;
diff --git a/src/app/pages/inicio/inicio.controller.js b/src/app/pages/inicio/inicio.controller.js
index cd8f644..a7a7272 100644
--- a/src/app/pages/inicio/inicio.controller.js
+++ b/src/app/pages/inicio/inicio.controller.js
@@ -60,8 +60,8 @@
     });
 
     // Load event list
-    vm.DialogaService.getEvents({}, function(data) {
-      vm.events = data;
+    vm.DialogaService.getEvents({}, function(events) {
+      vm.events = events;
       vm.loadingEvents = false;
     }, function(error) {
       vm.$log.error('Error on getEvents.', error);
diff --git a/src/app/pages/inicio/inicio.html b/src/app/pages/inicio/inicio.html
index 8a89fd9..096d145 100644
--- a/src/app/pages/inicio/inicio.html
+++ b/src/app/pages/inicio/inicio.html
@@ -23,7 +23,7 @@
 
   <section class="section-event">
     <div ng-if="pageInicio.events">
-      <event-list events="[]"></event-list>
+      <event-list events="pageInicio.events"></event-list>
     </div>
     <div ng-if="!pageInicio.events && pageInicio.loadingEvents" class="container">
       <div class="row">
--
libgit2 0.21.2