How to update marqueecontent while determined time

I found a little News Bar script that runs in IE and Firefox;

<script language="JavaScript">

ticker_width = "700px";
ticker_height = "22px";
ticker_speed = 1;
ticker_pause_onhover = 1;
marqueecontent = '<nobr><span class=ticker><nobr><span class=ticker_text_start></span><a target=_blank class=ticker_news href="http://feeds.washingtonpost.com/~r/wp-dyn/rss/business/index_xml/~3/yBvTLfEYQwI/AR2009032703315.html"> Obama, Bankers Sit Face to Face </a><span class=ticker_text_end> Updated at: 02:08 ET - U.S.</span></nobr></span></nobr>';

ticker_speed = (document.all) ? ticker_speed : Math.max(1, ticker_speed-1);
var copyspeed = ticker_speed;
var pausespeed = (ticker_pause_onhover == 0) ? copyspeed : 0;
var iedom = document.all || document.getElementById;
if (iedom) {
  document.write('<span id="temp" style="visibility:hidden;position:absolute;top:-200px;left:-100000px">'+marqueecontent+'</span>');
}

var actualwidth='';
var rh_ticker_iedom, rh_ticker_ns;

function populate() {
  if (iedom) {
    rh_ticker_iedom = document.getElementById? document.getElementById("ie_rh_ticker") : document.all.ie_rh_ticker;
    rh_ticker_iedom.style.left = parseInt(ticker_width)+8+"px";
    rh_ticker_iedom.innerHTML = marqueecontent;
    actualwidth = document.all ? temp.offsetWidth : document.getElementById("temp").offsetWidth;
  } else if (document.layers) {
    rh_ticker_ns=document.rh_ticker_ns.document.ns_marquee2;
    rh_ticker_ns.left=parseInt(ticker_width)+8;
    rh_ticker_ns.document.write(marqueecontent);
    rh_ticker_ns.document.close();
    actualwidth=rh_ticker_ns.document.width;
  }
  lefttime = setInterval("rh_ticker_scroll()",20);
}
window.onload=populate;

function rh_ticker_scroll(){
  if (iedom) {
    if (parseInt(rh_ticker_iedom.style.left) > (actualwidth*(-1)+8)) {
      rh_ticker_iedom.style.left=parseInt(rh_ticker_iedom.style.left)-copyspeed+"px"
    } else {
      rh_ticker_iedom.style.left=parseInt(ticker_width)+8+"px"
    }
  } else if(document.layers) {
    if(rh_ticker_ns.left > (actualwidth*(-1)+8)) {
      rh_ticker_ns.left -= copyspeed;
    } else {
      rh_ticker_ns.left=parseInt(ticker_width)+8
    }
  }
}

if (iedom||document.layers) {
  with (document) {
    document.write('<table border="0" cellspacing="0" cellpadding="0"><tr><td>');
    if (iedom) {
      write('<div style="position:relative;width:'+ticker_width+';height:'+ticker_height+';overflow:hidden;background-color:#e0e0ff;border:1px solid #808080;">')
      write('<div style="position:absolute;width:'+ticker_width+';height:'+ticker_height+';" onMouseover="copyspeed=pausespeed" onMouseout="copyspeed=ticker_speed">')
      write('<div id="ie_rh_ticker" style="position:absolute;left:0px;top:0px"></div>')
      write('</div></div>')
    } else if (document.layers) {
      write('<ilayer width='+ticker_width+' height='+ticker_height+' name="rh_ticker_ns" bgColor='+ss_marquee_color_bg+'>')
      write('<layer name="ns_marquee2" left=0 top=0 onMouseover="copyspeed=pausespeed" onMouseout="copyspeed=ticker_speed"></layer>')
      write('</ilayer>')
    }
    document.write('</td></tr></table>')
  }
}

</script>

Code (markup):

But I want to update marqueecontent from an PHP file with for example every one minute. How can I this?

 

this script seems to take the content of your ie_rh_ticker div and scroll it. you need to:

1. setup something like var getNewContent = function() { ... xhttp (ajax) request for your php script, eval response and set the result to your ie_rh_ticker's innerHTML, then run your populate function.

1.2 modify populate function and add clearTimeout(lefttime); at top

2. use setTimeout or whatever means your framework allows you to poll call the above function (as self) every nn seconds.

it's much easier with frameworks, they take care of your ajax and periodical checks etc - for instance, to do all of that in mootools, all i'd need is:

(function() {
    $("ie_rh_ticker").load("reload.php", {onComplete: populate});
}).periodical(60*1000);

PHP:

 

Hi,
I'm very amateur with JavaScript and Ajax. And, I couldn't understand anything your post . Is in this script difficult to update content? I'm using prototype in the page for some other scripts. Can we use its some functions?
Thank you,

EGE

 

yes, prototype does support ajax. in fact:

http://www.prototypejs.org/api/ajax

new Ajax.PeriodicalUpdater(container, url[, options]);
Periodically performs an AJAX request and updates a container’s contents based on the response text. Offers a mechanism for “decay,” which lets it trigger at widening intervals while the response is unchanged.

i am not exactly versed in prototype but it looks like all you need to do is add:

new Ajax.PeriodicalUpdater("ie_rh_ticker", "updater.php", {
   method: 'get',
   frequency: 60,
   decay: 2,
   onComplete: function() {
       populate();
   }
});

PHP:

... with updater.php being the script that provides your news content.