dialog.js

已经消失的不易找到的C++ builder网络教程总结

/**
 * <p>dialog.js - create a dialog</p>
 * <p>apnana javascript client library</p>
 * <p>DOM ID used: APDialog-* APDialog_*</p>
 * @author Li Shaopeng
 * @version 0.3 2007-02-05
 */


/**
 * define and write CSS
 */
if(APDIALOG_STYLE==undefined)
{
  var APDIALOG_STYLE = 
    '<style>\
	.APDialog-border{border-top:1px solid #e4e0d7;border-left:1px solid #e4e0d7;border-right:1px solid #555555;border-bottom:1px solid #555555;}\
	.APDialog-title td{height:25px;background-color:#3588e7;font-weight:bold;color:white;}\
	.APDialog-back{height:150px;background-color:#e8e8e8;}\
	</style>'
}
document.write(APDIALOG_STYLE);
delete APDIALOG_STYLE;


/**
 * Global object APDialog
 */
var APDialog={};

/**
 * Background html div, to disable layers
 */  
APDialog.bghtml = '<iframe frameborder="0" id="APDialog_bg_${bknum}" style="background-color:black;position:absolute;top:0px;left:0px;width:100%;height:100%;filter:alpha(opacity=30);opacity:0.1"></iframe>';

/**
 * Wait dialog
 */
APDialog.waithtml = '\
  <table class="APDialog-border" border="0" cellspacing="1" cellpadding="0" width="350px" >\
    <tr><td class="APDialog-back"><center> &#25805;&#20316;&#27491;&#22312;&#25191;&#34892;&#20013;&#65292;&#35831;&#31245;&#20505;...... </center></td></tr>\
  </table>';

/**
 * Alert dialog
 */
APDialog.alerthtml = '\
<table class="APDialog-border" border="0" cellspacing="0" cellpadding="0"><tr><td>\
  <table border="0" cellspacing="0" cellpadding="0" width="350px">\
    <tr class="APDialog-title">\
	  <td align="left" onmouseover="this.style.cursor=\'move\'" onmousedown="APDialog.startmove(event)" width="99%"><div>&nbsp;&nbsp;${title}</div></td>\
	  <td align="right" width="10px"><div style="font-size:14px;font-family:Nina;font-weight:bold;margin-right:3px;"  onclick="APDialog.destroy()" onmouseover="this.style.cursor=\'pointer\'">&#215</div></td>\
	</tr>\
	<tr class="APDialog-back">\
	  <td style="border-top:1px solid #555555" valign="top" colspan="2" align="center"><div style="border-top:1px solid white;width:100%">${message}</div></td>\
	</tr>\
  <table>\
</td></tr></table>';

/**
 * APDialog stack, [bg-iframe, APDialog-div]
 */
APDialog.stack = new Array();

/**
 * Show wait APDialog
 */
APDialog.wait = function()
{
  APDialog.lockbg();
  var oalert = document.createElement('span');
  oalert.innerHTML = APDialog.waithtml;
  document.body.appendChild(oalert);
  APDialog.stack.push(oalert);
  APDialog.middle(oalert);
}
	
/**
 * <p>Show alert window</p>
 * @param {Object} tit - alert title
 * @param {Object} mes - alert message
 */ 
APDialog.alert = function(tit,mes)
{ 	
  APDialog.lockbg();
  var oalert = document.createElement('span');
  var a1 = APDialog.alerthtml.replace("${title}",tit);
  var a2 = a1.replace("${message}",mes);
  oalert.innerHTML = a2;
  oalert.style.zIndex=9999;
  document.body.appendChild(oalert);
  APDialog.stack.push(oalert);
  APDialog.middle(oalert);
}

/**
 * Lock background
 */
APDialog.lockbg = function()
{
  var obg = document.createElement('span');
  obg.innerHTML = APDialog.bghtml.replace("${bknum}",APDialog.stack.length);
  document.body.appendChild(obg);
  APDialog.stack.push(obg);
  $('APDialog_bg_'+(APDialog.stack.length-1)).style.top = document.body.offsetTop;
  $('APDialog_bg_'+(APDialog.stack.length-1)).style.left = document.body.offsetLeft;
  $('APDialog_bg_'+(APDialog.stack.length-1)).style.height = document.body.scrollHeight;
  $('APDialog_bg_'+(APDialog.stack.length-1)).style.width= document.body.scrollWidth;
}


/**
 * close all dialog
 */
APDialog.closeall = function()
{
  var l = APDialog.stack.length;
  for(var i=0;i<l;i++)document.body.removeChild(APDialog.stack.pop());
}

/**
 * Destroy top dialog
 */
APDialog.destroy = function()
{
  try{	
  document.body.removeChild(APDialog.stack.pop());
  document.body.removeChild(APDialog.stack.pop());
  }catch(e){}
}

/**
 * <p>make APDialog middle</p>
 * @param {Object} dlg - box to be fixed
 */
APDialog.middle = function(dlg){
  var scrollp = $s();
  dlg.style.position = 'absolute';
  dlg.style.left = (document.body.clientWidth / 2) - (dlg.offsetWidth / 2) + 'px';
  var sTop = scrollp.t + window.screen.availHeight/5;
  dlg.style.top = sTop > 0 ? sTop + 'px' : '10px';
  dlg=null;
}

/**
 * <p>drag APDialog</p>
 * @param {Object} event
 */
APDialog.startmove = function(event)
{
  var oObj = APDialog.stack[APDialog.stack.length-1];
  var dr = document.createElement('span');
  document.body.appendChild(dr);
  dr.style.position = 'absolute';
  dr.style.left = oObj.style.left;
  dr.style.top = oObj.style.top;
  dr.innerHTML = '<table style="cursor:move;border:5px solid #cccccc" width="352" cellspacing=0 cellpadding=0><tr><td height="167px"></td></tr></table>';
    
  dr.onmousemove = mousemove;
  dr.onmouseup = mouseup;
  dr.setCapture ? dr.setCapture() : function(){};
  oEvent = window.event ? window.event : event;
  var dragData = {x : oEvent.clientX, y : oEvent.clientY};
  

  function mousemove(event){
    var oEvent = window.event ? window.event : event;
    var iLeft = oEvent.clientX - dragData["x"] + parseInt(dr.style.left);
    var iTop = oEvent.clientY - dragData["y"] + parseInt(dr.style.top);
	if(iLeft<0)iLeft=0;
	if(iTop<0)iTop=0;
    dr.style.left = iLeft + 'px';
    dr.style.top = iTop + 'px';
    dragData = {x: oEvent.clientX, y: oEvent.clientY};
  }
  function mouseup(event){
    var oEvent = window.event ? window.event : event;
    dr.onmousemove = null;
    dr.onmouseup = null;
    oObj.style.left = dr.style.left; 
    oObj.style.top = dr.style.top;
	document.body.removeChild(dr);
    dr.releaseCapture ? dr.releaseCapture() : function(){};
  }
}