Thursday, October 22, 2009

An Amazon Affiliate Tutorial

Ok, so I'm a little behind the times. Amazon's Affiliate Program has been around for a while--since 1996 to be exact. Everyone and their grandma must have an account by now, making millions off sales of "The Secret" that they linked to on their blog (this is actually the secret that the book talks about). But incase you happen to be Amish, here's a short tutorial on the whole process of signing up for an account and building affiliate links.

1. Visit https://affiliate-program.amazon.com/ and click the "Join now for FREE!" button. It requires that you create an Amazon account first if you don't already have one.



2. It then asks you for your contact information and has some questions about the website/blog where you'll be putting your affiliate links.



3. And that's all the information they need to get your account set up. You don't even have to submit your payment information (although, you'll want to do this eventually...after all, making a few bucks is why you're here, right?). As you can see in the screenshot, Amazon assigns you a unique "Associates ID". This important identifier will be stuffed into all the affiliate URLs you create so that Amazon knows who give money to when a sale is made. To start making links, click the "Learn More" link in the "Product Links" box.



4. It's really easy to create affiliate links. It just takes a few clicks of the mouse and some copy and pasting. First, search for the product you want to link to. I chose a book I recently read.



5. Next, find the product in the search results and click the "Get Link" button.



6. This will take you to the page that lets you build your link. There's a lot of options here you can play with, so take some time to explore this page on your own. Once you're done crafting the link to your liking, copy the HTML code in the "step 3" box and paste it on your site. It's no secret--it's that simple!

Tuesday, October 6, 2009

Using Magpie to parse Blogger feeds

I recently redesigned my website and one thing I changed was putting my blog on the front page instead of just linking to it. But what's cool (at least, according to my own geeky tastes) is that my blog is hosted on Blogger--not on my website! In this post, I'm going to walk through how I did this.

1. Blogger setup
First, you need to make sure your Blogger feeds are configured to include the full content of each blog post (as opposed to just the first paragraph or whatever). I think this is the default setting, but to make sure, to go the Settings page and click on the "Site Feed" tab. The "Allow Blog Feeds" option should be set to "Full".



2. Atom feed URL
Now, you must get the URL of your blog's Atom feed. Go to your blog's homepage and view the source (in Firefox, this is under "View > Page Source"). Look for a "link" tag that looks like the one below, and grab the value of its "href" attribute.
<link rel="alternate" type="application/atom+xml" title="mangstacular - Atom" href="http://mangstacular.blogspot.com/feeds/posts/default" />

Note: In this tutorial, I use the Atom feed. The RSS feed also has all the same information--it's just arranged differently.


3. Magpie setup
Download Magpie. This is a wonderfully easy-to-use RSS/Atom parser written in PHP which we'll use to parse the Atom feed.

You'll want to configure Magpie to cache the Atom feed so that it only downloads it when your blog changes in some way (i.e. when there's a new post or a new comment). This way, your website won't have to download the feed from Blogger every time someone visits your page. Open the "rss_fetch.inc" file and add these two lines somewhere at the top:
define('MAGPIE_CACHE_ON', true);
define('MAGPIE_CACHE_DIR', 'cache');

This will turn on caching and instruct Magpie to save the cached Atom file in the directory you specify.

Note: Be sure that the permissions of the cache directory allow your web server to write to it. The way you do this varies from server to server, based on the user that your PHP process runs under, but here are the commands that I had to run:
chmod 775 cache
chgrp web cache

What you do NOT want to do is set the folder to be globally writable. While this would work, it would also allow anyone on the Internet to write to that directory--not a good thing.


4. Parse the Feed
Now you're ready to write the code that fetches and parses the feed. Simply calling Magpie's "fetch_rss" function will parse the feed and return all the data in an associative array (despite "rss" being in the function name, it will also parse Atom feeds). No need to deal with any XML. Below is some sample code.

Note: There are a couple quirks, which may be Blogger-specific--be sure to read the code comments.

require_once('magpierss/rss_fetch.inc');

