Steam Powered Forum Signatures

[Oscar99]

Okay well i've had the idea of making an awesome looking signature for a while now however my problem lies with the coding behind it.

My idea is similar to what i already (see signature) however i want to add my own custom background to it rather than the default steam version...

I'll use my photoshop skills to make the background fit with the signature however is there any coder here that knows how to parse steam data together?

I'm pretty sure you can get the source files for it all however i'm not sure...

Would be an awesome little project :P

If possible, i'll draw up a concept later on.


Edit: This is what i mean sort of :

http://img849.imageshack.us/img849/5561/steamsignature.png (http://www.steamcommunity.com/id/Oscar99)

[Peter]

Wouldn't be too difficult to grab all of the info using the API - http://developer.valvesoftware.com/wiki/Steam_Web_API#GetPlayerSummaries_.28v0001.29

However, the difficulty would come when grabbing the game details (the little pictures for the games). But, it would be possible to grab all of those by just scraping the page with cURL, and if you're doing that anyway, may as well just get the other details while you're there and not use the API.

[heavywater]

Shouldn't be a huge amount of hassle to code, I can have a look at it later tonight, see if I can find somewhere to pull the images from. :)

If it works I should be able to code something with my incredible (read atrocious) php skillz.

[Peter]

Here's something I just threw together, probably isn't perfect but it pretty much does the job:

<?php


function getSteamInfo($checkUrl) {
$baseSteamUrl = "http://media.steampowered.com/steamcommunity/public/images/avatars/";

$ch = curl_init();
curl_setopt($ch, CURLOPT_RETURNTRANSFER, 1);
curl_setopt($ch, CURLOPT_TIMEOUT, 10);
curl_setopt($ch, CURLOPT_CONNECTTIMEOUT_MS, 250);
curl_setopt($ch, CURLOPT_FOLLOWLOCATION, 1);
curl_setopt($ch, CURLOPT_HEADER, 0);
curl_setopt($ch, CURLOPT_USERAGENT, "Mozilla/5.0 (Windows; U; Windows NT 6.1; en-GB; rv:1.9.2.13) Gecko/20101203 Firefox/3.6.13");
curl_setopt($ch, CURLOPT_ENCODING, "gzip,deflate");

curl_setopt($ch, CURLOPT_URL, $checkUrl);

$returnData = curl_exec($ch);

// Remove all new lines to make matching easier
$returnData = str_replace(array("\r\n", "\n", "\t"), "", $returnData);

if (strpos($returnData, "This user has not yet set up their Steam Community profile.") || strpos($returnData, "This profile is private.") || strpos($returnData, "</html>") === FALSE) {
// The user doesn't have a profile, or it's private, or cURL didn't return all of the data
return false;
}

$regexTemp = preg_match('/<title>Steam Community :: ID :: (.+?)<\/title>/', $returnData, $matchesTemp);
$steamInfo['name'] = $matchesTemp[1];
$regexTemp = preg_match('/<div id="profileAvatar"><div class="avatarHolder_default"><div class="avatarFull"><img src="http:\/\/media.steampowered.com\/steamcommunity\/public\/images\/avatars\/([a-z0-9_\.\/]+)" \/><\/div><\/div>/', $returnData, $matchesTemp);
$steamInfo['avatar'] = $baseSteamUrl.$matchesTemp[1];
if (strpos($returnData, "status_online.gif") !== false) {
$steamInfo['status'] = "Online";
$steamInfo['currentGame'] = false;
}
elseif (strpos($returnData, "status_in-game.gif") !== false) {
$steamInfo['status'] = "Currently In-game";
$regexTemp = preg_match('/<p id="statusInGameText">(.+?)<\/p>/', $returnData, $matchesTemp);
$steamInfo['currentGame'] = trim($matchesTemp[1]);
}
else {
$steamInfo['status'] = "Offline";
$steamInfo['currentGame'] = false;
}
$regexTemp = preg_match('/<div class="statsItemName">Playing time:<\/div>(.+?)<\/div>/', $returnData, $matchesTemp);
$steamInfo['playtime'] = $matchesTemp[1];
$regexTemp = preg_match('/<div class="statsItemName">Steam Rating:<\/div>(.+?)<\/div>/', $returnData, $matchesTemp);
$steamInfo['rating'] = $matchesTemp[1];
$regexTemp = preg_match('/<div class="statsItemName">Member since:<\/div>(.+?)<\/div>/', $returnData, $matchesTemp);
$steamInfo['member_date'] = $matchesTemp[1];
$regexTemp = preg_match_all('/<div class="mostPlayedBlockIcon"><div class="iconHolder_default"><div class="avatarIcon"><a href=".+?"><img src="(.+?)" \/><\/a><\/div><\/div><\/div>/', $returnData, $matchesTemp);
$steamInfo['games_played'] = $matchesTemp[1];
$steamInfo['groups'] = array();
if (strpos($returnData, "<div id=\"primaryGroupAvatar\">") !== false) {
// User has groups
$regexTemp = preg_match('/<div id="primaryGroupAvatar"><div class="avatarHolder_default"><div class="avatarFull"><a href=".+?"><img src="http:\/\/media.steampowered.com\/steamcommunity\/public\/images\/avatars\/([a-z0-9_\.\/]+)" border="0" \/><\/a><\/div><\/div><\/div>/', $returnData, $matchesTemp);
$steamInfo['groups'][] = $baseSteamUrl.str_replace('_full', '', $matchesTemp[1]);
$regexTemp = preg_match_all('/<div class="groupBlockMedium"><div class="mediumHolder_default"><div class="avatarMedium"><a href=".+?"><img src="http:\/\/media.steampowered.com\/steamcommunity\/public\/images\/avatars\/([a-z0-9_\.\/]+)" \/><\/a><\/div><\/div><\/div>/', $returnData, $matchesTemp);
if (count($matchesTemp[1]) > 0) {
foreach($matchesTemp[1] as $thisGroupUrl) {
$steamInfo['groups'][] = $baseSteamUrl.str_replace('_medium', '', $thisGroupUrl);
}
}
}
return $steamInfo;
}


