Last year I took a course on Fourier Series, and a lot of it was huge integrals of trigonometric functions. So. Many. Integrals. But one thing did stick with me, and that is that since $\{ e^{in\theta} \mid n \in \mathbb{R} \}$ forms a basis on $f: \mathbb{R} \rightarrow \mathbb{C}$, any vector in that space (which in this case would be continuous functions that take a real number and return a complex number) can be written as an infinite sum of complex exponentials. But wait! Complex exponentials are just rotated circles. And you know what else are complex continuous functions of real numbers? 2-dimensional parametric curves.

I was going to make a game (I even tried my hand at some pixel sprites– maybe I’ll get back to them), but I didn’t like C++ (although it is refreshing to be in control of everything, compared to something like Python), so I tried looking for alternatives. I wanted something functional (while aware of the memory issues associated with immutability), and the Internet suggested Clojure. Its parentheses-infested syntax reminded me of Lisp, which reminded me of that one time I created a symbolic differentiator in Lisp. So I tried my hand at an equation solver.

This has been half a year now in the making. I don’t know what to say other than that I am glad that it is now over. What started out as something that was supposed to be a week long project (which originally it was) has turned out to be one of the largest projects I have ever done.

This is such a small endeavor that I can’t really call it a project- really, the only reason I’m even uploading it is because of how short it took. I came across a situation the other day when I was using Messenger to chat with some friends, where I would find it very awkward to type for a stretch of time and then move my hand to the mouse to switch conversations. So I created a simple script that uses tab and shift-tab to move back and forth between conversations.

It’s been a while since I’ve updated this site, but I promise I’ve been doing things. Now that it’s break once again, I’ll probably be uploading posts on the things I’ve been doing recently. Here’s something very small I’ve worked on for the past two days. I just found out about reactive programming (a few years late to the party it seems), and I wanted to use it in a project. A friend had recently started to learn Morse Code for fun, and the aspect of timing seemed like a pretty good reason to implement a Morse Code notepad with reactive programming. It’s a pretty simple project, but the code was fun to write.

Spring break is pretty much almost over (whyyyy), and I’ve been quiet, but that’s because I’ve been working on a new project for the past week now. I actually don’t remember how I came up with the idea, but I do remember that it hit me out of nowhere, and that led me to plop myself in front of my laptop and code for the rest of the night. Countless all nighters were pulled, and I’ve basically become nocturnal now. I’d say it’s pretty worth it, given how much I did accomplish, and it looks really good right now in my opinion (relative to anything I’ve done thus far). Of course, I’m not done yet, but I’ve hit coder’s block, so I’m taking a break to document everything I’ve done so far.

I finally got around to changing the layout of this blog. It wasn’t as painful as I’d expected it to be, much of the headache came solely from overlapping CSS class names (that was such a pain).

In addition, blog format changes to come for future posts! I think these changes will much better serve the purpose of this blog.

Zombit Monitoring

(!!!) If you’re doing the challenge, be honest to yourself and try to find a solution of your own! Really, it’s soo much more rewarding. Besides, I’m sure Google isn’t testing you on your ability to use their search engine.

This isn’t quite JavaScript, and nor is there any fancy visualization to go with it. Instead, I present my (I like to think) quirky solution to Google Foobar’s “Zombit Monitoring” problem. I had the next Foobar challenge available to me for a while, but I hadn’t touched it, until recently when I watched an inspirational YouTube video. Of course, my first attempt at a solution doesn’t work (I’m sure that with some tweaking it could work, but I was lazy), but that’s okay, because that led me to this solution, which I found much more conceptually intriguing than the one I’d originally worked on.

This small demonstration is based on something I noticed while on vacation on the west coast; when walking in a line, even if the front most person walks in a seemingly random and erratic path, the people towards the back manage to walk in smoother paths. The right-most section represents the erratic behavior, while the rest of the sections are merely instructed to “walk” in the direction of the circle in the section to its right. As predicted, the circles towards the left tended to have smoother paths. It struck me that this behavior is reminiscent of the Taylor series, with each section being the “derivative” of the section to its left in the sense that the prior determines the latter’s slope. I’d encountered problems of smooth random walks in the past (this problem being no exception: I had first tried to create a smooth random walk for the right-most circle but gave in for a simple Math.random() function), but although this is technically a random walk in one dimension in the sense that the x velocity is constant, this potentially gives a starting point for true 2D random walks.

3d (part 2)

Before I say anything let me say that first of all, this engine was made with only purpose in mind being to run on this “game”, and second of all, it’s not even a fully designed engine. I used many shortcuts such as fixing the camera at (0,0,8) and skipping many matrix operations because matrices scare me (I haven’t looked at matrices in class since almost two years ago). I had gotten to the point where I could draw any number of boxes on the screen, and seamlessly rotate the scene as I pleased, and then I tried to color the boxes, and that’s where things went wrong. The problem arose when trying figure out the order in which to draw the objects, so that faces towards the back don’t appear in front of faces towards the front. Aside from checking every pixel and even maintaining a z-buffer the size of the screen (this reduced the fps from a hearty 60 to 15), I was stumped. For a first stab at 3d though, I feel like it turned out much better than I’d expected it to (although not as good as I’d hoped). The value was in the exploration of the inner structures,though, rather than an actual practical implementation. All in all, it was a good experience.

3d (part 1)

