andrewgioia / mana

Magic: the Gathering mana symbol pictographic font
308 stars 32 forks source link

Add ligatures for mana costs #70

Open Estus-Dev opened 3 years ago

Estus-Dev commented 3 years ago

First off, thank you for this amazing resource. I'm using it for a prototype of something that really shouldn't work but does, and this project is helping enable that. If I decide to take the project all the way I'll be sure to send you a link.

Anyway, part of what I'm doing is displaying mana costs for cards in a context where I can only display plaintext. Right now I'm just using the unicode PUA symbols copied out of the cheatsheet for this purpose.

This works great for Lightning Bolt {R}, or Conflux {3}{W}{U}{B}{R}{G}.

I could make it work for things like Izzet Guildmage {U/R}{U/R} by putting the Izzet guild logo in its place, for my purposes that could be fine.

However, I don't know how to represent things like Norn's Annex {3}{W/P}{W/P} or Beseech the Queen {2/B}{2/B}{2/B} short of what I typed here. In the case of Phyrexian mana, I'm in a context where I can't control font color.

Is there any possibility to use ligatures or unicode combining marks or something, in order to represent cards with these hybrid/phyrexian costs? If not is there anything I can do as a developer with little/no artistic skill or font knowledge to contribute to doing so?

Hybrid Symbols I don't have a suitable replacement for:

Hybrid Guild Symbols, I can use guild logos if needed:

EDIT: Updated my wording after learning that these symbols do exist, when used in the browser with CSS.

andrewgioia commented 3 years ago

Thanks @AestusVitae and yes these are available with CSS classes, just not on a desktop as ligatures yet. I'd love to support them to make it much easier to type out (instead of having to manually copy them all the time) and it looks like Icomoon supports it fairly trivially.

I changed the name of this issue so we can track this specifically and should be able to get to this somewhat soon.

andrewgioia commented 3 years ago

Rule 107.4 in the Comprehensive Rules seems to identify all of the mana costs that use this format:

107.4. The mana symbols are {W}, {U}, {B}, {R}, {G}, and {C}; the numerical symbols {0}, {1}, {2}, {3}, {4}, and so on; the variable symbol {X}; the hybrid symbols {W/U}, {W/B}, {U/B}, {U/R}, {B/R}, {B/G}, {R/G}, {R/W}, {G/W}, and {G/U}; the monocolored hybrid symbols {2/W}, {2/U}, {2/B}, {2/R}, and {2/G}; the Phyrexian mana symbols {W/P}, {U/P}, {B/P}, {R/P}, and {G/P}; and the snow mana symbol {S}.

andrewgioia commented 3 years ago

Basic ligature support added in 1.13.0. Unfortunately because of the way split symbols are handled (using 2 glyphs via CSS), ligatures are unavailable unless/until we add specific glyphs for these symbols. Currently these are supported:

Estus-Dev commented 3 years ago

That removes a large chunk of my mappings table that I'm maintaining for this project, but unfortunately doesn't solve my initial request.

Do you have any good resources for learning enough about SVGs and fonts that I could contribute those hybrid symbols myself?

gbartholomeu commented 2 years ago

Hi @AestusVitae, you can open the original svg provided in the repo in IcoMoon for example, download the mana svg and then draw a new font for each combination. I know it seems a lot of work, but once you have the template done, updating the following images shouldn't be much harder. I did it in my minimalist B&W proxy printing project. As you can imagine, for a B&W system, printing colored phyrexian mana is quite... impossible. So I created my own symbols for representing it.

I drew all the icons in GIMP, converted from PNG to SVG using InkScape, and uploaded the new icons to IcoMoon project. Once you do it 1-2 times you get to it without worries. Just be sure to add your icons in the end of the original SVG so you don't break the Unicode code order.