squirrelly/index.html at master · archu5/squirrelly · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
<!DOCTYPE html>
<html>

<head>
    <script src="./dist/squirrelly.dev.js"></script>
</head>

<body>
    <pre id="result1"></pre>
    <p>--------------------</p>
    <div id="functionResult"></div>
<textarea oninput="comp()" id="input" style="width: 200px; height: 200px;">
Hi
{{log("Hope you like Squirrelly!")/}}
{{htmlstuff}}
{{foreach(options.obj)}}
Reversed value: {{@this|reverse}}, Key: {{@key}}
{{if(@key==="thirdchild")}}
{{each(options.obj[@key])}}
Salutations. Index: {{@index}}
Old key: {{@../key}}
{{/each}}
{{/if}}
{{/foreach}}

{{customhelper()}}
{{#cabbage}}
Cabbages taste good
{{#pineapple}}
As do pineapples
{{/customhelper}}

This is a partial: {{include("mypartial")/}}
{{tags(--,--)/}}
Custom delimeters!
--arr--
</textarea>
    <div id="output"></div>
    <script>
        Sqrl.defineFilter("reverse", function (str) {
            var out = ''
            for (var i = str.length - 1; i >= 0; i--) {
                out += String(str).charAt(i)
            }
            return out || str
        })

        Sqrl.defineHelper("customhelper", function(args, content, blocks, options) {
            var returnStr = ''
            for (var key in blocks) {
                if (typeof blocks[key] === 'function') {
                    returnStr += "Block found named " + key + ", with value: " + blocks[key]()
                }
            }
            return returnStr
        })

        Sqrl.definePartial("mypartial", "Partial content: the value of arr is {{arr}}")

        function escape (str) {
            var escMap = {
            "&": "&amp;",
            "<": "&lt;",
            ">": "&gt;",
            '"': "&quot;",
            "'": "&#39;",
            "/": "&#x2F;"
            }
            function replaceChar(s) {
                return escMap[s]
            }
            var newStr = String(str)
            if (/[&<>"'\/]/.test(newStr)) {
                return newStr.replace(/[&<>"'\/]/g, replaceChar)
            } else {
                return newStr
            }
       }

        Sqrl.autoEscaping(true)


        function comp() {
            console.clear() //For development
            let newtemplatefunction = Sqrl.Compile(document.getElementById("input").value)

            console.log("Function returned by comp: ")
            console.log(newtemplatefunction.toString())
            let result = newtemplatefunction({
                htmlstuff: "<script>alert('hey')<\/script><p>alert('hey')</p><p>alert('hey')</p><p>alert('hey')</p>",
                arr: ["Hey", "<p>Malicious XSS</p>", "Hey", 3, 3*4],
                obj: {
                    firstchild: "HI",
                    secondchild: "HEY",
                    thirdchild: [3, 6, 3, 2, 5, 4]
                }
            }, Sqrl)
            console.log("result: " + result)
            document.getElementById("result1").innerHTML = result
            document.getElementById("functionResult").innerHTML = escape(newtemplatefunction)

        }
        comp()
    </script>
</body>

</html>