time-based array reader

JavaScript and client side scripting.

Moderator: General Moderators

Post Reply
sousousou
Forum Commoner
Posts: 29
Joined: Fri Aug 28, 2009 1:10 pm

time-based array reader

Post by sousousou »

Ok I have a website at which I want to display one of our sponsors at every X (3 in code) seconds.

Code: Select all

 
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
 
<html> 
 
  <head> 
 
  <title></title> 
 
  <script src="admin/sponsors.js" type="text/javascript"> </script>
 
  <script type="text/javascript">    
 
    // Sponsor 
 
    function Sponsor() { 
      var _currentState = 0;
 
      // Private member 
      var $ = function(id) { 
 
        return document.getElementById(id); 
 
      }; 
 
 
      // Private member 
 
      var toBinder = function(_title, _message, _address, _tel, _fax, _email, _url) {
 
        $("name").innerHTML = _title;
 
        $("img").innerHTML = _message; 
 
    $("address").innerHTML = _address;
 
    $("tel").innerHTML = "tel: " + _tel;
 
    $("fax").innerHTML = "fax: " + _fax;
 
    $("email").innerHTML = _email;
 
        $("url").innerHTML = _url;
 
      }; 
 
 
     // Private member 
 
      var getTotalItems = function() { 
 
        var _totalItems = 0; 
 
        for(var item in sponsors) { 
 
          _totalItems++; 
 
        } 
 
        return _totalItems; 
 
      }; 
 
 
      // Public member 
 
      this.init = function(seconds) { 
 
        var _item = "sponsor"; 
 
        var callBinder = function() { 
 
          toBinder(sponsors[_item + _currentState].name, 
 
          sponsors[_item + _currentState].img,
 
          sponsors[_item + _currentState].address,
 
          sponsors[_item + _currentState].tel,
 
          sponsors[_item + _currentState].fax,
 
          sponsors[_item + _currentState].email,
                  
              sponsors[_item + _currentState].url);
 
        } 
 
        callBinder(); 
 
        //_currentState = 1;
 
        var timer = setInterval(function(){ 
 
          _currentState = Math.floor(Math.random()*getTotalItems());
 
          callBinder(); 
 
          //_currentState++;
 
        }, seconds + "000"); 
 
      } 
 
    } 
 
 
    // Not the nicest way to call the onload handler, but hey... 
 
    window.onload = function() { 
 
      // New instance of Sponsor 
 
      var sponsor = new Sponsor(); 
 
      // Initialize Sponsor 
 
      var seonds_to_switch = 3;
 
      sponsor.init(seonds_to_switch); 
 
    } 
 
  </script> 
 
  </head> 
 
  <body> 
 
    <div id="binder" width="190">
 
      <div id="name"></div> 
 
      <div id="img"></div> 
 
      <div id="address"></div>
 
      <div id="tel"></div>
      
      <div id="fax"></div>
 
      <div id="email"></div>
      
      <div id="url"></div>
 
    </div> 
 
  </body> 
 
</html>
 
This is the code I have (sponsors.js is a JSON object). It's made by a partner of mine who stopped with the website and I only understand little of this code.

I made it so it walked randomly through the array instead of +1 +1 etc. Only the first time is still the same everytime, but if I change

Code: Select all

var _currentState = 0;
into

Code: Select all

var _currentState = Math.floor(Math.random()*getTotalItems());
it didnt work.

Further I want to remember which sponsors were shown, so it only shows every sponsor once each round (random).

Furthermore I want it to not show empty values. Sometimes "fax" or "e-mail" aren't set in the JSON object (cause obviously the sponsor doesn't have a fax anymore :P ), but currently it shows "undefined" which doesn't look very good.

Can anybody help me with this?
sousousou
Forum Commoner
Posts: 29
Joined: Fri Aug 28, 2009 1:10 pm

Re: time-based array reader

Post by sousousou »

kick :?:
User avatar
kaszu
Forum Regular
Posts: 749
Joined: Wed Jul 19, 2006 7:29 am

Re: time-based array reader

Post by kaszu »

Not to show empty values use something like this:

Code: Select all

$("fax").innerHTML = (_fax ? "fax: " + _fax : '');
Post Reply