load a javascript ONLY on the homepage

[mr_c]

hey guys, I want to load a twitter widget javascript on the homepage of my website, and no where else because i get this error in the error info box in IE8

 

Message: ‘document.getElementById(…)’ is null or not an object

 

(works fine on the homepage where i have the widget, so the error must be because it's not on the same page as the widget)

 

 

i tried adding this to the template file

if (document.getElementById("twitter_div")) {
<scriipt type="text/javascript" src="http://localhost/modules/twitter/blogger.js"></scriipt>
<scriipt type="text/javascript" src="http://twitter.com/statuses/user_timeline/Mytwitter.json?callback=twitterCallback2&count=5"></scriipt>
}

 

Eseentially, what i want is to to make an if statement saying “if twitter div exists on page, run script, else, don’t”

but it doesn't work. Is there a way to do this with smarty php?

thanks

[RichardRotterdam]

the scriipt tag does not look right at all

<scriipt> 

That could start an error. As for the document.getElementById() function do you wait for the dom to be loaded before you call that function?

and what does the code look like where you are calling it?

[mr_c]

Ohh haha i put two I's because on some forums the lines that start with "script" are censored.

 

 

this is the entire twitter widget javascript that i'm trying to just load on the homepage:

function twitterCallback2(twitters) {
  var statusHTML = [];
  for (var i=0; i<twitters.length; i++){
    var username = twitters[i].user.screen_name;
    var status = twitters[i].text.replace(/((https?|s?ftp|ssh)\:\/\/[^"\s\<\>]*[^.,;'">\:\s\<\>\)\]\!])/g, function(url) {
      return '<a href="'+url+'">'+url+'</a>';
    }).replace(/\B@([_a-z0-9]+)/ig, function(reply) {
      return  reply.charAt(0)+'<a href="http://twitter.com/'+reply.substring(1)+'">'+reply.substring(1)+'</a>';
    });
    statusHTML.push('<li><span class="tweetcontents">'+status+'</span> <a href="http://twitter.com/'+username+'/statuses/'+twitters[i].id+'"></a><br />'+relative_time(twitters[i].created_at)+'</li>');
  }
  document.getElementById('twitter_update_list').innerHTML = statusHTML.join('');
}
function relative_time(time_value) {
  var values = time_value.split(" ");
  time_value = values[1] + " " + values[2] + ", " + values[5] + " " + values[3];
  var parsed_date = Date.parse(time_value);
  var relative_to = (arguments.length > 1) ? arguments[1] : new Date();
  var delta = parseInt((relative_to.getTime() - parsed_date) / 1000);
  delta = delta + (relative_to.getTimezoneOffset() * 60);

  if (delta < 60) {
    return 'less than a minute ago';
  } else if(delta < 120) {
    return 'about a minute ago';
  } else if(delta < (60*60)) {
    return (parseInt(delta / 60)).toString() + ' minutes ago';
  } else if(delta < (120*60)) {
    return 'about an hour ago';
  } else if(delta < (24*60*60)) {
    return 'about ' + (parseInt(delta / 3600)).toString() + ' hours ago';
  } else if(delta < (48*60*60)) {
    return '1 day ago';
  } else {
    return (parseInt(delta / 86400)).toString() + ' days ago';
  }
}

 

thanks

[mr_c]

And the exact situation is as so:

 

I have a dynamic site with templates. The javascript for twitter is loaded in the head of the main template, so it is loaded on every page. It works perfect on the homepage, no error messages and the twitter div shows the tweets, it's when you go on another page (loads the twitter javascript again) and thats when i get the error. But even if it didn't send an error message, i'm trying to get the twitter javascript to only load on the homepage because i can see a "loading from twitter xxx" in the status bar when looking at pages that don't have the twitter widget (page takes longer to load unnecessarily because of it)

 

thanks

[RichardRotterdam]

And the exact situation is as so:

I have a dynamic site with templates. The javascript for twitter is loaded in the head of the main template, so it is loaded on every page.

i'm trying to get the twitter javascript to only load on the homepage

Just reading those two comments, wouldn't it be a whole lot easier to just not include it in the template but only include it on the homepage? You only want it to load on the homepages so therefor why not only place it on the homepage?

[mr_c]

Problem is i can't do that, because the twitter javascript has to go right before the last </body> in the footer template file. And every page uses that template file. I can't put the javascript anywhere else because if it's not the last thing, it makes the page stop loading until it gets all the tweets (can take a 5-10 seconds). If i could write an if statement, it would fix the problem, but i'm struggling to do it

[RichardRotterdam]

Problem is i can't do that, because the twitter javascript has to go right before the last </body>

Nah you don't need to put it before your </body> tag you just need to load a certain function when your DOM has loaded. Lookup stuff like domread or onload (less efficient)

 

A simple example of waiting for the whole page to load (including images) would be to use onload like so:

<script type="text/javascript">
// wait for the page to load
window.onload = function(){

  // call a function when your page has loaded
  your_function_to_call_after_the_page_has_loaded();

}
</script>

 

you could place that anywhere you want and you would not have to contamitate your template