$atom = fetch_rss('http://mangstacular.blogspot.com/feeds/posts/default');
foreach ($atom->items as $item){
//var_dump($item); //see all the stuff that's in each item

$date = date('F j, Y', strtotime($item['published']));
$title = $item['title'];
$content = $item['atom_content']; //no need to run html_entity_decode() or anything
$url = $item['link'];

//because there are two <link> tags whose "rel" attributes are the same...
//...it stuffs the "href" attributes from both tags into this one string...
//...so you must extract the URL you want...
//...which in my case is the URL to the comments page
$commentsUrl = substr($item['link_replies'], strpos($item['link_replies'], 'https'));

$numberOfComments = $item['thr']['total'];

//generate HTML for the entry
//...
}


And now it looks like you're running fancy Wordpress software! ;)

Tuesday, September 29, 2009

Google Maps and its Traffic overlay

Ever since I started my new job, I've gotten into the habit of turning on the morning news while getting ready for work in the morning. They do reports on rush-hour traffic and this morning, there was one whopper of an accident. A tractor-trailer had slide-lined three cars, completely blocking the flow of traffic in that direction. It was on a road I take everyday to work, but I wasn't sure exactly where on the road it was, so didn't know if it would impact my commute.



Then, I remembered that Google Maps has a live traffic feature that overlays the amount of traffic congestion on the map. I could see where the congestion was and figure out if I needed to find an alternate route. Oddly enough, it reported all roads as being more or less clear, which I knew was not the case. The roadside webcams (another Google Maps overlay) also didn't show any signs of an accident.

It turns out that the data just isn't very "live" after all. Not only was the traffic overlay not reporting the current traffic situation, but the webcam images weren't current either--they were anywhere from 30-60 minutes old. Clicking on the image takes you to the website that operates the webcams, and only going there can you get an up-to-the-minute view of traffic.

So it turned out that my drive wasn't affected. And I learned that, while the traffic overlay on Google Maps is great for seeing general traffic trends, it's not so good for live traffic updates.

Sunday, August 16, 2009

Using phpDocumentor with Eclipse



I just finished making improvements to a PHP/MySQL-powered photo gallery website I had written during college (it kind of felt good to see how much my coding skills have improved since then). Besides moving all the SQL into a DAO, cleaning up the UI, and learning how to do file uploads in PHP, I went through all the code and formally documented all the functions and classes. I decided to use phpDocumentor because the format it requires the comments to be in is nearly identical to Java's Javadoc, which I was already familiar with.

I wanted to set up an Ant target that I could run that would generate the HTML documentation. It was pretty straight-forward--just create a target using the Exec task to run a console command. However, even though I could call the "phpdoc" command straight from the command line, Ant had problems with that. I think this is because "phpdoc" is not an executable, but a PHP script. At any rate, it worked fine once I found the script that the command was linked to and used the "php" command to run the script.

<target name="phpdocs" description="Generates phpDocumentor docs">
<delete dir="${doc.dir}" />
<exec executable="php">
<arg value="/usr/local/PEAR/PhpDocumentor/phpDocumentor/phpdoc.inc" />
<arg value="-f" />
<arg value="*.php" />
<arg value="-t" />
<arg value="${doc.dir}" />
<arg value="-ti" />
<arg value="Photo Gallery Documentation" />
</exec>
</target>

Wednesday, July 15, 2009

SCJP Book Errata

I recently read the book A Programmer's Guide to Java SCJP
Certification: A Comprehensive Primer (Third Edition)
by Khalid Mughal and Rolf Rasmussen in order to prepare for the SCJP exam (which I took and passed last week). I sent the authors of list of mistakes that I found and some have made it into the book's online errata!



How cool is that! :-P

Tuesday, July 14, 2009

OpenOffice and DOC

Sorry, I need to rant a little. >:(

OpenOffice isn't as great as everyone says it is. Or at least as great as I though it was. I'm looking for a job and have been using the open source office suite to update my resume. Most recruiters want resumes in Microsoft Word's ".doc" format, but have no fear! OpenOffice supports that format...

...mostly...sorta kinda.

My resume is pretty basic in terms of features used. It uses two tables, a few bulleted lists, and three drawn lines, along with text of various sizes and fonts. But apparently that's too complex. It can never quite seem to get the bullets in the bulleted lists right:



One time, it used an icon of those things used in movies at the start of a take. Just completely random.

For throw-away documents, this is bearable. But for something important like a resume, you want your .doc to come out exactly right. And OpenOffice fails to do this.

Monday, March 2, 2009

NetBeans and Workspaces


If you're familiar with both Netbeans and Eclipse, you'll probably know of one obvious difference which sets the two apart: Eclipse supports "workspaces", while Netbeans does not (or at least, doesn't appear to--read on). A workspace is sort of like the "state" of the IDE--it's a collection of open project folders and IDE settings. Workspaces are useful when you are working on two unrelated projects which use different code and require the IDE to be configured differently.

By default, Netbeans only allows you to have one workspace. That is, when you exit Netbeans, all your open projects and settings will be restored when it is launched again. This is different from Eclipse, which asks you to specify a workspace every time it is launched. There is a way to specify your workspace with Netbeans as well, though it's not through an easy-to-use UI. An extra parameter must be included when invoking the Netbeans executable:

--userdir C:\path\to\workspace

Here is how to do use this parameter in Windows:
  1. Create a shortcut on your desktop to the Netbeans executable: C:\Program Files\NetBeans x.x\bin\netbeans.exe.

  2. Right-click on the shortcut and click "Properties".

  3. In the "Target" textbox, add the extra parameter to the very end:

    --userdir C:\path\to\new_workspace

  4. Click "OK" to exit the Properties window and double click the shortcut. Netbeans will launch and create/load the workspace at that location.

Tip: I like to use my default workspace as a "jumping-off point" for all my new workspaces. This saves me time I would otherwise have to spend resetting all my IDE settings, like SVN and code formatting preferences. Just make a copy of the default workspace folder and create a shortcut pointing to that folder, as shown above. The default workspace is located here:

~/.netbeans/<version>

Friday, February 27, 2009

Clever Clock UI

There was a power outage in my apartment building the other day, so I went to reset the clock on my stove.

Instead of making you select the hour and minute in two separate steps like most appliances do, you do it in just one. Press the up/down buttons once, and the clock will increment/decrement by one minute. Hold the buttons down, and it moves in ten minute steps for as long as it's pressed.

I thought that was kind of clever. It keeps the task of "Setting the Time" consolidated into a single step, as opposed to breaking it up into as many as three (setting the hour, minute, and am/pm).

Sunday, January 18, 2009

Creating websites WITHOUT using HTML


Want to see something that will blow your mind? Something that will shoot your brain out the back of your skull, through the window, and onto your neighbor's freshly waxed Pinto?

<?xml version="1.0" encoding="UTF-8"?>
<?xml-stylesheet type="text/xsl" href="layout/frontpage.xsl"?>
<page lang="en_us">
<frontpage/>
</page>

This is the source code for a website's entire home page (which is that of the upcoming computer game Starcraft 2 by Blizzard Entertainment).

I could be in the minority, but I've never seen XSLT used to transform XML documents into web pages...and I've never realized how powerful it can be. After exploring the source code of the website, here are some advantages and disadvantages of this technique that I've discovered:

Advantage - Separation of concerns

Using XSLT, you can more effectively separate the content of your website from the presentation. The Starcraft 2 website has *all* of its text separated out into XML files (pretty cool!). For example, you can find all the text on the Terran page, in a file devoted solely to storing Terran-related text (terran.xml).

Advantage - i18n

By separating the content from the presentation, another benefit is that it makes it easy to internationalize the website. This is what Blizzard has done. The XML files used to store text are located in their own directory, named according to the language of the text (such as "fr_fr" for French). The language of the guy viewing the website is stored in the "lang" attribute of "page" tag of each individual web page (see the above code snippet). This attribute is used to determine which directory to retrieve the text from.

Also, you can do things that you would normally think could only be done using server-side languages:

Advantage - Access to special functions

Since XSLT uses the XPath language, you get to use all the special functions that XPath comes with. Tasks like string manipulation, date/time formatting, rounding numbers--all things that one might typically associate only with server-side languages, can all be done with XPath. For example, the following code, taken from a shared file called includes.xsl, uses the "concat" function to build a URI that points to a language-specific version of an XML file:

<xsl:variable name="terran" select="document(concat('/strings/',$lang,'/terran.xml'))"/>

Advantage - Avoiding code duplication

Just as you might define a function in a server-side script that performs some task, you can define function-like constructs with XSLT that "output" HTML. If you look at movies.xsl (a file used to generate the Movies page) you can see that for each movie listed on the page, a template is called:

<xsl:call-template name="movies-entry">
<xsl:with-param name="title" select="$loc/strs/str[@id='sc2.labels.movies.movie6.title']"/>
<xsl:with-param name="movieid" select="'6'"/>
... more parameters ...
</xsl:call-template>

The template, defined in a shared file called includes.xsl, contains the HTML code used to display the movie:

<xsl:template name="movies-entry">
<xsl:param name="title"/>
<xsl:param name="movieid"/>
... more parameters ...
... HTML/XSL code used to display the movie ...
</xsl:template>

So instead of having to do a lot of copying and pasting, as you would have to do if using plain HTML, the code stays centralized in one place, making bug fixes and other maintenance tasks easier to handle.

Disadvantage - Backward-compatibility

XSLT didn't become a W3C recommendation until 1999, so any browser created before or around that time probably won't have strong support for the language (this includes IE 5 and earlier). So you have to consider the software your audience is likely to be using before building your site. Blizzard probably thought it safe to use this technology, since gamers tend to use the latest and greatest browsers and are therefore unlikely to run into any compatibility issues.

So in conclusion, I've found that using XSLT to build web sites gives you many advantages that you don't get when developing with vanilla HTML. Perhaps I will use it for my next web development project!

Sunday, January 11, 2009

SudokuSolver released

I've developed a bit of an addiction recently. Thankfully, it's not alcohol-related. But like drinking, it does take up time and money.

If you're not familiar with the puzzle game Sudoku, you've probably at least seen it either in your daily newspaper or somewhere online. The goal is: given a square board 9 cells high and 9 cells wide, fill each row, column, and 3 by 3 sub-square with all the numbers 1 through 9. No number can be repeated in any of those three places. For example, the number 5 can't appear more than once in the same row. The board starts with some cells already filled in to give you a starting point. The less completed cells you start with, the harder the puzzle is.



After solving enough of these, I thought it would be an interesting exercise to write a program which solves them automatically! As I got deep into creating the algorithm, one data structure stood out as being the keystone--sets.

In mathematics, a set is a collection of numbers where:

  1. the order the numbers are in does not matter and

  2. no number can be repeated.


For example, this is a set:
{ 3, 7, 5, 9 }

Since order doesn't matter, this is the same set as the one above:
{ 9, 3, 7, 5 }

But this is NOT a set because there are two 7s:
{ 9, 3, 7, 5, 7 }

In this algorithm, sets are useful when trying to figure out what number a cell should be. The algorithm can be summarized with this pseudo-code:

while board is not complete
for each cell in board
if cell is empty
possibleValues = findPossibleValues(cell)
if size of possibleValues == 1
cell.empty = false
cell.value = possibleValues[0];

function findPossibleValues(cell)
possibleValues = new set{1,2,3,4,5,6,7,8,9}

for each rowcell in cell's row
if rowcell is not empty
//if possibleValues doesn't contain rowcell.value, then nothing happens
possibleValues -= rowcell.value

for each colcell in cell's column
if colcell is not empty
possibleValues -= colcell.value

for each squarecell in cell's square
if squarecell is not empty
possibleValues -= squarecell.value

return possibleValues

Given a current board state, for each cell in the board, a set containing all values the cell could possibly be is created. If this set only contains one number, then that's the only number the cell can be, so we fill in the cell with that number. This keeps repeating until all cells are filled in. (There are some other tricks that have to be taken into account, but this is the most fundamental part of the algorithm.)

If you'd like to try it out or look at the source code, you can download it here:

http://www.mangst.com/projects/sudoku-solver