Deck Generator, Draft Parser and Hover link generator

Magic: The Gathering is a card game that requires us to present information in some form, sometimes textual, sometimes visual. Readers need to know what we are writing about without the need to look elsewhere and in order to have the information ready on your own page I decided to write several tools that could help authors writing about Magic: The Gathering.

Deck generator

I was trying to figure out how to easily generate decklists for a while and I ended up having one written in Google Sheets but that is not particularly easy to use and takes time to generate the code since it is also linked with database. By accident (posting the output on my Facebook wall) I found out that Paul Leicht created his own decklist generator to use in his articles on PureMTGO, written in JavaScript. He let me scavenge the code and I decided to use it and create a decklist generator that everybody could use.

I created two versions. One that can be used online and one offline version. The difference between the two is that the online version doesn't sort cards and the offline one does. Both generators can be accessed from http://stsungalters.com/deckgen/index.html

The decklist generator can produce a visual deck view and a text view (on the screenshot).

Magic Online's Draft log Parser

When I tried to write an article about of my drafts I took zillions of screenshots from Magic Online and put that up. It took ages though so I thought that something that can show the picks in a visual way would be neat too. I had no idea how to do that so something was suggested to me. If you wish you can use this to show your drafts. To navigate to it go here

Hover links generator

The last thing that I was using on PureMTGO is something that generates links and hovers for cards. It seems to be the Standard for many Magic sites and there is no reason why you wouldn't want to have that on your site too. I used it from time to time on this blog and will use it in all my following posts. What it does is that if you hover over a card name (which is a link) it will show you the card's image. If interested in that you can try it out - Hover Generator.

Big thanks to Paul because without him I wouldn't create any of this. Thanks to Aspallar who was so kind answering my dumb questions about JavaScript. Thanks to April King for writing PDF Decklist generator from which I got the idea how to do the deck gen linked above.

Trueside.cz

