X-Git-Url: http://source.bookstackapp.com/bookstack/blobdiff_plain/a6633642232efd164d4708967ab59e498fbff896..refs/pull/4191/head:/resources/js/services/dom.js

diff --git a/resources/js/services/dom.js b/resources/js/services/dom.js
index 7a7b2c9bc..17f5a803a 100644
--- a/resources/js/services/dom.js
+++ b/resources/js/services/dom.js
@@ -5,7 +5,7 @@
  */
 export function forEach(selector, callback) {
     const elements = document.querySelectorAll(selector);
-    for (let element of elements) {
+    for (const element of elements) {
         callback(element);
     }
 }
@@ -17,7 +17,7 @@ export function forEach(selector, callback) {
  * @param {Function<Event>} callback
  */
 export function onEvents(listenerElement, events, callback) {
-    for (let eventName of events) {
+    for (const eventName of events) {
         listenerElement.addEventListener(eventName, callback);
     }
 }
@@ -35,7 +35,7 @@ export function onSelect(elements, callback) {
 
     for (const listenerElement of elements) {
         listenerElement.addEventListener('click', callback);
-        listenerElement.addEventListener('keydown', (event) => {
+        listenerElement.addEventListener('keydown', event => {
             if (event.key === 'Enter' || event.key === ' ') {
                 event.preventDefault();
                 callback(event);
@@ -58,7 +58,7 @@ export function onEnterPress(elements, callback) {
         if (event.key === 'Enter') {
             callback(event);
         }
-    }
+    };
 
     elements.forEach(e => e.addEventListener('keypress', listener));
 }
@@ -73,7 +73,7 @@ export function onEnterPress(elements, callback) {
  * @param {Function} callback
  */
 export function onChildEvent(listenerElement, childSelector, eventName, callback) {
-    listenerElement.addEventListener(eventName, function(event) {
+    listenerElement.addEventListener(eventName, event => {
         const matchingChild = event.target.closest(childSelector);
         if (matchingChild) {
             callback.call(matchingChild, event, matchingChild);
@@ -91,7 +91,7 @@ export function onChildEvent(listenerElement, childSelector, eventName, callback
 export function findText(selector, text) {
     const elements = document.querySelectorAll(selector);
     text = text.toLowerCase();
-    for (let element of elements) {
+    for (const element of elements) {
         if (element.textContent.toLowerCase().includes(text)) {
             return element;
         }
@@ -105,7 +105,7 @@ export function findText(selector, text) {
  * @param {Element} element
  */
 export function showLoading(element) {
-    element.innerHTML = `<div class="loading-container"><div></div><div></div><div></div></div>`;
+    element.innerHTML = '<div class="loading-container"><div></div><div></div><div></div></div>';
 }
 
 /**
@@ -117,4 +117,17 @@ export function removeLoading(element) {
     for (const el of loadingEls) {
         el.remove();
     }
-}
\ No newline at end of file
+}
+
+/**
+ * Convert the given html data into a live DOM element.
+ * Initiates any components defined in the data.
+ * @param {String} html
+ * @returns {Element}
+ */
+export function htmlToDom(html) {
+    const wrap = document.createElement('div');
+    wrap.innerHTML = html;
+    window.$components.init(wrap);
+    return wrap.children[0];
+}