Added video template and source template. Added code so that if the src attribute is changed on a source element it automatically pauses the video and resets the position to 0.

ignite-template.js

@@ -2133,6 +2133,46 @@ class iframe extends IgniteTemplate {
     }
 }
 
+/**
+ * An ignite template that can be used to construct a video element.
+ */
+class video extends IgniteTemplate {
+    /** 
+    * @param  {...String|Number|IgniteProperty|IgniteTemplate} children A series of children to be added to this template.
+    */
+    constructor(...children) {
+        super("video", children);
+    }
+}
+
+/**
+ * An ignite template that can be used to construct a source element.
+ */
+class source extends IgniteTemplate {
+    /** 
+    * @param  {...String|Number|IgniteProperty|IgniteTemplate} children A series of children to be added to this template.
+    */
+    constructor(...children) {
+        super("source", children);
+    }
+
+    /**
+     * Called when an attribute on this source element is changing.
+     * @param {String} name 
+     * @param {Any} newValue 
+     */
+    onAttributeChanged(name, newValue) {
+        //If the src is changing, we need to stop the parent video player and reset it's position.
+        if (this.element && name && name.trim().toLowerCase() == "src") {
+            this.element.parentElement.pause();
+            this.element.parentElement.currentTime = 0;
+        }
+
+        //Call the original on attribute changed function.
+        super.onAttributeChanged(name, newValue);
+    }
+}
+
 /**
  * An ignite template that can be used to construct a progress element.
  */
@@ -3697,5 +3737,7 @@ export {
     form,
     header,
     footer,
-    iframe
+    iframe,
+    video,
+    source
 };