diff --git a/src/ignite-html.js b/src/ignite-html.js
index a33a561..0f69a23 100644
--- a/src/ignite-html.js
+++ b/src/ignite-html.js
@@ -249,6 +249,7 @@ class IgniteRenderingContext {
IgniteRenderingContext.RenderCount = IgniteRenderingContext.Stack.pop();
}
}
+
static ready(callback) {
//Setup the callbacks if it's not init'd.
if (!IgniteRenderingContext.ReadyCallbacks) {
diff --git a/src/ignite-template.js b/src/ignite-template.js
index 0bf6fa6..6a4d1d7 100644
--- a/src/ignite-template.js
+++ b/src/ignite-template.js
@@ -439,7 +439,7 @@ class IgniteTemplate {
this.callbacks.push(prop.attachOnPop((oldValue, newValue) => this.onStyleChanged(name, converter(...value.getPropertyValues()))));
});
- this.styles[name] = { name: name, value: converter(...this.getValuesForProperties(value)), priority: priority };
+ this.styles[name] = { name: name, value: converter(...value.getPropertyValues()), priority: priority };
} else {
this.styles[name] = { name: name, value: (converter != null ? converter(value) : value), priority: priority };
}
@@ -605,15 +605,6 @@ class IgniteTemplate {
}
}
- //Set the elements value if there is one.
- if (this.elementValue != null) {
- if (this.element.hasAttribute("type") && this.element.getAttribute("type").toLowerCase().trim() == "checkbox") {
- this.element.checked = this.elementValue;
- } else {
- this.element.value = this.elementValue;
- }
- }
-
//Set the elements inner html if it was set
if (this.elementInnerHTML != null) {
this.element.innerHTML = this.elementInnerHTML;
@@ -624,6 +615,15 @@ class IgniteTemplate {
this.children[i].construct(this.element);
}
+ //Set the elements value if there is one.
+ if (this.elementValue != null) {
+ if (this.element.hasAttribute("type") && this.element.getAttribute("type").toLowerCase().trim() == "checkbox") {
+ this.element.checked = this.elementValue;
+ } else {
+ this.element.value = this.elementValue;
+ }
+ }
+
//If our element has not been added to the dom yet, then add it.
if (this.element.isConnected == false && this.element.parentElement == null) {
if (sibling) {
@@ -880,12 +880,6 @@ class IgniteTemplate {
this.styles[name].value = newValue;
}
-
- getValuesForProperties(props) {
- var ret = [];
- props.forEach(prop => ret.push(prop.value));
- return ret;
- }
}
/**
@@ -1010,6 +1004,18 @@ class h6 extends IgniteTemplate {
}
}
+/**
+ * An ignite template that can be used to construct a hr element.
+ */
+class hr extends IgniteTemplate {
+ /**
+ * @param {...String|Number|IgniteProperty|IgniteTemplate} children A series of children to be added to this template.
+ */
+ constructor(...children) {
+ super("hr", children);
+ }
+}
+
/**
* An ignite template that can be used to construct a p element.
*/
@@ -1106,6 +1112,42 @@ class label extends IgniteTemplate {
}
}
+/**
+ * An ignite template that can be used to construct a select element.
+ */
+class select extends IgniteTemplate {
+ /**
+ * @param {...String|Number|IgniteProperty|IgniteTemplate} children A series of children to be added to this template.
+ */
+ constructor(...children) {
+ super("select", children);
+ }
+}
+
+/**
+ * An ignite template that can be used to construct a option element.
+ */
+class option extends IgniteTemplate {
+ /**
+ * @param {...String|Number|IgniteProperty|IgniteTemplate} children A series of children to be added to this template.
+ */
+ constructor(...children) {
+ super("option", children);
+ }
+}
+
+/**
+ * An ignite template that can be used to construct a script element.
+ */
+class script extends IgniteTemplate {
+ /**
+ * @param {...String|Number|IgniteProperty|IgniteTemplate} children A series of children to be added to this template.
+ */
+ constructor(...children) {
+ super("script", children);
+ }
+}
+
/**
* Html is a special template that can construct raw html or properties into the dom and automatically
* update the dom if the property changes.
@@ -1473,6 +1515,7 @@ export {
h4,
h5,
h6,
+ hr,
p,
span,
i,
@@ -1481,5 +1524,8 @@ export {
br,
img,
label,
+ select,
+ option,
+ script,
slot
};
\ No newline at end of file