Groups | Search | Server Info | Keyboard shortcuts | Login | Register [http] [https] [nntp] [nntps]

Groups > comp.lang.javascript > #26746 > unrolled thread

Problem determining iFrame source url ...

Back to article view | Back to comp.lang.javascript

Contents

  Problem determining iFrame source url ... sean mc <seanmc1217@gmail.com> - 2015-01-29 05:20 -0800
    Re: Problem determining iFrame source url ... Tim Streater <timstreater@greenbee.net> - 2015-01-29 13:39 +0000
      Re: Problem determining iFrame source url ... sean mc <seanmc1217@gmail.com> - 2015-01-29 05:58 -0800
      Re: Problem determining iFrame source url ... "Christoph M. Becker" <cmbecker69@arcor.de> - 2015-01-29 15:04 +0100
        Re: Problem determining iFrame source url ... sean mc <seanmc1217@gmail.com> - 2015-01-29 06:25 -0800
          Re: Problem determining iFrame source url ... sean mc <seanmc1217@gmail.com> - 2015-01-29 06:31 -0800
          Re: Problem determining iFrame source url ... sean mc <seanmc1217@gmail.com> - 2015-01-29 08:09 -0800
    Re: Problem determining iFrame source url ... sean mc <seanmc1217@gmail.com> - 2015-01-29 08:22 -0800
    Re: Problem determining iFrame source url ... sean mc <seanmc1217@gmail.com> - 2015-01-29 16:14 -0800
      Re: Problem determining iFrame source url ... "Evertjan." <exxjxw.hannivoort@inter.nl.net> - 2015-01-30 10:25 +0100
        Re: Problem determining iFrame source url ... sean mc <seanmc1217@gmail.com> - 2015-01-30 06:53 -0800
    Re: Problem determining iFrame source url ... sean mc <seanmc1217@gmail.com> - 2015-01-30 12:45 -0800
      Re: Problem determining iFrame source url ... "Evertjan." <exxjxw.hannivoort@inter.nl.net> - 2015-01-30 23:25 +0100
        Re: Problem determining iFrame source url ... "Christoph M. Becker" <cmbecker69@arcor.de> - 2015-01-30 23:57 +0100
          Re: Problem determining iFrame source url ... sean mc <seanmc1217@gmail.com> - 2015-01-30 17:53 -0800
        Re: Problem determining iFrame source url ... sean mc <seanmc1217@gmail.com> - 2015-01-30 17:59 -0800

#26746 — Problem determining iFrame source url ...

I found code (someone elses code posted to another blog somewhere or other) that would change an iframes src attribute after a timed period. When used as below, it works fine....sort of... : 

