handlebarsjs 0.1.1 → 0.3.0

data/docs/domain_model.svg

@@ -0,0 +1,3 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="1087px" height="367px" viewBox="-0.5 -0.5 1087 367"><defs/><g><rect x="0" y="0" width="210" height="210" fill="#f5f5f5" stroke="#666666" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe flex-start; justify-content: unsafe center; width: 208px; height: 1px; padding-top: 7px; margin-left: 1px;"><div data-drawio-colors="color: #333333; " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 20px; font-family: Helvetica; color: rgb(51, 51, 51); line-height: 1.2; pointer-events: all; white-space: normal; overflow-wrap: normal;">Tailwind GEM</div></div></div></foreignObject><text x="105" y="27" fill="#333333" font-family="Helvetica" font-size="20px" text-anchor="middle">Tailwind GEM</text></switch></g><rect x="205" y="25" width="160" height="160" fill="#ffe6cc" stroke="#d79b00" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 158px; height: 1px; padding-top: 105px; margin-left: 206px;"><div data-drawio-colors="color: #333333; " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(51, 51, 51); line-height: 1.2; pointer-events: all; white-space: normal; overflow-wrap: normal;">Handlebars-Helpers (ruby)</div></div></div></foreignObject><text x="285" y="109" fill="#333333" font-family="Helvetica" font-size="12px" text-anchor="middle">Handlebars-Helpers (ruby)</text></switch></g><rect x="385" y="25" width="160" height="160" fill="#f8cecc" stroke="#b85450" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 158px; height: 1px; padding-top: 105px; margin-left: 386px;"><div data-drawio-colors="color: #333333; " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(51, 51, 51); line-height: 1.2; pointer-events: all; white-space: normal; overflow-wrap: normal;">Handlebars (ruby)</div></div></div></foreignObject><text x="465" y="109" fill="#333333" font-family="Helvetica" font-size="12px" text-anchor="middle">Handlebars (ruby)</text></switch></g><rect x="565" y="25" width="160" height="160" fill="#f8cecc" stroke="#b85450" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 158px; height: 1px; padding-top: 105px; margin-left: 566px;"><div data-drawio-colors="color: #333333; " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(51, 51, 51); line-height: 1.2; pointer-events: all; white-space: normal; overflow-wrap: normal;">The Ruby Racer</div></div></div></foreignObject><text x="645" y="109" fill="#333333" font-family="Helvetica" font-size="12px" text-anchor="middle">The Ruby Racer</text></switch></g><rect x="745" y="25" width="160" height="160" fill="#f8cecc" stroke="#b85450" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 158px; height: 1px; padding-top: 105px; margin-left: 746px;"><div data-drawio-colors="color: #333333; " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(51, 51, 51); line-height: 1.2; pointer-events: all; white-space: normal; overflow-wrap: normal;">Node V8 engine</div></div></div></foreignObject><text x="825" y="109" fill="#333333" font-family="Helvetica" font-size="12px" text-anchor="middle">Node V8 engine</text></switch></g><rect x="925" y="25" width="160" height="160" fill="#ffe6cc" stroke="#d79b00" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 158px; height: 1px; padding-top: 105px; margin-left: 926px;"><div data-drawio-colors="color: #333333; " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(51, 51, 51); line-height: 1.2; pointer-events: all; white-space: normal; overflow-wrap: normal;">Handlebars JS (javascript</div></div></div></foreignObject><text x="1005" y="109" fill="#333333" font-family="Helvetica" font-size="12px" text-anchor="middle">Handlebars JS (javascript</text></switch></g><rect x="25" y="205" width="160" height="160" fill="#d5e8d4" stroke="#82b366" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 158px; height: 1px; padding-top: 285px; margin-left: 26px;"><div data-drawio-colors="color: #333333; " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(51, 51, 51); line-height: 1.2; pointer-events: all; white-space: normal; overflow-wrap: normal;">HandlebarsJS (ruby)</div></div></div></foreignObject><text x="105" y="289" fill="#333333" font-family="Helvetica" font-size="12px" text-anchor="middle">HandlebarsJS (ruby)</text></switch></g><rect x="205" y="205" width="160" height="160" fill="#d5e8d4" stroke="#82b366" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 158px; height: 1px; padding-top: 285px; margin-left: 206px;"><div data-drawio-colors="color: #333333; " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(51, 51, 51); line-height: 1.2; pointer-events: all; white-space: normal; overflow-wrap: normal;">Mini Racer</div></div></div></foreignObject><text x="285" y="289" fill="#333333" font-family="Helvetica" font-size="12px" text-anchor="middle">Mini Racer</text></switch></g><rect x="365" y="205" width="200" height="160" fill="#ffe6cc" stroke="#d79b00" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe flex-start; width: 202px; height: 160px; padding-top: 205px; margin-left: 365px;"><div data-drawio-colors="color: #333333; " style="box-sizing: border-box; font-size: 0px; text-align: left; width: 200px; height: 160px; overflow: hidden;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(51, 51, 51); line-height: 1.2; pointer-events: all; width: 100%; height: 100%; white-space: normal; overflow-wrap: normal;"><p style="margin: 0px ; margin-left: 4px ; margin-bottom: 4px ; text-align: center"><b>Component</b></p><hr size="1" /><p style="margin: 0px ; margin-left: 4px ; margin-bottom: 4px">key: Symbol</p><p style="margin: 0px ; margin-left: 4px ; margin-bottom: 4px">name: String</p><p style="margin: 0px ; margin-left: 4px ; margin-bottom: 4px">description: String</p><p style="margin: 0px ; margin-left: 4px ; margin-bottom: 4px">data_shape: DataShape</p></div></div></div></foreignObject><text x="365" y="289" fill="#333333" font-family="Helvetica" font-size="12px">Component...</text></switch></g></g><switch><g requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility"/><a transform="translate(0,-5)" xlink:href="https://www.diagrams.net/doc/faq/svg-export-text-problems" target="_blank"><text text-anchor="middle" font-size="10px" x="50%" y="100%">Text is not SVG - cannot display</text></a></switch></svg>

