chore(TypeScript): demo for typescript

jeremenichelli · Feb 17, 2019 · 7ee8700 · 7ee8700
1 parent 677e851
commit 7ee8700
Show file tree

Hide file tree

Showing 22 changed files with 9,062 additions and 53 deletions.
diff --git a/demo/browser/index.html b/demo/browser/index.html
@@ -3,12 +3,12 @@
 
 <head>
   <title>liquidjs for the browser</title>
-  <script src="../../dist/liquid.js"></script>
+  <script src="node_modules/liquidjs/dist/liquid.min.js"></script>
 </head>
 
 <body>
   <script>
-    var engine = window.Liquid({
+    var engine = new window.Liquid({
       extname: '.html',
       cache: true
     });

diff --git a/demo/browser/package-lock.json b/demo/browser/package-lock.json
diff --git a/demo/browser/package.json b/demo/browser/package.json
@@ -0,0 +1,17 @@
+{
+  "name": "liquidjs-demo-browser",
+  "version": "1.0.0",
+  "description": "Liquidjs Demo for Browser Usage",
+  "main": "index.html",
+  "scripts": {
+    "start": "http-server -c-1 "
+  },
+  "author": "harttle <[email protected]>",
+  "license": "ISC",
+  "devDependencies": {
+    "http-server": "^0.11.1"
+  },
+  "dependencies": {
+    "liquidjs": "^7.0.0"
+  }
+}
diff --git a/demo/nodejs/index.js b/demo/nodejs/index.js
@@ -4,9 +4,23 @@ const engine = new Liquid({
   root: __dirname,
   extname: '.liquid'
 })
+
+engine.registerTag('header', {
+  parse: function (token) {
+    const [key, val] = token.args.split(':')
+    this[key] = val
+  },
+  render: function (scope, hash) {
+    const title = this.liquid.evalValue(this.content, scope)
+    return `<h1>${title}</h1>`
+  }
+})
+
 const ctx = {
   todos: ['fork and clone', 'make it better', 'make a pull request'],
   title: 'Welcome to liquidjs!'
 }
 
-engine.renderFile('todolist', ctx).then(console.log)
+engine.renderFile('todolist', ctx)
+  .then(console.log)
+  .catch(err => console.error(err.stack))
diff --git a/demo/nodejs/package-lock.json b/demo/nodejs/package-lock.json
diff --git a/demo/nodejs/package.json b/demo/nodejs/package.json
@@ -0,0 +1,11 @@
+{
+  "name": "liquidjs-demo-nodejs",
+  "description": "Node.js demo for liquidjs",
+  "main": "index.js",
+  "scripts": {
+    "start": "node index.js"
+  },
+  "dependencies": {
+    "liquidjs": "^7.0.0"
+  }
+}
diff --git a/demo/nodejs/todolist.liquid b/demo/nodejs/todolist.liquid
@@ -1,3 +1,5 @@
+{%header content: "welcome to liquid" | capitalize%}
+
 <ul>
   {% for todo in todos %}
   <li>{{forloop.index}} - {{todo}}</li>

diff --git a/demo/typescript/index.ts b/demo/typescript/index.ts
@@ -1,13 +1,25 @@
-import Liquid, {isTruthy} from 'liquidjs'
+import Liquid from 'liquidjs'
 
 const engine = new Liquid({
   root: __dirname,
   extname: '.liquid'
 })
+
+engine.registerTag('header', {
+  parse: function (token) {
+    const [key, val] = token.args.split(':')
+    this[key] = val
+  },
+  render: function (scope, hash) {
+    const title = this.liquid.evalValue(this['content'], scope)
+    return `<h1>${title}</h1>`
+  }
+})
+
 const ctx = {
   todos: ['fork and clone', 'make it better', 'make a pull request'],
   title: 'Welcome to liquidjs!'
 }
 
 // console.log('isTruthy:', isTruthy('a string here'));
-engine.renderFile('todolist', ctx).then(console.log)
+engine.renderFile('todolist', ctx).then(console.log)