From 3cf4d739e316c34797638343f6c562e67a58b814 Mon Sep 17 00:00:00 2001 From: Justin Niessner Date: Wed, 25 Mar 2015 22:42:02 -0400 Subject: [PATCH] Add flux support including generators --- action/index.js | 17 +++++++++++++++++ app/index.js | 16 ++++++++++++++++ component/index.js | 4 +--- main/index.js | 6 ++++++ script-base.js | 16 ++++++++++++---- store/index.js | 18 ++++++++++++++++++ templates/common/_package.json | 5 ++++- templates/javascript/Action.js | 8 ++++++++ templates/javascript/Dispatcher.js | 3 +++ templates/javascript/Store.js | 20 ++++++++++++++++++++ 10 files changed, 105 insertions(+), 8 deletions(-) create mode 100644 action/index.js create mode 100644 store/index.js create mode 100644 templates/javascript/Action.js create mode 100644 templates/javascript/Dispatcher.js create mode 100644 templates/javascript/Store.js diff --git a/action/index.js b/action/index.js new file mode 100644 index 0000000..4801117 --- /dev/null +++ b/action/index.js @@ -0,0 +1,17 @@ +'use strict'; +var util = require('util'); +var ScriptBase = require('../script-base.js'); + +var ActionGenerator = module.exports = function ActionGenerator(args, options, config) { + ScriptBase.apply(this, arguments); +} + +util.inherits(ActionGenerator, ScriptBase); + +ActionGenerator.prototype.createActionFile = function createActionFile() { + this.option('es6'); + + this.es6 = this.options.es6; + + this.generateAction(); +} diff --git a/app/index.js b/app/index.js index 196a2b3..5a60587 100644 --- a/app/index.js +++ b/app/index.js @@ -13,6 +13,7 @@ var ReactWebpackGenerator = module.exports = function ReactWebpackGenerator(args this.appname = this._.camelize(this._.slugify(this._.humanize(this.appname))); this.scriptAppName = this._.capitalize(this.appname) + generalUtils.appName(this); + this.config.set('app-name', this.appname); args = ['main']; @@ -65,6 +66,20 @@ ReactWebpackGenerator.prototype.askForReactRouter = function () { }.bind(this)); }; +ReactWebpackGenerator.prototype.askForFlux = function() { + var done = this.async(); + this.prompt({ + type : 'confirm', + name : 'flux', + message : 'Would you like to include flux?', + default : false + }, function(props) { + this.env.options.flux = props.flux; + this.config.set('flux', props.flux); + done(); + }.bind(this)); +}; + ReactWebpackGenerator.prototype.askForStylesLanguage = function () { var done = this.async(); this.prompt({ @@ -98,6 +113,7 @@ ReactWebpackGenerator.prototype.createIndexHtml = function createIndexHtml() { ReactWebpackGenerator.prototype.packageFiles = function () { this.es6 = this.options.es6; this.reactRouter = this.env.options.reactRouter; + this.flux = this.env.options.flux; this.stylesLanguage = this.env.options.stylesLanguage; this.template('../../templates/common/_package.json', 'package.json'); this.template('../../templates/common/_webpack.config.js', 'webpack.config.js'); diff --git a/component/index.js b/component/index.js index 1d50772..7e13d34 100644 --- a/component/index.js +++ b/component/index.js @@ -10,11 +10,9 @@ var ComponentGenerator = module.exports = function ComponentGenerator(args, opti util.inherits(ComponentGenerator, ScriptBase); ComponentGenerator.prototype.createComponentFile = function createComponentFile() { - this.option('es6'); - + this.option('es6'); this.es6 = this.options.es6; - console.log('es6:', this.es6) this.generateSourceAndTest( 'Component', diff --git a/main/index.js b/main/index.js index f58b8b4..4fe14de 100644 --- a/main/index.js +++ b/main/index.js @@ -20,3 +20,9 @@ MainGenerator.prototype.createMainFile = function createMainFile() { this.appTemplate('main', 'components/main'); } }; + +MainGenerator.prototype.createDispatcher = function createDispatcher() { + if(this.env.options.flux) { + this.appTemplate('Dispatcher', 'dispatcher/' + this.scriptAppName + 'Dispatcher'); + } +}; diff --git a/script-base.js b/script-base.js index b998fb5..c80eab1 100644 --- a/script-base.js +++ b/script-base.js @@ -8,8 +8,8 @@ var Generator = module.exports = function Generator() { yeoman.generators.NamedBase.apply(this, arguments); // Add capitalize mixin - this._.mixin({ 'capitalize': generalUtils.capitalize }); - this._.mixin({ 'capitalizeFile': generalUtils.capitalizeFile }); + this._.mixin({ 'capitalize': generalUtils.capitalize }); + this._.mixin({ 'capitalizeFile': generalUtils.capitalizeFile }); this._.mixin({ 'capitalizeClass': generalUtils.capitalizeClass }); this._.mixin({ 'lowercase': generalUtils.lowercase }); @@ -18,8 +18,8 @@ var Generator = module.exports = function Generator() { this.appname = this._.slugify(this._.humanize(this.appname)); this.scriptAppName = this._.camelize(this._.capitalize(this.appname)) + generalUtils.appName(this); this.classedFileName = this._.capitalizeFile(this.name); - this.classedName = this._.capitalizeClass(this.name); - this.stylesLanguage = this.config.get('styles-language'); + this.classedName = this._.capitalizeClass(this.name); + this.stylesLanguage = this.config.get('styles-language'); if (typeof this.options.appPath === 'undefined') { this.options.appPath = this.options.appPath || 'src/scripts'; @@ -93,3 +93,11 @@ Generator.prototype.generateSourceAndTest = function (appTemplate, testTemplate, this.testTemplate(testTemplate, path.join(targetDirectory, this._.capitalizeFile(this.name))); this.stylesTemplate(stylesTemplate, path.join(this._.capitalizeFile(this.name))); }; + +Generator.prototype.generateAction = function() { + this.appTemplate('Action', path.join('actions', this._.capitalizeFile(this.name) + 'ActionCreators')); +} + +Generator.prototype.generateStore = function() { + this.appTemplate('Store', path.join('stores', this._.capitalizeFile(this.name) + 'Store')); +} diff --git a/store/index.js b/store/index.js new file mode 100644 index 0000000..21b00d5 --- /dev/null +++ b/store/index.js @@ -0,0 +1,18 @@ +'use strict'; +var util = require('util'); +var ScriptBase = require('../script-base.js'); + +var ActionGenerator = module.exports = function ActionGenerator(args, options, config) { + ScriptBase.apply(this, arguments); +} + +util.inherits(ActionGenerator, ScriptBase); + +ActionGenerator.prototype.createActionFile = function createActionFile() { + this.option('es6'); + + this.es6 = this.options.es6; + this.dispatcherName = this._.capitalizeFile(this.config.get('app-name')) + 'AppDispatcher'; + + this.generateStore(); +} diff --git a/templates/common/_package.json b/templates/common/_package.json index 4709ba7..88708f8 100644 --- a/templates/common/_package.json +++ b/templates/common/_package.json @@ -10,7 +10,10 @@ "mainInput": "<% if (reactRouter) { %>main<% } else { %><%= scriptAppName %><% } %>", "mainOutput": "main", "dependencies": {<% if (reactRouter) { %> - "react-router": "^0.11.6",<% } %> + "react-router": "^0.11.6",<% } if (flux) { %> + "flux": "^2.0.1", + "events": "^1.0.2", + "object-assign": "^2.0.0", <% } %> "react": "~0.12.2" }, "devDependencies": { diff --git a/templates/javascript/Action.js b/templates/javascript/Action.js new file mode 100644 index 0000000..5196153 --- /dev/null +++ b/templates/javascript/Action.js @@ -0,0 +1,8 @@ +'use strict'; + +var <% classedName + 'ActionCreators' %> = { + +} + +<% if (es6) { %> export default <%= classedName + 'ActionCreators' %>; <% } +else { %>module.exports = <%= classedName + 'ActionCreators' %>; <% } %> diff --git a/templates/javascript/Dispatcher.js b/templates/javascript/Dispatcher.js new file mode 100644 index 0000000..5231a4e --- /dev/null +++ b/templates/javascript/Dispatcher.js @@ -0,0 +1,3 @@ +var Dispatcher = require('flux').Dispatcher; + +module.exports = new Dispatcher(); diff --git a/templates/javascript/Store.js b/templates/javascript/Store.js new file mode 100644 index 0000000..9f59eaf --- /dev/null +++ b/templates/javascript/Store.js @@ -0,0 +1,20 @@ +'use strict'; + +var EventEmitter = require('events').EventEmitter; +var assign = require('object-assign'); +var <%= dispatcherName %> = require('../dispatcher/<%= dispatcherName %>'); + +var <%= classedName + 'Store' %> = assign({}, EventEmitter.prototype, { + +}); + +<%= classedName + 'Store' %>.dispatchToken = <%= dispatcherName %>.register(function(action) { + + switch(action.type) { + default: + } + +}); + +<% if (es6) { %> export default <%= classedName + 'Store' %>; <% } +else { %>module.exports = <%= classedName + 'Store' %>; <% } %>