print_r(getSteamInfo("http://steamcommunity.com/id/Oscar99/"));

?>Example returned data:


Array (
[name] => Oscar99
[avatar] => http://media.steampowered.com/steamcommunity/public/images/avatars/69/692cf5efa481c3d12ef35301276b3f892dee5984_full.jpg
[status] => Currently In-game
[currentGame] => Call of Duty: Black Ops - Multiplayer
[playtime] => 68.6 hrs past 2 weeks
[rating] => 10
[member_date] => March 6, 2009
[games_played] => Array
(
[0] => http://media.steampowered.com/steamcommunity/public/images/apps/8500/6822a3f95654d952f7f9f8d5b5f890c0b1a3a6d1.jpg
[1] => http://media.steampowered.com/steamcommunity/public/images/apps/33930/32431d84014bf4652181f45bc7c06f1ca3f34363.jpg
[2] => http://media.steampowered.com/steamcommunity/public/images/apps/42710/d595fb4b01201cade09e1232f2c41c0866840628.jpg
[3] => http://media.steampowered.com/steamcommunity/public/images/apps/34330/2fa97296a62daf0329b3867ad6837a2289229fbb.jpg
[4] => http://media.steampowered.com/steamcommunity/public/images/apps/440/e3f595a92552da3d664ad00277fad2107345f743.jpg
[5] => http://media.steampowered.com/steamcommunity/public/images/apps/33910/7fd2d12d3f91ee3e69955121323bb89063ea304e.jpg
)
[groups] => Array
(
[0] => http://media.steampowered.com/steamcommunity/public/images/avatars/17/1726d5b62ebdc9984bd0667515fd9592da27ae01.jpg
[1] => http://media.steampowered.com/steamcommunity/public/images/avatars/4f/4f33c2bed4d82848e572300ba8733203ff0c39df.jpg
[2] => http://media.steampowered.com/steamcommunity/public/images/avatars/62/62a89b033afbe80a8c98cf7b461f3e02048e8795.jpg
)
)

[heavywater]

Awesome, looks very handy indeed, thanks. :D

[Peter]

For a better solution really should put the HTML into a DOMDocument and traverse the document tree that way.

[SilveR_172]

Holy HELL , Could you make me one oscar :P once you figure out how to do yours ?

[Sarky]

Oh wow, that looks amazing! Would love a BFBC2 themed one myself :)

[heavywater]

Right, I'll have a proper look at this. :)

[Oscar99]

Well that is my problem - I could sure design them , but coding is my problem - i know nothing lol.

[heavywater]

Could you upload the background you want used? I can make a proper proof on concept that way. 460x128 would probably be easiest.

Added after 14 minutes:

Well, certainly seems doable:

http://i51.tinypic.com/1zmz7lk.jpg

[Peter]

Yeah it's not too difficult to throw them together with GD once you have the images you want. It's just about positioning at that point.

[heavywater]

Unfortunately, it doesn't seem linkable as a png file (though it is downloadable as one). Any idea of a quick way to create a custom URL to the png Peter?

http://i54.tinypic.com/2zsch1y.png

Oh yeah, it also just grabs the XML data instead of using cURL, seems Steam want to make things easy. :D

Also bear in mind that when Oscar's not ingame there's just gonna be a gap in there until I work out what to put in instead. :p