data/docs/domain_model_custom.drawio

@@ -0,0 +1,61 @@
+<mxfile host="65bd71144e">
+    <diagram id="eju" name="Domain Modal">
+        <mxGraphModel dx="1097" dy="583" grid="0" gridSize="10" guides="1" tooltips="1" connect="1" arrows="1" fold="1" page="1" pageScale="1" pageWidth="1169" pageHeight="827" background="#fafafa" math="0" shadow="0">
+            <root>
+                <mxCell id="page_root_eju"/>
+                <mxCell id="node_root_eju" parent="page_root_eju"/>
+                <mxCell id="eju-10" value="GEM Architecture Flow" style="whiteSpace=wrap;html=1;rounded=0;fillColor=#f5f5f5;strokeColor=#666666;fontColor=#333333;fontSize=20;verticalAlign=top" parent="node_root_eju" vertex="1">
+                    <mxGeometry x="8" y="10" width="1113" height="581" as="geometry"/>
+                </mxCell>
+                <mxCell id="a1" value="KManager -&gt; KBuilder" style="whiteSpace=wrap;html=1;rounded=0;fillColor=#dae8fc;strokeColor=#6c8ebf;fontColor=#333333" parent="node_root_eju" vertex="1">
+                    <mxGeometry x="47" y="334" width="160" height="160" as="geometry"/>
+                </mxCell>
+                <mxCell id="a2" value="Handlebars-Helpers (ruby)" style="whiteSpace=wrap;html=1;rounded=0;fillColor=#ffe6cc;strokeColor=#d79b00;fontColor=#333333" parent="node_root_eju" vertex="1">
+                    <mxGeometry x="231" y="188" width="160" height="160" as="geometry"/>
+                </mxCell>
+                <mxCell id="a3" value="Handlebars (ruby)" style="whiteSpace=wrap;html=1;rounded=0;fillColor=#f8cecc;strokeColor=#b85450;fontColor=#333333" parent="node_root_eju" vertex="1">
+                    <mxGeometry x="468" y="304" width="160" height="160" as="geometry"/>
+                </mxCell>
+                <mxCell id="a4" value="The Ruby Racer" style="whiteSpace=wrap;html=1;rounded=0;fillColor=#f8cecc;strokeColor=#b85450;fontColor=#333333" parent="node_root_eju" vertex="1">
+                    <mxGeometry x="686" y="304" width="160" height="160" as="geometry"/>
+                </mxCell>
+                <mxCell id="a5" value="HandlebarsJS (ruby)" style="whiteSpace=wrap;html=1;rounded=0;fillColor=#d5e8d4;strokeColor=#82b366;fontColor=#333333" parent="node_root_eju" vertex="1">
+                    <mxGeometry x="468" y="68" width="160" height="160" as="geometry"/>
+                </mxCell>
+                <mxCell id="a6" value="Mini Racer" style="whiteSpace=wrap;html=1;rounded=0;fillColor=#d5e8d4;strokeColor=#82b366;fontColor=#333333" parent="node_root_eju" vertex="1">
+                    <mxGeometry x="686" y="68" width="160" height="160" as="geometry"/>
+                </mxCell>
+                <mxCell id="a7" value="Node V8 engine" style="whiteSpace=wrap;html=1;rounded=0;fillColor=#1ba1e2;strokeColor=#006EAF;fontColor=#ffffff" parent="node_root_eju" vertex="1">
+                    <mxGeometry x="936" y="177" width="160" height="160" as="geometry"/>
+                </mxCell>
+                <mxCell id="a8" value="&lt;span&gt;Handlebars.js (javascript)&lt;/span&gt;" style="whiteSpace=wrap;html=1;rounded=0;fillColor=#ffe6cc;strokeColor=#d79b00;fontColor=#333333" parent="node_root_eju" vertex="1">
+                    <mxGeometry x="936" y="393" width="160" height="160" as="geometry"/>
+                </mxCell>
+                <mxCell id="eju-12" value="" style="edgeStyle=orthogonalEdgeStyle;curved=1;exitX=1;exitY=0.5;exitDx=0;exitDy=0;entryX=0;entryY=0.5;entryDx=0;entryDy=0;startArrow=none;startFill=1;endArrow=open;endFill=1;whiteSpace=wrap;html=1;rounded=0;fillColor=#ffe6cc;strokeColor=#d79b00" parent="node_root_eju" source="a2" target="a3" edge="1">
+                    <mxGeometry relative="1" as="geometry"/>
+                </mxCell>
+                <mxCell id="eju-13" value="" style="edgeStyle=orthogonalEdgeStyle;curved=1;exitX=1;exitY=0.5;exitDx=0;exitDy=0;entryX=0;entryY=0.5;entryDx=0;entryDy=0;startArrow=none;startFill=1;endArrow=open;endFill=1;whiteSpace=wrap;html=1;rounded=0;fillColor=#ffe6cc;strokeColor=#d79b00" parent="node_root_eju" source="a3" target="a4" edge="1">
+                    <mxGeometry relative="1" as="geometry"/>
+                </mxCell>
+                <mxCell id="eju-14" value="" style="edgeStyle=orthogonalEdgeStyle;curved=1;exitX=1;exitY=0.5;exitDx=0;exitDy=0;entryX=0;entryY=0.5;entryDx=0;entryDy=0;startArrow=none;startFill=1;endArrow=open;endFill=1;whiteSpace=wrap;html=1;rounded=0;fillColor=#ffe6cc;strokeColor=#d79b00" parent="node_root_eju" source="a2" target="a5" edge="1">
+                    <mxGeometry relative="1" as="geometry"/>
+                </mxCell>
+                <mxCell id="eju-15" value="" style="edgeStyle=orthogonalEdgeStyle;curved=1;exitX=1;exitY=0.5;exitDx=0;exitDy=0;entryX=0;entryY=0.5;entryDx=0;entryDy=0;startArrow=none;startFill=1;endArrow=open;endFill=1;whiteSpace=wrap;html=1;rounded=0;fillColor=#ffe6cc;strokeColor=#d79b00" parent="node_root_eju" source="a5" target="a6" edge="1">
+                    <mxGeometry relative="1" as="geometry"/>
+                </mxCell>
+                <mxCell id="eju-16" value="" style="edgeStyle=orthogonalEdgeStyle;curved=1;exitX=1;exitY=0.5;exitDx=0;exitDy=0;entryX=0;entryY=0.5;entryDx=0;entryDy=0;startArrow=none;startFill=1;endArrow=open;endFill=1;whiteSpace=wrap;html=1;rounded=0;fillColor=#ffe6cc;strokeColor=#d79b00" parent="node_root_eju" source="a4" target="a7" edge="1">
+                    <mxGeometry relative="1" as="geometry"/>
+                </mxCell>
+                <mxCell id="eju-17" value="" style="edgeStyle=orthogonalEdgeStyle;curved=1;exitX=1;exitY=0.5;exitDx=0;exitDy=0;entryX=0;entryY=0.5;entryDx=0;entryDy=0;startArrow=none;startFill=1;endArrow=open;endFill=1;whiteSpace=wrap;html=1;rounded=0;fillColor=#ffe6cc;strokeColor=#d79b00" parent="node_root_eju" source="a6" target="a7" edge="1">
+                    <mxGeometry relative="1" as="geometry"/>
+                </mxCell>
+                <mxCell id="eju-18" value="" style="edgeStyle=orthogonalEdgeStyle;curved=1;exitX=0.5;exitY=1;exitDx=0;exitDy=0;startArrow=none;startFill=1;endArrow=open;endFill=1;whiteSpace=wrap;html=1;rounded=0;fillColor=#ffe6cc;strokeColor=#d79b00" parent="node_root_eju" source="a7" target="a8" edge="1">
+                    <mxGeometry relative="1" as="geometry"/>
+                </mxCell>
+                <mxCell id="eju-19" value="" style="edgeStyle=orthogonalEdgeStyle;curved=1;exitX=0.5;exitY=0;exitDx=0;exitDy=0;entryX=0;entryY=0.5;entryDx=0;entryDy=0;startArrow=none;startFill=1;endArrow=open;endFill=1;whiteSpace=wrap;html=1;rounded=0;fillColor=#ffe6cc;strokeColor=#d79b00" parent="node_root_eju" source="a1" target="a2" edge="1">
+                    <mxGeometry relative="1" as="geometry"/>
+                </mxCell>
+            </root>
+        </mxGraphModel>
+    </diagram>
+</mxfile>

