Skip to content

Commit

Permalink
Merge pull request #52 from pattern-lab/dev
Browse files Browse the repository at this point in the history
PL Node 1.2
  • Loading branch information
Brian Muenzenmeyer committed Jul 20, 2014
2 parents 1fd786a + b4998ec commit 7f037ca
Show file tree
Hide file tree
Showing 42 changed files with 2,979 additions and 1,060 deletions.
4 changes: 2 additions & 2 deletions .travis.yml
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,6 @@ language: node_js
node_js:
- 0.11
- 0.10
- 0.8

before_install:
- phantomjs --version
Expand All @@ -13,4 +12,5 @@ before_script:

branches:
only:
- master
- master
- dev
14 changes: 14 additions & 0 deletions CHANGELOG
Original file line number Diff line number Diff line change
@@ -1,5 +1,19 @@
THIS CHANGELOG IS AN ATTEMPT TO DOCUMENT CHANGES TO THIS PROJECT.

PL-node-v0.1.2
- ADD: Abstracted template rendering into a function for easier swapping of rendering engine
- ADD: Smarter filtering of files to support other templates Thanks
- ADD: Help command line agument
- ADD: Version command line argument
- ADD: Patterns only command line argument
- ADD: IshControlsVisible options. Can now hide any ishControls you like.
- ADD: Documented the command line interface
- CHG: Put debug flag in conf.json instead of package.json
- CHG: Aligned styleguide css with patternlab-php
- FIX: Removed node .8 from travis
- FIX: Code and annotation support in patternlab viewer
- THX: thanks @ivanmayes and Shoptology crew for contibutions!

PL-node-v0.1.1
- FIX: Removed View All Pattern SubItem Link Logic, no longer in reference implementation
- ADD: Flag for generating debug file
Expand Down
20 changes: 10 additions & 10 deletions Gruntfile.js
Original file line number Diff line number Diff line change
Expand Up @@ -10,11 +10,15 @@ module.exports = function(grunt) {
concat: {
options: {
stripBanners: true,
banner: '/* \n * <%= pkg.name %> - v<%= pkg.version %> - <%= grunt.template.today("yyyy-mm-dd") %> \n * \n * <%= pkg.author %>, and the web community.\n * Licensed under the <%= pkg.license %> license. \n * \n * Many thanks to Brad Frost and Dave Olsen for inspiration, encouragement, and advice. \n *\n */\n\n',
banner: '/* \n * <%= pkg.name %> - v<%= pkg.version %> - <%= grunt.template.today("yyyy") %> \n * \n * <%= pkg.author %>, and the web community.\n * Licensed under the <%= pkg.license %> license. \n * \n * Many thanks to Brad Frost and Dave Olsen for inspiration, encouragement, and advice. \n *\n */\n\n',
},
dist: {
patternlab: {
src: './builder/patternlab.js',
dest: './builder/patternlab.js'
},
object_factory: {
src: './builder/object_factory.js',
dest: './builder/object_factory.js'
}
},
copy: {
Expand Down Expand Up @@ -68,17 +72,13 @@ module.exports = function(grunt) {
}
}
},
qunit: {
all:{
options:{
urls: ['./test/tests.html']
}
}
nodeunit: {
all: ['test/*_tests.js']
}
});

// load all grunt tasks
require('matchdep').filterDev('grunt-*').forEach(grunt.loadNpmTasks);
require('matchdep').filterDev('grunt-*').forEach(grunt.loadNpmTasks);

//load the patternlab task
grunt.task.loadTasks('./builder/');
Expand All @@ -87,5 +87,5 @@ module.exports = function(grunt) {
grunt.registerTask('default', ['clean', 'concat', 'patternlab', /*'sass',*/ 'copy']);

//travis CI task
grunt.registerTask('travis', ['clean', 'concat', 'patternlab', /*'sass',*/ 'copy', 'qunit'])
grunt.registerTask('travis', ['clean', 'concat', 'patternlab', /*'sass',*/ 'copy', 'nodeunit']);
};
76 changes: 67 additions & 9 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -10,33 +10,91 @@ To run patternlab-node, just do the following from the command line at the root
2. `npm install -g grunt-cli`
3. `grunt`