[Peter]

You'll need to use mod_rewrite to do it.

Have your PHP script work something like this:
myscript.php?steam=oscar99
or
myscript.php?steam=1234567890blah

Where the latter is an ID number not a name (have your script detect whether it's a name or an ID and look up what's needed).

Make sure your PHP script has the following at the top:

header('Content-type: image/png');Then you'll need a .htaccess file containing something like the following:

RewriteEngine On
RewriteRule ^steam_(.+?).png$ myscript.php?steam=$1
Then you should be able to access the images through:

http://example.com/directorycontainingmyscript/steam_oscar99.png

[Oscar99]

Looking good so far however is it worth taking note that i haven't been playing Blackops for about 15mins now? lol.

[heavywater]

Looking good so far however is it worth taking note that i haven't been playing Blackops for about 15mins now? lol.
That's because it's a saved png hosted on a image sharing site, still messing with the dynamic version. :p

What do you want in the place of the game banner when you're not online/ingame?

[Oscar99]

Just default so the Groups i'm in. - just pretty much similar to what i have already but just a different background really lol.

You able to edit the font & size used for my name? (see below)

[heavywater]

You able to edit the font & size used for my name? (see below)
I can in theory but it requires me uploading the font file to the root. As long as it's not a paid for font I can't see any issues with it. Also I think I've used a slightly different font to you on the name (mine was Typograph Pro Light)

Groups should be doable if i can find where in the XML it stores them. :P

Anything else you want changed before I do a final tweak?


I'll upload the templates and php file when it's done so other people can have a fiddle with it.

[Oscar99]

Nope should be fine lol.

Font i used is a free font called "Asenine" : http://www.dafont.com/asenine.font

[heavywater]

I managed to get this going properly last night and now it's stopped again...

sig.php:

<?php
$steamid =$_GET['id'];

$xml = simplexml_load_file("http://steamcommunity.com/id/$steamid?xml=1");

// Resize avatar
$filename = $xml->avatarFull;

header('Content-type: image/jpeg');

list($width, $height) = getimagesize($filename);
$new_width = 96;
$new_height = 96;

$avatar = imagecreatetruecolor($new_width, $new_height);
$image = imagecreatefromjpeg($filename);
imagecopyresampled($avatar, $image, 0, 0, 0, 0, $new_width, $new_height, $width, $height);
//

// Resize ingame logo
if($xml->onlineState == "in-game")
{
$filename = $xml->inGameInfo->gameLogo;

header('Content-type: image/jpeg');

list($width, $height) = getimagesize($filename);
$new_width = 120;
$new_height = 45;

$ingamelogo = imagecreatetruecolor($new_width, $new_height);
$image = imagecreatefromjpeg($filename);
imagecopyresampled($ingamelogo, $image, 0, 0, 0, 0, $new_width, $new_height, $width, $height);
}
//



// online/offline/ingame
if($xml->onlineState == "online")
{
$output = imagecreatefrompng("online.png");
$textcolour = imagecolorexact($output, 0, 115, 164);
$textblack = imagecolorexact($output, 0, 0, 0);
imagefttext($output, 8, 0, 143, 25, $textblack, "tahomabd.ttf", "Online");
imagefttext($output, 8, 0, 144, 24, $textcolour, "tahomabd.ttf", "Online");

}
elseif($xml->onlineState == "in-game")
{
$output = imagecreatefrompng("ingame.png");
$textblack = imagecolorexact($output, 0, 0, 0);
$textcolour = imagecolorexact($output, 0, 167, 71);
imagefttext($output, 8, 0, 143, 25, $textblack, "tahomabd.ttf", "In-Game");
imagefttext($output, 8, 0, 144, 24, $textcolour, "tahomabd.ttf", "In-Game");
imagefttext($output, 8, 0, 143, 37, $textblack, "tahoma.ttf", $xml->inGameInfo->gameName);
imagefttext($output, 8, 0, 144, 36, $textcolour, "tahoma.ttf", $xml->inGameInfo->gameName);
imagecopy($output, $ingamelogo, 144, 68, 0, 0, 120, 45);
}
else
{
$output = imagecreatefrompng("offline.png");
$textblack = imagecolorexact($output, 0, 0, 0);
$textcolour = imagecolorexact($output, 100, 100, 100);
imagefttext($output, 8, 0, 143, 25, $textblack, "tahomabd.ttf", "Offline");
imagefttext($output, 8, 0, 144, 24, $textcolour, "tahomabd.ttf", "Offline");
}

