Something went wrong on our end
Select Git revision
tutorial-form-example.html
-
Volker Schukai authoredVolker Schukai authored
tutorial-dom-based-templating-implementation.html 95.46 KiB
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<!-- Adding favicon -->
<!-- Adding meta -->
<meta name="author" content="schukai GmbH" />
<meta name="description" content="javascript library for optimal use on fast and flexible pages." />
<!-- Adding external script-->
<script src="https://code.jquery.com/jquery-3.5.1.js" integrity="sha256-QWo7LDvxbWT2tbbQ97B53yJnYU3WhH/C8ycbRAkjPDc=" crossorigin="anonymous" ></script>
<script src="https://monsterjs.org/js/doc/monster-versions.js" crossorigin="anonymous" ></script>
<!-- Adding external style-->
<link href="https://monsterjs.org/assets/prettify.css" crossorigin="anonymous" rel="stylesheet" />
<!-- Adding scripts-->
<!-- Adding style-->
<!-- Adding overlay script-->
<script src="https://cdnjs.cloudflare.com/ajax/libs/overlayscrollbars/1.13.0/js/OverlayScrollbars.min.js"
integrity="sha512-5R3ngaUdvyhXkQkIqTf/k+Noq3phjmrqlUQyQYbgfI34Mzcx7vLIIYTy/K1VMHkL33T709kfh5y6R9Xy/Cbt7Q=="
crossorigin="anonymous"></script>
<!-- Adding overlay style-->
<title>
Tutorial: DOM-based templating implementation
</title>
<!--[if lt IE 9]>
<script src="//html5shiv.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
<link type="text/css" rel="stylesheet" href="styles/third-party/ionicons.min.css">
<link type="text/css" rel="stylesheet" href="styles/third-party/prettify-tomorrow.css">
<link type="text/css" rel="stylesheet" href="styles/reset.css">
<link type="text/css" rel="stylesheet" href="styles/clean-jsdoc-theme-base.css">
<link type="text/css" rel="stylesheet" href="styles/clean-jsdoc-theme-light.css">
<svg aria-hidden="true" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"
style="display:none">
<defs>
<symbol id="copy-icon" viewbox="0 0 488.3 488.3">
<g> <path
d="M314.25,85.4h-227c-21.3,0-38.6,17.3-38.6,38.6v325.7c0,21.3,17.3,38.6,38.6,38.6h227c21.3,0,38.6-17.3,38.6-38.6V124 C352.75,102.7,335.45,85.4,314.25,85.4z M325.75,449.6c0,6.4-5.2,11.6-11.6,11.6h-227c-6.4,0-11.6-5.2-11.6-11.6V124 c0-6.4,5.2-11.6,11.6-11.6h227c6.4,0,11.6,5.2,11.6,11.6V449.6z" />
<path
d="M401.05,0h-227c-21.3,0-38.6,17.3-38.6,38.6c0,7.5,6,13.5,13.5,13.5s13.5-6,13.5-13.5c0-6.4,5.2-11.6,11.6-11.6h227 c6.4,0,11.6,5.2,11.6,11.6v325.7c0,6.4-5.2,11.6-11.6,11.6c-7.5,0-13.5,6-13.5,13.5s6,13.5,13.5,13.5c21.3,0,38.6-17.3,38.6-38.6 V38.6C439.65,17.3,422.35,0,401.05,0z" />
</g>
</symbol>
<symbol id='search-icon' viewBox="0 0 512 512">
<g>
<g>
<path
d="M225.474,0C101.151,0,0,101.151,0,225.474c0,124.33,101.151,225.474,225.474,225.474 c124.33,0,225.474-101.144,225.474-225.474C450.948,101.151,349.804,0,225.474,0z M225.474,409.323 c-101.373,0-183.848-82.475-183.848-183.848S124.101,41.626,225.474,41.626s183.848,82.475,183.848,183.848 S326.847,409.323,225.474,409.323z" />
</g>
</g>
<g>
<g>
<path
d="M505.902,476.472L386.574,357.144c-8.131-8.131-21.299-8.131-29.43,0c-8.131,8.124-8.131,21.306,0,29.43l119.328,119.328 c4.065,4.065,9.387,6.098,14.715,6.098c5.321,0,10.649-2.033,14.715-6.098C514.033,497.778,514.033,484.596,505.902,476.472z" />
</g>
</g>
</symbol>
<symbol id="down-icon" viewBox="0 0 16 16">
<path
fill-rule="evenodd"
clip-rule="evenodd"
d="M12.7803 6.21967C13.0732 6.51256 13.0732 6.98744 12.7803 7.28033L8.53033 11.5303C8.23744 11.8232 7.76256 11.8232 7.46967 11.5303L3.21967 7.28033C2.92678 6.98744 2.92678 6.51256 3.21967 6.21967C3.51256 5.92678 3.98744 5.92678 4.28033 6.21967L8 9.93934L11.7197 6.21967C12.0126 5.92678 12.4874 5.92678 12.7803 6.21967Z"
>
</path>
</symbol>
</defs>
</svg>
</head>
<body>
<nav class="navbar" id="navbar">
<div class="navbar-heading" id="navbar-heading"><a href="index.html"><h2 class="navbar-heading-text">Monster</h2></a></div><div class="search-box" id="search-box"><div class="search-box-input-container"><input class="search-box-input" type="text" placeholder="Search..." id="search-box-input" /><svg class="search-icon" alt="search-icon"><use xlink:href="#search-icon"></use></svg></div><div class="search-item-container" id="search-item-container"><ul class="search-item-ul" id="search-item-ul"></ul></div></div><div class="sidebar-main-content" id="sidebar-main-content"><div class="accordion collapsed" id="8990258" > <h3 class="accordion-heading">Tutorials<svg><use xlink:href="#down-icon"></use></svg></h3><ul class="accordion-content"><li class="accordion-list" id=""><a href="tutorial-01-getting-started.html">Getting Started</a></li><li class="accordion-list" id=""><a href="tutorial-02-what-is-monster.html">What is Monster?</a></li><li class="accordion-list" id=""><a href="tutorial-03-dom.html">DOM</a></li><li class="accordion-list" id=""><a href="tutorial-09-browser-compatibility.html">Browser compatibility</a></li></ul> </div><div class="accordion collapsed" id="1572199" > <h3 class="accordion-heading">Classes<svg><use xlink:href="#down-icon"></use></svg></h3><ul class="accordion-content"><li class="accordion collapsed child" id=515447><div class="accordion-heading child"><a href="Monster.Constraints.AbstractConstraint.html">AbstractConstraint</a><svg><use xlink:href="#down-icon"></use></svg></div><ul class='methods accordion-content'><li data-type='method'><a href="Monster.Constraints.AbstractConstraint.html#isValid">isValid</a></li></ul></li><li class="accordion-list" id=""><a href="Monster.Constraints.AbstractOperator.html">AbstractOperator</a></li><li class="accordion collapsed child" id=6159217><div class="accordion-heading child"><a href="Monster.Constraints.AndOperator.html">AndOperator</a><svg><use xlink:href="#down-icon"></use></svg></div><ul class='methods accordion-content'><li data-type='method'><a href="Monster.Constraints.AndOperator.html#isValid">isValid</a></li></ul></li><li class="accordion collapsed child" id=3486275><div class="accordion-heading child"><a href="Monster.Constraints.Invalid.html">Invalid</a><svg><use xlink:href="#down-icon"></use></svg></div><ul class='methods accordion-content'><li data-type='method'><a href="Monster.Constraints.Invalid.html#isValid">isValid</a></li></ul></li><li class="accordion collapsed child" id=7336750><div class="accordion-heading child"><a href="Monster.Constraints.IsArray.html">IsArray</a><svg><use xlink:href="#down-icon"></use></svg></div><ul class='methods accordion-content'><li data-type='method'><a href="Monster.Constraints.IsArray.html#isValid">isValid</a></li></ul></li><li class="accordion collapsed child" id=4626577><div class="accordion-heading child"><a href="Monster.Constraints.IsObject.html">IsObject</a><svg><use xlink:href="#down-icon"></use></svg></div><ul class='methods accordion-content'><li data-type='method'><a href="Monster.Constraints.IsObject.html#isValid">isValid</a></li></ul></li><li class="accordion collapsed child" id=5955510><div class="accordion-heading child"><a href="Monster.Constraints.OrOperator.html">OrOperator</a><svg><use xlink:href="#down-icon"></use></svg></div><ul class='methods accordion-content'><li data-type='method'><a href="Monster.Constraints.OrOperator.html#isValid">isValid</a></li></ul></li><li class="accordion collapsed child" id=6122524><div class="accordion-heading child"><a href="Monster.Constraints.Valid.html">Valid</a><svg><use xlink:href="#down-icon"></use></svg></div><ul class='methods accordion-content'><li data-type='method'><a href="Monster.Constraints.Valid.html#isValid">isValid</a></li></ul></li><li class="accordion collapsed child" id=2587038><div class="accordion-heading child"><a href="Monster.Data.Datasource.html">Datasource</a><svg><use xlink:href="#down-icon"></use></svg></div><ul class='methods accordion-content'><li data-type='method'><a href="Monster.Data.Datasource.html#attachObserver">attachObserver</a></li><li data-type='method'><a href="Monster.Data.Datasource.html#containsObserver">containsObserver</a></li><li data-type='method'><a href="Monster.Data.Datasource.html#detachObserver">detachObserver</a></li><li data-type='method'><a href="Monster.Data.Datasource.html#get">get</a></li><li data-type='method'><a href="Monster.Data.Datasource.html#getOption">getOption</a></li><li data-type='method'><a href="Monster.Data.Datasource.html#read">read</a></li><li data-type='method'><a href="Monster.Data.Datasource.html#set">set</a></li><li data-type='method'><a href="Monster.Data.Datasource.html#setOption">setOption</a></li><li data-type='method'><a href="Monster.Data.Datasource.html#setOptions">setOptions</a></li><li data-type='method'><a href="Monster.Data.Datasource.html#write">write</a></li></ul></li><li class="accordion collapsed child" id=8754076><div class="accordion-heading child"><a href="Monster.Data.Datasource.RestAPI.html">RestAPI</a><svg><use xlink:href="#down-icon"></use></svg></div><ul class='methods accordion-content'><li data-type='method'><a href="Monster.Data.Datasource.RestAPI.html#getClone">getClone</a></li><li data-type='method'><a href="Monster.Data.Datasource.RestAPI.html#read">read</a></li><li data-type='method'><a href="Monster.Data.Datasource.RestAPI.html#write">write</a></li></ul></li><li class="accordion collapsed child" id=8480376><div class="accordion-heading child"><a href="Monster.Data.Datasource.RestAPI.WriteError.html">WriteError</a><svg><use xlink:href="#down-icon"></use></svg></div><ul class='methods accordion-content'><li data-type='method'><a href="Monster.Data.Datasource.RestAPI.WriteError.html#getResponse">getResponse</a></li><li data-type='method'><a href="Monster.Data.Datasource.RestAPI.WriteError.html#getValidation">getValidation</a></li></ul></li><li class="accordion collapsed child" id=4712995><div class="accordion-heading child"><a href="Monster.Data.Datasource.Storage.html">Storage</a><svg><use xlink:href="#down-icon"></use></svg></div><ul class='methods accordion-content'><li data-type='method'><a href="Monster.Data.Datasource.Storage.html#getClone">getClone</a></li><li data-type='method'><a href="Monster.Data.Datasource.Storage.html#read">read</a></li><li data-type='method'><a href="Monster.Data.Datasource.Storage.html#write">write</a></li></ul></li><li class="accordion collapsed child" id=7609981><div class="accordion-heading child"><a href="Monster.Data.Datasource.Storage.LocalStorage.html">LocalStorage</a><svg><use xlink:href="#down-icon"></use></svg></div><ul class='methods accordion-content'><li data-type='method'><a href="Monster.Data.Datasource.Storage.LocalStorage.html#getClone">getClone</a></li></ul></li><li class="accordion collapsed child" id=7931439><div class="accordion-heading child"><a href="Monster.Data.Datasource.Storage.SessionStorage.html">SessionStorage</a><svg><use xlink:href="#down-icon"></use></svg></div><ul class='methods accordion-content'><li data-type='method'><a href="Monster.Data.Datasource.Storage.SessionStorage.html#getClone">getClone</a></li></ul></li><li class="accordion collapsed child" id=3216839><div class="accordion-heading child"><a href="Monster.Data.Pathfinder.html">Pathfinder</a><svg><use xlink:href="#down-icon"></use></svg></div><ul class='methods accordion-content'><li data-type='method'><a href="Monster.Data.Pathfinder.html#deleteVia">deleteVia</a></li><li data-type='method'><a href="Monster.Data.Pathfinder.html#exists">exists</a></li><li data-type='method'><a href="Monster.Data.Pathfinder.html#getVia">getVia</a></li><li data-type='method'><a href="Monster.Data.Pathfinder.html#setVia">setVia</a></li><li data-type='method'><a href="Monster.Data.Pathfinder.html#setWildCard">setWildCard</a></li></ul></li><li class="accordion collapsed child" id=868224><div class="accordion-heading child"><a href="Monster.Data.Pipe.html">Pipe</a><svg><use xlink:href="#down-icon"></use></svg></div><ul class='methods accordion-content'><li data-type='method'><a href="Monster.Data.Pipe.html#run">run</a></li><li data-type='method'><a href="Monster.Data.Pipe.html#setCallback">setCallback</a></li></ul></li><li class="accordion collapsed child" id=1819394><div class="accordion-heading child"><a href="Monster.Data.Transformer.html">Transformer</a><svg><use xlink:href="#down-icon"></use></svg></div><ul class='methods accordion-content'><li data-type='method'><a href="Monster.Data.Transformer.html#run">run</a></li><li data-type='method'><a href="Monster.Data.Transformer.html#setCallback">setCallback</a></li></ul></li><li class="accordion collapsed child" id=3334866><div class="accordion-heading child"><a href="Monster.DOM.Assembler.html">Assembler</a><svg><use xlink:href="#down-icon"></use></svg></div><ul class='methods accordion-content'><li data-type='method'><a href="Monster.DOM.Assembler.html#createDocumentFragment">createDocumentFragment</a></li><li data-type='method'><a href="Monster.DOM.Assembler.html#getAttributePrefix">getAttributePrefix</a></li><li data-type='method'><a href="Monster.DOM.Assembler.html#setAttributePrefix">setAttributePrefix</a></li></ul></li><li class="accordion collapsed child" id=1751501><div class="accordion-heading child"><a href="Monster.DOM.CustomControl.html">CustomControl</a><svg><use xlink:href="#down-icon"></use></svg></div><ul class='methods accordion-content'><li data-type='method'><a href="Monster.DOM.CustomControl.html#checkValidity">checkValidity</a></li><li data-type='method'><a href="Monster.DOM.CustomControl.html#reportValidity">reportValidity</a></li><li data-type='method'><a href="Monster.DOM.CustomControl.html#setFormValue">setFormValue</a></li><li data-type='method'><a href="Monster.DOM.CustomControl.html#setValidity">setValidity</a></li></ul></li><li class="accordion collapsed child" id=1333995><div class="accordion-heading child"><a href="Monster.DOM.CustomElement.html">CustomElement</a><svg><use xlink:href="#down-icon"></use></svg></div><ul class='methods accordion-content'><li data-type='method'><a href="Monster.DOM.CustomElement.html#.getCSSStyleSheet">getCSSStyleSheet</a></li><li data-type='method'><a href="Monster.DOM.CustomElement.html#.getTag">getTag</a></li><li data-type='method'><a href="Monster.DOM.CustomElement.html#adoptedCallback">adoptedCallback</a></li><li data-type='method'><a href="Monster.DOM.CustomElement.html#assembleMethodSymbol">assembleMethodSymbol</a></li><li data-type='method'><a href="Monster.DOM.CustomElement.html#attachObserver">attachObserver</a></li><li data-type='method'><a href="Monster.DOM.CustomElement.html#attributeChangedCallback">attributeChangedCallback</a></li><li data-type='method'><a href="Monster.DOM.CustomElement.html#connectedCallback">connectedCallback</a></li><li data-type='method'><a href="Monster.DOM.CustomElement.html#containsObserver">containsObserver</a></li><li data-type='method'><a href="Monster.DOM.CustomElement.html#detachObserver">detachObserver</a></li><li data-type='method'><a href="Monster.DOM.CustomElement.html#disconnectedCallback">disconnectedCallback</a></li><li data-type='method'><a href="Monster.DOM.CustomElement.html#getOption">getOption</a></li><li data-type='method'><a href="Monster.DOM.CustomElement.html#hasNode">hasNode</a></li><li data-type='method'><a href="Monster.DOM.CustomElement.html#initMethodSymbol">initMethodSymbol</a></li><li data-type='method'><a href="Monster.DOM.CustomElement.html#setOption">setOption</a></li><li data-type='method'><a href="Monster.DOM.CustomElement.html#setOptions">setOptions</a></li></ul></li><li class="accordion collapsed child" id=6859991><div class="accordion-heading child"><a href="Monster.DOM.FocusManager.html">FocusManager</a><svg><use xlink:href="#down-icon"></use></svg></div><ul class='methods accordion-content'><li data-type='method'><a href="Monster.DOM.FocusManager.html#focus">focus</a></li><li data-type='method'><a href="Monster.DOM.FocusManager.html#focusNext">focusNext</a></li><li data-type='method'><a href="Monster.DOM.FocusManager.html#focusPrev">focusPrev</a></li><li data-type='method'><a href="Monster.DOM.FocusManager.html#getActive">getActive</a></li><li data-type='method'><a href="Monster.DOM.FocusManager.html#getFocusable">getFocusable</a></li><li data-type='method'><a href="Monster.DOM.FocusManager.html#restoreFocus">restoreFocus</a></li><li data-type='method'><a href="Monster.DOM.FocusManager.html#storeFocus">storeFocus</a></li></ul></li><li class="accordion collapsed child" id=3703242><div class="accordion-heading child"><a href="Monster.DOM.Resource.html">Resource</a><svg><use xlink:href="#down-icon"></use></svg></div><ul class='methods accordion-content'><li data-type='method'><a href="Monster.DOM.Resource.html#.getURLAttribute">getURLAttribute</a></li><li data-type='method'><a href="Monster.DOM.Resource.html#available">available</a></li><li data-type='method'><a href="Monster.DOM.Resource.html#connect">connect</a></li><li data-type='method'><a href="Monster.DOM.Resource.html#create">create</a></li><li data-type='method'><a href="Monster.DOM.Resource.html#isConnected">isConnected</a></li></ul></li><li class="accordion collapsed child" id=9606987><div class="accordion-heading child"><a href="Monster.DOM.Resource.Data.html">Data</a><svg><use xlink:href="#down-icon"></use></svg></div><ul class='methods accordion-content'><li data-type='method'><a href="Monster.DOM.Resource.Data.html#.getURLAttribute">getURLAttribute</a></li><li data-type='method'><a href="Monster.DOM.Resource.Data.html#connect">connect</a></li><li data-type='method'><a href="Monster.DOM.Resource.Data.html#create">create</a></li></ul></li><li class="accordion collapsed child" id=9592787><div class="accordion-heading child"><a href="Monster.DOM.Resource.Link.html">Link</a><svg><use xlink:href="#down-icon"></use></svg></div><ul class='methods accordion-content'><li data-type='method'><a href="Monster.DOM.Resource.Link.html#.getURLAttribute">getURLAttribute</a></li><li data-type='method'><a href="Monster.DOM.Resource.Link.html#create">create</a></li></ul></li><li class="accordion collapsed child" id=5947200><div class="accordion-heading child"><a href="Monster.DOM.Resource.Script.html">Script</a><svg><use xlink:href="#down-icon"></use></svg></div><ul class='methods accordion-content'><li data-type='method'><a href="Monster.DOM.Resource.Script.html#.getURLAttribute">getURLAttribute</a></li><li data-type='method'><a href="Monster.DOM.Resource.Script.html#create">create</a></li></ul></li><li class="accordion-list" id=""><a href="Monster.DOM.Resource.Stylesheet.html">Stylesheet</a></li><li class="accordion collapsed child" id=8103459><div class="accordion-heading child"><a href="Monster.DOM.ResourceManager.html">ResourceManager</a><svg><use xlink:href="#down-icon"></use></svg></div><ul class='methods accordion-content'><li data-type='method'><a href="Monster.DOM.ResourceManager.html#addData">addData</a></li><li data-type='method'><a href="Monster.DOM.ResourceManager.html#addScript">addScript</a></li><li data-type='method'><a href="Monster.DOM.ResourceManager.html#addStylesheet">addStylesheet</a></li><li data-type='method'><a href="Monster.DOM.ResourceManager.html#available">available</a></li><li data-type='method'><a href="Monster.DOM.ResourceManager.html#connect">connect</a></li><li data-type='method'><a href="Monster.DOM.ResourceManager.html#getBaseURL">getBaseURL</a></li></ul></li><li class="accordion collapsed child" id=1521562><div class="accordion-heading child"><a href="Monster.DOM.Template.html">Template</a><svg><use xlink:href="#down-icon"></use></svg></div><ul class='methods accordion-content'><li data-type='method'><a href="Monster.DOM.Template.html#createDocumentFragment">createDocumentFragment</a></li><li data-type='method'><a href="Monster.DOM.Template.html#getTemplateElement">getTemplateElement</a></li></ul></li><li class="accordion collapsed child" id=3243348><div class="accordion-heading child"><a href="Monster.DOM.Theme.html">Theme</a><svg><use xlink:href="#down-icon"></use></svg></div><ul class='methods accordion-content'><li data-type='method'><a href="Monster.DOM.Theme.html#getName">getName</a></li></ul></li><li class="accordion collapsed child" id=8958080><div class="accordion-heading child"><a href="Monster.DOM.Updater.html">Updater</a><svg><use xlink:href="#down-icon"></use></svg></div><ul class='methods accordion-content'><li data-type='method'><a href="Monster.DOM.Updater.html#disableEventProcessing">disableEventProcessing</a></li><li data-type='method'><a href="Monster.DOM.Updater.html#enableEventProcessing">enableEventProcessing</a></li><li data-type='method'><a href="Monster.DOM.Updater.html#getSubject">getSubject</a></li><li data-type='method'><a href="Monster.DOM.Updater.html#run">run</a></li><li data-type='method'><a href="Monster.DOM.Updater.html#setCallback">setCallback</a></li><li data-type='method'><a href="Monster.DOM.Updater.html#setEventTypes">setEventTypes</a></li></ul></li><li class="accordion collapsed child" id=90827><div class="accordion-heading child"><a href="Monster.DOM.Worker.Factory.html">Factory</a><svg><use xlink:href="#down-icon"></use></svg></div><ul class='methods accordion-content'><li data-type='method'><a href="Monster.DOM.Worker.Factory.html#terminate">terminate</a></li></ul></li><li class="accordion collapsed child" id=9785173><div class="accordion-heading child"><a href="Monster.I18n.Locale.html">Locale</a><svg><use xlink:href="#down-icon"></use></svg></div><ul class='methods accordion-content'><li data-type='method'><a href="Monster.I18n.Locale.html#getMap">getMap</a></li><li data-type='method'><a href="Monster.I18n.Locale.html#toString">toString</a></li></ul></li><li class="accordion collapsed child" id=8427306><div class="accordion-heading child"><a href="Monster.I18n.Provider.html">Provider</a><svg><use xlink:href="#down-icon"></use></svg></div><ul class='methods accordion-content'><li data-type='method'><a href="Monster.I18n.Provider.html#getTranslations">getTranslations</a></li></ul></li><li class="accordion collapsed child" id=9315603><div class="accordion-heading child"><a href="Monster.I18n.Providers.Fetch.html">Fetch</a><svg><use xlink:href="#down-icon"></use></svg></div><ul class='methods accordion-content'><li data-type='method'><a href="Monster.I18n.Providers.Fetch.html#getTranslations">getTranslations</a></li></ul></li><li class="accordion collapsed child" id=4074161><div class="accordion-heading child"><a href="Monster.I18n.Translations.html">Translations</a><svg><use xlink:href="#down-icon"></use></svg></div><ul class='methods accordion-content'><li data-type='method'><a href="Monster.I18n.Translations.html#assignTranslations">assignTranslations</a></li><li data-type='method'><a href="Monster.I18n.Translations.html#getPluralRuleText">getPluralRuleText</a></li><li data-type='method'><a href="Monster.I18n.Translations.html#getText">getText</a></li><li data-type='method'><a href="Monster.I18n.Translations.html#setText">setText</a></li></ul></li><li class="accordion collapsed child" id=7016628><div class="accordion-heading child"><a href="Monster.Logging.Handler.html">Handler</a><svg><use xlink:href="#down-icon"></use></svg></div><ul class='methods accordion-content'><li data-type='method'><a href="Monster.Logging.Handler.html#getLogLevel">getLogLevel</a></li><li data-type='method'><a href="Monster.Logging.Handler.html#log">log</a></li><li data-type='method'><a href="Monster.Logging.Handler.html#setAll">setAll</a></li><li data-type='method'><a href="Monster.Logging.Handler.html#setDebug">setDebug</a></li><li data-type='method'><a href="Monster.Logging.Handler.html#setError">setError</a></li><li data-type='method'><a href="Monster.Logging.Handler.html#setFatal">setFatal</a></li><li data-type='method'><a href="Monster.Logging.Handler.html#setInfo">setInfo</a></li><li data-type='method'><a href="Monster.Logging.Handler.html#setLogLevel">setLogLevel</a></li><li data-type='method'><a href="Monster.Logging.Handler.html#setOff">setOff</a></li><li data-type='method'><a href="Monster.Logging.Handler.html#setTrace">setTrace</a></li><li data-type='method'><a href="Monster.Logging.Handler.html#setWarn">setWarn</a></li></ul></li><li class="accordion collapsed child" id=2295330><div class="accordion-heading child"><a href="Monster.Logging.Handler.ConsoleHandler.html">ConsoleHandler</a><svg><use xlink:href="#down-icon"></use></svg></div><ul class='methods accordion-content'><li data-type='method'><a href="Monster.Logging.Handler.ConsoleHandler.html#log">log</a></li></ul></li><li class="accordion collapsed child" id=2730548><div class="accordion-heading child"><a href="Monster.Logging.LogEntry.html">LogEntry</a><svg><use xlink:href="#down-icon"></use></svg></div><ul class='methods accordion-content'><li data-type='method'><a href="Monster.Logging.LogEntry.html#getArguments">getArguments</a></li><li data-type='method'><a href="Monster.Logging.LogEntry.html#getLogLevel">getLogLevel</a></li></ul></li><li class="accordion collapsed child" id=278966><div class="accordion-heading child"><a href="Monster.Logging.Logger.html">Logger</a><svg><use xlink:href="#down-icon"></use></svg></div><ul class='methods accordion-content'><li data-type='method'><a href="Monster.Logging.Logger.html#addHandler">addHandler</a></li><li data-type='method'><a href="Monster.Logging.Logger.html#getLabel">getLabel</a></li><li data-type='method'><a href="Monster.Logging.Logger.html#getLevel">getLevel</a></li><li data-type='method'><a href="Monster.Logging.Logger.html#logDebug">logDebug</a></li><li data-type='method'><a href="Monster.Logging.Logger.html#logError">logError</a></li><li data-type='method'><a href="Monster.Logging.Logger.html#logFatal">logFatal</a></li><li data-type='method'><a href="Monster.Logging.Logger.html#logInfo">logInfo</a></li><li data-type='method'><a href="Monster.Logging.Logger.html#logTrace">logTrace</a></li><li data-type='method'><a href="Monster.Logging.Logger.html#logWarn">logWarn</a></li><li data-type='method'><a href="Monster.Logging.Logger.html#removeHandler">removeHandler</a></li></ul></li><li class="accordion collapsed child" id=4281211><div class="accordion-heading child"><a href="Monster.Namespace.html">Namespace</a><svg><use xlink:href="#down-icon"></use></svg></div><ul class='methods accordion-content'><li data-type='method'><a href="Monster.Namespace.html#getNamespace">getNamespace</a></li><li data-type='method'><a href="Monster.Namespace.html#toString">toString</a></li></ul></li><li class="accordion collapsed child" id=7902018><div class="accordion-heading child"><a href="Monster.Text.Formatter.html">Formatter</a><svg><use xlink:href="#down-icon"></use></svg></div><ul class='methods accordion-content'><li data-type='method'><a href="Monster.Text.Formatter.html#format">format</a></li><li data-type='method'><a href="Monster.Text.Formatter.html#setMarker">setMarker</a></li><li data-type='method'><a href="Monster.Text.Formatter.html#setParameterChars">setParameterChars</a></li></ul></li><li class="accordion collapsed child" id=5478792><div class="accordion-heading child"><a href="Monster.Types.Base.html">Base</a><svg><use xlink:href="#down-icon"></use></svg></div><ul class='methods accordion-content'><li data-type='method'><a href="Monster.Types.Base.html#toString">toString</a></li></ul></li><li class="accordion collapsed child" id=2870123><div class="accordion-heading child"><a href="Monster.Types.BaseWithOptions.html">BaseWithOptions</a><svg><use xlink:href="#down-icon"></use></svg></div><ul class='methods accordion-content'><li data-type='method'><a href="Monster.Types.BaseWithOptions.html#getOption">getOption</a></li></ul></li><li class="accordion collapsed child" id=2940692><div class="accordion-heading child"><a href="Monster.Types.DataUrl.html">DataUrl</a><svg><use xlink:href="#down-icon"></use></svg></div><ul class='methods accordion-content'><li data-type='method'><a href="Monster.Types.DataUrl.html#toString">toString</a></li></ul></li><li class="accordion collapsed child" id=481652><div class="accordion-heading child"><a href="Monster.Types.ID.html">ID</a><svg><use xlink:href="#down-icon"></use></svg></div><ul class='methods accordion-content'><li data-type='method'><a href="Monster.Types.ID.html#toString">toString</a></li></ul></li><li class="accordion collapsed child" id=6698416><div class="accordion-heading child"><a href="Monster.Types.MediaType.html">MediaType</a><svg><use xlink:href="#down-icon"></use></svg></div><ul class='methods accordion-content'><li data-type='method'><a href="Monster.Types.MediaType.html#toString">toString</a></li></ul></li><li class="accordion collapsed child" id=8593608><div class="accordion-heading child"><a href="Monster.Types.Observer.html">Observer</a><svg><use xlink:href="#down-icon"></use></svg></div><ul class='methods accordion-content'><li data-type='method'><a href="Monster.Types.Observer.html#addTag">addTag</a></li><li data-type='method'><a href="Monster.Types.Observer.html#getTags">getTags</a></li><li data-type='method'><a href="Monster.Types.Observer.html#hasTag">hasTag</a></li><li data-type='method'><a href="Monster.Types.Observer.html#removeTag">removeTag</a></li><li data-type='method'><a href="Monster.Types.Observer.html#update">update</a></li></ul></li><li class="accordion collapsed child" id=7033747><div class="accordion-heading child"><a href="Monster.Types.ObserverList.html">ObserverList</a><svg><use xlink:href="#down-icon"></use></svg></div><ul class='methods accordion-content'><li data-type='method'><a href="Monster.Types.ObserverList.html#attach">attach</a></li><li data-type='method'><a href="Monster.Types.ObserverList.html#contains">contains</a></li><li data-type='method'><a href="Monster.Types.ObserverList.html#detach">detach</a></li><li data-type='method'><a href="Monster.Types.ObserverList.html#notify">notify</a></li></ul></li><li class="accordion collapsed child" id=5405064><div class="accordion-heading child"><a href="Monster.Types.ProxyObserver.html">ProxyObserver</a><svg><use xlink:href="#down-icon"></use></svg></div><ul class='methods accordion-content'><li data-type='method'><a href="Monster.Types.ProxyObserver.html#attachObserver">attachObserver</a></li><li data-type='method'><a href="Monster.Types.ProxyObserver.html#containsObserver">containsObserver</a></li><li data-type='method'><a href="Monster.Types.ProxyObserver.html#detachObserver">detachObserver</a></li><li data-type='method'><a href="Monster.Types.ProxyObserver.html#getRealSubject">getRealSubject</a></li><li data-type='method'><a href="Monster.Types.ProxyObserver.html#getSubject">getSubject</a></li><li data-type='method'><a href="Monster.Types.ProxyObserver.html#notifyObservers">notifyObservers</a></li><li data-type='method'><a href="Monster.Types.ProxyObserver.html#setSubject">setSubject</a></li></ul></li><li class="accordion collapsed child" id=6659501><div class="accordion-heading child"><a href="Monster.Types.Queue.html">Queue</a><svg><use xlink:href="#down-icon"></use></svg></div><ul class='methods accordion-content'><li data-type='method'><a href="Monster.Types.Queue.html#add">add</a></li><li data-type='method'><a href="Monster.Types.Queue.html#clear">clear</a></li><li data-type='method'><a href="Monster.Types.Queue.html#isEmpty">isEmpty</a></li><li data-type='method'><a href="Monster.Types.Queue.html#peek">peek</a></li><li data-type='method'><a href="Monster.Types.Queue.html#poll">poll</a></li></ul></li><li class="accordion-list" id=""><a href="Monster.Types.RandomID.html">RandomID</a></li><li class="accordion collapsed child" id=9797599><div class="accordion-heading child"><a href="Monster.Types.Stack.html">Stack</a><svg><use xlink:href="#down-icon"></use></svg></div><ul class='methods accordion-content'><li data-type='method'><a href="Monster.Types.Stack.html#clear">clear</a></li><li data-type='method'><a href="Monster.Types.Stack.html#isEmpty">isEmpty</a></li><li data-type='method'><a href="Monster.Types.Stack.html#peek">peek</a></li><li data-type='method'><a href="Monster.Types.Stack.html#pop">pop</a></li><li data-type='method'><a href="Monster.Types.Stack.html#push">push</a></li></ul></li><li class="accordion collapsed child" id=8433153><div class="accordion-heading child"><a href="Monster.Types.TokenList.html">TokenList</a><svg><use xlink:href="#down-icon"></use></svg></div><ul class='methods accordion-content'><li data-type='method'><a href="Monster.Types.TokenList.html#add">add</a></li><li data-type='method'><a href="Monster.Types.TokenList.html#clear">clear</a></li><li data-type='method'><a href="Monster.Types.TokenList.html#contains">contains</a></li><li data-type='method'><a href="Monster.Types.TokenList.html#entries">entries</a></li><li data-type='method'><a href="Monster.Types.TokenList.html#forEach">forEach</a></li><li data-type='method'><a href="Monster.Types.TokenList.html#getIterator">getIterator</a></li><li data-type='method'><a href="Monster.Types.TokenList.html#remove">remove</a></li><li data-type='method'><a href="Monster.Types.TokenList.html#replace">replace</a></li><li data-type='method'><a href="Monster.Types.TokenList.html#Symbol.iterator">Symbol.iterator</a></li><li data-type='method'><a href="Monster.Types.TokenList.html#toggle">toggle</a></li><li data-type='method'><a href="Monster.Types.TokenList.html#toString">toString</a></li></ul></li><li class="accordion collapsed child" id=6740675><div class="accordion-heading child"><a href="Monster.Types.UniqueQueue.html">UniqueQueue</a><svg><use xlink:href="#down-icon"></use></svg></div><ul class='methods accordion-content'><li data-type='method'><a href="Monster.Types.UniqueQueue.html#add">add</a></li><li data-type='method'><a href="Monster.Types.UniqueQueue.html#clear">clear</a></li><li data-type='method'><a href="Monster.Types.UniqueQueue.html#poll">poll</a></li></ul></li><li class="accordion collapsed child" id=7992424><div class="accordion-heading child"><a href="Monster.Types.UUID.html">UUID</a><svg><use xlink:href="#down-icon"></use></svg></div><ul class='methods accordion-content'><li data-type='method'><a href="Monster.Types.UUID.html#toString">toString</a></li></ul></li><li class="accordion collapsed child" id=4606599><div class="accordion-heading child"><a href="Monster.Types.Version.html">Version</a><svg><use xlink:href="#down-icon"></use></svg></div><ul class='methods accordion-content'><li data-type='method'><a href="Monster.Types.Version.html#compareTo">compareTo</a></li><li data-type='method'><a href="Monster.Types.Version.html#toString">toString</a></li></ul></li><li class="accordion collapsed child" id=2971148><div class="accordion-heading child"><a href="Monster.Util.Comparator.html">Comparator</a><svg><use xlink:href="#down-icon"></use></svg></div><ul class='methods accordion-content'><li data-type='method'><a href="Monster.Util.Comparator.html#compare">compare</a></li><li data-type='method'><a href="Monster.Util.Comparator.html#equal">equal</a></li><li data-type='method'><a href="Monster.Util.Comparator.html#greaterThan">greaterThan</a></li><li data-type='method'><a href="Monster.Util.Comparator.html#greaterThanOrEqual">greaterThanOrEqual</a></li><li data-type='method'><a href="Monster.Util.Comparator.html#lessThan">lessThan</a></li><li data-type='method'><a href="Monster.Util.Comparator.html#lessThanOrEqual">lessThanOrEqual</a></li><li data-type='method'><a href="Monster.Util.Comparator.html#reverse">reverse</a></li></ul></li><li class="accordion collapsed child" id=5407437><div class="accordion-heading child"><a href="Monster.Util.Processing.html">Processing</a><svg><use xlink:href="#down-icon"></use></svg></div><ul class='methods accordion-content'><li data-type='method'><a href="Monster.Util.Processing.html#add">add</a></li><li data-type='method'><a href="Monster.Util.Processing.html#run">run</a></li></ul></li></ul> </div><div class="accordion collapsed" id="3562854" > <h3 class="accordion-heading">Externals<svg><use xlink:href="#down-icon"></use></svg></h3><ul class="accordion-content"><li class="accordion-list" id=""><a href="external-HTMLElement.html">HTMLElement</a></li></ul> </div><div class="accordion collapsed" id="8815026" > <h3 class="accordion-heading">Namespaces<svg><use xlink:href="#down-icon"></use></svg></h3><ul class="accordion-content"><li class="accordion collapsed child" id=3255149><div class="accordion-heading child"><a href="global.html#Monster">Monster</a><svg><use xlink:href="#down-icon"></use></svg></div><ul class='methods accordion-content'><li data-type='method'><a href="global.html#Monster#.assignToNamespace">assignToNamespace</a></li><li data-type='method'><a href="global.html#Monster#.getVersion">getVersion</a></li></ul></li><li class="accordion-list" id=""><a href="Monster.Constraints.html">Constraints</a></li><li class="accordion collapsed child" id=9339407><div class="accordion-heading child"><a href="Monster.Data.html">Data</a><svg><use xlink:href="#down-icon"></use></svg></div><ul class='methods accordion-content'><li data-type='method'><a href="Monster.Data.html#.buildMap">buildMap</a></li><li data-type='method'><a href="Monster.Data.html#.diff">diff</a></li><li data-type='method'><a href="Monster.Data.html#.extend">extend</a></li></ul></li><li class="accordion collapsed child" id=9217788><div class="accordion-heading child"><a href="Monster.DOM.html">DOM</a><svg><use xlink:href="#down-icon"></use></svg></div><ul class='methods accordion-content'><li data-type='method'><a href="Monster.DOM.html#.addAttributeToken">addAttributeToken</a></li><li data-type='method'><a href="Monster.DOM.html#.addToObjectLink">addToObjectLink</a></li><li data-type='method'><a href="Monster.DOM.html#.assignUpdaterToElement">assignUpdaterToElement</a></li><li data-type='method'><a href="Monster.DOM.html#.clearAttributeTokens">clearAttributeTokens</a></li><li data-type='method'><a href="Monster.DOM.html#.containsAttributeToken">containsAttributeToken</a></li><li data-type='method'><a href="Monster.DOM.html#.findClosestByAttribute">findClosestByAttribute</a></li><li data-type='method'><a href="Monster.DOM.html#.findClosestObjectLink">findClosestObjectLink</a></li><li data-type='method'><a href="Monster.DOM.html#.findDocumentTemplate">findDocumentTemplate</a></li><li data-type='method'><a href="Monster.DOM.html#.findTargetElementFromEvent">findTargetElementFromEvent</a></li><li data-type='method'><a href="Monster.DOM.html#.fireEvent">fireEvent</a></li><li data-type='method'><a href="Monster.DOM.html#.getDocument">getDocument</a></li><li data-type='method'><a href="Monster.DOM.html#.getDocumentFragmentFromString">getDocumentFragmentFromString</a></li><li data-type='method'><a href="Monster.DOM.html#.getDocumentTheme">getDocumentTheme</a></li><li data-type='method'><a href="Monster.DOM.html#.getLinkedObjects">getLinkedObjects</a></li><li data-type='method'><a href="Monster.DOM.html#.getLocaleOfDocument">getLocaleOfDocument</a></li><li data-type='method'><a href="Monster.DOM.html#.getWindow">getWindow</a></li><li data-type='method'><a href="Monster.DOM.html#.hasObjectLink">hasObjectLink</a></li><li data-type='method'><a href="Monster.DOM.html#.registerCustomElement">registerCustomElement</a></li><li data-type='method'><a href="Monster.DOM.html#.removeAttributeToken">removeAttributeToken</a></li><li data-type='method'><a href="Monster.DOM.html#.removeObjectLink">removeObjectLink</a></li><li data-type='method'><a href="Monster.DOM.html#.replaceAttributeToken">replaceAttributeToken</a></li><li data-type='method'><a href="Monster.DOM.html#.toggleAttributeToken">toggleAttributeToken</a></li></ul></li><li class="accordion collapsed child" id=5855005><div class="accordion-heading child"><a href="Monster.I18n.html">I18n</a><svg><use xlink:href="#down-icon"></use></svg></div><ul class='methods accordion-content'><li data-type='method'><a href="Monster.I18n.html#.parseLocale">parseLocale</a></li></ul></li><li class="accordion-list" id=""><a href="Monster.I18n.Providers.html">Providers</a></li><li class="accordion-list" id=""><a href="Monster.Logging.html">Logging</a></li><li class="accordion collapsed child" id=7964001><div class="accordion-heading child"><a href="Monster.Math.html">Math</a><svg><use xlink:href="#down-icon"></use></svg></div><ul class='methods accordion-content'><li data-type='method'><a href="Monster.Math.html#.random">random</a></li></ul></li><li class="accordion-list" id=""><a href="Monster.Text.html">Text</a></li><li class="accordion collapsed child" id=3057165><div class="accordion-heading child"><a href="Monster.Types.html">Types</a><svg><use xlink:href="#down-icon"></use></svg></div><ul class='methods accordion-content'><li data-type='method'><a href="Monster.Types.html#.fromBinary">fromBinary</a></li><li data-type='method'><a href="Monster.Types.html#.getGlobal">getGlobal</a></li><li data-type='method'><a href="Monster.Types.html#.getGlobalFunction">getGlobalFunction</a></li><li data-type='method'><a href="Monster.Types.html#.getGlobalObject">getGlobalObject</a></li><li data-type='method'><a href="Monster.Types.html#.isArray">isArray</a></li><li data-type='method'><a href="Monster.Types.html#.isBoolean">isBoolean</a></li><li data-type='method'><a href="Monster.Types.html#.isFunction">isFunction</a></li><li data-type='method'><a href="Monster.Types.html#.isInstance">isInstance</a></li><li data-type='method'><a href="Monster.Types.html#.isInteger">isInteger</a></li><li data-type='method'><a href="Monster.Types.html#.isIterable">isIterable</a></li><li data-type='method'><a href="Monster.Types.html#.isObject">isObject</a></li><li data-type='method'><a href="Monster.Types.html#.isPrimitive">isPrimitive</a></li><li data-type='method'><a href="Monster.Types.html#.isString">isString</a></li><li data-type='method'><a href="Monster.Types.html#.isSymbol">isSymbol</a></li><li data-type='method'><a href="Monster.Types.html#.parseDataURL">parseDataURL</a></li><li data-type='method'><a href="Monster.Types.html#.parseMediaType">parseMediaType</a></li><li data-type='method'><a href="Monster.Types.html#.toBinary">toBinary</a></li><li data-type='method'><a href="Monster.Types.html#.typeOf">typeOf</a></li><li data-type='method'><a href="Monster.Types.html#.validateArray">validateArray</a></li><li data-type='method'><a href="Monster.Types.html#.validateBoolean">validateBoolean</a></li><li data-type='method'><a href="Monster.Types.html#.validateFunction">validateFunction</a></li><li data-type='method'><a href="Monster.Types.html#.validateInstance">validateInstance</a></li><li data-type='method'><a href="Monster.Types.html#.validateInteger">validateInteger</a></li><li data-type='method'><a href="Monster.Types.html#.validateIterable">validateIterable</a></li><li data-type='method'><a href="Monster.Types.html#.validateObject">validateObject</a></li><li data-type='method'><a href="Monster.Types.html#.validatePrimitive">validatePrimitive</a></li><li data-type='method'><a href="Monster.Types.html#.validateString">validateString</a></li><li data-type='method'><a href="Monster.Types.html#.validateSymbol">validateSymbol</a></li></ul></li><li class="accordion collapsed child" id=3285301><div class="accordion-heading child"><a href="Monster.Util.html">Util</a><svg><use xlink:href="#down-icon"></use></svg></div><ul class='methods accordion-content'><li data-type='method'><a href="Monster.Util.html#.clone">clone</a></li><li data-type='method'><a href="Monster.Util.html#.deepFreeze">deepFreeze</a></li><li data-type='method'><a href="Monster.Util.html#.trimSpaces">trimSpaces</a></li></ul></li></ul> </div></div>
<div class="navbar-resize" id="navbar-resize">
<div class="resize-dots-container">
<div class="dots"></div>
<div class="dots"></div>
<div class="dots"></div>
</div>
</div>
</nav>
<div class="navbar-ham" id="navbar-ham">
<div>
<div class="first"></div>
<div class="second"></div>
<div class="third"></div>
</div>
</div>
<div id="main" class="main-content">
<h1 id='page-title' class="page-title">
Tutorial: DOM-based templating implementation
</h1>
<section>
<header>
<h2>DOM-based templating implementation</h2>
</header>
<article>
<p>Monster's updater uses a DOM-based approach. The configuration and the template system are valid and parsable HTML.</p>
<p>The configuration is done via some special attributes with a <code>data-monster-</code> prefix.</p>
<p>Code is always the most informative. So let's take a look at a complete example right away.</p>
<pre class="prettyprint source"><code>// The first thing to do is to include the Updater class.
import {Updater} from 'https://cdn.jsdelivr.net/npm/@schukai/monster@1.25.0/dist/modules/dom/updater.js';
// Now we prepare the html document.
// This is done here via script, but can also be inserted into the document as pure html.
// To do this, simply insert the tag <h1 data-monster-replace="path:headline"></h1>.
const body = document.querySelector('body');
const headline = document.createElement('h1');
headline.setAttribute('data-monster-replace','path:headline')
body.appendChild(headline);
// the data structure
let obj = {
headline: "Go!",
};
// Now comes the real magic. we pass the updater the parent HTMLElement
// and the desired data structure.
const updater = new Updater(body, obj);
// now we get the used data structure. why can't we take the original structure?
// the updater puts a proxy over the data structure and thus allows to monitor changes.
// We would not see changes to the original object.
const subject = updater.getSubject();
// now start the updater
updater.run();
// Now you can change the data structure and the HTML will follow these changes.
// to illustrate, let's put the change into a timer call.
setTimeout(function(){
console.log(obj);
subject['headline'] = "Hello!"
},1000);
</code></pre>
<p>We have seen how we can change the content of an htm element. now let's look at what options are available.</p>
<h2>Replace</h2>
<p>The simplest manipulation is to replace the content of a HTMLElement.<br>
To do this, simply use the <code>data-monster-replace</code> attribute (see example).</p>
<p>The syntax is quite simple. The result of the attribute pipe is inserted as content of the<br>
HTMLElement. For the processing the <a href="Monster_Data.Pipe.html">Pipe</a><!-- @IGNORE PREVIOUS: link --> and <a href="Monster_Data.Transformer.html">Transformer class</a><!-- @IGNORE PREVIOUS: link --><br>
is used.</p>
<p>If, for example, you have an object <code>x</code> with the structure listed below and want to insert the value of the key b, you write: <code>path:a.b</code>.</p>
<p>The pipe can then be used to apply operators. For example, <code>tolower</code> can be used to convert everything to lowercase.</p>
<pre class="prettyprint source"><code>let x = {
a: {
b: "EXAMPLE"
}
}
</code></pre>
<p>this is how it looks as an attribute:</p>
<pre class="prettyprint source"><code><div data-monster-replace="static:HELLO | tolower"></div>
</code></pre>
<p>The result is then the following html:</p>
<pre class="prettyprint source"><code><div data-monster-replace="static:hello">hello</div>
</code></pre>
<p>A full example looks like this:</p>
<pre class="prettyprint source"><code>import {Updater} from 'https://cdn.jsdelivr.net/npm/@schukai/monster@1.25.0/dist/modules/dom/updater.js';
const body = document.querySelector('body');
const headline = document.createElement('h1');
headline.setAttribute('data-monster-replace','static:hello')
body.appendChild(headline);
// result in ↦ <div data-monster-replace="static:hello"></div>
new Updater(body).run();
</code></pre>
<h2>Attributes</h2>
<p>Attributes can be added via the <code>data-monster-attributes</code> attribute. The syntax is attribute name followed by<br>
a space and the desired pipe definition.</p>
<pre class="prettyprint source"><code><div data-monster-attributes="id static:myid">hello</div>
</code></pre>
<p>The result is then the following html:</p>
<pre class="prettyprint source"><code><div id="myid" data-monster-attributes="id static:myid">hello</div>
</code></pre>
<p>Multiple attributes can be separated by commas.</p>
<pre class="prettyprint source"><code><div data-monster-attributes="id static:myid, class static:myclass">hello</div>
</code></pre>
<h2>Remove</h2>
<p>The <code>data-monster-remove</code> attribute can be used to remove html elements. it is important to<br>
note that this cannot be undone. Once removed, nodes will not be reinserted.</p>
<p>This tag is removed via the updater</p>
<pre class="prettyprint source"><code><div data-monster-remove></div>
</code></pre>
<h2>Insert</h2>
<p>The strongest feature is adding elements to a node.</p>
<p>For this feature you need a template and the <code>data-monster-insert</code> attribute.</p>
<p>The syntax of the attribute is first an id followed by a space. This is then followed by the pipe command.</p>
<pre class="prettyprint source"><code><ol data-monster-insert="myid path:a"></ol>
</code></pre>
<p>Furthermore you need a template. The template must have the same string as id.</p>
<pre class="prettyprint source"><code><template id="myid">
<li data-monster-replace="path:myid | index:id | tostring | prefix:x"></li>
</template>
</code></pre>
<p>In this template, we define the structure of the new elements. In this case, the id is taken<br>
from the dataset <code>index:id</code>, converted to a string <code>tostring</code>, and an x is placed in front of it <code>prefix:x</code>.</p>
<p>The values for the corresponding data must be available as an array.</p>
<pre class="prettyprint source"><code>let obj = {
a: [
{"id": 1},
{"id": 2},
{"id": 3},
{"id": 4}
]
};
</code></pre>
<p>Below we have a complete example. Instead of specifying the template <code><template /></code> in HTML, it is constructed via<br>
javascript <code>document.createElement('template')</code>. But it is essentially the same.</p>
<pre class="prettyprint source"><code>const body = document.querySelector('body');
const li = document.createElement('li');
li.innerHTML="-/-";
li.setAttribute('data-monster-replace','path:myid | index:id | tostring | prefix:x');
const template = document.createElement('template');
template.setAttribute('id','myid');
template.content.appendChild(li);
body.appendChild(template);
const list = document.createElement('ul');
list.setAttribute('data-monster-insert', 'myid path:a')
body.appendChild(list);
let obj = {
a: [
{"id": 1},
{"id": 2},
{"id": 3},
{"id": 4}
]
};
const updater = new Updater(body, obj)updater.run();
</code></pre>
<p>The result will be</p>
<pre class="prettyprint source"><code><ul data-monster-insert="myid path:a">
<li data-monster-replace="path:a.0 | index:id | tostring | prefix:x" data-monster-insert-reference="myid-0">x1</li>
<li data-monster-replace="path:a.1 | index:id | tostring | prefix:x" data-monster-insert-reference="myid-1">x2</li>
<li data-monster-replace="path:a.2 | index:id | tostring | prefix:x" data-monster-insert-reference="myid-2">x3</li>
<li data-monster-replace="path:a.3 | index:id | tostring | prefix:x" data-monster-insert-reference="myid-3">x4</li>
</ul>
</code></pre>
<p>You can easily add and delete values to the array. The DOM will be adjusted accordingly.<br>
The attribute <code>data-monster-insert-reference</code> identifies if the entry already exists.</p>
</article>
</section>
</div>
<footer class="footer" id="footer">
<a href='https://about.schukai.com/de/impressum/'>Imprint</a>
</footer>
<script src="scripts/third-party/prettify.js"></script>
<script src="scripts/third-party/lang-css.js"></script>
<script type="text/javascript" src="scripts/misc.js"></script>
<script>prettyPrint();</script>
<script src="scripts/linenumber.js"></script>
<script src="scripts/fix-code-block.js"></script>
<script src="scripts/fix-navbar.js"></script>
<script src="scripts/search.js"></script>
<script src="scripts/third-party/fuse.js"></script>
<script>
var list = [{"title":"01-getting-started","link":"01-getting-started"},{"title":"02-what-is-monster","link":"02-what-is-monster"},{"title":"03-dom","link":"03-dom"},{"title":"09-browser-compatibility","link":"09-browser-compatibility"},{"title":"AbstractConstraint","link":"<a href=\"Monster.Constraints.AbstractConstraint.html\">AbstractConstraint</a>"},{"title":"Monster.Constraints.AbstractConstraint#isValid","link":"<a href=\"Monster.Constraints.AbstractConstraint.html#isValid\">Monster.Constraints.AbstractConstraint ▸ isValid</a>"},{"title":"AbstractOperator","link":"<a href=\"Monster.Constraints.AbstractOperator.html\">AbstractOperator</a>"},{"title":"AndOperator","link":"<a href=\"Monster.Constraints.AndOperator.html\">AndOperator</a>"},{"title":"Monster.Constraints.AndOperator#isValid","link":"<a href=\"Monster.Constraints.AndOperator.html#isValid\">Monster.Constraints.AndOperator ▸ isValid</a>"},{"title":"Invalid","link":"<a href=\"Monster.Constraints.Invalid.html\">Invalid</a>"},{"title":"Monster.Constraints.Invalid#isValid","link":"<a href=\"Monster.Constraints.Invalid.html#isValid\">Monster.Constraints.Invalid ▸ isValid</a>"},{"title":"IsArray","link":"<a href=\"Monster.Constraints.IsArray.html\">IsArray</a>"},{"title":"Monster.Constraints.IsArray#isValid","link":"<a href=\"Monster.Constraints.IsArray.html#isValid\">Monster.Constraints.IsArray ▸ isValid</a>"},{"title":"IsObject","link":"<a href=\"Monster.Constraints.IsObject.html\">IsObject</a>"},{"title":"Monster.Constraints.IsObject#isValid","link":"<a href=\"Monster.Constraints.IsObject.html#isValid\">Monster.Constraints.IsObject ▸ isValid</a>"},{"title":"OrOperator","link":"<a href=\"Monster.Constraints.OrOperator.html\">OrOperator</a>"},{"title":"Monster.Constraints.OrOperator#isValid","link":"<a href=\"Monster.Constraints.OrOperator.html#isValid\">Monster.Constraints.OrOperator ▸ isValid</a>"},{"title":"Valid","link":"<a href=\"Monster.Constraints.Valid.html\">Valid</a>"},{"title":"Monster.Constraints.Valid#isValid","link":"<a href=\"Monster.Constraints.Valid.html#isValid\">Monster.Constraints.Valid ▸ isValid</a>"},{"title":"Datasource","link":"<a href=\"Monster.Data.Datasource.html\">Datasource</a>"},{"title":"Monster.Data.Datasource#attachObserver","link":"<a href=\"Monster.Data.Datasource.html#attachObserver\">Monster.Data.Datasource ▸ attachObserver</a>"},{"title":"Monster.Data.Datasource#containsObserver","link":"<a href=\"Monster.Data.Datasource.html#containsObserver\">Monster.Data.Datasource ▸ containsObserver</a>"},{"title":"Monster.Data.Datasource#detachObserver","link":"<a href=\"Monster.Data.Datasource.html#detachObserver\">Monster.Data.Datasource ▸ detachObserver</a>"},{"title":"Monster.Data.Datasource#get","link":"<a href=\"Monster.Data.Datasource.html#get\">Monster.Data.Datasource ▸ get</a>"},{"title":"Monster.Data.Datasource#getOption","link":"<a href=\"Monster.Data.Datasource.html#getOption\">Monster.Data.Datasource ▸ getOption</a>"},{"title":"Monster.Data.Datasource#read","link":"<a href=\"Monster.Data.Datasource.html#read\">Monster.Data.Datasource ▸ read</a>"},{"title":"Monster.Data.Datasource#set","link":"<a href=\"Monster.Data.Datasource.html#set\">Monster.Data.Datasource ▸ set</a>"},{"title":"Monster.Data.Datasource#setOption","link":"<a href=\"Monster.Data.Datasource.html#setOption\">Monster.Data.Datasource ▸ setOption</a>"},{"title":"Monster.Data.Datasource#setOptions","link":"<a href=\"Monster.Data.Datasource.html#setOptions\">Monster.Data.Datasource ▸ setOptions</a>"},{"title":"Monster.Data.Datasource#write","link":"<a href=\"Monster.Data.Datasource.html#write\">Monster.Data.Datasource ▸ write</a>"},{"title":"RestAPI","link":"<a href=\"Monster.Data.Datasource.RestAPI.html\">RestAPI</a>"},{"title":"Monster.Data.Datasource.RestAPI#getClone","link":"<a href=\"Monster.Data.Datasource.RestAPI.html#getClone\">Monster.Data.Datasource.RestAPI ▸ getClone</a>"},{"title":"Monster.Data.Datasource.RestAPI#read","link":"<a href=\"Monster.Data.Datasource.RestAPI.html#read\">Monster.Data.Datasource.RestAPI ▸ read</a>"},{"title":"Monster.Data.Datasource.RestAPI#write","link":"<a href=\"Monster.Data.Datasource.RestAPI.html#write\">Monster.Data.Datasource.RestAPI ▸ write</a>"},{"title":"WriteError","link":"<a href=\"Monster.Data.Datasource.RestAPI.WriteError.html\">WriteError</a>"},{"title":"Monster.Data.Datasource.RestAPI.WriteError#getResponse","link":"<a href=\"Monster.Data.Datasource.RestAPI.WriteError.html#getResponse\">Monster.Data.Datasource.RestAPI.WriteError ▸ getResponse</a>"},{"title":"Monster.Data.Datasource.RestAPI.WriteError#getValidation","link":"<a href=\"Monster.Data.Datasource.RestAPI.WriteError.html#getValidation\">Monster.Data.Datasource.RestAPI.WriteError ▸ getValidation</a>"},{"title":"Storage","link":"<a href=\"Monster.Data.Datasource.Storage.html\">Storage</a>"},{"title":"Monster.Data.Datasource.Storage#getClone","link":"<a href=\"Monster.Data.Datasource.Storage.html#getClone\">Monster.Data.Datasource.Storage ▸ getClone</a>"},{"title":"Monster.Data.Datasource.Storage#read","link":"<a href=\"Monster.Data.Datasource.Storage.html#read\">Monster.Data.Datasource.Storage ▸ read</a>"},{"title":"Monster.Data.Datasource.Storage#write","link":"<a href=\"Monster.Data.Datasource.Storage.html#write\">Monster.Data.Datasource.Storage ▸ write</a>"},{"title":"LocalStorage","link":"<a href=\"Monster.Data.Datasource.Storage.LocalStorage.html\">LocalStorage</a>"},{"title":"Monster.Data.Datasource.Storage.LocalStorage#getClone","link":"<a href=\"Monster.Data.Datasource.Storage.LocalStorage.html#getClone\">Monster.Data.Datasource.Storage.LocalStorage ▸ getClone</a>"},{"title":"SessionStorage","link":"<a href=\"Monster.Data.Datasource.Storage.SessionStorage.html\">SessionStorage</a>"},{"title":"Monster.Data.Datasource.Storage.SessionStorage#getClone","link":"<a href=\"Monster.Data.Datasource.Storage.SessionStorage.html#getClone\">Monster.Data.Datasource.Storage.SessionStorage ▸ getClone</a>"},{"title":"Pathfinder","link":"<a href=\"Monster.Data.Pathfinder.html\">Pathfinder</a>"},{"title":"Monster.Data.Pathfinder#deleteVia","link":"<a href=\"Monster.Data.Pathfinder.html#deleteVia\">Monster.Data.Pathfinder ▸ deleteVia</a>"},{"title":"Monster.Data.Pathfinder#exists","link":"<a href=\"Monster.Data.Pathfinder.html#exists\">Monster.Data.Pathfinder ▸ exists</a>"},{"title":"Monster.Data.Pathfinder#getVia","link":"<a href=\"Monster.Data.Pathfinder.html#getVia\">Monster.Data.Pathfinder ▸ getVia</a>"},{"title":"Monster.Data.Pathfinder#setVia","link":"<a href=\"Monster.Data.Pathfinder.html#setVia\">Monster.Data.Pathfinder ▸ setVia</a>"},{"title":"Monster.Data.Pathfinder#setWildCard","link":"<a href=\"Monster.Data.Pathfinder.html#setWildCard\">Monster.Data.Pathfinder ▸ setWildCard</a>"},{"title":"Pipe","link":"<a href=\"Monster.Data.Pipe.html\">Pipe</a>"},{"title":"Monster.Data.Pipe#run","link":"<a href=\"Monster.Data.Pipe.html#run\">Monster.Data.Pipe ▸ run</a>"},{"title":"Monster.Data.Pipe#setCallback","link":"<a href=\"Monster.Data.Pipe.html#setCallback\">Monster.Data.Pipe ▸ setCallback</a>"},{"title":"Transformer","link":"<a href=\"Monster.Data.Transformer.html\">Transformer</a>"},{"title":"Monster.Data.Transformer#run","link":"<a href=\"Monster.Data.Transformer.html#run\">Monster.Data.Transformer ▸ run</a>"},{"title":"Monster.Data.Transformer#setCallback","link":"<a href=\"Monster.Data.Transformer.html#setCallback\">Monster.Data.Transformer ▸ setCallback</a>"},{"title":"Assembler","link":"<a href=\"Monster.DOM.Assembler.html\">Assembler</a>"},{"title":"Monster.DOM.Assembler#createDocumentFragment","link":"<a href=\"Monster.DOM.Assembler.html#createDocumentFragment\">Monster.DOM.Assembler ▸ createDocumentFragment</a>"},{"title":"Monster.DOM.Assembler#getAttributePrefix","link":"<a href=\"Monster.DOM.Assembler.html#getAttributePrefix\">Monster.DOM.Assembler ▸ getAttributePrefix</a>"},{"title":"Monster.DOM.Assembler#setAttributePrefix","link":"<a href=\"Monster.DOM.Assembler.html#setAttributePrefix\">Monster.DOM.Assembler ▸ setAttributePrefix</a>"},{"title":"CustomControl","link":"<a href=\"Monster.DOM.CustomControl.html\">CustomControl</a>"},{"title":"Monster.DOM.CustomControl#checkValidity","link":"<a href=\"Monster.DOM.CustomControl.html#checkValidity\">Monster.DOM.CustomControl ▸ checkValidity</a>"},{"title":"Monster.DOM.CustomControl#reportValidity","link":"<a href=\"Monster.DOM.CustomControl.html#reportValidity\">Monster.DOM.CustomControl ▸ reportValidity</a>"},{"title":"Monster.DOM.CustomControl#setFormValue","link":"<a href=\"Monster.DOM.CustomControl.html#setFormValue\">Monster.DOM.CustomControl ▸ setFormValue</a>"},{"title":"Monster.DOM.CustomControl#setValidity","link":"<a href=\"Monster.DOM.CustomControl.html#setValidity\">Monster.DOM.CustomControl ▸ setValidity</a>"},{"title":"CustomElement","link":"<a href=\"Monster.DOM.CustomElement.html\">CustomElement</a>"},{"title":"Monster.DOM.CustomElement.getCSSStyleSheet","link":"<a href=\"Monster.DOM.CustomElement.html#.getCSSStyleSheet\">Monster.DOM.CustomElement.getCSSStyleSheet ▸ undefined</a>"},{"title":"Monster.DOM.CustomElement.getTag","link":"<a href=\"Monster.DOM.CustomElement.html#.getTag\">Monster.DOM.CustomElement.getTag ▸ undefined</a>"},{"title":"Monster.DOM.CustomElement#adoptedCallback","link":"<a href=\"Monster.DOM.CustomElement.html#adoptedCallback\">Monster.DOM.CustomElement ▸ adoptedCallback</a>"},{"title":"Monster.DOM.CustomElement#assembleMethodSymbol","link":"<a href=\"Monster.DOM.CustomElement.html#assembleMethodSymbol\">Monster.DOM.CustomElement ▸ assembleMethodSymbol</a>"},{"title":"Monster.DOM.CustomElement#attachObserver","link":"<a href=\"Monster.DOM.CustomElement.html#attachObserver\">Monster.DOM.CustomElement ▸ attachObserver</a>"},{"title":"Monster.DOM.CustomElement#attributeChangedCallback","link":"<a href=\"Monster.DOM.CustomElement.html#attributeChangedCallback\">Monster.DOM.CustomElement ▸ attributeChangedCallback</a>"},{"title":"Monster.DOM.CustomElement#connectedCallback","link":"<a href=\"Monster.DOM.CustomElement.html#connectedCallback\">Monster.DOM.CustomElement ▸ connectedCallback</a>"},{"title":"Monster.DOM.CustomElement#containsObserver","link":"<a href=\"Monster.DOM.CustomElement.html#containsObserver\">Monster.DOM.CustomElement ▸ containsObserver</a>"},{"title":"Monster.DOM.CustomElement#detachObserver","link":"<a href=\"Monster.DOM.CustomElement.html#detachObserver\">Monster.DOM.CustomElement ▸ detachObserver</a>"},{"title":"Monster.DOM.CustomElement#disconnectedCallback","link":"<a href=\"Monster.DOM.CustomElement.html#disconnectedCallback\">Monster.DOM.CustomElement ▸ disconnectedCallback</a>"},{"title":"Monster.DOM.CustomElement#getOption","link":"<a href=\"Monster.DOM.CustomElement.html#getOption\">Monster.DOM.CustomElement ▸ getOption</a>"},{"title":"Monster.DOM.CustomElement#hasNode","link":"<a href=\"Monster.DOM.CustomElement.html#hasNode\">Monster.DOM.CustomElement ▸ hasNode</a>"},{"title":"Monster.DOM.CustomElement#initMethodSymbol","link":"<a href=\"Monster.DOM.CustomElement.html#initMethodSymbol\">Monster.DOM.CustomElement ▸ initMethodSymbol</a>"},{"title":"Monster.DOM.CustomElement#setOption","link":"<a href=\"Monster.DOM.CustomElement.html#setOption\">Monster.DOM.CustomElement ▸ setOption</a>"},{"title":"Monster.DOM.CustomElement#setOptions","link":"<a href=\"Monster.DOM.CustomElement.html#setOptions\">Monster.DOM.CustomElement ▸ setOptions</a>"},{"title":"FocusManager","link":"<a href=\"Monster.DOM.FocusManager.html\">FocusManager</a>"},{"title":"Monster.DOM.FocusManager#focus","link":"<a href=\"Monster.DOM.FocusManager.html#focus\">Monster.DOM.FocusManager ▸ focus</a>"},{"title":"Monster.DOM.FocusManager#focusNext","link":"<a href=\"Monster.DOM.FocusManager.html#focusNext\">Monster.DOM.FocusManager ▸ focusNext</a>"},{"title":"Monster.DOM.FocusManager#focusPrev","link":"<a href=\"Monster.DOM.FocusManager.html#focusPrev\">Monster.DOM.FocusManager ▸ focusPrev</a>"},{"title":"Monster.DOM.FocusManager#getActive","link":"<a href=\"Monster.DOM.FocusManager.html#getActive\">Monster.DOM.FocusManager ▸ getActive</a>"},{"title":"Monster.DOM.FocusManager#getFocusable","link":"<a href=\"Monster.DOM.FocusManager.html#getFocusable\">Monster.DOM.FocusManager ▸ getFocusable</a>"},{"title":"Monster.DOM.FocusManager#restoreFocus","link":"<a href=\"Monster.DOM.FocusManager.html#restoreFocus\">Monster.DOM.FocusManager ▸ restoreFocus</a>"},{"title":"Monster.DOM.FocusManager#storeFocus","link":"<a href=\"Monster.DOM.FocusManager.html#storeFocus\">Monster.DOM.FocusManager ▸ storeFocus</a>"},{"title":"Resource","link":"<a href=\"Monster.DOM.Resource.html\">Resource</a>"},{"title":"Monster.DOM.Resource.getURLAttribute","link":"<a href=\"Monster.DOM.Resource.html#.getURLAttribute\">Monster.DOM.Resource.getURLAttribute ▸ undefined</a>"},{"title":"Monster.DOM.Resource#available","link":"<a href=\"Monster.DOM.Resource.html#available\">Monster.DOM.Resource ▸ available</a>"},{"title":"Monster.DOM.Resource#connect","link":"<a href=\"Monster.DOM.Resource.html#connect\">Monster.DOM.Resource ▸ connect</a>"},{"title":"Monster.DOM.Resource#create","link":"<a href=\"Monster.DOM.Resource.html#create\">Monster.DOM.Resource ▸ create</a>"},{"title":"Monster.DOM.Resource#isConnected","link":"<a href=\"Monster.DOM.Resource.html#isConnected\">Monster.DOM.Resource ▸ isConnected</a>"},{"title":"Data","link":"<a href=\"Monster.DOM.Resource.Data.html\">Data</a>"},{"title":"Monster.DOM.Resource.Data.getURLAttribute","link":"<a href=\"Monster.DOM.Resource.Data.html#.getURLAttribute\">Monster.DOM.Resource.Data.getURLAttribute ▸ undefined</a>"},{"title":"Monster.DOM.Resource.Data#connect","link":"<a href=\"Monster.DOM.Resource.Data.html#connect\">Monster.DOM.Resource.Data ▸ connect</a>"},{"title":"Monster.DOM.Resource.Data#create","link":"<a href=\"Monster.DOM.Resource.Data.html#create\">Monster.DOM.Resource.Data ▸ create</a>"},{"title":"Link","link":"<a href=\"Monster.DOM.Resource.Link.html\">Link</a>"},{"title":"Monster.DOM.Resource.Link.getURLAttribute","link":"<a href=\"Monster.DOM.Resource.Link.html#.getURLAttribute\">Monster.DOM.Resource.Link.getURLAttribute ▸ undefined</a>"},{"title":"Monster.DOM.Resource.Link#create","link":"<a href=\"Monster.DOM.Resource.Link.html#create\">Monster.DOM.Resource.Link ▸ create</a>"},{"title":"Script","link":"<a href=\"Monster.DOM.Resource.Script.html\">Script</a>"},{"title":"Monster.DOM.Resource.Script.getURLAttribute","link":"<a href=\"Monster.DOM.Resource.Script.html#.getURLAttribute\">Monster.DOM.Resource.Script.getURLAttribute ▸ undefined</a>"},{"title":"Monster.DOM.Resource.Script#create","link":"<a href=\"Monster.DOM.Resource.Script.html#create\">Monster.DOM.Resource.Script ▸ create</a>"},{"title":"Stylesheet","link":"<a href=\"Monster.DOM.Resource.Stylesheet.html\">Stylesheet</a>"},{"title":"ResourceManager","link":"<a href=\"Monster.DOM.ResourceManager.html\">ResourceManager</a>"},{"title":"Monster.DOM.ResourceManager#addData","link":"<a href=\"Monster.DOM.ResourceManager.html#addData\">Monster.DOM.ResourceManager ▸ addData</a>"},{"title":"Monster.DOM.ResourceManager#addScript","link":"<a href=\"Monster.DOM.ResourceManager.html#addScript\">Monster.DOM.ResourceManager ▸ addScript</a>"},{"title":"Monster.DOM.ResourceManager#addStylesheet","link":"<a href=\"Monster.DOM.ResourceManager.html#addStylesheet\">Monster.DOM.ResourceManager ▸ addStylesheet</a>"},{"title":"Monster.DOM.ResourceManager#available","link":"<a href=\"Monster.DOM.ResourceManager.html#available\">Monster.DOM.ResourceManager ▸ available</a>"},{"title":"Monster.DOM.ResourceManager#connect","link":"<a href=\"Monster.DOM.ResourceManager.html#connect\">Monster.DOM.ResourceManager ▸ connect</a>"},{"title":"Monster.DOM.ResourceManager#getBaseURL","link":"<a href=\"Monster.DOM.ResourceManager.html#getBaseURL\">Monster.DOM.ResourceManager ▸ getBaseURL</a>"},{"title":"Template","link":"<a href=\"Monster.DOM.Template.html\">Template</a>"},{"title":"Monster.DOM.Template#createDocumentFragment","link":"<a href=\"Monster.DOM.Template.html#createDocumentFragment\">Monster.DOM.Template ▸ createDocumentFragment</a>"},{"title":"Monster.DOM.Template#getTemplateElement","link":"<a href=\"Monster.DOM.Template.html#getTemplateElement\">Monster.DOM.Template ▸ getTemplateElement</a>"},{"title":"Theme","link":"<a href=\"Monster.DOM.Theme.html\">Theme</a>"},{"title":"Monster.DOM.Theme#getName","link":"<a href=\"Monster.DOM.Theme.html#getName\">Monster.DOM.Theme ▸ getName</a>"},{"title":"Updater","link":"<a href=\"Monster.DOM.Updater.html\">Updater</a>"},{"title":"Monster.DOM.Updater#disableEventProcessing","link":"<a href=\"Monster.DOM.Updater.html#disableEventProcessing\">Monster.DOM.Updater ▸ disableEventProcessing</a>"},{"title":"Monster.DOM.Updater#enableEventProcessing","link":"<a href=\"Monster.DOM.Updater.html#enableEventProcessing\">Monster.DOM.Updater ▸ enableEventProcessing</a>"},{"title":"Monster.DOM.Updater#getSubject","link":"<a href=\"Monster.DOM.Updater.html#getSubject\">Monster.DOM.Updater ▸ getSubject</a>"},{"title":"Monster.DOM.Updater#run","link":"<a href=\"Monster.DOM.Updater.html#run\">Monster.DOM.Updater ▸ run</a>"},{"title":"Monster.DOM.Updater#setCallback","link":"<a href=\"Monster.DOM.Updater.html#setCallback\">Monster.DOM.Updater ▸ setCallback</a>"},{"title":"Monster.DOM.Updater#setEventTypes","link":"<a href=\"Monster.DOM.Updater.html#setEventTypes\">Monster.DOM.Updater ▸ setEventTypes</a>"},{"title":"Factory","link":"<a href=\"Monster.DOM.Worker.Factory.html\">Factory</a>"},{"title":"Monster.DOM.Worker.Factory#terminate","link":"<a href=\"Monster.DOM.Worker.Factory.html#terminate\">Monster.DOM.Worker.Factory ▸ terminate</a>"},{"title":"Locale","link":"<a href=\"Monster.I18n.Locale.html\">Locale</a>"},{"title":"Monster.I18n.Locale#getMap","link":"<a href=\"Monster.I18n.Locale.html#getMap\">Monster.I18n.Locale ▸ getMap</a>"},{"title":"Monster.I18n.Locale#toString","link":"<a href=\"Monster.I18n.Locale.html#toString\">Monster.I18n.Locale ▸ toString</a>"},{"title":"Provider","link":"<a href=\"Monster.I18n.Provider.html\">Provider</a>"},{"title":"Monster.I18n.Provider#getTranslations","link":"<a href=\"Monster.I18n.Provider.html#getTranslations\">Monster.I18n.Provider ▸ getTranslations</a>"},{"title":"Fetch","link":"<a href=\"Monster.I18n.Providers.Fetch.html\">Fetch</a>"},{"title":"Monster.I18n.Providers.Fetch#getTranslations","link":"<a href=\"Monster.I18n.Providers.Fetch.html#getTranslations\">Monster.I18n.Providers.Fetch ▸ getTranslations</a>"},{"title":"Translations","link":"<a href=\"Monster.I18n.Translations.html\">Translations</a>"},{"title":"Monster.I18n.Translations#assignTranslations","link":"<a href=\"Monster.I18n.Translations.html#assignTranslations\">Monster.I18n.Translations ▸ assignTranslations</a>"},{"title":"Monster.I18n.Translations#getPluralRuleText","link":"<a href=\"Monster.I18n.Translations.html#getPluralRuleText\">Monster.I18n.Translations ▸ getPluralRuleText</a>"},{"title":"Monster.I18n.Translations#getText","link":"<a href=\"Monster.I18n.Translations.html#getText\">Monster.I18n.Translations ▸ getText</a>"},{"title":"Monster.I18n.Translations#setText","link":"<a href=\"Monster.I18n.Translations.html#setText\">Monster.I18n.Translations ▸ setText</a>"},{"title":"Handler","link":"<a href=\"Monster.Logging.Handler.html\">Handler</a>"},{"title":"Monster.Logging.Handler#getLogLevel","link":"<a href=\"Monster.Logging.Handler.html#getLogLevel\">Monster.Logging.Handler ▸ getLogLevel</a>"},{"title":"Monster.Logging.Handler#log","link":"<a href=\"Monster.Logging.Handler.html#log\">Monster.Logging.Handler ▸ log</a>"},{"title":"Monster.Logging.Handler#setAll","link":"<a href=\"Monster.Logging.Handler.html#setAll\">Monster.Logging.Handler ▸ setAll</a>"},{"title":"Monster.Logging.Handler#setDebug","link":"<a href=\"Monster.Logging.Handler.html#setDebug\">Monster.Logging.Handler ▸ setDebug</a>"},{"title":"Monster.Logging.Handler#setError","link":"<a href=\"Monster.Logging.Handler.html#setError\">Monster.Logging.Handler ▸ setError</a>"},{"title":"Monster.Logging.Handler#setFatal","link":"<a href=\"Monster.Logging.Handler.html#setFatal\">Monster.Logging.Handler ▸ setFatal</a>"},{"title":"Monster.Logging.Handler#setInfo","link":"<a href=\"Monster.Logging.Handler.html#setInfo\">Monster.Logging.Handler ▸ setInfo</a>"},{"title":"Monster.Logging.Handler#setLogLevel","link":"<a href=\"Monster.Logging.Handler.html#setLogLevel\">Monster.Logging.Handler ▸ setLogLevel</a>"},{"title":"Monster.Logging.Handler#setOff","link":"<a href=\"Monster.Logging.Handler.html#setOff\">Monster.Logging.Handler ▸ setOff</a>"},{"title":"Monster.Logging.Handler#setTrace","link":"<a href=\"Monster.Logging.Handler.html#setTrace\">Monster.Logging.Handler ▸ setTrace</a>"},{"title":"Monster.Logging.Handler#setWarn","link":"<a href=\"Monster.Logging.Handler.html#setWarn\">Monster.Logging.Handler ▸ setWarn</a>"},{"title":"ConsoleHandler","link":"<a href=\"Monster.Logging.Handler.ConsoleHandler.html\">ConsoleHandler</a>"},{"title":"Monster.Logging.Handler.ConsoleHandler#log","link":"<a href=\"Monster.Logging.Handler.ConsoleHandler.html#log\">Monster.Logging.Handler.ConsoleHandler ▸ log</a>"},{"title":"LogEntry","link":"<a href=\"Monster.Logging.LogEntry.html\">LogEntry</a>"},{"title":"Monster.Logging.LogEntry#getArguments","link":"<a href=\"Monster.Logging.LogEntry.html#getArguments\">Monster.Logging.LogEntry ▸ getArguments</a>"},{"title":"Monster.Logging.LogEntry#getLogLevel","link":"<a href=\"Monster.Logging.LogEntry.html#getLogLevel\">Monster.Logging.LogEntry ▸ getLogLevel</a>"},{"title":"Logger","link":"<a href=\"Monster.Logging.Logger.html\">Logger</a>"},{"title":"Monster.Logging.Logger#addHandler","link":"<a href=\"Monster.Logging.Logger.html#addHandler\">Monster.Logging.Logger ▸ addHandler</a>"},{"title":"Monster.Logging.Logger#getLabel","link":"<a href=\"Monster.Logging.Logger.html#getLabel\">Monster.Logging.Logger ▸ getLabel</a>"},{"title":"Monster.Logging.Logger#getLevel","link":"<a href=\"Monster.Logging.Logger.html#getLevel\">Monster.Logging.Logger ▸ getLevel</a>"},{"title":"Monster.Logging.Logger#logDebug","link":"<a href=\"Monster.Logging.Logger.html#logDebug\">Monster.Logging.Logger ▸ logDebug</a>"},{"title":"Monster.Logging.Logger#logError","link":"<a href=\"Monster.Logging.Logger.html#logError\">Monster.Logging.Logger ▸ logError</a>"},{"title":"Monster.Logging.Logger#logFatal","link":"<a href=\"Monster.Logging.Logger.html#logFatal\">Monster.Logging.Logger ▸ logFatal</a>"},{"title":"Monster.Logging.Logger#logInfo","link":"<a href=\"Monster.Logging.Logger.html#logInfo\">Monster.Logging.Logger ▸ logInfo</a>"},{"title":"Monster.Logging.Logger#logTrace","link":"<a href=\"Monster.Logging.Logger.html#logTrace\">Monster.Logging.Logger ▸ logTrace</a>"},{"title":"Monster.Logging.Logger#logWarn","link":"<a href=\"Monster.Logging.Logger.html#logWarn\">Monster.Logging.Logger ▸ logWarn</a>"},{"title":"Monster.Logging.Logger#removeHandler","link":"<a href=\"Monster.Logging.Logger.html#removeHandler\">Monster.Logging.Logger ▸ removeHandler</a>"},{"title":"Namespace","link":"<a href=\"Monster.Namespace.html\">Namespace</a>"},{"title":"Monster.Namespace#getNamespace","link":"<a href=\"Monster.Namespace.html#getNamespace\">Monster.Namespace ▸ getNamespace</a>"},{"title":"Monster.Namespace#toString","link":"<a href=\"Monster.Namespace.html#toString\">Monster.Namespace ▸ toString</a>"},{"title":"Formatter","link":"<a href=\"Monster.Text.Formatter.html\">Formatter</a>"},{"title":"Monster.Text.Formatter#format","link":"<a href=\"Monster.Text.Formatter.html#format\">Monster.Text.Formatter ▸ format</a>"},{"title":"Monster.Text.Formatter#setMarker","link":"<a href=\"Monster.Text.Formatter.html#setMarker\">Monster.Text.Formatter ▸ setMarker</a>"},{"title":"Monster.Text.Formatter#setParameterChars","link":"<a href=\"Monster.Text.Formatter.html#setParameterChars\">Monster.Text.Formatter ▸ setParameterChars</a>"},{"title":"Base","link":"<a href=\"Monster.Types.Base.html\">Base</a>"},{"title":"Monster.Types.Base#toString","link":"<a href=\"Monster.Types.Base.html#toString\">Monster.Types.Base ▸ toString</a>"},{"title":"BaseWithOptions","link":"<a href=\"Monster.Types.BaseWithOptions.html\">BaseWithOptions</a>"},{"title":"Monster.Types.BaseWithOptions#getOption","link":"<a href=\"Monster.Types.BaseWithOptions.html#getOption\">Monster.Types.BaseWithOptions ▸ getOption</a>"},{"title":"DataUrl","link":"<a href=\"Monster.Types.DataUrl.html\">DataUrl</a>"},{"title":"Monster.Types.DataUrl#toString","link":"<a href=\"Monster.Types.DataUrl.html#toString\">Monster.Types.DataUrl ▸ toString</a>"},{"title":"ID","link":"<a href=\"Monster.Types.ID.html\">ID</a>"},{"title":"Monster.Types.ID#toString","link":"<a href=\"Monster.Types.ID.html#toString\">Monster.Types.ID ▸ toString</a>"},{"title":"MediaType","link":"<a href=\"Monster.Types.MediaType.html\">MediaType</a>"},{"title":"Monster.Types.MediaType#toString","link":"<a href=\"Monster.Types.MediaType.html#toString\">Monster.Types.MediaType ▸ toString</a>"},{"title":"Observer","link":"<a href=\"Monster.Types.Observer.html\">Observer</a>"},{"title":"Monster.Types.Observer#addTag","link":"<a href=\"Monster.Types.Observer.html#addTag\">Monster.Types.Observer ▸ addTag</a>"},{"title":"Monster.Types.Observer#getTags","link":"<a href=\"Monster.Types.Observer.html#getTags\">Monster.Types.Observer ▸ getTags</a>"},{"title":"Monster.Types.Observer#hasTag","link":"<a href=\"Monster.Types.Observer.html#hasTag\">Monster.Types.Observer ▸ hasTag</a>"},{"title":"Monster.Types.Observer#removeTag","link":"<a href=\"Monster.Types.Observer.html#removeTag\">Monster.Types.Observer ▸ removeTag</a>"},{"title":"Monster.Types.Observer#update","link":"<a href=\"Monster.Types.Observer.html#update\">Monster.Types.Observer ▸ update</a>"},{"title":"ObserverList","link":"<a href=\"Monster.Types.ObserverList.html\">ObserverList</a>"},{"title":"Monster.Types.ObserverList#attach","link":"<a href=\"Monster.Types.ObserverList.html#attach\">Monster.Types.ObserverList ▸ attach</a>"},{"title":"Monster.Types.ObserverList#contains","link":"<a href=\"Monster.Types.ObserverList.html#contains\">Monster.Types.ObserverList ▸ contains</a>"},{"title":"Monster.Types.ObserverList#detach","link":"<a href=\"Monster.Types.ObserverList.html#detach\">Monster.Types.ObserverList ▸ detach</a>"},{"title":"Monster.Types.ObserverList#notify","link":"<a href=\"Monster.Types.ObserverList.html#notify\">Monster.Types.ObserverList ▸ notify</a>"},{"title":"ProxyObserver","link":"<a href=\"Monster.Types.ProxyObserver.html\">ProxyObserver</a>"},{"title":"Monster.Types.ProxyObserver#attachObserver","link":"<a href=\"Monster.Types.ProxyObserver.html#attachObserver\">Monster.Types.ProxyObserver ▸ attachObserver</a>"},{"title":"Monster.Types.ProxyObserver#containsObserver","link":"<a href=\"Monster.Types.ProxyObserver.html#containsObserver\">Monster.Types.ProxyObserver ▸ containsObserver</a>"},{"title":"Monster.Types.ProxyObserver#detachObserver","link":"<a href=\"Monster.Types.ProxyObserver.html#detachObserver\">Monster.Types.ProxyObserver ▸ detachObserver</a>"},{"title":"Monster.Types.ProxyObserver#getRealSubject","link":"<a href=\"Monster.Types.ProxyObserver.html#getRealSubject\">Monster.Types.ProxyObserver ▸ getRealSubject</a>"},{"title":"Monster.Types.ProxyObserver#getSubject","link":"<a href=\"Monster.Types.ProxyObserver.html#getSubject\">Monster.Types.ProxyObserver ▸ getSubject</a>"},{"title":"Monster.Types.ProxyObserver#notifyObservers","link":"<a href=\"Monster.Types.ProxyObserver.html#notifyObservers\">Monster.Types.ProxyObserver ▸ notifyObservers</a>"},{"title":"Monster.Types.ProxyObserver#setSubject","link":"<a href=\"Monster.Types.ProxyObserver.html#setSubject\">Monster.Types.ProxyObserver ▸ setSubject</a>"},{"title":"Queue","link":"<a href=\"Monster.Types.Queue.html\">Queue</a>"},{"title":"Monster.Types.Queue#add","link":"<a href=\"Monster.Types.Queue.html#add\">Monster.Types.Queue ▸ add</a>"},{"title":"Monster.Types.Queue#clear","link":"<a href=\"Monster.Types.Queue.html#clear\">Monster.Types.Queue ▸ clear</a>"},{"title":"Monster.Types.Queue#isEmpty","link":"<a href=\"Monster.Types.Queue.html#isEmpty\">Monster.Types.Queue ▸ isEmpty</a>"},{"title":"Monster.Types.Queue#peek","link":"<a href=\"Monster.Types.Queue.html#peek\">Monster.Types.Queue ▸ peek</a>"},{"title":"Monster.Types.Queue#poll","link":"<a href=\"Monster.Types.Queue.html#poll\">Monster.Types.Queue ▸ poll</a>"},{"title":"RandomID","link":"<a href=\"Monster.Types.RandomID.html\">RandomID</a>"},{"title":"Stack","link":"<a href=\"Monster.Types.Stack.html\">Stack</a>"},{"title":"Monster.Types.Stack#clear","link":"<a href=\"Monster.Types.Stack.html#clear\">Monster.Types.Stack ▸ clear</a>"},{"title":"Monster.Types.Stack#isEmpty","link":"<a href=\"Monster.Types.Stack.html#isEmpty\">Monster.Types.Stack ▸ isEmpty</a>"},{"title":"Monster.Types.Stack#peek","link":"<a href=\"Monster.Types.Stack.html#peek\">Monster.Types.Stack ▸ peek</a>"},{"title":"Monster.Types.Stack#pop","link":"<a href=\"Monster.Types.Stack.html#pop\">Monster.Types.Stack ▸ pop</a>"},{"title":"Monster.Types.Stack#push","link":"<a href=\"Monster.Types.Stack.html#push\">Monster.Types.Stack ▸ push</a>"},{"title":"TokenList","link":"<a href=\"Monster.Types.TokenList.html\">TokenList</a>"},{"title":"Monster.Types.TokenList#add","link":"<a href=\"Monster.Types.TokenList.html#add\">Monster.Types.TokenList ▸ add</a>"},{"title":"Monster.Types.TokenList#clear","link":"<a href=\"Monster.Types.TokenList.html#clear\">Monster.Types.TokenList ▸ clear</a>"},{"title":"Monster.Types.TokenList#contains","link":"<a href=\"Monster.Types.TokenList.html#contains\">Monster.Types.TokenList ▸ contains</a>"},{"title":"Monster.Types.TokenList#entries","link":"<a href=\"Monster.Types.TokenList.html#entries\">Monster.Types.TokenList ▸ entries</a>"},{"title":"Monster.Types.TokenList#forEach","link":"<a href=\"Monster.Types.TokenList.html#forEach\">Monster.Types.TokenList ▸ forEach</a>"},{"title":"Monster.Types.TokenList#getIterator","link":"<a href=\"Monster.Types.TokenList.html#getIterator\">Monster.Types.TokenList ▸ getIterator</a>"},{"title":"Monster.Types.TokenList#remove","link":"<a href=\"Monster.Types.TokenList.html#remove\">Monster.Types.TokenList ▸ remove</a>"},{"title":"Monster.Types.TokenList#replace","link":"<a href=\"Monster.Types.TokenList.html#replace\">Monster.Types.TokenList ▸ replace</a>"},{"title":"Monster.Types.TokenList#Symbol.iterator","link":"<a href=\"Monster.Types.TokenList.html#Symbol.iterator\">Monster.Types.TokenList ▸ Symbol.iterator</a>"},{"title":"Monster.Types.TokenList#toggle","link":"<a href=\"Monster.Types.TokenList.html#toggle\">Monster.Types.TokenList ▸ toggle</a>"},{"title":"Monster.Types.TokenList#toString","link":"<a href=\"Monster.Types.TokenList.html#toString\">Monster.Types.TokenList ▸ toString</a>"},{"title":"UniqueQueue","link":"<a href=\"Monster.Types.UniqueQueue.html\">UniqueQueue</a>"},{"title":"Monster.Types.UniqueQueue#add","link":"<a href=\"Monster.Types.UniqueQueue.html#add\">Monster.Types.UniqueQueue ▸ add</a>"},{"title":"Monster.Types.UniqueQueue#clear","link":"<a href=\"Monster.Types.UniqueQueue.html#clear\">Monster.Types.UniqueQueue ▸ clear</a>"},{"title":"Monster.Types.UniqueQueue#poll","link":"<a href=\"Monster.Types.UniqueQueue.html#poll\">Monster.Types.UniqueQueue ▸ poll</a>"},{"title":"UUID","link":"<a href=\"Monster.Types.UUID.html\">UUID</a>"},{"title":"Monster.Types.UUID#toString","link":"<a href=\"Monster.Types.UUID.html#toString\">Monster.Types.UUID ▸ toString</a>"},{"title":"Version","link":"<a href=\"Monster.Types.Version.html\">Version</a>"},{"title":"Monster.Types.Version#compareTo","link":"<a href=\"Monster.Types.Version.html#compareTo\">Monster.Types.Version ▸ compareTo</a>"},{"title":"Monster.Types.Version#toString","link":"<a href=\"Monster.Types.Version.html#toString\">Monster.Types.Version ▸ toString</a>"},{"title":"Comparator","link":"<a href=\"Monster.Util.Comparator.html\">Comparator</a>"},{"title":"Monster.Util.Comparator#compare","link":"<a href=\"Monster.Util.Comparator.html#compare\">Monster.Util.Comparator ▸ compare</a>"},{"title":"Monster.Util.Comparator#equal","link":"<a href=\"Monster.Util.Comparator.html#equal\">Monster.Util.Comparator ▸ equal</a>"},{"title":"Monster.Util.Comparator#greaterThan","link":"<a href=\"Monster.Util.Comparator.html#greaterThan\">Monster.Util.Comparator ▸ greaterThan</a>"},{"title":"Monster.Util.Comparator#greaterThanOrEqual","link":"<a href=\"Monster.Util.Comparator.html#greaterThanOrEqual\">Monster.Util.Comparator ▸ greaterThanOrEqual</a>"},{"title":"Monster.Util.Comparator#lessThan","link":"<a href=\"Monster.Util.Comparator.html#lessThan\">Monster.Util.Comparator ▸ lessThan</a>"},{"title":"Monster.Util.Comparator#lessThanOrEqual","link":"<a href=\"Monster.Util.Comparator.html#lessThanOrEqual\">Monster.Util.Comparator ▸ lessThanOrEqual</a>"},{"title":"Monster.Util.Comparator#reverse","link":"<a href=\"Monster.Util.Comparator.html#reverse\">Monster.Util.Comparator ▸ reverse</a>"},{"title":"Processing","link":"<a href=\"Monster.Util.Processing.html\">Processing</a>"},{"title":"Monster.Util.Processing#add","link":"<a href=\"Monster.Util.Processing.html#add\">Monster.Util.Processing ▸ add</a>"},{"title":"Monster.Util.Processing#run","link":"<a href=\"Monster.Util.Processing.html#run\">Monster.Util.Processing ▸ run</a>"},{"title":"HTMLElement","link":"<a href=\"external-HTMLElement.html\">HTMLElement</a>"},{"title":"Monster","link":"<a href=\"global.html#Monster\">Monster</a>"},{"title":"Monster.assignToNamespace","link":"<a href=\"global.html#Monster#.assignToNamespace\">Monster.assignToNamespace ▸ undefined</a>"},{"title":"Monster.getVersion","link":"<a href=\"global.html#Monster#.getVersion\">Monster.getVersion ▸ undefined</a>"},{"title":"Constraints","link":"<a href=\"Monster.Constraints.html\">Constraints</a>"},{"title":"Data","link":"<a href=\"Monster.Data.html\">Data</a>"},{"title":"Monster.Data.buildMap","link":"<a href=\"Monster.Data.html#.buildMap\">Monster.Data.buildMap ▸ undefined</a>"},{"title":"Monster.Data.diff","link":"<a href=\"Monster.Data.html#.diff\">Monster.Data.diff ▸ undefined</a>"},{"title":"Monster.Data.extend","link":"<a href=\"Monster.Data.html#.extend\">Monster.Data.extend ▸ undefined</a>"},{"title":"DOM","link":"<a href=\"Monster.DOM.html\">DOM</a>"},{"title":"Monster.DOM.addAttributeToken","link":"<a href=\"Monster.DOM.html#.addAttributeToken\">Monster.DOM.addAttributeToken ▸ undefined</a>"},{"title":"Monster.DOM.addToObjectLink","link":"<a href=\"Monster.DOM.html#.addToObjectLink\">Monster.DOM.addToObjectLink ▸ undefined</a>"},{"title":"Monster.DOM.assignUpdaterToElement","link":"<a href=\"Monster.DOM.html#.assignUpdaterToElement\">Monster.DOM.assignUpdaterToElement ▸ undefined</a>"},{"title":"Monster.DOM.clearAttributeTokens","link":"<a href=\"Monster.DOM.html#.clearAttributeTokens\">Monster.DOM.clearAttributeTokens ▸ undefined</a>"},{"title":"Monster.DOM.containsAttributeToken","link":"<a href=\"Monster.DOM.html#.containsAttributeToken\">Monster.DOM.containsAttributeToken ▸ undefined</a>"},{"title":"Monster.DOM.findClosestByAttribute","link":"<a href=\"Monster.DOM.html#.findClosestByAttribute\">Monster.DOM.findClosestByAttribute ▸ undefined</a>"},{"title":"Monster.DOM.findClosestObjectLink","link":"<a href=\"Monster.DOM.html#.findClosestObjectLink\">Monster.DOM.findClosestObjectLink ▸ undefined</a>"},{"title":"Monster.DOM.findDocumentTemplate","link":"<a href=\"Monster.DOM.html#.findDocumentTemplate\">Monster.DOM.findDocumentTemplate ▸ undefined</a>"},{"title":"Monster.DOM.findTargetElementFromEvent","link":"<a href=\"Monster.DOM.html#.findTargetElementFromEvent\">Monster.DOM.findTargetElementFromEvent ▸ undefined</a>"},{"title":"Monster.DOM.fireEvent","link":"<a href=\"Monster.DOM.html#.fireEvent\">Monster.DOM.fireEvent ▸ undefined</a>"},{"title":"Monster.DOM.getDocument","link":"<a href=\"Monster.DOM.html#.getDocument\">Monster.DOM.getDocument ▸ undefined</a>"},{"title":"Monster.DOM.getDocumentFragmentFromString","link":"<a href=\"Monster.DOM.html#.getDocumentFragmentFromString\">Monster.DOM.getDocumentFragmentFromString ▸ undefined</a>"},{"title":"Monster.DOM.getDocumentTheme","link":"<a href=\"Monster.DOM.html#.getDocumentTheme\">Monster.DOM.getDocumentTheme ▸ undefined</a>"},{"title":"Monster.DOM.getLinkedObjects","link":"<a href=\"Monster.DOM.html#.getLinkedObjects\">Monster.DOM.getLinkedObjects ▸ undefined</a>"},{"title":"Monster.DOM.getLocaleOfDocument","link":"<a href=\"Monster.DOM.html#.getLocaleOfDocument\">Monster.DOM.getLocaleOfDocument ▸ undefined</a>"},{"title":"Monster.DOM.getWindow","link":"<a href=\"Monster.DOM.html#.getWindow\">Monster.DOM.getWindow ▸ undefined</a>"},{"title":"Monster.DOM.hasObjectLink","link":"<a href=\"Monster.DOM.html#.hasObjectLink\">Monster.DOM.hasObjectLink ▸ undefined</a>"},{"title":"Monster.DOM.registerCustomElement","link":"<a href=\"Monster.DOM.html#.registerCustomElement\">Monster.DOM.registerCustomElement ▸ undefined</a>"},{"title":"Monster.DOM.removeAttributeToken","link":"<a href=\"Monster.DOM.html#.removeAttributeToken\">Monster.DOM.removeAttributeToken ▸ undefined</a>"},{"title":"Monster.DOM.removeObjectLink","link":"<a href=\"Monster.DOM.html#.removeObjectLink\">Monster.DOM.removeObjectLink ▸ undefined</a>"},{"title":"Monster.DOM.replaceAttributeToken","link":"<a href=\"Monster.DOM.html#.replaceAttributeToken\">Monster.DOM.replaceAttributeToken ▸ undefined</a>"},{"title":"Monster.DOM.toggleAttributeToken","link":"<a href=\"Monster.DOM.html#.toggleAttributeToken\">Monster.DOM.toggleAttributeToken ▸ undefined</a>"},{"title":"I18n","link":"<a href=\"Monster.I18n.html\">I18n</a>"},{"title":"Monster.I18n.parseLocale","link":"<a href=\"Monster.I18n.html#.parseLocale\">Monster.I18n.parseLocale ▸ undefined</a>"},{"title":"Providers","link":"<a href=\"Monster.I18n.Providers.html\">Providers</a>"},{"title":"Logging","link":"<a href=\"Monster.Logging.html\">Logging</a>"},{"title":"Math","link":"<a href=\"Monster.Math.html\">Math</a>"},{"title":"Monster.Math.random","link":"<a href=\"Monster.Math.html#.random\">Monster.Math.random ▸ undefined</a>"},{"title":"Text","link":"<a href=\"Monster.Text.html\">Text</a>"},{"title":"Types","link":"<a href=\"Monster.Types.html\">Types</a>"},{"title":"Monster.Types.fromBinary","link":"<a href=\"Monster.Types.html#.fromBinary\">Monster.Types.fromBinary ▸ undefined</a>"},{"title":"Monster.Types.getGlobal","link":"<a href=\"Monster.Types.html#.getGlobal\">Monster.Types.getGlobal ▸ undefined</a>"},{"title":"Monster.Types.getGlobalFunction","link":"<a href=\"Monster.Types.html#.getGlobalFunction\">Monster.Types.getGlobalFunction ▸ undefined</a>"},{"title":"Monster.Types.getGlobalObject","link":"<a href=\"Monster.Types.html#.getGlobalObject\">Monster.Types.getGlobalObject ▸ undefined</a>"},{"title":"Monster.Types.isArray","link":"<a href=\"Monster.Types.html#.isArray\">Monster.Types.isArray ▸ undefined</a>"},{"title":"Monster.Types.isBoolean","link":"<a href=\"Monster.Types.html#.isBoolean\">Monster.Types.isBoolean ▸ undefined</a>"},{"title":"Monster.Types.isFunction","link":"<a href=\"Monster.Types.html#.isFunction\">Monster.Types.isFunction ▸ undefined</a>"},{"title":"Monster.Types.isInstance","link":"<a href=\"Monster.Types.html#.isInstance\">Monster.Types.isInstance ▸ undefined</a>"},{"title":"Monster.Types.isInteger","link":"<a href=\"Monster.Types.html#.isInteger\">Monster.Types.isInteger ▸ undefined</a>"},{"title":"Monster.Types.isIterable","link":"<a href=\"Monster.Types.html#.isIterable\">Monster.Types.isIterable ▸ undefined</a>"},{"title":"Monster.Types.isObject","link":"<a href=\"Monster.Types.html#.isObject\">Monster.Types.isObject ▸ undefined</a>"},{"title":"Monster.Types.isPrimitive","link":"<a href=\"Monster.Types.html#.isPrimitive\">Monster.Types.isPrimitive ▸ undefined</a>"},{"title":"Monster.Types.isString","link":"<a href=\"Monster.Types.html#.isString\">Monster.Types.isString ▸ undefined</a>"},{"title":"Monster.Types.isSymbol","link":"<a href=\"Monster.Types.html#.isSymbol\">Monster.Types.isSymbol ▸ undefined</a>"},{"title":"Monster.Types.parseDataURL","link":"<a href=\"Monster.Types.html#.parseDataURL\">Monster.Types.parseDataURL ▸ undefined</a>"},{"title":"Monster.Types.parseMediaType","link":"<a href=\"Monster.Types.html#.parseMediaType\">Monster.Types.parseMediaType ▸ undefined</a>"},{"title":"Monster.Types.toBinary","link":"<a href=\"Monster.Types.html#.toBinary\">Monster.Types.toBinary ▸ undefined</a>"},{"title":"Monster.Types.typeOf","link":"<a href=\"Monster.Types.html#.typeOf\">Monster.Types.typeOf ▸ undefined</a>"},{"title":"Monster.Types.validateArray","link":"<a href=\"Monster.Types.html#.validateArray\">Monster.Types.validateArray ▸ undefined</a>"},{"title":"Monster.Types.validateBoolean","link":"<a href=\"Monster.Types.html#.validateBoolean\">Monster.Types.validateBoolean ▸ undefined</a>"},{"title":"Monster.Types.validateFunction","link":"<a href=\"Monster.Types.html#.validateFunction\">Monster.Types.validateFunction ▸ undefined</a>"},{"title":"Monster.Types.validateInstance","link":"<a href=\"Monster.Types.html#.validateInstance\">Monster.Types.validateInstance ▸ undefined</a>"},{"title":"Monster.Types.validateInteger","link":"<a href=\"Monster.Types.html#.validateInteger\">Monster.Types.validateInteger ▸ undefined</a>"},{"title":"Monster.Types.validateIterable","link":"<a href=\"Monster.Types.html#.validateIterable\">Monster.Types.validateIterable ▸ undefined</a>"},{"title":"Monster.Types.validateObject","link":"<a href=\"Monster.Types.html#.validateObject\">Monster.Types.validateObject ▸ undefined</a>"},{"title":"Monster.Types.validatePrimitive","link":"<a href=\"Monster.Types.html#.validatePrimitive\">Monster.Types.validatePrimitive ▸ undefined</a>"},{"title":"Monster.Types.validateString","link":"<a href=\"Monster.Types.html#.validateString\">Monster.Types.validateString ▸ undefined</a>"},{"title":"Monster.Types.validateSymbol","link":"<a href=\"Monster.Types.html#.validateSymbol\">Monster.Types.validateSymbol ▸ undefined</a>"},{"title":"Util","link":"<a href=\"Monster.Util.html\">Util</a>"},{"title":"Monster.Util.clone","link":"<a href=\"Monster.Util.html#.clone\">Monster.Util.clone ▸ undefined</a>"},{"title":"Monster.Util.deepFreeze","link":"<a href=\"Monster.Util.html#.deepFreeze\">Monster.Util.deepFreeze ▸ undefined</a>"},{"title":"Monster.Util.trimSpaces","link":"<a href=\"Monster.Util.html#.trimSpaces\">Monster.Util.trimSpaces ▸ undefined</a>"}];
var options = true
setupSearch(list, options)
</script>
<script src="scripts/resize.js"></script>
<script type="text/javascript">
var option = {"min":"300","max":"600"}
setupResizeOptions(option)
</script>
<script type="text/javascript">
var option = JSON.parse('{"options":{}}')
document.addEventListener("DOMContentLoaded", function () {
OverlayScrollbars(document.querySelectorAll('body'), option.option || {});
});
</script>
</body>
</html>