Shipping Grids

[melannen]

This is how badly I'm procrastinating on the things I'm currently over-deadline on:

I sat down today and decided it was time to finally teach myself Javascript.

So, um, I have made a thing. Specifically, I have made a Troll Romance Shipping Grid Generator, where you can put in a list of characters and then automatically fill out the grid with ♥/⋄/♣/♠. Because that is something I've needed in my life, and I haven't been able to find one that did what I wanted, and it seemed like the sort of thing I could program with pretty basic stuff.

Troll Romance Shipping Grid Maker


There is a bunch more stuff I'd like to fix/add to it, but it's reached the point of functionality that I'm spending more time playing with it than coding it, so I thought I'd share. :P

(and while the example lists there are all Homestuck characters, let's be honest, I made this so I could do a TTOI shipping grid, it is not limited to Homestuck characters.)

Sample grid:

	♋	♍	♎	♑
♋		♣	♥	♦	♣	♠
♍	♣		♦	♠	♣	♥
♎	♥	♦		♣	♠	♣
♑	♦	♠	♣		♥	♣
	♣	♣	♠	♥		♦
	♠	♥	♣	♣	♦

I spent about half the time trying to remember basic programming stuff I haven't used in so long I've forgotten (like, oh yeah, == and = are different, that matters in C-ish languages) and half the time figuring out the weirdness that comes with js and html and making output happen. (I was going to be good and do the styling with all CSS, too, but I still can't make myself do rube goldberg css kludges when table and font tags work PERFECTLY FINE for the purpose. :P I did the CSS-appropriate stuff in CSS, anyway.)

Things to work on:

Style:
more flexible formatting on column/row headers so longer labels fit better
accessibility
figure out metadata stuff
make page prettier
add comments to code (if i have to, i guess)
figure out how embeds work
in-page way to save grids (output as HTML table?) Done!
mark center diagonal Done!
Highlight row/column on mouseover
recognize image urls in input field
strip unwanted html in input field
strip unwanted html & add bg colors in html output

Functionality:
automatically fill in mirror-image space on grid WOOHOO!
automatically check for duplications/contradictions
notify when a grid is fully drone-safe
add option for & and / symbols for human relationships Done
add option for vacillation
puzzles

Most of those - especially the functionality fixes - will require basically re-doing the whole thing, so it, like, uses actual arrays to store values and stuff, but that can be my Lesson 2 :P

Comments

[cest_what]

Oh my god, that's amazing. What an excellent tool, thank you for sharing!

[erinptah]

I think ♥ could work for human romance too, you know? That's basically equivalent. I like the idea of an & or + option, though.

All the +1s for marking the center diagonal and automatically filling in mirror-image spaces.

[stellar_dust]

No no no, leave the diagonals functioning! Because Karkat♠Karkat. And! I put in Star Wars characters and realized that Luke♣Luke is basically EU canon.

I guess you could just make the background grey or something.

(I am failing really hard at writing a paper tonight.)

[thatyourefuse]

... Do you actually know how badly I need to see the TTOI shipping grid now?

(Also this is marvelous and I need to do it for all my fandoms as soon as I remind myself which symbols are what.)

[thatyourefuse]

Also, I just realized that Freddie and Bel from The Hour swing back and forth between ♥ and ⋄ every time they change camera angles, which I don't think should be possible, poor darlings, no wonder they're so confused. But then they're the ones who end up having sexual tension even in the sedoretu universe in my head where that would be incestuous, so who the fuck even knows with them.

(Freddie and Hector are totally falling in blackrom as of 2.01 though.)

(This is fun. And I should go to bed. Those two statements might be related.)

[calvinahobbes]

THIS IS SO COOL! *___*

Wow!

[ysabetwordsmith]

That is amazingly intricate. Thanks for sharing!

[swamp_adder]

Whee! This is so much fun to play with. (Totally random: your post on poly relationships got me to start reading Homestuck. Now I'm completely obsessed with it. So, um, thank you!)

[silvermink]

Well, to be fair, creating tables is still a perfectly appropriate use of HTML's table tag. :)