From 43d55d27817d2ff287107eea3ea7821a799c8b50 Mon Sep 17 00:00:00 2001
From: Chinmay Pandhare <pandharechinmay882@gmail.com>
Date: Mon, 17 Jul 2017 11:23:35 +0530
Subject: [PATCH] demo for FisheyeGl - Bugfixes

---
 examples/fisheye.html | 33 +++++++++++++++++++--------------
 1 file changed, 19 insertions(+), 14 deletions(-)

diff --git a/examples/fisheye.html b/examples/fisheye.html
index 0537a4e7..b9e1cd9b 100644
--- a/examples/fisheye.html
+++ b/examples/fisheye.html
@@ -34,6 +34,7 @@
 
       <div class="panel ismod-image-select" style="display:flex;justify-content:center">
         <img src="grid.png" id="grid" style="cursor:pointer" class="original">
+        <img src="grid.png" id="demo" style="display:none">
       </div>
 
     </div>
@@ -54,27 +55,31 @@
       var canvas = document.createElement('canvas');
       var context = canvas.getContext('2d');
       var image = document.querySelector('#grid');
-      var datauri;
-      image.onload = function() {
+      var demoimage = document.querySelector('#demo');
+      var insrc;
+      demoimage.onload = function() {
         canvas.width = image.width;
         canvas.height = image.height;
         context.drawImage(image,0,0);
-        datauri = canvas.toDataURL();
+        insrc = canvas.toDataURL();
       }
+      demoimage.src = image.src;
+      const text = document.querySelector(".lead").innerHTML;
 
       var sequencer = ImageSequencer();
-      document.querySelector('#grid').onclick = function() {
-	if (image.className == "original") {
-          sequencer.loadImage(datauri).addSteps('fisheye-gl',{Fx:0.04,Fy:0.11,scale:1.1}).run(function(out){
-	    document.querySelector('#grid').src = out;
-	  });
-	  image.className = "processed";
-          document.querySelector("#lead").innerHTML = "Click on image to restore original";
+      image.onclick = function() {
+	      if (document.querySelector('#grid').getAttribute('class') == "original") {
+          sequencer.loadImage(insrc).addSteps('fisheye-gl',{Fx:0.04,Fy:0.11,scale:1.1}).run(function(out){
+	          document.querySelector('#grid').src = out;
+	        });
+	        document.querySelector('#grid').className = "processed";
+          document.querySelector(".lead").innerHTML = "Click on image to restore original";
         }
-	else {
-	  image.src = "grid.png";
-	  image.className = "original";
-	}
+	      else {
+	        document.querySelector('#grid').src = "grid.png";
+	        document.querySelector('#grid').className = "original";
+          document.querySelector(".lead").innerHTML = text;
+	      }
       }
 
     </script>