diff --git a/README.md b/README.md index b433b0237..9bbc72a20 100644 --- a/README.md +++ b/README.md @@ -40,12 +40,14 @@ utilizing a unidirectional data flow. ├── /src/ # The source code of the application │ ├── /actions/ # Action creators that allow to trigger a dispatch to stores │ ├── /assets/ # Static files which are copied to ./build on compile -│ ├── /components/ # React components. E.g. Navbar.jsx, Calendar.jsx +│ ├── /components/ # React components +│ │ ├── /common/ # - Shared components. E.g. Link.js +│ │ ├── /forms/ # - Form components. E.g. TextBox.js +│ │ ├── /layout/ # - Layout components. E.g. Navbar.js +│ │ └── /pages/ # - Web-page components. E.g. About.js │ ├── /constants/ # Enumerations used in action creators and stores │ ├── /core/ # Core components (Flux dispatcher, base classes) │ ├── /images/ # Graphics (.png, .jpg, .svg etc.) -│ ├── /layouts/ # Shared layouts for top-level components -│ ├── /pages/ # Top-level, URL-bound React components │ ├── /stores/ # Stores contain the application state and logic │ ├── /styles/ # CSS style sheets (or LESS, SASS, Stylus) │ ├── /app.js # The application's main file (entry point) diff --git a/gulpfile.js b/gulpfile.js index 3e4e409c3..270dc27a2 100644 --- a/gulpfile.js +++ b/gulpfile.js @@ -107,7 +107,7 @@ gulp.task('images', function() { // HTML pages gulp.task('pages', function() { - src.pages = ['src/pages/**/*.js', 'src/pages/404.html']; + src.pages = ['src/components/pages/**/*.js', 'src/components/pages/404.html']; var currentPage = {}; var Dispatcher = require('./src/core/Dispatcher'); @@ -123,7 +123,7 @@ gulp.task('pages', function() { }); var render = $.render({ - template: './src/pages/_template.html', + template: './src/components/pages/index.html', data: function() { return currentPage; } }) .on('error', function(err) { console.log(err); render.end(); }); @@ -137,6 +137,7 @@ gulp.task('pages', function() { collapseWhitespace: true, minifyJS: true }), $.jsbeautifier())) + .pipe($.if('**/home.html', $.rename('index.html'))) .pipe(gulp.dest(DEST)) .pipe($.size({title: 'pages'})); }); diff --git a/package.json b/package.json index 08b540d2b..9b962bbd8 100644 --- a/package.json +++ b/package.json @@ -31,6 +31,7 @@ "gulp-load-plugins": "^0.8.0", "gulp-minify-css": "^0.3.11", "gulp-plumber": "^0.6.6", + "gulp-rename": "^1.2.0", "gulp-render": "^0.2.1", "gulp-replace": "^0.5.0", "gulp-size": "^1.1.0", diff --git a/src/app.js b/src/app.js index 11a07dc08..805d2246a 100644 --- a/src/app.js +++ b/src/app.js @@ -54,8 +54,8 @@ function render(page) { // Define URL routes // See https://github.com/flatiron/director var routes = { - '/': () => render(require('./pages/Index')), - '/privacy': () => render(require('./pages/Privacy')) + '/': () => render(require('./components/pages/Home')), + '/privacy': () => render(require('./components/pages/Privacy')) }; // Initialize a router diff --git a/src/components/Link.js b/src/components/common/Link.js similarity index 92% rename from src/components/Link.js rename to src/components/common/Link.js index dc7faea0d..7dd0923a6 100644 --- a/src/components/Link.js +++ b/src/components/common/Link.js @@ -9,7 +9,7 @@ 'use strict'; var React = require('react'); -var RouteActions = require('../actions/RouteActions'); +var RouteActions = require('../../actions/RouteActions'); var Link = React.createClass({ propTypes: { diff --git a/src/components/forms/TextBox.js b/src/components/forms/TextBox.js new file mode 100644 index 000000000..842846e3e --- /dev/null +++ b/src/components/forms/TextBox.js @@ -0,0 +1,40 @@ +/* + * React.js Starter Kit + * Copyright (c) 2014 Konstantin Tarkus (@koistya), KriaSoft LLC. + * + * This source code is licensed under the MIT license found in the + * LICENSE.txt file in the root directory of this source tree. + */ + +'use strict'; + +require('./TextBox.less'); + +var React = require('react'); + +var TextBox = React.createClass({ + + propTypes: { + maxLines: React.PropTypes.number + }, + + getDefaultProps() { + return { + maxLines: 1 + }; + }, + + render() { + return ( +
+ {this.props.maxLines > 1 ? +