Commit 7f3632f75a883eb2cfd12f8f9aeea3003e9533a9

Authored by Caio Almeida
2 parents e2745129 965b4c33

Merge branch 'master' into recent-activities

@@ -53,7 +53,7 @@ See some important folders bellow: @@ -53,7 +53,7 @@ See some important folders bellow:
53 53
54 ## Change skin 54 ## Change skin
55 55
56 -- Create an any scss file into: `app/layout/skins/` 56 +- Create an any scss file into: `app/layout/scss/skins/`
57 > **Suggestion:** Create a `sass` file partial. Something like: **`_mycustom.scss`**. 57 > **Suggestion:** Create a `sass` file partial. Something like: **`_mycustom.scss`**.
58 58
59 - Extend your skin css class from `%skin-base` scss placeholder selector. Something like this: 59 - Extend your skin css class from `%skin-base` scss placeholder selector. Something like this:
@@ -66,6 +66,14 @@ See some important folders bellow: @@ -66,6 +66,14 @@ See some important folders bellow:
66 ``` 66 ```
67 - Configure application to use the new theme, e.g.: 67 - Configure application to use the new theme, e.g.:
68 `npm config set angular-theme:skin skin-mycustom` 68 `npm config set angular-theme:skin skin-mycustom`
  69 +OR add the default skin property to a specific `package.json` file (ONLY PERFORM A BUILD), like this:
  70 +
  71 +```json
  72 +"config": {
  73 + "skin": "skin-yellow"
  74 +}
  75 +```
  76 +
69 77
70 **N.B.** 78 **N.B.**
71 79
@@ -154,4 +154,8 @@ gulp.task('noosfero', ['html'], function () { @@ -154,4 +154,8 @@ gulp.task('noosfero', ['html'], function () {
154 return merge(layouts, theme, index); 154 return merge(layouts, theme, index);
155 }); 155 });
156 156
157 -gulp.task('build', ['ckeditor', 'html', 'fonts', 'other', 'locale', 'plugin-languages', 'noosfero']); 157 +gulp.task('inject-skin-build', ['html'], function () {
  158 + gulp.start('inject-skin');
  159 +});
  160 +
  161 +gulp.task('build', ['ckeditor', 'html', 'fonts', 'other', 'locale', 'plugin-languages', 'noosfero', 'inject-skin-build']);
