| /**
* Project name: IBMETP Changshu ETP Homepage
* FileName: Messagebox.js
* Author: Li Mingcheng
* Date Created: 2009-12-21
* Current Version: 1.0
* Last modified: 2009-12-23 22:00
* Function Description: Implementation page pop-up message window JS package
*/
/** The following defines the global action function **/
Whether it is IE
var Isie = (document.all)? True:false; $ ID Selector
var $ = function (ID) {
Return "string" = = typeof ID? document.getElementById (ID): ID;
}; Class object
var Class = {
Create:function () {
return function () {this.initialize.apply (this, arguments);}
}
} function bindings
var Bind = function (object, fun) {
return function () {
Return Fun.apply (object, arguments);
}
} For Each loop
var each = function (list, fun) {
for (var i = 0, len = list.length i < len; i++) {Fun (list[i], i);}
};
var MessageBox = Class.create ();
Messagebox.prototype = {
Initialize:function (ID) {
Pop-up box width
This._boxwidth = 400;
Pop-up height
This._boxheight = 180;
Title
This._title = "";
This._titleid = "";
This._message = "";
This._messageid = "";
This._info = "";
This._boxid = ID;
Additional message boxes
This.appendbody ();
Initialize message box
This.initmessagebox ();
},
Appendbody:function () {
To create a dialog container for display
var MessageBox = document.createelement ("div");
Messagebox.id = This._boxid;
Document.body.appendChild (MessageBox); Create a mask container to display
var messageboxmask = document.createelement ("div");
Messageboxmask.id = This._boxid + "Mask";
Document.body.appendChild (Messageboxmask);
},
Show:function (title, message) {
A condition that only passes as one parameter
if (!message) {
Warning display
This.alert (title);
}
This._title = title;
this._message = message;
This.popup ();
},
Simulate system alert
Alert:function (message) {
This._title = "Message from page";
this._message = message;
This.popup ();
},
Pop-up window
Popup:function () {
$ (this._titleid). InnerHTML = This._title;
$ (this._messageid). InnerHTML = This._message;
if (Isie) {
$ (THIS._BOXID). Style.pixelwidth = This._boxwidth;
Control height
$ (THIS._BOXID). Style.pixelheight = This._boxheight;
Control minimum width
$ (THIS._BOXID). Style.minheight = This._boxheight;
$ (THIS._BOXID). Style.pixelleft = Math.ceil (document.body.clientwidth-this._boxwidth)/2;
Not yet implemented
$ (THIS._BOXID). Style.pixeltop = Math.ceil (Math.Abs ((document.body.clientheight-this._boxheight)/2)) + Document.body.scrollTop;
Set Mask Properties
$ (This._boxid + "Mask"). Style.pixelwidth = Document.body.clientWidth;
$ (This._boxid + "Mask"). Style.pixelheight = Document.body.clientHeight;
}
else{
$ (THIS._BOXID). Style.width = this._boxwidth + "px";
$ (THIS._BOXID). Style.left = Math.ceil ((document.body.clientwidth-this._boxwidth)/2) + "px";
Not yet implemented
$ (THIS._BOXID). Style.top = Math.ceil (Math.Abs ((document.body.clientheight-this._boxheight)/2)) + Document.body.scrollTop + "px";
Set Mask Properties
$ (This._boxid + "Mask"). Style.width = document.body.clientWidth + "px";
$ (This._boxid + "Mask"). Style.height = document.body.clientHeight + "px";
}
Hide Selection box
This.hiddeselect ();
Show Prompt window
$ (THIS._BOXID). style.display = "block";
Show Mask Layer
$ (This._boxid + "Mask"). Style.display = "block";
},
Close:function (message) {
$ (THIS._BOXID). Style.display = "None";
$ (This._boxid + "Mask"). Style.display = "None";
Restore Selection box
This.showselect ();
},
OK button callback
Btnok:function () {
This.close ();
return true;
},
Cancel Button Callback
Btncancel:function () {
This.close ();
return false;
},
Create a button
Createbutton:function (caption, callback) {
Append button
var button = document.createelement ("a");
button.innerhtml = caption;
Button.classname = "button";
Button.onclick = Bind (this, callback);
return button;
},
The following code is used for the control of the selection box (select) and is suitable for IE6 and the following versions
Hide Selection box
Hiddeselect:function () {
var sels = $ (document). getElementsByTagName ("select");
Each (sels, function (sel) {sel.style.visibility = "hidden";});
},
Show Selection box
Showselect:function () {
var sels = $ (document). getElementsByTagName ("select");
Each (sels, function (sel) {sel.style.visibility = "visible";});
},
Initialize message window
Initmessagebox:function () {
var container = $ (THIS._BOXID);
dialog box title
var msgtop = document.createelement ("H2");
dialog box title content
var msgtitle = document.createelement ("span");
Use time to set a unique ID
Msgtitle.id = "Msgtitle" + New Date (). GetTime (). toString ();
This._titleid = msgtitle.id;
Close button
var msgtopclose = document.createelement ("a");
Msgtopclose.classname= "Right";
Msgtopclose.onclick = Bind (this, this.close);
Msgtopclose.innerhtml= "Close";
Additional
First add the Close button, the right display
Msgtop.appendchild (Msgtopclose);
Msgtop.appendchild (Msgtitle);
Adding content elements
var msgcontent = document.createelement ("P");
Msgcontent.classname = "Content";
Use time to set a unique ID
Msgcontent.id = "Msgcontent" + New Date (). GetTime (). toString ();
This._messageid = msgcontent.id;
Add a button
var msgbuttons = document.createelement ("P");
Msgbuttons.classname = "buttons";
Append OK button
Msgbuttons.appendchild (This.createbutton ("OK", This.btnok));
Append Cancel button
Msgbuttons.appendchild (This.createbutton ("cancellation", This.btncancel));
Append element
Container.appendchild (Msgtop);
Container.appendchild (msgcontent);
Container.appendchild (msgbuttons);
}
} |
