From b055c75667ff3a880e0778cb0ed1ac788633e29e Mon Sep 17 00:00:00 2001
From: Will Toohey <will@mon.im>
Date: Mon, 2 Nov 2015 18:07:36 +1000
Subject: [PATCH] Alternate low quality blur, fix cobweb over UI

---
 css/hues-h.css   |  1 +
 index-min.html   |  2 +-
 index.html       |  2 +-
 js/HuesCanvas.js | 20 ++++++++++++++++----
 4 files changed, 19 insertions(+), 6 deletions(-)

diff --git a/css/hues-h.css b/css/hues-h.css
index 712cdde..04855f5 100644
--- a/css/hues-h.css
+++ b/css/hues-h.css
@@ -174,6 +174,7 @@
 .hues-h-topleft, .hues-h-topright, .hues-h-bottomright {
     position: absolute;
     background-repeat: no-repeat;
+    z-index: -9;
 }
 
 .hues-h-topleft, .hues-h-topright {
diff --git a/index-min.html b/index-min.html
index a0787f2..d169c9b 100644
--- a/index-min.html
+++ b/index-min.html
@@ -93,7 +93,7 @@
                                     <li>[R] Resource packs</li>
                                     <li>[O] Options</li>
                                     <li>[I] Information</li>
-                                    <li>[1-4] Change UI</li>
+                                    <li>[1-5] Change UI</li>
                                 </ul>
                             </div>
                         </div>
diff --git a/index.html b/index.html
index 1b11e5e..86ce65c 100644
--- a/index.html
+++ b/index.html
@@ -104,7 +104,7 @@
                                     <li>[R] Resource packs</li>
                                     <li>[O] Options</li>
                                     <li>[I] Information</li>
-                                    <li>[1-4] Change UI</li>
+                                    <li>[1-5] Change UI</li>
                                 </ul>
                             </div>
                         </div>
diff --git a/js/HuesCanvas.js b/js/HuesCanvas.js
index 819b0e4..2c3fb04 100644
--- a/js/HuesCanvas.js
+++ b/js/HuesCanvas.js
@@ -135,12 +135,24 @@ HuesCanvas.prototype.redraw = function() {
             this.canvas.globalAlpha = this.blurAlpha;
         }
         if(this.xBlur) {
-            for(var i=-1; i<=1; i+= this.blurDelta) {
-                this.canvas.drawImage(bitmap, Math.floor(this.blurDistance * i) + offset, 0);
+            if(this.blurIterations < 0) {
+                this.canvas.globalAlpha = 1;
+                this.canvas.drawImage(bitmap, Math.floor(offset - this.blurDistance/2), 0,
+                    bitmap.width + this.blurDistance, bitmap.height);
+            } else {
+                for(var i=-1; i<=1; i+= this.blurDelta) {
+                    this.canvas.drawImage(bitmap, Math.floor(this.blurDistance * i) + offset, 0);
+                }
             }
         } else if(this.yBlur) {
-            for(var i=-1; i<=1; i+= this.blurDelta) {
-                this.canvas.drawImage(bitmap, offset, Math.floor(this.blurDistance * i));
+            if(this.blurIterations < 0) {
+                this.canvas.globalAlpha = 1;
+                this.canvas.drawImage(bitmap, offset, Math.floor(-this.blurDistance/2),
+                    bitmap.width, bitmap.height + this.blurDistance);
+            } else {
+                for(var i=-1; i<=1; i+= this.blurDelta) {
+                    this.canvas.drawImage(bitmap, offset, Math.floor(this.blurDistance * i));
+                }
             }
         } else {
             this.canvas.globalAlpha = 1;