diff --git a/packages/patternengine-node-mustache/Gruntfile.js b/packages/patternengine-node-mustache/Gruntfile.js index 83cdbb4c8..31b5c605d 100644 --- a/packages/patternengine-node-mustache/Gruntfile.js +++ b/packages/patternengine-node-mustache/Gruntfile.js @@ -84,8 +84,7 @@ module.exports = function (grunt) { files: [ path.resolve(paths().source.css + '**/*.css'), path.resolve(paths().source.styleguide + 'css/*.css'), - path.resolve(paths().source.patterns + '**/*.mustache'), - path.resolve(paths().source.patterns + '**/*.json'), + path.resolve(paths().source.patterns + '**/*'), path.resolve(paths().source.fonts + '/*'), path.resolve(paths().source.images + '/*'), path.resolve(paths().source.data + '*.json') diff --git a/packages/patternengine-node-mustache/builder/pattern_engines/engine_twig.js b/packages/patternengine-node-mustache/builder/pattern_engines/engine_twig.js new file mode 100644 index 000000000..a8357e539 --- /dev/null +++ b/packages/patternengine-node-mustache/builder/pattern_engines/engine_twig.js @@ -0,0 +1,87 @@ +/* + * handlebars pattern engine for patternlab-node - v0.15.1 - 2015 + * + * Geoffrey Pursell, Brian Muenzenmeyer, and the web community. + * Licensed under the MIT license. + * + * Many thanks to Brad Frost and Dave Olsen for inspiration, encouragement, and advice. + * + */ + +/* + * ENGINE SUPPORT LEVEL: + * + * Full. Partial calls and lineage hunting are supported. Handlebars does not + * support the mustache-specific syntax extensions, style modifiers and pattern + * parameters, because their use cases are addressed by the core Handlebars + * feature set. + * + */ + +(function () { + "use strict"; + + var Twig = require('twig/twig.js'); + var twig = Twig.twig; + + var engine_twig = { + engine: Twig, + engineName: 'twig', + engineFileExtension: '.twig', + + //Important! Needed for Twig compilation. Can't resolve paths otherwise. + expandPartials: true, + + // regexes, stored here so they're only compiled once + findPartialsRE: /{%([ ]+)?(?:extends|include|embed)(\s\S)(.*)%}/g, + findListItemsRE: /({{#( )?)(list(I|i)tems.)(one|two|three|four|five|six|seven|eight|nine|ten|eleven|twelve|thirteen|fourteen|fifteen|sixteen|seventeen|eighteen|nineteen|twenty)( )?}}/g, // TODO + + // render it + renderPattern: function renderPattern(template, data) { + var template = twig({ + data: template + }).render(data); + + return template; + }, + + // find and return any {{> template-name }} within pattern + findPartials: function findPartials(pattern) { + var matches = pattern.template.match(this.findPartialsRE); + return matches; + }, + findPartialsWithStyleModifiers: function() { + // TODO: make the call to this from oPattern objects conditional on their + // being implemented here. + return []; + }, + // returns any patterns that match {{> value(foo:"bar") }} or {{> + // value:mod(foo:"bar") }} within the pattern + findPartialsWithPatternParameters: function() { + // TODO: make the call to this from oPattern objects conditional on their + // being implemented here. + return []; + }, + findListItems: function(pattern) { + var matches = pattern.template.match(this.findListItemsRE); + return matches; + }, + // given a pattern, and a partial string, tease out the "pattern key" and + // return it. + findPartialKey: function(partialString) { + + + //var partialKey = partialString.replace(this.findPartialsRE, '$1'); + var partialKey = partialString.match(/"((?:\\.|[^"\\])*)"/)[0]; + partialKey = partialKey.replace(/"/g, ''); + + return partialKey; + } + + + + + }; + + module.exports = engine_twig; +})(); diff --git a/packages/patternengine-node-mustache/package.gulp.json b/packages/patternengine-node-mustache/package.gulp.json index 3bb48a781..01f789741 100644 --- a/packages/patternengine-node-mustache/package.gulp.json +++ b/packages/patternengine-node-mustache/package.gulp.json @@ -9,7 +9,10 @@ "fs-extra": "^0.26.5", "glob": "^7.0.0", "html-entities": "^1.2.0", - "mustache": "^2.2.1" + "mustache": "^2.2.1", + "handlebars": "^4.0.5", + "twig": "^0.8.8", + "underscore": "^1.8.3", }, "devDependencies": { "browser-sync": "^2.11.1", diff --git a/packages/patternengine-node-mustache/package.json b/packages/patternengine-node-mustache/package.json index e4bb9e4b1..c8971374d 100644 --- a/packages/patternengine-node-mustache/package.json +++ b/packages/patternengine-node-mustache/package.json @@ -11,7 +11,8 @@ "matchdep": "^1.0.0", "mustache": "^2.2.0", "handlebars": "^4.0.5", - "underscore": "^1.8.3" + "underscore": "^1.8.3", + "twig": "^0.8.8" }, "devDependencies": { "bs-html-injector": "^3.0.0", diff --git a/packages/patternengine-node-mustache/source/_patterns/00-atoms/08-button.twig b/packages/patternengine-node-mustache/source/_patterns/00-atoms/08-button.twig new file mode 100644 index 000000000..cf0041685 --- /dev/null +++ b/packages/patternengine-node-mustache/source/_patterns/00-atoms/08-button.twig @@ -0,0 +1,10 @@ + + +Button diff --git a/packages/patternengine-node-mustache/source/_patterns/00-atoms/09-image.twig b/packages/patternengine-node-mustache/source/_patterns/00-atoms/09-image.twig new file mode 100644 index 000000000..01c4af9f8 --- /dev/null +++ b/packages/patternengine-node-mustache/source/_patterns/00-atoms/09-image.twig @@ -0,0 +1,5 @@ + diff --git a/packages/patternengine-node-mustache/source/_patterns/01-molecules/media-object.twig b/packages/patternengine-node-mustache/source/_patterns/01-molecules/media-object.twig new file mode 100644 index 000000000..532e0c6db --- /dev/null +++ b/packages/patternengine-node-mustache/source/_patterns/01-molecules/media-object.twig @@ -0,0 +1,31 @@ + + + +{% set foo = "world!" %} + + +
+ {% include "atoms-image" %} + +
+ + {# Testing if we can also pull in non-twig templates without breaking anything (it works!). Good idea though? Eh... #} + {% include "atoms-paragraph" %} + +

Oh, hello {{ foo }}

+
+