//Place static text
if($xml->onlineState != "in-game")
{
imagefttext($output, 8, 0, 143, 75, imagecolorexact($output, 0, 0, 0), "tahoma.ttf", "Groups");
imagefttext($output, 8, 0, 144, 74, imagecolorexact($output, 100, 100, 100), "tahoma.ttf", "Groups");
}
imagefttext($output, 8, 0, 315, 75, imagecolorexact($output, 0, 0, 0), "tahoma.ttf", "Favourite Games");
imagefttext($output, 8, 0, 316, 74, imagecolorexact($output, 100, 100, 100), "tahoma.ttf", "Favourite Games");


// place avatar
imagecopy($output, $avatar, 17, 17, 0, 0, 96, 96);
//

// SteamID
//imagefttext($output, 8, 0, 144, 24, $textcolour, "tahomabd.ttf", $xml->steamID);
//

// Most played games
$listnum = 1;
foreach($xml->mostPlayedGames->mostPlayedGame as $mostPlayedGame)
{
if($listnum == 1)
{
$gameicon = imagecreatefromjpeg($mostPlayedGame->gameIcon);
imagecopy($output, $gameicon, 316, 80, 0, 0, 32, 32);
}
elseif($listnum == 2)
{
$gameicon = imagecreatefromjpeg($mostPlayedGame->gameIcon);
imagecopy($output, $gameicon, 364, 80, 0, 0, 32, 32);
}
else
{
$gameicon = imagecreatefromjpeg($mostPlayedGame->gameIcon);
imagecopy($output, $gameicon, 412, 80, 0, 0, 32, 32);
}

imagedestroy($gameicon);
$listnum++;
}

// Groups
if($xml->onlineState != "in-game")
{
$listnum = 1;
foreach($xml->groups->group as $groups)
{
if($listnum == 1)
{
$gameicon = imagecreatefromjpeg($groups->avatarIcon);
imagecopy($output, $gameicon, 144, 80, 0, 0, 32, 32);
}
elseif($listnum == 2)
{
$gameicon = imagecreatefromjpeg($groups->avatarIcon);
imagecopy($output, $gameicon, 192, 80, 0, 0, 32, 32);
}
else
{
$gameicon = imagecreatefromjpeg($groups->avatarIcon);
imagecopy($output, $gameicon, 240, 80, 0, 0, 32, 32);
}

imagedestroy($gameicon);
$listnum++;
}
}

header('Content-Type: image/png');
imagepng($output);

imagedestroy($avatar);
imagedestroy($output);
imagedestroy($ingamelogo);
?>

Sigs are then generated by going to folder/sig.php?id=yourid. This will create a php png document at this address which should be linkable to. Only trouble is that it just seems to error at the moment and I can't see anything glaringly wrong in the code...

Oh wait, fixed it. Doesn't seem to work proeprly for some IDs though, I'll have a look into why later.

In the meantime:

http://www.blipdesign.co.uk/steamsigthing/image.php?id=oscar99

Using Asenine for the dynamic text doesn't work unfortunately Oscar, it's too thin and just ends up as a mess of unreadable pixels.

[Peter]

The errors are probably to do with the fact that you're setting lots of different headers when you don't need to, do you understand what the header is used for? :p

I'll try and write something later which uses mod_rewrite and proper headers to sort it out.

[heavywater]

The errors are probably to do with the fact that you're setting lots of different headers when you don't need to, do you understand what the header is used for? :p
Nope, I'm not a coder. :D

Anyway, works perfectly now, just won't accept profiles which are set to non-public in the XML. Probably not much point in mod rewrite either, using $_GET means you could dynamically change background/placement/username easier I'm guessing.

Unless you've got unlimited bandwidth though it's probably not a great idea, having each person that views each of your posts in each topic pulling a 100kb png of your site is going to add up pretty pronto.

[Peter]

Nope, I'm not a coder. :D

Anyway, works perfectly now, just won't accept profiles which are set to non-public in the XML.

While this isn't an accurate description of all headers (that would be a bit over the top for this), in this case, the header is dictating the output format of the document. So you should never be setting image/jpg at one point and image/png further down, it's one or the the other.

Browsers can get confused by multiple content type headers.

[heavywater]

While this isn't an accurate description of all headers (that would be a bit over the top for this), in this case, the header is dictating the output format of the document. So you should never be setting image/jpg at one point and image/png further down, it's one or the the other.

Browsers can get confused by multiple content type headers.
Ah right, thought I had to set the header whenever I was pulling in a different filetype. So can you resize a jpg image under a png header?

[Smifis]

I'm sure you could do that under a pdf header if you wish. :lol:

headers are what is sent to to browser, and these tells (or at least suggests) how the browser should view the file.

[Peter]

Ah right, thought I had to set the header whenever I was pulling in a different filetype. So can you resize a jpg image under a png header?