data/lib/handlebarsjs/api.rb

@@ -0,0 +1,7 @@
+# frozen_string_literal: true
+
+# module Handlebarsjs
+#   class Handlebars
+
+#   end
+# end

data/lib/handlebarsjs/handlebars.rb

@@ -0,0 +1,20 @@
+# frozen_string_literal: true
+
+module Handlebarsjs
+  # API for interacting with Handlebars.js while providing native Ruby helpers
+  class Handlebars < Handlebarsjs::Javascript
+    def initialize
+      super
+      # Handlebars 4.7.7
+      handlebars_snapshot.add_library('handlebars', path: Handlebarsjs::HANDLEBARS_LIBRARY_PATH)
+
+      # Support functions for working with
+      handlebars_snapshot.add_library('handlebars-api', path: Handlebarsjs::HANDLEBARS_API_PATH)
+    end
+
+    def process_template(template, options = {})
+      # TODO: process template function may be improved with some type of caching
+      context.call('process_template', template, options)
+    end
+  end
+end

data/lib/handlebarsjs/handlebars_snapshot.rb

@@ -0,0 +1,72 @@
+# frozen_string_literal: true
+
+module Handlebarsjs
+  # Wraps MiniRacer snapshot with specific emphasis on
+  # loading Handlebars helpers onto the MiniRacer context
+  # in the correct order. So that new contexts are preloaded
+  # with the handlebars library and the configured helpers.
+  class HandlebarsSnapshot
+    attr_reader :scripts
+    attr_reader :helpers
+
+    def initialize
+      @scripts = []
+      @helpers = []
+    end
+
+    def add_library(name, script: nil, path: nil)
+      add_script(name, 'library', script: script, path: path)
+    end
+
+    def add_snippet(name, script: nil, path: nil)
+      add_script(name, 'snippet', script: script, path: path)
+    end
+
+    def add_helper(name, callback)
+      @helpers << {
+        name: name,
+        callback: callback
+      }
+    end
+
+    def register_helper(name)
+      add_script(name, 'helper', script: "Handlebars.registerHelper('#{name}', ruby_#{name})")
+    end
+
+    def script
+      scripts.map { |script| "// #{script[:type]} - #{script[:name]}\n#{script[:script]}" }.join("\n\n")
+    end
+
+    def snapshot
+      @snapshot ||= MiniRacer::Snapshot.new(script)
+    end
+
+    def dirty?
+      @snapshot.nil?
+    end
+
+    def debug
+      puts script
+    end
+
+    private
+
+    def add_script(name, type, script: nil, path: nil)
+      raise Handlebarsjs::Error, 'script or path is required' if script.nil? && path.nil?
+      raise Handlebarsjs::Error, 'script and path are mutually exclusive' if script && path
+
+      script ||= File.read(path)
+      add_script_item(name, type, script, path)
+    end
+
+    def add_script_item(name, type, script, path = nil)
+      @snapshot = nil
+      scripts << {
+        name: name,
+        type: type,
+        script: script,
+        path: path
+      }
+    end
+  end
+end

