You are not logged in.
#1 21 Jul 2006 4:25 pm
- Butcher
- Moderator
- From: Norway
- Registered: Jul 2006
- Posts: 308
BF2 Rank
Hi, loving this site, wish I understood more though. I didn't get the answer I needed from the post made by Quaker, so I decided to make my own.
Here goes: I downloaded the bf2rank file, but how do I use it? Do I just upload it to my site? I don't really understand where I am supposed to incert my rank, and for example add a username. Please help (maybe a readme would be useful ).
Offline
#2 21 Jul 2006 5:39 pm
Re: BF2 Rank
the bf2rank zip file contains the PHP code and images (as well as the font) used to generate the image.
in order for it to run, you need a webserver that allows use of GD and can run PHP. make sense?
unzip the contents of the file, and upload them to your server. say you owned foo.com, and uploaded the folder "bf2rank" to the main directory for your webserver so that you could access it from: foo.com/bf2rank
from there you'll be able to tell if it will work or not by typing in http://foo.com/bf2rank/index.php?nick=[oink]_madhatter just like that. if noting comes up, then you probably dont have GD (the graphics drawing library used in the code). if it prints a bunch of code, then you probably dont have a server capable of processing php code.
you dont insert your rank into the image. the php code gets that data directly from EA using your player id (which I look up from EA if you use your player nick). you insert your name in the url.
the mod I started on on this site (I havent put it in here at the post level yet...) that lets you put your bf2 player name on your profile here. then when you view your profile the rank shows up (pretty useless really). if you click on my name you'll see what I mean.
a fairly common problem with inserting the image in most forums is, that they require anything inside the [img] tag to end in .jpg or .gif, or whatever. to get around that you can tack on &avatar.jpg to the end of the url like so:
http://sanity-free.org/bf2rank/?nick=[oink]_madhatter&score&avatar.jpg
it really doesnt matter what you add to the end as long as it ends in .jpg (but it must begin w/ an & sign).
if you just want to get the image from this site, I've added aliasing so that you can get the image by the following url:
http://sanity-free.org/avatar/nick/<your player name>/<image name>
where "<your player name>" is replaced with your bf2 nick and "<image name>" is replaced with what image you want to use.
the possible images are:
score.jpg - shows the score
notext.jpg - displays the progress bar but no text or score
delta.jpg - shows the progress bar which starts at 0 with ever rank advancement like the in game progress bar does
score_delta.jpg
score_notext.jpg
delta_notext.jpg
and a few other combo's (dont know if i've covered them all).
you can also use your player id by replacing "nick" with pid in the above url and putting your player id where you nick is (everything else is the same).
hopefully I havent been too confusing.
Offline
#3 22 Jul 2006 1:40 am
- Butcher
- Moderator
- From: Norway
- Registered: Jul 2006
- Posts: 308
Re: BF2 Rank
No, it was very clear. Thanks, just need to find out if my host has GD enabled or not. My "plan" was to allow players to insert their PID, and then get the image up in the middle of the image with some cool graphics around (I've used it plainly the last weeks, with only the image given from this site).
Thanks again
Offline
#4 22 Jul 2006 7:07 am
- Butcher
- Moderator
- From: Norway
- Registered: Jul 2006
- Posts: 308
Re: BF2 Rank
Hmmm, both PHP and GD is enabled, and I put the entire bf2 rank folder in public_html, but when trying to access for example "http://www.bamboocommandos.com/bf2rank/index.php?nick==[BC]=Butcher", I get this: "Parse error: syntax error, unexpected T_PRIVATE, expecting ')' in /home/bamboo/public_html/bf2rank/index.php on line 49"...
Offline
#5 22 Jul 2006 1:31 pm
Re: BF2 Rank
try replacing your index.php with this one
I am working on another script that allows you to put in the player name and get at all the stats (instead of just pulling out the rank and score data). I havent merged the ranks, stats, and awards stuff yet, but I have it in a pretty raw form.
basically you'd pass in the players nick, and be able to get the stats info back from ea like:
$bf2_player = new bf2_player('=[BC]=Butcher');
$bf2_player.stats['scor'] would give you your global score and $bf2_player.stats['mvns'] would give you the name of your top victim.
if you'd be interested in that, you can use it and look at where I load up the image, and draw on it based on the info I pulled from ea, to give you an idea of how it works.
here is what it info it displays at the moment: http://sanity-free.org/bf2/?bf2nick==[BC]=Butcher&op=foo
the mapping of the "[name] => stat value" that shows up on that page is found here: http://bf2.fun-o-matic.org/index.php/Ge … fo_columns
Offline
#6 22 Jul 2006 3:20 pm
- Butcher
- Moderator
- From: Norway
- Registered: Jul 2006
- Posts: 308
Re: BF2 Rank
Didn't work replacing it, still get the error message .
I guess I technically understand how to input these things, just not where and how to align them. And are they perhaps made with Javascripts?
I'm not really good, not even useful with HTML, Scripting or Coding yet, but I'm working on it. At least I got a basic rank bar like I wanted .
I will upload it and see how it works, I hope you didn't mind, but I added you on the "credits" list, since you made the script, and hotlinked to this domain.
Here you can see the "temporary" result, if I could manage to extend the picture and info, that would be cool, but for now, I like it
Personal Rank (if I ever get it "perfected", I might even make it downloadable from the site, so people can use it themselves).
Offline
#7 22 Jul 2006 6:41 pm
Re: BF2 Rank
this is going to be a pretty long post (I apologize in advance. feel free to skip whatever you want ).
sorry its not working. make sure to upload everything that was in the zip (the font, the images and all), as those are used to generate the image. you're free to use the one off this site as much as you want. credit isn't required, but it is appreciated.
there are 2 types of scripts on the web: "client side" and "server side" scripts. they're called that because of where they run. client side scripts (like java script) is code that is downloaded from the webserver, and ran in your browser. server side script is ran on the server.
A little background info that may or may not be useful is how everything works.
when you type in an internet address $m[1]www.internet.com/index.html) or click on a link, your browser uses a special language to talk to web servers which are publicly accessible. it sends the link which contains a bunch of information. this link is called a url. a url consists of the protocol specifier, the endpoint, and sometimes things like a request file and other parameters.
http:// is the protocol being used$m[1]www.internet.com is the endpoint on the internet. this gets translated to an IP address and port (using a domain name server or DNS server)
index.html is a file that is supposed to be on the server.
when thats sent to the web server, it checks its file system and looks for the file thats been requested. some files are static files, meaning they are not "processed" they're just sent as is. these "static pages" can contain executable code that is read, and processed back in your browser when it gets the page from the web server. these types of files are referred to as static pages, and that type of script is referred to as "client side" scripts, and are typically written in "java script".
some pages are opend up and processed back at the server before it gets sent to the browser. those types of pages are called "dynamic pages," and are processed by the server with what are called "server side" scripts. server side script code is never sent to the browser to be processed. typically what is generated is some sort of file, like html or (in this case) an image.
along with the file name, you can also send name value parameters that look like nick=me, something=something else and so on. these parameters are tacked on to the end of the file, and start w/ a question mark, and are seperated with the ampersand sign "&". when you have dynamic pages, those parameters can be read in the server side script and are used to make the script do one thing or another. in the case of this rank avatar, your name, and how you want the image are passed in like this. score, delta, and no_text are also these types of parameters, only they arent assigned to anything (I just look to see if anyone put them in the url to determine whether I add the text, or show the progress bar one way or the other).
in this script, I request a page from EA's stat servers in the exact same way that the bf2 game does it in the BFHQ tab.
I'll walk through whats going on.
typical programming languages like C, C++, and C# have whats known as a "pre-processor." all a preprocessor does is replace text in a text file before it compiles it. in C++ you can declare something that looks like a variable, that just gets replaced before its compiled. you do this in C and C++ by the following code:
#define SOME_NAME itsvalue
then in your code you can use it:
if(someVariable == SOME_VALUE)
which is an expression used for testing conditions... you could type in "itsvalue" inside the if statement, but the "#define" allows you to use text that makes more sense when you look at it.
php is written in C and borrows a lot from it style wise.
in my script I define a few items (which make it easier to edit when things change:
Code:
define('PERCENT', 100); define('PRIVATE', 0); define('PRIVATE_FIRST_CLASS', 1); define('LANCE_CORP', 2); define('CORPORAL', 3); define('SERGANT', 4); define('STAFF_SERGANT', 5); define('GUNNERY_SERGANT', 6); define('MASTER_SERGANT', 7); define('FIRST_SERGANT', 8); define('MASTER_GUNNERY_SERGANT', 9); define('SERGEANT_MAJOR', 10); define('SERGEANT_MAJOR_OF_CORPS', 11); define('SECOND_LIEUTENANT', 12); define('FIRST_LIEUTENANT', 13); define('CAPTAIN', 14); define('MAJOR', 15); define('LIEUTENANT_COLONEL', 16); define('COLONEL', 17); define('BRIGADIER_GENERAL', 18); define('MAJOR_GENERAL', 19); define('LIEUTENANT_GENERAL', 20); define('GENERAL', 21);
it looks a little different in PHP than it does in C but its the same concept. EA returns a number for your rank, where 0 is private, 1 is pvt first class, and so on. when I first wrote this script I didnt use the above code, I just use the values 0, 1, 2, 3 and so on. using the name PRIVATE makes it a little easier to read when I'm doing that part of the code.
next we have a little table that maps the rank (0, 1, 2, 3) to the score needed to get to that rank:
Code:
$ranks = array( PRIVATE => 0, PRIVATE_FIRST_CLASS => 150, LANCE_CORP => 500, CORPORAL => 800, SERGANT => 2500, STAFF_SERGANT => 5000, GUNNERY_SERGANT => 8000, MASTER_SERGANT => 20000, FIRST_SERGANT => 20000, MASTER_GUNNERY_SERGANT => 50000, SERGEANT_MAJOR => 50000, SERGEANT_MAJOR_OF_CORPS => 50000, SECOND_LIEUTENANT => 60000, FIRST_LIEUTENANT => 75000, CAPTAIN => 90000, MAJOR => 115000, LIEUTENANT_COLONEL => 125000, COLONEL => 150000, BRIGADIER_GENERAL => 180000, MAJOR_GENERAL => 180000, LIEUTENANT_GENERAL => 200000, GENERAL => 200000 );
this is a little more tricky to explain. There are 2 bits of Info I want from EA to do the avatar: score, and rank. in order to do the progress bar, I need to know what score you need to have to get to the next rank, so here I'm mapping the rank shown in caps: "NAME" to the score needed to get there: "=> number". the "NAME => VALUE" syntax, says NAME will be what we use to reference the VALUE.
the next bit of code is doing the actual http request to get your stats from EA and is a little more involved (and unimportant IMO). if you want to know more about this I'll explain it later.
Code:
// web request stuff require_once("http.php"); $query = "nick=NOTHING"; if(isset($_GET['pid'])) { $query = "pid=".$_GET['pid']; }else if(isset($_GET['nick'])) { $query = "pid=".get_pid($_GET['nick']); } $req = new http_class(); $req->timeout = 0; $req->data_timeout = 0; $req->user_agent="GameSpyHTTP/1.0"; // this is overkill I know but as of November 8 2005, EA requires this // entire query. If all columns are not present, nothing is returned $url = "http://BF2Web.gamespy.com/ASP/getplayerinfo.aspx?".$query."&info=per*,cmb*...
and then it pulls out those 2 pieces of into to $score and $rank_val
next I calculate the % completion:
Code:
switch ($rank_val) { case PRIVATE: { if($score == 0) { $next = 0; }else { $next = ($score / $ranks[PRIVATE_FIRST_CLASS]) * PERCENT; } }break; case PRIVATE_FIRST_CLASS: { $next = $std?($score / $ranks[LANCE_CORP]) * PERCENT : ((($score - $ranks[PRIVATE_FIRST_CLASS]) / ($ranks[LANCE_CORP] - $ranks[PRIVATE_FIRST_CLASS])) * PERCENT); }break; case LANCE_CORP: { $next = $std?($score / $ranks[CORPORAL]) * PERCENT : ((($score - $ranks[LANCE_CORP]) / ($ranks[CORPORAL] - $ranks[LANCE_CORP])) * PERCENT); }break; case CORPORAL: { $next = $std?($score / $ranks[SERGANT]) * PERCENT : ((($score - $ranks[CORPORAL]) / ($ranks[SERGANT] - $ranks[CORPORAL])) * PERCENT); }break; case SERGANT: { $next = $std?($score / $ranks[STAFF_SERGANT]) * PERCENT : ((($score - $ranks[SERGANT]) / ($ranks[STAFF_SERGANT] - $ranks[SERGANT])) * PERCENT); }break; case STAFF_SERGANT: { $next = $std?($score / $ranks[GUNNERY_SERGANT]) * PERCENT : ((($score - $ranks[STAFF_SERGANT]) / ($ranks[GUNNERY_SERGANT] - $ranks[STAFF_SERGANT])) * PERCENT); }break; case GUNNERY_SERGANT: { $next = $std?($score / $ranks[MASTER_SERGANT]) * PERCENT : ((($score - $ranks[GUNNERY_SERGANT]) / ($ranks[MASTER_SERGANT] - $ranks[GUNNERY_SERGANT])) * PERCENT); }break; case MASTER_SERGANT: { $next = $std?($score / $ranks[MASTER_GUNNERY_SERGANT]) * PERCENT : ((($score - $ranks[MASTER_SERGANT]) / ($ranks[MASTER_GUNNERY_SERGANT] - $ranks[MASTER_SERGANT])) * PERCENT); }break; case FIRST_SERGANT: { $next = $std?($score / $ranks[MASTER_GUNNERY_SERGANT]) * PERCENT : ((($score - $ranks[FIRST_SERGANT]) / ($ranks[MASTER_GUNNERY_SERGANT] - $ranks[FIRST_SERGANT])) * PERCENT); }break; case MASTER_GUNNERY_SERGANT: { $next = $std?($score / $ranks[SECOND_LIEUTENANT]) * PERCENT : ((($score - $ranks[MASTER_GUNNERY_SERGANT]) / ($ranks[SECOND_LIEUTENANT] - $ranks[MASTER_GUNNERY_SERGANT])) * PERCENT); }break; case SERGEANT_MAJOR: { $next = $std?($score / $ranks[SECOND_LIEUTENANT]) * PERCENT : ((($score - $ranks[SERGEANT_MAJOR]) / ($ranks[SECOND_LIEUTENANT] - $ranks[SERGEANT_MAJOR])) * PERCENT); }break; case SERGEANT_MAJOR_OF_CORPS: { $next = $std?($score / $ranks[SECOND_LIEUTENANT]) * PERCENT : ((($score - $ranks[SERGEANT_MAJOR_OF_CORPS]) / ($ranks[SECOND_LIEUTENANT] - $ranks[SERGEANT_MAJOR_OF_CORPS])) * PERCENT); }break; case SECOND_LIEUTENANT: { $next = $std?($score / $ranks[FIRST_LIEUTENANT]) * PERCENT : ((($score - $ranks[SECOND_LIEUTENANT]) / ($ranks[FIRST_LIEUTENANT] - $ranks[SECOND_LIEUTENANT])) * PERCENT); }break; case FIRST_LIEUTENANT: { $next = $std?($score / $ranks[CAPTAIN]) * PERCENT : ((($score - $ranks[FIRST_LIEUTENANT]) / ($ranks[CAPTAIN] - $ranks[FIRST_LIEUTENANT])) * PERCENT); }break; case CAPTAIN: { $next = $std?($score / $ranks[MAJOR]) * PERCENT : ((($score - $ranks[CAPTAIN]) / ($ranks[MAJOR] - $ranks[CAPTAIN])) * PERCENT); }break; case MAJOR: { $next = $std?($score / $ranks[LIEUTENANT_COLONEL]) * PERCENT : ((($score - $ranks[MAJOR]) / ($ranks[LIEUTENANT_COLONEL] - $ranks[MAJOR])) * PERCENT); }break; case LIEUTENANT_COLONEL: { $next = $std?($score / $ranks[COLONEL]) * PERCENT : ((($score - $ranks[LIEUTENANT_COLONEL]) / ($ranks[COLONEL] - $ranks[LIEUTENANT_COLONEL])) * PERCENT); }break; case COLONEL: { $next = $std?($score / $ranks[BRIGADIER_GENERAL]) * PERCENT : ((($score - $ranks[COLONEL]) / ($ranks[BRIGADIER_GENERAL] - $ranks[COLONEL])) * PERCENT); }break; case BRIGADIER_GENERAL: { $next = $std?($score / $ranks[LIEUTENANT_GENERAL]) * PERCENT : ((($score - $ranks[BRIGADIER_GENERAL]) / ($ranks[LIEUTENANT_GENERAL] - $ranks[BRIGADIER_GENERAL])) * PERCENT); }break; case MAJOR_GENERAL: { $next = $std?($score / $ranks[LIEUTENANT_GENERAL]) * PERCENT : ((($score - $ranks[MAJOR_GENERAL]) / ($ranks[LIEUTENANT_GENERAL] - $ranks[MAJOR_GENERAL])) * PERCENT); }break; case LIEUTENANT_GENERAL: { $next = $std?($score / $ranks[GENERAL]) * PERCENT : ((($score - $ranks[LIEUTENANT_GENERAL]) / ($ranks[GENERAL] - $ranks[LIEUTENANT_GENERAL])) * PERCENT); }break; case GENERAL: { $next = 100; }break; default: $next = -1; break; }
which can really be replaced with the following couple lines of code:
Code:
if($score == 0) { $next = 0; }else { $next = $std?($score / $ranks[$rank_val + 1]) * PERCENT : ((($score - $ranks[$rank_val]) / ($ranks[$rank_val + 1] - $ranks[$rank_val])) * PERCENT); }
there are 2 ways to display the progress: overall and isolated. overall progress shows your progress from right now till you reach your next rank. isolated starts out at 0 each time you advance in rank (which is how its shown in BF2's BF2HQ) and exponentially advances as you near the next rank score. this is what the &delta tacked on the end of the url for your rank image gets you.
the math is pretty simple:
"current score" / "next rank score" * 100 = overall progress
("current score" - "score for your current rank") / ("next rank's score" - "score of your current rank") * 100 = the progress shown as the difference between your score now and your next rank advancement.
now that I have your: 1. score, 2. rank, and 3. progress % its time to draw the image.
distributed in the zip file for download, is a bunch of images. we get the image for your rank by using the $rank_val pulled from EA, and the file name we know about:
Code:
$img_path = "./rank_".$rank_val.".jpg";
this is the path on the hard drive to the image we want (the string will look like: "./rank_6.jpg" after the above code is executed) and we load that file into on image object in PHP:
Code:
$img = imagecreatefromjpeg($img_path);
since we'll basically be drawing on top of this image like a school child does paper, we need to enable the alpha channel so the final image doesnt turn out black w/ the last thing we drew on it. thats done by:
Code:
imagealphablending($img, true);
we already have your progress % but now we need to draw a bar on the image that relates to that. our image is 80 pixels wide, and 80 pixels high, so we need to find how many pixels 80 * "your rank percentage" is since we're going to draw the progress across the entire width of the image. to do that we use:
Code:
$width = (($next / 100) * 74);
I used 74 instead of 80 because I pad the border 1 pixel, then draw a 1 pixel white border around as a frame, then I draw the actual progress bar 4 pixels in. 80 - 8 (4 pixels on either side) leaves us w/ 74 pixels to draw the progress in.
after that I create a few semi-transpartent colors that are used to draw a couple of rectangles ontop of the rank image. depending on if you want the score displayed, I write the score text on the image, then draw the progress bar. if "no_text" was in the url I skip writing out the text "Next Rank" or "Rank Delta".
the last bit of info is important in getting this to work. the original url requested a php file. we actually want an image, so we need to set some content type headers in the response the server sends back. since the file extension .php is a text file, the server sends back to the browser that it is getting a text file. we want to tell the server to tell the browser that its getting an image, and do so by setting the content-type header:
Code:
header("Content-type: image/jpeg");
then we send out the binary data of the image to the browser:
Code:
imagejpeg($img);
and clean up memory used to draw the image:
Code:
imagedestroy($img);
so thats it. hope that has been helpful. its not really rocket science, its a pretty simple little script. jeff on bf2s.com uses a colored html <div> to display your rank progress in a pretty similar way to drawing a rectangle on an image.
<div style="background-color: #000;" width="your % number here" /> is pretty easy and can be added to html pretty simply (if you had a php page that displayed the users stats instead of building the image).
Offline
#8 23 Jul 2006 3:41 am
- Butcher
- Moderator
- From: Norway
- Registered: Jul 2006
- Posts: 308
Re: BF2 Rank
Wow, thats a lot of info. It made some sense I guess, but not too much, probably cause I never done it before. But lemme see if I get this right, if I for example wanted to make a 200x200 image, then I would go on for example Dreamweaver, and in a table cell, use the picture as a bg image, then add code in the text on it, so it ultimately shows a picture with text on it?
I want to extend the current info on the Personal Rank thingy, to a bigger image with a little more info. But how could I make it so that people can enter their own PID and then get up their own info? And then have their browser save it as a cookiee, so they can just bookmark the page?
This seems a lot harder to me than it should, , but at least I learn something
Offline
#9 23 Jul 2006 8:52 pm
Re: BF2 Rank
if you just wanted a page that showed some of the players stats then yea, you're right on track. setting a cookie isnt necessary, you can add the players name to the url like bf2s or any other stats showing sites do. you can do this the same way you can link in to your rank avatar here (except you're will be a web page instead of an image) by adding a nick=name or pid=player id, in the url. if you wanted players to use that as their signature in forums then you'd need to write all that to an image like the avatar script does, but if you just wanted to display the stats then you're heading in the right direction, and would only need to change a few pieces of code to use the avatar script to do that. I never did a general stats page because there were already good sites that did that like bf2tracker and bf2s, I just wanted something I could use as my avatar on our clan's website.
Offline
#10 24 Jul 2006 2:27 am
- Butcher
- Moderator
- From: Norway
- Registered: Jul 2006
- Posts: 308
Re: BF2 Rank
Yeah, I tried some of the other trackers, but didn't like them at all. I just wanted to make it possible to insert PID in a box, and then get your score, rank, rankbar and name on a picture. I mainly made that little page of mine to test out some HTML.
Last edited by Butcher (24 Jul 2006 2:28 am)
Offline
#11 24 Jul 2006 12:46 pm
- Butcher
- Moderator
- From: Norway
- Registered: Jul 2006
- Posts: 308
Re: BF2 Rank
But say I wanted to make it possible for anyone to view their stats using my site, how would I do that? And how could I make it also show the player name on the top? Say I made a .png file that was 400 wide and 200 high, and I wanted it to show score, current rank (with symbol), progress bar (with percentage counter) and name, how would I do that? The whole Javascript is still quite confusing to me .
Offline
#12 24 Jul 2006 1:08 pm
Re: BF2 Rank
lets define the "scenario's" and "use case" for what you want to do and go from there.
scenario # 1
1. user comes to your site
2. user enters their name
3. user views his stats
4. user bookmarks that page
5. user comes back to view updated stats from bookmark
scenario # 2
1. user comes to your site
2. user enters their name
3. user sees an image on your site that they can link to (that contains all stat info)
4. user hot links to the image on your site, so it can be seen elsewhere
5. user book marks your page
6.1 user returns to your site to see an updated image of their stats
or
6.2 sees an updated version of that image from your site the next time they see the image any where else
with the first one, folks will be able to see their stats on your site, but wont be able to use it as a signature or avatar. with the second one, the will be able to see their stats both on your site, and anywhere else they link to that image from.
which scenario are you looking to do?
Offline
#13 24 Jul 2006 1:55 pm
- Butcher
- Moderator
- From: Norway
- Registered: Jul 2006
- Posts: 308
Re: BF2 Rank
Well, at first I was thinking about number 1, but since you mention it, I like number 2 as well, . When thinking about it I would like to do a combination, 1 where people can just see their stats immediatly, and 1 where they can get the picture they want. But if it is very hard making scenario number 2, then I'll stick with the original number 1.
Offline
#14 24 Jul 2006 2:34 pm
Re: BF2 Rank
difficult is a relative term. whats easy for one may be difficult for another. writing both the php and html is pretty easy for me, but it might not be for you. If you've never done any programming before it might be a little difficult to follow some of what has to happen.
If you wanted to trudge through it I can help. I'll do my best to explain things.
Offline
#15 24 Jul 2006 3:33 pm
- Butcher
- Moderator
- From: Norway
- Registered: Jul 2006
- Posts: 308
Re: BF2 Rank
Well, figuring I did understand a lot of your last explaining, after reading it 3 times, that would be great
Offline
#17 27 Jul 2006 1:29 am
Re: BF2 Rank
ok, I had a few seconds to set down and hack something quick up.
I did the first one (i'll show how to do the image stuff a little later, as thats a little more complicated).
Here's what I did (you can download the zip file and play with it if you'd like).
I like to seperate my server side code from my presentation layer (html). to do this, I created a very simple directory structure (as you can see in the download).
/bf2
/images
/style
/template
the /bf2 folder holds the small (and not finished mind you) stats class I started.
the /images folder just holds whatever images I want to have (like my progress image, and the rank images)
the /style folder holds my cascading style sheets (CSS files which are used to change the look of the page)
the /template folder has the html page. I've added simple tags like <global_score> which are not html (though it kind of looks that way in if you open up the index.tpl file).
you can create the template web page using a nice graphical designer (with dreamweaver you dont need to know much about html to do the template, so its a good tool to generate this part).
templates are just html pages. as you can see from the index.tpl I included, its just a standard page, nothing fancy.
now that the html is done its time to get the values to fill in. What we'll do is collect the data using my partially finished bf2_player class. that class really simplifies things.
Code:
// include the library include("bf2/bf2_player.php"); include("globals.php"); $bf2_player = new bf2_player($_GET['nick']);
we include the bf2_player.php file and a "globals" file that defines some constants & table mappings for "easy to use" referencing of rank names and how they map to the number that gets returned in from EA.
next I check to see if the nick we passed in when we created our bf2_player object is valid (meaning, did we find a player that matched?). if we did, then I get the values I wanted to place in my html page.
Code:
$player_name = $bf2_player->stats['nick']; $global_score = $bf2_player->stats['scor']; $rank = $bf2_player->stats['rank']; $player_rank_text = $rank_text_table[$rank]; $next_rank_text = $rank_text_table[$rank+1]; $progress = 0; if($global_score != 0) { $progress = ((($global_score - $rank_table[$rank]) / ($rank_table[$rank + 1] - $rank_table[$rank])) * PERCENT); }
a little something about the progress value. we'll get an error if we try to divide by 0, thats the reason for the: if(...) statement. $rank_table is a table that holds the score to rank score mappings. $rank is the 0 - 21 rank value that comes back from ea. the table maps in that 0-21 value to the score needed to get the next rank, and this was kind of covered in my other really long post.
now that we have the values we'll need to plug into our html page, all we do is open up the template file, and replace our custom "tags" with what needs to go in there.
Code:
$file_contents = file_get_contents('templates/index.tpl');
that opens up our template file and reads it contents to $file_constants variable.
Code:
$file_contents = str_replace('<player_name>', $player_name, $file_contents);
is repeated over and over (one for every "special tag" we put in the template). the convention is:
"result of replacement operation" = str_replace("value to replace", "value to replace it with", "string to search and replace with");
so for whatever tags you make (which map to a stat) you just need to add one of those replacement lines and presto... ready made stats pages.
here's a demo: h t t p://sanity-free.org/stats/?nick=[oink]_madhatter you can replace my name w/ yours to see your stats (and users would be able to replace their name too to see theirs).
here's the zip file that has all the code and images I used (please note that the progress bar image is referenced in the css file directly off my server. if you use it make sure to edit the url to yours, as I may not keep this one up).
I'm missing a lot of explaining how and whats all going on (i'm tired, and need to sleep), so feel free to ask whatever you want (no matter how stupid it may seem).
Last edited by MadHatter (21 Aug 2006 9:20 am)
Offline
#18 27 Jul 2006 4:51 am
- Butcher
- Moderator
- From: Norway
- Registered: Jul 2006
- Posts: 308
Re: BF2 Rank
Ok, this is sure going to sound stupid, but how exactly can I make it so that I get a input field that enters the given info into the url? For example: I write "=[BC]=Butcher" in the input field, and then it opens my stats as url=http://sanity-free.org/stats/?nick==[BC]=Butcher would've done.
Say I wanted to input it into the field where I currently have the stat image on this page, would I then paste the "index.php" into the table cell?
Did a few tests (woo, I'm smart), and I appearently have to place the html file inside the stats folder to make it work, guess that was pretty obvious, hehe. I guess the only real problem I have at the moment is making it like this (a guy in my clan suggested having the input box, and it's a good idea), but how does he bind the input field to the stats?
So, reviewing what I need:
1. Manage to bind an input field to the stats (why did that sound simpler than it is?)
2. Binding the information given by the file inside the table cell as mentioned.
What suprises me the most, is that this is all starting to make more and more sense! , you have no idea how glad I am that someone actually spares a few minutes to teach a poor fellow this, as everyone I know that has a slight idea what HTML or PHP is won't even bother to help me. Heck, even my own brother just started shouting "USER ERROR!" when I screwed up the feedback page, .
Last edited by Butcher (27 Jul 2006 5:48 am)
Offline
#19 27 Jul 2006 7:30 am
Re: BF2 Rank
the input box will do a http post. our code requires an http get (the difference between submitting a form, and entering an address in the url).
I added a template to my template folder (enterid.tpl) and changed my index.php file to look like this (to do the redirect to the url w/ the nick in it):
the enterid.tpl looks like this:
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=iso-8859-1" /> <title>BF2 Player Stats</title> </head> <body> <form id="form1" name="form1" method="post" action=""> Enter Your player name <input type="text" name="nick" /> <input type="hidden" name="op" value="bf2nick" /> <input type="submit" name="Submit" value="Submit" /> </form> </body> </html>
Code:
<?php // check for the name in the url if($_GET['nick']) { // include the library include("bf2/bf2_player.php"); include("globals.php"); $bf2_player = new bf2_player($_GET['nick']); if($bf2_player->is_valid_player) { $player_name = $bf2_player->stats['nick']; $global_score = $bf2_player->stats['scor']; $rank = $bf2_player->stats['rank']; $player_rank_text = $rank_text_table[$rank]; $next_rank_text = $rank_text_table[$rank+1]; $progress = 0; if($global_score != 0) { $progress = ((($global_score - $rank_table[$rank]) / ($rank_table[$rank + 1] - $rank_table[$rank])) * PERCENT); } // replace the html like tags we put in the template $file_contents = file_get_contents('templates/index.tpl'); $file_contents = str_replace('<player_name>', $player_name, $file_contents); $file_contents = str_replace('<global_score>', number_format($global_score), $file_contents); $file_contents = str_replace('<rank>', $rank, $file_contents); $file_contents = str_replace('<player_rank_text>', $player_rank_text, $file_contents); $file_contents = str_replace('<next_rank_text>', $next_rank_text, $file_contents); $file_contents = str_replace('<progress_percentage>', round($progress, 2), $file_contents); // print the final text out echo $file_contents; } } else if(isset($_POST['op']) && isset($_POST['nick'])) { $nick = $_POST['nick']; header("Location: http://sanity-free.org/stats/?nick=$nick"); exit(); } else { readfile("templates/enterid.tpl"); } ?>
so you can see the final result http://sanity-free.org/stats
Offline
#20 27 Jul 2006 8:30 am
- Butcher
- Moderator
- From: Norway
- Registered: Jul 2006
- Posts: 308
Re: BF2 Rank
Ok, update what I was supposed to update and uploaded everything. Though I got a problem, as usual:
Rank site, if you look there, you will probably noticed that I didn't manage to get it right into it. Allow me to explain my issue; The rank site is made of a rows within a table, all created in Dreamweaver, and the issue therefore comes to: What do I need to have inside a cell, to get the Input field to turn into the information gathered via the .php files?
I "assumed" it was the index.php, so I just copied all the content and pasted it within the table, but it ended up showing a lot of coding. I am basically not quite understanding what file or what code I need in the table, the table that shows the information from the name input in the input field.
Also, for some reason it did not use the .css file styles when I uploaded it...
Offline
#21 27 Jul 2006 9:33 am
Re: BF2 Rank
basically what you'll want to do is upload contents the stats folder (and all the folders in it and their contents) to your prank folder. the html file you're using right now then would become the .tpl file you'd use. you would use the index.php file to get the page as it looks now.
the page doesnt show up right (its just a quick hack up of your page), but this is basically what it would look like: http://sanity-free.org/stats/bbc.php (I used bbc.php instead of index.php just so mine keeps working, but you'd use the index.php and place the html for your page in the index.tpl file and where inner table w/ your image is right now you'd put the contents of the sample's body text.
as far as css files, I always put my css in another file and reference it. it speeds up page load time (because the browser can cache the style sheet and doesnt have to download all the styles everytime it loads the page. I modified my sample stylesheet so it would show up in your theme.
the basic precept with this is that, you can design the page however you want (you dont have to use any sample html I made). all you have to do is replace your special tags w/ their values in the .php file. the php file parses out your html, and spits out whats in it w/ the replaced values. what your html file looks like (and how you display the info you get from bf2_player.php) is totally up to you.
Offline
#22 27 Jul 2006 11:34 am
- Butcher
- Moderator
- From: Norway
- Registered: Jul 2006
- Posts: 308
Re: BF2 Rank
Ok, this is definately my dumbest question yet: What exactly do you mean by "sample's body text"? I tried using the index.php as the middle tablet (but it ended with a load of code), I tried using the index.tpl as the middle tablet (which ended up showing empty information fields. Even tried the enterid.tpl (also came out with a bunch'o'code)
I am doing something wrong about the output field... But I guessed so far that the file itself must be saved as prank.php and not prank.html. I'm confused about what I should have in the middle field.
Offline
#23 27 Jul 2006 11:58 am
Re: BF2 Rank
there is never a dumb question.
the way this works is a little backwards from the typical way you'd have an index.php file. sometimes "dynamic" pages have some html in them. you certainly can do that w/ php, but its not typically how I like to code (and thats just my "style" of doing things).
index.php in the case does not contain *any* html. my main reason for doing this is that I suck at html. I use dreamweaver to design the html, and going with a "static html page" (which contains no php) to make a template is the best route to do that.
a lot of companies have designers that do HTML code, and hand that over to a developer to do the back end work.
you shouldnt have to enter any php, you wont copy anything from the index.php file from the zip into your prank.html file. that prank.html will then become the "template" that the index.php will use (actually I made 2 of them. one with the special tags that get replaced, and one that just is blank. here's a screen shot of the way this server looks (the bbc.tpl and bbcenterid.tpl are directly from your site, and the bbc.php is an exact copy of index.php w/ some modifications to pick up the bbc templates instead of the default ones).
so your prank folder will use the index.php to load up your html file, and replace the special tags that will represent the players stat info (in my sample I used "<player_rank_text>", "<player_name>", "<next_rank_text>" and so on. those show up in dreamweaver, and are replaced inside index.php w/ the actual values from EA).
the "sample's body text" is this (from index.tpl):
Code:
<div class="overall"> <img src="images/rank_<rank>.jpg" border="0" align="left" class="rankimage"> <div class="nametitle"> <player_rank_text> <player_name> </div> <div class="score">Global Score: <global_score></div> <div class="score">Next Rank: <em><next_rank_text></em></div> <div class="progressborder"> <div class="progressbar" style="width:<progress_percentage>%;"><span> Progress: <progress_percentage> %</span></div> </div> </div>
which is everything between the <body> and </body> tags in the html page.
here's a closer look at what and where to place code from the sample index.tpl, in your template.
I hope that makes a little more sense.
Offline
#24 27 Jul 2006 12:55 pm
- Butcher
- Moderator
- From: Norway
- Registered: Jul 2006
- Posts: 308
Re: BF2 Rank
Well, of nothing else it did make more sense, but... Ok, what I did: I did as you said, took everything between <body> and </body> from index.tpl and pasted it between the <td> and </td>, so it looked like this:
Code:
<td> <div class="overall"> <img src="images/rank_<rank>.jpg" border="0" align="left" class="rankimage"> <div class="nametitle"> <player_rank_text> <player_name> </div> <div class="score"> Global Score: <global_score></div> <div class="progressborder"> <div class="progressbar" style="width:<progress_percentage>%;"><span> Progress: <progress_percentage> %</span></div> </div> </div></td>
And then, to test it I fired it up in Opera, but, and here comes the new issue: It opens in a new window when I press submit, and it doesn't contain any information. And also, I added this:
Code:
<link rel="stylesheet" type="text/css" href="http://www.bamboocommandos.com/prank/stats/style/stats.css" />
to it, but it didn't apply right either.
Offline
#25 27 Jul 2006 6:41 pm
Re: BF2 Rank
well, putting the html from my sample into what you already have is not the important part. allowing the index.php to read in your file, and spit out the page with the values filled in is the important part. adding html like tags in your html seems like a pretty easy solution to me, but like I said before, what seems easy to me, might not to you.
another way you can do it (if you dont want to use the "template" system) is to copy the contents of the index.php file, and paste it into the top of your html page (before the html). this will allow you to skip the parsing of your template, and all you have to do to reference the values that come back from ea is:
Code:
<?php // php code ... ?> <html> <head /> <body> Global Score: <?= $global_score ?> </body> </html>
placing the php variables in <?= $varname ?> will cause its value to be placed where the "<?= ?>" code is.
for this to work though, you need to php code from index in your page at the top before your <html> tag, and you need to reference the variable names as they are in your php code.
Offline