ginebra2/chrome/bedrockchrome/contextmenu.snippet/contextmenu.js
author hgs
Tue, 29 Jun 2010 00:46:29 -0400
changeset 3 0954f5dd2cd0
parent 0 1450b09d0cfd
child 16 3c88a81ff781
permissions -rw-r--r--
201026
Ignore whitespace changes - Everywhere: Within whitespace: At end of lines:
3
hgs
parents: 0
diff changeset
     1
var cm_TheContextMenu;
hgs
parents: 0
diff changeset
     2
hgs
parents: 0
diff changeset
     3
// Return true if the given element's className includes the given class.
hgs
parents: 0
diff changeset
     4
function hasClass(ele,cls) {
hgs
parents: 0
diff changeset
     5
    return ele.className.match(new RegExp('(\\s|^)'+cls+'(\\s|$)'));
hgs
parents: 0
diff changeset
     6
}
hgs
parents: 0
diff changeset
     7
hgs
parents: 0
diff changeset
     8
// Remove a class from an element's className.
hgs
parents: 0
diff changeset
     9
function removeClass(ele,cls) {
hgs
parents: 0
diff changeset
    10
    if (hasClass(ele,cls)) {
hgs
parents: 0
diff changeset
    11
        var reg = new RegExp('(\\s|^)'+cls+'(\\s|$)');
hgs
parents: 0
diff changeset
    12
        ele.className=ele.className.replace(reg,' ');
0
1450b09d0cfd Revision: 201015
Dremov Kirill (Nokia-D-MSW/Tampere) <kirill.dremov@nokia.com>
parents:
diff changeset
    13
    }
1450b09d0cfd Revision: 201015
Dremov Kirill (Nokia-D-MSW/Tampere) <kirill.dremov@nokia.com>
parents:
diff changeset
    14
}
1450b09d0cfd Revision: 201015
Dremov Kirill (Nokia-D-MSW/Tampere) <kirill.dremov@nokia.com>
parents:
diff changeset
    15
3
hgs
parents: 0
diff changeset
    16