data/lib/handlebarsjs/helpers/comparison/and.rb

@@ -0,0 +1,45 @@
+# frozen_string_literal: true
+
+# reference: https://github.com/rails/rails/blob/master/activesupport/lib/active_support/inflector/methods.rb
+# require 'active_support/core_ext/string'
+
+# require 'handlebars/helpers/base_helper'
+
+module Handlebarsjs
+  module Helpers
+    # Comparison helpers, eg. or, and, equal, not equal, less than, greater than etc.
+    module Comparison
+      # And: Block helper that renders a block if **all of** the given values are truthy. If an inverse block is specified it will be rendered when falsy.
+      # < Handlebars::Helpers::BaseHelper
+      class And
+        # Parse will And: Block helper that renders a block if **all of** the given values are truthy. If an inverse block is specified it will be rendered when falsy.
+        #
+        # @example
+        #
+        # {{#if (and p1 p2 p3 p4 p5)}}
+        #   found
+        # {{/if}}
+        #
+        # @example
+        #
+        # @example
+        # {{#if (and name age)}}
+        #   {{name}}-{{age}}
+        # {{else}}
+        #   no name or age
+        # {{/if}}
+        #
+        # @param values list of values (via *splat) to be checked via AND condition
+        # @return [String] return block when every value is truthy
+        def parse(values)
+          values.all? { |value| value }
+        end
+
+        def handlebars_helper
+          # Exclude last paramater which is the context V8::Object
+          proc { |_context, *values| wrapper(parse(values[0..-2])) }
+        end
+      end
+    end
+  end
+end