New Heroquest Card Maker

[peewee_rota]

Hi, everyone. I've lurked the main site for a long time, but don't recall ever stopping into the forums. I wanted register because I have been playing HQ again and was in need of an updated Card Maker.

So I made a browser based card making tool. It's available at http://zeliepa.net/cabbruzzese/hqcardmaker/

It is open source and 100% client side, meaning nothing is ever uploaded or saved on 3rd party servers. It exports and loads in .json format and saves to .png. Source is available on Github at https://github.com/cabbruzzese/hqcardmaker

[Anderas]

It is an interesting project.

I was keeping away from html when I did my card maker because I didn't know how to include the heroquest fonts. But then, I am no HTML magician.

Did you find/know a way?

[peewee_rota]

...I didn't know how to include the heroquest fonts.

I looked into embedding them so they don't have to be installed locally. As long as they are all converted to the common formats for multi-browser support (ttf, woff, eot). There are tools for that so it would be pretty easy. The problem is that they are all copyrighted fonts, with the exception of 2 that I couldn't find any license information on. So they'd have to be purchased with web rights. Plus I'm not sure how that would work hosting them in github.

In the mean time, if you have them installed on your machine you can specify the font in the options. What I will do is look into a way to store preferences so that they can be per user. Might have to do something with cookies and put up a warning. Just need to research it.

Here's an example after I installed the fonts locally:


Json file: http://zeliepa.net/imgdump/Heroquest%20 ... ddata.json (right click, save as)

Edit:
For newer folks like me, go to the Fonts resource, download the pack, and install them locally. For windows, extract the contents, right click each font file, and press install.

[lestodante]

Cool... just a bit complicated when you have to insert the font name spelling it correctly or it will not accept it.
Can you made an EUR layout version also?
I noticed when I click on DOWNLOAD IMAGE it doesn't save the card at all. (I am using Firefox)

[peewee_rota]

I noticed when I click on DOWNLOAD IMAGE it doesn't save the card at all. (I am using Firefox)

DOH! Forgot about that compatibility issue. All fixed. Just refresh the page.

Can you made an EUR layout version also?

Those are pretty. I'll put that on the To Do list. It shouldn't be too hard.

Update!
Added limited inline text formatting support. Loosely follows markdown for bold and italics.
*italic*
**bold**
***bold & italic***

[lestodante]

ok now it's working with Firefox too.
but is the 300x470 pixel image enough for a good print?
Also when you'll do an Eur version please allow the system to make a different fram/border as in the original cards the frames are different each others.
I can provide you images for the frames if you need.

[Anderas]

Let me drop a little bomb while walking by...

does your cardmaker understand this?

https://docs.google.com/spreadsheets/d/ ... sp=sharing




I would love it to

[peewee_rota]

but is the 300x470 pixel image enough for a good print?

I picked a size double the size of old files I had sitting around form the super old Windows App card maker. I don't know what resolution that older app originally did save, but I figured double the size of the cards I had leftover would be good. Maybe allowing the whole canvas to scale is another feature that could be added. I generally use these cards on Roll20, so that kind of high resolution foremost when working on the web card maker app.

Also when you'll do an Eur version please allow the system to make a different fram/border as in the original cards the frames are different each others.
I can provide you images for the frames if you need.

That's a good idea. There may be some way to just generate the tearing and weathering programatically, but if you have image files, that would be really helpful.

Let me drop a little bomb while walking by...

does your cardmaker understand this?

https://docs.google.com/spreadsheets/d/ ... sp=sharing




I would love it to

It looks like there is a google sheets library that could work. That is totally doable.
https://github.com/mikeymckay/google-sp ... javascript

When all is said and done, the image data from the spreadsheet will probably have to point to real images on a web server. But I'll cross that bridge when I come to it.

[Anderas]

I do have a card maker that runs locally on my pc, in python, that can output that table in png format; but no wait wait...

in poker, skat, bridge, zombicide, original HQ EU and original HQ US sizes,
in printable, pdf-able and mobile phone / online variants,
it can automatically adjust text sizes and chooses the correct fonts for US or EU format,
it can also automatically output everything as full text (like Heroquest) or with lots of symbols from HQModern (for my variant, BP = , MP = , combat die = and so on and so forth)
aaand yes, those pictures are available in my "input" folder.

Yes, that's my personal superhero of a card maker.

Only problem, and that's a biggie, every time every single time I use it, I want to add a new function, and then I develop more, and then it costs again more time than doing cards manually. Every time.
Also, unintended side effect, last time I wanted to move my HQ folder to a new location *somehow* there were about 160 000 files inside, and I suspect that is because it is too easy to make an entire new batch of cards, so I have them hundreds of times now. And it is not publishable as it is command line only.


And here, the pictures I use, available for download.

If you want.


Are you able to make a call to a Python code or python command line on your web page? With your html and my backend I guess the tool could be a winner in all categories.

[peewee_rota]

I do have a card maker that runs locally on my pc, in python, that can output that table in png format; but no wait wait...
...
And here, the pictures I use, available for download.
...
Are you able to make a call to a Python code or python command line on your web page? With your html and my backend I guess the tool could be a winner in all categories.

That sounds awesome and super useful. I really hope to make that kind of incremental improvement as I need things.

Thank you for the link. That is a lot of awesome content. I seem to remember seeing a lot of it in the old windows card maker. So it's great to have all of that gathered in one place at a nice quality.

Theoretically the server could call Python code. I don't really want to have anything be processed server side. I want the user to know 100%, without exception, that their data is client side and never gets uploaded anywhere. I know it's not personal data, but I believe really strongly in making sure everyone knows that their data is safe.

The unfortunate side effect is that python tends to be a technology sufficiently advanced enough to be indistinguishable from magic. So by having to stick with only Javascript, the tool misses out on a lot of really easy solutions for image manipulation.