Yes but the final output should be a PNG image in that case. The script doesn't actually care about the header, it's the browser that interprets that, and it's your script doing the manipulation of the images.

[heavywater]

Ah right. First time I've set eyes on GD. :D

[Peter]

Ah right. First time I've set eyes on GD. :D

Have given thanks and +Rep for the code as I'm very impressed if that's the first time you've touched GD.

I've written a bit of a more complex one using your code as a base (the positionings and images etc.). This one can handle being passed a proper steam ID (like STEAM_0:1:1234), a community ID (the big long number) or a community name (like Oscar99).

It can also handle multiple other scenarios:
- Will error on private or non-existant profiles
- Can compensate for the user having less than 3 groups or less than 3 most played games
- Can compensate for the user not having an avatar
- Will always show the user's primary group in the list of groups

It also uses cURL to fetch all of the images and data as most web hosts don't allow URL fopen() to be used. Individual images (avatars, game icons) are also cached forever to speed up loading of future images (at the cost of disk space).

Haven't fully tested it so there may be a few cases where it can break, but whatever.


http://www.truhost.co.uk/steam/steam_csspeter.pnghttp://www.truhost.co.uk/steam/steam_csspeter.png


http://www.truhost.co.uk/steam/steam_STEAM_0:0:23568657.pnghttp://www.truhost.co.uk/steam/steam_STEAM_0:0:23568657.png


http://www.truhost.co.uk/steam/steam_76561198007403042.pnghttp://www.truhost.co.uk/steam/steam_76561198007403042.png


<?php

error_reporting(0);

