Labyricorn/liquidjs
1
0
Fork 0
mirror of https://github.com/harttle/liquidjs.git synced 2026-09-15 20:30:39 -07:00
Code Issues Packages Projects Releases Wiki Activity

tag:include

Browse Source
This commit is contained in:
harttle
2016-06-24 02:44:20 +08:00
parent 21bde3cb6d
commit 8fbbec089f
24 changed files with 226 additions and 52 deletions
Download Patch File Download Diff File Expand all files Collapse all files
README.md
+43 -9
View File
@@ -11,14 +11,14 @@ shall be implemented.
> [Shopify liquid][shopify-liquid] is used by [Jekyll][jekyll] and [Github Pages][gh].
## Usage
Install:
Installation:
```bash
npm install --save shopify-liquid
```
## Render from String
Parse and Render:
```javascript
@@ -35,6 +35,43 @@ var tpl = engine.parse('{{name | capitalize}}');
engine.render(tpl, {name: 'alice'}); // Alice
```
## Render from File
```javascript
var engine = Liquid({
root: path.resolve(__dirname, 'views/'),
extname: '.liquid',
cache: false
});
// equivalent to: engine.renderFile("hello", {name: 'alice'});
var html = engine.renderFile("hello.html", {name: 'alice'});
```
`cache` default to `false`, `extname` default to `.liquid`, `root` default to `""`.
## Include
```
// file: color.liquid
color: '{{ color }}' shape: '{{ shape }}'
// file: theme.liquid
{% assign shape = 'circle' %}
{% include 'color' %}
{% include 'color' with 'red' %}
{% include 'color', color: 'yellow', shape: 'square' %}
```
The output will be:
```
color: '' shape: 'circle'
color: 'red' shape: 'circle'
color: 'yellow' shape: 'square'
```
## Extension
Register Filters:
```javascript
@@ -93,6 +130,7 @@ Tag | Document | Source | Test
`decrement` | [Document](https://shopify.github.io/liquid/tags/variable/) | [Source](https://github.com/harttle/shopify-liquid/blob/master/tags/decrement.js) | [Test][tt]
`raw` | [Document](https://help.shopify.com/themes/liquid/tags/theme-tags#raw) | [Source](https://github.com/harttle/shopify-liquid/blob/master/tags/raw.js) | [Test][tt]
`comment` | [Document](https://help.shopify.com/themes/liquid/tags/theme-tags#comment) | [Source](https://github.com/harttle/shopify-liquid/blob/master/tags/comment.js) | [Test][tt]
`include` | [Document](https://help.shopify.com/themes/liquid/tags/theme-tags#include) | [Source](https://github.com/harttle/shopify-liquid/blob/master/tags/include.js) | [Test][tt]
## Filters
@@ -143,10 +181,6 @@ Filter | Document | Source | Test
`upcase` | [Document](https://shopify.github.io/liquid/filters/upcase) | [Source](https://github.com/harttle/shopify-liquid/blob/master/filters.js) | [Test][ft]
`url_encode` | [Document](https://shopify.github.io/liquid/filters/url_encode) | [Source](https://github.com/harttle/shopify-liquid/blob/master/filters.js) | [Test][ft]
## Differences from Shopify Liquid
* `url_encode` is based on `encodeURIComponent`, ` ` will be converted to `%20`.
## Async Support
harttle/shopify-liquid do NOT support async rendering, this is by design.
@@ -156,8 +190,8 @@ Async rendering introduces extra complexity in both implementation and extension
For template-driven projects, checkout these Liquid-like engines:
* [liquid-node][liquid-node]: <https://github.com/sirlantis/liquid-node>
* [nunjucks][nunjucks]: <http://mozilla.github.io/nunjucks/>
* liquid-node: <https://github.com/sirlantis/liquid-node>
* nunjucks: <http://mozilla.github.io/nunjucks/>
[nunjucks]: http://mozilla.github.io/nunjucks/
[liquid-node]: https://github.com/sirlantis/liquid-node
index.js
+39 -13
View File
@@ -1,17 +1,24 @@
const scope = require('./scope');
const tokenizer = require('./tokenizer.js');
const Render = require('./render.js');
const lexical = require('./lexical.js');
const scope = require('./src/scope');
const assert = require('assert');
const _ = require('lodash');
const tokenizer = require('./src/tokenizer.js');
const Render = require('./src/render.js');
const lexical = require('./src/lexical.js');
const path = require("path");
const fs = require('fs');
const Tag = require('./tag.js');
const Filter = require('./filter.js');
const Template = require('./parser');
const Expression = require('./expression.js');
const tagsPath = path.join(__dirname, "tags");
const Tag = require('./src/tag.js');
const Filter = require('./src/filter.js');
const Template = require('./src/parser');
const Expression = require('./src/expression.js');
const tagsPath = path.join(__dirname, "tags/");
const filtersPath = path.join(__dirname, "filters.js");
var _engine = {
init: function(tag, filter) {
init: function(tag, filter, options) {
if (options.cache) {
this.cache = {};
}
this.options = options;
this.tag = tag;
this.filter = filter;
this.parser = Template(tag, filter);
@@ -30,6 +37,10 @@ var _engine = {
var tpl = this.parse(html);
return this.render(tpl, ctx);
},
renderFile: function(filepath, ctx) {
var tpl = this.handleCache(filepath);
return this.render(tpl, ctx);
},
evalOutput: function(str, scope) {
var tpl = this.parser.parseOutput(str.trim());
return this.renderer.evalOutput(tpl, scope);
@@ -40,11 +51,26 @@ var _engine = {
registerTag: function(name, tag) {
return this.tag.register(name, tag);
},
handleCache: function(filepath) {
assert(filepath, 'filepath cannot be null');
filepath = path.resolve(this.options.root, filepath);
if(path.extname(filepath) === ''){
filepath += this.options.extname;
}
var tpl = this.options.cache && this.cache[filepath] ||
this.parse(fs.readFileSync(filepath));
return this.options.cache ? (this.cache[filepath] = tpl) : tpl;
}
};
function factory() {
function factory(options) {
options = _.defaults(options || {
root: '',
extname: '.liquid'
});
var engine = Object.create(_engine);
engine.init(Tag(), Filter());
engine.init(Tag(), Filter(), options);
registerTagsAndFilters(engine);
return engine;
}
@@ -55,7 +81,7 @@ function registerTagsAndFilters(engine) {
if (!match) return;
require("./tags/" + f)(engine);
});
require("./filters.js")(engine);
require(filtersPath)(engine);
}
factory.lexical = lexical;
package.json
+5 -2
View File
@@ -1,6 +1,6 @@
{
"name": "shopify-liquid",
"version": "1.1.3",
"version": "1.1.4",
"description": "A Shopify Liquid Implementation in Node.js",
"main": "index.js",
"scripts": {
@@ -27,9 +27,12 @@
"devDependencies": {
"chai": "^3.5.0",
"coveralls": "^2.11.9",
"express": "^4.14.0",
"istanbul": "^0.4.3",
"mocha": "^2.5.3",
"mock-fs": "^3.9.0",
"sinon": "^1.17.4",
"sinon-chai": "^2.8.0"
"sinon-chai": "^2.8.0",
"supertest": "^1.2.0"
}
}
error.js → src/error.js
View File
expression.js → src/expression.js
View File
filter.js → src/filter.js
View File
lexical.js → src/lexical.js
View File
parser.js → src/parser.js
View File
render.js → src/render.js
View File
scope.js → src/scope.js
View File
syntax.js → src/syntax.js
View File
tag.js → src/tag.js
View File
tokenizer.js → src/tokenizer.js
View File
tags/include.js
+31
View File
@@ -0,0 +1,31 @@
var Liquid = require('..');
var lexical = Liquid.lexical;
var withRE = new RegExp(`with\\s+(${lexical.value.source})`);
module.exports = function(liquid) {
liquid.registerTag('include', {
parse: function(token){
var match = lexical.value.exec(token.args);
if(!match) error(`illegal token ${token.raw}`, token);
this.value = match[0];
match = withRE.exec(token.args);
if(match){
this.with = match[1];
}
},
render: function(scope, hash) {
var filepath = Liquid.evalValue(this.value, scope);
if(this.with){
hash[filepath] = Liquid.evalValue(this.with, scope);
}
var tpl = liquid.handleCache(filepath);
scope.push(hash);
var html = liquid.renderer.renderTemplates(tpl, scope);
scope.pop();
return html;
}
});
};
test/expression.js
+2 -2
View File
@@ -1,7 +1,7 @@
const chai = require("chai");
const expect = chai.expect;
var expression = require('../expression.js');
var Scope = require('../scope.js');
var expression = require('../src/expression.js');
var Scope = require('../src/scope.js');
var evalExp = expression.evalExp;
var evalValue = expression.evalValue;
test/filter.js
+2 -2
View File
@@ -5,8 +5,8 @@ const expect = chai.expect;
chai.use(sinonChai);
var filter = require('../filter.js')();
var Scope = require('../scope.js');
var filter = require('../src/filter.js')();
var Scope = require('../src/scope.js');
describe('filter', function() {
var scope;
test/lexical.js
+1 -1
View File
@@ -2,7 +2,7 @@ var chai = require("chai");
var should = chai.should();
var expect = chai.expect;
var lexical = require('../lexical.js');
var lexical = require('../src/lexical.js');
describe('lexical', function() {
it('should test filter syntax', function(){
test/liquid.js
+48 -9
View File
@@ -2,24 +2,29 @@ const chai = require("chai");
const expect = chai.expect;
const should = chai.should;
const Liquid = require('..');
const mock = require('mock-fs');
describe('liquid', function() {
var engine, ctx;
beforeEach(function() {
engine = Liquid();
ctx = {
date: new Date(),
foo: 'bar',
name: 'harttle',
arr: [-2, 'a'],
obj: {
foo: 'bar'
},
posts: [{
category: 'foo'
}, {
category: 'bar'
}]
}
};
engine = Liquid({
root: '/root/',
extname: '.html'
});
mock({
'/root/files/foo.html': 'foo',
'/root/files/name.html': 'My name is {{name}}.'
});
});
afterEach(function(){
mock.restore();
});
it('should output object', function() {
engine.parseAndRender('{{obj}}', ctx).should.equal('{"foo":"bar"}');
@@ -44,4 +49,38 @@ describe('liquid', function() {
var template = engine.parse('<p>{{arr | join: "_"}}</p>');
engine.render(template, ctx).should.equal('<p>-2_a</p>');
});
it('should render file', function(){
engine.renderFile('/root/files/foo.html', ctx).should.equal('foo');
});
it('should render file relative to root', function(){
engine.renderFile('files/foo.html', ctx).should.equal('foo');
});
it('should render file with context', function(){
engine.renderFile('/root/files/name.html', ctx).should.equal('My name is harttle.');
});
it('should render file with default extname', function() {
engine.renderFile('files/name', ctx).should.equal('My name is harttle.');
});
it('should disable cache by default', function(){
mock({
'/root/files/foo.html': 'bar'
});
engine.renderFile('files/foo', ctx).should.equal('bar');
});
it('should respect cache option', function(){
mock.restore();
engine = Liquid({
root: '/root/',
extname: '.html',
cache: true
});
mock({
'/root/files/foo.html': 'foo'
});
engine.renderFile('files/foo', ctx).should.equal('foo');
mock({
'/root/files/foo.html': 'bar'
});
engine.renderFile('files/foo', ctx).should.equal('foo');
});
});
test/parser.js
+3 -3
View File
@@ -6,9 +6,9 @@ const expect = chai.expect;
chai.use(sinonChai);
var filter = require('../filter.js')();
var tag = require('../tag.js')();
var Template = require('../parser.js');
var filter = require('../src/filter.js')();
var tag = require('../src/tag.js')();
var Template = require('../src/parser.js');
describe('template', function() {
var scope, template, add = (l, r) => l + r;
test/render.js
+5 -5
View File
@@ -5,11 +5,11 @@ const expect = chai.expect;
chai.use(sinonChai);
var tag = require('../tag.js')();
var Scope = require('../scope.js');
var filter = require('../filter')();
var Render = require('../render.js');
var Template = require('../parser.js')(tag, filter);
var tag = require('../src/tag.js')();
var Scope = require('../src/scope.js');
var filter = require('../src/filter')();
var Render = require('../src/render.js');
var Template = require('../src/parser.js')(tag, filter);
describe('render', function() {
var scope, render;
test/scope.js
+1 -1
View File
@@ -2,7 +2,7 @@ var chai = require("chai");
var should = chai.should();
var expect = chai.expect;
var Scope = require('../scope.js');
var Scope = require('../src/scope.js');
describe('scope', function() {
var scope;
test/tag.js
+2 -2
View File
@@ -4,8 +4,8 @@ var sinon = require("sinon");
var expect = chai.expect;
chai.use(sinonChai);
var tag = require('../tag.js')();
var Scope = require('../scope.js');
var tag = require('../src/tag.js')();
var Scope = require('../src/scope.js');
describe('tag', function() {
var scope;
test/tags.js
+43 -2
View File
@@ -1,7 +1,11 @@
const chai = require("chai");
const expect = chai.expect;
var liquid = require('..')(),
const Liquid = require('..');
const mock = require('mock-fs');
var liquid = Liquid({
root: '/',
extname: '.html'
}),
ctx, src, dst;
function test(src, dst) {
@@ -26,6 +30,20 @@ describe('tags', function() {
alpha: ['a', 'b', 'c'],
emptyArray: []
};
mock({
'/files/foo.html': 'foo',
'/current.html': 'bar{% include "foo.html" %}bar',
'/relative.html': 'bar{% include "../files/foo.html" %}bar',
'/foo.html': 'FOO',
'/user.html': '{{name}} : {{role}} : {{alias}}',
'/color.html': 'color:{{color}}, shape:{{shape}}',
'/with.html': '{% include "color" with "red", shape: "rect" %}',
'/scope.html': '{% assign shape="triangle" %}{% assign color="yellow" %}{% include "color.html" %}',
'/hash.html': '{% assign name="harttle" %}{% include "user.html", role: "admin", alias: name %}'
});
});
afterEach(function() {
mock.restore();
});
it('should support assign', function() {
@@ -217,4 +235,27 @@ describe('tags', function() {
'</table>';
test(src, dst);
});
it('should support include', function() {
expect(liquid.renderFile('/current.html', ctx)).to.equal('barFOObar');
});
it('should support include with relative path', function() {
expect(liquid.renderFile('relative.html', ctx)).to.equal('barfoobar');
});
it('should support include: hash list', function() {
expect(liquid.renderFile('hash.html', ctx)).to.equal('harttle : admin : harttle');
});
it('should support include: parent scope', function() {
expect(liquid.renderFile('scope.html', ctx)).to.equal('color:yellow, shape:triangle');
});
it('should support include: with', function() {
var filepath = 'with.html';
var dst = 'color:red, shape:rect';
expect(liquid.renderFile(filepath, ctx)).to.equal(dst);
});
});
test/tokenizer.js
+1 -1
View File
@@ -2,7 +2,7 @@ var chai = require("chai");
var should = chai.should();
var expect = chai.expect;
var tokenizer = require('../tokenizer.js');
var tokenizer = require('../src/tokenizer.js');
describe('tokenizer', function() {
it('should handle plain HTML', function() {