@@ -9,7 +9,7 @@ @@ -9,7 +9,7 @@
9 var argv = require('minimist')(process.argv.slice(2)); 9 var argv = require('minimist')(process.argv.slice(2));
10 var gutil = require('gulp-util'); 10 var gutil = require('gulp-util');
11 var path = require('path'); 11 var path = require('path');
12 -var fs = require('fs'); 12 +var fs = require('fs-extra');
13 13
14 /** 14 /**
15 * The main paths of your project handle these with care 15 * The main paths of your project handle these with care
@@ -25,6 +25,17 @@ exports.paths = { @@ -25,6 +25,17 @@ exports.paths = {
25 languages: 'languages' 25 languages: 'languages'
26 }; 26 };
27 27
  28 +exports.isBuild = function () {
  29 + if (!exports.building) {
  30 + exports.building = (argv._[0] == 'build' ? true : false);
  31 + }
  32 + return exports.building;
  33 +};
  34 +
  35 +exports.isDefaultTheme = function (name) {
  36 + return /-default$/.test(name);
  37 +};
  38 +
28 /** 39 /**
29 * Check if theme folder exists on "themes" directory 40 * Check if theme folder exists on "themes" directory
30 * 41 *
@@ -44,14 +55,14 @@ exports.themeExists = function (path) { @@ -44,14 +55,14 @@ exports.themeExists = function (path) {
44 * @param skin The skin name passed by arg to gulp task 55 * @param skin The skin name passed by arg to gulp task
45 */ 56 */
46 exports.skinExists = function (skin) { 57 exports.skinExists = function (skin) {
47 - 58 +
48 var skinPath, prefixPath = ''; 59 var skinPath, prefixPath = '';
49 var skinFile = skin+'.scss'; 60 var skinFile = skin+'.scss';
50 if (/skin-/.test(skin)) { 61 if (/skin-/.test(skin)) {
51 skinFile = skin.replace('skin-','_')+'.scss'; 62 skinFile = skin.replace('skin-','_')+'.scss';
52 } 63 }
53 64
54 - if (/-default$/.test(exports.paths.theme)) { 65 + if (exports.isDefaultTheme(exports.paths.theme)) {
55 prefixPath = exports.paths.src; 66 prefixPath = exports.paths.src;
56 }else { 67 }else {
57 prefixPath = path.join(exports.paths.themes, exports.paths.theme); 68 prefixPath = path.join(exports.paths.themes, exports.paths.theme);
@@ -66,7 +77,7 @@ exports.skinExists = function (skin) { @@ -66,7 +77,7 @@ exports.skinExists = function (skin) {
66 } 77 }
67 78
68 var content = fs.readFileSync(skinPath, {encoding: 'utf8'}); 79 var content = fs.readFileSync(skinPath, {encoding: 'utf8'});
69 - if(content.search(skin) == -1) { 80 + if (content.search(skin) == -1) {
70 throw new Error('The skin css selector ".'+skin+'" was not found in "'+skinPath+'" file'); 81 throw new Error('The skin css selector ".'+skin+'" was not found in "'+skinPath+'" file');
71 }else if (content.search('@extend %skin-base') == -1) { 82 }else if (content.search('@extend %skin-base') == -1) {
72 throw new Error('The skin css selector ".'+skin+'" needs inherit from %skin-base sass placeholder'); 83 throw new Error('The skin css selector ".'+skin+'" needs inherit from %skin-base sass placeholder');
@@ -81,15 +92,32 @@ exports.configTheme = function(theme) { @@ -81,15 +92,32 @@ exports.configTheme = function(theme) {
81 92
82 exports.paths.allSources = [exports.paths.src, themePath]; 93 exports.paths.allSources = [exports.paths.src, themePath];
83 94
84 -  
85 exports.themeExists(themePath); 95 exports.themeExists(themePath);
86 exports.paths.dist = path.join("dist", exports.paths.theme); 96 exports.paths.dist = path.join("dist", exports.paths.theme);
87 97
88 - if(argv.skin) { 98 + if(exports.isBuild() && !exports.isDefaultTheme(exports.paths.theme)){
  99 +
  100 + try {
  101 + fs.statSync(path.join(themePath,'package.json'));
  102 + var themeData = fs.readJsonSync(path.join(themePath,'package.json'));
  103 +
  104 + if(!themeData.config || !themeData.config.skin) {
  105 + throw new Error('The theme "'+exports.paths.theme+'" needs a default skin on their package.json file');
  106 + }
  107 + argv.skin = themeData.config.skin;
  108 + } catch (e) {
  109 + gutil.log(gutil.colors.yellow('[WARNING]','The package.json file was not found into theme:'), gutil.colors.cyan(exports.paths.theme));
  110 + }
  111 +
  112 + }
  113 +
  114 + if(argv.skin && argv.skin != 'skin-whbl') {
89 exports.skinExists(argv.skin); 115 exports.skinExists(argv.skin);
90 116
91 exports.paths.skin = argv.skin; 117 exports.paths.skin = argv.skin;
92 } 118 }
  119 +
  120 + gutil.log('Configuring theme', gutil.colors.green(exports.paths.theme.toUpperCase()));
93 } 121 }
94 exports.configTheme(argv.theme); 122 exports.configTheme(argv.theme);
95 123
gulp/inject.js
@@ -57,7 +57,12 @@ gulp.task('inject-skin', function () { @@ -57,7 +57,12 @@ gulp.task('inject-skin', function () {
57 57
58 if(conf.paths.skin) { 58 if(conf.paths.skin) {
59 59
60 - $.util.log('Configured theme skin:', conf.paths.skin); 60 + var jsPaths = {
  61 + src: path.join(conf.paths.src,'./noosfero.js'),
  62 + dest: conf.paths.src,
  63 + };
  64 +
  65 + $.util.log('Configuring theme skin:', conf.paths.skin, '...');
61 66
62 var replaceSkin = transform(function(filename) { 67 var replaceSkin = transform(function(filename) {
63 return map(function(file, next) { 68 return map(function(file, next) {
@@ -67,9 +72,14 @@ gulp.task('inject-skin', function () { @@ -67,9 +72,14 @@ gulp.task('inject-skin', function () {
67 }); 72 });
68 }); 73 });
69 74
70 - gulp.src(path.join(conf.paths.src,'./noosfero.js')) 75 + if (conf.isBuild()) {
  76 + jsPaths.src = path.join(conf.paths.dist, 'scripts', 'app-*.js');
  77 + jsPaths.dest = path.join(conf.paths.dist, 'scripts');
  78 + }
  79 +
  80 + gulp.src(jsPaths.src)
71 .pipe(replaceSkin) 81 .pipe(replaceSkin)
72 - .pipe(gulp.dest(conf.paths.src)); 82 + .pipe(gulp.dest(jsPaths.dest));
73 } 83 }
74 84
75 }); 85 });
@@ -26,7 +26,8 @@ @@ -26,7 +26,8 @@
26 "postinstall": "bower install; typings install; cd dev-scripts; typings install; cd ../; npm run fix-jqlite", 26 "postinstall": "bower install; typings install; cd dev-scripts; typings install; cd ../; npm run fix-jqlite",
27 "start": "concurrently \"webpack -w\" \"gulp --theme=$npm_package_config_theme --skin=$npm_package_config_skin serve\"", 27 "start": "concurrently \"webpack -w\" \"gulp --theme=$npm_package_config_theme --skin=$npm_package_config_skin serve\"",
28 "generate-indexes": "ts-node --project ./dev-scripts ./dev-scripts/generate-index-modules.ts", 28 "generate-indexes": "ts-node --project ./dev-scripts ./dev-scripts/generate-index-modules.ts",
29 - "fix-jqlite": "ts-node --project ./dev-scripts dev-scripts/fix-jqlite.ts" 29 + "fix-jqlite": "ts-node --project ./dev-scripts dev-scripts/fix-jqlite.ts",
  30 + "debug-gulp": "webpack; gulp clean; ./node_modules/.bin/iron-node node_modules/gulp/bin/gulp.js --theme=$npm_package_config_theme --skin=$npm_package_config_skin"
30 }, 31 },
31 "devDependencies": { 32 "devDependencies": {
32 "bower": "^1.7.7", 33 "bower": "^1.7.7",
@@ -39,6 +40,7 @@ @@ -39,6 +40,7 @@
39 "eslint-plugin-angular": "~0.12.0", 40 "eslint-plugin-angular": "~0.12.0",
40 "estraverse": "~4.1.0", 41 "estraverse": "~4.1.0",
41 "expose-loader": "^0.7.1", 42 "expose-loader": "^0.7.1",
  43 + "fs-extra": "^0.30.0",
42 "glob": "^7.0.0", 44 "glob": "^7.0.0",
43 "gulp": "^3.9.1", 45 "gulp": "^3.9.1",
44 "gulp-angular-filesort": "~1.1.1", 46 "gulp-angular-filesort": "~1.1.1",
@@ -69,6 +71,7 @@ @@ -69,6 +71,7 @@
69 "gulp-useref": "~1.3.0", 71 "gulp-useref": "~1.3.0",
70 "gulp-util": "~3.0.6", 72 "gulp-util": "~3.0.6",
71 "http-proxy-middleware": "~0.9.0", 73 "http-proxy-middleware": "~0.9.0",
  74 + "iron-node": "^3.0.7",
72 "istanbul": "^0.4.2", 75 "istanbul": "^0.4.2",
73 "karma": "~0.13.10", 76 "karma": "~0.13.10",
74 "karma-angular-filesort": "~1.0.0", 77 "karma-angular-filesort": "~1.0.0",
themes/angular-participa-consulta/README.md
@@ -3,8 +3,25 @@ @@ -3,8 +3,25 @@
3 3
4 ## Getting started 4 ## Getting started
5 5
  6 +**1. To use with `npm start` command**
  7 +> **PS:** To developer mode
  8 +
6 Run these commands to set the proper theme and skin 9 Run these commands to set the proper theme and skin
7 10
8 `npm config set angular-theme:theme angular-participa-consulta` 11 `npm config set angular-theme:theme angular-participa-consulta`
9 12
10 `npm config set angular-theme:skin skin-yellow` 13 `npm config set angular-theme:skin skin-yellow`
  14 +
  15 +**2. To generate a build**
  16 +> **PS:** Deploy to production
  17 +
  18 +* Create a specific `package.json` file into this directory
  19 +> Use the **`npm init`** command to create this file
  20 +
  21 +* Configure the **main** skin to this theme. Add the property `config['skin']` below:
  22 +
  23 +```json
  24 +"config": {
  25 + "skin": "skin-yellow"
  26 +}
  27 +```
themes/angular-participa-consulta/package.json 0 → 100644
@@ -0,0 +1,14 @@ @@ -0,0 +1,14 @@
  1 +{
  2 + "name": "angular-participa-consulta",
  3 + "version": "1.0.0",
  4 + "description": "The theme for 'Consulta publica' community specific colors and UI changes",
  5 + "config": {
  6 + "theme": "angular-participa-consulta",
  7 + "skin": "skin-yellow"
  8 + },
  9 + "scripts": {
  10 + "test": "echo \"Error: no test specified\" && exit 1"
  11 + },
  12 + "author": "",
  13 + "license": "ISC"
  14 +}