class Steam_Signature {

var $community_id;
var $xml_data = false;
var $profile_data = array();
var $fonts = array(
'steam_id' => 'ASENW___.ttf',
'status' => 'tahomabd.ttf'
);
var $config_opts = array(
'av_width' => 96,
'av_height' => 96,
'logo_width' => 120,
'logo_height' => 45,
);
var $game_images = array();
var $ingame_image;
var $avatar_image;
var $sig_image;

function Steam_Signature($input) {
if (preg_match('/^STEAM_0:[01]:[0-9]+$/', $input)) {
// They entered a STEAM ID, calculate the community id
$input = str_replace('STEAM_0:', '', $input);
$input = explode(':', $input);
// Calculate it and do a nasty hack so PHP doesn't put it in float format and ruin everything
$this->community_id = bcadd(bcadd(bcmul((string) $input[1], "2"), (string) $input[0]), "76561197960265728");
}
else {
// They entered a community id already or a steam name
$this->community_id = urlencode($input);
}
}

public function setFont($key, $font) {
$this->fonts[$key] = $font;
}

public function processData() {
$this->getData();
if ($this->xml_data === false || count($this->xml_data->error) > 0 || count($this->xml_data->privacyMessage) > 0) {
header('Content-Type: image/png');
readfile('images/error.png');
die();
}
else {
$this->profile_data['name'] = (string) $this->xml_data->steamID;
$this->profile_data['avatar_url'] = (string) $this->xml_data->avatarFull;
$this->profile_data['status'] = (string) $this->xml_data->onlineState;
$this->profile_data['community_id'] = (string) $this->xml_data->steamID64;
if ($this->profile_data['status'] == "in-game") {
$this->profile_data['game_data']['name'] = (string) $this->xml_data->inGameInfo->gameName;
$this->profile_data['game_data']['logo'] = (string) $this->xml_data->inGameInfo->gameLogo;
}
else {
$this->profile_data['game_data'] = false;
}
$i = 0;
$this->profile_data['most_played'] = array();
if (count($this->xml_data->mostPlayedGames->mostPlayedGame) > 0) {
foreach ($this->xml_data->mostPlayedGames->mostPlayedGame as $thisGame) {
$this->profile_data['most_played'][$i]['name'] = (string) $thisGame->gameName;
$this->profile_data['most_played'][$i]['icon'] = (string) $thisGame->gameIcon;
$i++;
}
}
$this->profile_data['groups'] = array();
if (count($this->xml_data->groups->group) > 0) {
$i = 1;
foreach ($this->xml_data->groups->group as $thisGroup) {
// Hack to make sure primary group is always shown
$tempAtt = $thisGroup->attributes();
$j = ($tempAtt['isPrimary'] == 1) ? 0 : $i;
$this->profile_data['groups'][$j]['name'] = (string) $thisGroup->groupName;
$this->profile_data['groups'][$j]['icon'] = (string) $thisGroup->avatarIcon;
$i++;
}
}
}
}

private function getData() {
$ch = curl_init();
curl_setopt($ch, CURLOPT_RETURNTRANSFER, 1);
curl_setopt($ch, CURLOPT_TIMEOUT, 5);
curl_setopt($ch, CURLOPT_HEADER, 0);
if (preg_match('/^[0-9]{17,}$/', $this->community_id)) {
curl_setopt($ch, CURLOPT_URL, "http://steamcommunity.com/profiles/{$this->community_id}?xml=1");
}
else {
curl_setopt($ch, CURLOPT_URL, "http://steamcommunity.com/id/{$this->community_id}?xml=1");
}
$this->xml_data = simplexml_load_string(curl_exec($ch));
curl_close($ch);
}

public function setupSig() {
// Setup avatar
$this->avatar_image = imagecreatetruecolor($this->config_opts['av_width'], $this->config_opts['av_height']);
$temp = $this->imageJpgUrl((empty($this->profile_data['avatar_url'])) ? 'images/unknown_large.jpg' : $this->profile_data['avatar_url']);
imagecopyresampled($this->avatar_image, $temp, 0, 0, 0, 0, $this->config_opts['av_width'], $this->config_opts['av_height'], imagesx($temp), imagesy($temp));
imagedestroy($temp);

// Setup ingame logo
if ($this->profile_data['status'] == "in-game") {
$this->ingame_image = imagecreatetruecolor($this->config_opts['logo_width'], $this->config_opts['logo_height']);
$temp = $this->imageJpgUrl((!isset($this->profile_data['game_data']['logo']) || empty($this->profile_data['game_data']['logo'])) ? 'images/unknown_small.jpg' : $this->profile_data['game_data']['logo']);
imagecopyresampled($this->ingame_image, $temp, 0, 0, 0, 0, $this->config_opts['logo_width'], $this->config_opts['logo_height'], imagesx($temp), imagesy($temp));
imagedestroy($temp);
}
else {
$this->ingame_image = false;
}

// Create base image
$this->createBaseImage();

// Setup groups
if ($this->profile_data['status'] != "in-game") {
$xval = 144;
for ($i = 0; $i < 3; $i++) {
if (isset($this->profile_data['groups'][$i])) {
$temp = $this->imageJpgUrl((empty($this->profile_data['groups'][$i]['icon'])) ? 'images/unknown_small.jpg' : $this->profile_data['groups'][$i]['icon']);
}
else {
$temp = $this->imageJpgUrl('images/unknown_small.jpg');
}
imagecopy($this->sig_image, $temp, $xval, 80, 0, 0, 32, 32);
imagedestroy($temp);
$xval += 48;
}
}
else {
imagecopy($this->sig_image, $this->ingame_image, 144, 68, 0, 0, $this->config_opts['logo_width'], $this->config_opts['logo_height']);
imagedestroy($this->ingame_image);
}

// Setup most played games
$xval = 316;
for ($i = 0; $i < 3; $i++) {
if (isset($this->profile_data['most_played'][$i]['icon'])) {
$temp = $this->imageJpgUrl((empty($this->profile_data['most_played'][$i]['icon'])) ? 'images/unknown_small.jpg' : $this->profile_data['most_played'][$i]['icon']);
}
else {
$temp = $this->imageJpgUrl('images/unknown_small.jpg');
}
imagecopy($this->sig_image, $temp, $xval, 80, 0, 0, 32, 32);
imagedestroy($temp);
$xval += 48;
}

// Add player name, create a bounding box to calculate positioning
$player_name_bbox = imagettfbbox(25, 0, 'fonts/'.$this->fonts['steam_id'], $this->profile_data['name']);
// TTF fonts are added using lower left corner of the box (roughly)
$this->dropShadow($this->sig_image, 25, 0, 460 - 10 - abs($player_name_bbox[0] - $player_name_bbox[2]), 10 + abs($player_name_bbox[7] - $player_name_bbox[1]), $this->font_colours['white'], $this->fonts['steam_id'], $this->profile_data['name'], 1, 1, $this->font_colours['black']);

// Add avatar
imagecopy($this->sig_image, $this->avatar_image, 17, 17, 0, 0, $this->config_opts['av_width'], $this->config_opts['av_height']);
imagedestroy($this->avatar_image);

$this->addTextToImage();
}

private function addTextToImage() {
if ($this->profile_data['status'] == "online") {
$this->dropShadow($this->sig_image, 10, 0, 144, 26, $this->font_colours['online'], "tahomabd.ttf", "Online", 1, 1, $this->font_colours['black']);
}
elseif ($this->profile_data['status'] == "in-game") {
$this->dropShadow($this->sig_image, 10, 0, 144, 26, $this->font_colours['ingame'], "tahomabd.ttf", "In-Game", 1, 1, $this->font_colours['black']);
$this->dropShadow($this->sig_image, 10, 0, 144, 42, $this->font_colours['ingame'], "tahomabd.ttf", $this->profile_data['game_data']['name'], 1, 1, $this->font_colours['black']);
}
else {
$this->dropShadow($this->sig_image, 10, 0, 144, 26, $this->font_colours['offline'], "tahomabd.ttf", "Offline", 1, 1, $this->font_colours['black']);
}
if ($this->profile_data['status'] != "in-game") {
$this->dropShadow($this->sig_image, 8, 0, 143, 74, $this->font_colours['offline'], "tahomabd.ttf", "Groups", 1, 1, $this->font_colours['black']);
}
$this->dropShadow($this->sig_image, 8, 0, 315, 74, $this->font_colours['offline'], "tahomabd.ttf", "Favourite Games", 1, 1, $this->font_colours['black']);
}

private function createBaseImage() {
if ($this->profile_data['status'] == "online") {
$this->sig_image = imagecreatefrompng((file_exists('images/'.$this->profile_data['community_id'].'_online.png')) ? 'images/'.$this->profile_data['community_id'].'_online.png' : 'images/default_online.png');
}
elseif ($this->profile_data['status'] == "in-game") {
$this->sig_image = imagecreatefrompng((file_exists('images/'.$this->profile_data['community_id'].'_ingame.png')) ? 'images/'.$this->profile_data['community_id'].'_ingame.png' : 'images/default_ingame.png');
}
else {
$this->sig_image = imagecreatefrompng((file_exists('images/'.$this->profile_data['community_id'].'_offline.png')) ? 'images/'.$this->profile_data['community_id'].'_offline.png' : 'images/default_offline.png');
}
$this->font_colours = array(
'black' => imagecolorallocate($this->sig_image, 0, 0, 0),
'white' => imagecolorallocate($this->sig_image, 255, 255, 255),
'online' => imagecolorallocate($this->sig_image, 0, 150, 215),
'offline' => imagecolorallocate($this->sig_image, 130, 130, 130),
'ingame' => imagecolorallocate($this->sig_image, 0, 210, 90),
);
}

private function dropShadow($image, $size, $angle, $x, $y, $colour, $fontfile, $text, $offset_x, $offset_y, $shadow_colour) {
imagettftext($image, $size, $angle, $x + $offset_x, $y + $offset_y, $shadow_colour, 'fonts/'.$fontfile, $text);
imagettftext($image, $size, $angle, $x, $y, $colour, 'fonts/'.$fontfile, $text);
}

public function outputImg() {
header("Cache-Control: no-cache");
header("Pragma: no-cache");
header('Content-Type: image/png');
imagepng($this->sig_image);
die();
}

private function imageJpgUrl($filename) {
if (strpos($filename, 'http://') === false) {
return imagecreatefromjpeg($filename);
}
$fn = md5($filename);
if (file_exists('temp/'.$fn)) {
return imagecreatefromjpeg('temp/'.$fn);
}
$ch = curl_init($filename);
$fh = fopen('temp/'.$fn, "w");
curl_setopt($ch, CURLOPT_HEADER, 0);
curl_setopt($ch, CURLOPT_BINARYTRANSFER, 1);
curl_setopt($ch, CURLOPT_RETURNTRANSFER, 1);
$img_data = curl_exec($ch);
curl_close($ch);
fwrite($fh, $img_data);
fclose($fh);
return imagecreatefromjpeg('temp/'.$fn);
}
}

