ecomp-sdk-app/src/main/webapp/static/fusion/raptor/js/cingular_button.js

   1 function CingularButton() {
   2 }
   3
   4 CingularButton.prototype = new GControl();
   5
   6 CingularButton.globals = {
   7         listOptionContainer: null,
   8         listOptionVisible: false
   9 };
  10
  11 CingularButton.prototype.initialize = function(map) {
  12         var globals = CingularButton.globals;
  13         var cbContainer;
  14         var listOptionContainer;
  15         var button;
  16         var buttonText;
  17
  18         cbContainer = document.createElement("div");
  19         cbContainer.style.zIndex = "150";
  20
  21         listOptionContainer = document.createElement("div");
  22         this.setMenuContainerStyle(listOptionContainer);
  23         this.initializeMonthListMenu(listOptionContainer);
  24
  25         //create button
  26         var gmwButtonContainer = document.createElement("div");
  27
  28         button = document.createElement("div");
  29         button.appendChild(document.createTextNode("Previous"));
  30         gmwButtonContainer.appendChild(button);
  31         NovaButton.prototype.setButtonStyle(button, true);
  32         GEvent.addDomListener(button, "click", previousMonthClickEvent);
  33
  34         button = document.createElement("div");
  35         button.appendChild(document.createTextNode("2008/01"));
  36         button.id = "currentMonthDiv";
  37         gmwButtonContainer.appendChild(button);
  38         NovaButton.prototype.setButtonStyle(button, true);
  39         GEvent.addDomListener(button, "click", currentMonthClickEvent);
  40
  41         button = document.createElement("div");
  42         button.appendChild(document.createTextNode("Next"));
  43         gmwButtonContainer.appendChild(button);
  44         NovaButton.prototype.setButtonStyle(button, true);
  45         GEvent.addDomListener(button, "click", nextMonthClickEvent);
  46
  47         cbContainer.appendChild(gmwButtonContainer);
  48         cbContainer.appendChild(listOptionContainer);
  49
  50         map.getContainer().appendChild(cbContainer);
  51
  52         //set global variables
  53         globals.listOptionContainer     = listOptionContainer;
  54         return cbContainer;
  55 }
  56
  57 CingularButton.prototype.getDefaultPosition = function() {
  58         return new GControlPosition(G_ANCHOR_TOP_LEFT, new GSize(5, 30));
  59 }
  60
  61 CingularButton.prototype.initializeMonthListMenu = function(container) {
  62         var menuUL = container.appendChild(document.createElement("ul"));
  63         this.setMenuStyle(menuUL);
  64
  65         var minMonth = 1;
  66         var minYear = 2008;
  67
  68         var maxMonth = 12;
  69         var maxYear = 2010;
  70
  71         for (currentYear = minYear; currentYear <= maxYear; currentYear++) {
  72           for (currentMonth = minMonth; currentMonth <= maxMonth; currentMonth++) {
  73             var menuItem = document.createElement("li");
  74             this.setMenuItemStyle(menuItem);
  75
  76             if (currentMonth < 10) {
  77               menuItem.appendChild(document.createTextNode(currentYear + "/0" + currentMonth));
  78               menuItem.id = currentYear + "/0" + currentMonth;
  79             }
  80             else {
  81                 menuItem.appendChild(document.createTextNode(currentYear + "/" + currentMonth));
  82               menuItem.id = currentYear + "/" + currentMonth;
  83             }
  84
  85             GEvent.addDomListener(menuItem, "click", menuItemOnClick);
  86             GEvent.addDomListener(menuItem, "mouseover", menuItemOnMouseOver);
  87             GEvent.addDomListener(menuItem, "mouseout", menuItemOnMouseOut);
  88             menuUL.appendChild(menuItem);
  89           }
  90         }
  91 }
  92
  93 CingularButton.prototype.showListOption = function(posX, posY) {
  94         var global = CingularButton.globals;
  95
  96         //position the menu at the given location
  97         if(typeof posX == "number") {
  98                 global.listOptionContainer.style.left = posX + "px";
  99         }
 100
 101         if(typeof posY == "number") {
 102                 global.listOptionContainer.style.top = posY + "px";
 103         }
 104
 105         //display the menu
 106         global.listOptionContainer.style.display = "block";
 107 }
 108
 109 CingularButton.prototype.setButtonStyle = function(button) {
 110         button.style.color = "black";
 111         button.style.backgroundColor = "white";
 112         button.style.fontFamily = "Verdana";
 113         button.style.fontSize = "12px";
 114         button.style.fontWeight= "normal";
 115         button.style.border = "1px solid gray";
 116         button.style.padding = "0px";
 117         button.style.marginBottom = "0px";
 118         button.style.textAlign = "center";
 119         button.style.width = "7em";
 120         button.style.height = "15px";
 121         button.style.cursor = "pointer";
 122
 123         if(button.addEventListener) {
 124                 button.style.cssFloat   = "left";
 125         }
 126         else {
 127                 button.style.styleFloat = "left";
 128         }
 129 }
 130
 131 CingularButton.prototype.setMenuContainerStyle = function(menuContainer) {
 132         menuContainer.style.position = "absolute";
 133         menuContainer.style.overflow = "auto";
 134         menuContainer.style.height = "200px";
 135         menuContainer.style.display = "none";
 136         menuContainer.style.background  = "#FFFFF0";
 137 }
 138
 139 CingularButton.prototype.setMenuStyle = function(menu) {
 140   menu.style.margin     = "2";
 141   menu.style.width = "100px";
 142   menu.style.padding    = "0px 30px 0px 0px";
 143   menu.style.listStyleType= "none";
 144   menu.style.background = "#FFFFF0";
 145 }
 146
 147 CingularButton.prototype.setMenuItemStyle = function(menuItem) {
 148         menuItem.style.padding  = "4px 3px 4px 33px";
 149         menuItem.style.fontFamily = "Vardana, Arial, Helvetica, sans-serif";
 150         menuItem.style.fontSize = "10pt";
 151         menuItem.style.color    = "#333";
 152         menuItem.style.cursor   = "default";
 153         menuItem.style.background = "no-repeat left center";
 154 }
 155
 156 var previousMonthClickEvent = function() {
 157   updateImage(-1);
 158   NovaButton.prototype.initializeLayerDiv(NovaButton.globals.layerOptionContainer);
 159 }
 160
 161 var nextMonthClickEvent = function() {
 162         updateImage(1);
 163         NovaButton.prototype.initializeLayerDiv(NovaButton.globals.layerOptionContainer);
 164 }
 165
 166 function currentMonthClickEvent(e) {
 167   if (CingularButton.globals.listOptionVisible) {
 168           CingularButton.globals.listOptionVisible = false;
 169           CingularButton.globals.listOptionContainer.style.display = "none";
 170           return;
 171         }
 172
 173         if (NovaButton.globals.layerOptionContainer.style.display != "none"){
 174                 NovaButton.prototype.showLayerClickEvent();
 175   }
 176   if (NovaButton.globals.searchOptionContainer.style.display != "none"){
 177                 NovaButton.prototype.searchClickEvent();
 178   }
 179
 180   if (!e) {
 181         e = window.event;
 182         }
 183
 184         e.cancelBubble = true;
 185
 186         if (e.stopPropagation) {
 187                 e.stopPropagation();
 188         }
 189
 190         var posX = this.offsetLeft;
 191         var posY = this.offsetTop;
 192
 193         CingularButton.prototype.showListOption(posX, posY + this.offsetHeight);
 194         CingularButton.globals.listOptionVisible = true;
 195 }
 196
 197 function menuItemOnClick() {
 198   updateImage(this.id);
 199   CingularButton.globals.listOptionVisible = false;
 200   CingularButton.globals.listOptionContainer.style.display = "none";
 201   NovaButton.prototype.initializeLayerDiv(NovaButton.globals.layerOptionContainer);
 202 }
 203
 204
 205 function menuItemOnMouseOver() {
 206         this.style.padding      = "3px 2px 3px 32px";
 207         this.style.color        = "#000";
 208         this.style.border       = "1px solid #06C";
 209         this.style.backgroundColor = "#fec";
 210 }
 211
 212 function menuItemOnMouseOut() {
 213         this.style.padding      = "4px 3px 4px 33px";
 214         this.style.color        = "#333";
 215         this.style.border       = "none";
 216         this.style.backgroundColor = "";
 217 }