Download as
Browse Code »

Commit 2824da3cc9120d1636abb848fa27725a7f9243f4

Authored by Leonardo Merlin
1 parent ed62c87e
Exists in master and in 8 other branches css-list, feature-captcha, feature-proposal-vote, feature-respostas, production, rafael, staging, the_glorious_return_of_piwik

Add a initial content section of programs (home)

Showing 18 changed files with 162 additions and 33 deletions   Show diff stats
gulp/conf.js
  Diff comments   View file @2824da3
... ... @@ -24,7 +24,7 @@ exports.paths = {
24 24 * to inject css preprocessor deps and js files in karma
25 25 */
26 26 exports.wiredep = {
27   - exclude: [/jquery/, /bootstrap.js$/, /bootstrap-sass-official\/.*\.js/, /bootstrap\.css/],
  27 + exclude: [/bootstrap\.css/],
28 28 directory: 'bower_components'
29 29 };
30 30  
... ...
src/app/components/navbar/navbar.html
  Diff comments   View file @2824da3
1 1 <nav class="navbar navbar-static-top">
2 2 <div class="container-fluid">
3 3 <div class="navbar-header">
  4 + <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar-collapse" aria-expanded="false">
  5 + <span class="sr-only">Alternar menu de navegação</span>
  6 + <span class="icon-bar"></span>
  7 + <span class="icon-bar"></span>
  8 + <span class="icon-bar"></span>
  9 + </button>
4 10 <a class="navbar-brand" ui-sref="inicio">
5 11 <img src="/assets/images/logo.png" alt="Dialoga Brasil | O país fica melhor quando você participa" />
6 12 <!-- <span class="glyphicon glyphicon-home"></span> Início -->
7 13 </a>
8 14 </div>
9 15  
10   - <div class="collapse navbar-collapse">
  16 + <div id="navbar-collapse" class="collapse navbar-collapse">
11 17 <ul class="nav navbar-nav">
12 18 <li><a ui-sref="sobre">Sobre</a></li>
13 19 <li><a ui-sref="programas">Programas</a></li>
... ...
src/app/components/navbar/navbar.scss
  Diff comments   View file @2824da3
... ... @@ -6,3 +6,7 @@
6 6 padding-top: 30px;
7 7 padding-bottom: 30px;
8 8 }
  9 +
  10 +.navbar-toggle .icon-bar {
  11 + background-color: #333;
  12 +}
... ...
src/app/components/programa/programa.directive.js
  Diff comments   View file @2824da3
... ... @@ -15,14 +15,16 @@
15 15 var vm = this;
16 16  
17 17 $log.debug('this.programa', vm.programa);
18   - vm.proposal = vm.programa;
  18 + vm.program = vm.programa;
