Popup XBOX 360 gamertag

Function

This mod will popup XBOX 360 gamertags when you hover your cursor over them.

Important

Backup all templates you're going to edit in the event a revert is required.

Credit

To stonyarc for his Xbox.com gamercard for all users and to www.xboxworld.nl from where I pretty much stole the script from.

Support

Limited

Important

Update: Fixed code in postbit to add missing 'A'

Modifications

* file uploads
* 3 templates
* 1 new userfield

Copy the following into your templates and voila it works. Enjoy!

See it in action at
http://www.eyecravedvd.com/forums/showthread.php?p=9701

User Field

Go to AdminCP -> User Profile Fields -> Add New User Profile Field
Profile Field Type: Single-Line Text Box
Title: XBOX 360 Gamertag
Description: Please type your Gamertag Here
Field Editable by User: Yes
Save

Template mods

In order for this script to work you must download the overLIB javascript library from
http://www.bosrup.com/web/overlib/

Ensure the correct path to overlib is set in the first line. The correct file is overlib_mini.js. It's located in the mini folder in the library.

Change the 'X' in $post[fieldX] to whatever your field ID is.

edit template: headerinclude
place at bottom

<script type="text/javascript" src="http://www.path-to-overlib/mini/overlib_mini.js"></script>
<script type="text/javascript">
function setcursor(type) {
    document.getElementsByTagName('body')[0].style.cursor = typeof type == 'undefined' ? 'default' : type;
    links = document.getElementsByTagName('a');
    for(i = 0; i < links.length; i++) links.item(i).style.cursor = typeof type == 'undefined' ? 'pointer' : type;
}

function showgamercard(gamertag) {
    setcursor('progress');
    return overlib('<iframe onload="setcursor();" src="http://gamercard.xbox.com/'+gamertag+'.card" scrolling="no" frameBorder="0" height="140" width="204">'+gamertag+'</iframe>', BORDER, 0, FULLHTML, WIDTH, 204, HEIGHT, 140);
}

function hidegamercard() {
    return nd();
}
</script>

Edit template: Postbit

Find: (you can edit the location this is just a suggested spot)

<if condition="$post['usertitle']"><div class="smallfont">$post[usertitle]</div></if>

Add below:

  <div>&nbsp;</div>
  <div class="smallfont"><input type="hidden" name="gamertag" value="$post[fieldX]"> 
  <if condition="$post[fieldX]">
  <strong>Gamertag:</strong> <a onmouseover="showgamercard('$post[fieldX]');" onmouseout="return hidegamercard();" href="http://live.xbox.com/member/$post[fieldX]" target="_blank" rel="nofollow">$post[fieldX]</a></if></div>

Edit template: Postbit Legacy

Find:

 <if condition="$post['joindate']"><div>$vbphrase[join_date]: $post[joindate]</div></if>

Above add:

<br />

  <div><input type="hidden" name="gamertag" value="$post[fieldX]"> 
  <if condition="$post[fieldX]">
  <strong>Gamertag:</strong> <a onmouseover="showgamercard('$post[fieldX]');" onmouseout="return hidegamercard();" href="http://live.xbox.com/member/$post[fieldX]" target="_blank" rel="nofollow">$post[fieldX]</a></if></div>

[EnIgMa1234]

great job. nice work

[jgommel]

For some reason or another, it's not working for me. What version of 'overLIB' are you using? I downloaded version 4.21 and created a directory called overlib within the root of my forum (http://www.domain.com/vb/overlib/). I've also tried it within the vb/clientscript/ directory but, it still doesn't appear to be working.

I have a user profile field created (field18), edited my posbit_legacy template (BTW, in the code below I'm supposed to change all fields $post[fieldX] with $post[field18], but there's one $post[field6] in there -- I'm assuming that I should change that one as well?)

<div><input type="hidden" name="gamertag" value="$post[fieldX]"> 
<if condition="$post[fieldX]"><strong>Gamertag:</strong> <a onmouseover="showgamercard('$post[field6]');" onmouseout="return hidegamercard();" href="http://live.xbox.com/member/$post[fieldX]" target="_blank" rel="nofollow">$post[fieldX]</a></if></div>

The Gamertag appears in my postbit_legacy and the link itself works - just not getting the popup.

My domain: neosmut.com

[EyeCrave]

The script uses overlib_mini.js

It's located in the mini folder and sorry if I missed the 6. It should reflect your field ID. I'll fix it in the file when I get home later tonight, the post has been corrected.

[EyeCrave]

Updated the file with fixed code.

[jgommel]

It's still not working on my site. I've double checked to make sure I didn't miss something, but the path to overlib_mini.js is correct and I've added the code to my postbit_legacy template ... I'm not quite sure what else to do?

I'm wondering if it has anything to do with the skin/theme I'm using? Maybe the code I'm supposed to add to the bottom of the header template could/should go else where?

I started to wonder if it was my browser since I'm on a Mac, but I checked the link you supplied and it works just fine. I had some PC user friends of mine try it as well, and they too said it didn't work.

Anyone have any suggestions or ideas on how I can get this to work?

[EyeCrave]

Does it work for you on my demo link? Try moving it to headerinclude. That might be my mistake in the post above, which I've since rectified. First mod... sorry.

[Thorlax402]

The popup doesn't work for me either...can you please explain more?

[EyeCrave]

Do you get a script error on your page? Give me your URL so I can look at it.

[Thorlax402]

<a href="http://www.halofordummies.com" target="_blank">http://www.halofordummies.com</a>

Not many people have typed in their gamertag yet, but Thorlax402 has his and everything looks fine accept the hovering box doesn't appear.