Ignore:
Timestamp:
02/14/12 17:50:22 (13 years ago)
Author:
tjcschipper
Message:

Metro interface, selector werkt bijna! (Alleen move to dashboard nog niet, rest is prima (en de icons zijn lelijk).

File:
1 edited

Legend:

Unmodified
Added
Removed
  • Dev/branches/Cartis/Tiles preview/js/generalScripts.js

    r258 r259  
    155155    return document.getElementById(s);
    156156}
    157 
    158 // Function for getting the absolute position of the top left corner of an element, relative to the window
    159 function getPos(element) {
    160     var posX = posY = 0;
    161     if (element.offsetParent) {
    162         do {
    163             posX += element.offsetLeft;
    164             posY += element.offsetTop;
    165         } while (element = element.offsetParent);
    166     }
    167    
    168     var result = {
    169         X: posX,
    170         Y: posY
    171     }
    172     return result;
    173 }
    174 
    175 // TODO: this is a broken version of the above function, to be used during the demo ONLY! (Else the dropdown menu does not work correctly...
    176 // Fix/remove as soon as possible
    177 function getWrongPos(element) {
    178     var posX = posY = 0;
    179     if (element.offsetParent) {
    180         do {
    181             posX += element.offsetLeft;
    182             posY += element.offsetTop;
    183         } while (element = element.offSetParent);
    184     }
    185    
    186     var result = {
    187         X: posX,
    188         Y: posY
    189     }
    190     return result;
    191 }
    192 
    193 // Returns the computed width of an element
    194 function getWidth(element) {
    195     var width = 0;
    196     if (element.offsetWidth) {
    197         width = element.offsetWidth;
    198     }
    199    
    200     return width;
    201 }
    202 
    203 // Returns the computer size of an element
    204 function getSize(element) {
    205     var size = {
    206         X: null,
    207         Y: null
    208     }
    209     if (element.offsetWidth) {
    210         size.X = element.offsetWidth;
    211         size.Y = element.offsetHeight;
    212     }
    213    
    214     return size;
    215 }
    216 
    217 // Drop down menu implementation. Supports three levels: Base button, 1st level categories, and 2nd level links
    218 // TODO: getPos functie werkte eerst niet goed, menu offset is nog beetje whack. Betere manier van dropdown menu vinden en voor nu even de getPos functie stuk laten?
    219 function DDMenu() {
    220     // Initialize function, setting all needed variables.
    221     var instance = this;
    222     this.closeTimer = 0;
    223     this.ddMenuItem = null;
    224     this.timeout = 350;
    225     this.visible = false;
    226     this.menuElement = null;
    227     this.parentButton = null
    228    
    229     this.Init = function(id1, id2) {   
    230         instance.menuElement = ge(id1);
    231         instance.parentButton = ge(id2);
    232     }
    233    
    234     this.SetCloseTimer = function() {
    235         //debugger;
    236         instance.closeTimer = window.setTimeout(instance.Close, instance.timeout);
    237     }
    238    
    239     this.Close = function() {
    240         if (instance.ddMenuItem) {
    241             instance.ddMenuItem.style.visibility = "hidden";
    242         }
    243         instance.Toggle();
    244        
    245     }
    246    
    247     this.CancelCloseTimer = function() {
    248         if (instance.closeTimer) {
    249             window.clearTimeout(instance.closeTimer);
    250             instance.closeTimer = null;
    251         }
    252     }
    253    
    254     this.Open = function(id) {
    255         instance.CancelCloseTimer();
    256         if (instance.ddMenuItem) {
    257             instance.ddMenuItem.style.visibility = "hidden";
    258         }
    259        
    260         instance.ddMenuItem = ge(id);
    261         instance.ddMenuItem.style.visibility = "visible";
    262         var parentPos = getWrongPos(instance.ddMenuItem.parentNode);
    263         var parentWidth = getWidth(instance.ddMenuItem.parentNode);
    264         instance.ddMenuItem.style.left = (parentPos.X + parentWidth)+"px";
    265         instance.ddMenuItem.style.top = parentPos.Y+"px";
    266        
    267     }
    268    
    269     this.Toggle = function() {
    270         //debugger;
    271         if (instance.visible) {
    272             // Hide the menu
    273             instance.menuElement.style.visibility = "hidden";
    274             instance.parentButton.className = "";
    275             instance.visible = false;
    276         }
    277         else{
    278             //Show the menu
    279             if (instance.menuElement) {
    280                 instance.menuElement.style.visibility = "visible";
    281                 instance.parentButton.className = "down";
    282             }
    283             instance.visible = true;
    284         }
    285     }
    286 }
    287 
    288 function manualEventFire(element, rawEvent) {
    289     // Attempts to fire a raw DOM event on an element
    290    
    291     try {
    292         element = document.getElementById(element);
    293         if (element.fireEvent) {
    294             element.fireEvent("on"+rawEvent.type, rawEvent);
    295             return true;
    296         }
    297         else if (element.dispatchEvent) {
    298             element.dispatchEvent(rawEvent);
    299             return true;
    300         }
    301     } catch (e) {
    302     }
    303     return false;
    304 }
Note: See TracChangeset for help on using the changeset viewer.