function ContextMenu(snippetId, contentView) {
hgs
parents: 0
diff changeset
    17
    this.snippetId = snippetId;
hgs
parents: 0
diff changeset
    18
    this.mainDiv = undefined;
hgs
parents: 0
diff changeset
    19
    this.tailEl = undefined;
hgs
parents: 0
diff changeset
    20
    this.contentView = contentView;
hgs
parents: 0
diff changeset
    21
    this.showTimeoutId = 0;
hgs
parents: 0
diff changeset
    22
    // Width of a tab with no text, just the icon.  Icons must all be the same width.
hgs
parents: 0
diff changeset
    23
    // Update this if icon size or tab border width etc. changes -- or better yet, determine it dynamically.
hgs
parents: 0
diff changeset
    24
    this.normalTabWidth = 64;
hgs
parents: 0
diff changeset
    25
    // Height of the menu is the max possible height to be used when positioning the snippet
hgs
parents: 0
diff changeset
    26
    this.menuHeight = 272;
hgs
parents: 0
diff changeset
    27
hgs
parents: 0
diff changeset
    28
    // ContextMenu is a singleton to avoid problems with scope-chaining in some of the
hgs
parents: 0
diff changeset
    29
    // callbacks that it uses.  See handleTabActivate.
hgs
parents: 0
diff changeset
    30
    if (cm_TheContextMenu != undefined) app.debug("ERROR: cm_TheContextMenu must be a singleton");
hgs
parents: 0
diff changeset
    31
    cm_TheContextMenu = this;
hgs
parents: 0
diff changeset
    32
hgs
parents: 0
diff changeset
    33
    // Create tabs and their corresponding menus based on JSON data.
hgs
parents: 0
diff changeset
    34
    this.createTabsElement = function(data) {
hgs
parents: 0
diff changeset
    35
        this.mainDiv = document.createElement("div");
hgs
parents: 0
diff changeset
    36
        this.mainDiv.setAttribute("class", "ContextMenuDiv");
hgs
parents: 0
diff changeset
    37
        this.mainDiv.setAttribute("id", "cm_mainDivId");
hgs
parents: 0
diff changeset
    38
hgs
parents: 0
diff changeset
    39
        var tabsDiv = document.createElement("div");
hgs
parents: 0
diff changeset
    40
        tabsDiv.setAttribute("class", "TabsDiv");
hgs
parents: 0
diff changeset
    41
        tabsDiv.setAttribute("id", "cm_tabsDivId");
hgs
parents: 0
diff changeset
    42
hgs
parents: 0
diff changeset
    43
        var menuDiv = document.createElement("div");
hgs
parents: 0
diff changeset
    44
        menuDiv.setAttribute("class", "MenuDiv");
hgs
parents: 0
diff changeset
    45
        menuDiv.setAttribute("id", "cm_menuDivId");
hgs
parents: 0
diff changeset
    46
hgs
parents: 0
diff changeset
    47
        var tabsUl = document.createElement("ul");
hgs
parents: 0
diff changeset
    48
        tabsUl.setAttribute("class", "TabsUl");
hgs
parents: 0
diff changeset
    49
        tabsUl.setAttribute("id", "cm_tabsUlId");
hgs
parents: 0
diff changeset
    50
        tabsDiv.appendChild(tabsUl);
hgs
parents: 0
diff changeset
    51
hgs
parents: 0
diff changeset
    52
        var currentTabFound = false;
hgs
parents: 0
diff changeset
    53
hgs
parents: 0
diff changeset
    54
        // Iterate through the list of tabs.
hgs
parents: 0
diff changeset
    55
        for (var i=0; i < data.tabs.length; i++) {
hgs
parents: 0
diff changeset
    56
            var tab = data.tabs[i];
hgs
parents: 0
diff changeset
    57
            if (tab.visible != undefined) {
hgs
parents: 0
diff changeset
    58
                if (!tab.visible()) {
hgs
parents: 0
diff changeset
    59
                    continue;
hgs
parents: 0
diff changeset
    60
                }
hgs
parents: 0
diff changeset
    61
            }
hgs
parents: 0
diff changeset
    62
hgs
parents: 0
diff changeset
    63
            // Create the tab.
hgs
parents: 0
diff changeset
    64
            var tabEl = document.createElement("li");
hgs
parents: 0
diff changeset
    65
            tabsUl.appendChild(tabEl);
hgs
parents: 0
diff changeset
    66
            
hgs
parents: 0
diff changeset
    67
            var tabDiv = document.createElement("div");
hgs
parents: 0
diff changeset
    68
            tabEl.appendChild(tabDiv);
hgs
parents: 0
diff changeset
    69
hgs
parents: 0
diff changeset
    70
            var iconEl = undefined;
hgs
parents: 0
diff changeset
    71
            var iconHighlightedEl = undefined;
hgs
parents: 0
diff changeset
    72
            
hgs
parents: 0
diff changeset
    73
            // Create the tab's icons.
hgs
parents: 0
diff changeset
    74
            if (tab.icon != undefined) {
hgs
parents: 0
diff changeset
    75
                iconEl = document.createElement("img");
hgs
parents: 0
diff changeset
    76
                iconEl.setAttribute("id", "icon");
hgs
parents: 0
diff changeset
    77
                iconEl.setAttribute("src", tab.icon);
hgs
parents: 0
diff changeset
    78
                tabDiv.appendChild(iconEl);
hgs
parents: 0
diff changeset
    79
            }
hgs
parents: 0
diff changeset
    80
            if (tab.iconHighlighted != undefined) {
hgs
parents: 0
diff changeset
    81
                iconHighlightedEl = document.createElement("img");
hgs
parents: 0
diff changeset
    82
                iconHighlightedEl.setAttribute("id", "iconHighlighted");
hgs
parents: 0
diff changeset
    83
                iconHighlightedEl.setAttribute("src", tab.iconHighlighted);
hgs
parents: 0
diff changeset
    84
                tabDiv.appendChild(iconHighlightedEl);
hgs
parents: 0
diff changeset
    85
            }
hgs
parents: 0
diff changeset
    86
hgs
parents: 0
diff changeset
    87
            // Create the tab's text.
hgs
parents: 0
diff changeset
    88
            if (tab.text != undefined) {
hgs
parents: 0
diff changeset
    89
                var anchorEl = document.createElement("a");
hgs
parents: 0
diff changeset
    90
                tabDiv.appendChild(anchorEl);
hgs
parents: 0
diff changeset
    91
                var textEl = document.createTextNode(tab.text);
hgs
parents: 0
diff changeset
    92
                anchorEl.appendChild(textEl);
hgs
parents: 0
diff changeset
    93
            }
hgs
parents: 0
diff changeset
    94
hgs
parents: 0
diff changeset
    95
            // Create the menu for this tab.
hgs
parents: 0
diff changeset
    96
            var menuEl = this.createMenuElement(tab);
hgs
parents: 0
diff changeset
    97
            menuDiv.appendChild(menuEl);
hgs
parents: 0
diff changeset
    98
hgs
parents: 0
diff changeset
    99
            var tabClassName;
hgs
parents: 0
diff changeset
   100
            if (tab.current == "true") {
hgs
parents: 0
diff changeset
   101
                // This is the current, or selected, tab.
hgs
parents: 0
diff changeset
   102
                tabClassName = "ViewContext_HighlightedTab";
hgs
parents: 0
diff changeset
   103
                tabDiv.className = "ViewContext_HighlightedTabDiv";
hgs
parents: 0
diff changeset
   104
                if(iconEl != undefined) {
hgs
parents: 0
diff changeset
   105
                    iconEl.setAttribute("style", "display: none;");
hgs
parents: 0
diff changeset
   106
                }
hgs
parents: 0
diff changeset
   107
                currentTabFound = true;
hgs
parents: 0
diff changeset
   108
            }
hgs
parents: 0
diff changeset
   109
            else {
hgs
parents: 0
diff changeset
   110
                // Not selected.
hgs
parents: 0
diff changeset
   111
                tabClassName = "ViewContext_NormalTab";
hgs
parents: 0
diff changeset
   112
                tabDiv.className = "ViewContext_NormalTabDiv";
hgs
parents: 0
diff changeset
   113
                if(iconHighlightedEl != undefined) {
hgs
parents: 0
diff changeset
   114
                    iconHighlightedEl.setAttribute("style", "display: none;");
hgs
parents: 0
diff changeset
   115
                }
hgs
parents: 0
diff changeset
   116
hgs
parents: 0
diff changeset
   117
                // Hide its menu.
hgs
parents: 0
diff changeset
   118
                menuEl.style.display = "none";
hgs
parents: 0
diff changeset
   119
            }
hgs
parents: 0
diff changeset
   120
hgs
parents: 0
diff changeset
   121
            if (tab.disabled == "true") {
hgs
parents: 0
diff changeset
   122
                // The tab is disabled, add the appropriate CSS class to it.
hgs
parents: 0
diff changeset
   123
                tabClassName += " ViewContext_DisabledTab";
hgs
parents: 0
diff changeset
   124
            }
hgs
parents: 0
diff changeset
   125
hgs
parents: 0
diff changeset
   126
            tabEl.className = tabClassName;
hgs
parents: 0
diff changeset
   127
hgs
parents: 0
diff changeset
   128
            // Set up callback to show the menu that corresponds to this tab.
hgs
parents: 0
diff changeset
   129
            tabEl.onmouseup = this.handleTabActivate;
hgs
parents: 0
diff changeset
   130
            tabEl.cm_menu = menuEl;
hgs
parents: 0
diff changeset
   131
hgs
parents: 0
diff changeset
   132
            // Remember that this tab is disabled.
hgs
parents: 0
diff changeset
   133
            tabEl.cm_disabled = tab.disabled == "true";
hgs
parents: 0
diff changeset
   134
        }
hgs
parents: 0
diff changeset
   135
hgs
parents: 0
diff changeset
   136
        // If a "current" tab was not specified, highlight the first tab and display its menu.
hgs
parents: 0
diff changeset
   137
        if (!currentTabFound) {
hgs
parents: 0
diff changeset
   138
            var firstTabEl = tabsUl.firstChild;
hgs
parents: 0
diff changeset
   139
            firstTabEl.className = "ViewContext_HighlightedTab";
hgs
parents: 0
diff changeset
   140
            firstTabEl.firstChild.className = "ViewContext_HighlightedTabDiv";
hgs
parents: 0
diff changeset
   141
            firstTabEl.cm_menu.style.display = "";
hgs
parents: 0
diff changeset
   142
        }
hgs
parents: 0
diff changeset
   143
hgs
parents: 0
diff changeset
   144
//        this.tailEl = document.createElement("img");
hgs
parents: 0
diff changeset
   145
//        this.mainDiv.appendChild(this.tailEl);
hgs
parents: 0
diff changeset
   146
//        this.tailEl.setAttribute("id", "cm_tailId");
hgs
parents: 0
diff changeset
   147
//        this.tailEl.setAttribute("src", "contextmenu.snippet/icons/menu_tail.png");
hgs
parents: 0
diff changeset
   148
hgs
parents: 0
diff changeset
   149
        this.mainDiv.appendChild(tabsDiv);
hgs
parents: 0
diff changeset
   150
        this.mainDiv.appendChild(menuDiv);
hgs
parents: 0
diff changeset
   151
        return this.mainDiv;
hgs
parents: 0
diff changeset
   152
    }
hgs
parents: 0
diff changeset
   153
hgs
parents: 0
diff changeset
   154
    // Create a single menu based on the given data structure.
hgs
parents: 0
diff changeset
   155
    this.createMenuElement = function(data) {
hgs
parents: 0
diff changeset
   156
        // Create menu list.
hgs
parents: 0
diff changeset
   157
        var menuUl = document.createElement("ul");
hgs
parents: 0
diff changeset
   158
        menuUl.setAttribute("class", "MenuUl");
hgs
parents: 0
diff changeset
   159
hgs
parents: 0
diff changeset
   160
        for (var i=0; i < data.menuItems.length; i++) {
hgs
parents: 0
diff changeset
   161
            var menuItem = data.menuItems[i];
hgs
parents: 0
diff changeset
   162
hgs
parents: 0
diff changeset
   163
            // Create the item.
hgs
parents: 0
diff changeset
   164
            var itemLi = document.createElement("li");
hgs
parents: 0
diff changeset
   165
            itemLi.setAttribute("class", "MenuLi");
hgs
parents: 0
diff changeset
   166
            var itemSpan = document.createElement("div");
hgs
parents: 0
diff changeset
   167
hgs
parents: 0
diff changeset
   168
            // Is it a row if items? enumerate that as a ul inside of this outer li
hgs
parents: 0
diff changeset
   169
            if(menuItem.menuRow != undefined) {
hgs
parents: 0
diff changeset
   170
                var menuRowUl = document.createElement("ul");
hgs
parents: 0
diff changeset
   171
                menuRowUl.setAttribute("class", "MenuRowUl");
hgs
parents: 0
diff changeset
   172
                itemSpan.appendChild(menuRowUl);
hgs
parents: 0
diff changeset
   173
hgs
parents: 0
diff changeset
   174
                for(var j=0; j < menuItem.menuRow.length; j++)
hgs
parents: 0
diff changeset
   175
                {
hgs
parents: 0
diff changeset
   176
                    var menuRowItem = menuItem.menuRow[j];
hgs
parents: 0
diff changeset
   177
                    
hgs
parents: 0
diff changeset
   178
                    var rowItemLi = document.createElement("li");
hgs
parents: 0
diff changeset
   179
                    rowItemLi.setAttribute("class", "MenuRowLi");
hgs
parents: 0
diff changeset
   180
                    menuRowUl.appendChild(rowItemLi);
hgs
parents: 0
diff changeset
   181
                    
hgs
parents: 0
diff changeset
   182
                    // bind to mouseup
hgs
parents: 0
diff changeset
   183
                    rowItemLi.onmouseup =  (function(handler) {
hgs
parents: 0
diff changeset
   184
                        return function() {
hgs
parents: 0
diff changeset
   185
                            if (handler != undefined)
hgs
parents: 0
diff changeset
   186
                                handler();
hgs
parents: 0
diff changeset
   187
                            this.hide();
hgs
parents: 0
diff changeset
   188
                        }.bind(this)
hgs
parents: 0
diff changeset
   189
                    }.bind(this))(menuRowItem.onclick);
hgs
parents: 0
diff changeset
   190
hgs
parents: 0
diff changeset
   191
                    if (menuRowItem.text != undefined) {
hgs
parents: 0
diff changeset
   192
                        var textEl = document.createTextNode(menuRowItem.text);
hgs
parents: 0
diff changeset
   193
                        rowItemLi.appendChild(textEl);
hgs
parents: 0
diff changeset
   194
                    }
hgs
parents: 0
diff changeset
   195
                }
hgs
parents: 0
diff changeset
   196
            }
hgs
parents: 0
diff changeset
   197
            else {
hgs
parents: 0
diff changeset
   198
                itemLi.className += " RegularMenuLi";
hgs
parents: 0
diff changeset
   199
                if (menuItem.disabled == "true" || data.disabled == "true") {
hgs
parents: 0
diff changeset
   200
                    // Disabled item.
hgs
parents: 0
diff changeset
   201
                    itemLi.className += " ViewContext_DisabledMenuItem";
hgs
parents: 0
diff changeset
   202
                }
hgs
parents: 0
diff changeset
   203
                else {
hgs
parents: 0
diff changeset
   204
                    // Enabled item.  Set up the onmouseup handler.
hgs
parents: 0
diff changeset
   205
                    itemLi.onmouseup = (function(handler) {
hgs
parents: 0
diff changeset
   206
                        return function() {
hgs
parents: 0
diff changeset
   207
                            if (handler != undefined)
hgs
parents: 0
diff changeset
   208
                                handler();
hgs
parents: 0
diff changeset
   209
                            this.hide();
hgs
parents: 0
diff changeset
   210
                        }.bind(this)
hgs
parents: 0
diff changeset
   211
                    }.bind(this))(menuItem.onclick);
hgs
parents: 0
diff changeset
   212
                }
hgs
parents: 0
diff changeset
   213
hgs
parents: 0
diff changeset
   214
                itemLi.onmouseover = function() {
hgs
parents: 0
diff changeset
   215
                    this.className += " MouseOverItem";
hgs
parents: 0
diff changeset
   216
                }.bind(itemLi)
hgs
parents: 0
diff changeset
   217
hgs
parents: 0
diff changeset
   218
                itemLi.onmouseout = function() {
hgs
parents: 0
diff changeset
   219
                    removeClass(this, "MouseOverItem");
hgs
parents: 0
diff changeset
   220
                }.bind(itemLi)
hgs
parents: 0
diff changeset
   221
hgs
parents: 0
diff changeset
   222
                // Create the item's icon.
hgs
parents: 0
diff changeset
   223
                if (menuItem.icon != undefined) {
hgs
parents: 0
diff changeset
   224
                    var iconEl = document.createElement("img");
hgs
parents: 0
diff changeset
   225
                    itemSpan.appendChild(iconEl);
hgs
parents: 0
diff changeset
   226
                    iconEl.setAttribute("src", menuItem.icon);
hgs
parents: 0
diff changeset
   227
                }
0
1450b09d0cfd Revision: 201015
Dremov Kirill (Nokia-D-MSW/Tampere) <kirill.dremov@nokia.com>
parents:
diff changeset
   228
3
hgs
parents: 0
diff changeset
   229
                // Create the item's text.
hgs
parents: 0
diff changeset
   230
                if (menuItem.text != undefined) {
hgs
parents: 0
diff changeset
   231
                    var anchorEl = document.createElement("a");
hgs
parents: 0
diff changeset
   232
                    itemSpan.appendChild(anchorEl);
hgs
parents: 0
diff changeset
   233
                    var textEl = document.createTextNode(menuItem.text);
hgs
parents: 0
diff changeset
   234
                    anchorEl.appendChild(textEl);
hgs
parents: 0
diff changeset
   235
                }
hgs
parents: 0
diff changeset
   236
            }
hgs
parents: 0
diff changeset
   237
hgs
parents: 0
diff changeset
   238
            menuUl.appendChild(itemLi);
hgs
parents: 0
diff changeset
   239
            itemLi.appendChild(itemSpan);
hgs
parents: 0
diff changeset
   240
        }
hgs
parents: 0
diff changeset
   241
        return menuUl;
hgs
parents: 0
diff changeset
   242
    }
hgs
parents: 0
diff changeset
   243
    
hgs
parents: 0
diff changeset
   244
    // Handle mouse clicks on tab elements.
hgs
parents: 0
diff changeset
   245
    // Note: "this" refers to the element that was clicked on, ie. the tab item.
hgs
parents: 0
diff changeset
   246
    this.handleTabActivate = function() {
hgs
parents: 0
diff changeset
   247
        var tabsDivChildren = document.getElementById("cm_tabsUlId").childNodes;
hgs
parents: 0
diff changeset
   248
        var otherTabsWidth = 0;
hgs
parents: 0
diff changeset
   249
        // Set the class for each tab.
hgs
parents: 0
diff changeset
   250
        for (var i = 0; i < tabsDivChildren.length; i++) {
hgs
parents: 0
diff changeset
   251
            var tabEl = tabsDivChildren[i];
hgs
parents: 0
diff changeset
   252
            var iconHighlighted = getChildById(tabEl, "iconHighlighted");
hgs
parents: 0
diff changeset
   253
            var icon = getChildById(tabEl, "icon");
hgs
parents: 0
diff changeset
   254
            if (tabEl == this) {
hgs
parents: 0
diff changeset
   255
                // Activate the tab.
hgs
parents: 0
diff changeset
   256
                tabEl.className = "ViewContext_HighlightedTab";
hgs
parents: 0
diff changeset
   257
                //tabEl.firstChild.className = "ViewContext_HighlightedTabDiv";
hgs
parents: 0
diff changeset
   258
                
hgs
parents: 0
diff changeset
   259
                // Show the highlighted icon, if one exists.
hgs
parents: 0
diff changeset
   260
                if(iconHighlighted != undefined) {
hgs
parents: 0
diff changeset
   261
                    iconHighlighted.style.display = "";
hgs
parents: 0
diff changeset
   262
                    
hgs
parents: 0
diff changeset
   263
                    // Hide the normal icon.
hgs
parents: 0
diff changeset
   264
                    if (icon != undefined) {
hgs
parents: 0
diff changeset
   265
                        icon.style.display = "none";
hgs
parents: 0
diff changeset
   266
                    }
hgs
parents: 0
diff changeset
   267
                }
hgs
parents: 0
diff changeset
   268
            }
hgs
parents: 0
diff changeset
   269
            else {
hgs
parents: 0
diff changeset
   270
                // Deactivate the tab.
hgs
parents: 0
diff changeset
   271
                tabEl.className = "ViewContext_NormalTab";
hgs
parents: 0
diff changeset
   272
                //tabEl.firstChildclassName = "ViewContext_NormalTabDiv";
hgs
parents: 0
diff changeset
   273
                
hgs
parents: 0
diff changeset
   274
                // If a highlighted icon exists, switch to the normal one, otherwise leave
hgs
parents: 0
diff changeset
   275
                // the normal one alone.
hgs
parents: 0
diff changeset
   276
                if(iconHighlighted != undefined) {
hgs
parents: 0
diff changeset
   277
                    iconHighlighted.style.display = "none";
hgs
parents: 0
diff changeset
   278
                    if (icon != undefined) {
hgs
parents: 0
diff changeset
   279
                        icon.style.display = "";
hgs
parents: 0
diff changeset
   280
                    }
hgs
parents: 0
diff changeset
   281
                }
hgs
parents: 0
diff changeset
   282
            }
hgs
parents: 0
diff changeset
   283
            if (tabEl.cm_disabled) {
hgs
parents: 0
diff changeset
   284
                tabEl.className += " ViewContext_DisabledTab";
hgs
parents: 0
diff changeset
   285
                //tabEl.firstClassName += " ViewContext_DisabledTabDiv";
hgs
parents: 0
diff changeset
   286
            }
hgs
parents: 0
diff changeset
   287
        }
hgs
parents: 0
diff changeset
   288
hgs
parents: 0
diff changeset
   289
        // Show the menu of the tab that was just clicked.
hgs
parents: 0
diff changeset
   290
        var menuDivChildren = document.getElementById("cm_menuDivId").childNodes;
hgs
parents: 0
diff changeset
   291
        for (var i = 0; i < menuDivChildren.length; i++) {
hgs
parents: 0
diff changeset
   292
            var menuEl = menuDivChildren[i];
hgs
parents: 0
diff changeset
   293
            if (menuEl == this.cm_menu) {
hgs
parents: 0
diff changeset
   294
                menuDivChildren[i].style.display =  "";
hgs
parents: 0
diff changeset
   295
            }
hgs
parents: 0
diff changeset
   296
            else {
hgs
parents: 0
diff changeset
   297
                menuDivChildren[i].style.display =  "none";
hgs
parents: 0
diff changeset
   298
            }
hgs
parents: 0
diff changeset
   299
        }
hgs
parents: 0
diff changeset
   300
        //cm_TheContextMenu.positionTail();
hgs
parents: 0
diff changeset
   301
        //document.getElementById(this.snippetId).clientHeight = this.mainDiv.clientHeight;
hgs
parents: 0
diff changeset
   302
        //document.getElementById("ContextMenuId").setAttribute("style", "height: " + document.getElementById("cm_mainDivId").clientHeight + "px;")
hgs
parents: 0
diff changeset
   303
hgs
parents: 0
diff changeset
   304
        cm_TheContextMenu.updateTabSizes();
hgs
parents: 0
diff changeset
   305
        snippets[cm_TheContextMenu.snippetId].updateOwnerArea();
hgs
parents: 0
diff changeset
   306
    }
hgs
parents: 0
diff changeset
   307
hgs
parents: 0
diff changeset
   308
    // Return the width of the "non-content" part of the element box, ie. thickness of
hgs
parents: 0
diff changeset
   309
    // the padding, the border and the margin.
hgs
parents: 0
diff changeset
   310
    this.getNonContentWidth = function(element) {
hgs
parents: 0
diff changeset
   311
        var tabStyle = document.defaultView.getComputedStyle(element, null);
hgs
parents: 0
diff changeset
   312
        return parseInt(tabStyle["margin-left"]) + parseInt(tabStyle["margin-right"]) +
hgs
parents: 0
diff changeset
   313
               parseInt(tabStyle["padding-left"]) + parseInt(tabStyle["padding-right"]) +
hgs
parents: 0
diff changeset
   314
               parseInt(tabStyle["border-left-width"]) + parseInt(tabStyle["border-right-width"]);
hgs
parents: 0
diff changeset
   315
    }
hgs
parents: 0
diff changeset
   316
hgs
parents: 0
diff changeset
   317
    // Update the tab widths.  Expand the highlighted tab to its maximum width and shrink the
hgs
parents: 0
diff changeset
   318
    // normal tabs to their minimum widths.  Note: it would be preferable to have this done
hgs
parents: 0
diff changeset
   319
    // by CSS.
hgs
parents: 0
diff changeset
   320
    this.updateTabSizes = function() {
hgs
parents: 0
diff changeset
   321
        var tabsUl = document.getElementById("cm_tabsUlId");
hgs
parents: 0
diff changeset
   322
        var tabsDivChildren = tabsUl.childNodes;
hgs
parents: 0
diff changeset
   323
        var otherTabsWidth = 0;
hgs
parents: 0
diff changeset
   324
        var highlightedTab;
hgs
parents: 0
diff changeset
   325
        for (var i = 0; i < tabsDivChildren.length; i++) {
hgs
parents: 0
diff changeset
   326
            var tabEl = tabsDivChildren[i];
hgs
parents: 0
diff changeset
   327
            if (tabEl.className.indexOf("ViewContext_HighlightedTab") != -1) {
hgs
parents: 0
diff changeset
   328
                highlightedTab = tabEl;
hgs
parents: 0
diff changeset
   329
            }
hgs
parents: 0
diff changeset
   330
            else {
hgs
parents: 0
diff changeset
   331
                var newTabWidth = cm_TheContextMenu.normalTabWidth - cm_TheContextMenu.getNonContentWidth(tabEl);
hgs
parents: 0
diff changeset
   332
                tabEl.style.width = newTabWidth;
hgs
parents: 0
diff changeset
   333
                otherTabsWidth += tabEl.offsetWidth;
hgs
parents: 0
diff changeset
   334
            }
hgs
parents: 0
diff changeset
   335
        }
hgs
parents: 0
diff changeset
   336
        if (highlightedTab != undefined) {
hgs
parents: 0
diff changeset
   337
            var newWidth = tabsUl.offsetWidth - otherTabsWidth;
hgs
parents: 0
diff changeset
   338
            newWidth -= cm_TheContextMenu.getNonContentWidth(highlightedTab) + 2;
hgs
parents: 0
diff changeset
   339
            highlightedTab.style.width = newWidth;
hgs
parents: 0
diff changeset
   340
        }
hgs
parents: 0
diff changeset
   341
    }
hgs
parents: 0
diff changeset
   342
hgs
parents: 0
diff changeset
   343
    this.positionTail = function() {
hgs
parents: 0
diff changeset
   344
        // Move the "tail" into position.
hgs
parents: 0
diff changeset
   345
        var tailEl = document.getElementById("cm_tailId");
hgs
parents: 0
diff changeset
   346
        if (tailEl != undefined) {
hgs
parents: 0
diff changeset
   347
            //var mainDiv = document.getElementById("cm_mainDivId");
hgs
parents: 0
diff changeset
   348
            var tailX = (this.mainDiv.clientWidth - tailEl.clientWidth) / 2;
hgs
parents: 0
diff changeset
   349
            var tailY = this.mainDiv.clientHeight;
hgs
parents: 0
diff changeset
   350
            tailEl.setAttribute("style", "position:absolute; top: " + tailY + "px; left: " + tailX);
hgs
parents: 0
diff changeset
   351
        }
hgs
parents: 0
diff changeset
   352
    }
hgs
parents: 0
diff changeset
   353
hgs
parents: 0
diff changeset
   354
    // Create all the DOM elements of the window.
hgs
parents: 0
diff changeset
   355
    this.create = function(menuData) {
hgs
parents: 0
diff changeset
   356
        var snippetEl = document.getElementById(this.snippetId);
hgs
parents: 0
diff changeset
   357
        var el = this.createTabsElement(menuData);
hgs
parents: 0
diff changeset
   358
        snippetEl.appendChild(el);
hgs
parents: 0
diff changeset
   359
    }
hgs
parents: 0
diff changeset
   360
hgs
parents: 0
diff changeset
   361
    // Show the content menu.  The menuData must contain an object tree describing the structure of the
hgs
parents: 0
diff changeset
   362
    // tabs and sub-menus.
hgs
parents: 0
diff changeset
   363
    //
hgs
parents: 0
diff changeset
   364
    // Example menu data in JSON format:
hgs
parents: 0
diff changeset
   365
    //        var MenuData = {
hgs
parents: 0
diff changeset
   366
    //            "tabs": [ {
hgs
parents: 0
diff changeset
   367
    //                     "text": "Tab 1",
hgs
parents: 0
diff changeset
   368
    //                     "icon": "tab1.png",
hgs
parents: 0
diff changeset
   369
    //                     "current": "true",
hgs
parents: 0
diff changeset
   370
    //                     "menuItems": [ {
hgs
parents: 0
diff changeset
   371
    //                             "text": Menu item 1,
hgs
parents: 0
diff changeset
   372
    //                             "onclick": handleMenu1,
hgs
parents: 0
diff changeset
   373
    //                             "icon": "menu1.png",
hgs
parents: 0
diff changeset
   374
    //                           },
hgs
parents: 0
diff changeset
   375
    //                           {
hgs
parents: 0
diff changeset
   376
    //                             "text": Menu item 2,
hgs
parents: 0
diff changeset
   377
    //                             "onclick": function() { alert("hello"); },
hgs
parents: 0
diff changeset
   378
    //                             "icon": "menu2.png",
hgs
parents: 0
diff changeset
   379
    //                           },
hgs
parents: 0
diff changeset
   380
    //                         ],
hgs
parents: 0
diff changeset
   381
    //                 },
hgs
parents: 0
diff changeset
   382
    //                 {
hgs
parents: 0
diff changeset
   383
    //                     "text": "Tab 2",
hgs
parents: 0
diff changeset
   384
    //                     "icon": "tab2.png",
hgs
parents: 0
diff changeset
   385
    //                     "menuItems": [ {
hgs
parents: 0
diff changeset
   386
    //                             "text": Menu item 1,
hgs
parents: 0
diff changeset
   387
    //                             "onclick": handleMenu21,
hgs
parents: 0
diff changeset
   388
    //                           },
hgs
parents: 0
diff changeset
   389
    //                           {
hgs
parents: 0
diff changeset
   390
    //                             "text": Menu item 2,
hgs
parents: 0
diff changeset
   391
    //                             "onclick": handleMenu22,
hgs
parents: 0
diff changeset
   392
    //                           },
hgs
parents: 0
diff changeset
   393
    //                         ],
hgs
parents: 0
diff changeset
   394
    //                 },
hgs
parents: 0
diff changeset
   395
    //                ]
hgs
parents: 0
diff changeset
   396
    //        };
hgs
parents: 0
diff changeset
   397
    //
hgs
parents: 0
diff changeset
   398
    
hgs
parents: 0
diff changeset
   399
    this.cancel = function() {
hgs
parents: 0
diff changeset
   400
        //app.debug("CM: cancel " + this.showTimeoutId);
hgs
parents: 0
diff changeset
   401
        clearTimeout(this.showTimeoutId);
hgs
parents: 0
diff changeset
   402
        this.showTimeoutId = 0;
hgs
parents: 0
diff changeset
   403
        this.cleanUp();
hgs
parents: 0
diff changeset
   404
    }
hgs
parents: 0
diff changeset
   405
hgs
parents: 0
diff changeset
   406
    this.cleanUp = function() {
hgs
parents: 0
diff changeset
   407
        // Remove elements from DOM to save memory.
hgs
parents: 0
diff changeset
   408
        var oldEl = document.getElementById("cm_mainDivId");
hgs
parents: 0
diff changeset
   409
        if (oldEl) {
hgs
parents: 0
diff changeset
   410
            var snippetEl = document.getElementById(cm_TheContextMenu.snippetId);
hgs
parents: 0
diff changeset
   411
            snippetEl.removeChild(oldEl);
hgs
parents: 0
diff changeset
   412
        }
hgs
parents: 0
diff changeset
   413
    }
hgs
parents: 0
diff changeset
   414
hgs
parents: 0
diff changeset
   415
    // Hide this window.
hgs
parents: 0
diff changeset
   416
    this.hide = function() {
hgs
parents: 0
diff changeset
   417
        snippets[cm_TheContextMenu.snippetId].hide();
hgs
parents: 0
diff changeset
   418
    }
hgs
parents: 0
diff changeset
   419
hgs
parents: 0
diff changeset
   420
    this.onHide = function() {
hgs
parents: 0
diff changeset
   421
        this.cleanUp();
hgs
parents: 0
diff changeset
   422
    }
hgs
parents: 0
diff changeset
   423
hgs
parents: 0
diff changeset
   424
    this.show = function(menuData) {
hgs
parents: 0
diff changeset
   425
        this.cleanUp();
hgs
parents: 0
diff changeset
   426
        this.create(menuData);
hgs
parents: 0
diff changeset
   427
hgs
parents: 0
diff changeset
   428
        cm_TheContextMenu.updateTabSizes();
hgs
parents: 0
diff changeset
   429
        // Use a timer to actually show the window to allow the page re-layout
hgs
parents: 0
diff changeset
   430
        // to finish.  We don't know when this really happens but 50ms seems to
hgs
parents: 0
diff changeset
   431
        // be enough on the N97.  Without this delay the bottom of the window
hgs
parents: 0
diff changeset
   432
        // often gets clipped.
hgs
parents: 0
diff changeset
   433
        setTimeout("cm_TheContextMenu.showIt2()", 50);
hgs
parents: 0
diff changeset
   434
    }
hgs
parents: 0
diff changeset
   435
hgs
parents: 0
diff changeset
   436
    this.showIt2 = function() {
hgs
parents: 0
diff changeset
   437
hgs
parents: 0
diff changeset
   438
        var snippet = snippets[cm_TheContextMenu.snippetId];
hgs
parents: 0
diff changeset
   439
        snippet.updateOwnerArea();
hgs
parents: 0
diff changeset
   440
        snippet.setZValue(2);
hgs
parents: 0
diff changeset
   441
hgs
parents: 0
diff changeset
   442
        this.centerSnippet();
hgs
parents: 0
diff changeset
   443
hgs
parents: 0
diff changeset
   444
//        if (showTail) {
hgs
parents: 0
diff changeset
   445
//            cm_TheContextMenu.positionTail();
hgs
parents: 0
diff changeset
   446
//        }
hgs
parents: 0
diff changeset
   447
hgs
parents: 0
diff changeset
   448
        snippet.show();
hgs
parents: 0
diff changeset
   449
    }
0
1450b09d0cfd Revision: 201015
Dremov Kirill (Nokia-D-MSW/Tampere) <kirill.dremov@nokia.com>
parents:
diff changeset
   450
1450b09d0cfd Revision: 201015
Dremov Kirill (Nokia-D-MSW/Tampere) <kirill.dremov@nokia.com>
parents:
diff changeset
   451
3
hgs
parents: 0
diff changeset
   452
    this.centerSnippet = function() {
0
1450b09d0cfd Revision: 201015
Dremov Kirill (Nokia-D-MSW/Tampere) <kirill.dremov@nokia.com>
parents:
diff changeset
   453
3
hgs
parents: 0
diff changeset
   454
        
hgs
parents: 0
diff changeset
   455
        var statusBarHeight = snippets.StatusBarChromeId.geometry.height;
hgs
parents: 0
diff changeset
   456
        
hgs
parents: 0
diff changeset
   457
        var snippet = snippets[cm_TheContextMenu.snippetId];
hgs
parents: 0
diff changeset
   458
        var x = (chrome.displaySize.width - snippet.geometry.width) / 2;
hgs
parents: 0
diff changeset
   459
        
hgs
parents: 0
diff changeset
   460
        // Center the menu in the space between status bar and tool bar
hgs
parents: 0
diff changeset
   461
        var y = (chrome.displaySize.height - statusBarHeight - snippets.WebViewToolbarId.geometry.height - cm_TheContextMenu.menuHeight)/2;
hgs
parents: 0
diff changeset
   462
        snippet.setPosition(x, (y+statusBarHeight));
hgs
parents: 0
diff changeset
   463
    
0
1450b09d0cfd Revision: 201015
Dremov Kirill (Nokia-D-MSW/Tampere) <kirill.dremov@nokia.com>
parents:
diff changeset
   464
    }
3
hgs
parents: 0
diff changeset
   465
    chrome.chromeComplete.connect(createDelegate(this,
hgs
parents: 0
diff changeset
   466
        function() {
hgs
parents: 0
diff changeset
   467
            var snippet = snippets[cm_TheContextMenu.snippetId];
0
1450b09d0cfd Revision: 201015
Dremov Kirill (Nokia-D-MSW/Tampere) <kirill.dremov@nokia.com>
parents:
diff changeset
   468
3
hgs
parents: 0
diff changeset
   469
            chrome.aspectChanged.connect(createDelegate(this,
hgs
parents: 0
diff changeset
   470
                    function(a) {
hgs
parents: 0
diff changeset
   471
                        this.centerSnippet();
hgs
parents: 0
diff changeset
   472
                    }));
0
1450b09d0cfd Revision: 201015
Dremov Kirill (Nokia-D-MSW/Tampere) <kirill.dremov@nokia.com>
parents:
diff changeset
   473
3
hgs
parents: 0
diff changeset
   474
            snippet.hidden.connect(createDelegate(this, this.onHide));
0
1450b09d0cfd Revision: 201015
Dremov Kirill (Nokia-D-MSW/Tampere) <kirill.dremov@nokia.com>
parents:
diff changeset
   475
3
hgs
parents: 0
diff changeset
   476
        }));
hgs
parents: 0
diff changeset
   477
}  // End ContextMenu class