This creates all patterns, the styleguide, and the pattern lab site. `patternlab.json` is a file created for debugging purposes. It tells you all the secrets in tidy json.
This creates all patterns, the styleguide, and the pattern lab site.

### Command Line Interface

The following are grunt task arguments you may execute:

##### `patternlab`
With no arguments, patternlab runs the full builder, compiling patterns, and constructing the front-end site.

##### `patternlab:only_patterns`
Compile the patterns only, outputting to ./public/patterns

##### `patternlab:v`
Retrieve the version of patternlab-node you have installed

##### `patternlab:help`
Get more information about patternlab-node, pattern lab in general, and where to report issues.

### Config Options

##### Watching Changes
To have patternlab-node watch for changes to either a mustache template, data, or stylesheets, run `grunt watch`. The `Gruntfile` governs what is watched. It should be easy to add scss or whatever preprocessor you fancy.

##### Nav Bar Controls
If you don't have a need for some of the nav-bar tools in the patternlab frontend, you can turn them off in `config.json`.

The current selection is as follows. It reflects support versus patternlab-php.

```
"ishControlsVisible": {
"s": true,
"m": true,
"l": true,
"full": true,
"ranndom": true,
"disco": true,
"hay": true,
"mqs": false,
"find": false,
"views-all": true,
"views-annotations": true,
"views-code": true,
"views-new": true,
"tools-all": true,
"tools-follow": false,
"tools-reload": false,
"tools-shortcuts": false,
"tools-docs": true
}
```

##### Verbose Mode
`patternlab.json` is a file created for debugging purposes. Set `debug` to true in `.config.json` to see all the secrets.

### Under Active Development

