// handle-wide-condent.js
// http://www.isocra.com/articles/jsdebug.php
// Show the debug window
function showDebug() {
window.top.debugWindow =
window.open("",
"Debug",
"left=0,top=0,width=300,height=700,scrollbars=yes,"
+"status=yes,resizable=yes");
window.top.debugWindow.opener = self;
// open the document for writing
window.top.debugWindow.document.open();
window.top.debugWindow.document.write(
"Debug Window\n");
}
// If the debug window exists, then write to it
function debug(text) {
if (window.top.debugWindow && ! window.top.debugWindow.closed) {
window.top.debugWindow.document.write(text+"\n");
}
}
// If the debug window exists, then close it
function hideDebug() {
if (window.top.debugWindow && ! window.top.debugWindow.closed) {
window.top.debugWindow.close();
window.top.debugWindow = null;
}
}
//showDebug();
if (window.top.debugWindow) debug("version 1");
if (window.top.debugWindow) debug("begin at " + Date());
// http://www.quirksmode.org/js/detect.html
var detect = navigator.userAgent.toLowerCase();
var OS,browser,version,total,thestring;
if (checkIt('konqueror'))
{
browser = "Konqueror";
OS = "Linux";
}
else if (checkIt('safari')) browser = "Safari"
else if (checkIt('omniweb')) browser = "OmniWeb"
else if (checkIt('opera')) browser = "Opera"
else if (checkIt('webtv')) browser = "WebTV";
else if (checkIt('icab')) browser = "iCab"
else if (checkIt('msie')) browser = "Internet Explorer"
else if (!checkIt('compatible'))
{
browser = "Netscape Navigator"
version = detect.charAt(8);
}
else browser = "An unknown browser";
if (!version) version = detect.charAt(place + thestring.length);
if (!OS)
{
if (checkIt('linux')) OS = "Linux";
else if (checkIt('x11')) OS = "Unix";
else if (checkIt('mac')) OS = "Mac"
else if (checkIt('win')) OS = "Windows"
else OS = "an unknown operating system";
}
function checkIt(string)
{
place = detect.indexOf(string) + 1;
thestring = string;
return place;
}
if (window.top.debugWindow) debug("finish browser detect at " + Date());
//
// TODO: process document in linear fashion so that as each element is processed, that element's starting position will not change (i.e., all preceding elements have been processed)
//
// only use this script for IE, which doesn't handle the layout without assistance
if (browser == "Internet Explorer") {
if (document.images) {
window.onload=initializeWideContent;
} else {
window.onload=handleWideContent;
}
window.onresize=handleWideContent;
}
if (window.top.debugWindow) debug("finish setting onload at " + Date());
function initializeWideContent() {
// store size attributes of each image
if (window.top.debugWindow) debug("begin initializeWideContent at " + Date());
var contentImages = $$("#content_body img");
for(i = 0; i < contentImages.length; i++) {
image = contentImages[i];
image._OriginalWidth = image.width;
image._OriginalHeight = image.height;
}
if (window.top.debugWindow) debug("finish initializeWideContent at " + Date());
handleWideContent(); // handle wide content for the first time
}
function handleWideContent() {
if (window.top.debugWindow) debug("begin handleWideContent at " + Date());
var percentAvailableWidth = 0.79;
var masterDiv = $('master');
var contentBodyDiv = $('content_body');
if (window.top.debugWindow) debug("checkpoint 1 at " + Date());
// determine ex and em widths, in pixels
new Insertion.Bottom(masterDiv, "");
var testSpan = $('testSpan');
testSpan.innerText = "x";
var exWidth = testSpan.offsetWidth;
//testSpan.innerText = "M";
//var emWidth = testSpan.offsetWidth;
masterDiv.removeChild(testSpan);
if (window.top.debugWindow) debug("checkpoint 2 at " + Date());
// available width = window inner width - margin around master - right padding kludge width
var pixelsAvailableWidth = Math.floor((windowInnerWidth() - exWidth * 3) * percentAvailableWidth);
// available height is reduced by 2 ex so that scrollable tables can easily fit within window
var pixelsAvailableHeight = windowInnerHeight() - exWidth * 2;
if (window.top.debugWindow) debug("checkpoint 3 at " + Date());
var wideContent = $$('span#main_content div.wide_content');
if (window.top.debugWindow) debug("checkpoint 4 at " + Date());
for(i = 0; i < wideContent.length; i++) {
var div = wideContent[i];
if (window.top.debugWindow) debug("[" + i + "] " + div.tagName.toLowerCase());
var pixelsElementAvailableWidth = pixelsAvailableWidth - (findPosX(div) - findPosX(contentBodyDiv));
var table = div.childNodes[0]; // table is first child of div
// default properties for div and table
var cssPropertySetDiv = $H();
cssPropertySetDiv['overflowX'] = 'visible';
cssPropertySetDiv['overflowY'] = 'visible';
cssPropertySetDiv['height'] = div.offsetHeight;
var cssPropertySetTable = $H();
cssPropertySetTable['margin-bottom'] = 0;
div.setStyle(cssPropertySetDiv); // reset div now so that offsetWidth property is correct
if (div.offsetWidth > pixelsElementAvailableWidth) { // is table too wide to fit within content area?
cssPropertySetDiv['overflowX'] = 'scroll';
cssPropertySetTable['marginBottom'] = '1.25em'; // for IE
if (div.offsetHeight > pixelsAvailableHeight) { // is table too tall to fit within browser window?
cssPropertySetDiv['height'] = pixelsAvailableHeight;
cssPropertySetDiv['overflowY'] = 'scroll';
cssPropertySetTable['margin-bottom'] = 0; // no need for extra bottom margin if using vertical scroll bar
}
}
Element.setStyle(table, cssPropertySetTable);
div.setStyle(cssPropertySetDiv);
}
if (window.top.debugWindow) debug("checkpoint 5 at " + Date());
var wideContent = $$('span#main_content img.wide_content');
if (window.top.debugWindow) debug("checkpoint 6 at " + Date());
for(i = 0; i < wideContent.length; i++) {
var image = wideContent[i];
if (window.top.debugWindow) debug("[" + i + "] " + img.tagName.toLowerCase());
var pixelsElementAvailableWidth = pixelsAvailableWidth - (findPosX(image) - findPosX(contentBodyDiv));
if (image._OriginalWidth > pixelsElementAvailableWidth) {
var percentReduced = pixelsElementAvailableWidth / image._OriginalWidth;
image.width = pixelsElementAvailableWidth;
image.height = Math.floor(image._OriginalHeight * percentReduced);
} else {
image.width = image._OriginalWidth;
image.height = image._OriginalHeight;
}
}
if (window.top.debugWindow) debug("finish handleWideContent at " + Date());
}
function windowInnerWidth() {
var myWidth = 0;
if( typeof( window.innerWidth ) == 'number' ) {
//Non-IE
myWidth = window.innerWidth;
} else if( document.documentElement && ( document.documentElement.clientWidth || document.documentElement.clientHeight ) ) {
//IE 6+ in 'standards compliant mode'
myWidth = document.documentElement.clientWidth;
} else if( document.body && ( document.body.clientWidth || document.body.clientHeight ) ) {
//IE 4 compatible
myWidth = document.body.clientWidth;
}
return( myWidth );
}
function windowInnerHeight() {
var myHeight = 0;
if( typeof( window.innerHeight ) == 'number' ) {
//Non-IE
myHeight = window.innerHeight;
} else if( document.documentElement && ( document.documentElement.clientHeight || document.documentElement.clientHeight ) ) {
//IE 6+ in 'standards compliant mode'
myHeight = document.documentElement.clientHeight;
} else if( document.body && ( document.body.clientHeight || document.body.clientHeight ) ) {
//IE 4 compatible
myHeight = document.body.clientHeight;
}
return( myHeight );
}
// http://www.quirksmode.org/js/findpos.html
function findPosX(obj) {
var curleft = 0;
if (obj.offsetParent) {
while (obj.offsetParent) {
curleft += obj.offsetLeft
obj = obj.offsetParent;
}
} else if (obj.x) {
curleft += obj.x;
}
return curleft;
}
function findPosY(obj) {
var curtop = 0;
if (obj.offsetParent) {
while (obj.offsetParent) {
curtop += obj.offsetTop
obj = obj.offsetParent;
}
} else if (obj.y) {
curtop += obj.y;
}
return curtop;
}