Source of modalBox.js

Top

function xRemoveChildren(p) {
  if (!p.removeChild) return null;
  while (p.firstChild) {
    p.removeChild(p.firstChild); 
  }
  return true;
}
 
function xAddElement(tag,parent,txt,id,className) {
  var el = document.createElement(tag);
  if (txt) el.innerHTML = txt;
  if (id)  el.id = id;
  if (className) el.className = className;
  parent.appendChild(el);
  return el;
}
 
function ModalDialog () {
  this.OK     = 1 ;
  this.CANCEL = 2 ;
  this.RETRY  = 4 ;
  this.ABORT  = 8 ;
  this.IGNORE = 16;
  this.YES    = 32;
  this.NO     = 64;
  
  this.WARNING   = 1024;
  this.QUESTION  = 2048;
  this.WAIT      = 4096;
  
  this.buttonNames = ['OK','Cancel','Retry','Abort','Ignore','Yes','No'] ;
  this.iconNames   = ['Warning.png','Question.png','Wait.png'] ;
  
  function messageBox(prompt,caption,flags,callback) {
    flags   = flags || (this.OK + this.CANCEL + this.QUESTION);
    if ((flags & (this.WARNING + this.QUESTION + this.WAIT)) == 0) flags |= this.WARNING;
    caption = caption || "Question";
 
    var me = this;
    this.callbackFunction = callback;
    var canvas = xGetElementById("modalCanvas");
    if (!canvas) canvas = xAddElement("DIV",document.body,null,"modalCanvas");
    
    var dialog = xGetElementById("modalDialog");
    if (!dialog) dialog = xAddElement("DIV",document.body,null,"modalDialog");
    xRemoveChildren(dialog);
    this.dialog = dialog;
 
    xAddElement("P",dialog,caption,"modalCaption");
    
    for (var i = 0; i < this.iconNames.length; i++) {
      if (flags & (this.WARNING << i)) {
        xAddElement("IMG",dialog,"","modalIcon").src = this.iconNames[i];
      }
    }
 
    var modalContent = xAddElement("DIV",dialog,"","modalContent");
    xAddElement("DIV",modalContent,prompt,"modalText");
 
    var buttonLine = xAddElement("DIV",modalContent,"","modalButtons");
    var firstButtonLink;
    for (var i = 0; i < this.buttonNames.length; i++) {
      if (flags & (this.OK << i)) {
        var button = xAddElement("P",buttonLine,null,null,"modalButton");
        var link   = xAddElement("A",button,this.buttonNames[i],null,"modalButtonLink");
        link.href  = "#";
        button.id  = "modalButton_"+(this.OK << i);
        addLinkListener(link,me,this.OK << i);
        firstButtonLink = firstButtonLink || link;
      }
    }
    if (firstButtonLink) { firstButtonLink.focus(); this.firstButtonLink = firstButtonLink; }
 
    xAddEventListener(dialog,"keydown",function (evt) { me.keyboardHandler(evt,me) });
    setTimeout(function() { centerDialog(me.dialog); },10);
  }
  
  function addLinkListener(button,me,value) {
    button.clickFunction = function () { me.finishDialogBox(value); };
    xAddEventListener(button,"click",button.clickFunction);
  }
  
  this.messageBox = messageBox;
  
  function centerDialog(d) {
    var xpos = (xClientWidth() - xWidth(d)) / 2;
    var ypos = (xClientHeight() - xHeight(d)) / 2;
    
    xpos = xpos < 0 ? 0 : xpos;
    ypos = ypos < 0 ? 0 : ypos;
 
    xMoveTo(d,xpos + xScrollLeft(),ypos+xScrollTop());    
  }
  
  function keyboardHandler(evt,me) {
    var e = new xEvent(evt);
    xStopPropagation(evt);
    xPreventDefault(evt);
    
    var el = e.target;
    if (el.className != "modalButtonLink") { me.firstButtonLink.focus(); return; }
    var btn = el.parentNode;
 
    switch (e.keyCode) {
      case 9:  if (e.shiftKey) {
                 if (btn.previousSibling) { btn.previousSibling.firstChild.focus(); }
                   else { btn.parentNode.lastChild.firstChild.focus(); }
               } else {
                 if (btn.nextSibling) { btn.nextSibling.firstChild.focus(); }
                   else { btn.parentNode.firstChild.firstChild.focus(); }
               }
               break; 
      case 13: if (el.clickFunction) el.clickFunction();
               break;
      case 27: me.finishDialogBox(me.CANCEL);
               break;
    }
  }
  
  this.keyboardHandler = keyboardHandler;
  
  function finishDialogBox(value) {
    var canvas = xGetElementById("modalCanvas");
    if (canvas) canvas.parentNode.removeChild(canvas);
    if (this.dialog) this.dialog.parentNode.removeChild(this.dialog);
    this.dialog = null;
    this.firstButtonLink = null;
    if (this.callbackFunction) this.callbackFunction(value);
    this.callbackFunction = null;
  }
  
  function cancelMessageBox() {
    this.callbackFunction = null;
    this.finishDialogBox();
  }
  
  this.cancelMessageBox = cancelMessageBox;
  this.finishDialogBox  = finishDialogBox;
}
 
var Modal = new ModalDialog();
 
function _dom_trackActiveElement(evt) {
  if (evt && evt.target) { 
    document.activeElement = evt.target == document ? null : evt.target; }
}
 
function _dom_trackActiveElementLost(evt) { document.activeElement = null; }
 
if (document.addEventListener) {
  document.addEventListener("focus",_dom_trackActiveElement,true);
  document.addEventListener("blur",_dom_trackActiveElementLost,true);
}