Month of Code 24/25 – Space+Cursor

As you know, I’ve been a little busy this past week, getting ready for Germany. However, I decided to take some time to throw together a little something [warning – autoplaying music] for Month of Code. I started this on the 24th, when the theme was “space”. I didn’t have time to finish it then, so I rolled in the 25th’s theme, “cursor.” It’s still not done (and is actually part of a bigger, secret project I eventually aspire to do), but enjoy! At the very least, enjoy the soothing music of Kevin MacLeod.

Month of Code 14 – Loop

HAPPY PI DAY!

In honor of this day, I decided to make a pi-related loop hack. Don’t take the results to seriously, but it’s a fun little demo.

The code for the loop is using the Leibniz approximation of pi. The for loop uses

var pi=0;
var n=1;
for(var i=0;i<100000000;i++) {
    pi=pi+(4/n)-(4/(n+2));
    n = n+4;
}

The while loop looks like this:

var pi=0;
var n=1;
var i=0;
while(i<100000000) {
    pi=pi+(4/n)-(4/(n+2));
    n = n+4;
    i++;
}

Informally, my testing showed that the while loop was consistently just a hair faster.

Month of Code 11 – ASCII

I’m going off-canvas today! Today’s entry is an ASCII background generator. It’s really quite straightforward. The background is really just a div. The background color of the div and the font color are similar to create a cohesive feel. The div is then filled with random characters from the ASCII set, codes 33-255 (uses the extended ASCII table). Over top of that, a slight blur is applied so the user can’t immediately distinguish the characters.

I think it turned out pretty well! You can even try resizing it – the background will respond, giving almost a static-like effect. The concept is actually pretty simple and significantly lighter weight than a full-screen image, but provides a similar effect. Additionally, it would be pretty simple to change colors and character sets, and I’ve even considered subtle patterns as well, but didn’t really have time for it today. Look for this in the future.

EDIT: Added a few color variations and two additional basic patterns!

Month of Code 10 – Switch

Today’s theme connection is most definitely a stretch, but I wanted to do a little work on something I started a long time ago, a space shooter. This space shooter is built using the Animatron player, a tool built by the company I worked for over the summer.

The shooter, just like yesterday’s submission, just contains some basic game features and is nowhere close to a full product, but what I’ve got is pretty decent. The background is randomly generated, the “spaceship” can move up and down, and fires bullets. The “switch” tie-in is a stretch, but when the ship fires, the ship switches colors. The idea would be that the shot style changes with each shot. Like the Raiden series, but a little more rapid.

Give it a whirl!

Month of Code 9 – Jump

Have you ever played Thomas Was Alone? Today I played it for the first time, so naturally this was my inspiration for today’s daily code.

Month of Code 9 – Jump

The controls are either wasd or arrow keys, and spacebar to jump. The red rectangle (AKA “Thomas”) is bounded by the sandbox, but the idea would be to add an environment as a 2d platformer.

Edit: I added some basic randomly generated terrain as a demo.

Month of Code 7 – Input

Today I wrote a quick little input chart. The x-axis is time as it passes, and the y-axis is change in cursor position (using Euclidean distance). Rather than reinvent the wheel, I used Smoothie Charts to handle the graphing aspect. All I did was track the mouse position and generate the data to throw onto the chart.

There’s an interesting bug that I’m working on. Currently, it’s working properly for a few seconds (about 5), and then it seems to zero out the change value every other data point, generating a very noisy graph. I’ll be taking a look at this later tonight in more depth to try to fix it.

Demo here.

Month of Code 6 – Time

Today’s theme was Time. I went literal again and made…a clock. It’s not your ordinary clock, but it’s pretty close to it.

Month of Code 6 – Time

My largest challenge was initially trying to calculate the triangles to draw, but then I decided to just draw arcs (the canvas crops the rest). Outside of that, the program is straightforward. Each hour is based on a root color from an accented analogic set of colors. For each “minute” section, the root color is then shaded to add a little more dynamic feel to it.

In case it’s not clear, the longest hand is the seconds, the middle-sized is the minutes hand, and the short wide one is the hour hand.