19 19 }
20 20  
21 21 ProgramaController.prototype.getCategory = function () {
22   - return this.proposal.categories[0];
  22 + // return this.program.categories[0];
  23 + return 'category-object';
23 24 };
24 25 ProgramaController.prototype.getCategoryName = function () {
25   - return this.getCategory().name;
  26 + // return this.getCategory().name;
  27 + return 'category-name';
26 28 };
27 29  
28 30 ProgramaController.prototype.getImageUrl = function () {
... ... @@ -33,7 +35,7 @@
33 35 };
34 36  
35 37 ProgramaController.prototype.showContent = function () {
36   - $log.debug('TODO: showContent()');
  38 + $log.debug('TODO: showContent()', this.program);
37 39 };
38 40  
39 41 var directive = {
... ...
src/app/components/programa/programa.html
  Diff comments   View file @2824da3
1   -<div class="programa-box" ng-if="vm.proposal" ng-click="vm.showContent()">
  1 +<div class="programa-box" ng-if="vm.program" ng-click="vm.showContent()">
2 2 <div class="category">{{::vm.getCategoryName()}}</div>
3 3 <div class="image-wrapper">
4 4 <image class="img-responsive" ng-src="{{::vm.getImageUrl()}}" alt="{{::vm.getImageAlt()}}" />
... ...
src/app/components/programa/programa.scss
  Diff comments   View file @2824da3
... ... @@ -9,7 +9,7 @@ $time: 0.3s;
9 9 .image-wrapper {
10 10 position: relative;
11 11 // width: 100%;
12   - width: 370px;
  12 + // width: 370px;
13 13 // height: 170px;
14 14 background-color: red;
15 15 overflow: hidden;
... ...
src/app/components/programas/programas.directive.js 0 → 100644
  Diff comments   View file @2824da3
... ... @@ -0,0 +1,63 @@
  1 +(function() {
  2 + 'use strict';
  3 +
  4 + angular
  5 + .module('dialoga')
  6 + .directive('programaList', programaList);
  7 +
  8 + /** @ngInject */
  9 + function programaList($log) {
  10 +
  11 + /** @ngInject */
  12 + function ProgramaListController() {
  13 + $log.debug('ProgramaListController');
  14 +
  15 + var vm = this;
  16 + vm.filter = false;
  17 + vm.categories = [
  18 + {
  19 + name: 'Saúde',
  20 + slug: 'saude'
  21 + },
  22 + {
  23 + name: 'Educação',
  24 + slug: 'educacao'
  25 + }
  26 + ];
  27 +
  28 + for (var i = vm.categories.length - 1; i >= 0; i--) {
  29 + var category = vm.categories[i];
  30 + category.iconClass = vm.getIconClasses(category);
  31 + };
  32 + }
  33 +
  34 + ProgramaListController.prototype.getIconClasses = function (tema) {
  35 + return 'glyphicon glyphicon-exclamation-sign';
  36 + };
  37 +
  38 + ProgramaListController.prototype.filterByTema = function (tema) {
  39 + this.filter = tema.slug;
  40 + $log.debug('[TODO] Filterting by tema:', this.filter);
  41 + };
  42 + ProgramaListController.prototype.showAll = function () {
  43 + this.filter = null;
  44 + $log.debug('[TODO] Filterting by tema:', this.filter);
  45 + };
  46 +
  47 + var directive = {
  48 + restrict: 'E',
  49 + templateUrl: 'app/components/programas/programas.html',
  50 + scope: {
  51 + programas: '=programas',
  52 + temas: '=temas'
  53 + },
  54 + controller: ProgramaListController,
  55 + controllerAs: 'vm',
  56 + bindToController: true
  57 + };
  58 +
  59 +
  60 + return directive;
  61 + }
  62 +
  63 +})();
... ...
src/app/components/programas/programas.html 0 → 100644
  Diff comments   View file @2824da3
... ... @@ -0,0 +1,33 @@
  1 +<div class="row">
  2 + <div class="col-sm-3">
  3 + <div class="category-list">
  4 + <aside class="navigation">
  5 + <h3 class="title"><b>Programas</b> por Tema</h3>
  6 + <div class="list-group category-list">
  7 + <button type="button" class="list-group-item category-item" ng-repeat="tema in vm.categories" ng-click="vm.filterByTema(tema)">
  8 + <span ng-class="[tema.iconClass]"></span>
  9 + <span>{{::tema.name}}</span>
  10 + <span class="glyphicon glyphicon-chevron-right pull-right"></span>
  11 + </button>
  12 + </div>
  13 + </aside>
  14 + </div>
  15 + </div>
  16 +
  17 + <div class="col-sm-9">
  18 + <div class="program-list">
  19 + <div class="header">
  20 + <h2>Programas</h2>
  21 + <button type="button" ng-click="vm.showAll()" class="btn btn-link">
  22 + <span class="glyphicon glyphicon-chevron-right"></span> Ver todos os programas
  23 + </button>
  24 + </div>
  25 + <div class="row">
  26 + <programa-box programa="{}" class="col-sm-12 col-md-6"></programa-box>
  27 + <programa-box programa="{}" class="col-sm-12 col-md-6"></programa-box>
  28 + <programa-box programa="{}" class="col-sm-12 col-md-6"></programa-box>
  29 + <programa-box programa="{}" class="col-sm-12 col-md-6"></programa-box>
  30 + </div>
  31 + </div>
  32 + </div>
  33 +</div>
... ...
src/app/components/programas/programas.scss 0 → 100644
  Diff comments   View file @2824da3
... ... @@ -0,0 +1,14 @@
  1 +.program-list {
  2 +
  3 + .header {
  4 + position: relative;
  5 + height: 40px;
  6 + margin-bottom: 10px;
  7 +
  8 + button {
  9 + position: absolute;
  10 + right: 0;
  11 + top: 2px;
  12 + }
  13 + }
  14 +}
... ...
src/app/index.constants.js
  Diff comments   View file @2824da3
... ... @@ -12,6 +12,7 @@
12 12 }
13 13 })
14 14 .constant('Modernizr', Modernizr)
  15 + .constant('jQuery', jQuery)
15 16 // .constant('key', value)
16 17 ;
17 18  
... ...
src/app/index.scss
  Diff comments   View file @2824da3
... ... @@ -2,7 +2,7 @@
2 2 * If you want to override some bootstrap variables, you have to change values here.
3 3 * The list of variables are listed here bower_components/bootstrap-sass-official/assets/stylesheets/bootstrap/_variables.scss
4 4 */
5   -$navbar-inverse-link-color: #5AADBB;
  5 +// $navbar-inverse-link-color: #5AADBB;