--------------------------------------------------------
<script type="text/javascript">
function ChangeSrc() {
  var frames = Array('splash.html', 4,
	  'data.html');
  var i = 0, len = frames.length;
  document.getElementById('data_frame').src = frames[i++];
  if (i >= len) return; // no more changing
  setTimeout('ChangeSrc()', (frames[i++]*1000));
//}

window.onload = ChangeSrc;
</script>
--------------------------------------------------------

My problem with this is that is the user clicks on one of my available links to reload the iframe with another page before my second page has been loaded by the above script, they are then navigated away from the page the linked to.

So, I fished around the internet some more, and pieced together the following code to solve this :

--------------------------------------------------------
<script type="text/javascript">
function ChangeSrc() {
  var frames = Array('jthl_splash.html', 4,
	  'jthl_hdata.html');
  var i = 0, len = frames.length;
  var iFrm = document.getElementById('data_frame');
  var curUrl = GetIFrameURL(iFrm);
  var chgUrl = CanChgSrc(curUrl);
  if (chgUrl == true) {
	iFrm.src = frames[i++];
  }
  else {
	return;
  }
  if (i >= len) return; // no more changing
  setTimeout('ChangeSrc()', (frames[i++]*1000));
}
function CanChgSrc(str) {
	var opg = "about:blank";
	var tpg = "jthl_splash.html";
	var tUrl = str.substring(str.length - (tpg.length));
	var oUrl = str.substring(str.length - (opg.length));
	if (oUrl == opg || tUrl == tpg) {
	  return true;
	}
	else {
	  return false;
	}
}
function GetIFrameURL (iFrm) {
  if (isChromeBrowser() == true) {
	var fUrl = iFrm.contentDocument.location.href;
  }
  else {
	var fUrl = iFrm.contentWindow.location.href;
  }
  return fUrl;
}
function isChromeBrowser() {
        var browsr = navigator.userAgent;
        var patt = /Chrome/g;
        return patt.test(browsr);
}
window.onload = ChangeSrc;
</script>
--------------------------------------------------------

This is to only let the page-reload-script run if the current iframe url is either "about:blank" or "splash.html", otherwise we wont switch to the "data.html" page.
This works fine the first time around.
GetIFrameURL is where the problem seems to reside.
The first time I hit it is fine...it returns "about.blank", and my "splash.html" page loads as expected.
The second time I hit it, code execution just stops after I hit it, and I do not reload..."splash.html" just remains in my iframe.

Can anyone see what my problem here is?
Is there a way to make this work?

Thanks in advance for any advice given.
Sean

[toc] | [next] | [standalone]

#26747

In article <c47f984c-b560-4c77-ac64-09a08a43ada7@googlegroups.com>,
sean mc <seanmc1217@gmail.com> wrote:

>I found code (someone elses code posted to another blog somewhere or other)
>that would change an iframes src attribute after a timed period. When used as
>below, it works fine....sort of... : 
>
>--------------------------------------------------------
><script type="text/javascript">
>function ChangeSrc() {
>  var frames = Array('splash.html', 4,
>      'data.html');
>  var i = 0, len = frames.length;
>  document.getElementById('data_frame').src = frames[i++];
>  if (i >= len) return; // no more changing
>  setTimeout('ChangeSrc()', (frames[i++]*1000));
>//}
>
>window.onload = ChangeSrc;
></script>
>--------------------------------------------------------

In this function, i is declared (var i = 0), incremented (by the i++),
and then compared with len.

I can't see why i would ever have a value other than 1 when this
statement:

  if (i >= len) return; // no more changing

is executed. The same is true of your function. So what is the point of
the variable i or indeed the test to compare with len ??

-- 
"That which can be asserted without evidence, can be dismissed without 
evidence."
-- Christopher Hitchens

[toc] | [prev] | [next] | [standalone]

#26748

On Thursday, January 29, 2015 at 8:39:20 AM UTC-5, Tim Streater wrote:
> In article <c47f984c-b560-4c77-ac64-09a08a43ada7@googlegroups.com>,
> sean mc 
> 
> >I found code (someone elses code posted to another blog somewhere or other)
> >that would change an iframes src attribute after a timed period. When used as
> >below, it works fine....sort of... : 
> >
> >--------------------------------------------------------
> ><script type="text/javascript">
> >function ChangeSrc() {
> >  var frames = Array('splash.html', 4,
> >      'data.html');
> >  var i = 0, len = frames.length;
> >  document.getElementById('data_frame').src = frames[i++];
> >  if (i >= len) return; // no more changing
> >  setTimeout('ChangeSrc()', (frames[i++]*1000));
> >//}
> >
> >window.onload = ChangeSrc;
> ></script>
> >--------------------------------------------------------
> 
> In this function, i is declared (var i = 0), incremented (by the i++),
> and then compared with len.
> 
> I can't see why i would ever have a value other than 1 when this
> statement:
> 
>   if (i >= len) return; // no more changing
> 
> is executed. The same is true of your function. So what is the point of
> the variable i or indeed the test to compare with len ??
> 
> -- 
> "That which can be asserted without evidence, can be dismissed without 
> evidence."
> -- Christopher Hitchens


This was originally designed to reload a more than just the two pages I am using it for at this time. This function can be used to load as many pages as the user would like to add to the array "frames"

i=0;
....src = frames[i++]; sets the src attribute to frames[0], then increments i by 1. 
i=1 now
frames[1] = 4. This is used to set the time out.
setTimeout('ChangeSrc()', (frames[i++]*1000);
after the timout is set, i now equals 2
This is now greater than the length of the array, so we exit the function 
if (i >= len) return;

This part works fine.

The problem appears to be in

>------------------------------------------
>function GetIFrameURL (iFrm) { 
>  if (isChromeBrowser() == true) { 
>        var fUrl = iFrm.contentDocument.location.href; 
>  } 
>  else { 
>        var fUrl = iFrm.contentWindow.location.href; 
>  } 
>  return fUrl; 
>} 
>------------------------------------------

this is where code execution just stops.

[toc] | [prev] | [next] | [standalone]

#26749

Tim Streater wrote:

> In article <c47f984c-b560-4c77-ac64-09a08a43ada7@googlegroups.com>,
> sean mc <seanmc1217@gmail.com> wrote:
> 
>> below, it works fine....sort of... :
>> --------------------------------------------------------
>> <script type="text/javascript">
>> function ChangeSrc() {
>>  var frames = Array('splash.html', 4,
>>      'data.html');
>>  var i = 0, len = frames.length;
>>  document.getElementById('data_frame').src = frames[i++];
>>  if (i >= len) return; // no more changing
>>  setTimeout('ChangeSrc()', (frames[i++]*1000));
>> //}
>>
>> window.onload = ChangeSrc;
>> </script>
>> --------------------------------------------------------
> 
> In this function, i is declared (var i = 0), incremented (by the i++),
> and then compared with len.
> 
> I can't see why i would ever have a value other than 1 when this
> statement:
> 
>  if (i >= len) return; // no more changing
> 
> is executed. The same is true of your function. So what is the point of
> the variable i or indeed the test to compare with len ??

I guess that i is supposed to be declared outside of ChangeSrc().
However, as the code has a syntax error anyway (the function body is not
terminated with }), all bets are off -- and certainly, it does not work
fine.

-- 
Christoph M. Becker

[toc] | [prev] | [next] | [standalone]

#26750

On Thursday, January 29, 2015 at 9:04:43 AM UTC-5, Christoph M. Becker wrote:
> Tim Streater wrote:
> 
> > In article <c47f984c-b560-4c77-ac64-09a08a43ada7@googlegroups.com>,
> > sean mc wrote:
> > 
> >> below, it works fine....sort of... :
> >> --------------------------------------------------------
> >> <script type="text/javascript">
> >> function ChangeSrc() {
> >>  var frames = Array('splash.html', 4,
> >>      'data.html');
> >>  var i = 0, len = frames.length;
> >>  document.getElementById('data_frame').src = frames[i++];
> >>  if (i >= len) return; // no more changing
> >>  setTimeout('ChangeSrc()', (frames[i++]*1000));
> >> //}
> >>
> >> window.onload = ChangeSrc;
> >> </script>
> >> --------------------------------------------------------
> > 
> > In this function, i is declared (var i = 0), incremented (by the i++),
> > and then compared with len.
> > 
> > I can't see why i would ever have a value other than 1 when this
> > statement:
> > 
> >  if (i >= len) return; // no more changing
> > 
> > is executed. The same is true of your function. So what is the point of
> > the variable i or indeed the test to compare with len ??
> 
> I guess that i is supposed to be declared outside of ChangeSrc().
> However, as the code has a syntax error anyway (the function body is not
> terminated with }), all bets are off -- and certainly, it does not work
> fine.
> 
> -- 
> Christoph M. Becker

OK...I apologise..I see what was being pointed out.
I wasnt trying to sound snarky with my last reply...I just didnt see what was being pointed out, obviously. Function "ChangeSrc" is terminated correctly in my code I believe...am I missing it? Somehow it got commented out in the re-post...but I believe that closing "}" is present in my initial post without being commented out. I believe this was another Copy/Paste error. My apologies.

Sorry...that declaration  of i=0 is supposed to be outside. That mistake was also somehow made by me when I was copying and pasting my code into the group editor.
My error....again...my apologies.

Now...back to my original statement ...my pages will increment correctly, and load into my ifrmame as expected...until I added the function :

function GetIFrameURL (iFrm) { 
  if (isChromeBrowser() == true) { 
        var fUrl = iFrm.contentDocument.location.href; 
  } 
  else { 
        var fUrl = iFrm.contentWindow.location.href; 
  } 
  return fUrl; 
} 

It goes through this the first time
var fUrl = iFrm.contentDocument.location.href;  returns "about:blank" the first time thru.

The second time thru, it hit this line, and execution just stops.

[toc] | [prev] | [next] | [standalone]

#26751

This is my code copied and pasted directly from my web page (hopefully without and dumb errors :-):

<script type="text/javascript">

var i = 0, len = frames.length;

function ChangeSrc() {
  var frames = Array('splash.html', 4,
	  'data.html');
  var iFrm = document.getElementById('data_frame');
  var curUrl = GetIFrameURL(iFrm);
  var chgUrl = CanChgSrc(curUrl);
  if (chgUrl == true) {
	iFrm.src = frames[i++];
  }
  else {
	return;
  }
  if (i >= len) return; // no more changing
  setTimeout('ChangeSrc()', (frames[i++]*1000));
}
function CanChgSrc(str) {
	var opg = "about:blank";
	var tpg = "splash.html";
	var tUrl = str.substring(str.length - (tpg.length));
	var oUrl = str.substring(str.length - (opg.length));
	if (oUrl == opg || tUrl == tpg) {
	  return true;
	}
	else {
	  return false;
	}
}
function GetIFrameURL (iFrm) {
  if (isChromeBrowser() == true) {
	var fUrl = iFrm.contentDocument.location.href;
  }
  else {
	var fUrl = iFrm.contentWindow.location.href;
  }
  return fUrl;
}
function isChromeBrowser() {
        var browsr = navigator.userAgent;
        var patt = /Chrome/g;
        return patt.test(browsr);
}

//function ChangeSrcSafe() {
//  var frames = Array('splash.html', 4,
//	  'data.html');
//  var i = 0, len = frames.length;
//  document.getElementById('data_frame').src = frames[i++];
//  alert (document.getElementById('data_frame').src);
//  if (i >= len) return; // no more changing
//  setTimeout('ChangeSrc()', (frames[i++]*1000));
//}

window.onload = ChangeSrc;
</script>

[toc] | [prev] | [next] | [standalone]

#26752

Sorry...Ive screwed this post up so much with pasting mistakes...
This is the code that has the problem I described.

<script type="text/javascript">

var frames = Array('jthl_splash.html', 4,
	  'jthl_hdata.html');
var i = 0, len = frames.length;

function ChangeSrc() {
  var iFrm = document.getElementById('data_frame');
  var curUrl = GetIFrameURL(iFrm);
  var chgUrl = CanChgSrc(curUrl);

  if (chgUrl == true) {
	iFrm.src = frames[i++];
  }
  else {
	return;
  }
  if (i >= len) return; // no more changing
  setTimeout('ChangeSrc()', (frames[i++]*1000));
}
function CanChgSrc(str) {
	var opg = "about:blank";
	var tpg = "jthl_splash.html";
	var tUrl = str.substring(str.length - (tpg.length));
	var oUrl = str.substring(str.length - (opg.length));
	if (oUrl == opg || tUrl == tpg) {
	  return true;
	}
	else {
	  return false;
	}
}
function GetIFrameURL (iFrm) {
  if (isChromeBrowser() == true) {
	var fUrl = iFrm.contentDocument.location.href;
  }
  else {
	var fUrl = iFrm.contentWindow.location.href;
  }
  return fUrl;
}
function isChromeBrowser() {
        var browsr = navigator.userAgent;
        var patt = /Chrome/g;
        return patt.test(browsr);
}

//function ChangeSrcSafe() {
//  var frames = Array('jthl_splash.html', 4,
//	  'jthl_hdata.html');
//  var i = 0, len = frames.length;
//  document.getElementById('data_frame').src = frames[i++];
//  alert (document.getElementById('data_frame').src);
//  if (i >= len) return; // no more changing
//  setTimeout('ChangeSrc()', (frames[i++]*1000));
//}

window.onload = ChangeSrc;
</script>

[toc] | [prev] | [next] | [standalone]

#26753

Sorry..I have screwed this post up terribly.
This is the code that worked, with the exception of determining the current URl of the iframe. Code execution halts inexplicably at that point. (function GetIFrameURL ... .href line)


<script type="text/javascript">

var frames = Array('splash.html', 4,
	  'data.html');
var i = 0, len = frames.length;

function ChangeSrc() {
  var iFrm = document.getElementById('data_frame');
  var curUrl = GetIFrameURL(iFrm);
  var chgUrl = CanChgSrc(curUrl);

alert("after URL determined : " + curUrl);

  if (chgUrl == true) {
	iFrm.src = frames[i++];
  }
  else {
	return;
  }
  if (i >= len) return; // no more changing
  setTimeout('ChangeSrc()', (frames[i++]*1000));
}
function CanChgSrc(str) {
	var opg = "about:blank";
	var tpg = "splash.html";
	var tUrl = str.substring(str.length - (tpg.length));
	var oUrl = str.substring(str.length - (opg.length));
	if (oUrl == opg || tUrl == tpg) {
	  return true;
	}
	else {
	  return false;
	}
}
function GetIFrameURL (iFrm) {
  if (isChromeBrowser() == true) {
	var fUrl = iFrm.contentDocument.location.href;
  }
  else {
	var fUrl = iFrm.contentWindow.location.href;
  }
  return fUrl;
}
function isChromeBrowser() {
        var browsr = navigator.userAgent;
        var patt = /Chrome/g;
        return patt.test(browsr);
}

//function ChangeSrcSafe() {
//  var frames = Array('splash.html', 4,
//	  'data.html');
//  var i = 0, len = frames.length;
//  document.getElementById('data_frame').src = frames[i++];
//  alert (document.getElementById('data_frame').src);
//  if (i >= len) return; // no more changing
//  setTimeout('ChangeSrc()', (frames[i++]*1000));
//}

window.onload = ChangeSrc;
</script>

[toc] | [prev] | [next] | [standalone]

#26754

OK...I have improved my code somewhat, although Im sure there is still plenty of room for more improvement.

The following works fine in Firefox(35.01) and IE(11), but still does NOT work in CHROME(41.0.2272.3 m) :

my "splash.html" page loads in Chrome, but then execution bombs out when it hits the
"location.href" lines.

In IE and FF, both pages (splash.html then data.html) load as long as the iFrame content hasn't been changed manually. This is good.

Does anyone know why the following code doesnt work in Chrome? Please? This is driving me nuts! What will work in Chrome as well ?

Thanks in advance
------------------------------------------------------------
<script type="text/javascript">

var frames = Array('jthl_splash.html', 4,
	  'jthl_hdata.html');
var i = 0, len = frames.length;

function ChangeSrc() {
  var iFrm = document.getElementById('data_frame');
  var iDoc = (iFrm.contentWindow || iFrm.contentDocument);
  var curLoc = iDoc.location;
  var curURL = curLoc.href;  
  if (CanChgSrc(curURL) == true) {
	iFrm.src = frames[i++];
  }
  else {
	return;
  }
  if (i >= len) return; // no more changing
  setTimeout('ChangeSrc()', (frames[i++]*1000));
}
function CanChgSrc(myURL) {
	if (myURL == "about:blank" || myURL.indexOf("jthl_splash.html") != -1) {
	  return true;
	}
	else {
	  return false;
	}
}
window.onload = ChangeSrc;
</script>
------------------------------------------------------------

[toc] | [prev] | [next] | [standalone]

#26755

sean mc <seanmc1217@gmail.com> wrote on 30 jan 2015 in
comp.lang.javascript: 

> Thanks in advance
> ------------------------------------------------------------
> <script type="text/javascript">
> 
> var frames = Array('jthl_splash.html', 4,
>        'jthl_hdata.html');
> var i = 0, len = frames.length;
> 
> function ChangeSrc() {
>   var iFrm = document.getElementById('data_frame');

  var iDoc = (iFrm.contentWindow || iFrm.contentDocument);
console.log('#### i = ' + i);
console.log('#### iDoc = ' + iDoc);
  var curLoc = iDoc.location;
console.log('#### curLoc = ' + curLoc);
  var curURL = curLoc.href;  
console.log('#### curURL = ' + curURL);

etc.
> ------------------------------------------------------------

This will give you ***in Chrome*** the following console reading:

============================
test.html:11 #### i = 0
test.html:12 #### iDoc = [object Window]
test.html:14 #### curLoc = about:blank
test.html:16 #### curURL = about:blank

[4 seconds later followed by the second loop:]

test.html:11 #### i = 2
test.html:12 Uncaught SecurityError: Blocked a frame with origin "null" from 
accessing a frame with origin "null". Protocols, domains, and ports must 
match.test.html:12 ChangeSrcVM8574:1 (anonymous function)
============================

So in the second loop

var iDoc = (iFrm.contentWindow || iFrm.contentDocument);

is not allowed.

So start changing that, 
I am not at all shure what you are aiming at with this rather silly code.

=========================================================

btw, why not simplify code like:

>   if (CanChgSrc(curURL) == true) {
> 	iFrm.src = frames[i++];
>   }
>   else {
>    	return;
>  }

into:

  if (!CanChgSrc(curURL)) return;
  iFrm.src = frames[i++];

======================================

and:

> function CanChgSrc(myURL) {
> 	if (myURL=="about:blank" || myURL.indexOf("test3.html")!= -1){
> 	  return true;
>	}
> 	else {
> 	  return false;
>	}
> }

into:

function CanChgSrc(myURL) {
 return myURL=="about:blank" || myURL.indexOf("test3.html")!=-1;
};

=================

or skip the whole CanChgSrc() function by changing my line:

>   if (!CanChgSrc(curURL)) return;

into:

if (!(curURL=="about:blank"||curURL.indexOf("test3.html")!=-1)) return;

which can be symplified into:

if (curURL!="about:blank" && curURL.indexOf("test3.html")==-1) return;

-- 
Evertjan.
The Netherlands.
(Please change the x'es to dots in my emailaddress)

[toc] | [prev] | [next] | [standalone]

#26756

On Friday, January 30, 2015 at 4:25:48 AM UTC-5, Evertjan. wrote:
> sean mc  wrote on 30 jan 2015 in
> comp.lang.javascript: 
> 
> > Thanks in advance
> > ------------------------------------------------------------
> > <script type="text/javascript">
> > 
> > var frames = Array('jthl_splash.html', 4,
> >        'jthl_hdata.html');
> > var i = 0, len = frames.length;
> > 
> > function ChangeSrc() {
> >   var iFrm = document.getElementById('data_frame');
> 
>   var iDoc = (iFrm.contentWindow || iFrm.contentDocument);
> console.log('#### i = ' + i);
> console.log('#### iDoc = ' + iDoc);
>   var curLoc = iDoc.location;
> console.log('#### curLoc = ' + curLoc);
>   var curURL = curLoc.href;  
> console.log('#### curURL = ' + curURL);
> 
> etc.
> > ------------------------------------------------------------
> 
> This will give you ***in Chrome*** the following console reading:
> 
> ============================
> test.html:11 #### i = 0
> test.html:12 #### iDoc = [object Window]
> test.html:14 #### curLoc = about:blank
> test.html:16 #### curURL = about:blank
> 
> [4 seconds later followed by the second loop:]
> 
> test.html:11 #### i = 2
> test.html:12 Uncaught SecurityError: Blocked a frame with origin "null" from 
> accessing a frame with origin "null". Protocols, domains, and ports must 
> match.test.html:12 ChangeSrcVM8574:1 (anonymous function)
> ============================
> 
> So in the second loop
> 
> var iDoc = (iFrm.contentWindow || iFrm.contentDocument);
> 
> is not allowed.
> 
> So start changing that, 
> I am not at all shure what you are aiming at with this rather silly code.
> 
> =========================================================
> 
> btw, why not simplify code like:
> 
> >   if (CanChgSrc(curURL) == true) {
> > 	iFrm.src = frames[i++];
> >   }
> >   else {
> >    	return;
> >  }
> 
> into:
> 
>   if (!CanChgSrc(curURL)) return;
>   iFrm.src = frames[i++];
> 
> ======================================
> 
> and:
> 
> > function CanChgSrc(myURL) {
> > 	if (myURL=="about:blank" || myURL.indexOf("test3.html")!= -1){
> > 	  return true;
> >	}
> > 	else {
> > 	  return false;
> >	}
> > }
> 
> into:
> 
> function CanChgSrc(myURL) {
>  return myURL=="about:blank" || myURL.indexOf("test3.html")!=-1;
> };
> 
> =================
> 
> or skip the whole CanChgSrc() function by changing my line:
> 
> >   if (!CanChgSrc(curURL)) return;
> 
> into:
> 
> if (!(curURL=="about:blank"||curURL.indexOf("test3.html")!=-1)) return;
> 
> which can be symplified into:
> 
> if (curURL!="about:blank" && curURL.indexOf("test3.html")==-1) return;
> 
> -- 
> Evertjan.
> The Netherlands.
> (Please change the x'es to dots in my emailaddress)


Thank you very much for the helpful reply, Evertjan.
I will work with what you have shown me and see what I can come up with.

[toc] | [prev] | [next] | [standalone]

#26757

On Thursday, January 29, 2015 at 8:20:56 AM UTC-5, sean mc wrote:
> I found code (someone elses code posted to another blog somewhere or other) that would change an iframes src attribute after a timed period. When used as below, it works fine....sort of... : 
> 
> --------------------------------------------------------
> <script type="text/javascript">
> function ChangeSrc() {
>   var frames = Array('splash.html', 4,
> 	  'data.html');
>   var i = 0, len = frames.length;
>   document.getElementById('data_frame').src = frames[i++];
>   if (i >= len) return; // no more changing
>   setTimeout('ChangeSrc()', (frames[i++]*1000));
> //}
> 
> window.onload = ChangeSrc;
> </script>
> --------------------------------------------------------
> 
> My problem with this is that is the user clicks on one of my available links to reload the iframe with another page before my second page has been loaded by the above script, they are then navigated away from the page the linked to.
> 
> So, I fished around the internet some more, and pieced together the following code to solve this :
> 
> --------------------------------------------------------
> <script type="text/javascript">
> function ChangeSrc() {
>   var frames = Array('jthl_splash.html', 4,
> 	  'jthl_hdata.html');
>   var i = 0, len = frames.length;
>   var iFrm = document.getElementById('data_frame');
>   var curUrl = GetIFrameURL(iFrm);
>   var chgUrl = CanChgSrc(curUrl);
>   if (chgUrl == true) {
> 	iFrm.src = frames[i++];
>   }
>   else {
> 	return;
>   }
>   if (i >= len) return; // no more changing
>   setTimeout('ChangeSrc()', (frames[i++]*1000));
> }
> function CanChgSrc(str) {
> 	var opg = "about:blank";
> 	var tpg = "jthl_splash.html";
> 	var tUrl = str.substring(str.length - (tpg.length));
> 	var oUrl = str.substring(str.length - (opg.length));
> 	if (oUrl == opg || tUrl == tpg) {
> 	  return true;
> 	}
> 	else {
> 	  return false;
> 	}
> }
> function GetIFrameURL (iFrm) {
>   if (isChromeBrowser() == true) {
> 	var fUrl = iFrm.contentDocument.location.href;
>   }
>   else {
> 	var fUrl = iFrm.contentWindow.location.href;
>   }
>   return fUrl;
> }
> function isChromeBrowser() {
>         var browsr = navigator.userAgent;
>         var patt = /Chrome/g;
>         return patt.test(browsr);
> }
> window.onload = ChangeSrc;
> </script>
> --------------------------------------------------------
> 
> This is to only let the page-reload-script run if the current iframe url is either "about:blank" or "splash.html", otherwise we wont switch to the "data.html" page.
> This works fine the first time around.
> GetIFrameURL is where the problem seems to reside.
> The first time I hit it is fine...it returns "about.blank", and my "splash.html" page loads as expected.
> The second time I hit it, code execution just stops after I hit it, and I do not reload..."splash.html" just remains in my iframe.
> 
> Can anyone see what my problem here is?
> Is there a way to make this work?
> 
> Thanks in advance for any advice given.
> Sean


OK...again, Id like to thank Evertjan for his help on this.

First, using his sugestions, I trimmed my "Silly Code" down to the following :

<script type="text/javascript">
var frames = Array('jthl_splash.html', 4,
	  'jthl_hdata.html');
var i = 0, len = frames.length;

function ChangeSrc() {
  var iFrm = document.getElementById('data_frame');
  var iDoc = (iFrm.contentWindow.location.href || iFrm.contentDocument.location.href);

console.log('#### i = ' + i);
console.log('#### iDoc = ' + iDoc);

  if (iDoc!="about:blank" && iDoc.indexOf("jthl_splash.html")==-1) return;
  iFrm.src = frames[i++];
  if (i >= len) return;                             // no more changing
  setTimeout('ChangeSrc()', (frames[i++]*1000));
}

window.onload = ChangeSrc;
</script>

Next, using console logging, which I wasnt aware of before Ertjan's post, I was able to see the error of :

>>> Blocked a frame with origin "null" from accessing a frame with origin "null". Protocols, domains, and ports must match <<<

After searching this error on the internet, I saw that this problem was caused simply by attempting to run my pages locally. Publishing them and running them solved my whole problem. Evidently this is a peculiarity of Chromes built in security policy.

Thank you to all who replied.

[toc] | [prev] | [next] | [standalone]

#26759

sean mc <seanmc1217@gmail.com> wrote on 30 jan 2015 in
comp.lang.javascript: 

> On Thursday, January 29, 2015 at 8:20:56 AM UTC-5, sean mc wrote:
>> I found code (someone elses code posted to another blog somewhere or
>> other) that would change an iframes src attribute after a timed period.
>> When used as below, it works fine....sort of... : 
>> 
>> --------------------------------------------------------
>> <script type="text/javascript">
>> function ChangeSrc() {
>>   var frames = Array('splash.html', 4,
>>        'data.html');
>>   var i = 0, len = frames.length;
>>   document.getElementById('data_frame').src = frames[i++];
>>   if (i >= len) return; // no more changing
>>   setTimeout('ChangeSrc()', (frames[i++]*1000));
>> //}
>> 
>> window.onload = ChangeSrc;
>> </script>
>> --------------------------------------------------------
>> 
>> My problem with this is that is the user clicks on one of my available
>> links to reload the iframe with another page before my second page has
>> been loaded by the above script, they are then navigated away from the
>> page the linked to. 
>> 
>> So, I fished around the internet some more, and pieced together the
>> following code to solve this : 
>> 
>> --------------------------------------------------------
>> <script type="text/javascript">
>> function ChangeSrc() {
>>   var frames = Array('jthl_splash.html', 4,
>>        'jthl_hdata.html');
>>   var i = 0, len = frames.length;
>>   var iFrm = document.getElementById('data_frame');
>>   var curUrl = GetIFrameURL(iFrm);
>>   var chgUrl = CanChgSrc(curUrl);
>>   if (chgUrl == true) {
>>      iFrm.src = frames[i++];
>>   }
>>   else {
>>      return;
>>   }
>>   if (i >= len) return; // no more changing
>>   setTimeout('ChangeSrc()', (frames[i++]*1000));
>> }
>> function CanChgSrc(str) {
>>      var opg = "about:blank";
>>      var tpg = "jthl_splash.html";
>>      var tUrl = str.substring(str.length - (tpg.length));
>>      var oUrl = str.substring(str.length - (opg.length));
>>      if (oUrl == opg || tUrl == tpg) {
>>        return true;
>>      }
>>      else {
>>        return false;
>>      }
>> }
>> function GetIFrameURL (iFrm) {
>>   if (isChromeBrowser() == true) {
>>      var fUrl = iFrm.contentDocument.location.href;
>>   }
>>   else {
>>      var fUrl = iFrm.contentWindow.location.href;
>>   }
>>   return fUrl;
>> }
>> function isChromeBrowser() {
>>         var browsr = navigator.userAgent;
>>         var patt = /Chrome/g;
>>         return patt.test(browsr);
>> }
>> window.onload = ChangeSrc;
>> </script>
>> --------------------------------------------------------
>> 
>> This is to only let the page-reload-script run if the current iframe
>> url is either "about:blank" or "splash.html", otherwise we wont switch
>> to the "data.html" page. This works fine the first time around.
>> GetIFrameURL is where the problem seems to reside.
>> The first time I hit it is fine...it returns "about.blank", and my
>> "splash.html" page loads as expected. The second time I hit it, code
>> execution just stops after I hit it, and I do not
>> reload..."splash.html" just remains in my iframe. 
>> 
>> Can anyone see what my problem here is?
>> Is there a way to make this work?
>> 
>> Thanks in advance for any advice given.
>> Sean
> 
> 
> OK...again, Id like to thank Evertjan for his help on this.
> 
> First, using his sugestions, I trimmed my "Silly Code" down to the
> following : 
> 
> <script type="text/javascript">
> var frames = Array('jthl_splash.html', 4,
>        'jthl_hdata.html');
> var i = 0, len = frames.length;
> 
> function ChangeSrc() {
>   var iFrm = document.getElementById('data_frame');
>   var iDoc = (iFrm.contentWindow.location.href ||
>   iFrm.contentDocument.location.href); 
> 
> console.log('#### i = ' + i);
> console.log('#### iDoc = ' + iDoc);
> 
>   if (iDoc!="about:blank" && iDoc.indexOf("jthl_splash.html")==-1)
>   return; iFrm.src = frames[i++];
>   if (i >= len) return;                             // no more changing
>   setTimeout('ChangeSrc()', (frames[i++]*1000));
>}
> 
> window.onload = ChangeSrc;
> </script>
> 
> Next, using console logging, which I wasnt aware of before Ertjan's
> post, I was able to see the error of : 
> 
>>>> Blocked a frame with origin "null" from accessing a frame with origin
>>>> "null". Protocols, domains, and ports must match <<< 
> 
> After searching this error on the internet, I saw that this problem was
> caused simply by attempting to run my pages locally. Publishing them and
> running them solved my whole problem. Evidently this is a peculiarity of
> Chromes built in security policy. 

Well done!
 
> Thank you to all who replied.

However... ;-)

1
If you make the frames array longer
  ... .contentWindow ...
  if (iDoc!='' && iDoc.indexOf('test3.html')==-1) return;
will become much more intriate,
so why not ONLY use
   if (i >= frames.length) return;
as you don't need both, if the array content is trusted.

2
skipping the whole ..contentWindow.. testing
makes it work fine LOCALLY. 

3
some small optimalisations.

===================
var frames = ['test1.html', 2, 'test2.html', 3, 'test3.html'];
var i = 0;

function ChangeSrc() {
  var iFrm = document.getElementById('data_frame');
  iFrm.src = frames[i++];
  if (i < frames.length)
     setTimeout(ChangeSrc, (frames[i++]*1000));
};

window.onload = ChangeSrc;
===================

[only tested locally on Chrome and IE11]

-- 
Evertjan.
The Netherlands.
(Please change the x'es to dots in my emailaddress)

[toc] | [prev] | [next] | [standalone]

#26760

Evertjan. wrote:

> var frames = ['test1.html', 2, 'test2.html', 3, 'test3.html'];
> var i = 0;
> 
> function ChangeSrc() {
>   var iFrm = document.getElementById('data_frame');
>   iFrm.src = frames[i++];
>   if (i < frames.length)
>      setTimeout(ChangeSrc, (frames[i++]*1000));
> };
> 
> window.onload = ChangeSrc;

I would suggest to put this code inside an IIFE, to avoid (inadvertent)
modifications of `frames` or `i` from other scripts:

  (function () {
      // ...
  }());

-- 
Christoph M. Becker

[toc] | [prev] | [next] | [standalone]

#26764

On Friday, January 30, 2015 at 5:57:04 PM UTC-5, Christoph M. Becker wrote:
> Evertjan. wrote:
> 
> > var frames = ['test1.html', 2, 'test2.html', 3, 'test3.html'];
> > var i = 0;
> > 
> > function ChangeSrc() {
> >   var iFrm = document.getElementById('data_frame');
> >   iFrm.src = frames[i++];
> >   if (i < frames.length)
> >      setTimeout(ChangeSrc, (frames[i++]*1000));
> > };
> > 
> > window.onload = ChangeSrc;
> 
> I would suggest to put this code inside an IIFE, to avoid (inadvertent)
> modifications of `frames` or `i` from other scripts:
> 
>   (function () {
>       // ...
>   }());
> 
> -- 
> Christoph M. Becker

Thank you for the sugestion.
So my function ChangeSrc gets enclosed in paren, and this will prevent the two global values from being modified while the script runs?

[toc] | [prev] | [next] | [standalone]

#26765

On Friday, January 30, 2015 at 5:25:13 PM UTC-5, Evertjan. wrote:
> sean mc <seanmc1217@gmail.com> wrote on 30 jan 2015 in
> comp.lang.javascript: 
> 
> > On Thursday, January 29, 2015 at 8:20:56 AM UTC-5, sean mc wrote:
> >> I found code (someone elses code posted to another blog somewhere or
> >> other) that would change an iframes src attribute after a timed period.
> >> When used as below, it works fine....sort of... : 
> >> 
> >> --------------------------------------------------------
> >> <script type="text/javascript">
> >> function ChangeSrc() {
> >>   var frames = Array('splash.html', 4,
> >>        'data.html');
> >>   var i = 0, len = frames.length;
> >>   document.getElementById('data_frame').src = frames[i++];
> >>   if (i >= len) return; // no more changing
> >>   setTimeout('ChangeSrc()', (frames[i++]*1000));
> >> //}
> >> 
> >> window.onload = ChangeSrc;
> >> </script>
> >> --------------------------------------------------------
> >> 
> >> My problem with this is that is the user clicks on one of my available
> >> links to reload the iframe with another page before my second page has
> >> been loaded by the above script, they are then navigated away from the
> >> page the linked to. 
> >> 
> >> So, I fished around the internet some more, and pieced together the
> >> following code to solve this : 
> >> 
> >> --------------------------------------------------------
> >> <script type="text/javascript">
> >> function ChangeSrc() {
> >>   var frames = Array('jthl_splash.html', 4,
> >>        'jthl_hdata.html');
> >>   var i = 0, len = frames.length;
> >>   var iFrm = document.getElementById('data_frame');
> >>   var curUrl = GetIFrameURL(iFrm);
> >>   var chgUrl = CanChgSrc(curUrl);
> >>   if (chgUrl == true) {
> >>      iFrm.src = frames[i++];
> >>   }
> >>   else {
> >>      return;
> >>   }
> >>   if (i >= len) return; // no more changing
> >>   setTimeout('ChangeSrc()', (frames[i++]*1000));
> >> }
> >> function CanChgSrc(str) {
> >>      var opg = "about:blank";
> >>      var tpg = "jthl_splash.html";
> >>      var tUrl = str.substring(str.length - (tpg.length));
> >>      var oUrl = str.substring(str.length - (opg.length));
> >>      if (oUrl == opg || tUrl == tpg) {
> >>        return true;
> >>      }
> >>      else {
> >>        return false;
> >>      }
> >> }
> >> function GetIFrameURL (iFrm) {
> >>   if (isChromeBrowser() == true) {
> >>      var fUrl = iFrm.contentDocument.location.href;
> >>   }
> >>   else {
> >>      var fUrl = iFrm.contentWindow.location.href;
> >>   }
> >>   return fUrl;
> >> }
> >> function isChromeBrowser() {
> >>         var browsr = navigator.userAgent;
> >>         var patt = /Chrome/g;
> >>         return patt.test(browsr);
> >> }
> >> window.onload = ChangeSrc;
> >> </script>
> >> --------------------------------------------------------
> >> 
> >> This is to only let the page-reload-script run if the current iframe
> >> url is either "about:blank" or "splash.html", otherwise we wont switch
> >> to the "data.html" page. This works fine the first time around.
> >> GetIFrameURL is where the problem seems to reside.
> >> The first time I hit it is fine...it returns "about.blank", and my
> >> "splash.html" page loads as expected. The second time I hit it, code
> >> execution just stops after I hit it, and I do not
> >> reload..."splash.html" just remains in my iframe. 
> >> 
> >> Can anyone see what my problem here is?
> >> Is there a way to make this work?
> >> 
> >> Thanks in advance for any advice given.
> >> Sean
> > 
> > 
> > OK...again, Id like to thank Evertjan for his help on this.
> > 
> > First, using his sugestions, I trimmed my "Silly Code" down to the
> > following : 
> > 
> > <script type="text/javascript">
> > var frames = Array('jthl_splash.html', 4,
> >        'jthl_hdata.html');
> > var i = 0, len = frames.length;
> > 
> > function ChangeSrc() {
> >   var iFrm = document.getElementById('data_frame');
> >   var iDoc = (iFrm.contentWindow.location.href ||
> >   iFrm.contentDocument.location.href); 
> > 
> > console.log('#### i = ' + i);
> > console.log('#### iDoc = ' + iDoc);
> > 
> >   if (iDoc!="about:blank" && iDoc.indexOf("jthl_splash.html")==-1)
> >   return; iFrm.src = frames[i++];
> >   if (i >= len) return;                             // no more changing
> >   setTimeout('ChangeSrc()', (frames[i++]*1000));
> >}
> > 
> > window.onload = ChangeSrc;
> > </script>
> > 
> > Next, using console logging, which I wasnt aware of before Ertjan's
> > post, I was able to see the error of : 
> > 
> >>>> Blocked a frame with origin "null" from accessing a frame with origin
> >>>> "null". Protocols, domains, and ports must match <<< 
> > 
> > After searching this error on the internet, I saw that this problem was
> > caused simply by attempting to run my pages locally. Publishing them and
> > running them solved my whole problem. Evidently this is a peculiarity of
> > Chromes built in security policy. 
> 
> Well done!
>  
> > Thank you to all who replied.
> 
> However... ;-)
> 
> 1
> If you make the frames array longer
>   ... .contentWindow ...
>   if (iDoc!='' && iDoc.indexOf('test3.html')==-1) return;
> will become much more intriate,
> so why not ONLY use
>    if (i >= frames.length) return;
> as you don't need both, if the array content is trusted.
> 
> 2
> skipping the whole ..contentWindow.. testing
> makes it work fine LOCALLY. 
> 
> 3
> some small optimalisations.
> 
> ===================
> var frames = ['test1.html', 2, 'test2.html', 3, 'test3.html'];
> var i = 0;
> 
> function ChangeSrc() {
>   var iFrm = document.getElementById('data_frame');
>   iFrm.src = frames[i++];
>   if (i < frames.length)
>      setTimeout(ChangeSrc, (frames[i++]*1000));
> };
> 
> window.onload = ChangeSrc;
> ===================
> 
> [only tested locally on Chrome and IE11]
> 
> -- 
> Evertjan.
> The Netherlands.
> (Please change the x'es to dots in my emailaddress)


Thanks, Evertjan.
I have the iFrame content check code because I do not want the script changing the content if the user has already manually changed the iframe contents using a manual link available for them to click.

So yes, removing the the 

var iDoc = (iFrm.contentWindow.location.href || iFrm.contentDocument.location.href); 
if (iDoc!="about:blank" && iDoc.indexOf("jthl_splash.html")==-1) return; 

would make my code less clunky, but could cause an annoying page change in the middle of a visitor reading another page.

[toc] | [prev] | [standalone]

Back to top | Article view | comp.lang.javascript

csiph-web