One day in the car I was thinking about possible games I could develop, having just developed Insanity. One of the ideas was a 3d room with obstacles, but a catch that you could only observe one dimension/side at a time. It sounded like a great idea at the time, so I went ahead and looked into some 3d options. I had tried to look into 3d development before, but all the options out there (a few I looked at were Three.js and Unity) looked really scary coming from a 2d development background. Fortunately, CSS3 provides 3d transform functionality, which I dove straight into. Everything was super easy! Self-explanatory function names, intuitive use- it was paradise, and I had loads of fun. Since the 3d transforms are meant to modify 2d screen elements, I put together my own function to create a 3d prism which made the use of 6 divs for faces and used CSS to transform them relative to each other and to the center. Unfortunately, using only HTML5 and CSS3 limited the tools I could use (namely canvas), so I trashed CSS3/HTML5 with a heavy heart and set out to “make my own 3d engine”.

insanity

UPDATE (June 28, 2015) - The Ionic port was so horribly unoptimized that it was virtually unplayable, so I threw in the towel and picked up Lua in order to use Corona. It was a great decision, the game runs very smoothly now, and I have much more control over the app as a whole (I no longer have 7 permissions related to audio just to play a sound file!). It also makes porting to iOS much easier, but some functionalities have to be modified, so I’ll leave that aside for now.

UPDATE (June 17, 2015) - So I know I have been very quiet recently, and that’s because I’ve been working on an Android version for this game! It’s really been an experience, this being the first real app that I’ve made on Android (although I cheated a little by using the Ionic Framework). Anyhow, it’s not the best port possible, and definitely not optimized, but I learned a lot! If it gets enough requests then I might port it to iOS as well, but for now, I’m happy with how it came out.

I came up with the idea of this game out of the blue whilst Skype calling my coding friend. On a whim I decided that “I would not go to sleep until I coded the whole thing”. I ended up staying up until 7 AM (starting at 12 AM) coding the basic framework for the game, which included the recursive backtracker for the maze and the player physics. Later today I added a points and level system along with a better looking GUI to complete the final product. I’d have to say that the hardest parts were the maze generation and the splatter graphics. Otherwise, I’m very content with how this mini project turned out.

tetris

Classic games: DOM edition part 2. Once again, using <table>’s and a lot of jQuery, I made Tetris. At first I thought this would also be a day long project, as it was with Minesweeper, but it took significantly longer. I didn’t realize at first how much logic went into programming Tetris. Also, callbacks! I made my very first function that uses a callback, and it makes me feel so powerful. Javascript is love, Javascript is life. Anyway, something about the animation loop makes the input a bit buggy, but I’m too lazy to fix that. I like the way the borderless tiles look. Thanks CSS.

minesweeper

I was talking to a group of friends about our earlier coding days, and some classic beginner projects like Pong and Tic Tac Toe came up. I’m pretty sure all of us on the inside were reflecting on our horrible coding practices which thankfully we’ve gotten rid of now. Minesweeper piqued my interest because I’d never coded it before, and I’d enjoyed playing it a lot when I was younger. Instead of using <canvas> for the graphics, I went with <table>, css styles and jQuery click events. This project took an hour longer than it needed to because I didn’t realize that my recursion function had no terminating case (s/o to Tony for laughing with/at me the night before the Computer Science AP Exam). Oops.

exeter chatrooms

It is clear that students in a class need to talk to each other, even more so given the cooperative nature of the Harkness method. However, there isn’t a very practical medium through which this can be accomplished. Not everyone has a Facebook, and email is too clunky, especially when involving more than one recipient. So, using Node.js and Socket.io, I created a chat room system which authenticates on the school network so that only Phillips Exeter Academy students can log in, and then provides a list of chat rooms that you can join based on your registered courses. Most of the time went into making the authentication work and working with SOAP requests on the school’s network. Given that I don’t have access to a large database, the chats are not saved, which might be a problem. Otherwise, I just need to work on prettying the login screen.

In the game League of Legends, specifically in the game client, certain notifications pop up in a fascinating animation that is just slow enough to induce a split second of heightened anticipation. Inspired by this, I took the time to research how I would do this in a browser, as the only way I knew how to make popups was with alert("this is lame");. So after a bit of javascript DOM manipulation and ten minutes of drawing mspaint swords and shields, this is what I came up with.

pi visualizer

Happy Pi day! Almost… This is a small project inspired by the work of Christian Vasile, who made many of these types of graphs (I think they’re referred to as schemaballs or something.) with other irrational numbers such as φ and e. The basic premise is that given the decimal “expansion” of a number, you take two adjacent digits and connect them with a curve (a parabola, in this case). The colors represent the first number and how far into the expansion that number is found (darker lines represent less significant figures).

finger tracking

Well, it’s supposed to be finger tracking, I had to stop working on it once finals came around. A few students and I were proctoring our school’s hackathon (HackExeter), and we came up with this idea (of course we didn’t submit to our own hackathon) to keep us amused while the other hackers hacked away. Unfortunately, we had difficulty decrypting the poorly made docs, and after 24 hours barely got the webcam to recognize a hand. Another student scolded us for using this shoddy Python library when there was a nicely documented Javascript library readily available. So although the hackathon ended, I decided to test this out. Unfortunately I ran into difficulty setting it up and before I knew it, finals week. GG. Anyway, I might work on this again in the future, and maybe I’ll post an update.

feather

This project started out as an attempt to generate a dragon fractal. I’ve been drawing dragon fractals for years, I don’t know why it only occured to me recently to try and implement it with code. After all, it’s super algorithmic, you literally do the same things over and over again. Anyway, I found that it was harder than I thought. A little bit of research later I came across iterated function systems and something called a “chaos game”, which basically attempts to plot all the points by transformations derived from a ruleset. I got it to work, but I also got the fern fractal to work, and I liked it better than the dragon fractal, plus I got it to animate, which was cool.