Develop Reference

IE invalid argument because vars equal NaN

The penultimate line gives an "Invalid argument" error in IE11 - other browsers are fine run the code fine.
var active = $('.interactivemap-minimap-active', this.el);
if (x === undefined) x = self.x;
if (y === undefined) y = self.y;
var width = Math.round(self.container.width() / self.contentWidth / self.scale * this.el.width()),
height = Math.round(self.container.height() / self.contentHeight / self.scale * this.el.height()),
top = Math.round(-y / self.contentHeight / self.scale * this.el.height()),
left = Math.round(-x / self.contentWidth / self.scale * this.el.width()),
right = left + width,
bottom = top + height;
console.log("pass2: width=" + width + ", height=" + height + ", top=" + top + ", left=" + left + ", right=" + right + ", bottom=" + bottom);
active.each(function() {
$(this)[0].style.clip = 'rect(' + top + 'px, ' + right + 'px, ' + bottom + 'px, ' + left + 'px)';
});
the console.log will show:
width=Nan , height=Nan , top=Nan , left=Nan , right=Nan , bottom=Nan
If I comment out the troublesome line, the console.log will show:
width=Nan , height=Nan , top=Nan , left=Nan , right=Nan , bottom=Nan
width=140 , height=162 , top=-1 , left=0 , right=140 , bottom=161
So it looks like it takes a moment to populate those variables with actual data but it starts the last function when the are still equal to Nan and then errors.
Is there any way to get around this?

closing a window popup based on result

I am trying to open a window from a click then after the response in the url that consist of a confirmation page if is success it will close the window.
I opened my window with this:
url = 'http:/mywebsite/index';
width = 545;
height = 433;
var leftPosition, topPosition;
//Allow for borders.
leftPosition = (window.screen.width / 2) - ((width / 2) + 10);
//Allow for title and status bars.
topPosition = (window.screen.height / 2) - ((height / 2) + 50);
//Open the window.
window.open(url, "Window2", "status=no,height=" + height + ",width=" + width + ",resizable=yes,left=" + leftPosition + ",top=" + topPosition + ",screenX=" + leftPosition + ",screenY=" + topPosition + ",toolbar=no,menubar=no,scrollbars=no,location=no,directories=no");
The returned of the URL http:/mywebsite/index is a json dump with a dictionary of success whether true or false. I code this with python btw.
The problem I am encountering is how to close the window from the return of the python.
I tried returning a string as HTML and javascript consisting of window.close(). But no luck. Please do tell me if I am doing something wrong or what should be the method.
Thanks.

You need to store the object returned by window.open and call close() on that object:
var mywindow;
mywindow = window.open(...);
...
mywindow.close();

JavaScript popup window with scrollbars

I have a function that pops up window in the center and I want it to have a vertical scrollbar.
function popUpCal()
{
var url = "calendar_flight_maint.php";
var width = 700;
var height = 600;
var left = parseInt((screen.availWidth/2) - (width/2));
var top = parseInt((screen.availHeight/2) - (height/2));
var windowFeatures = "width=" + width + ",height=" + height + ",status,resizable,left=" + left + ",top=" + top + "screenX=" + left + ",screenY=" + top;
window.open(url, "subWind", windowFeatures, "POS", "toolbar=no", "scrollbars=1");
}
I have tried scrollbars=yes, scrollbars=auto, scrollbars=1 but the scrollbars still aren't appearing. Is there something wrong with my code? I'm using Firefox 21.0 and I've already tested it in IE 8. What seems to be the problem?

As seen in the specs for window.open, your parameters are wrong.
Try this:
function popUpCal()
{
var url = "calendar_flight_maint.php";
var width = 700;
var height = 600;
var left = parseInt((screen.availWidth/2) - (width/2));
var top = parseInt((screen.availHeight/2) - (height/2));
var windowFeatures = "width=" + width + ",height=" + height +
",status,resizable,left=" + left + ",top=" + top +
"screenX=" + left + ",screenY=" + top + ",scrollbars=yes";
window.open(url, "subWind", windowFeatures, "POS");
}
Here is a jsFiddle

Parse link through Javascript instead of Inline

I have a number of social media site links which i would like to parse through a popup box. Here is an example of one of those links:
<li>
<a class="sprite_reddit" href="http://www.reddit.com/submit" onclick="window.open('http://www.reddit.com/submit?v=5&noui&jump=close&url='+encodeURIComponent(location.href)+'&title='+encodeURIComponent(document.title), 'reddit','toolbar=no,width=840,height=750'); return false;"></a>
</li>
Rather than include window.open in the html I would like this link to parse through the following javascript which centers the popup box in the screen.
function MyPopUpWin(url, width, height) {
var leftPosition, topPosition;
//Allow for borders.
leftPosition = (window.screen.width / 2) - ((width / 2) + 10);
//Allow for title and status bars.
topPosition = (window.screen.height / 2) - ((height / 2) + 50);
//Open the window.
window.open(url, "Window2", "status=no,height=" + height + ",width=" + width + ",resizable=yes,left=" + leftPosition + ",top=" + topPosition + ",screenX=" + leftPosition + ",screenY=" + topPosition + ",toolbar=no,menubar=no,scrollbars=no,location=no,directories=no");
}
What do I need to change in order to achieve this or is it not possible with this kind of link?
Thanks heaps.

The open function is supported in every major browser version but not every browser supports all the parameters you have set. Some like screenX and Y are no longer supported I guess.
Checkout this link for more information:
http://www.w3schools.com/jsref/met_win_open.asp

Chrome Javascript popup on dual monitors is off

I'm trying to open a javascript popup that is centered based on where the current window is. I have dual monitor setup and it works in every other browser but chrome. For some reason when chrome is on my 2nd monitor the popup is way to the right.
var winX = (document.all) ? window.screenLeft : window.screenX;
var winY = (document.all) ? window.screenTop : window.screenY;
var newWindowWidth = 650;
var newWindowHeight = 700;
var currentWindowWidth = $(window).width();
var currentWindowHeight = $(window).height();
var newWindowX = (winX + (currentWindowWidth / 2)) - (newWindowWidth / 2);
var newWindowY = (winY + (currentWindowHeight / 2)) - (newWindowHeight / 2);
window.open("", "configurationWindow", "scrollbars=1,resizable=yes,width=" + newWindowWidth + ",height=" + newWindowHeight + ",top=" + newWindowY + ",left=" + newWindowX);

This is a known Chrome bug, id #73353. If you have a Google account you can star it to keep track of its status.