📄 mask.js
字号:
/*
modified teams 08/11/09 移动对话框
modified teams 08/11/07 IE下,防止浏览器提示“internet explore 无法打开internet站点 已终止操作”
modified teams 08/11/03 Add
*/
if (!window.classMask)
{
window.classMask = { };
}
/*构造函数 */
classMask.errMsg = "";
classMask.objMask = null;
classMask.objMsgbox = null;
classMask.useObj = null;
classMask.Flag = false;
classMask.Timer = null;
classMask.tempMask = new Template("<table width='100%' border='0' style='color:#ffffff;height:100%;'><tr><td align='center'>#{MsgText}</td></tr></table>");
classMask.tempMsgboxTitleBar = new Template("width:100%;height:#{titleheight}px;text-align:left;font:bold 14px '宋体';color:#{titlecolor};cursor:pointer;background-color:#{titlebgcolor};");
classMask.tempMsgboxClose = new Template("<a href='javascript:void(0)' onclick='classMask.hideMsg()' onfocus='this.blur();' title='关闭'><Image src='#{ImagClose}' alt='关闭' border='0' align='middle' onmouseover='this.width--' onmouseout='this.width++' /></a>");
/*初始化*/
classMask.Guage="";/*进度信息 */
classMask.closeTime=5;/*单位秒 */
try{ classMask.closeImage = $("mask").src.replace(/mask\.js/gi,"mask.gif")}catch(e){}
/* classRounded Start */
classMask.roundSettings = {
tl: { radius: 3 },
tr: { radius: 3 },
bl: { radius: 20 },
br: { radius: 20 },
antiAlias: true,
autoPad: false
}
classMask.classRound=function(settingsObj,divobj){
var obj1 = new classMask.classRoundInit();
var obj2= new obj1.curvyCorners(settingsObj, divobj);
obj2.applyCornersToAll();
}
classMask.classRoundInit=function(){
// Browser detection
var isIE = navigator.userAgent.toLowerCase().indexOf("msie") > -1;
var isMoz = document.implementation && document.implementation.createDocument;
var isSafari = ((navigator.userAgent.toLowerCase().indexOf('safari')!=-1)&&(navigator.userAgent.toLowerCase().indexOf('mac')!=-1))?true:false;
/*
Usage:
newCornersObj = new curvyCorners(settingsObj, "classNameStr");
newCornersObj = new curvyCorners(settingsObj, divObj1[, divObj2[, divObj3[, . . . [, divObjN]]]]);
*/
this.curvyCorners=function(){
// Check parameters
if(typeof(arguments[0]) != "object") throw newCurvyError("First parameter of curvyCorners() must be an object.");
if(typeof(arguments[1]) != "object" && typeof(arguments[1]) != "string") throw newCurvyError("Second parameter of curvyCorners() must be an object or a class name.");
// Get object(s)
if(typeof(arguments[1]) == "string")
{
// Get elements by class name
var startIndex = 0;
var boxCol = getElementsByClass(arguments[1]);
}
else
{
// Get objects
var startIndex = 1;
var boxCol = arguments;
}
// Create return collection/object
var curvyCornersCol = new Array();
// Create array of html elements that can have rounded corners
if(arguments[0].validTags)
var validElements = arguments[0].validTags;
else
var validElements = ["div"]; // Default
// Loop through each argument
for(var i = startIndex, j = boxCol.length; i < j; i++)
{
// Current element tag name
var currentTag = boxCol[i].tagName.toLowerCase();
if(inArray(validElements, currentTag) !== false)
{
curvyCornersCol[curvyCornersCol.length] = new curvyObject(arguments[0], boxCol[i]);
}
}
this.objects = curvyCornersCol;
// Applys the curvyCorners to all objects
this.applyCornersToAll = function()
{
for(var x = 0, k = this.objects.length; x < k; x++)
{
this.objects[x].applyCorners();
}
}
}
// curvyCorners object (can be called directly)
function curvyObject()
{
// Setup Globals
this.box = arguments[1];
this.settings = arguments[0];
this.topContainer = null;
this.bottomContainer = null;
this.masterCorners = new Array();
this.contentDIV = null;
// Get box formatting details
var boxHeight = get_style(this.box, "height", "height");
var boxWidth = get_style(this.box, "width", "width");
var borderWidth = get_style(this.box, "borderTopWidth", "border-top-width");
var borderColour = get_style(this.box, "borderTopColor", "border-top-color");
var boxColour = get_style(this.box, "backgroundColor", "background-color");
var backgroundImage = get_style(this.box, "backgroundImage", "background-image");
var boxPosition = get_style(this.box, "position", "position");
var boxPadding = get_style(this.box, "paddingTop", "padding-top");
// Set formatting propertes
this.boxHeight = parseInt(((boxHeight != "" && boxHeight != "auto" && boxHeight.indexOf("%") == -1)? boxHeight.substring(0, boxHeight.indexOf("px")) : this.box.scrollHeight));
this.boxWidth = parseInt(((boxWidth != "" && boxWidth != "auto" && boxWidth.indexOf("%") == -1)? boxWidth.substring(0, boxWidth.indexOf("px")) : this.box.scrollWidth));
this.borderWidth = parseInt(((borderWidth != "" && borderWidth.indexOf("px") !== -1)? borderWidth.slice(0, borderWidth.indexOf("px")) : 0));
this.boxColour = format_colour(boxColour);
this.boxPadding = parseInt(((boxPadding != "" && boxPadding.indexOf("px") !== -1)? boxPadding.slice(0, boxPadding.indexOf("px")) : 0));
this.borderColour = format_colour(borderColour);
this.borderString = this.borderWidth + "px" + " solid " + this.borderColour;
this.backgroundImage = ((backgroundImage != "none")? backgroundImage : "");
this.boxContent = this.box.innerHTML;
// Make box relative if not already absolute and remove any padding
if(boxPosition != "absolute") this.box.style.position = "relative";
this.box.style.padding = "0px";
// If IE and height and width are not set, we need to set width so that we get positioning
if(isIE && boxWidth == "auto" && boxHeight == "auto") this.box.style.width = "100%";
// Resize box so that it stays to the orignal height
// Remove content if box is using autoPad
if(this.settings.autoPad == true && this.boxPadding > 0)
this.box.innerHTML = "";
/*
This method creates the corners and
applies them to the div element.
*/
this.applyCorners = function()
{
/*
Create top and bottom containers.
These will be used as a parent for the corners and bars.
*/
for(var t = 0; t < 2; t++)
{
switch(t)
{
// Top
case 0:
// Only build top bar if a top corner is to be draw
if(this.settings.tl || this.settings.tr)
{
var newMainContainer = document.createElement("DIV");
newMainContainer.style.width = "100%";
newMainContainer.style.fontSize = "1px";
newMainContainer.style.overflow = "hidden";
newMainContainer.style.position = "absolute";
newMainContainer.style.paddingLeft = this.borderWidth + "px";
newMainContainer.style.paddingRight = this.borderWidth + "px";
var topMaxRadius = Math.max(this.settings.tl ? this.settings.tl.radius : 0, this.settings.tr ? this.settings.tr.radius : 0);
newMainContainer.style.height = topMaxRadius + "px";
newMainContainer.style.top = 0 - topMaxRadius + "px";
newMainContainer.style.left = 0 - this.borderWidth + "px";
this.topContainer = this.box.appendChild(newMainContainer);
}
break;
// Bottom
case 1:
// Only build bottom bar if a top corner is to be draw
if(this.settings.bl || this.settings.br)
{
var newMainContainer = document.createElement("DIV");
newMainContainer.style.width = "100%";
newMainContainer.style.fontSize = "1px";
newMainContainer.style.overflow = "hidden";
newMainContainer.style.position = "absolute";
newMainContainer.style.paddingLeft = this.borderWidth + "px";
newMainContainer.style.paddingRight = this.borderWidth + "px";
var botMaxRadius = Math.max(this.settings.bl ? this.settings.bl.radius : 0, this.settings.br ? this.settings.br.radius : 0);
newMainContainer.style.height = botMaxRadius + "px";
newMainContainer.style.bottom = 0 - botMaxRadius + "px";
newMainContainer.style.left = 0 - this.borderWidth + "px";
this.bottomContainer = this.box.appendChild(newMainContainer);
}
break;
}
}
// Turn off current borders
if(this.topContainer) this.box.style.borderTopWidth = "0px";
if(this.bottomContainer) this.box.style.borderBottomWidth = "0px";
// Create array of available corners
var corners = ["tr", "tl", "br", "bl"];
/*
Loop for each corner
*/
for(var i in corners)
{
// FIX for prototype lib
if(i > -1 < 4)
{
// Get current corner type from array
var cc = corners[i];
// Has the user requested the currentCorner be round?
if(!this.settings[cc])
{
// No
if(((cc == "tr" || cc == "tl") && this.topContainer != null) || ((cc == "br" || cc == "bl") && this.bottomContainer != null))
{
// We need to create a filler div to fill the space upto the next horzontal corner.
var newCorner = document.createElement("DIV");
// Setup corners properties
newCorner.style.position = "relative";
newCorner.style.fontSize = "1px";
newCorner.style.overflow = "hidden";
// Add background image?
if(this.backgroundImage == "")
newCorner.style.backgroundColor = this.boxColour;
else
newCorner.style.backgroundImage = this.backgroundImage;
switch(cc)
{
case "tl":
newCorner.style.height = topMaxRadius - this.borderWidth + "px";
newCorner.style.marginRight = this.settings.tr.radius - (this.borderWidth*2) + "px";
newCorner.style.borderLeft = this.borderString;
newCorner.style.borderTop = this.borderString;
newCorner.style.left = -this.borderWidth + "px";
break;
case "tr":
newCorner.style.height = topMaxRadius - this.borderWidth + "px";
newCorner.style.marginLeft = this.settings.tl.radius - (this.borderWidth*2) + "px";
newCorner.style.borderRight = this.borderString;
newCorner.style.borderTop = this.borderString;
newCorner.style.backgroundPosition = "-" + (topMaxRadius + this.borderWidth) + "px 0px";
newCorner.style.left = this.borderWidth + "px";
break;
case "bl":
newCorner.style.height = botMaxRadius - this.borderWidth + "px";
newCorner.style.marginRight = this.settings.br.radius - (this.borderWidth*2) + "px";
newCorner.style.borderLeft = this.borderString;
newCorner.style.borderBottom = this.borderString;
newCorner.style.left = -this.borderWidth + "px";
newCorner.style.backgroundPosition = "-" + (this.borderWidth) + "px -" + (this.boxHeight + (botMaxRadius + this.borderWidth)) + "px";
break;
case "br":
newCorner.style.height = botMaxRadius - this.borderWidth + "px";
newCorner.style.marginLeft = this.settings.bl.radius - (this.borderWidth*2) + "px";
newCorner.style.borderRight = this.borderString;
newCorner.style.borderBottom = this.borderString;
newCorner.style.left = this.borderWidth + "px"
newCorner.style.backgroundPosition = "-" + (botMaxRadius + this.borderWidth) + "px -" + (this.boxHeight + (botMaxRadius + this.borderWidth)) + "px";
break;
}
}
}
else
{
/*
PERFORMANCE NOTE:
If more than one corner is requested and a corner has been already
created for the same radius then that corner will be used as a master and cloned.
The pixel bars will then be repositioned to form the new corner type.
All new corners start as a bottom right corner.
*/
if(this.masterCorners[this.settings[cc].radius])
{
// Create clone of the master corner
var newCorner = this.masterCorners[this.settings[cc].radius].cloneNode(true);
}
else
{
// Yes, we need to create a new corner
var newCorner = document.createElement("DIV");
newCorner.style.height = this.settings[cc].radius + "px";
newCorner.style.width = this.settings[cc].radius + "px";
newCorner.style.position = "absolute";
newCorner.style.fontSize = "1px";
newCorner.style.overflow = "hidden";
// THE FOLLOWING BLOCK OF CODE CREATES A ROUNDED CORNER
// ---------------------------------------------------- TOP
// Get border radius
var borderRadius = parseInt(this.settings[cc].radius - this.borderWidth);
// Cycle the x-axis
for(var intx = 0, j = this.settings[cc].radius; intx < j; intx++)
{
// Calculate the value of y1 which identifies the pixels inside the border
if((intx +1) >= borderRadius)
var y1 = -1;
else
var y1 = (Math.floor(Math.sqrt(Math.pow(borderRadius, 2) - Math.pow((intx+1), 2))) - 1);
// Only calculate y2 and y3 if there is a border defined
if(borderRadius != j)
{
if((intx) >= borderRadius)
var y2 = -1;
else
var y2 = Math.ceil(Math.sqrt(Math.pow(borderRadius,2) - Math.pow(intx, 2)));
if((intx+1) >= j)
var y3 = -1;
else
var y3 = (Math.floor(Math.sqrt(Math.pow(j ,2) - Math.pow((intx+1), 2))) - 1);
}
// Calculate y4
if((intx) >= j)
var y4 = -1;
else
var y4 = Math.ceil(Math.sqrt(Math.pow(j ,2) - Math.pow(intx, 2)));
// Draw bar on inside of the border with foreground colour
if(y1 > -1) this.drawPixel(intx, 0, this.boxColour, 100, (y1+1), newCorner, -1, this.settings[cc].radius);
// Only draw border/foreground antialiased pixels and border if there is a border defined
if(borderRadius != j)
{
// Cycle the y-axis
for(var inty = (y1 + 1); inty < y2; inty++)
{
// Draw anti-alias pixels
if(this.settings.antiAlias)
{
// For each of the pixels that need anti aliasing between the foreground and border colour draw single pixel divs
if(this.backgroundImage != "")
{
var borderFract = (pixelFraction(intx, inty, borderRadius) * 100);
if(borderFract < 30)
{
this.drawPixel(intx, inty, this.borderColour, 100, 1, newCorner, 0, this.settings[cc].radius);
}
else
{
this.drawPixel(intx, inty, this.borderColour, 100, 1, newCorner, -1, this.settings[cc].radius);
}
}
else
{
var pixelcolour = BlendColour(this.boxColour, this.borderColour, pixelFraction(intx, inty, borderRadius));
this.drawPixel(intx, inty, pixelcolour, 100, 1, newCorner, 0, this.settings[cc].radius, cc);
}
}
}
// Draw bar for the border
if(this.settings.antiAlias)
{
if(y3 >= y2)
{
if (y2 == -1) y2 = 0;
this.drawPixel(intx, y2, this.borderColour, 100, (y3 - y2 + 1), newCorner, 0, 0);
}
⌨️ 快捷键说明
复制代码
Ctrl + C
搜索代码
Ctrl + F
全屏模式
F11
切换主题
Ctrl + Shift + D
显示快捷键
?
增大字号
Ctrl + =
减小字号
Ctrl + -