JavaScript Snake | patorjk.com

During my senior year of high school, I took an independent study course in C++. Originally it had been a full fledged C++ course, but since only 4 students signed up, the school put us all in its independent study program instead. The program worked by allowing students to work by themselves to create a project, and at the end of the semester each student would present their project to a committee to show that they had actually learned something.

On the surface it seemed like a great program, but the school did its hardest to keep us from learning anything. The lady in charge of the program forbid us from using the computers that had C++ compilers, claiming they were “too old”, and we weren’t allowed to install anything on the computers we did have access to.

At first we were resilient and installed compilers we found online anyway. But getting caught got us in a lot of trouble, and this lady was mean – at one point yelling at me for a solid 20 minutes for breaking one of her rules. This environment wore us down, and eventually we resided ourselves to knowing that we weren’t going to efficiently learn anything about C++ while we were at school, so we used a lot of our time to goof off.

It was during this time that I discovered the game of Snake. When I was tired of reading up on programming or dealing with crap from the lady in charge of the computer lab, I’d blow off steam by playing online games. Sometimes I’d spend the whole hour and a half period playing games. Of these games, Snake ended up being my favorite. I honestly sucked at it then and still suck at it now, but it was pretty mindless and actually pretty fun.

A few days ago, while working on some other JavaScript project for this site, I randomly started thinking about these olden days. After remembering how much I loved Snake I thought to myself “Hrm, I bet I could write a version of Snake entirely in JavaScript”. Since Snake is such a simple game, I decided to run with the idea and try and crank out a JavaScript version as quick as possible. You can see what I’ve got so far by following the below link:

http://patorjk.com/games/snake

That is fresh from my hard drive, and it’s a really bare bones version. I hope to add a couple more features and to optimize it some over the next week. Since JavaScript is interpreted, the game may be a little jumpy on some of your computers (let me know if you have any major problems). When it’s totally done I’ll probably also post the source as a JavaScript example. You could peak at it right now if you wanted, but it’s in a not-ready-for-prime-time state right now.

As an aside, under the hood the snake is a linked list. I googled “JavaScript linked list” for some quick linked list code and came across this link, which is actually pretty nifty. It’s worth a look if it’s been a while since you’ve done anything with linked lists.

TAAG

TAAG was updated with a couple of fonts (they all start with “JS”) and I fixed up the feature that allows you to share messages you create with others.

16 thoughts on “JavaScript Snake”

Snake is always entertaining, and I remember your Flash-based version, which was pretty cool.

Thanks. The Flash version actually still works over at archive.org. I thought about posting it here, but then decided against it since I knew that not being able to ever make a change to it might make me a little crazy.

Why can’t you make a change to it? Unless you obfuscated it you can still decompile it and retrieve all the ActionScript bytecode.

I could, but if it doesn’t return my original code, reading the decompiled code would be a pain in the butt. That is an intriguing option though, I may look into it.

Have you tried flasm? I’ve never really done too much work with Flash or ActionScript, and I know that these days a lot of people obfuscate their code so it is more difficult to properly decompile, but on every Flash file I have viewed with the tool I was able to retrieve each statement without any difficulty.

Hrm, it doesn’t look like it’s a real decompiler, I’ll look into it more though. It sounds interesting from the tidbits I read on it.

There’s always the SoThink SWF decompiler, which will allow you to export all the objects as well (audio, video, sprites, ActionScript, et cetera), but it’s not free (wink wink).

you could really learn modern javascript programming. Instead of using milions of div’s you can use only number of divs required to construct a snake and apply them position: absolute. Then you can move them around with top and left css style. the primer is my website.

btw, noone really cares about the old days. new days are here, and they are here to stay

tramak – I can’t decide whether you’re trying to be helpful or whether you’re trying to be a dick. The way you worded your comment seems a little condescending. I appreciate friendly advice, but I’m not really sure that’s what the aim of your comment is.

What is your definition of “modern javascript programming”? And what is your main issue, that I have a set up where each block of the snake is its own div (pulled from a pool of 2,000 divs – not millions) rather than having a set up where the snake is drawn with the least number of divs?

I picked the implementation I did because I knew it’d be easy to implement and work with. Other than a possible improvement in load time (which I don’t think is that bad currently), I don’t really see a compelling reason to go back and change how the snake is drawn.

I should also add that my snake is much more responsive than your snake. Try creating a stair case effect with the snakes for the full length of the board (rapidly pressing the Left Arrow and then the Up Arrow). I can easily create the effect with my snake, but I cannot get your snake to do it for the full length of the board.

I love playing your Snake game and Snake games in general. It’s a simple concept but really addictive just like other classic games from Space Invaders to Pacman. Modern games are rubbish! LOL