Commit 1601c50587e6b73bd6946c6874ed6c089f2731f0

Authored by Leonardo Merlin
2 parents 1ee9cee7 83328847

Merged

Showing 41 changed files with 776 additions and 462 deletions   Show diff stats
@@ -9,7 +9,7 @@ @@ -9,7 +9,7 @@
9 "angular-messages": "ng-messages#*", 9 "angular-messages": "ng-messages#*",
10 "angular-sanitize": "~1.4.0", 10 "angular-sanitize": "~1.4.0",
11 "angular-slugify": "~1.0.1", 11 "angular-slugify": "~1.0.1",
12 - "angular-social-links": "~0.0.19", 12 + "angular-socialshare": "angularjs-socialshare#~0.1.13",
13 "angular-touch": "~1.4.0", 13 "angular-touch": "~1.4.0",
14 "angular-ui-router": "~0.2.15", 14 "angular-ui-router": "~0.2.15",
15 "animate.css": "~3.3.0", 15 "animate.css": "~3.3.0",
src/app/components/a11y-bar/a11y-bar.html
1 -<div class="a11y-bar"> 1 +<div class="a11y-bar hidden-xs">
2 <div class="container"> 2 <div class="container">
3 <div class="row"> 3 <div class="row">
4 <div class="col-sm-6"> 4 <div class="col-sm-6">
@@ -21,12 +21,12 @@ @@ -21,12 +21,12 @@
21 <span class="color-theme-common-bg">3</span> 21 <span class="color-theme-common-bg">3</span>
22 </a> 22 </a>
23 </li> 23 </li>
24 - <li> 24 + <!-- <li>
25 <a class="color-theme-common-fg" accesskey="4" href="#footer" id="skip-to-footer" ng-click="focusOn('#footer', $event)"> 25 <a class="color-theme-common-fg" accesskey="4" href="#footer" id="skip-to-footer" ng-click="focusOn('#footer', $event)">
26 Ir para o rodapé 26 Ir para o rodapé
27 <span class="color-theme-common-bg">4</span> 27 <span class="color-theme-common-bg">4</span>
28 </a> 28 </a>
29 - </li> 29 + </li> -->
30 </ul> 30 </ul>
31 </div> 31 </div>
32 32
src/app/components/a11y-bar/a11y-bar.scss
1 .a11y-bar { 1 .a11y-bar {
2 font-size: 12px; 2 font-size: 12px;
3 padding: 5px 0; 3 padding: 5px 0;
  4 +
  5 + @media (max-width: $screen-md) {
  6 + font-size: 11px;
  7 + }
  8 +
4 span { 9 span {
5 color: #fff; 10 color: #fff;
6 padding: 0 5px; 11 padding: 0 5px;
src/app/components/article-grid/article-grid.html
1 -<div class="article-grid"> 1 +<div class="article-grid row">
2 <div ng-repeat="article in vm.articles as results"> 2 <div ng-repeat="article in vm.articles as results">
3 <article-box article="article" category="article.categories[0]" class="col-xs-12 col-sm-6"></article-box> 3 <article-box article="article" category="article.categories[0]" class="col-xs-12 col-sm-6"></article-box>
4 <div ng-if="$odd" class="clearfix"></div> 4 <div ng-if="$odd" class="clearfix"></div>
src/app/components/article-service/article.service.js
@@ -11,6 +11,7 @@ @@ -11,6 +11,7 @@
11 11
12 var service = { 12 var service = {
13 apiArticles: $rootScope.basePath + '/api/v1/articles/', 13 apiArticles: $rootScope.basePath + '/api/v1/articles/',
  14 + apiCommunities: $rootScope.basePath + '/api/v1/communities/',
14 getArticleById: getArticleById, 15 getArticleById: getArticleById,
15 getArticleBySlug: getArticleBySlug, 16 getArticleBySlug: getArticleBySlug,
16 getCategories: getCategories, 17 getCategories: getCategories,
@@ -19,6 +20,7 @@ @@ -19,6 +20,7 @@
19 getTopicById: getTopicById, 20 getTopicById: getTopicById,
20 getProposals: getProposals, 21 getProposals: getProposals,
21 getProposalsByTopicId: getProposalsByTopicId, 22 getProposalsByTopicId: getProposalsByTopicId,
  23 + getEvents: getEvents,
22 searchTopics: searchTopics, 24 searchTopics: searchTopics,
23 searchProposals: searchProposals 25 searchProposals: searchProposals
24 }; 26 };
@@ -30,7 +32,8 @@ @@ -30,7 +32,8 @@
30 var url = service.apiArticles + articleId; 32 var url = service.apiArticles + articleId;
31 var paramsExtended = angular.extend({}, params); 33 var paramsExtended = angular.extend({}, params);
32 34
33 - UtilService.get(url, {params: paramsExtended}).then(function(data){ 35 + UtilService.get(url, {params: paramsExtended})
  36 + .then(function(data){
34 cbSuccess(data); 37 cbSuccess(data);
35 }).catch(function(error){ 38 }).catch(function(error){
36 cbError(error); 39 cbError(error);
@@ -45,43 +48,38 @@ @@ -45,43 +48,38 @@
45 throw { name: 'NotImplementedYet', message: 'The service "getArticleBySlug" is not implemented yet.'}; 48 throw { name: 'NotImplementedYet', message: 'The service "getArticleBySlug" is not implemented yet.'};
46 } 49 }
47 50
48 - function getCategories (articleId, cbSuccess, cbError) { 51 + function getCategories (articleId, params, cbSuccess, cbError) {
49 // Ex.: /api/v1/articles/103358?fields= 52 // Ex.: /api/v1/articles/103358?fields=
50 53
51 var url = service.apiArticles + articleId; 54 var url = service.apiArticles + articleId;
52 -  
53 - UtilService.get(url, {params: { 55 + var paramsExtended = angular.extend({
54 'fields[]': ['id', 'categories'] 56 'fields[]': ['id', 'categories']
55 - }}).then(function(data){ 57 + }, params);
  58 +
  59 + UtilService.get(url, {params: paramsExtended})
  60 + .then(function(data){
56 cbSuccess(data); 61 cbSuccess(data);
57 }).catch(function(error){ 62 }).catch(function(error){
58 cbError(error); 63 cbError(error);
59 }); 64 });
60 } 65 }
61 66
62 - function getCategoryBySlug () { 67 + function getCategoryBySlug (/*slug, params, cbSuccess, cbError*/) {
63 throw { name: 'NotImplementedYet', message: 'The service "getArticleBySlug" is not implemented yet.'}; 68 throw { name: 'NotImplementedYet', message: 'The service "getArticleBySlug" is not implemented yet.'};
64 } 69 }
65 70
66 - function getTopics (cbSuccess, cbError) { 71 + function getTopics (params, cbSuccess, cbError) {
67 // Ex.: /api/v1/articles/103358/children?fields= 72 // Ex.: /api/v1/articles/103358/children?fields=
68 -  
69 - var url = service.apiArticles + API.articleId.home + '/children';  
70 -  
71 - UtilService.get(url, {params: {  
72 - 'fields[]': ['id', 'title', 'slug', 'abstract', 'categories', 'setting', 'children_count', 'hits']  
73 - }}).then(function(data){  
74 - cbSuccess(data);  
75 - }).catch(function(error){  
76 - cbError(error);  
77 - }); 73 + getTopicById(API.articleId.home);
78 } 74 }
79 75
80 - function getTopicById (topicId, cbSuccess, cbError) {  
81 - // Ex.: /api/v1/articles/103358/children/121521?fields= 76 + function getTopicById (topicId, params, cbSuccess, cbError) {
  77 + // Ex.: /api/v1/articles/103358/children?fields=
82 78
83 - // var url = service.apiArticles + API.articleId.home + '/children/' + topicId; // dont need to chain  
84 - var url = service.apiArticles + topicId; 79 + var url = service.apiArticles + topicId + '/children';
  80 + var paramsExtended = angular.extend({
  81 + 'fields[]': ['id', 'categories']
  82 + }, params);
85 83
86 UtilService.get(url, {params: { 84 UtilService.get(url, {params: {
87 'fields[]': ['id', 'title', 'body', 'slug', 'abstract', 'categories', 'setting', 'children_count', 'hits'] 85 'fields[]': ['id', 'title', 'body', 'slug', 'abstract', 'categories', 'setting', 'children_count', 'hits']
@@ -109,12 +107,24 @@ @@ -109,12 +107,24 @@
109 }); 107 });
110 } 108 }
111 109
  110 + /**
  111 + * Ex.: /api/v1/articles/[article_id]/children?[params]content_type=ProposalsDiscussionPlugin::Proposal
  112 + * Ex.: /api/v1/articles/103644/children?limit=20&fields=id,name,slug,abstract,created_by&content_type=ProposalsDiscussionPlugin::Proposal
  113 + *
  114 + * @param {Integer} topicId topic where has those proposals
  115 + * @param {Object} params params for pagination ant others
  116 + * @param {Function} cbSuccess callback for success
  117 + * @param {Function} cbError callback for error
  118 + * @return {Array} [description]
  119 + */
112 function getProposalsByTopicId (topicId, params, cbSuccess, cbError) { 120 function getProposalsByTopicId (topicId, params, cbSuccess, cbError) {
113 - var url = service.apiArticles + topicId; 121 + var url = service.apiArticles + topicId + '/children';
114 122
115 var paramsExtended = angular.extend({ 123 var paramsExtended = angular.extend({
116 - 'fields[]': ['id', 'title', 'abstract', 'children', 'children_count'],  
117 - 'content_type':'ProposalsDiscussionPlugin::Proposals' 124 + 'fields[]': ['id', 'title', 'abstract', 'children', 'children_count', 'ranking_position', 'hits', 'votes_for', 'votes_against'],
  125 + 'limit':'20',
  126 + 'page':'1',
  127 + 'content_type':'ProposalsDiscussionPlugin::Proposal'
118 }, params); 128 }, params);
119 129
120 UtilService.get(url, {params: paramsExtended}).then(function(data){ 130 UtilService.get(url, {params: paramsExtended}).then(function(data){
@@ -124,7 +134,22 @@ @@ -124,7 +134,22 @@
124 }); 134 });
125 } 135 }
126 136
127 - function getRandomProposal (cbSuccess, cbError) {} 137 + function getEvents (community_id, params, cbSuccess, cbError) {
  138 + // Ex.: /api/v1/communities/19195/articles?categories_ids[]=' + cat_id + '&content_type=Event';
  139 + // Ex.: /api/v1/communities/' + community_id + '/articles?categories_ids[]=' + cat_id + '&content_type=Event';
  140 +
  141 + var url = service.apiCommunities + community_id + '/articles';
  142 + var paramsExtended = angular.extend({
  143 + 'fields[]': ['id', 'slug', 'title', 'abstract', 'body', 'categories', 'created_at', 'start_date', 'end_date', 'hits'],
  144 + 'content_type':'Event'
  145 + }, params);
  146 +
  147 + UtilService.get(url, {params: paramsExtended}).then(function(data){
  148 + cbSuccess(data.articles);
  149 + }).catch(function(error){
  150 + cbError(error);
  151 + });
  152 + }
128 153
129 function searchTopics (params, cbSuccess, cbError) { 154 function searchTopics (params, cbSuccess, cbError) {
130 // Ex.: /api/v1/search/article?type=ProposalsDiscussionPlugin::Topic&query=cisternas 155 // Ex.: /api/v1/search/article?type=ProposalsDiscussionPlugin::Topic&query=cisternas
src/app/components/breadcrumb/breadcrumb.scss
@@ -3,7 +3,7 @@ @@ -3,7 +3,7 @@
3 .breadcrumb { 3 .breadcrumb {
4 background: none; 4 background: none;
5 padding: 0; 5 padding: 0;
6 - margin: 0; 6 + margin: 10px 0;
7 } 7 }
8 8
9 .glyphicon { 9 .glyphicon {
src/app/components/category-list/category-list.directive.js
@@ -9,7 +9,7 @@ @@ -9,7 +9,7 @@
9 function categoryList() { 9 function categoryList() {
10 10
11 /** @ngInject */ 11 /** @ngInject */
12 - function CategoryListController($rootScope, $location, $log) { 12 + function CategoryListController($rootScope, $element, $log) {
13 $log.debug('CategoryListController'); 13 $log.debug('CategoryListController');
14 14
15 // alias 15 // alias
@@ -17,7 +17,7 @@ @@ -17,7 +17,7 @@
17 17
18 // dependencies 18 // dependencies
19 vm.$rootScope = $rootScope; 19 vm.$rootScope = $rootScope;
20 - vm.$location = $location; 20 + vm.$element = $element;
21 vm.$log = $log; 21 vm.$log = $log;
22 22
23 // initialization 23 // initialization
@@ -25,7 +25,11 @@ @@ -25,7 +25,11 @@
25 } 25 }
26 26
27 CategoryListController.prototype.init = function() { 27 CategoryListController.prototype.init = function() {
28 - // var vm = this; 28 + var vm = this;
  29 +
  30 + if(!vm.isCollapsed){
  31 + vm.isCollapsed = false;
  32 + }
29 }; 33 };
30 34
31 CategoryListController.prototype.selectCategory = function(category, $event) { 35 CategoryListController.prototype.selectCategory = function(category, $event) {
@@ -45,6 +49,17 @@ @@ -45,6 +49,17 @@
45 vm.$rootScope.$broadcast('change-selectedCategory', vm.selectedCategory); 49 vm.$rootScope.$broadcast('change-selectedCategory', vm.selectedCategory);
46 }; 50 };
47 51
  52 +
  53 + CategoryListController.prototype.toogleList = function() {
  54 + var vm = this;
  55 +
  56 + if(!vm._listGroup){
  57 + vm._listGroup = vm.$element.find('.list-group');
  58 + }
  59 +
  60 + vm._listGroup.slideToggle();
  61 + };
  62 +
48 var directive = { 63 var directive = {
49 restrict: 'E', 64 restrict: 'E',
50 templateUrl: 'app/components/category-list/category-list.html', 65 templateUrl: 'app/components/category-list/category-list.html',
@@ -53,7 +68,7 @@ @@ -53,7 +68,7 @@
53 selectedCategory: '@' 68 selectedCategory: '@'
54 }, 69 },
55 controller: CategoryListController, 70 controller: CategoryListController,
56 - controllerAs: 'categoryListCtrl', 71 + controllerAs: 'vm',
57 bindToController: true 72 bindToController: true
58 }; 73 };
59 74
src/app/components/category-list/category-list.html
1 <div class="category-list"> 1 <div class="category-list">
2 <nav class="navigation"> 2 <nav class="navigation">
3 - <h3 class="category-list--title"><b>Programas</b> por Tema</h3>  
4 - <div class="list-group category-list" ng-class="categoryListCtrl.selectedCategory.slug"> 3 + <h3 class="category-list--title" ng-click="vm.toogleList()">
  4 + <span class="hidden-xs"><b>Programas</b> por Tema</span>
  5 + <span class="visible-xs"><b>Filtrar</b> por Tema <span class="glyphicon glyphicon-filter pull-right"></span></span>
  6 + </h3>
  7 +
  8 + <!-- <div class="list-group ng-hide" ng-show="!vm.isCollapsed" ng-class="vm.selectedCategory.slug"> -->
  9 + <div class="list-group" ng-class="vm.selectedCategory.slug">
5 <button type="button" class="list-group-item category-list--item" 10 <button type="button" class="list-group-item category-list--item"
6 - ng-repeat="category in categoryListCtrl.categories"  
7 - ng-class="{active: categoryListCtrl.selectedCategory.slug === category.slug}"  
8 - ng-click="categoryListCtrl.selectCategory(category, $event)"> 11 + ng-repeat="category in vm.categories"
  12 + ng-class="{active: vm.selectedCategory.slug === category.slug}"
  13 + ng-click="vm.selectCategory(category, $event)">
9 14
10 <span class="category-list--icon-circle" aria-hidden="true" ng-class="category.slug"></span> 15 <span class="category-list--icon-circle" aria-hidden="true" ng-class="category.slug"></span>
11 <span class="category-list--icon icon" aria-hidden="true" ng-class="'icon-tema-' + category.slug"></span> 16 <span class="category-list--icon icon" aria-hidden="true" ng-class="'icon-tema-' + category.slug"></span>
12 <span class="category-list--label">{{::category.name}}</span> 17 <span class="category-list--label">{{::category.name}}</span>
13 - <span class="category-list--icon--right glyphicon glyphicon-chevron-right"></span> 18 + <span class="category-list--icon--right glyphicon glyphicon-chevron-right hidden-xs"></span>
14 </button> 19 </button>
15 </div> 20 </div>
16 </nav> 21 </nav>
src/app/components/category-list/category-list.scss
1 .category-list { 1 .category-list {
2 - .category-list--title { 2 + &--title {
3 color: #ffffff; 3 color: #ffffff;
4 font-size: 16px; 4 font-size: 16px;
5 margin: 0; 5 margin: 0;
@@ -8,10 +8,7 @@ @@ -8,10 +8,7 @@
8 border-top-left-radius: 5px; 8 border-top-left-radius: 5px;
9 border-top-right-radius: 5px; 9 border-top-right-radius: 5px;
10 overflow: hidden; 10 overflow: hidden;
11 - }  
12 -  
13 -  
14 - .category-list--group { 11 + cursor: pointer;
15 } 12 }
16 13
17 .category-list--item { 14 .category-list--item {
@@ -23,6 +20,8 @@ @@ -23,6 +20,8 @@
23 overflow: hidden; 20 overflow: hidden;
24 } 21 }
25 22
  23 +
  24 +
26 .category-list--label { 25 .category-list--label {
27 margin-left: 70px; 26 margin-left: 70px;
28 margin-right: 30px; 27 margin-right: 30px;
@@ -93,19 +92,25 @@ @@ -93,19 +92,25 @@
93 transform: scale(1.4); 92 transform: scale(1.4);
94 } 93 }
95 94
  95 + .list-group {
  96 +
  97 + -webkit-transition: -webkit-transform .3s ease-in-out;
  98 + -moz-transition: -moz-transform .3s ease-in-out;
  99 + -o-transition: -o-transform .3s ease-in-out;
  100 + transition: transform .3s ease-in-out;
  101 +
  102 + opacity: 1;
  103 +
  104 + &.ng-hide {
  105 + opacity: 0;
  106 + // height: 0;
  107 + // line-height: 0;
  108 + }
  109 + }
  110 +
96 .list-group-item.active, 111 .list-group-item.active,
97 .list-group-item.active:hover, 112 .list-group-item.active:hover,
98 .list-group-item.active:focus { 113 .list-group-item.active:focus {
99 background-color: #f5f5f5; 114 background-color: #f5f5f5;
100 } 115 }
101 -  
102 - // @each $category, $color in $categories {  
103 - // &.#{$category} {  
104 - // .list-group-item.active,  
105 - // .list-group-item.active:hover,  
106 - // .list-group-item.active:focus {  
107 - // background-color: $color;  
108 - // }  
109 - // }  
110 - // }  
111 } 116 }
src/app/components/dialoga-service/dialoga.service.js
@@ -9,24 +9,24 @@ @@ -9,24 +9,24 @@
9 function DialogaService($rootScope, $sce, API, ArticleService, UtilService, Slug, $log) { 9 function DialogaService($rootScope, $sce, API, ArticleService, UtilService, Slug, $log) {
10 $log.debug('DialogaService'); 10 $log.debug('DialogaService');
11 11
12 - var service = {  
13 - getHome: getHome,  
14 - getAbout: getAbout,  
15 - getThemes: getThemes,  
16 - getPrograms: getPrograms,  
17 - getProgramBySlug: getProgramBySlug,  
18 - getProgramsRandom: getProgramsRandom,  
19 - getProposals: getProposals,  
20 - getProposalsByTopicId: getProposalsByTopicId,  
21 - getEvents: getEvents,  
22 - getQuestions: getQuestions,  
23 - searchProgram: searchProgram,  
24 - searchProposal: searchProposal,  
25 - }; 12 + var extendedService = angular.extend({}, ArticleService);
  13 +
  14 + extendedService.serviceDialoga = $rootScope.basePath + '/api/v1/dialoga_plugin/';
  15 + extendedService.getHome = getHome;
  16 + extendedService.getAbout = getAbout;
  17 + extendedService.getTerms = getTerms;
  18 + extendedService.getThemes = getThemes;
  19 + extendedService.getPrograms = getPrograms;
  20 + extendedService.getProgramBySlug = getProgramBySlug;
  21 + extendedService.getProgramsRandom = getProgramsRandom;
  22 + extendedService.getEvents = getEvents; // override
  23 + extendedService.getQuestions = getQuestions;
  24 + extendedService.searchPrograms = searchPrograms;
  25 + extendedService.searchProposals = searchProposals;
26 26
27 var CACHE = {}; 27 var CACHE = {};
28 28
29 - return service; 29 + return extendedService;
30 30
31 function getHome (cbSuccess, cbError) { 31 function getHome (cbSuccess, cbError) {
32 if( !!CACHE.home ){ 32 if( !!CACHE.home ){
@@ -62,6 +62,19 @@ @@ -62,6 +62,19 @@
62 } 62 }
63 } 63 }
64 64
  65 + function getTerms (cbSuccess, cbError) {
  66 + if( !!CACHE.terms ){
  67 + cbSuccess(CACHE.terms);
  68 + }else{
  69 + // load article content
  70 + ArticleService.getArticleById(API.articleId.terms, {}, function (article){
  71 + CACHE.terms = article;
  72 +
  73 + cbSuccess(CACHE.terms);
  74 + }, cbError);
  75 + }
  76 + }
  77 +
65 function getThemes (cbSuccess, cbError) { 78 function getThemes (cbSuccess, cbError) {
66 if( !!CACHE.themes ){ 79 if( !!CACHE.themes ){
67 cbSuccess(CACHE.themes); 80 cbSuccess(CACHE.themes);
@@ -91,11 +104,11 @@ @@ -91,11 +104,11 @@
91 } 104 }
92 105
93 function getProgramBySlug (slug, cbSuccess, cbError) { 106 function getProgramBySlug (slug, cbSuccess, cbError) {
94 - 107 +
95 if( !CACHE.programs ){ 108 if( !CACHE.programs ){
96 getPrograms(_getProgramBySlug, cbError); 109 getPrograms(_getProgramBySlug, cbError);
97 } else { 110 } else {
98 - _getProgramBySlug(); 111 + _getProgramBySlug();
99 } 112 }
100 113
101 function _getProgramBySlug(){ 114 function _getProgramBySlug(){
@@ -110,58 +123,46 @@ @@ -110,58 +123,46 @@
110 } 123 }
111 } 124 }
112 125
113 - function getProgramsRandom (cbSuccess, cbError) {  
114 - getPrograms(cbSuccess, cbError);  
115 - // TODO: get endpoint for production  
116 - // if( !!CACHE.programsRandom ){  
117 - // cbSuccess(CACHE.programsRandom);  
118 - // }else{  
119 - // // load article content  
120 - // // UtilService.get(API.random_topics, {params: {  
121 - // ArticleService.getArticleById(API.articleId.home, {params: {  
122 - // 'fields[]': [  
123 - // 'id', 'title', 'slug', 'abstract', 'children_count'],  
124 - // 'content_type': 'ProposalsDiscussionPlugin::Topic'  
125 - // }}).then(function(data){  
126 - // CACHE.programsRandom = data;  
127 -  
128 - // cbSuccess(data);  
129 - // }).catch(function(error){  
130 - // cbError(error);  
131 - // });  
132 - // }  
133 - } 126 + // Ex.: /api/v1/dialoga_plugin/random_topics/103358
  127 + // TODO: get endpoint for production
  128 + // TODO: put at cache?
  129 + function getProgramsRandom(params, cbSuccess, cbError) {
134 130
135 - function getProposals (param, cbSuccess, cbError) {  
136 - ArticleService.getProposals(param, function (data){  
137 - CACHE.proposals = data; 131 + if( !!CACHE.programsRandom ){
  132 + cbSuccess(CACHE.programsRandom);
  133 + }else{
  134 + var mapFromCache = !!CACHE.programs;
138 135
139 - cbSuccess(CACHE.proposals);  
140 - }, cbError);  
141 - } 136 + var url = extendedService.serviceDialoga + 'random_topics/' + API.articleId.home;
  137 + var fields = null;
142 138
143 - function getProposalsByTopicId (topicId, params, cbSuccess, cbError) {  
144 - ArticleService.getProposalsByTopicId(topicId, params, function (data){  
145 - CACHE.proposals = data; 139 + if (mapFromCache){
  140 + // get only references
  141 + fields = ['id', 'title', 'slug'];
  142 + }else{
  143 + // get all content
  144 + fields = [];
  145 + }
146 146
147 - cbSuccess(CACHE.proposals);  
148 - }, cbError);  
149 - } 147 + var paramsExtended = angular.extend({
  148 + 'fields[]': fields
  149 + }, params);
150 150
151 - function getEvents (cbSuccess, cbError) {  
152 - if( !!CACHE.events ){  
153 - cbSuccess(CACHE.events);  
154 - }else{  
155 - // load main content  
156 - getHome(function(){  
157 - if(!CACHE.hasOwnProperty('events')){  
158 - throw { name: 'NotFound', message: '"events" is not defined. "article.categories" was loaded?'};  
159 - }  
160 - cbSuccess(CACHE.events);  
161 - },cbError); 151 + UtilService.get(url, {params: paramsExtended}).then(function(data){
  152 + _pipeHandleProgramsRandomFromCache(mapFromCache, data, cbSuccess);
  153 + }).catch(function(error){
  154 + cbError(error);
  155 + });
162 } 156 }
163 } 157 }
164 158
  159 + function getEvents (params, cbSuccess, cbError) {
  160 + var paramsExtended = angular.extend({}, params);
  161 +
  162 + ArticleService.getEvents(API.communityId, paramsExtended, cbSuccess, cbError);
  163 + }
  164 +
  165 + // TODO: implement
165 function getQuestions (cbSuccess/*, cbError*/) { 166 function getQuestions (cbSuccess/*, cbError*/) {
166 if( !!CACHE.questions ){ 167 if( !!CACHE.questions ){
167 cbSuccess(CACHE.questions); 168 cbSuccess(CACHE.questions);
@@ -174,9 +175,13 @@ @@ -174,9 +175,13 @@
174 } 175 }
175 } 176 }
176 177
177 - function searchProgram (cbSuccess, cbError) {} 178 + function searchPrograms (query, cbSuccess, cbError) {
  179 + ArticleService.searchTopics({query: query}, cbSuccess, cbError);
  180 + }
178 181
179 - function searchProposal (cbSuccess, cbError) {} 182 + function searchProposals (query, cbSuccess, cbError) {
  183 + ArticleService.searchProposals({query: query}, cbSuccess, cbError);
  184 + }
180 185
181 function _pipeHandleYoutube (data) { 186 function _pipeHandleYoutube (data) {
182 var abstract = data.article.abstract; 187 var abstract = data.article.abstract;
@@ -243,6 +248,30 @@ @@ -243,6 +248,30 @@
243 } 248 }
244 } 249 }
245 250
  251 + function _pipeHandleProgramsRandomFromCache (mapFromCache, data, cbSuccess){
  252 +
  253 + if(mapFromCache){
  254 + var result = [];
  255 + var refPrograms = data.articles;
  256 +
  257 + for (var i = CACHE.programs.length - 1; i >= 0; i--) {
  258 + var cachedProgram = CACHE.programs[i];
  259 +
  260 + for (var j = refPrograms.length - 1; j >= 0; j--) {
  261 + var refProgram = refPrograms[j];
  262 +
  263 + if(refProgram.id === cachedProgram.id){
  264 + result.push(cachedProgram);
  265 + }
  266 + }
  267 + }
  268 +
  269 + data.articles = result;
  270 + }
  271 +
  272 + cbSuccess(data);
  273 + }
  274 +
246 function forceIframeParams(abstract) { 275 function forceIframeParams(abstract) {
247 var patternIframe = '<iframe src="'; 276 var patternIframe = '<iframe src="';
248 var indexOfIframe = abstract.indexOf(patternIframe); 277 var indexOfIframe = abstract.indexOf(patternIframe);
src/app/components/event-list/event-list.directive.js
@@ -19,18 +19,24 @@ @@ -19,18 +19,24 @@
19 vm.$log = $log; 19 vm.$log = $log;
20 20
21 vm.init(); 21 vm.init();
  22 + // vm.attachListeners();
22 } 23 }
23 24
24 EventListController.prototype.init = function () { 25 EventListController.prototype.init = function () {
25 var vm = this; 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 EventListController.prototype.toggleView = function () { 37 EventListController.prototype.toggleView = function () {
32 var vm = this; 38 var vm = this;
33 - vm.isListVisible = !vm.isListVisible; 39 + vm.isCollapsed = !vm.isCollapsed;
34 }; 40 };
35 41
36 EventListController.prototype.subscribe = function (data) { 42 EventListController.prototype.subscribe = function (data) {
@@ -42,8 +48,12 @@ @@ -42,8 +48,12 @@
42 var directive = { 48 var directive = {
43 restrict: 'E', 49 restrict: 'E',
44 templateUrl: 'app/components/event-list/event-list.html', 50 templateUrl: 'app/components/event-list/event-list.html',
  51 + scope: {
  52 + events: '=',
  53 + isCollapsed: '='
  54 + },
45 controller: EventListController, 55 controller: EventListController,
46 - controllerAs: 'eventListCtrl', 56 + controllerAs: 'vm',
47 bindToController: true 57 bindToController: true
48 }; 58 };
49 59
src/app/components/event-list/event-list.html
@@ -3,7 +3,7 @@ @@ -3,7 +3,7 @@
3 <section class="color-theme-common-bg"> 3 <section class="color-theme-common-bg">
4 4
5 <div class="container"> 5 <div class="container">
6 - <div class="event-bar--trigger"> 6 + <div class="event-bar--trigger" ng-click="vm.toggleView()">
7 <div class="event-bar--trigger-top"> 7 <div class="event-bar--trigger-top">
8 <div class="col-sm-6"> 8 <div class="col-sm-6">
9 <h1 class="title"> 9 <h1 class="title">
@@ -12,19 +12,20 @@ @@ -12,19 +12,20 @@
12 </h1> 12 </h1>
13 </div> 13 </div>
14 <div class="col-sm-6"> 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 <span><b>18</b> bate papos <b>agendados</b></span> 16 <span><b>18</b> bate papos <b>agendados</b></span>
17 <span class="glyphicon glyphicon-menu-down" aria-hidden="true"></span> 17 <span class="glyphicon glyphicon-menu-down" aria-hidden="true"></span>
18 </h2> 18 </h2>
19 </div> 19 </div>
20 </div> 20 </div>
  21 + <div class="clearfix"></div>
21 </div> 22 </div>
22 </div> 23 </div>
23 </section> 24 </section>
24 25
25 <section class="section-table"> 26 <section class="section-table">
26 <div class="container"> 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 <div class="event-tab--header"> 29 <div class="event-tab--header">
29 <div class="event-tab--icon"> 30 <div class="event-tab--icon">
30 <span class="glyphicon glyphicon-calendar" aria-hidden="true"></span> 31 <span class="glyphicon glyphicon-calendar" aria-hidden="true"></span>
@@ -38,81 +39,26 @@ @@ -38,81 +39,26 @@
38 </button> 39 </button>
39 </div> --> 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 <div class="event-list--table-wrapper"> 43 <div class="event-list--table-wrapper">
43 <div class="table-responsive"> 44 <div class="table-responsive">
44 <table class="table event-list--table"> 45 <table class="table event-list--table">
45 <!-- <thead></thead> --> 46 <!-- <thead></thead> -->
46 <tbody> 47 <tbody>
47 - <tr> 48 + <tr ng-repeat="event in vm.events">
48 <td> 49 <td>
49 - <span class="date">dd/mm/aaaa</span> 50 + <span class="date">{{event.start_date | date : "dd/MM/yyyy"}}</span>
50 <span class="separator">-</span> 51 <span class="separator">-</span>
51 - <span class="time">HH:mm</span> 52 + <span class="time">{{event.start_date | date : "HH:mm"}}</span>
52 <span class="separator">-</span> 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 Inscreva-se 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 </button> 58 </button>
58 <span class="subscribers">123 inscritos</span> 59 <span class="subscribers">123 inscritos</span>
59 </td> 60 </td>
60 </tr> 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 </tbody> 62 </tbody>
117 <!-- <tfooter></tfooter> --> 63 <!-- <tfooter></tfooter> -->
118 </table> 64 </table>
src/app/components/event-list/event-list.scss
@@ -17,8 +17,8 @@ @@ -17,8 +17,8 @@
17 transition: .3s linear all; 17 transition: .3s linear all;
18 18
19 &.ng-hide { 19 &.ng-hide {
20 - height: 0px;  
21 - line-height: 0px; 20 + height: 0;
  21 + line-height: 0;
22 } 22 }
23 23
24 // .event-list--header { 24 // .event-list--header {
@@ -55,7 +55,12 @@ @@ -55,7 +55,12 @@
55 text-align: center; 55 text-align: center;
56 line-height: 20px; 56 line-height: 20px;
57 cursor: pointer; 57 cursor: pointer;
58 - transition: .3s linear all; 58 +
  59 + -webkit-transition: -webkit-transform 0.3s linear all;
  60 + -moz-transition: -moz-transform 0.3s linear all;
  61 + -o-transition: -o-transform 0.3s linear all;
  62 + transition: transform 0.3s linear all;
  63 +
59 overflow: hidden; 64 overflow: hidden;
60 z-index: 100; 65 z-index: 100;
61 66
@@ -72,6 +77,7 @@ @@ -72,6 +77,7 @@
72 77
73 .event-bar--trigger { 78 .event-bar--trigger {
74 color: #fff; 79 color: #fff;
  80 + cursor: pointer;
75 81
76 h1 { 82 h1 {
77 margin-bottom: 20px; 83 margin-bottom: 20px;
src/app/components/navbar/navbar.html
@@ -20,42 +20,49 @@ @@ -20,42 +20,49 @@
20 <li ui-sref-active="active"><a ui-sref="propostas">Propostas</a></li> 20 <li ui-sref-active="active"><a ui-sref="propostas">Propostas</a></li>
21 <li ui-sref-active="active"><a ui-sref="ranking">Ranking</a></li> 21 <li ui-sref-active="active"><a ui-sref="ranking">Ranking</a></li>
22 <li ui-sref-active="active"><a ui-sref="duvidas">Dúvidas</a></li> 22 <li ui-sref-active="active"><a ui-sref="duvidas">Dúvidas</a></li>
23 - <!-- <li ui-sref-active="active"><a ui-sref="respostas">Respostas</a></li> -->  
24 - <li role="separator" class="divider"><span>|</span></li> 23 + <li role="separator" class="divider hidden-xs hidden-sm"><span>|</span></li>
25 <li class="dropdown"> 24 <li class="dropdown">
26 - <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Compartilhar <span class="icon-circle"><span class="glyphicon glyphicon-share-alt"></span></span></a>  
27 - <ul class="dropdown-menu"> 25 + <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Compartilhar <span class="icon icon-social-share-small"></span></a>
  26 + <social-share class="dropdown-menu dropdown-menu-right"></social-share>
  27 + <!-- <ul class="dropdown-menu dropdown-menu-right dropdown-menu-social">
28 <li> 28 <li>
29 - <a social-facebook custom-url="http://dialoga.gov.br" title="Compartilhar no Facebook">  
30 - <span class="icon icon-social-facebook"></span> 29 + <a socialshare
  30 + socialshare-provider="facebook"
  31 + socialshare-url="http://dialoga.gov.br"
  32 + socialshare-text="Conheça o Dialoga Brasil. Dialoga Brasil | O País fica melhor quando VOCÊ PARTICIPA."
  33 + title="Compartilhar no Facebook">
  34 + <span class="icon-circle icon-small icon-circle-social-facebook"><span class="icon icon-social-facebook"></span></span>
31 <span class="sr-only">Compartilhar no Facebook</span> 35 <span class="sr-only">Compartilhar no Facebook</span>
32 </a> 36 </a>
33 </li> 37 </li>
34 <li> 38 <li>
35 - <a social-twitter custom-url="http://dialoga.gov.br" status="This status is #{{ vm.status }}" title="Compartilhar no Twitter">  
36 - <span class="icon icon-social-twitter"></span> 39 + <a socialshare
  40 + socialshare-provider="twitter"
  41 + socialshare-url="http://dialoga.gov.br"
  42 + socialshare-text="Conheça o Dialoga Brasil. Dialoga Brasil | O País fica melhor quando VOCÊ PARTICIPA."
  43 + socialshare-hastags="dialogabrasil"
  44 + title="Compartilhar no Twitter">
  45 + <span class="icon-circle icon-small icon-circle-social-twitter"><span class="icon icon-social-twitter"></span></span>
37 <span class="sr-only">Compartilhar no Twitter</span> 46 <span class="sr-only">Compartilhar no Twitter</span>
38 </a> 47 </a>
39 </li> 48 </li>
40 <li> 49 <li>
41 - <a social-gplus custom-url="http://dialoga.gov.br" title="Compartilhar no Google Plus">  
42 - <span class="icon icon-social-google-plus"></span> 50 + <a socialshare
  51 + socialshare-provider="gplus"
  52 + socialshare-url="http://dialoga.gov.br"
  53 + socialshare-text="Conheça o Dialoga Brasil. Dialoga Brasil | O País fica melhor quando VOCÊ PARTICIPA."
  54 + title="Compartilhar no Google Plus">
  55 + <span class="icon-circle icon-small icon-circle-social-googleplus"><span class="icon icon-social-googleplus"></span></span>
43 <span class="sr-only">Compartilhar no Google Plus</span> 56 <span class="sr-only">Compartilhar no Google Plus</span>
44 </a> 57 </a>
45 </li> 58 </li>
46 - <!-- <li>  
47 - <a href="whatsapp://send?text=http%3A%2F%2Fdialoga.gov.br" target="_blank" title="Compartilhar no WhatsApp">  
48 - <span class="icon icon-social-whatsapp"></span>  
49 - <span class="sr-only">Compartilhar no WhatsApp</span>  
50 - </a>  
51 - </li> -->  
52 <li> 59 <li>
53 <a href="mailto:contato@dialoga.gov.br?subject=Conheça o Dialoga Brasil" title="Enviar por email"> 60 <a href="mailto:contato@dialoga.gov.br?subject=Conheça o Dialoga Brasil" title="Enviar por email">
54 - <span class="icon icon-social-whatsapp"></span> 61 + <span class="icon-circle icon-small icon-circle-social-whatsapp"><span class="icon icon-social-whatsapp"></span></span>
55 <span class="sr-only">Enviar por email</span> 62 <span class="sr-only">Enviar por email</span>
56 </a> 63 </a>
57 </li> 64 </li>
58 - </ul> 65 + </ul> -->
59 </li> 66 </li>
60 </ul> 67 </ul>
61 </div> 68 </div>
src/app/components/navbar/navbar.scss
1 .app-navbar { 1 .app-navbar {
2 2
3 border-bottom: 2px solid #f1f1f1; 3 border-bottom: 2px solid #f1f1f1;
4 - margin-bottom: 20px;  
5 4
6 .navbar { 5 .navbar {
7 margin-bottom: 0; 6 margin-bottom: 0;
@@ -12,13 +11,26 @@ @@ -12,13 +11,26 @@
12 height: auto; 11 height: auto;
13 padding-bottom: 0; 12 padding-bottom: 0;
14 padding-left: 0; 13 padding-left: 0;
  14 +
  15 + @media screen and (max-width: $screen-md) {
  16 + padding: 20px 0;
  17 + margin: 20px 0;
  18 + }
15 } 19 }
16 20
17 .navbar-toggle { 21 .navbar-toggle {
  22 + padding: 12px 10px;
18 margin-top: 20px; 23 margin-top: 20px;
  24 + border-radius: 100%;
  25 + background-color: #5e749d;
19 26
20 .icon-bar { 27 .icon-bar {
21 height: 3px; 28 height: 3px;
  29 + background-color: #fff;
  30 + }
  31 +
  32 + @media screen and (max-width: $screen-md) {
  33 + margin-top: 45px;
22 } 34 }
23 } 35 }
24 36
@@ -27,11 +39,15 @@ @@ -27,11 +39,15 @@
27 margin: 53px 10px 0 10px; 39 margin: 53px 10px 0 10px;
28 display: block; 40 display: block;
29 41
30 - @media screen and (max-width: 768px) { 42 + @media screen and (max-width: $screen-md) {
31 display: none; 43 display: none;
32 } 44 }
33 } 45 }
34 46
  47 + .dropdown-menu {
  48 + padding: 0;
  49 + }
  50 +
35 .navbar-nav > li { 51 .navbar-nav > li {
36 52
37 & > a { 53 & > a {
@@ -49,42 +65,31 @@ @@ -49,42 +65,31 @@
49 .contraste & { 65 .contraste & {
50 color: #fff; 66 color: #fff;
51 } 67 }
  68 +
  69 + @media screen and (max-width: $screen-md) {
  70 + margin-top: 5px;
  71 + }
52 } 72 }
53 73
54 &.active > a { 74 &.active > a {
55 border-bottom: 3px solid #77BB34; 75 border-bottom: 3px solid #77BB34;
56 76
57 - @media screen and (max-width: 768px) { 77 + @media screen and (max-width: $screen-md) {
58 border: none; 78 border: none;
59 background-color: #eee; 79 background-color: #eee;
60 padding: 10px 0 10px 0px; 80 padding: 10px 0 10px 0px;
61 } 81 }
62 } 82 }
63 83
64 - .dropdown-menu {  
65 - min-width: 190px;  
66 -  
67 - li {  
68 - float: left;  
69 - padding: 0;  
70 - margin: 0;  
71 - width: 45px; 84 + .dropdown-toggle {
  85 + margin-top: 50px;
72 86
73 - & > a {  
74 - padding: 0;  
75 - }  
76 -  
77 - &:first-child {  
78 - margin-left: 5px;  
79 - } 87 + @media screen and (max-width: $screen-md) {
  88 + margin-top: 0px;
80 } 89 }
81 } 90 }
82 } 91 }
83 92
84 - .navbar-toggle .icon-bar {  
85 - background-color: #333;  
86 - }  
87 -  
88 .contraste & { 93 .contraste & {
89 .nav > li > a:hover, 94 .nav > li > a:hover,
90 .nav > li > a:focus { 95 .nav > li > a:focus {
src/app/components/proposal-carousel/proposal-carousel.directive.js
@@ -46,6 +46,16 @@ @@ -46,6 +46,16 @@
46 vm.activeIndex = (vm.activeIndex > 0) ? --vm.activeIndex : vm.proposalsLength - 1; 46 vm.activeIndex = (vm.activeIndex > 0) ? --vm.activeIndex : vm.proposalsLength - 1;
47 }; 47 };
48 48
  49 + ProposalCarouselController.prototype.switchProposal = function (index) {
  50 + var vm = this;
  51 +
  52 + if(index >= 0 && index < vm.proposalsLength) {
  53 + vm.activeIndex = index;
  54 + }else{
  55 + vm.$log.warn('[switchProposal] "index" not handled:', index);
  56 + }
  57 + };
  58 +
49 ProposalCarouselController.prototype.showProposals = function () { 59 ProposalCarouselController.prototype.showProposals = function () {
50 var vm = this; 60 var vm = this;
51 61
src/app/components/proposal-carousel/proposal-carousel.html
1 <div class="proposal-carousel"> 1 <div class="proposal-carousel">
2 <div ng-if="vm.proposals"> 2 <div ng-if="vm.proposals">
3 - <div class="proposal-carousel-top color-theme-bg"> 3 + <div class="proposal-carousel-top color-theme-bg-darker">
4 <div class="proposal-carousel-position" ng-repeat="proposal in vm.proposals"> 4 <div class="proposal-carousel-position" ng-repeat="proposal in vm.proposals">
5 <span ng-show="vm.activeIndex === $index">{{::($index+1)}}º</span> 5 <span ng-show="vm.activeIndex === $index">{{::($index+1)}}º</span>
6 <span ng-show="vm.activeIndex === $index">Lugar</span> 6 <span ng-show="vm.activeIndex === $index">Lugar</span>
src/app/components/proposal-carousel/proposal-carousel.scss
@@ -2,6 +2,7 @@ @@ -2,6 +2,7 @@
2 background-color: #f1f1f1; 2 background-color: #f1f1f1;
3 border-radius: 5px; 3 border-radius: 5px;
4 overflow: hidden; 4 overflow: hidden;
  5 + margin-bottom: 30px;
5 6
6 &-top { 7 &-top {
7 position: relative; 8 position: relative;
@@ -57,21 +58,20 @@ @@ -57,21 +58,20 @@
57 font-weight: bold; 58 font-weight: bold;
58 line-height: 116px; 59 line-height: 116px;
59 z-index: 1; 60 z-index: 1;
60 -  
61 } 61 }
62 } 62 }
63 63
64 &-bottom { 64 &-bottom {
65 position: relative; 65 position: relative;
66 color: #fff; 66 color: #fff;
67 - padding: 10px; 67 + padding: 15px 30px;
68 font-weight: bold; 68 font-weight: bold;
69 cursor: pointer; 69 cursor: pointer;
70 z-index: 10; 70 z-index: 10;
71 71
72 &-icon { 72 &-icon {
73 position: absolute; 73 position: absolute;
74 - top: 10px; 74 + top: 15px;
75 right: 15px; 75 right: 15px;
76 76
77 .glyphicon { 77 .glyphicon {
src/app/components/proposal-related/proposal-related.directive.js
@@ -9,14 +9,11 @@ @@ -9,14 +9,11 @@
9 function proposalRelated() { 9 function proposalRelated() {
10 10
11 /** @ngInject */ 11 /** @ngInject */
12 - function ProposalRelatedController(ArticleService, $scope, $element, $timeout, $log) { 12 + function ProposalRelatedController($state, $log) {
13 $log.debug('ProposalRelatedController'); 13 $log.debug('ProposalRelatedController');
14 14
15 var vm = this; 15 var vm = this;
16 - vm.ArticleService = ArticleService;  
17 - vm.$scope = $scope;  
18 - vm.$element = $element;  
19 - vm.$timeout = $timeout; 16 + vm.$state = $state;
20 vm.$log = $log; 17 vm.$log = $log;
21 18
22 vm.init(); 19 vm.init();
@@ -24,69 +21,26 @@ @@ -24,69 +21,26 @@
24 21
25 ProposalRelatedController.prototype.init = function () { 22 ProposalRelatedController.prototype.init = function () {
26 // initial values 23 // initial values
27 - var vm = this;  
28 -  
29 - vm.activeIndex = 1;  
30 - vm.loading = false;  
31 -  
32 - if(angular.isDefined(vm.limit) && angular.isString(vm.limit)){  
33 - vm.limit = parseInt(vm.limit);  
34 - }else{  
35 - vm.limit = 3;  
36 - }  
37 -  
38 - vm.loadData(); 24 + // var vm = this;
39 }; 25 };
40 26
41 - ProposalRelatedController.prototype.loadData = function () {  
42 - // async values 27 + ProposalRelatedController.prototype.showContent = function (program) {
43 var vm = this; 28 var vm = this;
44 29
45 - vm.loading = true;  
46 -  
47 - // simulate delay  
48 - vm.$timeout(function(){  
49 - vm.loading = false;  
50 -  
51 - // Fake Data  
52 - // vm.proposals = vm.ArticleService.getProposals();  
53 - vm.proposals = [{  
54 - id: 4159,  
55 - abstract: 'Ut odio unde porro in. Aut fuga magni adipisci. Recusandae ipsum distinctio omnis ut illum.',  
56 - effective_support: 0.1572052401746725,  
57 - hits: 4159,  
58 - votes_against: 3779,  
59 - votes_for: 1780  
60 - },{  
61 - id: 935,  
62 - abstract: 'Magni sunt ut molestiae. A porro et quod saepe placeat amet nihil. Aut ut id voluptatem doloribus quia.',  
63 - effective_support: 0.1572052401746725,  
64 - hits: 8602,  
65 - votes_against: 7005,  
66 - votes_for: 8728  
67 - },{  
68 - id: 1008,  
69 - abstract: 'Cum quas assumenda nihil delectus eos. Minus fugit velit voluptatem nisi nam esse ut id.',  
70 - effective_support: 0.1572052401746725,  
71 - hits: 9181,  
72 - votes_against: 612,  
73 - votes_for: 1786  
74 - }];  
75 -  
76 - if(vm.display === 'list'){  
77 - // wait until DOM be created  
78 - vm.$timeout(function(){  
79 - // attachPopover.call(vm);  
80 - }, 20);  
81 - }  
82 - }, 2000); 30 + vm.$state.go('programa-conteudo', {
  31 + slug: program.slug
  32 + }, {
  33 + location: true
  34 + });
83 }; 35 };
84 36
85 var directive = { 37 var directive = {
86 restrict: 'E', 38 restrict: 'E',
87 templateUrl: 'app/components/proposal-related/proposal-related.html', 39 templateUrl: 'app/components/proposal-related/proposal-related.html',
88 scope: { 40 scope: {
89 - article: '=' 41 + proposal: '=',
  42 + topic: '=',
  43 + category: '='
90 }, 44 },
91 controller: ProposalRelatedController, 45 controller: ProposalRelatedController,
92 controllerAs: 'vm', 46 controllerAs: 'vm',
src/app/components/proposal-related/proposal-related.html
1 -<div class="proposal-related">  
2 - Proposta 1 +<div class="proposal-related" ng-class="{'focus':vm.isFocused}">
  2 + <div class="proposal-related--top">
  3 + <div class="proposal-related--theme color-theme-bg-darker">{{::vm.category.name}}</div>
  4 + <div class="proposal-related--program color-theme-bg">{{::vm.topic.title}}</div>
  5 + </div>
  6 + <div class="proposal-related--middle">
  7 + <div class="proposal-related--content">
  8 + <div class="proposal-related--content-inner" ng-bind-html="vm.proposal.abstract"></div>
  9 + </div>
  10 + <div class="proposal-related--join">
  11 + <button class="btn btn-link" ng-click="vm.showContent(vm.topic)">Participe</button>
  12 + </div>
  13 + <div class="proposal-related--actions text-center">
  14 + <div class="row">
  15 + <div class="col-xs-4">
  16 + <div class="action vote_for">
  17 + <div class="icon-circle">
  18 + <span class="glyphicon glyphicon-ok" aria-hidden="true"></span>
  19 + </div>
  20 + <div class="action-label">Apoio</div>
  21 + </div>
  22 + </div>
  23 + <div class="col-xs-4">
  24 + <div class="action next">
  25 + <div class="icon-circle">
  26 + <span class="glyphicon glyphicon-share-alt" aria-hidden="true"></span>
  27 + </div>
  28 + <div class="action-label">Pular</div>
  29 + </div>
  30 + </div>
  31 + <div class="col-xs-4">
  32 + <div class="action vote_against">
  33 + <div class="icon-circle">
  34 + <span class="glyphicon glyphicon-remove" aria-hidden="true"></span>
  35 + </div>
  36 + <div class="action-label">Não Apoio</div>
  37 + </div>
  38 + </div>
  39 + </div>
  40 + </div>
  41 + </div>
  42 + <div class="proposal-related--bottom text-center">
  43 + <div class="proposal-related--share">
  44 + <span>COMPARTILHE ESSA <b>PROPOSTA</b></span>
  45 + <div class="dropdown">
  46 + <button id="dropdown-share-btn" class="btn btn-link dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"><span class="icon icon-social-share-small" aria-hidden="true"></span></button>
  47 + <social-share class="dropdown-menu dropdown-menu-right"></social-share>
  48 + </div>
  49 + </div>
  50 + <div class="proposal-related--ranking">
  51 + <div class="proposal-related--ranking-inner">
  52 + <span class="icon icon-small icon-ranking" aria-hidden="true"></span>
  53 + <span>Colocação nos resultados:</span>
  54 + <span>{{::vm.proposal.ranking_position}}º</span>
  55 + </div>
  56 + </div>
  57 + </div>
3 </div> 58 </div>
src/app/components/proposal-related/proposal-related.scss
@@ -0,0 +1,77 @@ @@ -0,0 +1,77 @@
  1 +.proposal-related {
  2 + background-color: #f1f1f1;
  3 + border-radius: 5px;
  4 + // overflow: hidden;
  5 +
  6 + &.focus {
  7 + border: 7px solid #000;
  8 + border-radius: 12px;
  9 + border-color: #5E769C;
  10 + }
  11 +
  12 + &--top {
  13 + color: #fff;
  14 + font-weight: bold;
  15 +
  16 + border-top-left-radius: 5px;
  17 + border-top-right-radius: 5px;
  18 + overflow: hidden;
  19 + }
  20 +
  21 + &--middle {
  22 + padding: 30px;
  23 + }
  24 +
  25 + &--bottom {
  26 + border-bottom-left-radius: 5px;
  27 + border-bottom-right-radius: 5px;
  28 + // overflow: hidden;
  29 + border-bottom: 5px solid #dadada;
  30 + }
  31 +
  32 + &--theme {
  33 + padding: 10px 15px 5px 15px;
  34 + }
  35 +
  36 + &--program {
  37 + padding: 20px 15px;
  38 + }
  39 +
  40 + &--content {
  41 + padding-bottom: 20px;
  42 + }
  43 +
  44 + &--share {
  45 + padding: 15px 0;
  46 + background-color: #e8e8e8;
  47 + }
  48 +
  49 + &--ranking {
  50 + font-weight: bold;
  51 + padding: 10px 0;
  52 + background-color: #dadada;
  53 + }
  54 +
  55 + .action-label {
  56 + margin-top: 10px;
  57 + }
  58 +
  59 + .dropdown {
  60 + display: inline-block;
  61 + }
  62 + .dropdown-menu {
  63 + padding: 0;
  64 + margin: 0;
  65 + }
  66 +
  67 + .glyphicon {
  68 + color: #fff;
  69 + }
  70 + .icon-circle {
  71 + cursor: pointer;
  72 +
  73 + -webkit-box-shadow: 0px 2px 2px 0px rgba(0,0,0,0.3);
  74 + -moz-box-shadow: 0px 2px 2px 0px rgba(0,0,0,0.3);
  75 + box-shadow: 0px 2px 2px 0px rgba(0,0,0,0.3);
  76 + }
  77 +}
src/app/components/social-share/social-share.directive.js 0 → 100644
@@ -0,0 +1,30 @@ @@ -0,0 +1,30 @@
  1 +(function() {
  2 + 'use strict';
  3 +
  4 + angular
  5 + .module('dialoga')
  6 + .directive('socialShare', socialShare);
  7 +
  8 + /** @ngInject */
  9 + function socialShare() {
  10 + var directive = {
  11 + restrict: 'E',
  12 + templateUrl: 'app/components/social-share/social-share.html',
  13 + scope: {
  14 + },
  15 + controller: SocialShareController,
  16 + controllerAs: 'vm',
  17 + bindToController: true
  18 + };
  19 +
  20 + return directive;
  21 +
  22 + /** @ngInject */
  23 + function SocialShareController($log) {
  24 + $log.debug('SocialShareController');
  25 +
  26 + // var vm = this;
  27 + }
  28 + }
  29 +
  30 +})();
src/app/components/social-share/social-share.html 0 → 100644
@@ -0,0 +1,74 @@ @@ -0,0 +1,74 @@
  1 +<ul class="social-share list-inline">
  2 + <li>
  3 + <a socialshare
  4 + socialshare-provider="facebook"
  5 + socialshare-url="http://dialoga.gov.br"
  6 + socialshare-text="Conheça o Dialoga Brasil. Dialoga Brasil | O País fica melhor quando VOCÊ PARTICIPA."
  7 + title="Compartilhar no Facebook">
  8 + <span class="icon-circle icon-small icon-circle-social-facebook"><span class="icon icon-social-facebook"></span></span>
  9 + <span class="sr-only">Compartilhar no Facebook</span>
  10 + </a>
  11 + </li>
  12 + <li>
  13 + <a socialshare
  14 + socialshare-provider="twitter"
  15 + socialshare-url="http://dialoga.gov.br"
  16 + socialshare-text="Conheça o Dialoga Brasil. Dialoga Brasil | O País fica melhor quando VOCÊ PARTICIPA."
  17 + socialshare-hastags="dialogabrasil"
  18 + title="Compartilhar no Twitter">
  19 + <span class="icon-circle icon-small icon-circle-social-twitter"><span class="icon icon-social-twitter"></span></span>
  20 + <span class="sr-only">Compartilhar no Twitter</span>
  21 + </a>
  22 + </li>
  23 + <li>
  24 + <a socialshare
  25 + socialshare-provider="gplus"
  26 + socialshare-url="http://dialoga.gov.br"
  27 + socialshare-text="Conheça o Dialoga Brasil. Dialoga Brasil | O País fica melhor quando VOCÊ PARTICIPA."
  28 + title="Compartilhar no Google Plus">
  29 + <span class="icon-circle icon-small icon-circle-social-googleplus"><span class="icon icon-social-googleplus"></span></span>
  30 + <span class="sr-only">Compartilhar no Google Plus</span>
  31 + </a>
  32 + </li>
  33 + <li>
  34 + <a href="mailto:contato@dialoga.gov.br?subject=Conheça o Dialoga Brasil" title="Enviar por email">
  35 + <span class="icon-circle icon-small icon-circle-social-whatsapp"><span class="icon icon-social-whatsapp"></span></span>
  36 + <span class="sr-only">Enviar por email</span>
  37 + </a>
  38 + </li>
  39 +</ul>
  40 +<!-- <div class="social-share">
  41 + <ul>
  42 + <li>
  43 + <a social-facebook custom-url="http://dialoga.gov.br">
  44 + <span class="icon icon-social-facebook"></span>
  45 + <span class="sr-only">Compartilhar no Facebook</span>
  46 + </a>
  47 + </li>
  48 + <li>
  49 + <a social-twitter custom-url="http://dialoga.gov.br" status="This status is #{{ ctrl.coolWord }}">
  50 + <span class="icon icon-social-twitter"></span>
  51 + <span class="sr-only">Compartilhar no Twitter</span>
  52 + </a>
  53 + </li>
  54 + <li>
  55 + <a social-gplus custom-url="http://dialoga.gov.br">
  56 + <span class="icon icon-social-google-plus"></span>
  57 + <span class="sr-only">Compartilhar no Google Plus</span>
  58 + </a>
  59 + </li>
  60 + <li>
  61 + <a href="whatsapp://send?text=Apoio ao audiovisual brasileiro: ampliação da produção, da difusão e do acesso http%3A%2F%2Fdialoga.gov.br%2F%23%2Fprogramas%2F121492%2Fsobre-o-programa" target="_blank">
  62 + <span class="icon icon-social-whatsapp"></span>
  63 + <span class="sr-only">Compartilhar no WhatsApp</span>
  64 + </a>
  65 + </li>
  66 + </ul>
  67 +</div>
  68 + -->
  69 +<!-- <ul>
  70 + <li><a href="http://dialoga.gov.br/#/programas/121492/sobre-o-programa" class="fb-share icon icon-facebook" data-caption="Brasil de Todas as Telas" data-description="Apoio ao audiovisual brasileiro: ampliação da produção, da difusão e do acesso"><span class="fa fa-facebook"></span><span class="sr-only">Compartilhar no Facebook</span></a></li>
  71 + <li><a href="https://twitter.com/intent/tweet?url=http%3A%2F%2Fdialoga.gov.br%2F%23%2Fprogramas%2F121492%2Fsobre-o-programa&amp;text=Apoio ao audiovisual brasileiro: ampliação da produção, da difusão e do acesso" target="_blank" class="tw-share icon icon-twitter popup"><span class="fa fa-twitter"></span><span class="sr-only">Compartilhar no Twitter</span></a></li>
  72 + <li><a href="https://plus.google.com/share?url=http%3A%2F%2Fdialoga.gov.br%2F%23%2Fprogramas%2F121492%2Fsobre-o-programa" target="_blank" class="gp-share icon icon-gplus popup"><span class="fa fa-google-plus"></span><span class="sr-only">Compartilhar no Google Plus</span></a></li>
  73 + <li><a href="whatsapp://send?text=Apoio ao audiovisual brasileiro: ampliação da produção, da difusão e do acesso http%3A%2F%2Fdialoga.gov.br%2F%23%2Fprogramas%2F121492%2Fsobre-o-programa" target="_blank" class="ws-share icon icon-whatsapp"><span class="fa fa-whatsapp"></span><span class="sr-only">Compartilhar no WhatsApp</span></a></li>
  74 +</ul> -->
src/app/components/social-share/social-share.scss 0 → 100644
@@ -0,0 +1,5 @@ @@ -0,0 +1,5 @@
  1 +.social-share {
  2 + &.list-inline {
  3 + margin: 0;
  4 + }
  5 +}
src/app/components/socialShare/socialShare.directive.js
@@ -1,30 +0,0 @@ @@ -1,30 +0,0 @@
1 -(function() {  
2 - 'use strict';  
3 -  
4 - angular  
5 - .module('dialoga')  
6 - .directive('socialShare', socialShare);  
7 -  
8 - /** @ngInject */  
9 - function socialShare() {  
10 - var directive = {  
11 - restrict: 'E',  
12 - templateUrl: 'app/components/socialShare/socialShare.html',  
13 - scope: {  
14 - },  
15 - controller: SocialShareController,  
16 - controllerAs: 'vm',  
17 - bindToController: true  
18 - };  
19 -  
20 - return directive;  
21 -  
22 - /** @ngInject */  
23 - function SocialShareController($log) {  
24 - $log.debug('SocialShareController');  
25 -  
26 - // var vm = this;  
27 - }  
28 - }  
29 -  
30 -})();  
src/app/components/socialShare/socialShare.html
@@ -1,35 +0,0 @@ @@ -1,35 +0,0 @@
1 -<div class="social-share">  
2 - <ul>  
3 - <li>  
4 - <a social-facebook custom-url="http://dialoga.gov.br">  
5 - <span class="icon icon-social-facebook"></span>  
6 - <span class="sr-only">Compartilhar no Facebook</span>  
7 - </a>  
8 - </li>  
9 - <li>  
10 - <a social-twitter custom-url="http://dialoga.gov.br" status="This status is #{{ ctrl.coolWord }}">  
11 - <span class="icon icon-social-twitter"></span>  
12 - <span class="sr-only">Compartilhar no Twitter</span>  
13 - </a>  
14 - </li>  
15 - <li>  
16 - <a social-gplus custom-url="http://dialoga.gov.br">  
17 - <span class="icon icon-social-google-plus"></span>  
18 - <span class="sr-only">Compartilhar no Google Plus</span>  
19 - </a>  
20 - </li>  
21 - <li>  
22 - <a href="whatsapp://send?text=Apoio ao audiovisual brasileiro: ampliação da produção, da difusão e do acesso http%3A%2F%2Fdialoga.gov.br%2F%23%2Fprogramas%2F121492%2Fsobre-o-programa" target="_blank">  
23 - <span class="icon icon-social-whatsapp"></span>  
24 - <span class="sr-only">Compartilhar no WhatsApp</span>  
25 - </a>  
26 - </li>  
27 - </ul>  
28 -</div>  
29 -  
30 -<!-- <ul>  
31 - <li><a href="http://dialoga.gov.br/#/programas/121492/sobre-o-programa" class="fb-share icon icon-facebook" data-caption="Brasil de Todas as Telas" data-description="Apoio ao audiovisual brasileiro: ampliação da produção, da difusão e do acesso"><span class="fa fa-facebook"></span><span class="sr-only">Compartilhar no Facebook</span></a></li>  
32 - <li><a href="https://twitter.com/intent/tweet?url=http%3A%2F%2Fdialoga.gov.br%2F%23%2Fprogramas%2F121492%2Fsobre-o-programa&amp;text=Apoio ao audiovisual brasileiro: ampliação da produção, da difusão e do acesso" target="_blank" class="tw-share icon icon-twitter popup"><span class="fa fa-twitter"></span><span class="sr-only">Compartilhar no Twitter</span></a></li>  
33 - <li><a href="https://plus.google.com/share?url=http%3A%2F%2Fdialoga.gov.br%2F%23%2Fprogramas%2F121492%2Fsobre-o-programa" target="_blank" class="gp-share icon icon-gplus popup"><span class="fa fa-google-plus"></span><span class="sr-only">Compartilhar no Google Plus</span></a></li>  
34 - <li><a href="whatsapp://send?text=Apoio ao audiovisual brasileiro: ampliação da produção, da difusão e do acesso http%3A%2F%2Fdialoga.gov.br%2F%23%2Fprogramas%2F121492%2Fsobre-o-programa" target="_blank" class="ws-share icon icon-whatsapp"><span class="fa fa-whatsapp"></span><span class="sr-only">Compartilhar no WhatsApp</span></a></li>  
35 -</ul> -->  
src/app/components/socialShare/socialShare.scss
@@ -1,24 +0,0 @@ @@ -1,24 +0,0 @@
1 -.social-share {  
2 - ul {  
3 - display: inline-block;  
4 - vertical-align: middle;  
5 - list-style: none;  
6 - padding-left: 0;  
7 - }  
8 -  
9 - li{  
10 - display: inline-block;  
11 - padding: 0 2px !important;  
12 - vertical-align: top;  
13 - }  
14 -  
15 - .social-share--description {  
16 - display: inline-block;  
17 - color: #000;  
18 - font-size: 12px;  
19 - font-weight: 300;  
20 - padding-right: 10px;  
21 - text-align: right;  
22 - vertical-align: middle;  
23 - }  
24 -}  
src/app/index.constants.js
@@ -13,7 +13,8 @@ @@ -13,7 +13,8 @@
13 home: '103358', 13 home: '103358',
14 about: '108073', 14 about: '108073',
15 terms: '107880' 15 terms: '107880'
16 - } 16 + },
  17 + communityId: '19195'
17 }) 18 })
18 .constant('AUTH_EVENTS', { 19 .constant('AUTH_EVENTS', {
19 loginSuccess: 'auth-login-success', 20 loginSuccess: 'auth-login-success',
src/app/index.module.js
@@ -2,6 +2,6 @@ @@ -2,6 +2,6 @@
2 'use strict'; 2 'use strict';
3 3
4 angular 4 angular
5 - .module('dialoga', ['ngAnimate', 'ngCookies', 'ngTouch', 'ngSanitize', 'ui.router', 'ngStorage', 'socialLinks', 'slugifier', 'ncy-angular-breadcrumb', 'ngMessages']); 5 + .module('dialoga', ['ngAnimate', 'ngCookies', 'ngTouch', 'ngSanitize', 'ui.router', 'ngStorage', '720kb.socialshare', 'slugifier', 'ncy-angular-breadcrumb', 'ngMessages']);
6 6
7 })(); 7 })();
src/app/index.scss
@@ -132,8 +132,44 @@ body { @@ -132,8 +132,44 @@ body {
132 } 132 }
133 } 133 }
134 134
  135 +
  136 +.social-share {
  137 + min-width: 200px;
  138 + background-color: #eee;
  139 + padding: 5px;
  140 + height: 47px;
  141 +
  142 + &:after {
  143 + clear: both;
  144 + }
  145 +
  146 + li {
  147 + float: left;
  148 + padding: 0;
  149 + margin: 0;
  150 + width: 45px;
  151 + text-align: center;
  152 +
  153 + & > a {
  154 + padding: 0;
  155 + }
  156 +
  157 + &:first-child {
  158 + // margin-left: 5px;
  159 + }
  160 + }
  161 +
  162 + .icon {
  163 + transform: scale(0.7);
  164 + position: relative;
  165 + top: -10px;
  166 + left: -10px;
  167 + }
  168 +}
  169 +
135 .icon { 170 .icon {
136 - display: block; 171 + display: inline-block;
  172 + vertical-align: middle;
137 } 173 }
138 174
139 .icon-wrapper-rounded { 175 .icon-wrapper-rounded {
@@ -141,11 +177,53 @@ body { @@ -141,11 +177,53 @@ body {
141 border-radius: 100%; 177 border-radius: 100%;
142 } 178 }
143 179
  180 +.icon-circle {
  181 + display: inline-block;
  182 + vertical-align: middle;
  183 + width: 50px;
  184 + height: 50px;
  185 + font-size: 20px;
  186 + text-align: center;
  187 + // border: 1px solid #eee;
  188 + border-radius: 100%;
  189 + overflow: hidden;
  190 +
  191 + &.icon-small {
  192 + width: 35px;
  193 + height: 35px;
  194 + }
  195 +
  196 + .vote_for &,
  197 + .next &,
  198 + .vote_against & {
  199 + padding-top: 12px;
  200 + }
  201 +
  202 + .vote_for & {
  203 + background-color: #4AC97A;
  204 + }
  205 + .next & {
  206 + background-color: #EEB453;
  207 + }
  208 + .vote_against & {
  209 + background-color: #EC4C68;
  210 + }
  211 +}
  212 +
  213 +.icon-circle-social-facebook {background-color: #537ab5; }
  214 +.icon-circle-social-twitter {background-color: #77cbef; }
  215 +.icon-circle-social-googleplus {background-color: #d23b00; }
  216 +.icon-circle-social-whatsapp {background-color: #10ad08; }
  217 +.icon-circle-social-youtube {background-color: #c63635; }
  218 +.icon-circle-social-flickr {background-color: #eaeaea; }
  219 +.icon-circle-mail {background-color: #ecb24e; }
  220 +
144 // Theme 221 // Theme
145 @each $category, $color in $categories { 222 @each $category, $color in $categories {
146 .#{$category} { 223 .#{$category} {
147 .color-theme-fg { color: $color; } 224 .color-theme-fg { color: $color; }
148 .color-theme-bg { background-color: $color;} 225 .color-theme-bg { background-color: $color;}
  226 + .color-theme-bg-darker { background-color: darken($color, 10%);}
149 227
150 .contraste & .color-theme-fg { color: #fff; } 228 .contraste & .color-theme-fg { color: #fff; }
151 .contraste & .color-theme-bg { background-color: #000;} 229 .contraste & .color-theme-bg { background-color: #000;}
src/app/pages/header/header.html
1 <header id="header" class="container"> 1 <header id="header" class="container">
2 2
3 - <div class="row"> 3 + <div class="row hidden-xs">
4 <div class="col-sm-12"> 4 <div class="col-sm-12">
5 <auth-user></auth-user> 5 <auth-user></auth-user>
6 </div> 6 </div>
src/app/pages/header/header.scss
1 -.accessibility-wrapper {  
2 - .icon-user {  
3 - display: inline-block;  
4 - vertical-align: middle;  
5 - width: 26px;  
6 - height: 26px;  
7 - border: 1px solid #ccc;  
8 - border-radius: 100%;  
9 - background-position: 1px 0px; 1 +#header {
10 2
11 - .contraste & {  
12 - // XXX: chage for dinamic handler  
13 - background-position: -0px -24px;  
14 - } 3 + @media (max-width: $screen-md) {
  4 +
15 } 5 }
16 -} 6 -}
  7 +}
17 \ No newline at end of file 8 \ No newline at end of file
src/app/pages/inicio/inicio.controller.js
@@ -53,20 +53,23 @@ @@ -53,20 +53,23 @@
53 } 53 }
54 54
55 loadAfterHome(); 55 loadAfterHome();
56 - 56 +
57 vm.loading = false; 57 vm.loading = false;
58 }, function(error) { 58 }, function(error) {
59 vm.$log.error('Error on getHome.', error); 59 vm.$log.error('Error on getHome.', error);
60 }); 60 });
61 61
  62 + // Load event list
  63 + vm.DialogaService.getEvents({}, function(events) {
  64 + vm.events = events;
  65 + vm.loadingEvents = false;
  66 + }, function(error) {
  67 + vm.$log.error('Error on getEvents.', error);
  68 + vm.loadingEvents = false;
  69 + vm.eventsError = true;
  70 + });
  71 +
62 function loadAfterHome () { 72 function loadAfterHome () {
63 - // Load event list  
64 - // vm.DialogaService.getEvents(function(data) {  
65 - // vm.events = data;  
66 - // vm.loadingEvents = false;  
67 - // }, function(error) {  
68 - // vm.$log.error('Error on getEvents.', error);  
69 - // });  
70 73
71 // Load theme list 74 // Load theme list
72 vm.DialogaService.getThemes(function(data) { 75 vm.DialogaService.getThemes(function(data) {
@@ -77,9 +80,9 @@ @@ -77,9 +80,9 @@
77 }); 80 });
78 81
79 // Load program list 82 // Load program list
80 - vm.DialogaService.getProgramsRandom(function(data) { 83 + vm.DialogaService.getProgramsRandom({}, function(data) {
81 vm.programs = vm.article.children; 84 vm.programs = vm.article.children;
82 - vm.filtredPrograms = data; 85 + vm.filtredPrograms = data.articles;
83 vm.loadingPrograms = false; 86 vm.loadingPrograms = false;
84 }, function(error) { 87 }, function(error) {
85 vm.$log.error('Error on getPrograms.', error); 88 vm.$log.error('Error on getPrograms.', error);
src/app/pages/inicio/inicio.html
@@ -23,7 +23,7 @@ @@ -23,7 +23,7 @@
23 23
24 <section class="section-event"> 24 <section class="section-event">
25 <div ng-if="pageInicio.events"> 25 <div ng-if="pageInicio.events">
26 - <event-list events="[]"></event-list> 26 + <event-list events="pageInicio.events"></event-list>
27 </div> 27 </div>
28 <div ng-if="!pageInicio.events && pageInicio.loadingEvents" class="container"> 28 <div ng-if="!pageInicio.events && pageInicio.loadingEvents" class="container">
29 <div class="row"> 29 <div class="row">
@@ -48,7 +48,7 @@ @@ -48,7 +48,7 @@
48 <div ng-if="pageInicio.loading && !pageInicio.error"> 48 <div ng-if="pageInicio.loading && !pageInicio.error">
49 <div class="alert alert-info" role="alert">Carregando conteúdo...</div> 49 <div class="alert alert-info" role="alert">Carregando conteúdo...</div>
50 </div> 50 </div>
51 - 51 +
52 <div ng-if="pageInicio.error"> 52 <div ng-if="pageInicio.error">
53 <div class="alert alert-danger" role="alert"> 53 <div class="alert alert-danger" role="alert">
54 Erro ao carregar o conteúdo principal. 54 Erro ao carregar o conteúdo principal.
@@ -63,6 +63,23 @@ @@ -63,6 +63,23 @@
63 <div class="container"> 63 <div class="container">
64 <div id="lista-de-programas" class="row"> 64 <div id="lista-de-programas" class="row">
65 <div class="col-sm-4 col-md-3"> 65 <div class="col-sm-4 col-md-3">
  66 + <div class="row visible-xs">
  67 + <div class="col-xs-12">
  68 + <div class="input-group input-group-lg input-group-search">
  69 + <label for="articleQueryFilter" class="control-label sr-only">Buscar programas:</label>
  70 + <input id="articleQueryFilter" type="search" class="form-control input-search" ng-model="pageInicio.query" placeholder="Buscar programas" aria-label="Buscar programas" >
  71 + <span class="input-group-btn">
  72 + <button type="button" class="btn btn-default" ng-click="pageInicio.search()">
  73 + <span class="icon-circle icon-small color-theme-common-bg">
  74 + <span class="glyphicon glyphicon-search"></span>
  75 + </span>
  76 + <span class="sr-only">Buscar</span>
  77 + </button>
  78 + </span>
  79 + </div>
  80 + <br/>
  81 + </div>
  82 + </div>
66 <div ng-if="pageInicio.themes"> 83 <div ng-if="pageInicio.themes">
67 <category-list categories="pageInicio.themes" selected-category="pageInicio.selectedTheme"></category-list> 84 <category-list categories="pageInicio.themes" selected-category="pageInicio.selectedTheme"></category-list>
68 </div> 85 </div>
@@ -78,32 +95,46 @@ @@ -78,32 +95,46 @@
78 </div> 95 </div>
79 </div> 96 </div>
80 <div class="col-sm-8 col-md-9"> 97 <div class="col-sm-8 col-md-9">
81 - <div class="row">  
82 - <header class="header">  
83 - <h2>Conheça os programas <span class="small">({{pageInicio.filtredPrograms.length}}/{{::pageInicio.programs.length}})</span></h2>  
84 - <button type="button" class="btn btn-link" ng-click="pageInicio.showAll($event)">  
85 - <span class="glyphicon glyphicon-chevron-right" aria-hidden="true"></span> Ver todos os {{::pageInicio.programs.length}} programas  
86 - </button>  
87 - </header> 98 + <div class="row hidden-xs">
  99 + <div class="col-xs-12">
  100 + <div class="input-group input-group-lg input-group-search">
  101 + <label for="articleQueryFilter" class="control-label sr-only">Buscar programas:</label>
  102 + <input id="articleQueryFilter" type="search" class="form-control input-search" ng-model="pageInicio.query" placeholder="Buscar programas" aria-label="Buscar programas" >
  103 + <span class="input-group-btn">
  104 + <button type="button" class="btn btn-default" ng-click="pageInicio.search()">
  105 + <span class="icon-circle icon-small color-theme-common-bg">
  106 + <span class="glyphicon glyphicon-search"></span>
  107 + </span>
  108 + <span class="sr-only">Buscar</span>
  109 + </button>
  110 + </span>
  111 + </div>
  112 + </div>
88 </div> 113 </div>
89 <div class="row"> 114 <div class="row">
90 - <div class="col-xs-6 col-sm-7 col-md-9">  
91 - <label for="articleQueryFilter" class="control-label sr-only">Filtrar programas:</label>  
92 - <input id="articleQueryFilter" type="search" class="form-control" ng-model="pageInicio.query" placeholder="Filtrar programas" aria-label="Filtrar programas" > 115 + <div class="col-sm-12">
  116 + <header class="header">
  117 + <h2>Programas</h2>
  118 + <button type="button" class="btn btn-link" ng-click="pageInicio.showAll($event)">
  119 + <span class="glyphicon glyphicon-chevron-right" aria-hidden="true"></span> Ver todos os {{::pageInicio.programs.length}} programas
  120 + </button>
  121 + </header>
93 </div> 122 </div>
94 </div> 123 </div>
95 124
96 - <div ng-if="pageInicio.programs">  
97 - <article-grid articles="pageInicio.filtredPrograms"></article-grid>  
98 - </div>  
99 - <div ng-if="!pageInicio.programs && pageInicio.loadingPrograms">  
100 - <div class="alert alert-info" role="alert">  
101 - Carregando programas. 125 + <div class="row">
  126 + <div class="col-sm-12" ng-if="pageInicio.programs">
  127 + <article-grid articles="pageInicio.filtredPrograms"></article-grid>
102 </div> 128 </div>
103 - </div>  
104 - <div ng-if="!pageInicio.programs && pageInicio.programsError">  
105 - <div class="alert alert-danger" role="alert">  
106 - Não foi possível carregar a lista de programas neste momento. 129 + <div ng-if="!pageInicio.programs && pageInicio.loadingPrograms">
  130 + <div class="alert alert-info" role="alert">
  131 + Carregando programas.
  132 + </div>
  133 + </div>
  134 + <div ng-if="!pageInicio.programs && pageInicio.programsError">
  135 + <div class="alert alert-danger" role="alert">
  136 + Não foi possível carregar a lista de programas neste momento.
  137 + </div>
107 </div> 138 </div>
108 </div> 139 </div>
109 </div> 140 </div>
src/app/pages/inicio/inicio.scss
1 .page--inicio { 1 .page--inicio {
2 - margin-top: 20px; 2 +
  3 + .section-video {
  4 + padding: 20px 0;
  5 + // background-color: #919191;
  6 + }
3 7
4 .section--articles { 8 .section--articles {
5 9
6 .header { 10 .header {
7 position: relative; 11 position: relative;
8 - height: 40px;  
9 - margin-bottom: 10px;  
10 12
11 button { 13 button {
12 position: absolute; 14 position: absolute;
@@ -22,6 +24,20 @@ @@ -22,6 +24,20 @@
22 } 24 }
23 } 25 }
24 } 26 }
  27 +
  28 + .input-group-search {
  29 + .icon-circle {
  30 + color: #fff;
  31 + padding: 5px;
  32 + margin-top: -5px;
  33 + }
  34 + button {
  35 + border-left: none;
  36 + }
  37 + }
  38 + .input-group-btn {
  39 + background-color: #fff;
  40 + }
25 } 41 }
26 42
27 .section-gray { 43 .section-gray {
src/app/pages/programas/programa-content.controller.js
@@ -6,7 +6,7 @@ @@ -6,7 +6,7 @@
6 .controller('ProgramaContentPageController', ProgramaContentPageController); 6 .controller('ProgramaContentPageController', ProgramaContentPageController);
7 7
8 /** @ngInject */ 8 /** @ngInject */
9 - function ProgramaContentPageController(DialogaService, $state, $scope, $rootScope, $log) { 9 + function ProgramaContentPageController(DialogaService, $state, $scope, $rootScope, $element, $log) {
10 $log.debug('ProgramaContentPageController'); 10 $log.debug('ProgramaContentPageController');
11 11
12 var vm = this; 12 var vm = this;
@@ -15,6 +15,7 @@ @@ -15,6 +15,7 @@
15 vm.$state = $state; 15 vm.$state = $state;
16 vm.$scope = $scope; 16 vm.$scope = $scope;
17 vm.$rootScope = $rootScope; 17 vm.$rootScope = $rootScope;
  18 + vm.$element = $element;
18 vm.$log = $log; 19 vm.$log = $log;
19 20
20 vm.init(); 21 vm.init();
@@ -54,33 +55,42 @@ @@ -54,33 +55,42 @@
54 } 55 }
55 56
56 vm.DialogaService.getProposalsByTopicId(vm.article.id, {}, function(data){ 57 vm.DialogaService.getProposalsByTopicId(vm.article.id, {}, function(data){
57 - vm.proposals = data.children;  
58 - vm.proposalsTopRated = [  
59 - {abstract: 'Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec tristique consectetur neque, at tincidunt enim volutpat sit amet. Integer sed cursus metus, non luctus risus. Mauris elementum est quis vehicula ullamcorper.'},  
60 - {abstract: 'Mauris elementum est quis vehicula ullamcorper. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec tristique consectetur neque, at tincidunt enim volutpat sit amet. Integer sed cursus metus, non luctus risus.'},  
61 - {abstract: 'Integer sed cursus metus, non luctus risus. Mauris elementum est quis vehicula ullamcorper. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec tristique consectetur neque, at tincidunt enim volutpat sit amet.'},  
62 - ]; 58 + vm.proposals = data.articles;
  59 + vm.proposalsTopRated = vm.proposals.slice(0, 3);
63 }, function (error) { 60 }, function (error) {
64 vm.$log.error(error); 61 vm.$log.error(error);
65 }); 62 });
66 - 63 +
  64 + // get random proposal
  65 + vm.DialogaService.getProposalsByTopicId(vm.article.id, {
  66 + 'order': 'random()',
  67 + 'limit': '1'
  68 + }, function(data){
  69 + vm.randomProposal = data.articles[0];
  70 + }, function (error) {
  71 + vm.$log.error(error);
  72 + });
  73 +
67 vm.loading = false; 74 vm.loading = false;
68 }, function(error) { 75 }, function(error) {
69 vm.$log.error(error); 76 vm.$log.error(error);
70 vm.error = error; 77 vm.error = error;
71 vm.loading = false; 78 vm.loading = false;
72 - 79 +
73 // vm.$log.info('Rollback to home page.'); 80 // vm.$log.info('Rollback to home page.');
74 // vm.$state.go('inicio', {}, {location: true}); 81 // vm.$state.go('inicio', {}, {location: true});
75 }); 82 });
76 -  
77 }; 83 };
78 84
79 ProgramaContentPageController.prototype.attachListeners = function() { 85 ProgramaContentPageController.prototype.attachListeners = function() {
80 var vm = this; 86 var vm = this;
81 87
82 vm.$scope.$on('proposal-carousel:toProposals', function() { 88 vm.$scope.$on('proposal-carousel:toProposals', function() {
83 - vm.$log.warn('TODO: handle see proposals / ranking'); 89 + if(!vm._proposal_list){
  90 + vm._proposal_list = vm.$element.find('.proposal-ranking-section');
  91 + }
  92 +
  93 + vm._proposal_list.slideToggle();
84 }); 94 });
85 }; 95 };
86 96
src/app/pages/programas/programa.html
@@ -23,7 +23,7 @@ @@ -23,7 +23,7 @@
23 <div class="container"> 23 <div class="container">
24 <div class="row"> 24 <div class="row">
25 <article class="program-preview"> 25 <article class="program-preview">
26 - 26 +
27 <div class="col-md-12"> 27 <div class="col-md-12">
28 <h1 class="program-preview--title color-theme-fg">{{::pageProgramaContent.article.title}}</h1> 28 <h1 class="program-preview--title color-theme-fg">{{::pageProgramaContent.article.title}}</h1>
29 </div> 29 </div>
@@ -41,10 +41,8 @@ @@ -41,10 +41,8 @@
41 <p>Lorem ipsum dolor sit amet, ea veniam mucius ocurreret vix, ius ex nisl vidisse partiendo. Blandit nominavi cum ei, paulo quaestio his ei, eum minim salutandi in. Civibus albucius in quo, et eam posse facilisis. Debet suavitate sea ut, his ei feugiat fastidii eleifend. Quo ex quando maiestatis voluptatum, mel te perpetua maiestatis, sit ceteros legendos deserunt ea. Enim dolores moderatius eu pro, ad quo ignota aliquid meliore.</p> 41 <p>Lorem ipsum dolor sit amet, ea veniam mucius ocurreret vix, ius ex nisl vidisse partiendo. Blandit nominavi cum ei, paulo quaestio his ei, eum minim salutandi in. Civibus albucius in quo, et eam posse facilisis. Debet suavitate sea ut, his ei feugiat fastidii eleifend. Quo ex quando maiestatis voluptatum, mel te perpetua maiestatis, sit ceteros legendos deserunt ea. Enim dolores moderatius eu pro, ad quo ignota aliquid meliore.</p>
42 </div> 42 </div>
43 <div class="program-preview--share"> 43 <div class="program-preview--share">
44 - <ul class="list-inline">  
45 - <li>Compartilhe este programa:</li>  
46 - <li><social-share class="program-preview--share-directive"></social-share></li>  
47 - </ul> 44 + <div class="program-preview--share-label">Compartilhe este programa:</div>
  45 + <social-share class="program-preview--share-directive"></social-share>
48 </div> 46 </div>
49 <div class="program-preview--make-proposal"> 47 <div class="program-preview--make-proposal">
50 <div class="row"> 48 <div class="row">
@@ -60,15 +58,22 @@ @@ -60,15 +58,22 @@
60 </div> 58 </div>
61 <div class="col-md-4"> 59 <div class="col-md-4">
62 <div class="row"> 60 <div class="row">
63 - <div class="col-xs-12"> 61 + <div class="col-xs-12" ng-if="pageProgramaContent.proposalsTopRated && pageProgramaContent.proposalsTopRated.length > 0">
64 <h3 class="color-theme-fg">Propostas mais votadas</h3> 62 <h3 class="color-theme-fg">Propostas mais votadas</h3>
65 - <div ng-if="pageProgramaContent.proposalsTopRated">  
66 - <proposal-carousel proposals="pageProgramaContent.proposalsTopRated"></proposal-carousel>  
67 - </div> 63 + <proposal-carousel proposals="pageProgramaContent.proposalsTopRated"></proposal-carousel>
68 </div> 64 </div>
69 - <div class="col-xs-12"> 65 + <div class="col-xs-12" ng-if="pageProgramaContent.randomProposal">
70 <h3 class="color-theme-fg">Propostas nesse programa</h3> 66 <h3 class="color-theme-fg">Propostas nesse programa</h3>
71 - <proposal-related article="pageProgramaContent.article"></proposal-related> 67 + <proposal-related proposal="pageProgramaContent.randomProposal" topic="pageProgramaContent.article" category="pageProgramaContent.category"></proposal-related>
  68 + </div>
  69 + <div class="col-xs-12" ng-if="!pageProgramaContent.randomProposal && !(pageProgramaContent.proposalsTopRated && pageProgramaContent.proposalsTopRated.length > 0)">
  70 + <h3>Programas sem propostas</h3>
  71 + <p>
  72 + Este programa ainda não possui nenhuma proposta.
  73 + <div class="button--themed">
  74 + <button type="button" class="btn btn-block" ng-click="pageProgramaContent.makeProposal()">Faça uma proposta</button>
  75 + </div>
  76 + </p>
72 </div> 77 </div>
73 </div> 78 </div>
74 </div> 79 </div>
@@ -77,17 +82,17 @@ @@ -77,17 +82,17 @@
77 </div> 82 </div>
78 </section> 83 </section>
79 84
80 - <section class="proposal-ranking-section"> 85 + <section class="proposal-ranking-section" style="display:none;" ng-if="pageProgramaContent.proposals && pageProgramaContent.proposals.length > 0">
81 <div class="container"> 86 <div class="container">
82 <div class="proposal-ranking-section-header"> 87 <div class="proposal-ranking-section-header">
83 <h3 class="color-theme-fg">Resultados de propostas mais votadas</h3> 88 <h3 class="color-theme-fg">Resultados de propostas mais votadas</h3>
84 </div> 89 </div>
85 - <div class="proposal-ranking-section-table" ng-if="pageProgramaContent.proposals"> 90 + <div class="proposal-ranking-section-table">
86 <proposal-list proposals="pageProgramaContent.proposals"></proposal-list> 91 <proposal-list proposals="pageProgramaContent.proposals"></proposal-list>
87 </div> 92 </div>
88 </div> 93 </div>
89 </section> 94 </section>
90 - 95 +
91 <section class="section-content"> 96 <section class="section-content">
92 <article class="program-content" ng-if="pageProgramaContent.article"> 97 <article class="program-content" ng-if="pageProgramaContent.article">
93 <div ng-bind-html="pageProgramaContent.article.body"></div> 98 <div ng-bind-html="pageProgramaContent.article.body"></div>
src/app/pages/programas/programas.scss
@@ -51,6 +51,12 @@ @@ -51,6 +51,12 @@
51 position: relative; 51 position: relative;
52 } 52 }
53 53
  54 + .program-preview--share-label,
  55 + .program-preview--share-directive {
  56 + display: inline-block;
  57 + vertical-align: middle;
  58 + }
  59 +
54 h2, 60 h2,
55 h3{ 61 h3{
56 font-weight: bold; 62 font-weight: bold;
src/assets/images/icons/ranking.png

298 Bytes | W: | H:

399 Bytes | W: | H:

  • 2-up
  • Swipe
  • Onion skin
src/assets/images/icons/social-share-small.png 0 → 100644

1.67 KB

src/assets/images/icons/sprite.png

106 KB