[RotaryAce]

Sorry if this is the wrong forum for this, but as there is no off-topic forum and this question regards HTML I thought it would be appropriate to post this here.

I have been working on several themes for the iPhone and iPod touch, and was working on a widget for an xbox theme to display your avatar and gamerscore exactly like it does on the xbox. If you are unfamiliar with this, refer to the picture below:

(it does not display the gamerscore in that image as it rotates between the gamerscore and the display shown above)

Note: The avatar image & gamerscore are in the top-right.

I have come across two problems. My widget is currently only displaying a static gamerscore and it does not update. I also can only configure it to easily display the avatar image, not the actual avatar. As an example, this:

is my avatar and this:

is an avatar image.
Notice the difference in the web address:

http://image.xboxlive.com/global/t.5...0/tile/0/2800a

http://avatar.xboxlive.com/avatar/Ro...vatarpic-l.png

My question is "Does anyone know how to set up the HTML to display the actual avatar and the actual gamerscore, with both of them being updated, and with only a simple edit of the HTML by users of the theme?"

Here are some recources I have been using to gather data:
http://gamercard.xbox.com/xweb/lib/c...erCardSkin.css

http://gamercard.xbox.com/rotaryace.card


Oh, I almost forgot, here is my code:

  
 
  
2245

I'll edit this post later to display pictures of the widget in the theme as it is right now.

Also, can someone tell me if double posting is allowed on this forum? I didn't see an edit button. For some reason my code isn't displaying properly for me so here it is w/out code brackets:

 

2245

[catfacts]

I may be wrong but it sounds like you need some javascript code. To cause HTML to update itself there are really only two ways.

1) Use javascript fade() function with AJAX to fetch new data and then document.getElementById() to change the values. Not knowing your full code, I can't make an working model for you but I'll look into it (PM me if i take to long, but i have other projects going too :P)

2) the simple yet brute force way is to add where x is the number of seconds you want to wait in between refreshes. However this is a full page refresh.

As for the icon I don't see what you mean, wouldn't they just have to edit the src of the img tag?

Yea your going to want to make a function, lets call it updateData() that will get the new scores. Then add window.onload = function() { setTimeout(x, updateData()); }. x is the number of miliseconds you want your script to be run. (60*60830 would give you every half hour). For your updateData function its basically

function updateData() {
// Your ajax, get data stuff here, im not sure what your data source is
document.getElementById('scores');
scores.innerHTML = 'Something ' + x;
}

This assumes you have an html element with id="scores" in it. Google javascript, innerHTML, ajax, you'll find what you need.