if (!isset($_GET['steamid']) || empty($_GET['steamid'])) {
die("Steam ID not found.");
}

$thisSig = new Steam_Signature($_GET['steamid']);
$thisSig->processData();
$thisSig->setupSig();
$thisSig->outputImg();

?>

[heavywater]

Much nicer. :D

[Oscar99]

These are amazing guys & appreciate the time that has went into this!

but can someone explain to a noob like me how one changes the background? & then implement that into a signature?

I want to touch very little code as possible :D

[Smifis]

Relative to the root of the script,

images/default_online.png (http://www.truhost.co.uk/steam/images/default_online.png)
images/default_ingame.png (http://www.truhost.co.uk/steam/images/default_ingame.png)
images/default_offline.png (http://www.truhost.co.uk/steam/images/default_offline.png)

[heavywater]

PNGs with transparency if anyone wants them as a template. :p

Ingame
http://i51.tinypic.com/a172vm.png

Offline
http://i56.tinypic.com/ioqfzm.png

Online
http://i52.tinypic.com/10xugrl.png

[Peter]

Might incorporate those and allow upload of proper backgrounds. Maybe tomorrow.

[Oscar99]

im ready to get cracking with making some epic backgrounds however still a little confused how i start :)

I make the background - but how do i like incorporate the code, Smifis has said a little bit but i'm slightly baffled.

[SilveR_172]

Looking awesome
If i send my steam ID to one of you guys will you do me one ?

[Peter]

im ready to get cracking with making some epic backgrounds however still a little confused how i start :)

I make the background - but how do i like incorporate the code, Smifis has said a little bit but i'm slightly baffled.

If you wait until I do what I said in the post, you'll be able to sign in with your Steam ID and then upload a background for yourself.

[heavywater]

im ready to get cracking with making some epic backgrounds however still a little confused how i start :)

