<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
	xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
	>

<channel>
	<title>Joe Fleming dot net &#187; Javascript</title>
	<atom:link href="http://joefleming.net/category/software/javascript/feed/" rel="self" type="application/rss+xml" />
	<link>http://joefleming.net</link>
	<description>what you see is what you get</description>
	<lastBuildDate>Wed, 26 May 2010 19:25:49 +0000</lastBuildDate>
	<generator>http://wordpress.org/?v=2.9.2</generator>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
			<item>
		<title>Fallout 3 Terminal Hacker</title>
		<link>http://joefleming.net/2009/01/30/fallout-3-terminal-hacker/</link>
		<comments>http://joefleming.net/2009/01/30/fallout-3-terminal-hacker/#comments</comments>
		<pubDate>Sat, 31 Jan 2009 01:53:42 +0000</pubDate>
		<dc:creator>Joe</dc:creator>
				<category><![CDATA[Games]]></category>
		<category><![CDATA[Javascript]]></category>
		<category><![CDATA[Software]]></category>

		<guid isPermaLink="false">http://joefleming.net/?p=54</guid>
		<description><![CDATA[I recently started playing the game Fallout 3 a little more and I came across a terminal I could actually attempt to hack. After a few failed attempts at it, I thought I would poke around on the Internet and see if anyone had any guides for hacking the things. Instead, I found this online [...]]]></description>
			<content:encoded><![CDATA[<p>I recently started playing the game Fallout 3 a little more and I came across a terminal I could actually attempt to hack. After a few failed attempts at it, I thought I would poke around on the Internet and see if anyone had any guides for hacking the things. Instead, I found <a rel="ext" href="http://mediumexposure.com/dev/f3hack/">this online terminal hacker</a>, among others (this was the best one though). I thought, &#8220;man, that&#8217;s pretty slick, but I wish I has something that I could run locally in the event my Internet was down.&#8221; I poked around online a little and found a bunch of people claiming to be prepping downloadable, standalone versions, but nobody had yet delivered. Then I thought, &#8220;I bet I could write me own,&#8221; and that&#8217;s exactly what I did.</p>
<p>The rules for hacking the terminals are:</p>
<ul>
<li>You get 4 tries, after which you can never try again</li>
<li>If you exit before the 4 tries are up, your available tries reset to 4, but so does the puzzle</li>
<li>For each word you pick, you will be told how many matching letters you got</li>
<li>That count is how many matching letters there are in the SAME position of the correct word</li>
</ul>
<p>Originally, I was going to write it in Python. That way I could potentially execute it from anywhere I could install the Python interpreter and it would give me a reason to dive in to Python. Then I decided I wanted it done quick, and in an even more portable way; as a raw HTML page. So, I decided to write my version in Javascript, and <a rel="ext" href="http://joefleming.net/files/fallout3terminalhacker.html">here it is</a>!</p>
<p>I used the one over at mediumexposure.com as a benchmark and honed mine down a bit (I didn&#8217;t catch that last rule when I was playing the game, which is why I could never figure the puzzles out). I will admit, mine isn&#8217;t as smart as his since it doesn&#8217;t take past guesses and matches into account, only the most recent guess and the remaining list of possible words. So, there&#8217;s a chance mine won&#8217;t guess correctly in the 4 attempts, but in the handful of tests I ran, I always managed to get it.</p>
<p>Now, I know what you might be thinking. &#8220;Hey, this is just another online file, how is this portable? How can I run it from my machine?!&#8221; Simple, save the html file to your computer and open it locally. All of the magic happens in the Javascript code (which I commented so you can follow along), which will run from your machine without the need for any extrernal processing or server. Go ahead, give it a spin and be sure let me know what you think in the comments. It&#8217;s a work in progress, so when I make it smarter, I&#8217;ll update the file and post again. Enjoy!</p>
]]></content:encoded>
			<wfw:commentRss>http://joefleming.net/2009/01/30/fallout-3-terminal-hacker/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Mootools, I Choose You</title>
		<link>http://joefleming.net/2008/07/04/mootools-i-choose-you/</link>
		<comments>http://joefleming.net/2008/07/04/mootools-i-choose-you/#comments</comments>
		<pubDate>Fri, 04 Jul 2008 15:00:53 +0000</pubDate>
		<dc:creator>Joe</dc:creator>
				<category><![CDATA[Javascript]]></category>
		<category><![CDATA[MooTools]]></category>
		<category><![CDATA[Open Source]]></category>
		<category><![CDATA[Software]]></category>
		<category><![CDATA[Web Development]]></category>

		<guid isPermaLink="false">http://joefleming.net/?p=24</guid>
		<description><![CDATA[I&#8217;ve always been a &#8220;do it yourself&#8221; kind of web developer, but after reinventing the wheel time and time again and struggling to make my code work in the various different browsers out there, I&#8217;ve come to appreciate that I can save a TON of time through different libraries and toolkits. I&#8217;m no Javascript pro [...]]]></description>
			<content:encoded><![CDATA[<p>I&#8217;ve always been a &#8220;do it yourself&#8221; kind of web developer, but after reinventing the wheel time and time again and struggling to make my code work in the various different browsers out there, I&#8217;ve come to appreciate that I can save a TON of time through different libraries and toolkits. I&#8217;m no Javascript pro (though I am the resident guru at work), but I find the language interesting. Ever since Google came along and showed the world that Javascript can be used for more than just popups and other web annoyances, I&#8217;ve been enthralled with some of the cool things people have done with Javascript. From <a href="http://en.wikipedia.org/wiki/AJAX">AJAX</a> to <a href="http://en.wikipedia.org/wiki/Comet_(programming)">Comet</a>, simple <a href="http://www.dynamicdrive.com/">DHTML</a> to <a href="http://script.aculo.us/">animations</a>, it&#8217;s simply been an amazing evolution.</p>
<p>About a year ago, Aaron tipped me off to the magic of Javascript toolkits, specifically <a href="http://dojotoolkit.org/">Dojo</a>. For a while, I was a proponent of it, opting to use it exclusively to drive an internal application that I had written from the ground up at work. It&#8217;s an extremely powerful toolkit which has been steadily adding more functionality as it ages to that point that it&#8217;s arguably the most powerful toolkit on the market. Unfortunately, I&#8217;ve also found it to be one of the most poorly documented toolkits available as well, which I&#8217;m sure was due in part to my lackluster understanding of some of the more advanced Javascript concepts. Still, looking at some of the more advanced Dojo examples I&#8217;ve seen from Aaron and other sources online, most of the syntax escapes me completely, even as I continue to learn more and more about Javascript.<br />
<span id="more-24"></span><br />
At the time I started using it, I was working with version 0.4.1, and as anyone with some Dojo experience can attest, it&#8217;s a far cry from where the 0.9 and and later branches ended up. I&#8217;ve since upgraded to 0.4.3, but porting everything over to the 1.0 branch would have taken about as much time as moving over to a completely different library. The 0.9+ branches also officially did not support Safari 2, which was a huge problem considering we&#8217;re an all-Mac shop. It also meant that production-side adaptation was pretty much out of the question as it&#8217;s a safe assumption that the majority of people using any software are drastically behind on their updates, if they ever even choose to perform them. For a company that makes most of its money by sales through the website, we just can&#8217;t afford to exclude and entire sector of people like that.</p>
<p>With all that in mind, I decided I&#8217;d poke around and see what else was out there as a possible Dojo replacement. A couple months ago, Aaron tipped me off to <a href="http://www.mootools.net/">MooTools</a>, which seemed like a nice mix of <a href="http://www.prototypejs.org/">Prototype</a> and the Scriptaculous animation library that was built on top of it. I had passed it on to my boss as something to check out but it was kind of left at that, though I did plan to learn it on my own time.</p>
<p>About a month after that, we hired a new designer at work, mostly so my boss could focus more on PHP and MySQL code and not just the design of both the site and various ads (which had become a full-time job). During his first week there, the new guy happened to stumble across the MooTools library on his own and suggested that we use some of the animations in the library to spruce up the site a little, though he knew absolutely nothing about Javascript. Of course, being the resident Javascript guru in the office, I was asked to look into what it would take to make it work. </p>
<p>I had spent a little time the previous week sifting through the APIs and docs of various other toolkits and libraries to try and narrow them down into a proper replacement for my aging Dojo code. I had actually planned to start making use of the <a href="http://extjs.com/">Ext toolkit</a> since it was a good compromise for Dojo; the code and feature set were very similar and their API and documentation was much easier to follow than that of Dojo. But, it wasn&#8217;t enough for me to consider introducing yet another Javascript library into the code base, and it made no guarantee about working with Safari 2. </p>
<p>Of the two other programmers in the office, one had been using <a href="http://jquery.com/">jQuery</a> for about as long as I had been using Dojo while the other had just started to implement MooTools into another piece of software he had written from the ground up. Since those two were already in out code base, they scored extra points and earned my attention over some of the other libraries. </p>
<p>Since MooTools was called for in the case of this particular animation, I spent a little time reading through the <a href="http://docs.mootools.net/">API</a> and the <a href="http://clientside.cnet.com/wiki/mootorial">Mootorial</a> and picking apart some of the <a href="http://demos.mootools.net/">demos</a> available on the MooTools site. To my surprise, it started to make sense very quickly; their API is extremely well put together (with a few fringe exceptions), I found the code and syntax very easy to comprehend, and best of all, I managed to get the animation working in only a few hours having never worked with the library in the past. </p>
<p>I then proceeded to port all of my Dojo code to MooTools, and in about two days time I was done. I even added some snappy fading and scrolling animations to the system with gave it a really nice polish. It all loads significantly faster to boot! I took another day and a half and added some drag-and-drop functionality that I had been planning since very early on in the project, something I still don&#8217;t even know how to approach with Dojo but made quick work of with MooTools, even adding heavy modifications to meet my specific needs. I&#8217;ve also learned a ton more about Javascript, written my own MooTools menu class from scratch (mostly as a learning experience) and rolled out some cool new things to our production website. I&#8217;ve drunk the milk and now I&#8217;m hooked. I can&#8217;t imagine ever working with raw Javascript again to be honest.</p>
<p>But, MooTools isn&#8217;t for everyone. It&#8217;s meant to be more of a core library that you extend and use to build your applications quickly. It also has one very significant downside; like Prototype, it extends the base Javascript prototype, meaning it could break existing code you have. It&#8217;s probably rare that it would (I haven&#8217;t run into it personally), but it&#8217;s a consideration. It also doesn&#8217;t play well with other libraries and toolkits as a result.</p>
<p>The point of this long-winded post is simply that I have become a huge MooTools fan, and if you have a project that would benefit from a well-documented, cross-browser library with some really easy animations and extremely useful functionality, you may too. Check it out, I think it&#8217;ll be worth your time.</p>
<p>One note I want to make is that I wrote this before MooTools 1.2 was released. For the record, I love the changes that were made; it&#8217;s much faster, there are a lot of cool tweaks that make it easier to use and it adds a lot of very useful new methods. That said, I think their new documentation page and demos page are just terrible! In addition, they&#8217;ve completely disabled their forums in favor of Google Groups, which means any old discussions and examples now only live in Google&#8217;s cache despite them coming up in their search very often. Those of you look for 1.11 docs and demos, see <a href="http://docs111.mootools.net">here</a> and <a href="http://demos111.mootools.net">here</a>, respectively.</p>
]]></content:encoded>
			<wfw:commentRss>http://joefleming.net/2008/07/04/mootools-i-choose-you/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Valid XHTML and Opening Links in New Windows</title>
		<link>http://joefleming.net/2007/12/16/valid-xhtml-and-opening-links-in-new-windows/</link>
		<comments>http://joefleming.net/2007/12/16/valid-xhtml-and-opening-links-in-new-windows/#comments</comments>
		<pubDate>Sun, 16 Dec 2007 23:28:28 +0000</pubDate>
		<dc:creator>Joe</dc:creator>
				<category><![CDATA[Javascript]]></category>
		<category><![CDATA[Site News]]></category>
		<category><![CDATA[Software]]></category>
		<category><![CDATA[Web Development]]></category>

		<guid isPermaLink="false">http://joefleming.net/2007/12/16/valid-xhtml-and-opening-links-in-new-windows/</guid>
		<description><![CDATA[Well, as you can plainly see (assuming you&#8217;ve been here before), the site has gotten a facelift. Now that Aaron has his blog up and his looking really nice, I felt compelled to try and jazz up mine a little too. It&#8217;s not done, but it&#8217;s nicer than it was. I&#8217;ll probably add a touch [...]]]></description>
			<content:encoded><![CDATA[<p>Well, as you can plainly see (assuming you&#8217;ve been here before), the site has gotten a facelift. Now that <a href="http://aaronstaves.com/" rel="ext">Aaron</a> has his blog up and his looking really nice, I felt compelled to try and jazz up mine a little too. It&#8217;s not done, but it&#8217;s nicer than it was. I&#8217;ll probably add a touch of color to the theme, but it&#8217;ll work for now. BTW, it&#8217;s based off the <a href="http://weyland.be/wrdprss/index.php/2006/01/05/wordpress-theme-milc3-35/" rel="ext">Milc 3.5</a> theme. The code isn&#8217;t super pretty, but it was a good start.</p>
<p>While I was working with the design, I realized that I needed to send over my old bit of code that opened links in new windows. As anyone trying to make valid XHML pages can tell you, the <em>target</em> attribute is no longer valid, so if you want pages to open in a new window and you still want your design to validate properly, you have to do a little scripting. I actually found this script a couple years ago to make MediaWiki links open in new windows and it&#8217;s served me quite well ever since.<br />
<span id="more-16"></span></p>
<pre>
function makeExternal() {
        //make sure the function works
        if (! document.getElementsByTagName) { return; }
        var myRegExp = new RegExp("ext","i");
        var anchors = document.getElementsByTagName("a");
        for (var i=0; i<anchors.length; i++) {
                var anchor = anchors[i];
                if (anchor.getAttribute("alt") &#038;&#038; anchor.getAttribute("alt").match(myRegExp) ) { anchor.className+=" external"; anchor.target="_blank"; }
        }
}
</pre>
<p>You run the function at page load and selected links will now open in a new window. To make a link work this way, you add <em>rel="ext"</em> to the anchor tag, which is still valid because <em>rel</em> is a valid attribute. What's nice is this also sets up a relation between your page and the link; ext being short for external. The script parses all anchors for that <em>rel</em> attribute and if it finds <em>ext</em> in value, it appends the class 'external' and sets the target attribute of the link to '_blank'. It's a little hacky, but it works like a charm and any browser with a DOM that supports getElementsByTagName.</p>
<p>Note that you don't have to append any class name if you don't want to. I like that I can make the links indicate that they will be opening in a new window by using a little icon as you can see on this site. I like the icon MediaWiki uses a lot, but the way it uses (indicating that it's an external link) doesn't make as much sense as using it to show that a new window will open. That's my take anyway.</p>
<p>This isn't the only way to achieve this result, and Google will provide you with a million other ways, but this is what works for me. Just thought I'd share.</p>
]]></content:encoded>
			<wfw:commentRss>http://joefleming.net/2007/12/16/valid-xhtml-and-opening-links-in-new-windows/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
	</channel>
</rss>
