From 6df6a463aaf70bacf36df6ba369385ea251726f7 Mon Sep 17 00:00:00 2001
From: tanerochris <tanejuth@gmail.com>
Date: Mon, 16 May 2016 23:05:27 +0100
Subject: [PATCH] added a function to change save button background with a
 change in map edits made by users

---
 js/id/ui/save.js | 53 +++++++++++++++++++++++++++++++++++++++---------
 1 file changed, 43 insertions(+), 10 deletions(-)

diff --git a/js/id/ui/save.js b/js/id/ui/save.js
index c6ba54008..79a0ff783 100644
--- a/js/id/ui/save.js
+++ b/js/id/ui/save.js
@@ -1,6 +1,11 @@
 iD.ui.Save = function(context) {
     var history = context.history(),
-        key = iD.ui.cmd('⌘S');
+        key = iD.ui.cmd('⌘S'),
+        prevNumchange = 0 ,
+        color = 255 ,
+        saveBtnBackground = '';
+       
+       
 
     function saving() {
         return context.mode().id === 'save';
@@ -13,6 +18,38 @@ iD.ui.Save = function(context) {
         }
     }
 
+    function getBackground(numChanges) {
+        var percentage = 0;
+        var step = parseInt(255 / 50);
+        var background = '';
+        if(numChanges < 50) {
+            prevNumchange = numChanges;
+            return 'rgba(255,255,255)';
+           }
+        else if(numChanges == 50) {
+            prevNumchange = numChanges;
+            return 'rgb(255 , 255 , 136)';
+
+        }
+        else if(numChanges > 50 && numChanges < 100) {
+            if(prevNumchange < numChanges) {
+                color = color - step;
+                background = 'rgb(255, ' + color + ' , 0)';
+                }
+            else if(prevNumchange > numChanges) {
+                color = color +  step;
+                background = 'rgb(255 , '+ color + ' , 0)';
+                }
+            prevNumchange = numChanges;  
+            console.log(color);
+            return background;
+         }
+         else {
+            prevNumchange = numChanges;
+            return 'rgb(255 , 0 , 0 )';
+         }
+    }
+
     return function(selection) {
         var tooltip = bootstrap.tooltip()
             .placement('bottom')
@@ -49,19 +86,15 @@ iD.ui.Save = function(context) {
 
             tooltip.title(iD.ui.tooltipHtml(t(numChanges > 0 ?
                     'save.help' : 'save.no_changes'), key));
-
+            saveBtnBackground =  getBackground(numChanges);
             button
                 .classed('disabled', numChanges === 0)
                 .classed('has-count', numChanges > 0)
-                .classed('yellow', numChanges >= 50 && numChanges < 75)
-                .classed('orange', numChanges >= 75 && numChanges < 100)
-                .classed('red', numChanges >= 100);
-                  
+                .style('background' , saveBtnBackground);
             button.select('span.count')
-                .classed('yellow', numChanges >= 50 && numChanges < 75)
-                .classed('orange', numChanges >= 75 && numChanges < 100)
-                .classed('red', numChanges >= 100)
-                .text(numChanges);
+                .text(numChanges)
+                .style('background' , saveBtnBackground)
+                .style('opacity' ,  '0.5' );
                
         });