Commit a0b137a9af51642e7b9b852f7e8df4b747283953

Authored by Leonardo Merlin
1 parent 670ba360

Small improvements at event-list directive

src/app/components/article-service/article.service.js
... ... @@ -138,7 +138,7 @@
138 138 }, params);
139 139  
140 140 UtilService.get(url, {params: paramsExtended}).then(function(data){
141   - cbSuccess(data);
  141 + cbSuccess(data.articles);
142 142 }).catch(function(error){
143 143 cbError(error);
144 144 });
... ...
src/app/components/event-list/event-list.directive.js
... ... @@ -19,18 +19,24 @@
19 19 vm.$log = $log;
20 20  
21 21 vm.init();
  22 + // vm.attachListeners();
22 23 }
23 24  
24 25 EventListController.prototype.init = function () {
25 26 var vm = this;
26 27  
27   - vm.eventList = [];
28   - vm.isListVisible = false;
  28 + if(!vm.events){
  29 + throw { name: 'NotDefined', message: 'The attribute "events" is undefined.'};
  30 + }
  31 +
  32 + if(!vm.isCollapsed){
  33 + vm.isCollapsed = true;
  34 + }
29 35 };
30 36  
31 37 EventListController.prototype.toggleView = function () {
32 38 var vm = this;
33   - vm.isListVisible = !vm.isListVisible;
  39 + vm.isCollapsed = !vm.isCollapsed;
34 40 };
35 41  
36 42 EventListController.prototype.subscribe = function (data) {
... ... @@ -42,8 +48,12 @@
42 48 var directive = {
43 49 restrict: 'E',
44 50 templateUrl: 'app/components/event-list/event-list.html',
  51 + scope: {
  52 + events: '=',
  53 + isCollapsed: '='
  54 + },
45 55 controller: EventListController,
46   - controllerAs: 'eventListCtrl',
  56 + controllerAs: 'vm',
47 57 bindToController: true
48 58 };
49 59  
... ...
src/app/components/event-list/event-list.html
... ... @@ -3,7 +3,7 @@
3 3 <section class="color-theme-common-bg">
4 4  
5 5 <div class="container">
6   - <div class="event-bar--trigger">
  6 + <div class="event-bar--trigger" ng-click="vm.toggleView()">
7 7 <div class="event-bar--trigger-top">
8 8 <div class="col-sm-6">
9 9 <h1 class="title">
... ... @@ -12,19 +12,20 @@
12 12 </h1>
13 13 </div>
14 14 <div class="col-sm-6">
15   - <h2 class="event-bar--trigger-toggle text-right" ng-click="eventListCtrl.toggleView()">
  15 + <h2 class="event-bar--trigger-toggle text-right">
16 16 <span><b>18</b> bate papos <b>agendados</b></span>
17 17 <span class="glyphicon glyphicon-menu-down" aria-hidden="true"></span>
18 18 </h2>
19 19 </div>
20 20 </div>
  21 + <div class="clearfix"></div>
21 22 </div>
22 23 </div>
23 24 </section>
24 25  
25 26 <section class="section-table">
26 27 <div class="container">
27   - <!-- <div class="event-tab--trigger" ng-show="!eventListCtrl.isListVisible" ng-click="eventListCtrl.toggleView()">
  28 + <!-- <div class="event-tab--trigger" ng-show="vm.isCollapsed" ng-click="vm.toggleView()">
28 29 <div class="event-tab--header">
29 30 <div class="event-tab--icon">
30 31 <span class="glyphicon glyphicon-calendar" aria-hidden="true"></span>
... ... @@ -38,81 +39,26 @@
38 39 </button>
39 40 </div> -->
40 41  
41   - <div class="event-list--panel ng-hide" ng-show="eventListCtrl.isListVisible">
  42 + <div class="event-list--panel ng-hide" ng-show="!vm.isCollapsed">
42 43 <div class="event-list--table-wrapper">
43 44 <div class="table-responsive">
44 45 <table class="table event-list--table">
45 46 <!-- <thead></thead> -->
46 47 <tbody>
47   - <tr>
  48 + <tr ng-repeat="event in vm.events">
48 49 <td>
49   - <span class="date">dd/mm/aaaa</span>
  50 + <span class="date">{{event.start_date | date : "dd/MM/yyyy"}}</span>
50 51 <span class="separator">-</span>
51   - <span class="time">HH:mm</span>
  52 + <span class="time">{{event.start_date | date : "HH:mm"}}</span>
52 53 <span class="separator">-</span>
53   - <span class="description">Mais médicos, Segurança Nacional, SAMU</span>
54   - <button type="button" class="btn color-theme-common-bg" ng-click="eventListCtrl.subscribe('EVENT_ID')">
  54 + <span class="description">[DESCRIÇÃO]</span>
  55 + <button type="button" class="btn color-theme-common-bg" ng-click="vm.subscribe('EVENT_ID')">
55 56 Inscreva-se
56   - <span class="sr-only">no bate-papo com (ministro) no dia (date) as (hh:mm) horas</span>
  57 + <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>
57 58 </button>
58 59 <span class="subscribers">123 inscritos</span>
59 60 </td>
60 61 </tr>
61   - <tr>
62   - <td>
63   - <span class="date">dd/mm/aaaa</span>
64   - <span class="separator">-</span>
65   - <span class="time">HH:mm</span>
66   - <span class="separator">-</span>
67   - <span class="description">Mais médicos, Segurança Nacional, SAMU</span>
68   - <button type="button" class="btn color-theme-common-bg">Inscreva-se</button>
69   - <span class="subscribers">123 inscritos</span>
70   - </td>
71   - </tr>
72   - <tr>
73   - <td>
74   - <span class="date">dd/mm/aaaa</span>
75   - <span class="separator">-</span>
76   - <span class="time">HH:mm</span>
77   - <span class="separator">-</span>
78   - <span class="description">Mais médicos, Segurança Nacional, SAMU</span>
79   - <button type="button" class="btn color-theme-common-bg">Inscreva-se</button>
80   - <span class="subscribers">123 inscritos</span>
81   - </td>
82   - </tr>
83   - <tr>
84   - <td>
85   - <span class="date">dd/mm/aaaa</span>
86   - <span class="separator">-</span>
87   - <span class="time">HH:mm</span>
88   - <span class="separator">-</span>
89   - <span class="description">Mais médicos, Segurança Nacional, SAMU</span>
90   - <button type="button" class="btn color-theme-common-bg">Inscreva-se</button>
91   - <span class="subscribers">123 inscritos</span>
92   - </td>
93   - </tr>
94   - <tr>
95   - <td>
96   - <span class="date">dd/mm/aaaa</span>
97   - <span class="separator">-</span>
98   - <span class="time">HH:mm</span>
99   - <span class="separator">-</span>
100   - <span class="description">Mais médicos, Segurança Nacional, SAMU</span>
101   - <button type="button" class="btn color-theme-common-bg">Inscreva-se</button>
102   - <span class="subscribers">123 inscritos</span>
103   - </td>
104   - </tr>
105   - <tr>
106   - <td>
107   - <span class="date">dd/mm/aaaa</span>
108   - <span class="separator">-</span>
109   - <span class="time">HH:mm</span>
110   - <span class="separator">-</span>
111   - <span class="description">Mais médicos, Segurança Nacional, SAMU</span>
112   - <button type="button" class="btn color-theme-common-bg">Inscreva-se</button>
113   - <span class="subscribers">123 inscritos</span>
114   - </td>
115   - </tr>
116 62 </tbody>
117 63 <!-- <tfooter></tfooter> -->
118 64 </table>
... ...
src/app/components/event-list/event-list.scss
... ... @@ -17,8 +17,8 @@
17 17 transition: .3s linear all;
18 18  
19 19 &.ng-hide {
20   - height: 0px;
21   - line-height: 0px;
  20 + height: 0;
  21 + line-height: 0;
22 22 }
23 23  
24 24 // .event-list--header {
... ... @@ -72,6 +72,7 @@
72 72  
73 73 .event-bar--trigger {
74 74 color: #fff;
  75 + cursor: pointer;
75 76  
76 77 h1 {
77 78 margin-bottom: 20px;
... ...
src/app/pages/inicio/inicio.controller.js
... ... @@ -60,8 +60,8 @@
60 60 });
61 61  
62 62 // Load event list
63   - vm.DialogaService.getEvents({}, function(data) {
64   - vm.events = data;
  63 + vm.DialogaService.getEvents({}, function(events) {
  64 + vm.events = events;
65 65 vm.loadingEvents = false;
66 66 }, function(error) {
67 67 vm.$log.error('Error on getEvents.', error);
... ...
src/app/pages/inicio/inicio.html
... ... @@ -23,7 +23,7 @@
23 23  
24 24 <section class="section-event">
25 25 <div ng-if="pageInicio.events">
26   - <event-list events="[]"></event-list>
  26 + <event-list events="pageInicio.events"></event-list>
27 27 </div>
28 28 <div ng-if="!pageInicio.events && pageInicio.loadingEvents" class="container">
29 29 <div class="row">
... ...