Entries Tagged 'JavaScript' ↓

Here is a question I have been contemplating for a while…when to sanitize your input? Do you sanitize it as soon as you receive it, or when you need to use it?

Any thoughts?

What? There is more?! Of course. Previously I tackled the horizontal setup of dual monitors, now we tackle the vertical!

So just like window.screenLeft versus window.screenX, window.screenTop only works in IE and window.screenY works in everything else. So here is the code I used to setup a window.*property*:

// Find Top Boundary of current Window
function FindTopWindowBoundary()
{
	// In Internet Explorer window.screenTop is the window's top boundry
	if (window.screenTop)
	{
		return window.screenTop;
	}

	// In Firefox window.screenY is the window's top boundry
	if (window.screenY)
		return window.screenY;

	return 0;
}

window.topWindowBoundary  = FindTopWindowBoundary;

Then just like the horizontal setup, I needed to find the Monitor’s Top Border. Like the horizontal counter-part, you need to check the negative y-axis scenario, which left me with this code:

// Find Top Boundary of the Screen/Monitor
function FindTopScreenBoundary()
{
	// Check if the window is off the primary monitor in a positive axis
	// X,Y                 S = Screen, W = Window
	// 0,0     ----------
	//        |          |
	//        |          |
	//        |        S |
	//         ----------
	// X,Y
	// 0,1280  ----------
	//        |  ---     |
	//        | | W |    |
	//        |  ---   S |
	//         ----------
	if (window.topWindowBoundary() > window.screen.height)
	{
		return window.topWindowBoundary() - (window.topWindowBoundary() - window.screen.height);
	}

	// Check if the window is off the primary monitor in a negative axis
	// X,Y                   S = Screen, W = Window
	// 0,-1024   ----------
	//          |  ---     |
	//          | | W |    |
	//          |  ---   S |
	//           ----------
	// X,Y
	// 0,0       ----------
	//          |          |
	//          |          |
	//          |        S |
	//           ----------
	// This only works in Firefox at the moment due to a bug in Internet Explorer opening new windows into a negative axis
	// However, you can move opened windows into a negative axis as a workaround
	if (window.topWindowBoundary() < 0 && window.topWindowBoundary() > (window.screen.height * -1))
	{
		return (window.screen.height * -1);
	}

	// If neither of the above, the monitor is on the primary monitor whose’s screen Y should be 0
	return 0;
}

So now that we have the Top and Left boundaries written, we can open a window in any setup (2 monitors to 4 monitors to X monitors) using the following and be guaranteed that the new window will open in the same monitor as the parent window (except for IE where IE will not open windows in a negative axis).

window.open(thePage, 'windowName', 'resizable=1, scrollbars=1, fullscreen=0, height=200, width=650, screenX=' + window.leftScreenBoundary() + ' , left=' + window.leftScreenBoundary() + ',screenY=' + window.topScreenBoundary() + ',top=' + window.topScreenBoundary() + ', toolbar=0, menubar=0, status=1');

And thus the finale of opening a child window in a dual, quad, whatever monitor setup.

Lately, I have been plagued with the complicated tasks of solving problems at work that require dual monitors. However, I only have a single monitor. Until Today!

Today, I got my PC setup with Dual Monitors and was asked to solve the following problem:

“When the user clicks on a link that opens a new window using window.open. Make the window appear on the same monitor as its’ parent.”

So I got started. Quickly I discovered that window.screenLeft (for IE) and window.screenX (for everyone else) will tell me where the window’s border is on the desktop. So what better to do than to throw that in a window.*property* which gave me this code:

// Find Left Boundry of current Window
function FindLeftWindowBoundry()
{
	// In Internet Explorer window.screenLeft is the window's left boundry
	if (window.screenLeft)
	{
		return window.screenLeft;
	}

	// In Firefox window.screenX is the window's left boundry
	if (window.screenX)
		return window.screenX;

	return 0;
}

window.leftWindowBoundry = FindLeftWindowBoundry;

Next, I needed to find the monitor’s left border. Soon after, I figured out that there is no property currently for this, however, you can get the width of the current monitor your window is on by using window.screen.width. There is a big pitfall that needs to be considered, you can have a monitor whose left border starts with a negative X-axis (ie: -1024×0 to 0×768).

So that left with me the following code:

// Find Left Boundry of the Screen/Monitor
function FindLeftScreenBoundry()
{
	// Check if the window is off the primary monitor in a positive axis
	// X,Y                  X,Y                    S = Screen, W = Window
	// 0,0  ----------   1280,0  ----------
	//     |          |         |  ---     |
	//     |          |         | | W |    |
	//     |        S |         |  ---   S |
	//      ----------           ----------
	if (window.leftWindowBoundry() > window.screen.width)
	{
		return window.leftWindowBoundry() - (window.leftWindowBoundry() - window.screen.width);
	}

	// Check if the window is off the primary monitor in a negative axis
	// X,Y                  X,Y                    S = Screen, W = Window
	// 0,0  ----------  -1280,0  ----------
	//     |          |         |  ---     |
	//     |          |         | | W |    |
	//     |        S |         |  ---   S |
	//      ----------           ----------
	// This only works in Firefox at the moment due to a bug in Internet Explorer opening new windows into a negative axis
	// However, you can move opened windows into a negative axis as a workaround
	if (window.leftWindowBoundry() < 0 && window.leftWindowBoundry() > (window.screen.width * -1))
	{
		return (window.screen.width * -1);
	}

	// If neither of the above, the monitor is on the primary monitor whose’s screen X should be 0
	return 0;
}

window.leftScreenBoundry = FindLeftScreenBoundry;

Now that the code is written, you can now use window.open to open a window on the monitor the parent window is on.

window.open(thePage, 'windowName', 'resizable=1, scrollbars=1, fullscreen=0, height=200, width=650, screenX=' + window.leftScreenBoundry() + ' , left=' + window.leftScreenBoundry() + ', toolbar=0, menubar=0, status=1');

Oh yeah, IE has a bug in it that prevents opening windows with window.open in the negative X-axis. You have to use windowName.moveTo(-1024, 0); to move it to the negative X-axis.

Enjoy!