[![Build Status](https://travis-ci.org/pattern-lab/patternlab-node.png?branch=master)](https://travis-ci.org/pattern-lab/patternlab-node) The Node version of Pattern Lab is under active development by [@bmuenzenmeyer](https://twitter.com/bmuenzenmeyer) and contributors. Pull requests welcome, but please take a moment to read the [guidelines](https://github.com/pattern-lab/patternlab-node/blob/master/CONTRIBUTING.md).

#### Forward, To the Specification!
### Forward, To the Specification!

Dave Olsen has published the [specification](https://github.com/pattern-lab/the-spec/blob/draft/SPEC.md) for Pattern Lab ports. Development will be oriented toward compliance with this as the spec and the port mature together.

#### Is Pattern Lab a Platform or a Build Tool?
### Is Pattern Lab a Platform or a Build Tool?

A lot of good conversation has revolved around whether Pattern Lab is a platform or a tool in the toolbox, part of a larger solution. It's my goal to #1) adhere to the specification and #2) meet the needs of both use cases.

If you want to only build the patterns, alter your `Gruntfile.js` patternlab task to the following:

**THE FOLLOWING IS FROM THE PATTERNLAB-PHP PROJECT. A LOT STILL APPLIES TO PATTERNLAB-NODE, BUT IT HAS NOT BEEN ADAPTED YET. USE AT YOUR OWN PERIL**
```
grunt.registerTask('default', ['clean', 'concat', 'patternlab:only_patterns', /*'sass',*/ 'copy']);
```

This will output compiled patterns to ./public/patterns/

===

## Demo
**THE FOLLOWING IS FROM THE PATTERNLAB-PHP PROJECT. A LOT STILL APPLIES TO PATTERNLAB-NODE, BUT IT HAS NOT BEEN ADAPTED YET. USE AT YOUR OWN PERIL**

===

### Demo

You can play with a demo of the front-end of the PHP version of Pattern Lab at [demo.pattern-lab.info](http://demo.pattern-lab.info).

## Getting Started
### Getting Started

The PHP version of Pattern Lab should be relatively easy for anyone to get up and running.

Expand All @@ -46,7 +104,7 @@ The PHP version of Pattern Lab should be relatively easy for anyone to get up an
* [Editing the Pattern Lab Website Source Files](https://github.com/pattern-lab/patternlab-php/wiki/Editing-the-Pattern-Lab-Website-Source-Files)
* [Using the Command-line Options](https://github.com/pattern-lab/patternlab-php/wiki/Using-the-Command-line-Options)

## Working with Patterns
### Working with Patterns

Patterns are the core element of Pattern Lab. Understanding how they work is the key to getting the most out of the system. Patterns use [Mustache](http://mustache.github.io/) so please read [Mustache's docs](http://mustache.github.io/mustache.5.html) as well.

Expand All @@ -60,7 +118,7 @@ Patterns are the core element of Pattern Lab. Understanding how they work is the
* [Managing Assets for a Pattern: JavaScript, images, CSS, etc.](https://github.com/pattern-lab/patternlab-php/wiki/Managing-Assets-for-a-Pattern)
* [Modifying the Standard Header & Footer for Patterns](https://github.com/pattern-lab/patternlab-php/wiki/Modifying-the-Standard-Header-&-Footer-for-Patterns)

## Creating & Working With Dynamic Data for a Pattern
### Creating & Working With Dynamic Data for a Pattern

The PHP version of Pattern Lab utilizes Mustache as the template language for patterns. In addition to allowing for the [inclusion of one pattern within another](https://github.com/pattern-lab/patternlab-php/wiki/Including-One-Pattern-Within-Another) it also gives pattern developers the ability to include variables. This means that attributes like image sources can be centralized in one file for easy modification across one or more patterns. The PHP version of Pattern Lab uses a JSON file, `source/_data/data.json`, to centralize many of these attributes.

Expand All @@ -69,7 +127,7 @@ The PHP version of Pattern Lab utilizes Mustache as the template language for pa
* [Linking to Patterns with Pattern Lab's Default `link` Variable](https://github.com/pattern-lab/patternlab-php/wiki/Linking-to-Patterns-with-Pattern-Lab's-Default-%60link%60-Variable)
* [Creating Lists with Pattern Lab's Default `listItems` Variable](https://github.com/pattern-lab/patternlab-php/wiki/Creating-Lists-with-Pattern-Lab's-Default-%60listItems%60-Variable)

## Using Pattern Lab's Advanced Features
### Using Pattern Lab's Advanced Features

By default, the Pattern Lab assets can be manually generated and the Pattern Lab site manually refreshed but who wants to waste time doing that? Here are some ways that the PHP version of Pattern Lab can make your development workflow a little smoother:

Expand Down
64 changes: 64 additions & 0 deletions builder/object_factory.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,64 @@
/*
* patternlab-node - v0.1.2 - 2014
*
* Brian Muenzenmeyer, and the web community.
* Licensed under the MIT license.
*
* Many thanks to Brad Frost and Dave Olsen for inspiration, encouragement, and advice.
*
*/

(function () {
"use strict";

var oPattern = function(name, subdir, filename, data){
this.name = name; //this is the unique name with the subDir
this.subdir = subdir;
this.filename = filename;
this.data = data;
this.template = '';
this.patternPartial = '';
this.patternName = ''; //this is the display name for the ui
this.patternLink = '';
this.patternGroup = name.substring(name.indexOf('-') + 1, name.indexOf('-', 4) + 1 - name.indexOf('-') + 1);
this.patternSubGroup = subdir.substring(subdir.indexOf('/') + 4);
this.flatPatternPath = subdir.replace(/\//g, '-');
};

var oBucket = function(name){
this.bucketNameLC = name;
this.bucketNameUC = name.charAt(0).toUpperCase() + name.slice(1);
this.navItems = [];
this.navItemsIndex = [];
this.patternItems = [];
this.patternItemsIndex = [];
};

var oNavItem = function(name){
this.sectionNameLC = name;
this.sectionNameUC = name.charAt(0).toUpperCase() + name.slice(1);
this.navSubItems = [];
this.navSubItemsIndex = [];
};

var oNavSubItem = function(name){
this.patternPath = '';
this.patternPartial = '';
this.patternName = name.charAt(0).toUpperCase() + name.slice(1);
};

var oPatternItem = function(){
this.patternPath = '';
this.patternPartial = '';
this.patternName = '';
};

module.exports = {
oPattern: oPattern,
oBucket: oBucket,
oNavItem: oNavItem,
oNavSubItem: oNavSubItem,
oPatternItem: oPatternItem
};

}());
5 changes: 5 additions & 0 deletions builder/pattern_assembler.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,5 @@
(function () {
"use strict";


}());
Loading

0 comments on commit 7f037ca

Please sign in to comment.