I make the background - but how do i like incorporate the code, Smifis has said a little bit but i'm slightly baffled.
You'll basically need the entire code that Peter listed, running on a server somewhere. The code will pull the user data (online state/games played/groups/username etc) from the XML stream or steam profile and use php and GD to arrange it in place and convert it into an image. The backgrounds are currently just links in the PHP so to change them you'd have to create a new one, overlay the placement templates and upload into the directory the PHP is running from.

Although if Peter sorts out a system that lets you upload your own background it'll do it all automatically. :D

[Peter]

Ok, the system doesn't look nice, but it seems to work.

http://www.truhost.co.uk/steam/

Use the Sign in with Steam option, sign in with your Steam account and you can upload a custom background for use in your signature. The image must be PNG and the correct dimensions. You don't need to worry about putting the overlays on because the script will do that itself, it has also been modded to support full PNG-24 alpha transparency.

The web server also tells your browser to cache the image for 15 minutes to reduce server load a bit.

Proof of alpha transparency working with a custom background:
http://www.truhost.co.uk/steam/steam_76561197975792040.png

[Oscar99]

Yes it works!

Amazing!


http://www.truhost.co.uk/steam/steam_76561198007403042.png

[Sarky]

Ok, the system doesn't look nice, but it seems to work.

http://www.truhost.co.uk/steam/

Use the Sign in with Steam option, sign in with your Steam account and you can upload a custom background for use in your signature. The image must be PNG and the correct dimensions. You don't need to worry about putting the overlays on because the script will do that itself, it has also been modded to support full PNG-24 alpha transparency.

The web server also tells your browser to cache the image for 15 minutes to reduce server load a bit.

Proof of alpha transparency working with a custom background:
http://www.truhost.co.uk/steam/steam_76561197975792040.png
Wow that's really good!

Been trying to get a background the right dimentions, but requires some photoshopping. Anyone care to try to get this image to the correct size? The aspect ratio goes horrible if I try to crop it and stuff.

http://cloud.steampowered.com/ugc/558652148414530995/E574DF2752BDBF4F8A07AE4E40EB31B450A2F9E6/

(Yes, its my screenshot :D)

Ideally I think I should have taken the image so it was a bit wider....with the car less in the foreground and further back. Meh, what can you guys do? :D

[Peter]

Wow that's really good!

Been trying to get a background the right dimentions, but requires some photoshopping. Anyone care to try to get this image to the correct size? The aspect ratio goes horrible if I try to crop it and stuff.

http://cloud.steampowered.com/ugc/558652148414530995/E574DF2752BDBF4F8A07AE4E40EB31B450A2F9E6/

(Yes, its my screenshot :D)

Ideally I think I should have taken the image so it was a bit wider....with the car less in the foreground and further back. Meh, what can you guys do? :D
How's this?

http://www.truhost.co.uk/sarky.png

[Oscar99]

http://img546.imageshack.us/img546/9113/98750915.png

Moved the car further to the left & brushed more of the terrain in as best as i could.

[Sarky]

Thanks guys!


How's this?

http://www.truhost.co.uk/sarky.png
This looked the best when uploaded, Oscar on yours the car was mostly blocked by my avatar :/. Cheers though!

[Smifis]

SICK!!

[Oscar99]

completely forgot about the avatar Lol

these signatures are looking awesome :P

[SilveR_172]

http://www.truhost.co.uk/steam/steam_STEAM_0:1:17900922.png

so is there a way i can change the background on that truhost sig thing ?

[Smifis]

I would like to quote...
Ok, the system doesn't look nice, but it seems to work.

http://www.truhost.co.uk/steam/

Use the Sign in with Steam option, sign in with your Steam account and you can upload a custom background for use in your signature. The image must be PNG and the correct dimensions. You don't need to worry about putting the overlays on because the script will do that itself, it has also been modded to support full PNG-24 alpha transparency.

The web server also tells your browser to cache the image for 15 minutes to reduce server load a bit.

Proof of alpha transparency working with a custom background:
http://www.truhost.co.uk/steam/steam_76561197975792040.png

[SilveR_172]

Wow you broke your dare :P

[Smifis]

I got bored after 6 hours :lol: