Feat : Big refacto & Vue 2 -> Vue 3

[Shadowner]

I've been looking for an HTML/CSS/JS way to render magic card for a project that I want to start, saw your attempt at It and thought that you were the closest one to a good renderer !

Wanted to contribute as much as I can to make the codebase a bit cleaner and try to conserve as much feature as possible to be able to do more in the future !

Just a Draft for now but it include a LOT of things :

• Composable for card logic
• Separation for CSS (I'm not as good as you on CSS so I didin't touch it too much)
• New Components to render the card and split the code to have better readability
• A new UI with multi select and constant well placed in another file
• Tried to add Typescript as much as possible but not yet done
• Changed the set icon to use the open source projet https://keyrune.andrewgioia.com/

I broke some things like the Card collector and the Renderer that I aimed to fix bit by bit ! :)

Wanted to open this Draft PR so you could take a look and play arround if you want to

---

Sur une autre note, je trouve vraiment le projet et tes autres projets super cool !
/
/

[netlify]

❌ Deploy Preview for mtgrender failed.

Name	Link
🔨 Latest commit	e37e60e
🔍 Latest deploy log	https://app.netlify.com/projects/mtgrender/deploys/6921f454af5d1d000809130d

[Shadowner]

Yeah Netlify will definitly not deploy this PR, build doesn't work for now but dev mode does

[Senryoku]

Hello!
Thanks for contributing back here! This thing is in dire need of a cleanup, composition API and typescript won't hurt for sure.
It'll take time to review everything (and I'll probably wait for it to build/be mostly done) but the few changes I glanced at looked positive! I mostly noticed stuff that I left in some weird state... (Why is there a package[-lock].json at the root? Why are many set icon like assets/img/set_icons/j20_mythic.png a low quality cardback?...)
I don't want to step on your toes, but let me know if you need help with some parts.

---

Merci ! :D

[Senryoku]

Oh yeah, about set symbols, I don't think the keyrune font look as good as individual set symbols sadly:


Could be used as a fallback for missing icons though.

[Shadowner]

Yeah I totally agree with the set_icons of the font it’s not as good as the set_icons :/

And aboute the low quality back cards, i tried to download the set_icons from mtg with the python scripts it seems to be their rate limiting kicking in and giving this sublime back card

I didn’t wanted to put time in finding a way to bypass the rate limit so that’s why the font :')

Another critical problem of the github repository, the size to download it, 1Gb + git history, there might be a better way to handle the storage of the assets or cleaning the history to make it lighter, but I might look into it later

[Senryoku]

I modified the script in the fix-set-icons branch, still wonky but at least it won't flood the repo with duplicate images. You can get the set icons as webp from there.

I agree the size of the repo is an issue, shallow cloning helps in the short term.