tazpanel annotate lib/tazpanel.js @ rev 589

settings.cgi: fix env for lxpanel & date
author Xander Ziiryanoff <psychomaniak@xakep.ru>
date Mon Apr 25 14:42:42 2016 +0200 (2016-04-25)
parents c79a4557c4b5
children
rev   line source
al@419 1
al@419 2 // Hide Loading panel
al@419 3 function hideLoading() {
al@419 4 var loading = document.getElementById("loading");
al@419 5 // If element presents on page
al@419 6 if (loading) loading.style.display='none';
al@419 7 }
al@419 8 // Attach event handler
al@419 9 window.onload = hideLoading;
al@419 10
al@419 11
al@419 12
al@419 13 // Confirm page loading break
al@419 14 function confirmExit() {
al@545 15 return document.getElementById('confirmBreak').textContent;
al@419 16 }
al@419 17 // Attach event handler
al@419 18 window.onbeforeunload = confirmExit;
al@419 19
al@419 20
al@419 21
al@419 22 // Set light or dark color theme
al@419 23 function setColorTheme() {
al@419 24 // Goal: to produce pages that fit the user's defined look and feel, and
al@419 25 // may be more accessible as the current user settings (contrast color
al@419 26 // schemes, big font sizes, etc.)
al@419 27 // Realization in the CSS2:
al@419 28 // http://www.w3.org/TR/REC-CSS2/ui.html#system-colors
al@419 29 // We can use colors from user's color theme to mimic plain desktop application.
al@419 30 //
al@419 31 // Alas, nowadays it not works. Webkit-based browser returns hard-coded values,
al@419 32 // with exception of these two:
al@419 33 // * ButtonText - text on push buttons.
al@419 34 // * CaptionText - text in caption, size box, and scrollbar arrow box.
al@419 35 //
al@419 36 // When user changes color theme, browser re-draws page, so all input elements
al@419 37 // (buttons, checkboxes, radiobuttons, drop-down lists, scrollbars, text inputs)
al@419 38 // automagically fits user-defined theme. We need to change web document's
al@419 39 // colors manually. We can't ask for exact user defined colors for document's
al@419 40 // background in any way, we can only imagine if it dark or light.
al@419 41 // So, plan is follows:
al@419 42 // We use 'ButtonText' color for base document's color, and calculate if it
al@419 43 // dark or light. If color of button's text is dark, then color of button's body
al@419 44 // is light, and we define entire web document as light; and vice versa.
al@419 45
al@419 46 // Get 'ButtonText' color value (as current text's color of body)
al@419 47 var body = document.getElementsByTagName('body')[0];
al@419 48 var bodyColor = window.getComputedStyle(body, null).color;
al@419 49 console.info("Set bodyColor: %s", bodyColor);
al@419 50
al@419 51 // Returned value must be in format like "rgb(212, 212, 212)" or "rgba(192, 68, 1, 0)"
al@419 52 if (bodyColor.indexOf("rgb") != -1) {
al@419 53 // Make array with color components
al@419 54 var results = bodyColor.match(/^rgba?\((\d{1,3}),\s*(\d{1,3}),\s*(\d{1,3})/);
al@419 55
al@419 56 // Calculate luminance (brightness) in range 0..1
al@419 57 if (results && results.length >= 3) {
al@419 58 r = parseInt(results[1], 10);
al@419 59 g = parseInt(results[2], 10);
al@419 60 b = parseInt(results[3], 10);
al@419 61 min = Math.min(r, g, b); max = Math.max(r, g, b);
al@419 62 }
al@419 63 var luminance = (min + max) / 2 / 255;
al@419 64
al@419 65 // Set class for body
al@437 66 body.classList.add( (luminance > 0.5) ? 'dark' : 'light');
al@419 67 }
al@419 68 // Now we can use cascade styles for any elements lying on light or dark body:
al@419 69 // .light h2 { color: #222; }
al@419 70 // .dark h2 { color: #CCC; }
al@419 71 // Also we can use semi-transparent colors in some cases:
al@419 72 // body footer { color: rgba(128, 128, 128, 0.5); }
al@419 73 }
al@419 74
al@419 75
al@419 76
al@419 77 // Set base font size
al@419 78 function setBaseFont() {
al@419 79 // Goal: to have on page the same font sizes as in user's system.
al@419 80 // User input elements changed its font size automatically, so we can read
al@419 81 // font size from (hidden) button and apply this size to document's body.
al@419 82 // All other sizes will be relative, and will grow or shrink automatically.
al@419 83
al@419 84 // Get document's body
al@419 85 var body = document.getElementsByTagName('body')[0];
al@419 86
al@419 87 // Make button in the hidden DOM
al@419 88 var hiddenButton = document.createElement('BUTTON');
al@419 89
al@419 90 // Move button away from look
al@419 91 hiddenButton.style.setProperty('position', 'absolute', 1);
al@419 92 hiddenButton.style.setProperty('left', '0', 1);
al@419 93
al@419 94 // Add some text to button
al@419 95 hiddenButton.appendChild(document.createTextNode("SliTaz"));
al@419 96
al@419 97 // Add button to DOM
al@419 98 body.appendChild(hiddenButton);
al@419 99
al@419 100 // Focus to button (it will get colored outline!)
al@419 101 hiddenButton.focus();
al@419 102
al@419 103 // Get button's style
al@419 104 var buttonStyle = getComputedStyle(hiddenButton, null);
al@419 105
al@419 106 // Copy styles from button to body
al@419 107 with (body.style) {
al@419 108 fontFamily = buttonStyle.fontFamily;
al@419 109 fontSize = buttonStyle.fontSize;
al@419 110 fontWeight = 'normal';
al@419 111 }
al@419 112
al@419 113 //body.style.color = buttonStyle.outlineColor;
al@419 114
al@419 115 console.info('Set fontFamily: %s, fontSize: %s', body.style.fontFamily, body.style.fontSize);
al@419 116 console.info('Theme color: %s', buttonStyle.outlineColor);
al@419 117 // Remove button from hidden DOM
al@419 118 body.removeChild(hiddenButton);
al@419 119 }
al@419 120
al@419 121
al@419 122
al@419 123 //
al@419 124 function dupTableHead() {
al@525 125 if (! document.getElementById('head2')) return;
al@419 126 var tableHead = document.createElement("TABLE");
al@419 127 with (tableHead) {
al@525 128 innerHTML = '<thead>' + document.getElementById('head2').innerHTML + '</thead>';
al@419 129 setAttribute("id", "head1h");
al@419 130 setAttribute("class", "zebra pkglist");
al@419 131 }
al@419 132
al@419 133 document.body.appendChild(tableHead);
al@419 134 }
al@419 135
al@419 136
al@419 137
al@419 138 //
al@419 139 function scrollHandler(){
al@419 140 toolbar = document.getElementById('toolbar');
al@419 141 paddingTop = toolbar.offsetTop + toolbar.offsetHeight;
al@419 142 paddingTopPx = paddingTop + 'px';
al@419 143
al@419 144 headerOffset = document.getElementById('head1').offsetTop;
al@419 145 windowScrolled = document.body.scrollTop;
al@419 146 if ((headerOffset - windowScrolled) < paddingTop)
al@419 147 {
al@545 148 // document.getElementById('miscinfo1').textContent = '<';
al@419 149 var head1h = document.getElementById('head1h');
al@419 150 var head1 = document.getElementById('head1');
al@419 151
al@419 152 with (head1h.style) {
al@419 153 setProperty('top', paddingTopPx, 1);
al@419 154 setProperty('display', 'table', 1);
al@419 155 setProperty('left', head1.offsetLeft + 'px', 1);
al@419 156 setProperty('width', head1.offsetWidth + 'px', 1);
al@419 157 }
al@419 158
al@545 159 // document.getElementById('miscinfo1').textContent = '(' + toopop +')P^' + paddingTop + 'L' + head1h.offsetLeft + ':W' + head1h.offsetWidth + ':H' + head1h.offsetHeight + ':T' + head1h.clientTop +',' + head1h.offsetTop;
al@419 160
al@419 161 }
al@419 162 else
al@419 163 {
al@545 164 //document.getElementById('miscinfo1').textContent = '>';
al@419 165 document.getElementById('head1h').style.display = 'none';
al@419 166 }
al@419 167
al@419 168 tHeadTr = document.getElementById('head1h').children[0].children[0];
al@419 169 tHeadTrO = document.getElementById('head1').children[0].children[0];
al@419 170 tHeadTr.children[0].style.setProperty('width', tHeadTrO.children[0].offsetWidth -1 + 'px', 1);
al@419 171 tHeadTr.children[1].style.setProperty('width', tHeadTrO.children[1].offsetWidth -1 + 'px', 1);
al@419 172 tHeadTr.children[2].style.setProperty('width', tHeadTrO.children[2].offsetWidth -1 + 'px', 1);
al@428 173 //tHeadTr.children[3].style.setProperty('width', tHeadTrO.children[3].offsetWidth -1 + 'px', 1);
al@419 174
al@419 175 }
al@419 176
al@419 177
al@419 178
al@419 179 // Handler for History scroller for Terminal
al@419 180 function keydownHandler(e) {
al@419 181 // Get code for pressed key
al@419 182 var evt = e ? e:event;
al@419 183 var keyCode = evt.keyCode;
al@419 184
al@419 185 // If pressed "up" or "down"
al@419 186 if (keyCode==38 || keyCode==40) {
al@419 187 // Local storage used as global variables storage
al@419 188 // Get current position in the History, and History size
al@419 189 //var cur_hist = window.localStorage.getItem("cur_hist");
al@419 190 //var max_hist = window.localStorage.getItem("max_hist");
al@419 191 switch(keyCode) {
al@419 192 case 38:
al@419 193 // "up" key pressed; decrement and normalize position
al@419 194 cur_hist--; if (cur_hist < 0) cur_hist = 0;
al@419 195 break;
al@419 196 case 40:
al@419 197 // "down" key pressed; increment and normalize position
al@419 198 cur_hist++; if (cur_hist > max_hist) cur_hist = max_hist;
al@419 199 break;
al@419 200 }
al@419 201 // Element "cmd" is a text input, put History element there
al@419 202 var cmd = document.getElementById('typeField');
al@419 203 cmd.focus();
al@545 204 cmd.textContent = ash_history[cur_hist];
al@419 205
al@419 206 var hint = ''
al@419 207 if (cur_hist < max_hist) hint = '[' + cur_hist + '/' + (max_hist - 1) + '] ';
al@545 208 document.getElementById('num_hist').textContent = hint;
al@419 209
al@419 210 //window.localStorage.setItem('cur_hist', cur_hist);
al@419 211 return false
al@419 212 }
al@419 213 if (keyCode==13) {
al@545 214 document.getElementById('cmd').value=document.getElementById('typeField').textContent;
al@419 215 document.getElementById('term').submit();
al@419 216 return false
al@419 217 }
al@419 218 return true
al@419 219 }
al@419 220
al@419 221
al@419 222
al@419 223 // Add hover effect for menu
al@419 224 function menuAddHover() {
al@419 225 var toolbarMenu = document.getElementById('toolbarMenu');
al@419 226 toolbarMenu.className = 'hover';
al@419 227
al@419 228 menus = toolbarMenu.getElementsByTagName('li');
al@419 229 for (i = 0; i < menus.length; i++)
al@419 230 menus[i].blur();
al@419 231
al@419 232 toolbarMenu.focus();
al@419 233 toolbarMenu.onblur = menuRmHover;
al@419 234 console.log('Add finished');
al@419 235 }
al@419 236
al@419 237 // Remove hover effect for menu
al@419 238 function menuRmHover() {
al@419 239 var toolbarMenu = document.getElementById('toolbarMenu');
al@419 240 toolbarMenu.className = 'nohover';
al@419 241
al@419 242 menus = toolbarMenu.getElementsByTagName('li');
al@419 243 for (i = 0; i < menus.length; i++)
al@419 244 menus[i].onclick = menuAddHover;
al@419 245
al@419 246 console.log('Rm finished');
al@419 247 }
al@419 248
al@419 249
al@419 250 // Close main menu
al@419 251 function closeMenu() {
al@419 252 document.getElementById('noMenu').style.display = 'none';
al@419 253 closeItem(itemOpened);
al@419 254 menuIsClosed = true;
al@419 255 //console.log('Menu closed');
al@419 256 }
al@419 257 // Open main menu
al@419 258 function openMenu() {
al@419 259 //console.log('openMenu')
al@419 260 document.getElementById('noMenu').style.display = 'block';
al@419 261 menuIsClosed = false;
al@419 262 }
al@419 263 // Open main menu item
al@419 264 function openItem(el) {
al@419 265 if (itemOpened != el) {
al@419 266 if (itemOpened)
al@419 267 closeItem(itemOpened);
al@419 268 el.children[1].className = 'opened';
al@419 269 el.focus();
al@419 270 itemOpened = el;
al@419 271 menuIsClosed = false; openMenu();
al@419 272 //console.log('Opened %s', el.tabIndex);
al@419 273 //console.log('Menu opened (open)');
al@419 274 }
al@419 275 }
al@419 276 // Close main menu item
al@419 277 function closeItem(el) {
al@419 278 //console.log('<closeItem: "%s">', el)
al@419 279 thisMenu = el.children[1];
al@419 280 if (thisMenu.className == 'opened') {
al@419 281 thisMenu.className = 'closed';
al@419 282 el.blur();
al@525 283 itemOpened = '';
al@419 284 //console.log('Closed %s', el.tabIndex);
al@419 285 }
al@419 286 }
al@419 287
al@419 288 itemOpened = '';
al@419 289 menuIsClosed = true;
al@419 290
al@419 291 // Add event handler
al@419 292 function addMenuHandlers() {
al@419 293 menus = document.getElementById('toolbarMenu').children;
al@419 294 for (i = 0; i < menus.length; i++) {
al@419 295 menus[i].firstElementChild.onclick = function() {menuItemClick(this)};
al@419 296 menus[i].firstElementChild.onmouseover = function() {menuItemHover(this)};
al@419 297 menus[i].onblur = function() {menuItemBlur(this)};
al@419 298 }
al@419 299
al@419 300 // Close menu when click outside menu
al@419 301 document.getElementById('noMenu').onclick = closeMenu;
al@419 302 }
al@419 303
al@419 304 function menuItemClick(el) {
al@419 305 topItem = el.parentElement;
al@419 306 thisMenu = topItem.children[1];
al@419 307 //console.log('Clicked %s class %s', topItem.tabIndex, thisMenu.className);
al@419 308 if (thisMenu.className == 'opened') {
al@419 309 closeItem(topItem);
al@419 310 menuIsClosed = true; closeMenu();
al@419 311 //console.log('Menu closed (click)');
al@419 312 }
al@419 313 else {
al@419 314 openItem(topItem);
al@419 315 menuIsClosed = false; openMenu();
al@419 316 //console.log('Menu opened (click)');
al@419 317 }
al@419 318 }
al@419 319
al@419 320 function menuItemHover(el) {
al@419 321 hoverElem = el.parentElement;
al@419 322 //console.log('Hovered %s', hoverElem.tabIndex);
al@419 323 if (! menuIsClosed) {
al@419 324 closeItem(itemOpened);
al@419 325 openItem(hoverElem);
al@419 326 }
al@419 327 }
al@419 328 function menuItemBlur(el) {
al@525 329 elem = el;
al@525 330 //.parentElement;
al@419 331 //console.log('Blurred %s', elem.tabIndex);
al@419 332 //closeItem(elem);
al@419 333 //menuIsClosed = true;
al@419 334 //console.log('Menu closed (blur)');
al@419 335 }
al@419 336
al@419 337
al@419 338
al@419 339 //
al@419 340 // AJAX code for dynamic requests
al@419 341 //
al@419 342
al@519 343 // Global status of the AJAX loader
al@519 344 // Increment ajaxLoader on the start, decrement on the finish,
al@519 345 // Show it if value > 0
al@519 346 ajaxLoader = 0
al@519 347
al@419 348 function ajax(cgiUrl, command, ajaxOut) {
al@519 349 // (0) show AJAX loader
al@525 350 ajaxLoader++;
al@519 351
al@419 352 // (1) create object for server request
al@419 353 var req = new XMLHttpRequest();
al@419 354
al@419 355 // (2) show request status
al@419 356 var statusElem = document.getElementById('ajaxStatus');
al@419 357
al@419 358 req.onreadystatechange = function() {
al@419 359 // onreadystatechange activates on server answer receiving
al@419 360
al@419 361 if (req.readyState == XMLHttpRequest.DONE) {
al@419 362 // if request done
al@525 363 ajaxLoader--;
al@519 364 if (ajaxLoader == 0) {
al@519 365
al@525 366 statusbar('');
al@519 367
al@519 368 if (req.statusText == 'OK') {
al@558 369 statusElem.innerHTML = '<span data-img="@ok@"></span>';
al@519 370 } else {
al@525 371 // show status (Not Found, ...)
al@558 372 statusElem.innerHTML = '<span data-img="@delete@">' +
al@525 373 req.statusText + '</span>';
al@519 374 }
al@498 375 } else {
al@558 376 statusElem.innerHTML = '<span data-img="@clock@"></span>';
al@498 377 }
al@419 378
al@419 379 // if status 200 (ОК) - show answer to user
al@419 380 if (req.status == 200)
al@419 381 document.getElementById(ajaxOut).innerHTML = req.responseText;
al@419 382 // here we can add "else" with request errors processing
al@419 383 }
al@419 384 }
al@419 385
al@419 386 // (3) set request address
al@419 387 req.open('POST', cgiUrl, true);
al@419 388
al@419 389 // (4) request object is ready
al@525 390 // send request
al@525 391 req.send(command);
al@419 392
al@419 393 // (5)
al@558 394 statusElem.innerHTML = '<span data-img="@clock@"></span>';
al@419 395 }
al@419 396
al@419 397
al@419 398
al@419 399 //
al@419 400 // Load configuration for new and stored networks
al@419 401 //
al@419 402
al@419 403 function loadcfg(essid, bssid, keyType) {
al@419 404 // looking for stored network
al@419 405 for (i = 0; i < networks.length; i++) {
al@419 406 if (networks[i].ssid == essid) break;
al@419 407 if (typeof networks[i].bssid != 'undefined') {
al@419 408 if (networks[i].bssid == bssid) {
al@419 409 essid = networks[i].ssid;
al@419 410 break;
al@419 411 }
al@419 412 }
al@419 413 }
al@419 414 document.getElementById('essid').value = essid;
al@419 415 document.getElementById('keyType').value = keyType;
al@419 416
al@419 417 password = document.getElementById('password')
al@419 418 password.value = '';
al@419 419 if (typeof networks[i] != 'undefined') {
al@419 420 if (typeof networks[i].psk != 'undefined')
al@419 421 password.value = networks[i].psk;
al@419 422 else if (typeof networks[i].wep_key0 != 'undefined')
al@419 423 password.value = networks[i].wep_key0;
al@419 424 else if (typeof networks[i].password != 'undefined')
al@419 425 password.value = networks[i].password;
al@419 426 }
al@419 427
al@420 428 // Not used yet
al@420 429 document.getElementById('bssid').value = '';
al@420 430
al@419 431 wifiSettingsChange();
al@419 432 }
al@426 433
al@426 434
al@426 435 //
al@426 436 // Toggle all checkboxes on a page
al@426 437 //
al@426 438
al@428 439 function checkBoxes() {
al@428 440 var inputs = document.getElementsByTagName('input');
al@428 441 for (var i = 0; i < inputs.length; i++) {
al@428 442 if (inputs[i].type && inputs[i].type == 'checkbox') {
al@428 443 inputs[i].checked = !inputs[i].checked;
al@428 444 countSelPkgs(inputs[i]);
al@426 445 }
al@426 446 }
al@426 447 }
al@426 448
al@428 449
al@428 450 //
al@428 451 // Count selected packages on the packages list
al@428 452 //
al@428 453
al@428 454 function countSelPkgs(el) {
al@437 455 countSelectedSpan = document.getElementById('countSelected');
al@545 456 countSelected = countSelectedSpan.textContent;
al@428 457 if (countSelected == '') countSelected = 0;
al@428 458
al@428 459 element = (el.type == 'change' ? this : el);
al@428 460
al@428 461 if (element.checked)
al@428 462 countSelected++;
al@428 463 else
al@428 464 countSelected--;
al@428 465
al@545 466 countSelectedSpan.textContent = countSelected;
al@501 467
al@501 468 // Disable buttons when no one package selected
al@501 469 panelButtons = document.getElementsByName('do');
al@501 470 disabledState = (countSelected == 0) ? true : false;
al@501 471 for (var i = panelButtons.length - 1; i >= 0; i--) {
al@501 472 panelButtons[i].disabled = disabledState;
al@501 473 };
al@428 474 }
al@428 475
al@428 476 // Attach event handler
al@428 477 function setCountSelPkgs() {
al@428 478 // The change event does not bubble to the form container
al@428 479 pkglist = document.getElementById('pkglist');
al@428 480 if (pkglist) {
al@428 481 var checkboxes = pkglist.getElementsByTagName('input');
al@428 482 for (i = 0; i < checkboxes.length; i++) {
al@428 483 checkboxes[i].onchange = countSelPkgs;
al@428 484 }
al@428 485 }
al@501 486 // Disable buttons when no one package selected by default
al@501 487 panelButtons = document.getElementsByName('do');
al@501 488 for (var i = panelButtons.length - 1; i >= 0; i--) {
al@501 489 panelButtons[i].disabled = true;
al@501 490 };
al@428 491 }
al@462 492
al@462 493
al@462 494 //
al@462 495 // Improving packages by the community effort.
al@462 496 //
al@462 497
al@462 498 function improveAction() {
al@462 499 improveType = document.getElementById('improveType');
al@462 500 improveText = document.getElementById('improveText');
al@462 501
al@462 502 if (improveType.value == '')
al@462 503 improveText.value = '';
al@462 504 else
al@545 505 improveText.value = document.getElementById(improveType.value).textContent;
al@462 506 }
al@463 507
al@463 508
al@463 509 //
al@463 510 // Edit and save files "in place"
al@463 511 //
al@463 512
al@463 513 function editFile() {
al@463 514 document.getElementById('edit_button').style.display = 'none';
al@463 515 document.getElementById('save_button').style.display = '';
al@463 516
al@463 517 with(document.getElementById('fileContent')) {
al@463 518 contentEditable = true;
al@463 519 onkeydown = insertTab;
al@463 520 focus();
al@463 521 }
al@463 522 }
al@463 523
al@463 524 function saveFile(file, fileTitle) {
al@463 525 var newArea = document.createElement('TEXTAREA');
al@463 526 with(newArea) {
al@463 527 name = 'content';
al@463 528 textContent = document.getElementById('fileContent').textContent;
al@463 529 }
al@463 530
al@463 531 var newTitle = document.createElement('INPUT');
al@463 532 with(newTitle) {
al@463 533 name = 'title';
al@463 534 value = fileTitle;
al@463 535 }
al@463 536
al@463 537 var newForm = document.createElement('FORM');
al@463 538 with(newForm) {
al@463 539 appendChild(newArea);
al@463 540 appendChild(newTitle);
al@463 541 method = 'post';
al@463 542 action = "?file=" + file;
al@463 543 submit();
al@463 544 }
al@463 545 }
al@463 546
al@463 547 function insertTab(e) {
al@463 548 var evt = e ? e:event;
al@463 549 if (evt.keyCode == 9) {
al@463 550 evt.preventDefault();
al@463 551 }
al@463 552 }
al@498 553
al@498 554
al@498 555 //
al@498 556 // Show info in the status bar
al@498 557 //
al@498 558
al@498 559 function statusbar(status, ticker) {
al@498 560 var ds = document.getElementById('defaultStatus');
al@498 561 var sb = document.getElementById('statusBar');
al@498 562 var as = document.getElementById('ajaxStatus');
al@498 563
al@498 564 if (status == '') {
al@498 565 // show default status (SliTaz copyright and license)
al@498 566 sb.style.display = 'none'; ds.style.display = ''; as.innerHTML = '';
al@498 567 } else {
al@498 568 // show requested status (rich HTML supported)
al@498 569 ds.style.display = 'none'; sb.innerHTML = status; sb.style.display = '';
al@498 570 // show optional ticker
al@498 571 if (ticker != '') {
al@558 572 as.innerHTML = '<span data-img="@clock@"></span>';
al@498 573 }
al@498 574 }
al@498 575 }
al@498 576
al@522 577
al@522 578
al@525 579 //
al@525 580 // Class manipulation from http://www.openjs.com/scripts/dom/class_manipulation.php
al@525 581 //
al@522 582
al@522 583 function hasClass(ele,cls) {
al@522 584 return document.getElementById(ele).className.match(new RegExp('(\\s|^)' + cls + '(\\s|$)'));
al@522 585 }
al@522 586
al@522 587 function addClass(ele,cls) {
al@522 588 if (!this.hasClass(ele,cls))
al@522 589 document.getElementById(ele).className += " " + cls;
al@522 590 }
al@522 591
al@522 592 function removeClass(ele,cls) {
al@522 593 if (hasClass(ele,cls)) {
al@522 594 var reg = new RegExp('(\\s|^)'+cls+'(\\s|$)');
al@522 595 document.getElementById(ele).className = document.getElementById(ele).className.replace(reg,' ');
al@522 596 }
al@522 597 }
al@522 598
al@522 599
al@522 600
al@522 601
al@522 602 //http://stackoverflow.com/questions/4770025/how-to-disable-scrolling-temporarily
al@522 603
al@522 604 // left: 37, up: 38, right: 39, down: 40,
al@522 605 // spacebar: 32, pageup: 33, pagedown: 34, end: 35, home: 36
al@522 606 var keys = [32, 33, 34, 35, 36, 37, 38, 39, 40];
al@522 607
al@522 608 function preventDefault(e) {
al@522 609 e = e || window.event;
al@522 610 if (e.preventDefault)
al@522 611 e.preventDefault();
al@522 612 e.returnValue = false;
al@522 613 }
al@522 614
al@522 615 function keydown(e) {
al@522 616 for (var i = keys.length; i--;) {
al@522 617 if (e.keyCode === keys[i]) {
al@522 618 preventDefault(e);
al@522 619 return;
al@522 620 }
al@522 621 }
al@522 622 }
al@522 623
al@522 624 function wheel(e) {
al@522 625 preventDefault(e);
al@522 626 }
al@522 627
al@522 628 function scrolling(command) {
al@522 629 if (command == 'disable') {
al@522 630 if (window.addEventListener) {
al@522 631 window.addEventListener('DOMMouseScroll', wheel, false); }
al@522 632 window.onmousewheel = document.onmousewheel = document.ontouchmove = wheel;
al@522 633 document.onkeydown = keydown;
al@522 634 } else {
al@522 635 if (window.removeEventListener) {
al@522 636 window.removeEventListener('DOMMouseScroll', wheel, false); }
al@522 637 window.onmousewheel = document.onmousewheel = document.onkeydown = document.ontouchmove = null;
al@522 638 }
al@522 639 }
al@522 640
al@522 641
al@522 642
al@522 643
al@525 644 //
al@525 645 // Show/hide popups
al@525 646 //
al@522 647
al@522 648 function popup(name, action) {
al@522 649 if (action == 'show') {
al@522 650 scrolling('disable');
al@522 651 document.getElementById('toolbar').style.zIndex = '0';
al@522 652 removeClass('shader', 'hidden');
al@522 653 removeClass(name, 'hidden');
al@522 654 } else {
al@522 655 addClass(name, 'hidden');
al@522 656 addClass('shader', 'hidden');
al@522 657 scrolling('enable');
al@522 658 document.getElementById('toolbar').style.zIndex = '10';
al@522 659 }
al@522 660 }
al@522 661
al@522 662