Generating Grids, Hexmaps, and Image Markups with JavaScript

Posted on 2nd February 2011 by Ryan Somma in Geeking Out - Tags:
Corrosion Mapping, Hotspots Highlighted
Corrosion Mapping, Hotspots Highlighted
(Not an Actual Report Image)

One application I had the honor of working with in my time with the Coast Guard was a Corrosion Mapping tool used by Engineers to track the wear and tear on aircraft parts over their lifetime. Using an Active X control, users would bring up a TIF of an aircraft part, and then click on grid coordinates laid over it to identify places where corrosion was noted. These X and Y coordinates were then saved to the database, where they could be tallied in reports, with the number of occurrences of corrosion highlighted to identify weak points in the parts. It looked something like the image above.

I recently tried to reproduce this functionality with JavaScript for an application where researchers would mark incidents of contamination on a building floor plan in order to determine the radius of the area that would need to be sterilized. Here are three JavaScript variations on this theme of plotting coordinates on a grid.

[Continue Reading…]

What’s the Right JavaScript Framework, If Any?

Posted on 3rd March 2010 by Ryan Somma in Geeking Out - Tags:
JavaScript Frameworks
JavaScript Frameworks

I recently checked out Google’s AJAX Libraries, which, aside from being inaccurately titled, provides a means for web developers to access functionality in a wide variety of popular JavaScript frameworks and toolkits without having to host the libraries themselves. Simply include the base Google library, and then use it to load whatever framework you want to access in you code. It’s not for me, as I’m a total control-freak when it comes to production implementations of my code, and I don’t like having my web pages hang up trying to access URIs on outside domains, which definitely happens to the code I run locally using this tool; however, it does provide a convenient playground for testing out different JavaScript frameworks and toolkits.

You can do anything with JavaScript, but you have to program around its shortcomings. How JavaScript functions depends on the ECMAScript engine running it, with Firefox running TraceMonkey, Chrome running V8, and Internet Explorer running Trident, it makes it difficult to write code that runs the same in all browsers. Then there’s JavaScripts’ object-orientation strategy, which uses prototype chains for inheritance, confusing most OO programmers. Finally, there’s some major oversights in JavaScript functionality, like the fact that it lacks a trim() function.

There are two types of JS Frameworks, those that extend JS functionality for the advanced programmer and those that simplify coding for the novice. If you’re an advanced programmer, it’s nice to have true object-orientation in your JavaScript. If you’re a novice, it’s nice to be able to whip out some fancy special effects with just a few lines of code. What follows is my understanding and impressions of these frameworks as I used Google’s Libraries to play with them.

[Continue Reading…]

The Power of JavaScript

Posted on 10th February 2009 by Ryan Somma in Geeking Out - Tags:

I’ve been out of the loop when it comes to all the web development advances that have occurred in the last five years, and am now just getting up to speed on them for a project to modernize our Asset Logistics Systems at work. The area most changed since I went into my ASP cave is JavaScript. What with all the HTML DOM manipulation methods, object oriented programming support, asynchronous calls and whatnot, it’s become a whole new playground.

Yesterday I found this incredible example of what JavaScript can do. It’s written entirely in JavaScript, no graphics, no flash, just script (I apologize for the fact that playing this will cause your browser to scroll):

(Sorry, had to take it down b/c the onfocus was messing up the blog mainpage.)

There’s a larger version with music you can play. For more JavaScript game experiments, click here.

JavaScript Turing Machine

Posted on 5th February 2009 by Ryan Somma in Geeking Out - Tags:

So I was watching the anime series Ghost in the Shell and I don’t feel productive when I’m just watching anime, and I can’t write words when watching videos, so I decided to do some programming purely for fun.

What I did was write a little demonstration of a Turing Machine. Before there were computers, Alan Turing proved on paper that a machine could perform complex tasks. With a strip of paper divided up into places, the machine may read or write a symbol to its current place, move to another place, or change its state. This way it moves up and down the tape, reading and writing symbols, and, depending on its algorithm (instructions), performs calculations.

A Turing Machine

A Turing Machine

The table below is a JavaScript representation of one such machine. Using five tuples worth of instructions, the machine adjusts the ones and zeros to count upwards in binary. With eight positions on the tape, the machine can count up to 255. You may Start the demonstration, or Step through it. The + and symbols speed up or slow down the execution of steps.

The HTML page is located here. If you’d like to download the code, right click on the link, and select “Save link as…” and then edit the code in notepad to play with it. This code could certainly be written more elegantly, but Ghost in the Shell was pretty engaging, and the more basic code more appropriately speaks to the basic mechanics of what this demonstration is supposed to demonstrate.

If you don’t feel like rewriting JavaScript code, you can check out a programmable Java Turing Machine here, with instructions on its very simple programming language here.