Skip to content
This repository has been archived by the owner on Jan 3, 2025. It is now read-only.

Commit

Permalink
Merge pull request #76 from centresource/feature/gulp-sandbox
Browse files Browse the repository at this point in the history 
Replace Grunt with Gulp
  • Loading branch information
@dcalhoun
dcalhoun committed Mar 5, 2015
2 parents 587b8a3 + 10f517e commit 57d6a3b
Show file tree
Hide file tree
Showing 22 changed files with 360 additions and 668 deletions.
24 changes: 10 additions & 14 deletions README.md
View file
Original file line number Diff line number Diff line change
@@ -1,8 +1,8 @@
# Playbook

Playbook is a Yeoman generator to get you building interfaces faster. [Jekyll](http://jekyllrb.com/) is included for static site generation. [Bourbon](http://bourbon.io), [Neat](http://neat.bourbon.io) & [Bitters](http://bitters.bourbon.io/) are included to help you write CSS faster.
Playbook is a Yeoman generator for prototyping and building experiences. [Jekyll](http://jekyllrb.com/) is included for static site generation. [Bourbon](http://bourbon.io), [Neat](http://neat.bourbon.io) & [Bitters](http://bitters.bourbon.io/) are included to help you write CSS faster.

[Grunt](http://gruntjs.com/) is used for compilation of [Sass](http://sass-lang.com) and [CoffeeScript](http://coffeescript.org) (optional). [Bower](http://bower.io/) is used for managing dependencies.
[Gulp](http://gulpjs.com/) is used for compilation of [Sass](http://sass-lang.com) and [CoffeeScript](http://coffeescript.org) (optional). [Bower](http://bower.io/) is used for managing dependencies.

### Prerequisites
If you do not have [Node.js](http://nodejs.org/) `>=0.10`, [Yeoman](http://yeoman.io/) `>=1.1.2`, [Ruby](https://www.ruby-lang.org/en/) `>=2.0` and the [Bundler](http://bundler.io/) gem installed, you must do that first:
Expand All @@ -18,7 +18,6 @@ npm install -g generator-playbook
````

### Update

If you already have generator-playbook installed, please upgrade before
generating another site to get the latest updates.

Expand All @@ -38,17 +37,14 @@ yo playbook

*Should you run into an error such as `command yo not found` it may be related to a path issue when installing Node.js via Homebrew. Please refer to the top answer on this [StackOverflow question](http://stackoverflow.com/questions/15846076/command-not-found-after-installation).*

### Grunt Tasks
##### grunt serve
Serve your source locally into your browser. LiveReload will automatically load any changes to HTML, CSS and JavaScript that you make.

##### grunt check
Check the quality of your source with tools like [JSLint](http://www.jslint.com/), [CSSLint](http://csslint.net/) and [csscss](http://zmoazeni.github.io/csscss/).
### Gulp Tasks
##### gulp serve
Serve your source locally into your browser. BrowserSync automatically loads any changes to HTML, CSS and JavaScript that you make.

##### grunt build
Build the concatenated, minified production version of the source into the `dist` directory.
##### gulp build
Build the concatenated, minified production version of your source into the `dist` directory.

##### grunt deploy
Deploy the production version of the source to [GitHub Pages](http://pages.github.com/). This ability is configurable during Playbook generation.
##### gulp deploy
Deploy the production build of your source to [GitHub Pages](http://pages.github.com/).

If you choose to utilize `grunt-build-control` to deploy a GitHub Pages user/organization site, your source must live in a branch other than `master`. GitHub Pages [user/organization sites](https://help.github.com/articles/user-organization-and-project-pages#project-pages) serve the files found in the `master` branch to the browser.
If you choose to deploy a GitHub User/Organization Page, your source must be tracked in a branch other than `master`. User/Organization Pages serve the `master` branch to users visiting your Page. For more information, please see the [GitHub Pages Help](https://help.github.com/articles/user-organization-and-project-pages#project-pages).
233 changes: 89 additions & 144 deletions app/index.js
View file
Original file line number Diff line number Diff line change
@@ -1,11 +1,11 @@
'use strict';
var util = require('util');
var path = require('path');
var chalk = require('chalk');
var yeoman = require('yeoman-generator');
var globule = require('globule');
var shelljs = require('shelljs');

var util = require('util'),
path = require('path'),
chalk = require('chalk'),
yeoman = require('yeoman-generator'),
globule = require('globule'),
shelljs = require('shelljs');

var PlaybookGenerator = module.exports = function PlaybookGenerator(args, options, config) {
yeoman.generators.Base.apply(this, arguments);
Expand All @@ -29,7 +29,7 @@ var PlaybookGenerator = module.exports = function PlaybookGenerator(args, option
this.gitInfo = {
name: this.user.git.username,
email: this.user.git.email
}
};

this.on('end', function () {
this.installDependencies({ skipInstall: options['skip-install'] });
Expand All @@ -42,25 +42,24 @@ var PlaybookGenerator = module.exports = function PlaybookGenerator(args, option
util.inherits(PlaybookGenerator, yeoman.generators.Base);

PlaybookGenerator.prototype.askForUser = function askForUser() {
var cb = this.async();
var prompts = [
{
name: 'authorName',
message: 'What is your name?',
default: this.gitInfo.name
},
{
name: 'authorEmail',
message: 'What is your email?',
default: this.gitInfo.email
}
];
var cb = this.async(),
prompts = [
{
name: 'authorName',
message: 'What is your name?',
default: this.gitInfo.name
},
{
name: 'authorEmail',
message: 'What is your email?',
default: this.gitInfo.email
}
];

console.log(this.yeoman);
console.log(chalk.yellow('\nTell us a little about the project.') + ' →');

this.prompt(prompts, function (props) {

this.authorName = props.authorName;
this.authorEmail = props.authorEmail;

Expand All @@ -69,128 +68,81 @@ PlaybookGenerator.prototype.askForUser = function askForUser() {
};

PlaybookGenerator.prototype.askForTools = function askForTools() {
var cb = this.async();
var prompts = [
{
name: 'jsPre',
type: 'list',
message: 'JavaScript preproccesor',
choices: ['None', 'CoffeeScript']
},
{
name: 'sassComp',
type: 'list',
message: 'Sass compiler',
choices: ['Ruby', 'LibSass']
},
{
name: 'googleAnalytics',
type: 'confirm',
message: 'Include Google Analytics?',
default: false
}
]
var cb = this.async(),
prompts = [
{
name: 'jsPre',
type: 'list',
message: 'JavaScript preproccesor',
choices: ['None', 'CoffeeScript']
},
{
name: 'sassComp',
type: 'list',
message: 'Sass compiler',
choices: ['Ruby', 'LibSass']
},
{
name: 'googleAnalytics',
type: 'confirm',
message: 'Include Google Analytics?',
default: false
}
];

console.log(chalk.yellow('\nPreprocessors and tools.') + ' →');

this.prompt(prompts, function (props) {
this.jsPre = props.jsPre === 'None' ? false : props.jsPre.toLowerCase();
this.sassComp = props.sassComp.toLowerCase();
this.googleAnalytics = props.googleAnalytics;

// Multiple choice 'None' to false
this.jsPre = props.jsPre === 'None' ? false : props.jsPre.toLowerCase();

// Lowercase sassComp variable
this.sassComp = props.sassComp.toLowerCase();

cb();
}.bind(this));
};

PlaybookGenerator.prototype.askForDeployment = function askForDeployment() {
var cb = this.async();
var prompts = [
{
name: 'deploy',
message: 'Use grunt-build-control for deployment?',
type: 'confirm',
default: false
},
{
name: 'deployHost',
type: 'list',
message: 'Host to deploy to',
choices: ['GitHub Pages', 'Generic remote'],
when: function (answers) {
return answers.deploy;
}
},
{
name: 'ghOwner',
message: 'GitHub repository owner',
when: function (answers) {
return answers.deployHost === 'GitHub Pages';
}
},
{
name: 'ghRepo',
message: 'GitHub repository name',
when: function (answers) {
return answers.deployHost === 'GitHub Pages';
}
},
{
name: 'ghPagesProject',
type: 'list',
message: 'GitHub Project or User/Organization site?',
choices: ['Project', 'User/Organization'],
when: function(answers) {
return answers.deployHost == 'GitHub Pages';
}
},
{
name: 'remoteURL',
message: 'Remote URL',
when: function (answers) {
return answers.deployHost === 'Generic remote';
}
},
{
name: 'deployBranch',
message: 'Branch to deploy to',
default: function(answers) {
if (answers.ghPagesProject === 'Project') {
return 'gh-pages';
} else if (answers.ghPagesProject === 'User/Organization') {
return 'master';
} else {
return 'dist';
var cb = this.async(),
prompts = [
{
name: 'ghPages',
message: 'Deploy to GitHub Pages?',
type: 'confirm',
default: false
},
{
name: 'ghPagesType',
type: 'list',
message: 'Project or User/Organization site?',
choices: ['Project', 'User/Organization'],
when: function(answers) {
return answers.ghPages;
}
},
{
name: 'ghOwner',
message: 'GitHub repository owner',
when: function (answers) {
return answers.ghPages;
}
},
{
name: 'ghRepo',
message: 'GitHub repository name',
when: function (answers) {
return answers.ghPages;
}
}
},
when: function (answers) {
return answers.deploy;
}
}
]
];

console.log(chalk.yellow('\nDeployment options.') + ' →');

this.prompt(prompts, function (props) {

this.deploy = props.deploy;
this.deployHost = props.deployHost;
this.ghOwner = props.ghOwner;
this.ghRepo = props.ghRepo;
this.deployBranch = props.deployBranch;

if (props.ghPagesProject) {
this.ghPagesProject = props.ghPagesProject.replace('/', '_').toLowerCase();
}

if (this.deployHost === 'GitHub Pages') {
this.deployRemote = '[email protected]:' + this.ghOwner + '/' + this.ghRepo + '.git';
} else {
this.deployRemote = props.remoteURL;
}
this.ghPagesType = (props.ghPagesType) ? props.ghPagesType.replace('/', '_').toLowerCase() : null;
this.ghPages = props.ghPages;
this.ghBranch = (props.ghPagesType === 'project') ? 'gh-pages' : 'master';
this.ghOwner = props.ghOwner;
this.ghRepo = props.ghRepo;

cb();
}.bind(this));
Expand All @@ -208,16 +160,15 @@ PlaybookGenerator.prototype.rubyDependencies = function rubyDependencies() {

PlaybookGenerator.prototype.app = function app() {
this.directory('app', 'app');
this.copy('Gemfile', 'Gemfile');
this.copy('bowerrc', '.bowerrc');
this.copy('csslintrc', '.csslintrc');
this.copy('gitignore', '.gitignore');
this.template('_Gruntfile.js', 'Gruntfile.js');
this.template('config.yml', '_config.yml');
this.copy('bower.json', 'bower.json');
this.template('README.md', 'README.md');
this.template('package.json', 'package.json');
this.template('gulpfile.js', 'gulpfile.js');
this.template('_config.yml', '_config.yml');
this.template('_config.build.yml', '_config.build.yml');
this.template('_package.json', 'package.json');
this.template('_bower.json', 'bower.json');
this.template('_README.md', 'README.md');
};

PlaybookGenerator.prototype.projectfiles = function projectfiles() {
Expand All @@ -226,19 +177,18 @@ PlaybookGenerator.prototype.projectfiles = function projectfiles() {
};

PlaybookGenerator.prototype.templates = function templates() {
this.template('conditional/template/default.html', 'app/_layouts/default.html');
this.template('conditional/template/index.html', 'app/index.html');
this.template('app/_layouts/default.html', 'app/_layouts/default.html');

if (this.googleAnalytics) {
this.copy('conditional/template/google-analytics.html', 'app/_includes/shared/google-analytics.html');
};
}
};

PlaybookGenerator.prototype.jsPreprocessor = function jsPreprocessor() {
if (this.jsPre === 'coffeescript') {
this.copy('conditional/coffee/app.coffee', 'app/scripts/app.coffee');
this.copy('conditional/coffee/application.coffee', 'app/scripts/application.coffee');
} else {
this.copy('conditional/javascript/app.js', 'app/scripts/app.js');
this.copy('conditional/javascript/application.js', 'app/scripts/application.js');
}
};

Expand All @@ -250,13 +200,8 @@ PlaybookGenerator.prototype.installBitters = function installBitters() {
shelljs.exec('bundle exec bitters install');
shelljs.cd(root);

// Replace Rails-style @import of neat-helpers
var gridSettings = shelljs.cat('app/styles/base/_grid-settings.scss');
gridSettings = gridSettings.replace(/^@import 'neat-helpers';.*/, "@import 'neat/app/assets/stylesheets/neat-helpers';");
gridSettings.to('app/styles/base/_grid-settings.scss');

// Uncomment Neat grid-settings @import
var base = shelljs.cat('app/styles/base/_base.scss');
base = base.replace(/^\/\/ @import 'grid-settings';.*/, "@import 'grid-settings';");
base = base.replace(/\/\/ @import "grid-settings";/, '@import "grid-settings";');
base.to('app/styles/base/_base.scss');
};
7 changes: 3 additions & 4 deletions app/templates/Gemfile
View file
Original file line number Diff line number Diff line change
@@ -1,7 +1,6 @@
source "http://rubygems.org"

gem 'jekyll', '~> 2.5'
gem 'redcarpet'
gem 'csscss', '~> 1.3'<% if (sassComp === 'ruby') { %>
gem 'sass', '~> 3.3.8'<% } %>
gem 'bitters', '0.10.0'
gem 'redcarpet'<% if (sassComp === 'ruby') { %>
gem 'sass', '~> 3.4.13'<% } %>
gem 'bitters', '1.0.0'
23 changes: 23 additions & 0 deletions app/templates/README.md
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,23 @@
# <%= appName %>

A Playbook project.

## Project Setup
This project utilizes Playbook, reference Playbook's [setup guide](https://github.com/centresource/generator-playbook#get-started).

1. Clone this repository
2. `npm install`
3. `bower install`
4. `bundle install`

## Usage

### Gulp Tasks
##### gulp serve
Serve your source locally into your browser. BrowserSync automatically loads any changes to HTML, CSS and JavaScript that you make.

##### gulp build
Build the concatenated, minified production version of your source into the `dist` directory.<% if (ghPages) { %>

##### gulp deploy
Deploy the production version of your source to [GitHub Pages](http://pages.github.com/).<% } %>
Loading

0 comments on commit 57d6a3b

Please sign in to comment.