...

View Full Version : JavaScript include difficulties



erebus
10-08-2012, 04:05 PM
I have small peice of code that runs at the end of my code after the page is created and it manipulates the sidebar which is apart of the overall template. Since its accessing an API i could foresee future changes that would need to be made to the code and ofcourse that needs to be reflected to all pages. So i took my peice of code


<!-- Top 3 Streams -->
<script type="text/javascript">

var myurl = encodeURIComponent("https://api.twitch.tv/kraken/streams?game=DayZ&limit=3")

scr = document.createElement("script");
scr.type = "text/javascript"
scr.src = 'http://query.yahooapis.com/v1/public/yql?q=select%20*%20from%20json%20where%20url%3D%22' + myurl + '%2F%22&format=json&callback=showGame';
document.body.appendChild(scr);
</script>
<!-- / Top 3 Streams -->

and replaced it with an include


<!-- Top 3 Streams -->

<?php include('includes/top3streams.php'); ?>

<!-- / Top 3 Streams -->

and now its not working properly... did i not implement this include properly?

The contents of the include file read


<script type="text/javascript">

var myurl = encodeURIComponent("https://api.twitch.tv/kraken/streams?game=DayZ&limit=3")

scr = document.createElement("script");
scr.type = "text/javascript"
scr.src = 'http://query.yahooapis.com/v1/public/yql?q=select%20*%20from%20json%20where%20url%3D%22' + myurl + '%2F%22&format=json&callback=showGame';
document.body.appendChild(scr);
</script>

perhaps the <script type="text/javascript"> and </script> needs to remain in the HTML? perhaps its not loading in fast enough? any thoughts?

perhaps i should be using a External JS file instead? or heck, maybe even a more basic HTML include?

WolfShade
10-08-2012, 04:08 PM
No, the script tags should remain in the included file.

What error messages is the browser producing?

erebus
10-08-2012, 04:09 PM
Note: It works perfectly in Chrome, but not in IE8

erebus
10-08-2012, 04:10 PM
No, the script tags should remain in the included file.

What error messages is the browser producing?

Webpage error details

User Agent: Mozilla/4.0 (compatible; MSIE 8.0; Windows NT 6.1; WOW64; Trident/4.0; SLCC2; .NET CLR 2.0.50727; .NET CLR 3.5.30729; .NET CLR 3.0.30729; Media Center PC 6.0; .NET4.0C; .NET4.0E)
Timestamp: Mon, 8 Oct 2012 15:09:40 UTC


Message: Unknown runtime error
Line: 39
Char: 7
Code: 0
URI: http://dayzlive.com/beta/

erebus
10-08-2012, 04:19 PM
It works perfectly in Chrome

Not at all in IE8

and intermittently in Firefox (when refreshing it sometimes dident work)

*edit: i refreshed over a dozen times and it suddenly seems stable in firefox as well now


Note the function it references is not being included.. its written directly in head


function showGame(o)
{
var thediv = document.getElementById("results")
var base = o.query.results.json.streams;
for (var i = 0; i < base.length; i ++ )
{
document.getElementById("streamlogo" + (i + 1)).src = base[i].channel.logo;
document.getElementById("streamname" + (i + 1)).innerHTML = base[i].channel.name;
var status = base[i].channel.status
if (status.length > 76)
{
var statusubstr = status.substr(0,76)
document.getElementById("streaminfo" + (i + 1)).innerHTML = "<b>Viewers: " + base[i].viewers + "</b><br><p>" + statusubstr + "... </p>";
}
else
{
document.getElementById("streaminfo" + (i + 1)).innerHTML = "<b>Viewers: " + base[i].viewers + "</b><br><p>" + status + " </p>";
}
}
}

xelawho
10-08-2012, 04:32 PM
presumably you are using the include in the head.

but you are attaching the script to the body.

when the browser is reading the head section, the body does not exist yet. In the absence of a body, most browsers will create one, because they know that there has to be one, eventually.

But IE is fun and quirky and likes to do its own thing.

The easiest solution (I think) is to attach the script to the head, using this line instead of the "body" one:

document.getElementsByTagName("head")[0].appendChild(scr);

erebus
10-08-2012, 05:13 PM
presumably you are using the include in the head.

but you are attaching the script to the body.

when the browser is reading the head section, the body does not exist yet. In the absence of a body, most browsers will create one, because they know that there has to be one, eventually.

But IE is fun and quirky and likes to do its own thing.

The easiest solution (I think) is to attach the script to the head, using this line instead of the "body" one:

document.getElementsByTagName("head")[0].appendChild(scr);

I think i am using the include in the body, actually its the last thing in the body.. either that or i do not quiet understand your recomendation



<!-- Top 3 Streams -->

<?php include('includes/top3streams.php'); ?>

<!-- / Top 3 Streams -->

</body>
</html>

felgall
10-08-2012, 08:38 PM
Why not just use an external JavaScript - there is no point in using a server side include call for a script when using an external script allows the code to be shared between pages in the browser with only doewnloading it once rather than once per page.

Old Pedant
10-08-2012, 11:39 PM
What I *REALLY* don't understand is the need to use appendChild, at all.

Why not just do this directly????


<script type="text/javascript"
src="http://query.yahooapis.com/v1/public/yql?q=select%20*%20from%20json%20where%20url%3D%22https%3A%2F%2Fapi.twitch.tv%2Fkraken%2Fstreams%3Fg ame%3DDayZ%26limit%3D3%2F%22&format=json&callback=showGame">
</script>


That is, figure out what the URIEncoded version of myurl is ONE TIME and plunk it in place in the yahoo query url. Then you don't have to use an extra layer of indirection and appendChild and all the rest of it.



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum