Coding with Jesse

CloneCD For Mac OS X

If you find yourself with a Clone CD set of files (.CCD, .CUE, .IMG & .SUB), and you're using OSX, you'll probably realise quickly that you can't burn these files. This is because CloneCD is unfortunately only available for Windows.

Luckily, there is still a way around this. Here's the steps I had to follow:

  1. Download Firestarter FX. You can also use any program that can burn .BIN/.CUE files
  2. Install Firestarter. For me, this wasn't so straightforward. StuffIt crashed when I tried to open the ZIP file, so I had to unzip it from the command line. If the ZIP file is on the Desktop, just open Terminal and type "cd Desktop" and then "unzip FireStarter*.zip". This created a folder on the desktop containing the program.
  3. Rename your .IMG file to .BIN. This is the hack: CloneCD .IMG files are really normal .BIN files in disguise. It's just the file extension that confuses cd burning programs. By renaming, Firestarter will be able to open it.
  4. Open Firestarter, drag the .BIN and .CUE files onto the Firestarter window, and burn.

That's it! Now you should have a perfect burnt CD without having to copy the files over to a Windows computer!

Published on November 22nd, 2005. © Jesse Skinner

Feedburner RSS

I have started using Feedburner for The Future Of The Web's RSS feed. If you have already subscribed to the old RSS feed, I highly recommend you change your RSS reader to point to:

http://feeds.feedburner.com/tfotw

If you have no idea what I'm talking about, or if you haven't yet subscribed to the RSS feed of this page, you should definitely check out an RSS feed aggregator. I use Bloglines. It's exactly what I need. It lets me see what's I've read or haven't read across the 30 or so web sites I like to read, and it's a very nice interface that stays out of my way. There are dozens of other ways to subscribe to RSS feeds, so there is definitely one out there that would be perfect for you.

Published on November 18th, 2005. © Jesse Skinner

Chitika Channel Tips

I started using Chitika eMiniMalls a few days ago on Free Horoscope Daily, as well as on the tools pages of this site. So far so good, it seems like a very promising ad service. The ads can be contextual like Google Adsense, but I suspect you can get them to perform better by specifying keywords to bring up the product you want.

Very recently, Chitika added a JavaScript variable to allow for Channels, ch_sid. Instead of having a Channel management area on the website, where you set up channels and get a numeric ID to use for the channel, they allow you to specify any string at all. This makes testing out different ad styles and keywords very easy.

To test out keywords, that is, to see which keywords bring up products people are actually buying, we can create the Channel name dynamically using Javascript:

ch_queries = new Array("ipod", "camera", "dvd player", "etc.");
ch_query = ch_queries[Math.floor((Math.random()*ch_queries.length))];
ch_sid = 'Channel Prefix ' + ch_query;

This will give you channel names like "Channel Prefix camera" or "Channel Prefix ipod", etc. Of course, you can change Channel Prefix to include more information on the type of ad or location of the ad.

You could also experiment with different ad colors or sizes in a similar way, and build up the ch_sid variable to include all the variables. For example:

ch_colors = new Array("red", "blue", "green");
ch_color = ch_colors[Math.floor((Math.random()*ch_queries.length))];
ch_sid = 'My Website ' + ch_color + ' ' + ch_query;

You get the picture. Of course you can do all this with Adsense too, you would just have to set up a channel manually for every color / size / location combination, then dynamically associate the combination with it's channel ID. Quite a bit more painful though.

Chitika also allows you to test out searches on their website. They actually recommend you go to Amazon or Shopping.com and find best selling products, then try to create keywords that bring up that specific product. And with this Javascript, you can determine what the best selling products really are for your visitors.

Have fun optimizing your ads!

Get Chitika eMiniMalls
Published on November 11st, 2005. © Jesse Skinner

onAfterPaste

Working with designMode="on" or contentEditable (what can we call this? I want to say Rich Text Editors or Midas Editors Web-Based HTML Editors or something. We don't really have a nice buzzword for this..), a common problem is dealing with pasted content. The user can paste any HTML into these areas, and more often than not, web applications don't want form elements or IFrames or other HTML included in the content.

It's not so difficult to process the innerHTML of a document to strip out bad HTML using regular expressions. The problem is, when can this cleaning happen?

Mozilla has no paste events at all. Internet Explorer has onBeforePaste and onPaste events, but no onAfterPaste. onPaste fires when the user pastes, but before the HTML actually goes into the editor. The idea is that the developer has a chance to look into the clipboard using window.clipboardData.getData(). Unfortunately, you can only retrieve the contents in URL or Text format, not HTML. Instead, it would be easier to allow the HTML to be pasted, then process the editor contents afterwards.

To accomplish this in Internet Explorer, we can simply set a timeout in the onPaste event. This works by allowing the browser time to finish its internal onPaste event before executing the code in the timeout. The onPaste event needs to be attached to the BODY of the editor IFrame using designMode, or the DIV element when using contentEditable.

function onPasteHandler(e) {
     setTimeout(function() {
          // editor cleaning code goes here
     }, 1); // 1ms should be enough
}

In Firefox, we can't use paste events. However, probably the best we can do is set a keypress handler and look for CTRL+V or SHIFT+INSERT and then do the same thing with a timeout. The keypress event handler needs to be attached to the document element in the IFrame.

function onKeyPressHandler(e) {
     if ((e.ctrlKey && e.keyCode == e.DOM_VK_V)
      || (e.shiftKey && e.keyCode == e.DOM_VK_INSERT)) {
          setTimeout(function() {
               // editor cleaning code goes here
          }, 1);
     }
}

This should only work with Mozilla/Firefox because e.DOM_VK_V and e.DOM_VK_INSERT are not defined in Internet Explorer.

Also note that there are still other ways to get HTML into the editor through Drag-and-Drop, or by using Edit>Paste on the Firefox menu. If you are serious about stripping HTML you will need to do it at other times as well. At least this way it will happen quickly enough that the editor won't misleadingly contain these elements, only to strip them out at an unpredictable time in the future.

Published on November 10th, 2005. © Jesse Skinner
<< older posts newer posts >> All posts