From d75b790ccf9b9e259dbcc0e098d076560d5e127f Mon Sep 17 00:00:00 2001
From: Stefan Kalscheuer <stefan@stklcode.de>
Date: Fri, 1 May 2020 14:52:25 +0200
Subject: [PATCH] prepend new elements instead of replacing HTML on AJAX update
 (#9) (#12)

Replacing the body by prepending HTML results in the full content
being re-rendered. This can be a performance issue, but is definitely
annoying when embedding media in ticks.
---
 README.md             |  1 +
 scripts/liveticker.js | 11 +++++++++--
 2 files changed, 10 insertions(+), 2 deletions(-)

diff --git a/README.md b/README.md
index 25fc13d..111e596 100644
--- a/README.md
+++ b/README.md
@@ -85,6 +85,7 @@ caching time of 12 hours obviously makes no sense.
 * Use GMT for automatic updates 
 * Gutenberg Block available
 * Ticks exposed through REST API
+* Changed AJAX update logic for embedded media compatibility
 
 ### 1.0.0 - 2018-11-02
 
diff --git a/scripts/liveticker.js b/scripts/liveticker.js
index 031c3cc..9f2eebe 100644
--- a/scripts/liveticker.js
+++ b/scripts/liveticker.js
@@ -164,8 +164,15 @@
 	 * @return {void}
 	 */
 	var updateHTML = function( t, u ) {
-		// Prepend HTML of new ticks.
-		t.e.innerHTML = u.h + t.e.innerHTML;
+		// Parse new DOM-part.
+		var n = document.createElement( 'ul' );
+		n.innerHTML = u.h;
+
+		// Prepend new ticks to container.
+		while ( n.hasChildNodes() ) {
+			t.e.prepend( n.lastChild );
+		}
+
 		t.e.parentNode.setAttribute( 'data-sclt-last', u.t );
 
 		// Remove tail, if limit is set.