<?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>Schadenfreude &#187; javascript</title>
	<atom:link href="http://www.ralree.com/tag/javascript/feed/" rel="self" type="application/rss+xml" />
	<link>http://www.ralree.com</link>
	<description>Malicious enjoyment derived from observing someone else's misfortune</description>
	<lastBuildDate>Sun, 28 Feb 2010 04:18:37 +0000</lastBuildDate>
	
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
			<item>
		<title>Greasemonkey Script to get Jabber Room for Google Group Chat</title>
		<link>http://www.ralree.com/2009/03/15/greasemonkey-script-to-get-jabber-room-for-google-group-chat/</link>
		<comments>http://www.ralree.com/2009/03/15/greasemonkey-script-to-get-jabber-room-for-google-group-chat/#comments</comments>
		<pubDate>Mon, 16 Mar 2009 03:23:28 +0000</pubDate>
		<dc:creator>Erik</dc:creator>
				<category><![CDATA[Uncategorized]]></category>
		<category><![CDATA[chat]]></category>
		<category><![CDATA[code]]></category>
		<category><![CDATA[firefox]]></category>
		<category><![CDATA[gchat]]></category>
		<category><![CDATA[gmail]]></category>
		<category><![CDATA[google]]></category>
		<category><![CDATA[google chat]]></category>
		<category><![CDATA[greasemonkey]]></category>
		<category><![CDATA[hack]]></category>
		<category><![CDATA[jabber]]></category>
		<category><![CDATA[javascript]]></category>
		<category><![CDATA[pidgin]]></category>
		<category><![CDATA[script]]></category>

		<guid isPermaLink="false">http://www.ralree.com/?p=22468</guid>
		<description><![CDATA[So, today I was invited to Google Group chat for the first time.  This would be really cool on a terminal that&#8217;s not equipped with an IM client, since it&#8217;s all done through the web with flash and magic.  But, since I don&#8217;t like having 2 IM clients running at the same time [...]]]></description>
			<content:encoded><![CDATA[<p>So, today I was invited to Google Group chat for the first time.  This would be really cool on a terminal that&#8217;s not equipped with an IM client, since it&#8217;s all done through the web with flash and magic.  But, since I don&#8217;t like having 2 IM clients running at the same time (Pidgin and the Flash one from Google), I decided I needed to rip out the Jabber Group Chat Room name from the invite page.  I got some tips from <a href="http://mkokotovich.blogspot.com/2007/12/google-talk-groupchat.html">this site</a>, and wrote a Greasemonkey script to do so.</p>
<p><a href="http://www.ralree.com/newblog/wp-content/uploads/2009/03/whoa.jpg"><img class="aligncenter size-full wp-image-22469" title="whoa" src="http://www.ralree.com/newblog/wp-content/uploads/2009/03/whoa.jpg" alt="whoa" width="531" height="271" /></a></p>
<p>All you have to do is copy the room name into the <strong>Join Chat</strong> window, and put in <strong>groupchat.google.com</strong> as the server.  I hope you find it useful.  If anyone knows how to make this a link that GNOME will throw at Pidgin, let me know.  That would be awesome.</p>
<h2><a href="http://github.com/hank/life/raw/6b085700963110559c3dca29a94a701a2f0ec2df/code/greasemonkey/google_talk_chat_channel.user.js">Get the Script</a></h2>
]]></content:encoded>
			<wfw:commentRss>http://www.ralree.com/2009/03/15/greasemonkey-script-to-get-jabber-room-for-google-group-chat/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Photoslice in Bluecloth and Mephisto</title>
		<link>http://www.ralree.com/2008/01/05/photoslice-in-bluecloth-and-mephisto/</link>
		<comments>http://www.ralree.com/2008/01/05/photoslice-in-bluecloth-and-mephisto/#comments</comments>
		<pubDate>Sat, 05 Jan 2008 21:49:00 +0000</pubDate>
		<dc:creator>Erik</dc:creator>
				<category><![CDATA[Uncategorized]]></category>
		<category><![CDATA[bluecloth]]></category>
		<category><![CDATA[images]]></category>
		<category><![CDATA[javascript]]></category>
		<category><![CDATA[lightbox]]></category>
		<category><![CDATA[markdown]]></category>
		<category><![CDATA[mephisto]]></category>
		<category><![CDATA[rails]]></category>
		<category><![CDATA[ruby]]></category>

		<guid isPermaLink="false">http://www.ralree.info/2008/01/06/photoslice-in-bluecloth-and-mephisto</guid>
		<description><![CDATA[So, I found this today, and it is awesome.  I wanted it in Bluecloth so I could use it in Mephisto.  Here&#8217;s how.
First, I needed to make it so I could still do normal images, but turn on coolness if I want.  Here&#8217;s the goal I came up with for the grammar:

[![](thumburl.jpg)](imageurl.jpg [...]]]></description>
			<content:encoded><![CDATA[<p>So, I found <a href="http://www.photoslice.net/guide/">this</a> today, and it is awesome.  I wanted it in Bluecloth so I could use it in Mephisto.  Here&#8217;s how.</p>
<p>First, I needed to make it so I could still do normal images, but turn on coolness if I want.  Here&#8217;s the goal I came up with for the grammar:</p>
<pre><code>
[![](thumburl.jpg)](imageurl.jpg "Scrolly Text at top" "photoslice")
</code></pre>
<p>Here&#8217;s the first test, with a single image:</p>
<p><a href="http://ralree.com/assets/2008/1/5/foshizzlepowell.jpg" title="Colin Powell Loves you" rel="photoslice"><img src="http://ralree.com/assets/2008/1/5/foshizzlepowell_thumb.jpg" alt=""/></a></p>
<p>And now a set with a namespace:</p>
<p><a href="http://ralree.com/assets/2008/1/5/ninjabeg.jpg" title="Ninjas killed his family.  Poor guy..." rel="photoslice.bluecloth"><img src="http://ralree.com/assets/2008/1/5/ninjabeg_thumb.jpg" alt=""/></a><br />
<a href="http://ralree.com/assets/2008/1/5/South_Park_Zach.jpg" title="Zach used to look like this." rel="photoslice.bluecloth"><img src="http://ralree.com/assets/2008/1/5/South_Park_Zach_thumb.jpg" alt=""/></a><br />
<a href="http://ralree.com/assets/2008/1/5/South_Park_Hank.jpg" title="I used to look like this." rel="photoslice.bluecloth"><img src="http://ralree.com/assets/2008/1/5/South_Park_Hank_thumb.jpg" alt=""/></a></p>
<p>I did it by simply modifying the regex and image url parsing function in BlueCloth like so:</p>
<div class="CodeRay">
<div class="code">
<pre>
  <span class="co">InlineLinkRegex</span> = <span class="rx"><span class="dl">%r{</span><span class="k">
    </span><span class="ch">\(</span><span class="k">            # Literal paren
      [ ]*        # Zero or more spaces
      &lt;?(.+?)&gt;?     # URI = $1
      [ ]*        # Zero or more spaces

      (?:         # title
        ([</span><span class="ch">\&quot;</span><span class="ch">\'</span><span class="k">])    # Opening quote char = $2
        (.*?)     # Title = $3
        </span><span class="ch">\2</span><span class="k">        # Matching quote char
      )?          # Title is optional
      [ ]*        # Zero or more spaces
      (?:         # rel
        ([</span><span class="ch">\&quot;</span><span class="ch">\'</span><span class="k">])    # Opening quote char = $2
        (.*?)     # rel = $5
        </span><span class="ch">\4</span><span class="k">        # Matching quote char
      )?          # rel is optional
    </span><span class="ch">\)</span><span class="k">
    </span><span class="dl">}</span><span class="mod">x</span></span>

    <span class="c"># and later...</span>

        <span class="c"># ...or for an inline style second part</span>
        <span class="r">elsif</span> <span class="iv">@scanner</span>.scan( <span class="co">InlineLinkRegex</span> )
          url = <span class="iv">@scanner</span>[<span class="i">1</span>]
          title = <span class="iv">@scanner</span>[<span class="i">3</span>]
          rel = <span class="iv">@scanner</span>[<span class="i">5</span>]
          <span class="iv">@log</span>.debug <span class="s"><span class="dl">&quot;</span><span class="k">  Found an inline link to %p</span><span class="dl">&quot;</span></span> % url

          text += <span class="s"><span class="dl">%{</span><span class="k">&lt;a href=&quot;%s&quot;</span><span class="dl">}</span></span> % escape_md( url )
          <span class="r">if</span> title
            title.gsub!( <span class="rx"><span class="dl">/</span><span class="k">&quot;</span><span class="dl">/</span></span>, <span class="s"><span class="dl">&quot;</span><span class="k">&amp;quot;</span><span class="dl">&quot;</span></span> )
            text += <span class="s"><span class="dl">%{</span><span class="k"> title=&quot;%s&quot;</span><span class="dl">}</span></span> % escape_md( title )
          <span class="r">end</span>
          <span class="r">if</span> rel
            rel.gsub!( <span class="rx"><span class="dl">/</span><span class="k">&quot;</span><span class="dl">/</span></span>, <span class="s"><span class="dl">&quot;</span><span class="k">&amp;quot;</span><span class="dl">&quot;</span></span> )
            text += <span class="s"><span class="dl">%{</span><span class="k"> rel=&quot;%s&quot;</span><span class="dl">}</span></span> % escape_md( rel )
          <span class="r">end</span>
</pre>
</div>
</div>
<p>I also added the following to my Mephisto theme layout, in the head section:</p>
<pre><code>
   &lt;!-- Photoslice --&gt;
   &lt;link rel="stylesheet" type="text/css" href="/javascripts/photoslice/style.css" /&gt;
   {{ "photoslice/functions.js" | javascript }}
</code></pre>
<p>Once again, Ruby is awesome.  And so is Markdown.</p>
]]></content:encoded>
			<wfw:commentRss>http://www.ralree.com/2008/01/05/photoslice-in-bluecloth-and-mephisto/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Fun with browser error pages</title>
		<link>http://www.ralree.com/2007/10/26/fun-with-browser-error-pages/</link>
		<comments>http://www.ralree.com/2007/10/26/fun-with-browser-error-pages/#comments</comments>
		<pubDate>Fri, 26 Oct 2007 00:30:00 +0000</pubDate>
		<dc:creator>Erik</dc:creator>
				<category><![CDATA[Uncategorized]]></category>
		<category><![CDATA[css]]></category>
		<category><![CDATA[firebug]]></category>
		<category><![CDATA[firefox]]></category>
		<category><![CDATA[internet explorer]]></category>
		<category><![CDATA[javascript]]></category>
		<category><![CDATA[web design]]></category>
		<category><![CDATA[web programming]]></category>

		<guid isPermaLink="false">http://www.ralree.info/2007/10/26/fun-with-browser-error-pages</guid>
		<description><![CDATA[So, I though it would be interesting to mimic browser behavior with error pages.  I decided I needed to make a page that looked exactly like the Firefox Server-not-found page.  I managed to copy the source using Firebug, and I extracted the css out of the jar files on my system.  Anyway, [...]]]></description>
			<content:encoded><![CDATA[<p>So, I though it would be interesting to mimic browser behavior with error pages.  I decided I needed to make a page that looked exactly like the Firefox Server-not-found page.  I managed to copy the source using <a href="http://addons.mozilla.org/firefox/1843">Firebug</a>, and I extracted the css out of the <strong>jar</strong> files on my system.  Anyway, I ended up with <a href="http://www.ralree.info/error/errortest-ie.html.txt">some source for IE</a> and <a href="http://www.ralree.info/error/errortest-ff.html.txt">some source for Firefox</a>.</p>
<h2><a href="http://www.ralree.info/error">Test this in IE and Firefox</a></h2>
<p>I left little invisible links in each one (search for &#8216;Supplies&#8217; on the page).  I also removed all the default javascript from the Firefox version and replaced the Try Again action with a simple reload one-liner.</p>
<p>Then, I just wrote some awesome PHP to take care of which one to load, and called it index.php:</p>
<pre><code>
&lt;?php
if (preg_match('/MSIE/i', $_SERVER['HTTP_USER_AGENT'])) {
  readfile("errortest-ie.html");
} else {
  readfile("errortest-ff.html");
}
?&gt;
</code></pre>
<p>And we&#8217;re done.  Not bad, eh?</p>
]]></content:encoded>
			<wfw:commentRss>http://www.ralree.com/2007/10/26/fun-with-browser-error-pages/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Sending Adblock Google Blockers Away</title>
		<link>http://www.ralree.com/2007/08/19/sending-adblock-users-where-they-belong/</link>
		<comments>http://www.ralree.com/2007/08/19/sending-adblock-users-where-they-belong/#comments</comments>
		<pubDate>Sun, 19 Aug 2007 17:42:00 +0000</pubDate>
		<dc:creator>Erik</dc:creator>
				<category><![CDATA[Uncategorized]]></category>
		<category><![CDATA[advertising]]></category>
		<category><![CDATA[greasemonkey]]></category>
		<category><![CDATA[html]]></category>
		<category><![CDATA[javascript]]></category>
		<category><![CDATA[web design]]></category>
		<category><![CDATA[_why]]></category>

		<guid isPermaLink="false">http://www.ralree.info/2007/10/13/sending-adblock-users-where-they-belong</guid>
		<description><![CDATA[Of course I know that a simple Greasemonkey script can very easily thwart this, but I don&#8217;t expect most people to go out and find it to defeat this.  If you don&#8217;t like my google ads, you can read this wonderful entry.



function sendJerksAway() {
      // Bye
    [...]]]></description>
			<content:encoded><![CDATA[<p>Of course I know that a simple Greasemonkey script can very easily thwart this, but I don&#8217;t expect most people to go out and find it to defeat this.  If you don&#8217;t like my google ads, you can read <a href="http://google.blognewschannel.com/archives/2007/07/24/google-recommends-turning-off-adblock/">this wonderful entry</a>.</p>
<div class="CodeRay">
<div class="code">
<pre><code>
<span class="r">function</span> sendJerksAway() {
      <span class="c">// Bye</span>
      <span class="fu">eval</span>(<span class="fu">unescape</span>(<span class="s"><span class="dl">&quot;</span><span class="k">%69%66%28%24</span><span class="dl">&quot;</span></span> +
      <span class="s"><span class="dl">&quot;</span><span class="k">%24%28%75%6e%65%73%63%61%70%65</span><span class="dl">&quot;</span></span> +
      <span class="s"><span class="dl">&quot;</span><span class="k">%28%27%25%35%62%25%36</span><span class="dl">&quot;</span></span> +
      <span class="s"><span class="dl">&quot;</span><span class="k">%65%25%36%31%25%36</span><span class="dl">&quot;</span></span> +
      <span class="s"><span class="dl">&quot;</span><span class="k">%64%25%36%35%25%33</span><span class="dl">&quot;</span></span> +
      <span class="s"><span class="dl">&quot;</span><span class="k">%64%25%36%37%25%36%66%25%36%66%25</span><span class="dl">&quot;</span></span> +
      <span class="s"><span class="dl">&quot;</span><span class="k">%36%37%25%36%63%25%36%35%25</span><span class="dl">&quot;</span></span> +
      <span class="s"><span class="dl">&quot;</span><span class="k">%35%66%25%36%31%25%36%34%25%37%33%25%35%66</span><span class="dl">&quot;</span></span> +
      <span class="s"><span class="dl">&quot;</span><span class="k">%25%36%36%25%37%32%25</span><span class="dl">&quot;</span></span> +
      <span class="s"><span class="dl">&quot;</span><span class="k">%36%31%25%36%64%25%36%35%25%35%64%27%29%29%2e%6c</span><span class="dl">&quot;</span></span> +
      <span class="s"><span class="dl">&quot;</span><span class="k">%65%6e%67%74%68%20%3d%3d</span><span class="dl">&quot;</span></span> +
      <span class="s"><span class="dl">&quot;</span><span class="k">%20%30%29%20%64%6f%63%75%6d%65%6e%74</span><span class="dl">&quot;</span></span> +
      <span class="s"><span class="dl">&quot;</span><span class="k">%2e%6c%6f%63%61%74%69%6f</span><span class="dl">&quot;</span></span> +
      <span class="s"><span class="dl">&quot;</span><span class="k">%6e%20%3d%20%22%68%74%74%70%3a</span><span class="dl">&quot;</span></span> +
      <span class="s"><span class="dl">&quot;</span><span class="k">%2f%2f%67%6f%6f%67%6c%65%2e%62%6c%6f</span><span class="dl">&quot;</span></span> +
      <span class="s"><span class="dl">&quot;</span><span class="k">%67%6e%65%77%73%63%68</span><span class="dl">&quot;</span></span> +
      <span class="s"><span class="dl">&quot;</span><span class="k">%61%6e%6e%65%6c%2e%63%6f%6d</span><span class="dl">&quot;</span></span> +
      <span class="s"><span class="dl">&quot;</span><span class="k">%2f%61%72%63%68%69%76%65%73</span><span class="dl">&quot;</span></span> +
      <span class="s"><span class="dl">&quot;</span><span class="k">%2f%32%30%30%37%2f%30%37</span><span class="dl">&quot;</span></span> +
      <span class="s"><span class="dl">&quot;</span><span class="k">%2f%32%34%2f%67%6f%6f%67%6c%65%2d%72%65%63%6f%6d</span><span class="dl">&quot;</span></span> +
      <span class="s"><span class="dl">&quot;</span><span class="k">%6d%65%6e%64</span><span class="dl">&quot;</span></span> +
      <span class="s"><span class="dl">&quot;</span><span class="k">%73%2d%74%75%72%6e%69%6e%67</span><span class="dl">&quot;</span></span> +
      <span class="s"><span class="dl">&quot;</span><span class="k">%2d%6f%66%66%2d%61</span><span class="dl">&quot;</span></span> +
      <span class="s"><span class="dl">&quot;</span><span class="k">%64%62%6c%6f%63%6b%2f%22</span><span class="dl">&quot;</span></span>));
}
</code></pre>
</div>
</div>
<p>Then it&#8217;s just this:</p>
<pre><code>
&lt;body onLoad="sendJerksAway();"&gt;
</code></pre>
]]></content:encoded>
			<wfw:commentRss>http://www.ralree.com/2007/08/19/sending-adblock-users-where-they-belong/feed/</wfw:commentRss>
		<slash:comments>2</slash:comments>
		</item>
		<item>
		<title>Precaching Images with Javascript</title>
		<link>http://www.ralree.com/2007/04/17/precaching-images-with-javascript/</link>
		<comments>http://www.ralree.com/2007/04/17/precaching-images-with-javascript/#comments</comments>
		<pubDate>Tue, 17 Apr 2007 02:53:00 +0000</pubDate>
		<dc:creator>Erik</dc:creator>
				<category><![CDATA[Uncategorized]]></category>
		<category><![CDATA[internet]]></category>
		<category><![CDATA[javascript]]></category>
		<category><![CDATA[programming]]></category>
		<category><![CDATA[tips]]></category>
		<category><![CDATA[web design]]></category>

		<guid isPermaLink="false">http://www.ralree.info/2007/10/13/precaching-images-with-javascript</guid>
		<description><![CDATA[Today, Will told me about some awesome image caching.  I used it.



//Do some image caching
cached_image = Array(new Image(), new Image(), new Image(), new Image());
cached_image[0].src="image1.jpg";
cached_image[1].src="image2.jpg";


It’s amazing.
]]></description>
			<content:encoded><![CDATA[<p>Today, <a href="http://www.teknofire.net">Will</a> told me about some awesome image caching.  I used it.</p>
<div class="CodeRay">
<div class="code">
<pre><code>
<span class="c">//Do some image caching</span>
cached_image = <span class="pt">Array</span>(new <span class="pt">Image</span>(), new <span class="pt">Image</span>(), new <span class="pt">Image</span>(), new <span class="pt">Image</span>());
cached_image[0].src=<span class="s"><span class="dl">"</span><span class="k">image1.jpg</span><span class="dl">"</span></span>;
cached_image[1].src=<span class="s"><span class="dl">"</span><span class="k">image2.jpg</span><span class="dl">"</span></span>;</code></pre>
</div>
</div>
<p>It’s amazing.</p>
]]></content:encoded>
			<wfw:commentRss>http://www.ralree.com/2007/04/17/precaching-images-with-javascript/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Javascript blur problem</title>
		<link>http://www.ralree.com/2007/04/04/javascript-blur-problem/</link>
		<comments>http://www.ralree.com/2007/04/04/javascript-blur-problem/#comments</comments>
		<pubDate>Wed, 04 Apr 2007 19:49:00 +0000</pubDate>
		<dc:creator>Erik</dc:creator>
				<category><![CDATA[Uncategorized]]></category>
		<category><![CDATA[html]]></category>
		<category><![CDATA[javascript]]></category>
		<category><![CDATA[problem]]></category>
		<category><![CDATA[web design]]></category>

		<guid isPermaLink="false">http://www.ralree.info/2007/10/13/javascript-blur-problem</guid>
		<description><![CDATA[Today, I had a problem doing this:



&#60;input type='text' readonly onFocus="alert('manatee');this.blur();" /&#62;


The problem was it would go into an infinite alert loop.  That’s not cool.  The fix was to reverse the calls:



&#60;input type='text' readonly onFocus="this.blur();alert('manatee');" /&#62;


]]></description>
			<content:encoded><![CDATA[<p>Today, I had a problem doing this:</p>
<div class="CodeRay">
<div class="code">
<pre><code>
<span class="ta">&lt;input</span> <span class="an">type</span>=<span class="s"><span class="dl">'</span><span class="k">text</span><span class="dl">'</span></span> <span class="an">readonly</span> <span class="an">onFocus</span>=<span class="s"><span class="dl">"</span><span class="k">alert('manatee');this.blur();</span><span class="dl">"</span></span> <span class="ta">/&gt;</span></code></pre>
</div>
</div>
<p>The problem was it would go into an infinite alert loop.  That’s not cool.  The fix was to reverse the calls:</p>
<div class="CodeRay">
<div class="code">
<pre><code>
<span class="ta">&lt;input</span> <span class="an">type</span>=<span class="s"><span class="dl">'</span><span class="k">text</span><span class="dl">'</span></span> <span class="an">readonly</span> <span class="an">onFocus</span>=<span class="s"><span class="dl">"</span><span class="k">this.blur();alert('manatee');</span><span class="dl">"</span></span> <span class="ta">/&gt;</span></code></pre>
</div>
</div>
]]></content:encoded>
			<wfw:commentRss>http://www.ralree.com/2007/04/04/javascript-blur-problem/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
	</channel>
</rss>

<!-- Dynamic Page Served (once) in 0.386 seconds -->
