initial commit

Author: Kurt Roberts

.gitignore

@@ -0,0 +1,3 @@
+node_modules
+dist
+.DS_Store

.jshintrc

@@ -0,0 +1,14 @@
+{
+  "undef": true,
+  "unused": true,
+  "predef": [
+  	"_"
+  ],
+  "browser": true,
+  "jquery": true,
+  "node": true,
+  "devel": true,
+  "globals": {
+    "RP3": true
+  }
+}

LICENSE

@@ -0,0 +1,9 @@
+MIT License
+
+Copyright (c) 2017 RP3 Agency
+
+Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.

README.md

@@ -0,0 +1,10 @@
+# RP3's Prototype Build Kit
+
+This is our opinion of what you need to start prototyping in code.  We've pre-configured SCSS, HTML Extender, EJS, Markdown rendering, BrowserSync and more.
+
+## Getting started
+
+1. Open `gulpfile.js` in a text editor of your choice and set all the config options marked with a `//TODO:`
+2. `npm install`
+3. `gulp`
+4. Start making things!

gulpfile.js

@@ -0,0 +1,253 @@
+//TODO: set your AWS profile
+process.env.AWS_PROFILE = 'SET YOUR PROFILE HERE';
+
+var fs				= require('fs'),
+	path			= require('path'),
+	gulp			= require('gulp'),
+	sass			= require('gulp-sass'),
+	sourcemaps		= require('gulp-sourcemaps'),
+	autoprefixer	= require('gulp-autoprefixer'),
+	filter			= require('gulp-filter'),
+	removeHtmlComments = require('gulp-remove-html-comments'),
+	browserSync		= require('browser-sync').create(),
+	reload			= browserSync.reload,
+	watch			= require('gulp-watch'),
+	del				= require('del'),
+	jshint			= require('gulp-jshint'),
+	markdown		= require('gulp-markdown'),
+	wrap 			= require('gulp-wrap'),
+	extender		= require('gulp-html-extend'),
+	ejs				= require('gulp-ejs'),
+	//TODO: set your region
+	aws_s3			= require('gulp-s3-upload')({ useIAM: true }, { region: '' }),
+	slack			= require('gulp-slack')({
+			url:  '',  //from slack interface
+			icon_url: 'http://purefishing.scene7.com/is/image/purefishing/1109403',
+			user: 'Gulp',
+			channel: '' //from your Slack instance
+	}),
+	username 		= require('username'),
+	user			= username.sync(),
+	paths = {
+		src	: {
+			base	: __dirname + '/src',
+			sass	: __dirname + '/src/sass',
+			js		: __dirname + '/src/js',
+			images	: __dirname + '/src/images',
+			vendor	: __dirname + '/src/vendor',
+			fonts	: __dirname + '/src/css/fonts',
+		},
+		dist	: {
+			base	: __dirname + '/build',
+			css		: __dirname + '/build/css',
+			js		: __dirname + '/build/js',
+			images	: __dirname + '/build/images',
+			vendor	: __dirname + '/build/vendor',
+			fonts	: __dirname + '/build/css/fonts',
+		}
+	},
+	mdTemplate		= '<!-- @@master /_templates/main.html { "title": "Home Page" } -->\n<!-- @@block content -->\n<%= contents %>\n<!-- @@close -->',
+	environments = {
+		qc: 'qc.prototype.example.support',
+		uat: 'uat.prototype.example.support',
+		prod: 'example.com'
+	};
+
+
+/*****
+
+Lifecycle Management
+
+*****/
+
+//Clean
+
+gulp.task('clean', function (cb) {
+	del([
+		paths.dist.base + '/**',
+		'!' + paths.dist.base,
+	], cb);
+});
+
+
+
+
+//Build
+
+
+gulp.task('md', function () {
+	return gulp.src([
+			paths.src.base + '/**/*.md',
+			'!' + paths.src.base + '/_templates/**',
+			'!' + paths.src.base + '/_components/**',
+			'!' + paths.src.base + '/html/**/_*.md'
+		])
+		.pipe(markdown())
+		.pipe(wrap(mdTemplate, {}, { parse: false}))
+		.pipe(extender({
+			annotations: false,
+			verbose: false,
+			root: '/src/'
+		}))
+		.pipe(removeHtmlComments())
+		.pipe(gulp.dest(paths.dist.base))
+		.pipe(reload({stream: true}));
+});
+
+
+
+gulp.task('html', function(){
+	return gulp.src([
+			paths.src.base + '/**/*.html',
+			'!' + paths.src.base + '/_templates/**',
+			'!' + paths.src.base + '/_components/**',
+			'!' + paths.src.base + '/html/**/_*.html'
+		])
+		.pipe(extender({
+			annotations: false,
+			verbose: false,
+			root: '/src/'
+		}))
+		.pipe(ejs())
+		.pipe(removeHtmlComments())
+		.pipe(gulp.dest(paths.dist.base))
+		.pipe(reload({stream: true}));
+});
+
+gulp.task('styles', function () {
+	return gulp.src(paths.src.sass + '/site.scss')
+		.pipe(sourcemaps.init())				// source map init
+		.pipe(sass())							// Sass
+		.pipe(autoprefixer('last 2 version'))
+		.pipe(sourcemaps.write())				// sourcemap write
+		.pipe(gulp.dest( paths.dist.css ))		// save css file
+		.pipe(filter('**/*.css'))				// filter only css files (remove the map file)
+		.pipe(reload({stream: true}));			// inject the changed css
+});
+
+gulp.task('images', function () {
+    return gulp.src(paths.src.images + '/**/*',{ allowEmpty: true })
+				.pipe(gulp.dest(paths.dist.images));
+});
+
+gulp.task('js', function () {
+	return gulp.src(paths.src.js + '/**/*.js',{ allowEmpty: true })
+		.pipe(jshint(__dirname + '/.jshintrc'))
+		.pipe(jshint.reporter('default'))
+		.pipe(gulp.dest(paths.dist.js));
+});
+
+gulp.task('fonts', function () {
+    return gulp.src(paths.src.fonts + '/**/*',{ allowEmpty: true })
+				.pipe(gulp.dest(paths.dist.fonts));
+});
+
+gulp.task('vendor', function () {
+    return gulp.src(paths.src.vendor + '/**/*',{ allowEmpty: true })
+				.pipe(gulp.dest(paths.dist.vendor));
+});
+
+gulp.task('copy', ['images', 'js', 'fonts', 'vendor']);
+
+
+//Develop
+
+gulp.task('bs', function (cb) {
+	browserSync.init({
+			server: {
+				baseDir: paths.dist.base,
+				index: 'index.html'
+			},
+			port  : 3000,
+			open  : 'external',
+			host  : 'localhost',
+			notify: {
+				styles: [
+					'display: none;',
+					'padding: 7px 15px;',
+					'border-radius: 0 0 3px 3px;',
+					'position: fixed;',
+					'font-family: Arial, sans-serif',
+					'font-size: 14px;',
+					'font-weight: normal;',
+					'z-index: 9999;',
+					'right: 0px;',
+					'top: 0px;',
+					'background-color: rgba(30, 30, 30, .7);',
+					'color: #fff',
+					'pointer-events: none;'
+				]
+			},
+			ghostMode: {
+				clicks: true,
+				scroll: true,
+				forms: {
+				submit: true,
+				inputs: true,
+				toggles: true
+				}
+			}
+		}, function(err, bs) {
+		cb()
+	});
+});
+
+gulp.task('reload', function (cb) {
+	reload();
+	cb();
+});
+
+gulp.task('watch', function (cb) {
+	gulp.watch([paths.src.sass + '/**/*'], ['styles']);
+	gulp.watch([paths.src.js + '/**/*'], ['js']);
+	gulp.watch([paths.src.images + '/**/*'], ['images']);
+	gulp.watch([paths.src.vendor + '/**/*'], ['vendor']);
+	gulp.watch([paths.src.base + '/**/*.html'], ['html']);
+	cb();
+});
+
+gulp.task('build', ['styles', 'copy', 'html', 'md']);
+
+gulp.task('serve', ['bs', 'build']);
+
+
+//Deploy
+
+//Deploy
+gulp.task('deploy-qc', ['build'], function () {
+	console.log('Not configured');
+	return 0;
+	return gulp.src(paths.dist.base + '/**')
+		.pipe(aws_s3({
+			Bucket:	environments.qc,
+			ACL:	'public-read'
+		}))
+		.pipe(slack('Deployed to QC environment by ' + user + '.'));
+});
+
+//TODO: Implement Staging Deploy
+gulp.task('deploy-uat', ['build'], function () {
+	console.log('Not configured');
+	return 0;
+	return gulp.src(paths.dist.base + '/**')
+		.pipe(aws_s3({
+			Bucket:	environments.uat,
+			ACL:	'public-read'
+		}))
+		.pipe(slack('Deployed to UAT environment by ' + user + '.'));
+});
+
+//TODO: Implement Production Deploy
+gulp.task('deploy-prod', ['build'], function () {
+	console.log('Not configured');
+	return 0;
+	return gulp.src(paths.dist.base + '/**')
+		.pipe(aws_s3({
+			Bucket:	environments.prod,
+			ACL:	'public-read'
+		}))
+		.pipe(slack('Deployed to PRODUCTION environment by ' + user + '.'));
+});
+
+
+gulp.task('default', ['serve', 'watch']);

