Javascript card builder

by **Incantus** » 23 Sep 2010, 02:02

I had some free time recently and have been wanting to learn a bit of HTML5. After some playing around with javascript I built an interactive card creator. You can try it out at http://incant.us/creator/. Note: this needs a fairly modern browser (chrome, firefox or safari), and might not work in IE since it uses HTML5.

Thanks go to the MSE project, especially for the new MSE style frames, fonts and symbols.

Card images are of the form:

images/[set code]/[set code]-xxx.jpg where xxx is a number.

Unfortunately the export doesn't work yet. Let me know if you have any suggestions.

by **Huggybaby** » 23 Sep 2010, 02:11

Wow, that's cool. I esp. like the immediate feedback with changes.

The symbols are quite aliased. Have you looked at the assets in the Nate's Deck Builder package?

<edit> Also need formatting for font size and italics, etc.

by **Incantus** » 23 Sep 2010, 02:40

By chance what browser are you using? In Chrome or Safari (any webkit based browser i guess) I get the following image:

What do you mean by options for font sizes? The name, typeline and text box use the same font size as the actual cards (as near as I can tell), although the textbox doesn't automatically shrink the size if there is too much text.

Edit: I tested in Firefox and it seems that Firefox's canvas support isn't quite there yet (for example, with a 2 color card you should see a blended frame).

by **Huggybaby** » 23 Sep 2010, 03:31

I'm using Firefox. I tried IE8 and got an error that Canvas wasn't supported, but I didn't see the aliasing.

I was indeed talking about the ability to make text smaller. Aren't italics necessary too?

It's good that you've got the Chrome and Safari users covered. Now you're 15% of the way to total coverage.

by **Incantus** » 23 Sep 2010, 17:17

Huggybaby wrote:I'm using Firefox. I tried IE8 and got an error that Canvas wasn't supported, but I didn't see the aliasing.

I was indeed talking about the ability to make text smaller. Aren't italics necessary too?

Yeah, italics are needed for the flavor text. Unfortunately I can't seem to find the font used for it.

Huggybaby wrote:It's good that you've got the Chrome and Safari users covered. Now you're 15% of the way to total coverage.

Haha, true. Those 'other' browsers just need to catch up and fully support HTML5. I'm sure Firefox will work soon, but Microsoft seems to have dropped the ball with regards to HTML5.

by **Snacko** » 23 Sep 2010, 17:39

You can emulate canvas in IE7/8 with excanvas, however it isn't 100% the same, ex. you can't copy from such canvas to other canvas.