From c00459e18f815db7df9674b57b91c0da0af1f007 Mon Sep 17 00:00:00 2001
From: dgtlmoon <dgtlmoon@gmail.com>
Date: Mon, 12 Sep 2022 16:12:35 +0200
Subject: [PATCH] WIP slider

---
 changedetectionio/templates/diff-image.html | 17 +++++++++++++++--
 1 file changed, 15 insertions(+), 2 deletions(-)

diff --git a/changedetectionio/templates/diff-image.html b/changedetectionio/templates/diff-image.html
index f8077822..9556518f 100644
--- a/changedetectionio/templates/diff-image.html
+++ b/changedetectionio/templates/diff-image.html
@@ -23,8 +23,21 @@
 </div>
 
 <div id="diff-ui">
-  <img style="max-width: 100%" src="{{ url_for('render_diff_image', uuid=uuid, compare_date=current_previous_version) }}" />
-    <img style="max-width: 100%" src="{{ url_for('render_single_image', uuid=uuid, history_timestamp=current_previous_version) }}" />
+    <script
+  defer
+  src="https://unpkg.com/img-comparison-slider@7/dist/index.js"
+></script>
+<link
+  rel="stylesheet"
+  href="https://unpkg.com/img-comparison-slider@7/dist/styles.css"
+/>
+
+<img-comparison-slider>
+  <img  slot="first"  src="{{ url_for('render_diff_image', uuid=uuid, compare_date=current_previous_version) }}" />
+    <img  slot="second" src="{{ url_for('render_single_image', uuid=uuid, history_timestamp=current_previous_version) }}" />
+
+</img-comparison-slider>
+
 </div>