5 ms·
Show HN: JSRobot – A platform game you play by coding in JavaScript
- ahmeni 9y agoA neat concept but frustrating when restarting the page loses any code in the script window.
- reaal 9y agoSorry! That's next up on the todo list
- bjpirt 9y agoIt'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.
- always_good 9y agoI 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
- kaoD 9y agoI 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.
- reacweb 9y agoOr 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.
- positivecomment 9y agoExactly, 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.
- always_good 9y agoAnother 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.
- IanCal 9y agoThat'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() }
- kaoD 9y agoIt 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/478848147a080d8bf6ded8689d523337ea5e5ff7/scripts/Robot.js#L41 https://github.com/reaalkhalil/JSRobot/blob/478848147a080d8b...
- IanCal 9y agoAh I stand corrected, thanks. So I guess it's performing the last valid action.
- IanCal 9y agoInteresting, 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; } }
- styfle 9y agoThe first snippet calls robot.jump() every loop. The second doesn’t not.
- IanCal 9y agoTrue, 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.
- reaal 9y agoVery true, it is much easier to understand with a boolean, thanks!
- throwaway2016a 9y agoI 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.
- Confiks 9y agoIt'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.
- dvfjsdhgfv 9y agoNot to mention you can just use robot.move(1); robot.jump() in the main loop and complete the level with just that.
- mathgeek 9y ago> ...introduce a counter that needs checking. That would be totally counter-intuitive... Was the pun intentional here?
- Confiks 9y agoNo. In fact, initially I put "unintuitive" there, but the spelling-checker marked it as an unknown word while it is perfectly valid English.
- jlebrech 9y agodocument.write("<h1>you win</h1>")
- cdubzzz 9y agoI 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 https://github.com/bovard/raid [1] http://7drl.org/ http://7drl.org/
- throwaway2016a 9y agoReminds 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) https://en.wikipedia.org/wiki/Karel_(programming_language)
- SeanDav 9y agoOn 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.
- raresp 9y agoGreat resource for learning Javascript. Good work!
- j_s 9y agoIf 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 https://news.ycombinator.com/item?id=10763057 (Dec 2015, 40 comments) Google's Blockly Games | https://news.ycombinator.com/item?id=8211031 https://news.ycombinator.com/item?id=8211031 (Aug 2014, 18 comments) Google Blockly - a visual programming language | https://news.ycombinator.com/item?id=4050426 https://news.ycombinator.com/item?id=4050426 (Jun 2012, 123 comments) -- http://learn.code.org/hoc/1 http://learn.code.org/hoc/1 - highly polished Hour of Code https://tickleapp.com/ https://tickleapp.com/ - Blockly <-> Swift controlling physical hardware
- xori 9y agoAnother example in Action/RPG format https://codecombat.com https://codecombat.com
- adbachman 9y ago:/ 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.
- reaal 9y agoSorry about that, I lazily made the page refresh to restart a level, will fix!
- reaal 9y agoUPDATE: I've fixed the issue where restarting the level clears the script
- benlower 9y agoStops working for me after level 1. Repro: 1. https://lab.reaal.me/jsrobot 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 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.
- TruthSHIFT 9y agoI'm get the same error in Chrome 61.
- reaal 9y agoSorry about that, fixed
- allenleein 9y agoThis game is simply amazing. Better interactive tutorial for beginner than Codecademy.