Results 1 to 2 of 2

Your favorite Apple, iPhone, iPad, iOS, Jailbreak, and Cydia site.


Thread: Need Help with HTML

  1. #1
    Default Need Help with HTML
    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:
    Code:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>Untitled Document</title>
    <style type="text/css">
    <!--
    .style8 {
    	font-family: Arial, Helvetica, sans-serif;
    	font-weight: bold;
    }
    --
    </style>
    </head>
    
    <body>
    <div align="center">
      <p>&nbsp;</p>
      <p><img src="http://gamercard.xbox.com/xweb/lib/images/G_Icon_External.gif" width="13" height="12" /><span class="style8">2245</span><img src="http://avatar.xboxlive.com/avatar/RotaryAce/avatarpic-s.png" width="32" height="32" /></p>
    </div>
    </body>
    </html>
    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:


    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>Untitled Document</title>
    <style type="text/css">
    <!--
    .style8 {
    font-family: Arial, Helvetica, sans-serif;
    font-weight: bold;
    }
    --
    </style>
    </head>

    <body>
    <div align="center">
    <p>&nbsp;</p>
    <p><img src="http://gamercard.xbox.com/xweb/lib/images/G_Icon_External.gif" width="13" height="12" /><span class="style8">2245</span><img src="http://avatar.xboxlive.com/avatar/RotaryAce/avatarpic-s.png" width="32" height="32" /></p>
    </div>
    </body>
    </html>
    Last edited by RotaryAce; 12-16-2008 at 01:07 PM. Reason: Automerged Doublepost
    I laugh at those who don't like vista.

    Not really, I just laugh at people getting upset over me saying that.

    My Vista Complaint Count: 2

  2. #2
    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 <meta http-equiv="REFRESH" content="x"> 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.
    Last edited by catfacts; 01-29-2009 at 11:32 PM. Reason: Automerged Doublepost

Posting Permissions
  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •