* ditch jQueryUI vanilla styles in favor of own ones.

* disable tracking for tooltips and make them behave more like regular ones
  (this also stops my fan from spinning up when using the intel map)

Improvements welcome. Tooltips are currently placed at the bottom of the
element instead of next to cursor. It seems it’s either tracking or placing
it not anywhere where one would expect a tooltip. I immediately regret
having chosen jQueryUI. It’s not very flexible and has awkward defaults.

code/boot.js

@@ -191,11 +191,12 @@ window.setupSidebarToggle = function() {
 
 window.setupTooltips = function() {
   $(document).tooltip({
-    // enable mouse tracking
-    track: true,
     // disable show/hide animation
-    show: false,
+    show: { effect: "hide", duration: 0 } ,
     hide: false,
+    open: function(event, ui) {
+      ui.tooltip.delay(300).fadeIn(0);
+    },
     content: function() {
       var title = $(this).attr('title');
 

main.js

@@ -57,8 +57,7 @@ document.getElementsByTagName('head')[0].innerHTML = ''
   + '<title>Ingress Intel Map</title>'
   + '<link rel="stylesheet" type="text/css" href="http://breunigs.github.com/ingress-intel-total-conversion/style.css?@@BUILDDATE@@"/>'
   + '<link rel="stylesheet" type="text/css" href="http://cdn.leafletjs.com/leaflet-0.5/leaflet.css"/>'
-  + '<link rel="stylesheet" type="text/css" href="http://fonts.googleapis.com/css?family=Coda"/>'
-  + '<link rel="stylesheet" type="text/css" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.10.0/themes/base/jquery-ui.css"/>';
+  + '<link rel="stylesheet" type="text/css" href="http://fonts.googleapis.com/css?family=Coda"/>';
 
 document.getElementsByTagName('body')[0].innerHTML = ''
   + '<div id="map">Loading, please wait</div>'

style.css

@@ -450,10 +450,6 @@ h3 {
   border: 1px solid #666;
 }
 
-.mods span[title=""] {
-  cursor: auto;
-}
-
 .res .mods span, .res .meter {
   border: 1px solid #0076b6;
 }
@@ -616,3 +612,17 @@ aside:nth-child(odd) span {
 #largepreview img {
   border: 2px solid #f8ff5e;
 }
+
+/* tooltips */
+.ui-tooltip {
+  background: #1E425D;
+  border: 1px solid #20A8B1;
+  box-shadow:0 0 7px #000;
+  color: #EEEEEE;
+  font-family: Verdana, sans-serif;
+  font-size:13px;
+  max-width: 300px;
+  padding: 8px;
+  position: absolute;
+  z-index: 9999;
+}