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

[thatyourefuse]

Basically: in a sedoretu universe circa S1, Freddie and Bel are the Morning people and Lix and Hector are the Evening people, except Freddie and Bel have incredibly wrong feelings about each other. (The lady Hector is canonically married to is off to the side somewhere, because I adore her but they're not good for each other.)

In a troll romance universe circa S2, Bel used to be flushed with Hector, but now she's auspisticing him and Freddie, Lix and Randall were probably matesprits back in the day but no one's talking, they're having to make up a new symbol (possibly ~) to encapsulate Bel and Freddie, and Bel might be having a flushed crush on Lix or Randall or possibly both.

Really almost in canon circa S2, Lix and Randall are Mummy and Daddy, Bel is having very confusing new feelings about wanting to be parented, Freddie would be totally onboard with being her little brother in an incredibly inappropriate way except for a certain complication who's totally going to dump his skinny ass sooner rather than later, and Hector has gone full metal douchebag and needs snapped back in line hard.

Also sometimes there's some news.

[melannen]

Continuing to be fascinating. :D

>>they're having to make up a new symbol (possibly ~) to encapsulate Bel and Freddie,

Relationships that fluctuate rapidly and continuosly between various categories are troll canon, I just haven't figured out how I'm going to work them in the generator yet - the symbols used in the comic are migraine-inducing animations that flash wildly between the various symbols, but I think I may go with an overlay or something instead. (even if migraine-inducing is probably *accurate* symbolism for many of those relationships.)

[thatyourefuse]

Overlays would be good, or smaller symbols side by side, or something of the type.

(And it is, all joking and pornography aside, really fucking amazeballs TV.)

[calvinahobbes]

This whole description: accurate and amazing! *__*