robinLord

For a while I've had the idea in the back of my head, of a game where someone can learn HTML and CSS by actually jumping across/ interacting with the things they are creating and changing.

Normally I'm sure that using canvas or something would be a much better plan for this kind of thing, but it really mattered to me that user inputted HTML and CSS behaved as close as possible to how it would in the real world. A fair bit of research told me that trying to emulate that on canvas wouldn't work well.

So, instead - the game has logic to add user-submitted HTML and CSS directly to the page. On each new code submission the game updates its list of object you might hit. On each step of the game loop, the collision detection service checks each of the listed objects with some fairly simple bounding box stuff.

I have to say I really enjoyed some of the levels, and coming up with ways to make things like "border radius" tangible in the game world. I would have loved to include challenge levels where CSS experts can test their skills, unfortunately because of the limitations of the implementation that doesn't look possible, but if anyone has ideas I would love to hear them.

Had to include a couple hacks to make all of that work well. I.e. having the cube constantly bounce massively simplifies things because the game only has to detect impact and trigger a jump. That's important because there's no real communication between the game state and CSS animations, apart from when the loop is checking for collisions. So instead of having to handle the process of moving the player up and down at the same speed as platforms, we just trigger a jump, the player probably doesn't notice any significant overlap between the cube and the moving platform, and if the platform is moving up/down it's just that the next bounce comes sooner or later.

Update!

- Have made spec for "Case" clearer and added difficulty ratings in the challenge listing page - Have fixed some silly typos (thanks for that) including calling the captain Sir regardless of name/profile pic chosen - Have improved semi-colon handling in levels that use steps and "with" to build up a query in the background

I've made a bunch of notes of the other stuff, it'll take a bit longer to get to because I've been neglecting a bunch of other things for this game, but I'm not ignoring the feedback and please keep it coming if stuff isn't working for you.

Thanks again for the feedback!

Thanks! Adding to the list of updates

Yea sorry, unfortunately not something the SQL library I used supports, select * is the best for now but I'm adding "table preview" to the list for future updates!

Thank you! I'm pushing a fix for this shortly!

Erk, the most frustrating of bugs - an inconsistent one! I think you're hitting errors because in the background I'm adding the queried together in "with" statements and "with" can't have a ; at the end inside the brackets... but the thing is I came across that issue in testing and now I automatically strip out any trailing ; when I pro ess...

Just tested it, even added a bunch of spaces and line breaks at the end to see if that was confusing things but I still seemed to get through ok.

I want to fix this but for now could you try the steps without putting a semicolon at the end? Hopefully your patience/enthusiasm hasn't totally worn out at this point but even if you don't feel like reporting back I'm keen for you to be able to get past the frustration if you're still interested! :-)

That's wonderful news! So glad you've had fun.

I've tried to hit a bit of a balance between english-sounding instructions and being clear on table columns, will definitely note this down to think more about

A charitable read! Just a screw up on my part. A lot of this ended up quite hard-coded so when I updated tables sometimes I missed updating some instructions. Thanks for spotting!

And very glad you've been enjoying it aside from that! :-)

Definitely open to feedback in that regard! Somewhat embarrassingly In both English and have a degree in English... but I had massive scope creep on this and was usually smashing out bits on planes, trains, and automobiles so tried to catch silly things but clearly missed some!

Thanks very much! Should have caught that

Yea I totally get it - I face a similar challenge when it's something I'm more clued up on.

That is brilliant news that you gave it a try and enjoyed it, even better that you learned something! Thanks again for the time you took to feedback, and the time to follow up!

Thanks! Really appreciate that!

Hmm that is frustrating, you can't just tap the text area? I think I do need to have another look about how the autosuggest places the cursor back in the box. Good feedback I'll add it to the list!