Commit e27f3b3c0e690bbe1f99e2ace679d6502564df07

Authored by Leonardo Merlin
1 parent 7f9a88ee

Fix scroll behaviour. Add footer directive

src/app/components/proposal-carousel/proposal-carousel.directive.js
@@ -9,11 +9,12 @@ @@ -9,11 +9,12 @@
9 function proposalCarousel() { 9 function proposalCarousel() {
10 10
11 /** @ngInject */ 11 /** @ngInject */
12 - function ProposalCarouselController($scope, $element, $timeout, $log) { 12 + function ProposalCarouselController($scope, $state, $element, $timeout, $log) {
13 $log.debug('ProposalCarouselController'); 13 $log.debug('ProposalCarouselController');
14 14
15 var vm = this; 15 var vm = this;
16 vm.$scope = $scope; 16 vm.$scope = $scope;
  17 + vm.$state = $state;
17 vm.$element = $element; 18 vm.$element = $element;
18 vm.$timeout = $timeout; 19 vm.$timeout = $timeout;
19 vm.$log = $log; 20 vm.$log = $log;
@@ -63,6 +64,18 @@ @@ -63,6 +64,18 @@
63 vm.$scope.$emit('proposal-carousel:showProposalsList'); 64 vm.$scope.$emit('proposal-carousel:showProposalsList');
64 }; 65 };
65 66
  67 + ProposalCarouselController.prototype.showContent = function (proposal) {
  68 + var vm = this;
  69 +
  70 + vm.$state.go('programa', {
  71 + slug: proposal.parent.slug,
  72 + proposal_id: proposal.id
  73 + }, {
  74 + location: true,
  75 + reload: true
  76 + });
  77 + };
  78 +
66 var directive = { 79 var directive = {
67 restrict: 'E', 80 restrict: 'E',
68 templateUrl: 'app/components/proposal-carousel/proposal-carousel.html', 81 templateUrl: 'app/components/proposal-carousel/proposal-carousel.html',
src/app/components/proposal-carousel/proposal-carousel.html
@@ -16,7 +16,15 @@ @@ -16,7 +16,15 @@
16 <div class="proposal-carousel-middle" ng-swipe-left="vm.swipeLeft()" ng-swipe-right="vm.swipeRight()"> 16 <div class="proposal-carousel-middle" ng-swipe-left="vm.swipeLeft()" ng-swipe-right="vm.swipeRight()">
17 <div ng-repeat="proposal in vm.proposals" class="animation-swipe"> 17 <div ng-repeat="proposal in vm.proposals" class="animation-swipe">
18 <div class="content"> 18 <div class="content">
19 - <div ng-show="vm.activeIndex === $index">{{::proposal.abstract}}</div> 19 + <div ng-show="vm.activeIndex === $index">
  20 + <div class="inner">{{::proposal.abstract}}</div>
  21 + </div>
  22 + </div>
  23 + <div class="join">
  24 + <button type="button" class="btn btn-link btn-rate color-theme-common-fg" ng-click="vm.showContent(proposal)">
  25 + Participe
  26 + <span class="glyphicon glyphicon-chevron-right" aria-hidden="true"></span>
  27 + </button>
20 </div> 28 </div>
21 <div class="proposal-carousel-middle-watermark" ng-show="vm.activeIndex === $index"> 29 <div class="proposal-carousel-middle-watermark" ng-show="vm.activeIndex === $index">
22 <span>{{::($index+1)}}º</span> 30 <span>{{::($index+1)}}º</span>
@@ -26,7 +34,7 @@ @@ -26,7 +34,7 @@
26 <div class="proposal-carousel-bottom color-theme-common-bg" ng-click="vm.showProposalsList()"> 34 <div class="proposal-carousel-bottom color-theme-common-bg" ng-click="vm.showProposalsList()">
27 <div>Veja as propostas mais votadas</div> 35 <div>Veja as propostas mais votadas</div>
28 <div class="proposal-carousel-bottom-icon"> 36 <div class="proposal-carousel-bottom-icon">
29 - <span class="glyphicon glyphicon-chevron-down pull-right color-theme-common-fg"></span> 37 + <span class="glyphicon glyphicon-chevron-down pull-right color-theme-common-fg" aria-hidden="true"></span>
30 </div> 38 </div>
31 </div> 39 </div>
32 </div> 40 </div>
src/app/components/proposal-carousel/proposal-carousel.scss
@@ -9,12 +9,12 @@ @@ -9,12 +9,12 @@
9 color: #fff; 9 color: #fff;
10 font-weight: bold; 10 font-weight: bold;
11 font-size: 25px; 11 font-size: 25px;
12 - padding: 20px 15px; 12 + padding: 10px 15px;
13 13
14 &-triggers { 14 &-triggers {
15 position: absolute; 15 position: absolute;
16 right: 15px; 16 right: 15px;
17 - top: 20px; 17 + top: 8px;
18 18
19 button { 19 button {
20 border: 1px solid #fff; 20 border: 1px solid #fff;
@@ -46,14 +46,26 @@ @@ -46,14 +46,26 @@
46 46
47 .content { 47 .content {
48 position: relative; 48 position: relative;
49 - z-index: 2; 49 + z-index: 10;
  50 + }
  51 +
  52 + .join {
  53 + position: absolute;
  54 + bottom: 32px;
  55 + z-index: 10;
  56 +
  57 + .btn {
  58 + padding: 0;
  59 + font-weight: bold;
  60 + font-size: 16px;
  61 + }
50 } 62 }
51 63
52 &-watermark { 64 &-watermark {
53 position: absolute; 65 position: absolute;
54 bottom: 1px; 66 bottom: 1px;
55 left: -5px; 67 left: -5px;
56 - color: #ddd; 68 + color: #e6e6e6;
57 font-size: 150px; 69 font-size: 150px;
58 font-weight: bold; 70 font-weight: bold;
59 line-height: 116px; 71 line-height: 116px;
src/app/index.run.js
@@ -142,7 +142,7 @@ @@ -142,7 +142,7 @@
142 142
143 if (mainContentArea) { 143 if (mainContentArea) {
144 $timeout(function() { 144 $timeout(function() {
145 - $rootScope.scrollTo(mainContentArea, $event); 145 + $rootScope.scrollTo(angular.element(mainContentArea), $event);
146 }, 90); // force queue 146 }, 90); // force queue
147 } else { 147 } else {
148 $log.warn('role="main" not found.'); 148 $log.warn('role="main" not found.');
src/app/pages/article/article.controller.js
@@ -6,10 +6,11 @@ @@ -6,10 +6,11 @@
6 .controller('ArticlePageController', ArticlePageController); 6 .controller('ArticlePageController', ArticlePageController);
7 7
8 /** @ngInject */ 8 /** @ngInject */
9 - function ArticlePageController(DialogaService, $state, $sce, $log) { 9 + function ArticlePageController(DialogaService, $rootScope, $state, $sce, $log) {
10 var vm = this; 10 var vm = this;
11 11
12 vm.DialogaService = DialogaService; 12 vm.DialogaService = DialogaService;
  13 + vm.$rootScope = $rootScope;
13 vm.$state = $state; 14 vm.$state = $state;
14 vm.$sce = $sce; 15 vm.$sce = $sce;
15 vm.$log = $log; 16 vm.$log = $log;
@@ -17,6 +18,8 @@ @@ -17,6 +18,8 @@
17 vm.init(); 18 vm.init();
18 vm.loadData(); 19 vm.loadData();
19 20
  21 + vm.$rootScope.focusMainContent();
  22 +
20 vm.$log.debug('ArticlePageController'); 23 vm.$log.debug('ArticlePageController');
21 } 24 }
22 25
src/app/pages/auth/auth.controller.js
@@ -26,6 +26,8 @@ @@ -26,6 +26,8 @@
26 vm.loadData(); 26 vm.loadData();
27 vm.attachListeners(); 27 vm.attachListeners();
28 28
  29 + vm.$rootScope.focusMainContent();
  30 +
29 vm.$log.debug('AuthPageController'); 31 vm.$log.debug('AuthPageController');
30 } 32 }
31 33
src/app/pages/programas/programa.controller.js
@@ -7,8 +7,6 @@ @@ -7,8 +7,6 @@
7 7
8 /** @ngInject */ 8 /** @ngInject */
9 function ProgramaPageController(DialogaService, PATH, VOTE_OPTIONS, $state, $location, $scope, $rootScope, $element, $timeout, $log) { 9 function ProgramaPageController(DialogaService, PATH, VOTE_OPTIONS, $state, $location, $scope, $rootScope, $element, $timeout, $log) {
10 - $log.debug('ProgramaPageController');  
11 -  
12 var vm = this; 10 var vm = this;
13 11
14 vm.DialogaService = DialogaService; 12 vm.DialogaService = DialogaService;
@@ -25,6 +23,9 @@ @@ -25,6 +23,9 @@
25 vm.init(); 23 vm.init();
26 vm.loadData(); 24 vm.loadData();
27 vm.attachListeners(); 25 vm.attachListeners();
  26 + vm.$rootScope.focusMainContent();
  27 +
  28 + vm.$log.debug('ProgramaPageController');
28 } 29 }
29 30
30 ProgramaPageController.prototype.init = function() { 31 ProgramaPageController.prototype.init = function() {
src/app/pages/programas/programa.html
@@ -18,8 +18,8 @@ @@ -18,8 +18,8 @@
18 </div> 18 </div>
19 </section> 19 </section>
20 20
21 - <div ng-if="pagePrograma.article.body" ng-class="pagePrograma.category.slug">  
22 - <section> 21 + <div role="main">
  22 + <section ng-if="pagePrograma.article.body" ng-class="pagePrograma.category.slug">
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">
@@ -60,7 +60,7 @@ @@ -60,7 +60,7 @@
60 <!-- Preview > coluna da direita --> 60 <!-- Preview > coluna da direita -->
61 <div class="col-md-4"> 61 <div class="col-md-4">
62 <div class="row"> 62 <div class="row">
63 - 63 +
64 <!-- Top Proposals --> 64 <!-- Top Proposals -->
65 <div> 65 <div>
66 <!-- Loading Top Proposals --> 66 <!-- Loading Top Proposals -->
@@ -69,7 +69,7 @@ @@ -69,7 +69,7 @@
69 Carregando propostas mais votadas... 69 Carregando propostas mais votadas...
70 </div> 70 </div>
71 </div> 71 </div>
72 - 72 +
73 <!-- Top Proposals > Carousel --> 73 <!-- Top Proposals > Carousel -->
74 <div class="col-xs-12" ng-if="!pagePrograma.loadingTopProposals && pagePrograma.proposalsTopRated && pagePrograma.proposalsTopRated.length > 0"> 74 <div class="col-xs-12" ng-if="!pagePrograma.loadingTopProposals && pagePrograma.proposalsTopRated && pagePrograma.proposalsTopRated.length > 0">
75 <h3 class="color-theme-fg">Propostas mais votadas</h3> 75 <h3 class="color-theme-fg">Propostas mais votadas</h3>
@@ -83,7 +83,7 @@ @@ -83,7 +83,7 @@
83 <h3 class="color-theme-fg">Propostas nesse programa</h3> 83 <h3 class="color-theme-fg">Propostas nesse programa</h3>
84 <proposal-box proposal="pagePrograma.randomProposal" topic="pagePrograma.article" category="pagePrograma.category" can-vote="true" focus="{{pagePrograma.search.proposal_id}}" ></proposal-box> 84 <proposal-box proposal="pagePrograma.randomProposal" topic="pagePrograma.article" category="pagePrograma.category" can-vote="true" focus="{{pagePrograma.search.proposal_id}}" ></proposal-box>
85 </div> 85 </div>
86 - 86 +
87 <!-- Loading Proposal Box --> 87 <!-- Loading Proposal Box -->
88 <div ng-if="pagePrograma.loadingProposalBox"> 88 <div ng-if="pagePrograma.loadingProposalBox">
89 <div class="alert alert-info" role="alert"> 89 <div class="alert alert-info" role="alert">
@@ -91,7 +91,7 @@ @@ -91,7 +91,7 @@
91 </div> 91 </div>
92 </div> 92 </div>
93 </div> 93 </div>
94 - 94 +
95 <!-- No Proposals? okay! --> 95 <!-- No Proposals? okay! -->
96 <div ng-if="!pagePrograma.loadingTopProposals && !pagePrograma.loadingProposalBox"> 96 <div ng-if="!pagePrograma.loadingTopProposals && !pagePrograma.loadingProposalBox">
97 <div class="col-xs-12" ng-if="!pagePrograma.randomProposal && !(pagePrograma.proposalsTopRated && pagePrograma.proposalsTopRated.length > 0)"> 97 <div class="col-xs-12" ng-if="!pagePrograma.randomProposal && !(pagePrograma.proposalsTopRated && pagePrograma.proposalsTopRated.length > 0)">
src/app/pages/programas/programas.controller.js
@@ -6,11 +6,12 @@ @@ -6,11 +6,12 @@
6 .controller('ProgramasPageController', ProgramasPageController); 6 .controller('ProgramasPageController', ProgramasPageController);
7 7
8 /** @ngInject */ 8 /** @ngInject */
9 - function ProgramasPageController(DialogaService, $scope, $location, $filter, $log) { 9 + function ProgramasPageController(DialogaService, $scope, $rootScope, $location, $filter, $log) {
10 var vm = this; 10 var vm = this;
11 11
12 vm.DialogaService = DialogaService; 12 vm.DialogaService = DialogaService;
13 vm.$scope = $scope; 13 vm.$scope = $scope;
  14 + vm.$rootScope = $rootScope;
14 vm.$location = $location; 15 vm.$location = $location;
15 vm.$filter = $filter; 16 vm.$filter = $filter;
16 vm.$log = $log; 17 vm.$log = $log;
@@ -18,8 +19,9 @@ @@ -18,8 +19,9 @@
18 vm.init(); 19 vm.init();
19 vm.loadData(); 20 vm.loadData();
20 vm.attachListeners(); 21 vm.attachListeners();
  22 + vm.$rootScope.focusMainContent();
21 23
22 - $log.debug('ProgramasPageController'); 24 + vm.$log.debug('ProgramasPageController');
23 } 25 }
24 26
25 ProgramasPageController.prototype.init = function () { 27 ProgramasPageController.prototype.init = function () {
src/app/pages/programas/programas.html
@@ -6,7 +6,7 @@ @@ -6,7 +6,7 @@
6 </div> 6 </div>
7 </div> 7 </div>
8 8
9 -<div class="page--programas"> 9 +<div class="page--programas" role="main">
10 <section class="section--info"> 10 <section class="section--info">
11 <div class="container"> 11 <div class="container">
12 <div class="row"> 12 <div class="row">
src/index.html
@@ -38,9 +38,10 @@ @@ -38,9 +38,10 @@
38 <![endif]--> 38 <![endif]-->
39 39
40 <app-header></app-header> 40 <app-header></app-header>
41 - 41 +
42 <div id="content" ui-view="main"></div> 42 <div id="content" ui-view="main"></div>
43 - <div ui-view="footer"></div> 43 +
  44 + <app-footer></app-footer>
44 45
45 <div id="footer-brasil"></div> 46 <div id="footer-brasil"></div>
46 47