cxmeel/README.md

## README.md

      
    Raw
  

              README.md
            
          
    Setup

import StringTemplater from "path/to/StringTemplater.module.js";

const stringsToMap = {
  "year": new Date().getFullYear()
};

const stringTemplater = new StringTemplater(stringsToMap);
stringTemplater.apply();
<body>
  <span :str>&copy;{{year}} - ClockworkSquirrel</span>
</body>

Produces the following output:
©2020 - ClockworkSquirrel


## StringTemplater.module.js
export default class {
    constructor(strings = {}, match = "*[\\:str]") {
        this.strings = strings;
        this.match = match;
    }

    apply = () => {
        const templaterElements = document.querySelectorAll(this.match);

        Array.from(templaterElements).forEach(element => {
            Object.entries(this.strings).forEach(([key, value]) => {
                element.outerHTML = element.outerHTML.replace(`{{${key}}}`, value);
            });
        });
    }
}
	export default class {
	constructor(strings = {}, match = "*[\\:str]") {
	this.strings = strings;
	this.match = match;
	}

	apply = () => {
	const templaterElements = document.querySelectorAll(this.match);

	Array.from(templaterElements).forEach(element => {
	Object.entries(this.strings).forEach(([key, value]) => {
	element.outerHTML = element.outerHTML.replace(`{{${key}}}`, value);
	});
	});
	}
	}