From af1b376cdfe07a8bb395239a121eb388606ee493 Mon Sep 17 00:00:00 2001
From: Yuchen Wang <yuchen@naomi-DX4840.(none)>
Date: Tue, 15 Nov 2011 16:08:05 -0500
Subject: [PATCH] CC-3029: Graphic design for the version notification feature

- use classes in VersionNotify.php for displaying icons instead of inline styling
- change underscore to hyphen so that naming convention is consistent with the
  rest in style.css
---
 .../views/helpers/VersionNotify.php           | 17 +++++++-------
 airtime_mvc/public/css/styles.css             | 22 +++++++++----------
 .../js/airtime/dashboard/versiontooltip.js    | 10 ++++-----
 3 files changed, 24 insertions(+), 25 deletions(-)

diff --git a/airtime_mvc/application/views/helpers/VersionNotify.php b/airtime_mvc/application/views/helpers/VersionNotify.php
index e4ece3df3..655843f0e 100644
--- a/airtime_mvc/application/views/helpers/VersionNotify.php
+++ b/airtime_mvc/application/views/helpers/VersionNotify.php
@@ -33,25 +33,24 @@ class Airtime_View_Helper_VersionNotify extends Zend_View_Helper_Abstract{
                 - (intval($curMatch[1]) * 10 + intval($curMatch[2]));
         
         // Pick icon
-        $bg = "/css/images/";
         if(($diff == 0 && $current == $latest) || $diff < 0) {
             // current version is up to date
-            $bg .= "icon_uptodate.png";
+            $class = "uptodate";
         } else if($diff <= 2) {
             // 2 or less major versions back
-            $bg .= "icon_update.png";
+            $class = "update";
         } else if($diff == 3) {
             // 3 major versions back
-            $bg .= "icon_update2.png";
+            $class = "update2";
         } else {
             // more than 3 major versions back
-            $bg .= "icon_outdated.png";
+            $class = "outdated";
         }
         
-        $result = "<div id='version_diff' style='display:none'>" . $diff . "</div>"
-                . "<div id='version_current' style='display:none'>" . $current . "</div>"
-                . "<div id='version_latest' style='display:none'>" . $latest . "</div>"
-                . "<div id='version_icon' style='background-image: url(" . $bg . ");'></div>";
+        $result = "<div id='version-diff' style='display:none'>" . $diff . "</div>"
+                . "<div id='version-current' style='display:none'>" . $current . "</div>"
+                . "<div id='version-latest' style='display:none'>" . $latest . "</div>"
+                . "<div id='version-icon' class='" . $class . "'></div>";
         return $result;
     }
 }
diff --git a/airtime_mvc/public/css/styles.css b/airtime_mvc/public/css/styles.css
index b1b4e37f9..04fc58027 100644
--- a/airtime_mvc/public/css/styles.css
+++ b/airtime_mvc/public/css/styles.css
@@ -58,9 +58,9 @@ select {
 }
 
 /* Version Notification Starts*/
-#version_icon {
+#version-icon {
 	position:absolute;
-	right:98px;
+	right:96px;
 	top:104px;
 	height:35px;
 	width:35px;
@@ -68,19 +68,19 @@ select {
 	display:block;
     cursor:pointer;
     background-repeat:no-repeat;
-    background-position:center; 
+    background-position:center;
 }
-#version_icon.outdated {
-	background-image:url(images/icon_outdated.png);
+#version-icon.outdated {
+	background-image:url(/css/images/icon_outdated.png);
 }
-#version_icon.update2 {
-	background-image:url(images/icon_update2.png);
+#version-icon.update2 {
+	background-image:url(/css/images/icon_update2.png);
 }
-#version_icon.update {
-	background-image:url(images/icon_update.png);
+#version-icon.update {
+	background-image:url(/css/images/icon_update.png);
 }
-#version_icon.uptodate {
-	background-image:url(images/icon_uptodate.png);
+#version-icon.uptodate {
+	background-image:url(/css/images/icon_uptodate.png);
 }
 
 #ui-tooltip-version a {
diff --git a/airtime_mvc/public/js/airtime/dashboard/versiontooltip.js b/airtime_mvc/public/js/airtime/dashboard/versiontooltip.js
index ab96e6759..e428cc7f3 100644
--- a/airtime_mvc/public/js/airtime/dashboard/versiontooltip.js
+++ b/airtime_mvc/public/js/airtime/dashboard/versiontooltip.js
@@ -23,21 +23,21 @@ function getContent() {
  * Get major version difference b/w current and latest version, in int
  */
 function getVersionDiff() {
-    return parseInt($("#version_diff").html());
+    return parseInt($("#version-diff").html());
 }
 
 /**
  * Get the current version
  */
 function getCurrentVersion() {
-    return $("#version_current").html();
+    return $("#version-current").html();
 }
 
 /**
  * Get the latest version
  */
 function getLatestVersion() {
-    return $("#version_latest").html();
+    return $("#version-latest").html();
 }
 
 /**
@@ -62,7 +62,7 @@ function getLatestLink() {
  * Sets up the tooltip for version notification
  */
 function setupVersionQtip(){
-    var qtipElem = $('#version_icon');
+    var qtipElem = $('#version-icon');
     if (qtipElem.length > 0){
         qtipElem.qtip({
             id: 'version',
@@ -92,7 +92,7 @@ function setupVersionQtip(){
 }
 
 $(document).ready(function() {
-    if($('#version_icon').length > 0) {
+    if($('#version-icon').length > 0) {
         setupVersionQtip();
     }
 });
\ No newline at end of file