Compare View

switch
from
...
to
 
Commits (24)
README.md
... ... @@ -4,12 +4,25 @@ The Noosfero theme that uses the API to create a totally new client-side fronten
4 4  
5 5 ## Getting started
6 6  
  7 +### If you use Vagrant
  8 +Use our [VirtualBox](https://atlas.hashicorp.com/paulohtfs/boxes/noosfero-dev) with everything setup.
  9 +Run:
  10 +```
  11 + vagrant init paulohtfs/noosfero-dev
  12 + vagrant up --provider virtualbox
  13 + vagrant ssh
  14 +```
  15 +This box provides Noosfero and the Angular base theme repositories.
  16 +We've also set up vim and tmux to make the work easier.
  17 +
7 18 ### How to Install
8 19 1. Install [Node.js](https://nodejs.org/) and [npm](https://www.npmjs.com/)
9 20 1. Install [Bower](http://bower.io/): `npm install -g bower`
  21 +1. Install [Gulp](http://gulpjs.com/): `npm install -g gulp`
10 22 1. Install Node.js dependencies: `npm install`
11 23 1. Install bower dependencies: `bower install`
12   -1. Build the project: `gulp build`
  24 +1. Build the project: `npm run build`
  25 +1. Run project tests: `npm run test`
13 26  
14 27 ### How to Use
15 28  
... ... @@ -27,3 +40,13 @@ See some important folders bellow:
27 40 - Content viewer component: `src/app/article/content-viewer`
28 41 - Profile component: `src/app/profile`
29 42 - Profile Info component: `src/app/profile/info`
  43 +
  44 +
  45 +## Change theme
  46 +
  47 +1. Create the theme folder inside themes
  48 +1. Configure application to use the new theme, e.g.:
  49 +`npm config set angular-theme:theme custom-theme`
  50 +1. Create an app folder inside custom-theme and add your custom scss files
  51 +1. Put the templates that you want to override in the same structure from the main application source, e.g.:
  52 +`src/app/profile/profile.html` will be overriden by `themes/custom-theme/app/profile/profile.html`
... ...
Vagrantfile 0 → 100644
... ... @@ -0,0 +1,25 @@
  1 +#-*- mode: ruby -*-
  2 +# vi: set ft=ruby :
  3 +
  4 +# This will config you local machine
  5 +# If you having problem to up check out the README.md
  6 +Vagrant.configure(2) do |config|
  7 +
  8 + config.vm.define "noosfero-dev"
  9 +
  10 + # This box has already
  11 + # - Ruby on Rails 4
  12 + # - NVM with NodeJS v5.9.0
  13 + config.vm.box = "paulohtfs/noosfero-dev"
  14 +
  15 + # Network configurations
  16 + # Check if your host port is available
  17 + config.vm.network "forwarded_port", guest: 3000, host: 3000
  18 + config.vm.network "private_network", ip: "10.0.0.15"
  19 +
  20 + # Change according to you hardware
  21 + config.vm.provider "virtualbox" do |vm|
  22 + vm.memory = 512;
  23 + vm.cpus = 1;
  24 + end
  25 +end
... ...
gulp/build.js
... ... @@ -2,18 +2,22 @@
2 2  
3 3 var path = require('path');
4 4 var gulp = require('gulp');
  5 +var rename = require('gulp-rename');
  6 +var merge = require('merge-stream');
5 7 var conf = require('./conf');
6   -var noosferoThemePrefix = "/designs/themes/angular-theme/dist/";
  8 +
  9 +var noosferoThemePrefix = path.join("/designs/themes/angular-theme", conf.paths.dist, '/');
7 10  
8 11 var $ = require('gulp-load-plugins')({
9 12 pattern: ['gulp-*', 'main-bower-files', 'uglify-save-license', 'del']
10 13 });
11 14  
12 15 gulp.task('partials', function () {
13   - return gulp.src([
14   - path.join(conf.paths.src, '/app/**/*.html'),
15   - path.join(conf.paths.tmp, '/serve/app/**/*.html')
16   - ])
  16 + var srcPaths = [path.join(conf.paths.tmp, '/serve/app/**/*.html')];
  17 + conf.paths.allSources.forEach(function(src) {
  18 + srcPaths.push(path.join(src, '/app/**/*.html'));
  19 + });
  20 + return gulp.src(srcPaths)
17 21 .pipe($.minifyHtml({
18 22 empty: true,
19 23 spare: true,
... ... @@ -100,10 +104,11 @@ gulp.task('other', function () {
100 104 return file.stat.isFile();
101 105 });
102 106  
103   - return gulp.src([
104   - path.join(conf.paths.src, '/**/*'),
105   - path.join('!' + conf.paths.src, '/**/*.{map,ts,html,css,js,scss}')
106   - ])
  107 + var srcPaths = [path.join('!' + conf.paths.src, '/**/*.{map,ts,html,css,js,scss}')];
  108 + conf.paths.allSources.forEach(function(src) {
  109 + srcPaths.push(path.join(src, '/**/*'));
  110 + });
  111 + return gulp.src(srcPaths)
107 112 .pipe(fileFilter)
108 113 .pipe(gulp.dest(path.join(conf.paths.dist, '/')));
109 114 });
... ... @@ -116,4 +121,15 @@ gulp.task('clean-docs', [], function() {
116 121 return $.del([path.join(conf.paths.docs, '/')]);
117 122 });
118 123  
119   -gulp.task('build', ['html', 'fonts', 'other', 'locale']);
  124 +gulp.task('noosfero', ['html'], function () {
  125 + var layouts = gulp.src('layouts/**/*')
  126 + .pipe(gulp.dest(path.join(conf.paths.dist, "layouts")));
  127 + var theme = gulp.src('theme.yml')
  128 + .pipe(gulp.dest(conf.paths.dist));
  129 + var index = gulp.src(path.join(conf.paths.dist, 'index.html'))
  130 + .pipe(rename('index.html.erb'))
  131 + .pipe(gulp.dest(conf.paths.dist));
  132 + return merge(layouts, theme, index);
  133 +});
  134 +
  135 +gulp.task('build', ['html', 'fonts', 'other', 'locale', 'noosfero']);
... ...
gulp/conf.js
... ... @@ -6,7 +6,9 @@
6 6 * of the tasks
7 7 */
8 8  
  9 +var argv = require('minimist')(process.argv.slice(2));
9 10 var gutil = require('gulp-util');
  11 +var path = require('path');
10 12  
11 13 /**
12 14 * The main paths of your project handle these with care
... ... @@ -16,8 +18,15 @@ exports.paths = {
16 18 dist: 'dist',
17 19 tmp: '.tmp',
18 20 e2e: 'e2e',
19   - docs: 'docs'
  21 + docs: 'docs',
  22 + themes: 'themes'
20 23 };
  24 +exports.configTheme = function(theme) {
  25 + exports.paths.theme = path.join(exports.paths.themes, theme || "default");
  26 + exports.paths.allSources = [exports.paths.src, exports.paths.theme];
  27 + exports.paths.dist = path.join("dist", exports.paths.theme);
  28 +}
  29 +exports.configTheme(argv.theme);
21 30  
22 31 /**
23 32 * Wiredep is the lib which inject bower dependencies in your project
... ...
gulp/server.js
... ... @@ -46,7 +46,11 @@ browserSync.use(browserSyncSpa({
46 46 }));
47 47  
48 48 gulp.task('serve', ['watch'], function () {
49   - browserSyncInit([path.join(conf.paths.tmp, '/serve'), conf.paths.src]);
  49 + var srcPaths = [path.join(conf.paths.tmp, '/serve')];
  50 + conf.paths.allSources.reverse().forEach(function(src) {
  51 + srcPaths.push(src);
  52 + });
  53 + browserSyncInit(srcPaths);
50 54 });
51 55  
52 56 gulp.task('serve:dist', ['build'], function () {
... ...
gulp/styles.js
... ... @@ -25,11 +25,14 @@ var buildStyles = function() {
25 25 style: 'expanded'
26 26 };
27 27  
28   - var injectFiles = gulp.src([
29   - path.join(conf.paths.src, '/app/**/*.scss'),
  28 + var srcPaths = [
30 29 path.join('!' + conf.paths.src, '/app/index.scss'),
31 30 path.join('!' + conf.paths.src, '/app/layout/scss/*.scss')
32   - ], { read: false });
  31 + ];
  32 + conf.paths.allSources.forEach(function(src) {
  33 + srcPaths.push(path.join(src, '/app/**/*.scss'));
  34 + });
  35 + var injectFiles = gulp.src(srcPaths, { read: false });
33 36  
34 37 var injectOptions = {
35 38 transform: function(filePath) {
... ...
gulp/watch.js
... ... @@ -33,7 +33,11 @@ gulp.task('watch', ['inject'], function () {
33 33 }
34 34 });
35 35  
36   - gulp.watch(path.join(conf.paths.src, '/app/**/*.html'), function(event) {
  36 + var watchPaths = [];
  37 + conf.paths.allSources.forEach(function(src) {
  38 + watchPaths.push(path.join(src, '/app/**/*.html'));
  39 + });
  40 + gulp.watch(watchPaths, function(event) {
37 41 browserSync.reload(event.path);
38 42 });
39 43 });
... ...
package.json
... ... @@ -7,8 +7,12 @@
7 7 "moment": "^2.11.2",
8 8 "ng-forward": "0.0.1-alpha.12"
9 9 },
  10 + "config": {
  11 + "theme": "default"
  12 + },
10 13 "scripts": {
11   - "build": "webpack; gulp clean && gulp build",
  14 + "build": "webpack; gulp clean && gulp --theme=$npm_package_config_theme build",
  15 + "build-all": "gulp clean && for d in ./themes/* ; do (gulp --theme=`basename $d` build); done",
12 16 "webpack": "webpack",
13 17 "karma": "concurrently \"webpack -w\" \"karma start\"",
14 18 "docs": "gulp ngdocs; static-server docs",
... ... @@ -19,7 +23,7 @@
19 23 "test": "webpack -w --test",
20 24 "jenkins": "webpack && karma start --single-run",
21 25 "postinstall": "bower install; typings install; cd dev-scripts; typings install; cd ../; npm run fix-jqlite",
22   - "start": "concurrently \"webpack -w\" \"gulp serve\"",
  26 + "start": "concurrently \"webpack -w\" \"gulp --theme=$npm_package_config_theme serve\"",
23 27 "generate-indexes": "ts-node --project ./dev-scripts ./dev-scripts/generate-index-modules.ts",
24 28 "fix-jqlite": "ts-node --project ./dev-scripts dev-scripts/fix-jqlite.ts"
25 29 },
... ... @@ -35,7 +39,7 @@
35 39 "estraverse": "~4.1.0",
36 40 "expose-loader": "^0.7.1",
37 41 "glob": "^7.0.0",
38   - "gulp": "~3.9.0",
  42 + "gulp": "^3.9.1",
39 43 "gulp-angular-filesort": "~1.1.1",
40 44 "gulp-angular-templatecache": "~1.8.0",
41 45 "gulp-autoprefixer": "~3.0.2",
... ... @@ -75,6 +79,7 @@
75 79 "karma-webpack": "^1.7.0",
76 80 "lodash": "~3.10.1",
77 81 "main-bower-files": "~2.9.0",
  82 + "merge-stream": "^1.0.0",
78 83 "on-build-webpack": "^0.1.0",
79 84 "phantomjs": "~1.9.18",
80 85 "phantomjs-polyfill": "0.0.2",
... ...
src/app/layout/navbar/navbar.html
... ... @@ -7,7 +7,7 @@
7 7 <span class="icon-bar"></span>
8 8 <span class="icon-bar"></span>
9 9 </button>
10   - <a class="navbar-brand" ui-sref="main">
  10 + <a class="navbar-brand" ui-sref="main.environment.home">
11 11 <span class="noosfero-logo"> </span>
12 12 <span class="noosfero-name">{{"noosfero.name" | translate}}</span>
13 13 </a>
... ...
src/app/shared/pipes/date-format.filter.spec.ts
... ... @@ -8,10 +8,11 @@ describe(&quot;Filters&quot;, () =&gt; {
8 8 beforeEach(angular.mock.module("angularMoment"));
9 9  
10 10 it("convert date from the format returned by noosfero api to an ISO format", done => {
11   - let date = "2016/03/10 10:46:47";
12   - let htmlTemplate = `{{ '${date}' | dateFormat }}`;
  11 + let dateString = '2016/03/10 10:46:47';
  12 + let date = new Date(dateString);
  13 + let htmlTemplate = `{{ '${dateString}' | dateFormat }}`;
13 14 quickCreateComponent({ providers: [DateFormat], template: htmlTemplate }).then(fixture => {
14   - expect(fixture.debugElement.text()).toEqual('2016-03-10T13:46:47.000Z');
  15 + expect(fixture.debugElement.text()).toEqual(date.toISOString());
15 16 done();
16 17 });
17 18 });
... ...
themes/.keep 0 → 100644
themes/default/.keep 0 → 100644
themes/rede-brasil/app/navbar.scss 0 → 100644
... ... @@ -0,0 +1,16 @@
  1 +.navbar {
  2 + min-height: 123px;
  3 + background:url("../assets/images/redebrasil/bg-header.png") repeat-x;
  4 +
  5 + .container-fluid {
  6 + .navbar-brand {
  7 + .noosfero-logo {
  8 + background:url("../assets/images/redebrasil/header-home.png") no-repeat;
  9 + padding: 0px 257px 63px 15px;
  10 + }
  11 + .noosfero-name {
  12 + display: none;
  13 + }
  14 + }
  15 + }
  16 +}
... ...
themes/rede-brasil/app/redebrasil.scss 0 → 100644
... ... @@ -0,0 +1,8 @@
  1 +body > .ng-scope {
  2 + background:url("../assets/images/redebrasil/fundo-portal.jpg") center top #59666E no-repeat ;
  3 + min-height: 100%;
  4 +}
  5 +
  6 +html, body {
  7 + height:100%;
  8 +}
... ...
themes/rede-brasil/assets/images/redebrasil/bg-header.png 0 → 100755

536 Bytes

themes/rede-brasil/assets/images/redebrasil/fundo-portal.jpg 0 → 100755

253 KB

themes/rede-brasil/assets/images/redebrasil/header-home.png 0 → 100755

5.6 KB