Show HN: JSRobot – A platform game you play by coding in JavaScript | Hacker News Reader

Show HN: JSRobot – A platform game you play by coding in JavaScript

github.com

79 pointsreaal34 comments

Interesting, you might want to look at the suggested code though, maybe play through with some beginners?

    function init(robot){
        robot.number = 0;
    }

    function loop(robot){
        robot.jump();
        if(robot.number++ % 2 == 0){
            robot.move(2);
        }
    }

This is in the second level.

Incrementing inside a check is awkward, as is just calling the variable 'number'. Perhaps something like

    function init(robot){
        robot.jump_next = true;
    }

    function loop(robot){
        if (robot.jump_next) {
            robot.jump()
            robot.jump_next = false;
        } else {
            robot.move(2);
            robot.jump_next = true;
        }
    }

I think the readability to an inexperienced coder greatly improves just by moving the "robot.number++" outside the conditional and perhaps even changing it to "robot.number = robot.number + 1"

Though that is slightly different (since ++ will execute after the conditional is evaluated when following the lval but the change will make it run before)

Edit: on 2 seconds though... put that code AFTER the if statement and it would behave exactly as the example.

The first snippet calls robot.jump() every loop. The second doesn’t not.

True, although as someone else points out (contrary to what I thought) only the last runnable action is done.

If that wasn't the case, then swapping things around to be something more like "move_next_turn" would be clearer I think.

Very true, it is much easier to understand with a boolean, thanks!

If I remember correctly, Google's Blockly Games used to allow JavaScript on more than just the last "level". It definitely starts at a much earlier point in the learning process.

The best part of the previous discussions is links to similar technologies; I look forward to seeing what else is mentioned today.

Blockly is a library for building visual programming editors | https://news.ycombinator.com/item?id=10763057 (Dec 2015, 40 comments)

Google's Blockly Games | https://news.ycombinator.com/item?id=8211031 (Aug 2014, 18 comments)

Google Blockly - a visual programming language | https://news.ycombinator.com/item?id=4050426 (Jun 2012, 123 comments)

http://learn.code.org/hoc/1 - highly polished Hour of Code

https://tickleapp.com/ - Blockly <-> Swift controlling physical hardware

A neat concept but frustrating when restarting the page loses any code in the script window.

Sorry! That's next up on the todo list

It's an interesting game, but I was immediately put off by level two, which sinks you into the limitations of the robot API by making you introduce a counter that needs checking. That would be totally counter-intuitive for beginners.

> ...introduce a counter that needs checking. That would be totally counter-intuitive...

Was the pun intentional here?

No. In fact, initially I put "unintuitive" there, but the spelling-checker marked it as an unknown word while it is perfectly valid English.

Not to mention you can just use robot.move(1); robot.jump() in the main loop and complete the level with just that.

Stops working for me after level 1. Repro: 1. https://lab.reaal.me/jsrobot and click "start" 2. Complete the level and click "next level" 3. This takes me to https://lab.reaal.me/jsrobot/#level=2 but the screen is blank 4. Dev tools shows this: "ReferenceError: URLcode is not defined[Learn More] ui.js:32:5"

Using Firefox 56.

I'm get the same error in Chrome 61.

Sorry about that, fixed

I contributed to a similar project[0] for the 2016 7DRL[1].

It was a lot of fun to build but ultimately I just wanted to play the game manually. Someone who tried it back when we released actually wrote a script to control the game turn-by-turn via alert boxes, hah.

[0] https://github.com/bovard/raid

[1] http://7drl.org/

Reminds me of a course I had to take freshman year in college called Karel the Robot[1]. It had a Basic like programming language. It mostly existed to try to quickly bring up to speed the students that has no experience coding prior to college. This is interesting because Javascript is a much more complete language and probably also a it harder to learn if you are just getting started.

Overall, great work though.

[1] https://en.wikipedia.org/wiki/Karel_(programming_language)

:/ Fun idea, but I wrote a chunk of code for the third level, bumped the electro thing, died, clicked the restart button and it wiped my script. I should know better than to trust browser based text editors, but it made iteration and exploration difficult.

Sorry about that, I lazily made the page refresh to restart a level, will fix!

UPDATE: I've fixed the issue where restarting the level clears the script

On the right track, but waaaay to steep a learning curve for an absolute beginner, assuming that is the target audience.

In-line incrementation and Mod operations on level 2 is a fast way to lose beginner interest.

Another example in Action/RPG format

https://codecombat.com

This game is simply amazing. Better interactive tutorial for beginner than Codecademy.

document.write("<h1>you win</h1>")

Great resource for learning Javascript. Good work!

It's a nice idea and really well executed but the second test just demonstrates to me how JS is not an ideal language for a beginner to learn as you're thrown straight into async execution and having to work around the fact that functions execute immediately with arcane workarounds.

I still think Python is the most straightforward to learn, even though the whitespace constantly catches beginners out too.

I don't understand. Are you referring to Level 2?

What's going on there is just that the robot can only enqueue a single action for the tick. So calling multiple actions will just overwrite the slot.

It's an implementation detail of the game. Maybe it's tougher for beginners or not the best trade-off, but it doesn't have much to do with Javascript

I think it's just a case of leaky abstraction. I'd change the API to something like:

    robot.action = { action: 'jump' };
    
    robot.action = { action: 'move', amount: 4 };

    etc.

Or if you want to keep the action creators:

    robot.action = robot.jump();
    
    robot.action = robot.move(4);

Which makes it obvious that there can only be a single action per loop call.

Or the action could be the return value. IMHO, trying to guess the physical model by experimentation is painful. Why not propose a debug button to display the state of variables during the execution of script.

Exactly, the function should not be responsible to see if robot.action has any existing value. It should just return an action depending on the state.

Another idea is to return a map of actions.

    { jump: true, move: 4, shoot: true }

Making the user increment a nonce and use the remainder operator just to do multiple actions simultaneously is pretty heavy.

That's not right. You can put more than one action in the loop. This slowly completes the level:

    function loop(robot){
      // your code here
      robot.move(1)
      robot.jump()
    }

It shouldn't according to its own instructions.

I bet jump() has something like `if (robot.touchingFloor) { action = 'jump'; }` which makes your code work because it doesn't overwrite the robot action if it can't actually jump.

Switch the order of actions and you'll see the robot never jumps because its action gets overwritten (as stated in the instructions tab).

EDIT: Here it is:

https://github.com/reaalkhalil/JSRobot/blob/478848147a080d8b...

Ah I stand corrected, thanks. So I guess it's performing the last valid action.

Reply on news.ycombinator.com