6 6 $icon-font-path: "../../bower_components/bootstrap-sass-official/assets/fonts/bootstrap/";
7 7  
8 8 /**
... ... @@ -19,20 +19,6 @@ $icon-font-path: &quot;../../bower_components/bootstrap-sass-official/assets/fonts/bo
19 19 padding: 0.2em 0;
20 20 }
21 21  
22   -$barra-theme: ("green": #00420c, "yellow": #2c66ce, "blue": #0042b1);
23   -
24   -.skip-links a:focus {
25   - background-color: #fff !important;
26   - opacity: 1;
27   - z-index: 2;
28   -}
29   -
30   -#footer-brasil {
31   - background: none repeat scroll 0% 0% map-get($barra-theme, "blue");
32   - padding: 1em 0px;
33   - max-width: 100%;
34   -}
35   -
36 22 /**
37 23 * Do not remove this comments bellow. It's the markers used by gulp-inject to inject
38 24 * all your sass files automatically
... ...
src/app/partials/footer/footer.html
  Diff comments   View file @2824da3
1   -<div class="container">
  1 +<div id="footer" class="container">
2 2 <div class="row">
3 3 <div class="col-xs-12 text-center">
4   - <a ui-sref="termos-de-uso">Termos de uso</a>
  4 + <a id="termos-de-uso" ui-sref="termos-de-uso">Termos de uso</a>
5 5 </div>
6 6 </div>
7 7 </div>
... ...
src/app/partials/footer/footer.scss 0 → 100644
  Diff comments   View file @2824da3
... ... @@ -0,0 +1,11 @@
  1 +$barra-theme: ("green": #00420c, "yellow": #2c66ce, "blue": #0042b1);
  2 +
  3 +#footer-brasil {
  4 + background: none repeat scroll 0% 0% map-get($barra-theme, "blue");
  5 + padding: 1em 0px;
  6 + max-width: 100%;
  7 +}
  8 +
  9 +#footer {
  10 + margin: 10px 0;
  11 +}
... ...
src/app/partials/header/header.html
  Diff comments   View file @2824da3
1 1 <header class="container" ng-controller="HeaderController as header">
2 2  
3 3 <div class="skip-links">
4   - <a href="#content" class="sr-only" tabindex="0" ng-click="header.focusMainContent($event)">Ir para o conteúdo</a>
  4 + <a href="#content" class="sr-only sr-only-focusable" tabindex="0" ng-click="header.focusMainContent($event)">Ir para o conteúdo principal</a>
5 5 </div>
6 6  
7 7 <div class="row">
... ...
src/app/partials/header/header.scss 0 → 100644
  Diff comments   View file @2824da3
... ... @@ -0,0 +1,5 @@
  1 +.skip-links a:focus {
  2 + background-color: #fff !important;
  3 + opacity: 1;
  4 + z-index: 2;
  5 +}
... ...
src/app/partials/inicio/inicio.controller.js
  Diff comments   View file @2824da3
... ... @@ -6,7 +6,7 @@
6 6 .controller('InicioController', InicioController);
7 7  
8 8 /** @ngInject */
9   - function InicioController(ArticleService, $log) {
  9 + function InicioController(ArticleService, $sce, $log) {
10 10 $log.debug('InicioController');
11 11  
12 12 var vm = this;
... ... @@ -14,12 +14,10 @@
14 14  
15 15 $log.log('ArticleService', ArticleService);
16 16  
17   - // ArticleService.getList().then(function(articles){
18 17 vm.loading = true;
19 18 ArticleService.getHome().then(function(homeArticle){
20   - $log.log('ArticleService.getList().then() homeArticle.article', homeArticle.article);
21   -
22 19 vm.article = homeArticle.article;
  20 + vm.article.abstract = $sce.trustAsHtml(vm.article.abstract);
23 21 vm.loading = false;
24 22 }, function () {
25 23 $log.error('error');
... ...
src/app/partials/inicio/inicio.html
  Diff comments   View file @2824da3
1   -<div class="container">
2   - Início
3   -</div>
  1 +<section class="container">
  2 + <div class="embed-responsive embed-responsive-16by9" ng-bind-html="inicio.article.abstract"></div>
  3 +</section>
  4 +<section class="container-fluid section-programas">
  5 + <programa-list></programa-list>
  6 +</section>
... ...
src/app/partials/inicio/inicio.scss 0 → 100644
  Diff comments   View file @2824da3
... ... @@ -0,0 +1,3 @@
  1 +.section-programas {
  2 + background-color: #f1f1f1;
  3 +}
... ...