|
// Popup.js
// Author: William Su
var V=parseInt(navigator.appVersion);
var B=(navigator.userAgent+navigator.appName).toLowerCase();
var NS4=(B.indexOf("netscape")!=-1&&V==4);
var IE=(B.indexOf("microsoft")!=-1);
var parentInputBox = null;
var parentImage = null;
var PopupDivId = 'Popup';
var PopupIFrameId = 'PopupIFrame';
document.write("<iframe id='PopupIFrame' src='javascript:false' frameBorder='0' scrolling='no'></iframe>");
document.write("<div id='Popup'></div>");
if(!NS4) window.onresize=function()
{
if(parentInputBox)
{
HidePopup();
}
}
function iecompattest()
{
return (document.compatMode && document.compatMode!="BackCompat")? document.documentElement : document.body
}
if(!NS4) document.onmouseup=function(e)
{
if(parentInputBox)
{
var inputBoxPos = new Position(parentInputBox);
var linkPos = new Position(parentImage);
var PopupPos = new Position(PopupDivId);
var x = PopupPos.GetElementLeft();
var y = PopupPos.GetElementBottom();
var x = inputBoxPos.GetElementLeft();
var y = inputBoxPos.GetElementBottom();
var top=document.all && !window.opera? iecompattest().scrollTop : window.pageYOffset;
var windowedge=document.all && !window.opera? iecompattest().scrollTop+iecompattest().clientHeight : window.pageYOffset+window.innerHeight;
if(y + PopupPos.GetElementHeight() > windowedge)
{
var z = inputBoxPos.GetElementTop() - PopupPos.GetElementHeight();
if(z >= top)
y = z;
}
var width = PopupPos.GetElementWidth();
var height = PopupPos.GetElementHeight();
var lx = linkPos.GetElementLeft();
var ly = linkPos.GetElementTop();
var lwidth = linkPos.GetElementWidth();
var lheight = linkPos.GetElementHeight();
var pageX, pageY;
if (window.event)
{
e = window.event;
pageX = e.clientX;
pageY = e.clientY;
}
else
{
pageX = e.pageX;
pageY = e.pageY;
}
if(!((pageX >= x && pageY >= y && pageX < x+width && pageY < y+height) || (pageX >= lx && pageY >= ly && pageX < lx+lwidth && pageY < ly+lheight)))
HidePopup();
}
}
function Position(object)
{
var m_elem = object;
this.GetElementWidth = GetElementWidth;
function GetElementWidth()
{
var elem;
if(typeof(m_elem) == "object")
{
elem = m_elem;
}
else
{
elem = document.getElementById(m_elem);
}
return parseInt(elem.offsetWidth);
}
this.GetElementHeight = GetElementHeight;
function GetElementHeight()
{
var elem;
if(typeof(m_elem) == "object")
{
elem = m_elem;
}
else
{
elem = document.getElementById(m_elem);
}
return parseInt(elem.offsetHeight);
}
this.GetElementLeft = GetElementLeft;
function GetElementLeft()
{
var x = 0;
var elem;
if(typeof(m_elem) == "object")
elem = m_elem;
else
elem = document.getElementById(m_elem);
while (elem != null)
{
x += elem.offsetLeft;
elem = elem.offsetParent;
}
return parseInt(x);
}
this.GetElementRight = GetElementRight;
function GetElementRight()
{
return GetElementLeft(m_elem) + GetElementWidth(m_elem);
}
this.GetElementTop = GetElementTop;
function GetElementTop()
{
var y = 0;
var elem;
if(typeof(m_elem) == "object")
{
elem = m_elem;
}
else
{
elem = document.getElementById(m_elem);
}
while (elem != null)
{
y+= elem.offsetTop;
elem = elem.offsetParent;
}
return parseInt(y);
}
this.GetElementBottom = GetElementBottom;
function GetElementBottom()
{
return GetElementTop(m_elem) + GetElementHeight(m_elem);
}
}
function Popup()
{
var Desc = 0;
function SetElementProperty(elemId, property, value)
{
var elem = null;
if(typeof(elemId) == "object")
elem = elemId;
else
elem = document.getElementById(elemId);
if((elem != null) && (elem.style != null))
{
elem = elem.style;
elem[property] = value;
}
}
this.Sort = Sort;
function Sort(change)
{
Desc = change;
Popup = document.getElementById(PopupDivId);
Popup.innerHTML = PopupInnerHTML();
}
this.SelectFont = SelectFont;
function SelectFont(value)
{
parentInputBox.value = value;
Hide();
return;
}
function PopupInnerHTML()
{
var table = "<table width=150 cellspacing='0' cellpadding='3' border='0'>";
table += "<tr class='header'>";
table += " <td align='center' nowrap>";
table += "<a href='javascript:Sort(0);' class='linkText'>A->Z</a> ";
table += "<a href='javascript:Sort(1);' class='linkText'>Z->A</a> ";
table += "<a href='javascript:HidePopup();' class='linkText'>Cancel</a>";
table+="</td></tr><tr><td>";
if(Desc == 0)
{
table+="<a href='javascript:SelectFont(\"cursive\");' class='cursive'>cursive</a><br>";
table+="<a href='javascript:SelectFont(\"fantasy\");' class='fantasy'>fantasy</a><br>";
table+="<a href='javascript:SelectFont(\"monospace\");' class='monospace'>monospace</a><br>";
table+="<a href='javascript:SelectFont(\"sans-serif\");' class='sans-serif'>sans-serif</a><br>";
table+="<a href='javascript:SelectFont(\"serif\");' class='serif'>serif</a>";
}
else
{
table+="<a href='javascript:SelectFont(\"serif\");' class='serif'>serif</a><br>";
table+="<a href='javascript:SelectFont(\"sans-serif\");' class='sans-serif'>sans-serif</a><br>";
table+="<a href='javascript:SelectFont(\"monospace\");' class='monospace'>monospace</a><br>";
table+="<a href='javascript:SelectFont(\"fantasy\");' class='fantasy'>fantasy</a><br>";
table+="<a href='javascript:SelectFont(\"cursive\");' class='cursive'>cursive</a>";
}
table+="</td></tr></table>";
return table;
}
this.Show = Show;
function Show(inputBox, img)
{
// If the Popup is visible, hide it.
if (parentInputBox == inputBox)
{
return;
}
else
{
parentInputBox = inputBox;
parentImage = img;
}
if(document.getElementById)
{
Popup = document.getElementById(PopupDivId);
Popup.innerHTML = PopupInnerHTML();
// Fixed some Windows and IE problems
if(B.indexOf("win")!=-1 && IE)
SetElementProperty(PopupIFrameId, 'display', 'block');
SetElementProperty(PopupDivId, 'display', 'block');
var inputBoxPos = new Position(parentInputBox);
var PopupPos = new Position(PopupDivId);
var x = inputBoxPos.GetElementLeft();
var y = inputBoxPos.GetElementBottom();
var top=document.all && !window.opera? iecompattest().scrollTop : window.pageYOffset;
var windowedge=document.all && !window.opera? iecompattest().scrollTop+iecompattest().clientHeight : window.pageYOffset+window.innerHeight;
if(y + PopupPos.GetElementHeight() > windowedge)
{
var z = inputBoxPos.GetElementTop() - PopupPos.GetElementHeight();
if(z >= top)
y = z;
}
SetElementProperty(PopupDivId, 'left', x + "px");
SetElementProperty(PopupDivId, 'top', y + "px");
SetElementProperty(PopupIFrameId, 'left', x + "px");
SetElementProperty(PopupIFrameId, 'top', y + "px");
SetElementProperty(PopupIFrameId, 'width', PopupPos.GetElementWidth() + "px");
SetElementProperty(PopupIFrameId, 'height', PopupPos.GetElementHeight() + "px");
}
}
this.Hide = Hide;
function Hide()
{
if(parentInputBox)
{
SetElementProperty(PopupDivId, 'display', 'none');
SetElementProperty(PopupIFrameId, 'display', 'none');
parentInputBox = null;
}
}
}
var PopupWin = new Popup();
function ShowPopup(inputBox, imgDropDown)
{
if(parentInputBox == null)
PopupWin.Show(inputBox, imgDropDown);
else
PopupWin.Hide();
}
function HidePopup()
{
PopupWin.Hide();
}
function SelectFont(value)
{
PopupWin.SelectFont(value);
}
function Sort(change)
{
PopupWin.Sort(change);
}
|
By viewing downloads associated with this article you agree to the Terms of Service and the article's licence.
If a file you wish to view isn't highlighted, and is a text file (not binary), please
let us know and we'll add colourisation support for it.
William is currently working for Toshiba. His programming experience includes C/C++, C#, MFC, Java, ASP.NET and SQL. His Internet experience includes XML, SOAP and UI design. He is MCSD.NET, MCDBA and MCT certified and has a MS degree in CS.
Willaim was born in Taiwan but lives in USA. For relaxation he enjoy traveling and art.