Home

Programming Trivia App

Posted by patorjk | Web Apps | Saturday 23 April 2011 4:23 pm

Photo By Mirko Junge

This has been on my computer for months and while it’s not completely finished, I wanted get a version up since I’m starting work on it again, so I present Programming Trivia Questions.

It’s born out of the basic idea I had for my old Programming Quiz App, which I released last year. Shortly after creating that app I realized that creating a list of good quiz questions was actually kind of hard, and expecting someone to write a full, non-goofy quiz was probably too much. However, coming up with a question or two is usually pretty easy. So I figured I’d change the app to be like a question database where questions were tagged with certain keywords, and the user could just select categories and get questions on those categories.

I’m not at that point yet, but I have a working demo with 20 questions. The next step will be to connect it up to a database (right now it’s all client side) and then to allow users to submit questions. Anyway, I figured 20 random programming-themed questions would be mildly entertaining so I figured I’d share it with you all. If you have any suggestions let me know.

Oh, one last note, my favorite JS graphing library, Plotkit, doesn’t seem like its being updated anymore (it’s a fantastic library, but the last update was in 2006). I made some modifications to it for this app (I changed how the colorscheme mechanism worked for bar charts if just one dataset was used) and am debating forking that library or using another one. If anyone has any graphing library suggestions let me know.

AAC Police Brief Analyzer

Posted by patorjk | Web Apps | Friday 15 April 2011 12:39 pm

Photo By dooq

I’ve created a new Facebook app which I call Anne Arundel County Police Brief Analyzer. I noticed my local police department had a Facebook page and that they posted their police briefs to this page. The briefs all followed the same format, so I decided to see if I could parse them to grab out some statistics.

The app is pretty simple, and right now all its doing is counting the number of times the various cities in the county are mentioned in the briefing sub-headings. Basically it answers the question: “Which cities show up in the police briefs the most?” This app would probably be more helpful with population data, however, it was mostly just done as an experiment, so I probably wont go any further with it. However, I figured I’d post it up since I found it kind of interesting.

The only hitch to creating the app was that you can only grab the 25 notes from Facebook per request, at least with their JavaScript SDK. To grab more notes, you have change the “offset” parameter (also see batch requests). Example:

FB.api("/aacopd/notes", {offset: 175, limit:25}, function(response) {
    console.dir(response.data);
});

patrickgillespie.com Update

I’ve updated the cloud code at patrickgillespie.com to now use a canvas element in browsers that support it. This leads to a much smoother appearance in Chrome and a slightly better appearance in FireFox. I tried using excanvas for the IE version, but it was too choppy for what I was doing, so the IE version still uses divs.

JavaScript Parallax Scrolling Experiment

Posted by patorjk | JavaScript,web development | Saturday 9 April 2011 3:36 pm

Parallax Clouds at patrickgillespie.com

There’s a neat CSS technique called “Horizontal Parallax Scrolling”, where background images will move at different horizontal speeds when the window is resized (example). It’s done by positioning several divs on top of each other and having their background-position property set to different offsets. You can read a great CSS tutorial on it here.

I thought it was kind of cool and decided to see if I could come up with a way of doing “Vertical Parallax Scrolling”. There are a lot of ways one could approach this, but I decided to go with fixed positioned divs that would move when the user scrolled the page up and down. These divs would be attached to the background and a content div would sit on top of the background which would have a z-index higher than any of these fixed positioned divs. All content for the page would go inside of this content div. I figured this approach would suit me well since I was thinking of creating something where there’d be lots of floating objects in the background.

After playing around a bit I came up with something that worked reasonably well in IE7+, Firefox and Safari, and ok-ish in Chrome. The effect was neat and 3D-ish, so I decided to use it at patrickgillespie.com. It replaces the silly CD cover experiment I’d previously hosted there. The effect is still not as smooth as I’d like it, but I think for a really nice smoothness I’d probably have to use a canvas element instead of a bunch of divs. Anyway, if you’re interested, I’ve put together an example which you can download here.