diff options
| author | carson <carson@leaddyno.com> | 2022-02-16 14:02:38 -0700 |
|---|---|---|
| committer | carson <carson@leaddyno.com> | 2022-02-16 14:02:38 -0700 |
| commit | b3751e1ff2617301d2c2319f4d70ee6334988531 (patch) | |
| tree | b0fe686f8af6edb9a12ab1e2dd8933b886e4e5d1 | |
| parent | 23008dc1ed729cb445c3ce3a8e4463a3eb60f120 (diff) | |
| download | htmx-b3751e1ff2617301d2c2319f4d70ee6334988531.tar.gz htmx-b3751e1ff2617301d2c2319f4d70ee6334988531.zip | |
demo stuff
| -rw-r--r-- | www/demo/_redirects | 1 | ||||
| -rw-r--r-- | www/demo/demo.js (renamed from www/js/demo-helper.js) | 39 | ||||
| -rw-r--r-- | www/demo/demo.md (renamed from www/demo.md) | 4 | ||||
| -rw-r--r-- | www/demo/scratch.html | 17 |
4 files changed, 42 insertions, 19 deletions
diff --git a/www/demo/_redirects b/www/demo/_redirects new file mode 100644 index 00000000..86931294 --- /dev/null +++ b/www/demo/_redirects @@ -0,0 +1 @@ +/ /demo.js
\ No newline at end of file diff --git a/www/js/demo-helper.js b/www/demo/demo.js index b2a3af00..31eb8009 100644 --- a/www/js/demo-helper.js +++ b/www/demo/demo.js @@ -4,24 +4,28 @@ function addScript(url) { document.head.appendChild(myScript); } -function interpolate(str) { +function interpolate(str, params) { var returnStr = ""; - var charArray = Array.from(str); - while (charArray.length > 0) { - var current = charArray.shift(); - if (current === "$" && charArray[0] === "{") { - var evalStr = "(function() { return " - charArray.shift(); - while (charArray.length > 0 && charArray[0] !== "}") { - evalStr += charArray.shift() + try { + var charArray = Array.from(str); + while (charArray.length > 0) { + var current = charArray.shift(); + if (current === "$" && charArray[0] === "{") { + var evalStr = "(function(env) { with(env) { return " + charArray.shift(); + while (charArray.length > 0 && charArray[0] !== "}") { + evalStr += charArray.shift() + } + charArray.shift(); + evalStr += " } })"; + // console.log("Evaling", evalStr); + returnStr += eval(evalStr)(params); + } else { + returnStr += current; } - charArray.shift(); - evalStr += " })()"; - // console.log("Evaling", evalStr); - returnStr += eval(evalStr); - } else { - returnStr += current; } + } catch (e) { + returnStr = e.message; } return returnStr; } @@ -38,8 +42,9 @@ function initMockRequests() { if(elt.getAttribute("url")){ MockRequests.setDynamicMockUrlResponse(elt.getAttribute("url"), {dynamicResponseModFn: - function(request, response) { - return interpolate(elt.innerHTML); + function(request, response, parameters) { + console.log(request, response, parameters) + return interpolate(elt.innerHTML, parameters); }, usePathnameForAllQueries: true}); } diff --git a/www/demo.md b/www/demo/demo.md index 89cb5219..be32406e 100644 --- a/www/demo.md +++ b/www/demo/demo.md @@ -19,7 +19,7 @@ Additionally, you can add mock responses by simply adding `template` tags with t Copy this to your demo site: ```html - <script src="https://htmx.org/js/demo-helper.js"></script> + <script src="https://htmx.org/js/demo.js"></script> ``` ## Example @@ -27,7 +27,7 @@ Copy this to your demo site: This is an example of the code in action: ```html -<script src="https://htmx.org/js/demo-helper.js"></script> +<script src="https://htmx.org/js/demo.js"></script> <!-- post to /foo --> <button hx-post="/foo" hx-target="#result">Count Up</button> <output id="result"></output> <!-- respond to /foo --> diff --git a/www/demo/scratch.html b/www/demo/scratch.html new file mode 100644 index 00000000..e93e5ad5 --- /dev/null +++ b/www/demo/scratch.html @@ -0,0 +1,17 @@ +<html> +<head> + <script src="demo.js"></script> +</head> +<body> +<!-- post to /foo --> +<button hx-get="/foo?bar=10" hx-target="#result">Count Up</button> <output id="result"></output> +<!-- respond to /foo --> +<script> + globalInt = 0; +</script> +<template url="/foo"> + ${bar + 5} +</template> + +</body> +</html>
\ No newline at end of file |