Page 1 of 1

Manialink Styles Website

Posted: 13 Jan 2009 04:06
by f*ckfish
Hey guys,

since server controller and manialink development take place outside the game client I always wanted to have a source for the manialink styles independent from the game client so I decided to put up a webpage that displays all of the known styles (for now).
I basically extracted the graphics from TMUF and matched them to the styles and substyles that smurf so perfectly put together on his manialinkcolor>.

You can find the result of my work on my Manialink Styles Website

Features:
  • all currently know styles and substyles (for backgrounds and icons)
  • correct MouseOver effects
  • sample source code (just click on them and you'll see)
There are a few more features under the hood that you probably won't realize, but I'm kinda proud of, like correct sizing of the background styles (some of them are stretched, some are resized in another way, which keeps the small corners and sharp edges)

Btw. sorry for the totally unnecessary pseudo eyecandy, AJAX stuff and the horrible HTML source, this was kind of a project for me to learn some of this stuff and I'm still in the process of doing this ;-)

Some screenshots for the undecided:

Overview
Image

Details
Image

I did not include the label styles since they are nearly impossible to extract ;-)
____________________________________________________________________________

btw. there are some more graphics that I found that should be accessible ingame via styles and substyles, they are just lacking the correct Substyle definition, so if you know one of them, help would be appreciated, to make the styles complete =)
Unknown Manialink Styles

Re: Manialink Styles Website

Posted: 13 Jan 2009 09:06
by Xymph
f*ckfish wrote:since server controller and manialink development take place outside the game client I always wanted to have a source for the manialink styles independent from the game client so I decided to put up a webpage that displays all of the known styles (for now).
No wonder that new Menu release is long overdue. :wink:
f*ckfish wrote:I basically extracted the graphics from TMUF and matched them to the styles and substyles that smurf so perfectly put together on his manialinkcolor>.
(Also known as http://smurf1.free.fr/mle/index.xml )
f*ckfish wrote:You can find the result of my work on http://fish.stabb.de/styles
How did you 'extract' the graphics... by capturing screenshots? <gulp>

Two downsides to all the funky pop-up stuff: the fade-in/fade-out effect is too slow and not fluent (edit: this appears to be somewhat dependent on my system load), and clicking on the later icons scrolls the page back to the top so you lose your bearings a bit.

But otherwise, excellent work, I've added this thread to my TMF hub page.
f*ckfish wrote:I did not include the label styles since they are nearly impossible to extract ;-)
Riiight. :)

Re: Manialink Styles Website

Posted: 13 Jan 2009 12:34
by f*ckfish
Xymph wrote:No wonder that new Menu release is long overdue. :wink:
Yeah, I know... :oops:
Xymph wrote:How did you 'extract' the graphics... by capturing screenshots? <gulp>
Nope, the extraction was a mixture between converting the DXT textures in photoshop and automatically slicing them up with the help of php GD. Then there was the annoying process of naming them manually by comparing to smurfs list and giving them properties so they are handled the right way when resized (this includes all the background style resizing with or without stretching). This resizing stuff doesn't make much sense in the site as it is now but it was mainly a preparation for some other features I might include later, like ManiaLink preview or stuff like that. Some of the extracted graphics have a really nice resolution like the medals:
Image
Xymph wrote:Two downsides to all the funky pop-up stuff: the fade-in/fade-out effect is too slow and not fluent (edit: this appears to be somewhat dependent on my system load), and clicking on the later icons scrolls the page back to the top so you lose your bearings a bit.
Speeded it up a little now, this scrolling issue never happened to me, I tested in IE, Firefox and Chrome.
Xymph wrote:But otherwise, excellent work, I've added this thread to my TMF hub page.
Thanks =)
Xymph wrote:
f*ckfish wrote:I did not include the label styles since they are nearly impossible to extract ;-)
Riiight. :)
Seriously, did you have a look at these textures? For now I wouldn't now how to automate this. And manually? nope...

Re: Manialink Styles Website

Posted: 13 Jan 2009 14:08
by CRMax
Good work, I'm going to use it for my ManiaLink ;)

Thanks F*ckfish

Re: Manialink Styles Website

Posted: 13 Jan 2009 15:25
by f*ckfish
There are some more graphics that I found that should be accessible ingame via styles and substyles, they are just lacking the correct Substyle definition, so if you know one of them, help would be appreciated, to make the styles complete =)
Unknown Manialink Styles

Re: Manialink Styles Website

Posted: 14 Jan 2009 14:51
by TaoK
GREEEEAT JOB!!

Thanks a lot ^^

Re: Manialink Styles Website

Posted: 14 Jan 2009 19:11
by apovtx
Very usefull site! :thumbsup: Good work! :lovetm

Re: Manialink Styles Website

Posted: 14 Jan 2009 22:13
by smurf
Image <- Icons128x128_1 / Rankings
I forget to upload the file with this image (manialink updated) ;)

Image <- Icons64x64_1 / ToolTree (already in the manialink)
Image <- Icons64x64_1 / Music (already in the manialink too)

Re: Manialink Styles Website

Posted: 15 Jan 2009 00:35
by f*ckfish
Thanks a lot smurf :thumbsup:

Re: Manialink Styles Website

Posted: 22 Jan 2009 21:35
by oliverde8
style="BgsPlayerCard2" substyle="ScoreLink"
seems not to work :roll:

and
<quad style="BgsPlayerCard2" substyle="Podium" posn="0 0 0" sizen="10 10"/>

Finally the first part Bgs1 shouldn't it be BgCardSystem other way it don't work for me

if not great reference :thumbsup:

Re: Manialink Styles Website

Posted: 23 Jan 2009 12:03
by f*ckfish
oliverde8 wrote:style="BgsPlayerCard2" substyle="ScoreLink"
seems not to work :roll:
and
<quad style="BgsPlayerCard2" substyle="Podium" posn="0 0 0" sizen="10 10"/>
Yeah, that was kinda confusing on smurfs page, the real style name is "BgRaceScore2". Changed it now. Thanks a lot.
oliverde8 wrote:Finally the first part Bgs1 shouldn't it be BgCardSystem other way it don't work for me
Weird, it should work. There's Bgs1 and Bgs1InRace where Bgs1 is the style with the blurred out background. If you experience problems with the source code, it can always help to watch smurf's site in a webbrowser ;-)
http://smurf1.free.fr/mle/demo.php?type=bgs1
oliverde8 wrote:if not great reference :thumbsup:
Thanks =)