@wowter/templater
Version:
templater demo: primitive simple html/css templating with javascript only
55 lines (45 loc) • 1.95 kB
HTML
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="description" content="Demo simple templating">
<meta name="keywords" content="javascript 2015, EC 6, modules">
<meta name="author" content="wowter from napnop.net">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Templater demo</title>
<script >
if(typeof console == "undefined" || typeof console.log !== "function"){
// prevent errors when console.log() does not exist.
let console= {};
console.log = function(){}
}
</script>
</head>
<body>
Simple templater demo
<div data-variables='{
"mainCase": "Whoopsie Daisies.",
"subCase": "Rimbo De Rukker.",
"subSubCase": "Down the great Belows.",
"bgcolor": "burlywood"
}'></div>
<style data-include="./templates/main.tmpl.css"></style>
<div data-include="./templates/top.tmpl.html">place holder text1</div>
<div data-include="./templates/bottom.tmpl.html">place holder text2 </div>
<script type="module">
//ignored if browser does not understand 'type="module"'
import { Templater as Templater } from './assets/javascript/modules/src/templater.js';
// import { Templater as Templater } from 'https://unpkg.com/@wowter/templater@1.2.1/assets/javascript/modules/src/templater.js';
const templaterInstance = new Templater();
</script>
<!--see https://jakearchibald.com/2017/es-modules-in-browsers/-->
<!--browsers that understand type="module", ignore script tags that have the nomodule attribute-->
<script nomodule>
var messageToBadBrowserUsers = "Your browser does not support javascript initiated as \"type=module\".\n" +
"Important functionality of this site is disabled for that reason.\n" +
"Please contact your browser provider.";
alert(messageToBadBrowserUsers);
console.log(messageToBadBrowserUsers);
</script>
</body>
</html>