package.json

@@ -0,0 +1,31 @@
+{
+  "name": "PrototypeBuildKit",
+  "version": "1.1.0",
+  "description": "RP3's Prototype Build Kit, your starting point for builds of all kinds.",
+  "dependencies": {},
+  "devDependencies": {
+    "browser-sync": "^2.17.5",
+    "del": "^2.2.2",
+    "gulp": "^3.9.1",
+    "gulp-autoprefixer": "^3.1.1",
+    "gulp-ejs": "^3.0.0",
+    "gulp-filter": "~4.0.0",
+    "gulp-html-extend": "^1.1.6",
+    "gulp-jshint": "^2.0.4",
+    "gulp-markdown": "^1.2.0",
+    "gulp-remove-html-comments": "^1.0.1",
+    "gulp-s3-upload": "^1.6.4",
+    "gulp-sass": "^2.3.2",
+    "gulp-slack": "^0.1.2",
+    "gulp-sourcemaps": "~2.2.0",
+    "gulp-watch": "^4.3.10",
+    "gulp-wrap": "^0.13.0",
+    "jshint": "^2.9.4",
+    "username": "^2.3.0"
+  },
+  "scripts": {
+    "test": "echo \"Error: no test specified\" && exit 1"
+  },
+  "author": "RP3 Agency",
+  "license": "MIT"
+}

src/README.md

@@ -0,0 +1,9 @@
+# How To Use Markdown
+
+Just make a file full of markdown.  The build will automatically render it as html and stick it in the content section of your main.html template.  There's a variable in the opening stanzas of the gulpfile, `mdTemplate`, that controls what wrapper is used around the rendered markdown.
+
+- Make Bullet
+- Lists quickly
+- And prototype
+- Content too 
+- With Markdown!!!

src/_components/footer.html

@@ -0,0 +1 @@
+<h1>The footer on every page.</h1>

src/_components/header.html

@@ -0,0 +1 @@
+<h1>The header on every page.</h1>