I was asked to create a webpage by a company named Trueside. I said yes, hoping that they would pay at least a bit for it (The CEO of the company is my colleague's boyfriend). I wanted to help them start somewhere and eventually get paid but I learned that in this country nothing like that actually works out. I was forced to work during weekends and was also told that is 'just a small thing', 'easy to do' and 'doesn't take long'. One that wonders why they didn't do their webpage on their own, right? I was also accused of not following their instructions even though the ones I received showed to be the wrong ones because someone sent me not updated instructions. This is not how professional work looks like and especially as someone who decided to do this of their own volition I'd expect some respect from their side.

Nevertheless all this led to me creating their website that is currently still in use. I kind like it. If they will ever ask me for help, they won't get it though unless they give apologize or pay for what I did. (if you click on the screenshots below it will take you to their site - trueside.cz.)

MTGGoldfish

Since I play on MODO more regularly than before which was more of 'rarely' I needed a site to check on prices.

I started using MTGGoldfish to see the prices of a larger amount of cards. But with time I started using the site for more things. I added some decklists I wanted to share in a text form (because it clearly shows the prices in tix and one can see price of each card at once). Later I ventured on and read some of the statistics articles and became hooked. I don't usually read Magic articles unless it is something very strange usually not talking about Magic but rather its players, psychology or such. But when seeing numbers and reading some of the analysis I realized that this is something my brain can actually work with and interests me. Even the interpretation of the data is a completely different chapter.

MTG Goldfish has become a site I most of the time have opened in my browser I check the new content. I still do not watch Magic videos but I might actually start doing that. I sometimes watch games on MODO so I don't see a problem why I couldn't watch something that was actually screen captured for the audience.

One of the things that I actually like about MTGGoldfish is the fact that it is mostly plain text and shows all the data well unlike other sites (and exports decklists in plain text!). So if someone decides to make the site more graphically pleasing I hope this clarity will be maintained. (the webmaster is certainly someone who knows what he wants and can formulate what he wants).

While being on the site I accidentally clicked on some link and I ended up on MTGGoldfish Facebook page. I clicked on 'Like' because they deserve it and then noticed that they were looking for a graphics designer. So I decided to sent them an email with something like my portfolio and see if they would contant me.

A bit later I received an email asking me if I could do what they envision. I found out that what they plan to do is have some nice visualization of decks that they can post on FB, Instagram etc.

I decided to do it no matter what they give me (not so much work at work so I was glad to work on anything). During the process of coming up with a layout and design I certainly learned few things (since I really did not expect doing graphs and using zillion of layers...).

I wanted to do the first draft functional and I wanted to have an idea how something like a visual deck view could look like and I wanted to keep the MTGGOldfish orange color present. It turned out functional but not 'awesome' or anything. The second draft was an attempt to make it look better - in terms of visually pleasing. But I struggled a lot with showing the data. I was trying to figure out what kind of graphs could be used and what graphs wouldn't look dull. The second draft wasn't good enough but it lead me to the final draft which finally started looking nice and flashy actually a fourth one). Textures and graphics was added, more icons and figuring out how to make it look coherent (I spent way more time doing stuff in illustrator than I would expect. I spent hours doing something that I don't even know was worth doing that). In the end the simplest solution showed up to be the best and the visual deck view for MTGGoldfish was done.

So I thank MTGGoldfish for letting me do this and hope the players enjoy it.

Draft no. 1

Draft no. 2

Draft no. 3

Final generated version

Intranet design

Few weeks ago I got employed (great news!). I work for FN Motol (Hospital) as a graphics designer. This means that I started creating stuff be it print documents or digital media.

There is intranet that I don't really have access to yet but I was asked to prepare a design for it. I've done something fast in Photoshop which ended up looking more or less ok (because I did not have access to intranet, otherwise I would use the code) and it was redelegated to the IT department. When we all saw the final result they produced later we were shocked because it did not really copy my style. When I had some spare time I decided to log on a machine actually connected to their network and use the code and restyle the page.

When doing this I realized that even small things matter and that my eye still catches so many things that are 'graphically' wrong. Often there can be awesome ideas and graphics but it would be nice if people could use the space in a better way. Especially now when there is so much space on our screens or the magazines/posters etc we see everyday. All those small changes count and can make something look great or at least acceptable and good.

This post is here to remind me that not only creativity is needed for a good design or a good looking page/advert etc. After struggling with a very let's say 'artistic' advert this was actually quite a revelation and it helped me finish it keeping this in mind. My design follows (not sure why the quality of the image is so bad..I actually saved the file in MS Paint because there is nothing better on the computer I could use)

STsung Alters

Today I launched a site showcasing some of my Magic: The Gathering alters, custom playmats and custom tokens. You can view some of my paintings and drawings there too.

Magic Alter

During my last year at school I tried to figure out how to alter Magic: The Gathering cards and in the process learn how to paint. To some extent it worked. Now I accept commissions for Magic Alters. Here is a video how such a thing is done and the final result.

To check out my other work visit my personal blog and the category Magic Alter -> http://stsu.blogspot.cz/

And here's a time lapse of the alteration

Custom Playmat time lapse

I started drawing and painting custom playmats. Here is an example of such a work.

A timelapse of me doing StoneBlade playmat. Processing 14GB of Windows Media Video was a pain, but hopefully it ended up well.

Czech Nationals in Flames of War T-Shirt

Here I present you a t-shirt design for a Czech National Tournament in Flames of War (World War II miniature game). Hope people will like it^_^.

Outcast Search Engine

Now it's possible to search by card name, card color, card rarity, card type and edition. I need to integrate the function 'AND' though...

Outcast update

I had to fix few things.

- breaks contained in lc_text (I added break to the actual lc-text of parametrs I use and deleted it in the general code)

- edited categories' visual look

- added store credit module

- fixed header image

- tried to fix the width of elements (still does not work, but it's better)

-czech language fixed

So now I need to do something with the search engine and come up with buy list. Any ideas?

Extra Fields

You need to edit few files.

1. in the language files you use enter definitions
in my case it would be

PHP Code:
define('TABLE_HEADING_EDITION', 'Edition');
define('TABLE_HEADING_COLOR', 'Color');
define('TABLE_HEADING_TYPEMTG', 'Type');
define('TABLE_HEADING_CASTINGCOST', 'Casting Cost');
define('TABLE_HEADING_RARITY', 'Rarity');

2. in /main_template_vars.php find the part that adds a column and add it

PHP Code:
'TABLE_HEADING_EDITION' => TABLE_HEADING_EDITION,
in the switch section:

PHP Code:
case 'PRODUCT_LIST_EDITION':
$select_column_list .= 'p.products_edition, ';
break;

3. in the product listing you use... add this

PHP Code:
case 'PRODUCT_LIST_EDITION':
$lc_text = TABLE_HEADING_EDITION;
$lc_align = 'left';
$zc_col_count_description++;
break;

and then finally under...

PHP Code:
for ($col=0, $n=sizeof($column_list); $col<$n; $col++) {
$lc_align = '';
switch ($column_list[$col]) {
PHP Code:
case 'PRODUCT_LIST_EDITION':
$lc_align = 'left';
$lc_text = '  '.$listing->fields['products_edition'];
break;

4. Run SQL to add values to configuration table!!:

PHP Code:
insert into configuration (configuration_title, configuration_key, configuration_value, configuration_description,
configuration_group_id, sort_order, date_added ) values (
'Display Product Edition', 'PRODUCT_LIST_EDITION, '4', 'Do you want to display the Product Edition?', 8, 5, now());

after all this you should have a new column created and the new field data loaded.

I had everything set up but forgot about the configuration *double facepalm*.

L5r.cz - Spoiler

I've spent a lot of time adding single cards to the shop's database and I decided to use it for more than just the shop. In each Trading Card Game you usually have new sets printed and usually certain sites post spoilers.

As a new set is out in Legend of the Five Rings I decided to compile the spoiler. Most sites just post text spoilers or just the images but none bother doing both. Mostly it's on forums so you have to go through many posts to actually find a card you are looking for. The biggest L5R databse site does have a complete listing but only after the set is out. But if you want to see a bigger image you have to actually click on the image and be redirected to a different page that shows all the card's info and many people find this really annoying.

That's why I took the database data and listed it on a page. I needed to join few tables and figure out how to list the fields in two kinds of columns but well it works. Finally I implemented Highslide javascript that shows the full size image after you click on the thumbnail and you are still on the page. Big THANKS to Highslide Software. I might well buy this for my shop because I like it. I spent about six hours figuring out a Javascript script but I gave up as it never did what I wanted and when it started to do something it was SLOOOW and it also reminded me that I hate JavaScript and should never try to do something in it! Never again.

What to do now?

• I want to create a search engine or at least something that let's you choose a set. I won't do that now, because the database does not contain all the cards I need nor their game text. But it will eventually come down to this and I might continue creating something like a deck builder for this game and store the decks.

The script is stored on Outcast.cz server but is accessible from http://l5r.cz which is the Czech L5R site.

Hernaoutpost.cz

The website of our um how to call it - the place you go to play card games and board games - had a simple website with some information about tournaments, about us, contact info etc. We decided to make it more appealing for the players and decided to turn it into something dark as there is an upcoming Magic: The Gathering set full of Vampirea and Werewolves.

The original site was done only in html and consisted of few files that I was updating manually.

My collegue told me that it would be nice to have a calendar and some other stuff that could come handy (registration). For that I knew that I would need to do the page in php.

So what did I do?

• The first step was to have the site in php. I divided structure of each file so I could be including this later. I might do another subdivision on the tournaments page as there is too many things already.
  
• I added a calender. Now it looks terrible but I was too lazy to be figuring out how it should look
  
• I created background (based on Liliana picture from Innistrad box) and figured out how to do transparent elements - oh I discovered CSS3 a novelty to me!
  (yeah of course all those nice thingies and such DON'T work in Internet Explorer so don't expect my site to look good in it. But well everything is discarded and does not show so that's ok...)
  
• I created a database and registration form for the tournaments.
  
• I added a line of code that tells me what week is - either odd or even so the players know what FNM it is. The output actually says just Standard or Boosterdraft. Good thing!
  
• I have RSS feed there as well, it feeds Facebook from time to time, but with a huge delay. I have no idea what causes this. Anyone has an idea?
  

That's about it. The site is life at http://hernaoutpost.cz. It seems that people like it. At least they go to the tournament page and check what is going on! That's what we needed.

Outcast.cz

I started to seriously work my eshop. The shop is based on Zen-Cart but making it work the way I want is quiet a lot of work. I haven't seen php in ages so the first day of staring into php code was a torture. At the end of the day I figured out how GET works and could start working on what I needed ^_^. Double face palm wouldn't help during the that night. But when I woke up in the morning and looked at some random php code I started to remember how it works.

Making changes in Zen-Cart can be tricky. If you want to change something you need to find all the files that have a certain code and definitions in them and change them accordingly and you can't forget about the configuration database either.

For the time being the changes I made are following.

• I changed the layout, styles, translated what I needed etc. CSS knowledge is enough for this...
  
• changed the layout to grid keeping row layout for singles(cPath variable solved my issue)
  
• added extra fields to my products table
  
• listed extra fields on category listing page (see image above) and on the single product listing page (after I told the configuration table about all the changes I made it started to work, a problem arose though. It inserted breaks in the column code and I can't get rid of them right now)
  
• created a search that can filter singles by color, type, edition and rarity. (it does not work well jet as I have problem with javascript that removes the initial string - for some reason I can't get it to work O_O. This is step one though as the search engine should be based on multiple choice checkboxes and I have no idea how zencart works with that. Gotta figure that out later)

There is still a lot of work to do and when I will launch the shop much more work will be upon my head. I have bunch of other scripts that help me with the administration of the web. I later got Apsona Shop Admin and I have to admit that it is good and powerful tool. I no longer need to use the administration in Zen-Cart.

Anyway by trying all this and browsing many files I came to understand how some things work in Zen-Cart.

The shop can be found at http://outcast.cz but is still in showcase mode.

Dragon graphic

For e-shop Mysticshop I was creating expansion symbol icons and then I was asked to create a dragon that could be used on a box.

Music Games website

Machine Dance website