Resig’s jQuery is so powerful and so easy that even with basic knowledge of CSS and Javascript, anyone can be a virtual scripting master.  It’s so easy, that I’ve slacked on learning about javascript objects, inheritance, closures, anonymous functions, prototypes, and scores of  other Javascript staples that I should’ve long since mastered.   I just discovered John’s new web app, cleverly titled “Learning Advanced Javascript“, and so far, so good!

I wrote this myself and understand why it works, which is much more than I could say yesterday.

var ninja = {
	walk: function(steps,turn) {
		toDo = 'Walking '+steps+' steps forward, then turning '+turn;
		return this;
	  },
	star: function(action,distance) {
		toDo = toDo+' '+action+'ing star '+distance+' feet'; return this;
	  },
	then: function() {
		toDo = toDo+', then '; return this;
	},
	doIt: function() {
		log(toDo);
	}
}
ninja.walk('7','south').then().star('throw','50').doIt();

Output:

> Walking 7 steps forward, then turning south, then throwing star 50 feet

It’s clear to me – and has been for some time – that the future of the web, for better or for worse, rests heavily on the mighty shoulders of client side scripting.   Building on powerful, extensible frameworks like jQuery and MooTools, the next generation of web apps is sure to compete with the desktop.  The ability to understand how to utilize the frameworks when necessary and hack together powerful scriptlets for other purposes seems essential to success in the future web. I know I’ll be investing in “Secrets of a Javascript Ninja” just as a result of this tutorial.

If you’re interested in some revealing behind-the-scenes info, feel free to ask questions now.

I don’t believe anyone out there is still using Flip, but if there is, this is how to defeat the script: simple add this line at line 102 of account.php:

 if(strstr($_POST['em'],"][")) { die('Fail'); }

and this at line 162:

 if(strstr($_POST['nem'],"][")) { die('Fail'); }

Alternatively, you can download the modified file here or download Flip 3.0.1 here.

It may sound odd, but I would highly recommend that you do *not* use this code. It’s now 7 years old and the web is a much different place. The code here is really not suited for running a website today. That said, it was odd to unzip and install it and see that it actually works. The rendering of most of the “themes” is weird (Fudge works great), but otherwise, everything worked.

If you are still a Flip user, I recommend you update your account.php page immediately, and if you have the time and inclination, upgrade to 3.0.1. The following files have some minor changes:

• account.php
• index.php
• inc/config.php
• README.html

Once again, this code is aged not particularly well suited for today’s web.  If you want a simple weblog, I recommend WordPress.

Directions are this easy: set the path of $tw_File with a static, writable file.  Set $tw_userid to your Twitter user id.  Done. 

Download firsttube.com “get latest tweet” php snippet.

First, snag your Twitter user id.  Then, open up your theme file.  I put mine in sidebar.php found in /wp-content/themes/<THEMENAME>/.    Use the below code.  If you want the output wrapped in a list, you would need to put <ul> and <li> tags around this code.

Carefully set your variables.  The cache file should be writable.  Note that you can use a decimal value for $tw_BlankAfter and $tw_Minutes if necessary.   That’s it.

Due to what must be a bug in Wordpress, please ignore the closing “</text></created_at>” at the end of this post.  It’s trying be smart and “fix” broken tags, but the code is right.

NOTE (2/20/09): I have updated the below code.  The new version can be found at “Posting Your Latest Tweet in Wordpress“.

/* ~~~~ Custom Twitter Bit ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
/* ~~~~ Adam S, firsttube.com, twitter @sethadam1 ~~~~~~~~~~~~~~~~~~~~ */
 
$tw_File = '/path/to/a/static/writable/file/twitter.html';
$tw_Userid='XXXXXXX'; //set to your Twitter user id
$tw_BlankAfter = 30; //blank out status if it's older than this many days
$tw_Minutes = 10; //minutes between reloads
 
$tw_Offset = FALSE; //leave as is
// uncomment below time if you want to allow a manual reset via ?twitter-reset
// if($_SERVER['QUERY_STRING']=='twitter-reset') { $tw_Offset=0; } 
 
/* Do not edit below this line */
if(filemtime($tw_File)>time()-floatval($tw_Offset)) {
	include $tw_File;
} else {
	if(is_writable($tw_File)) { $tw_iswritable=1; }
	$tw_time = (86400*floatval($tw_BlankAfter));
	if($tw_Offset) { $tw_time=$tw_Offset; }
	$tw_hyperlinks = true;
	$tw_c = curl_init();
	curl_setopt($tw_c, CURLOPT_URL,
		"http://twitter.com/statuses/user_timeline/"
		.intval($tw_Userid).".xml");
	curl_setopt($tw_c, CURLOPT_RETURNTRANSFER, 1);
	$tw_src = curl_exec($tw_c);
	curl_close($tw_c);
	preg_match('/(.*)< \/created_at>/', $tw_src, $tw_d);
	if(strtotime($tw_d[1]) > time()-$tw_time) {
		preg_match('/(.*)< \/text>/', $tw_src, $tw_m);
		$tw_status = htmlentities(str_replace("&","&",$tw_m[1]));
		if( $tw_hyperlinks ) {
			$tw_status = ereg_replace(
			"[[:alpha:]]+://[^<>[:space:]]+[[:alnum:]/]",
			"<a href="\">\\0</a>",
			$tw_status);
		}
		$tw_output = $tw_status;
	} else {
		if($tw_iswritable==1) {file_put_contents($tw_File,''); }
	} 
 
	if($tw_iswritable==1) { file_put_contents($tw_File,$tw_output); }
	echo $tw_output;
}
/* ~~~ /Custom Twitter Bit ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */

Please note that portions of this code come from the twtter_status() function that was not written by me, but is available from various sources online.

Update: Removed function and put code inline.

“Press This” hasn’t worked for me for ages.  I am so happy to have it back!

//an array of some songs I like
$songs =  array(
		'1' => array('artist'=>'The Smashing Pumpkins', 'songname'=>'Soma'),
		'2' => array('artist'=>'The Decemberists', 'songname'=>'The Island'),
		'3' => array('artist'=>'Fleetwood Mac', 'songname' =>'Second-hand News')
	);

The problem is thus: I’d like to echo out the songs I like in the format “Songname (Artist),” and I’d like to do it alphabetically by artist. PHP provides many functions for sorting arrays, but none will work here. ksort() will allow me to sort by key, but the keys in the $songs array are irrelevant. asort() allows me to sort and preserves keys, but it will sort $songs by the value of each element, which is also useless, since the value of each is “array()”. usort() is another possible candidate and can do multi-dimensional sorting, but it involves building a callback function and is often pretty long-winded. Even the examples in the PHP docs references specific keys.

So I developed a quick function to sort by the value of a key in a sub-array. Please note this version does a case-insensitive sort. See subval_sort() below.

function subval_sort($a,$subkey) {
	foreach($a as $k=>$v) {
		$b[$k] = strtolower($v[$subkey]);
	}
	asort($b);
	foreach($b as $key=>$val) {
		$c[] = $a[$key];
	}
	return $c;
}

To use it on the above, I would simply type:

$songs = subval_sort($songs,'artist'); 
print_r($songs);

This is what you should expect see:

Array
(
    [0] => Array
        (
            [artist] => Fleetwood Mac
            [song] => Second-hand News
        )
 
    [1] => Array
        (
            [artist] => The Decemberists
            [song] => The Island
        )
 
    [2] => Array
        (
            [artist] => The Smashing Pumpkins
            [song] => Cherub Rock
        )
 
)

The songs, sorted by artist.

Onto my gripes. I can’t get inline replying/threading to work.  There is very little documentation on it so far. The functions are called comment_reply_link() and get_comment_reply_link(), and there’s nothing anywhere in the codex that helps, there’s little on the internet, the only place to get any real detail is the code itself, which explains:

from wp-includes/comment-template.php starting at line 949 on WP 2.7.0

 * Retrieve HTML content for reply to comment link.
 *
 * The default arguments that can be override are 'add_below', 'respond_id',
 * 'reply_text', 'login_text', and 'depth'. The 'login_text' argument will be
 * used, if the user must log in or register first before posting a comment. The
 * 'reply_text' will be used, if they can post a reply. The 'add_below' and
 * 'respond_id' arguments are for the JavaScript moveAddCommentForm() function
 * parameters.
 *
 * @since 2.7.0
 *
 * @param array $args Optional. Override default options.
 * @param int $comment Optional. Comment being replied to.
 * @param int $post Optional. Post that the comment is going to be displayed on.
 * @return string|bool|null Link to show comment form, if successful. False, if comments are closed.

It doesn’t matter much, because it doesn’t work, period, even though I’ve followed the instruction here to a t. So I’ll have to fix that in time.

My last gripe is with the new wp_list_comments() routine. I understand this is all new, but the idea that templating comments requires a callback function as a wrapper to all comments, pings, and trackbacks is clumsy at best. The codex on wp_list_comments() have nothing to explain it to people, so while I’ve dug in and gotten things working, it’s not for the feint of heart just yet, since you need to build a PHP function in your theme in your functions.php file (or create one if it doesn’t exist, which cannot be done via the Dashboard). I’m a little sad, since the theme system is so flexible and the new plugin system is just incredible, to see the new comment loop be so manual compared to the single file approach used so successfully in the past.

I know that Scoble says Wordpress 2.7 rocks, and it does. Scoble doesn’t realize the shortcomings because he hasn’t tried to play with the new features, and fortunately, it very gracefully degrades. But it’s got some work to do to be perfect, for me at least.

But my CSS isn’t going to win any awards, my javascript could be collapsed a lot and made much more efficient, and my HTML often suffers from “div-itis” and “class-itis.” Enter Mr Camen, whose motto, “code is art,” is evident upon initial inspection.  Kroc’s code is not only well written, the source itself is actually beautiful.  We have collaborated on both CSS and PHP in the past and both are the better for it.  

That said, we have strikingly different positions about publshing on the web.  Kroc writes his website for himself, and as a result, publishes in HTML 5; his site doesn’t work in IE, his mindset being “if you choose to use a subpar browser, you will have a subpar experience. ”  Indeed, his site is a complete mess in IE 7, the fault only of IE and its abysmal CSS support, not the code itself.   I, conversely, attempt to code with a much more conservative bend, coding to the masses, at the expense of using several great tricks.   

Getting back on track, when it came to discussing the <abbr> tag, both of us found ourselves remarkably on the same page.  Although one can get into the nitty-gritty details and find the whole conversation trivial, I think there’s something to be said for using tags properly and getting your information properly parsed.  After all, screen readers exist with regularity today, XML is very popular (most commonly in the form of RSS), and search engines spider the majority of popular websites several times times a day if not every hour.   Using tags, and using them properly, should be important to content publishers and republishers.  

I also agree with Kroc’s point that it’s not your job to educate your reader like an encyclopedia.  The <abbr> tag is not so much about education as it is about properly marking up your  code.  

As the second wave of the browser war heats up – as Tracemonkey, Squirrelfish Extreme, and V8 start really setting themselves apart from IE in even larger ways, coding to standards will become even more important.  Understading lesser used tags is elemental in writing the best, most concise code and ranking well in search engines.

Today I took my first stab at writing a WordPress plugin. Turns out, it’s really easy. I’m mean really easy. The plugin is pretty simple: it just searches through every post and turns the unlinked words firsttube.com into a hyperlink. However, it seems like it might be a useful plugin for some, even just as a text-replacement plugin. So we’ll see if I publish it. In the meantime, though, it took me about 15 minutes to write and then it was recognized by WordPress, which was very cool.

I have a few ideas for more involved plugins too that I may write, one day. But in the meantime, this one is pretty cool.

I wrote an application some time ago for my company that looks up the longitude and latitude of an address for use in our geocoding initiative. It relied on yahoo_geo(), a function written by PHP creator Rasmus Lerdorf and the Yahoo Maps API. It was largely dependent on this function:

function yahoo_geo($location) {
	$q = 'http://api.local.yahoo.com/MapsService/V1/geocode?appid=rlerdorf&location='
		.rawurlencode($location);
	$tmp = '/tmp/yws_geo_'.md5($q);
	request_cache($q, $tmp, 43200);
	libxml_use_internal_errors(true);
	$xml = simplexml_load_file($tmp);
	$ret['precision'] = (string)$xml->Result['precision'];
	foreach($xml->Result->children() as $key=>$val) {
		if(strlen($val)) $ret[(string)$key] = (string)$val;
	}
	return $ret;
}

This function worked for over two years for us with no problems at all. Then suddenly, in the last month, it started getting spotty. I fixed things by commenting out the caching parts of the function and forcing each execution to run again. Then I got errors about the libxml_use_internal_errors() function, so I commented that out. But today, the function just flat out failed, every single time returning the same error:

Warning: file_get_contents(http://XXXXXXXXXX/XXX) [function.file-get-contents]: failed to open stream: HTTP request failed! in /home/intranet/html/fetch.php on line X

What the heck? This code is all over the web. I’ve tried a million permutations of this function, including using fopen() and ob_get_contents(), and none have worked. And most frustratingly, I could load the URL successfully in Lynx and eLinks, so the machine could quickly and easily fetch the URL.

So I ventured into a sandbox I’ve never really played before: cURL. cURL is an interesting animal. But the interesting thing is, once I got it working, it worked faster than ever! So, without further ado, here is the new and improved yahoo_geo() function:

function yahoo_geo($location) {
	$q = 'http://api.local.yahoo.com/MapsService/V1/geocode?appid=rlerdorf&location='.urlencode(trim($location));
	$ch = curl_init($q);
	curl_setopt($ch, CURLOPT_HEADER, 0);
	ob_start();
	curl_exec($ch);
	$stream = ob_get_contents();
	ob_end_clean();
	if($stream) {
		$xml = simplexml_load_string($stream);
		$ret['precision'] = (string)$xml->Result['precision'];
		if($xml) {
			foreach($xml->Result->children() as $key=>$val) {
				if(strlen($val)) $ret[(string)$key] =  (string)$val;
			}
		}
		curl_close($ch);
		return $ret;
	} else {
		return FALSE;
	}
}

Note: If you’re reproducing these functions elsewhere, be careful – WordPress may have converted the quotes into smart quotes that will need to be fixed before this script will run properly.

The interesting thing here is that I’ve browsed the source of Slash, Scoop, phpNuke, and now WordPress, and all of them are definitively more complex and much heavier than the entire OSNews codebase. Now, before you jump all over me – firstly, Slash and Scoop are Perl, and I don’t really read Perl, so I can’t speak as an expert there.  Secondly, WordPress and Nuke both are very portable and dynamic, whereas OSNews has a narrow focus and, location-wise, is very static.  But that aside, OSNews has withstood simultaneous link bombs from Slashdot and Digg.  As amazing as WordPress is, it’s mostly amazing that it functions at all and loads in less than 2 minutes per page with as much going on as I can see behind the scenes.   That’s not a cut on WordPress, by the way.

In fact, if anything , what is really impressed upon me is how smooth and simple OSNews code is, if I may be so bold.  OSNews runs superfast due, in part, to lots of creative caching, some on-demand, some via cron.  But it also does so because of highly efficient queries that are measured for speed on their JOINs, meaning in some cases, it’s faster to do 20 simple queries than one complex one, or build a long and scary chain of “OR x=a OR x=b OR x=c OR x=d…”  Watching WordPress code in action is really fun for me, but watching OSNews work knowing what I now know about how much work PHP can cram into its threads is even more fun.

First off, I was very excited about the features of Wordpress.  I was really excited, most specifically, about the API, and about the rich text WYSIWYG of the backend.  I’ve done a lot of work on Small Axe’s backend, but it’s still nothing compared to Wordpress.

When I imported my stuff, it worked well, but the “slugs” — or URL-friendly post titles — did not convert properly.  They converted as Wordpress friendly, properly escaped slugs.  The problem was, my slugs needed to stay intact, because I didn’t want all old links to break.

Understanding the way Wordpress functions is really tough for a WP newbie, because the code is so spread out, yet compact, voluminous, yet digestible. Start with index.php, onto wp-blog-header.php, into wp-settings.php, and then you find the massive list of files in the wp-includes directory.  You’ll dig all over trying to find files to find includes in includes in includes. I finally found a great article that tries to explain the Wordpress slug architecture. It’s fairly complex. Much of it lives in/wp-includes/query.php. However, my problem was very specific.

Many of my post slugs had periods in them. The period does not interfere with the URL, but Wordpress doesn’t like them, and somewhere in the massive beast. So I had to find the page that “gets” posts. Lo and behold, there is a function called “get_posts” that lives in /wp-includes/query.php. I kept poking around. Like anyone who keeps digging, eventually, you’ll find yourself in wp-includes/formatting.php. And there it is.

Slug posts get sanitized – like everything, virtually all input is strictly sanitized – by a function called sanitize_title_with_dashes(). This function generates the slug. In order to include dots in your slug titles, just replace lines 366 and 267 (on Wordpress 2.6.0) with this:

$title = preg_replace('/&+?;/', '', $title); // kill entities
$title = preg_replace('/[^%a-z0-9 _.-]/', '', $title);

Then your slug titles will not strip periods. Of course, I don’t recommend you actually use periods, I just wanted them to work when fetching old posts created before I knew any better.

After that adventure, I have to tell you, I’m really loving Wordpress. There are some incredible plugins that have done some amazing functionality extension for me. So far, so good.

iDope currently has a lot of bugs. Mainly, your jacket storage is irrelevant, you can actually store unlimited items, you just can’t buy unlimited items unless you hit “buy all.” You can’t store money in a bank. It never ends until you die. You are mugged or fight the cops maybe 80% of the time you travel. But most importantly, this:

Notice my dollars? That’s right, I have $2,147,483,647. Two billion, one hundred forty seven million, four hundred eighty three thousand, six hundred forty seven dollars. Recognize that number? If you read my blog regularly, you might. After all, it’s the upper limit of signed integers. The game is officially boring – no matter what I do, I’m always capped at that number, I can never get more money. I wonder if the iPhone can support BIGINT.

Anyway, I really hope to see iDope get some love and attention, because Dope Wars is a fabulous and addictive game, but as is, I eventually get to the upper limit and have to start over… and over… and over.

The fact is, it’s rarely PHP that crashes a website. It’s usually overloading MySQL and/or bandwidth limitations. Obviously, we can’t do much about bandwidth. If you’re on a really cool host, they may be psyched for your Digging or Slashdotting, but most are not particularly keen on you using too much processor, too much bandwidth, or too many MySQL connections. Although MySQL is capable of amazing scaling, rarely do web hosts leverage it properly, and even if they did, rarely do most programmers know how to read into slow queries, find inefficient code like loops within loops, and debug a site performance before it’s too late.

The site linked from Digg shares a very lame trick, let’s examine:

//put this code at the very beginning of your page, before anything else
$randomdigg = rand(1,4);
if($randomdigg != 1) {
exit("Thanks for visiting, but the site is under a great deal of 
stress due to being on the front page of Digg. 
Please try back in a few moments. Thanks!");
}

Ok, so essentially, approximately 25% of the time, the page will work, the other 75% of the time, the user will get the message and be asked to refresh later. That’s really lame. First off, unless you want your website to be functional only 25% of the time, you have to be there babysitting it when it hits front page. Also, you need to remove this code. But what if you wanted everything to happen automagically? What if your site could withstand a digging, a slashdotting, a redditing, an OSNews’ing, a Farking, whatever…. all at once, without being forewarned?

Although there are lots of [[http://www.danga.com/memcached/|tools that can do magic for you]], you can leverage plain old PHP to do this dirty work for you, and it’s easy to integrate into your site.

Here’s the premise, we examine the referrer of the page, and if the page is from one or many domains that you specify, you build a cache ON REQUEST. Then, you serve the cached version. When the cache stales, say after minute or two, you refresh it, as needed, again, on request. And the best part is, it’s easy to do.

So, let’s review the code. First, at the top of the page, let’s do this:

$rfr = $_SERVER['HTTP_REFERER']; //get the referring site
$op = '';
if(strstr($rfr,'digg.com')) { $op="do-cache"; } 
$cache= "/path/to/mysite/cache/".$postid.".html";

Let’s take it line by line. First, we get the referring site. If it is digg.com, we’re going to turn the cache on by setting $op to “do-cache.” Note that we preset the $op variable to null to prevent abuse. Next, we define the file we’re going to use as the cache. Since we might want to do this for any entry/page, we’ll give it a unique address. Remember that you do not have to use .html as an extension, since it’s static code anyway. I’ve seen “id.cache”, “id.txt”, and even just “id”. It doesn’t matter, it will be included in a PHP page and spit out as X/HTML anyway.

if(file_exists($cache)) {
	$fmt = filemtime($cache); 
	if($fmt > time()-180) { 
		header("Location: http://mysite.com/cache/".$id.".html"); 
		exit(); 
	} elseif($fmt > time()-1800) { 
         //cache will reload if it's been reloaded 
         //in the last half hour
	   $op=="do-cache"; 
	} else {
	   $op='';
	}
}

This might seem overwhelming, but it’s really not. Check it out. If the cache exists, regardless of referrer, we’re going to check it. The filemtime() function will tell us when the cache was last refreshed. If it reports a time in the last 180 seconds (you can change that number), it will redirect you to the cache. PHP will barely have to do any work, Apache will barely have to do any work, and MySQL will not be touched at all. Almost any host can hang in there to serve static traffic like this.

But what about if the cache is old? Once your site is no longer getting hits every three minutes, for the next 27 minutes, it will blindly reload the cache. It will keep the cache going as long as the page has been hit in the last 30 minutes. After no one hits the cache for 30 minutes, it will go back to fully dynamic. When someone hits the page from digg again, it will start the caching process again. In this case, we’re going to let the cache rebuild. Enter the next part of the code.

if($op=="do-cache") {
	ob_clean(); 
	ob_start(); 
}

If the $op variable is set to “do-cache”, our mission is… uh… to build or rebuild the cache. So, we begin with two simple PHP standard functions, ob_clean() and ob_start(). The “ob” in these functions stands for “output buffering.” When you buffer your output, nothing is echoed by the script, but rather written to a buffer. In short, it’s all stored up in memory for eventual dumping later. Now we stop the caching scripts and just write our normal HTML via PHP and MySQL.

At the end of the page – the very end, after your html element is closed, you’ll need this last bit.

if($op=="do-cache") { 
	$buffer = ob_get_contents(); 
	$fp = @fopen($cache,'w'); 
	if($fp) { 
		fwrite($fp,$buffer); 
	}
	@fclose($fp); 
	ob_get_flush();  	
}

What’s up with this? Again, if we’re building the cache, we’re getting the contents of the buffer, which contains all of our page. Then we’re opening the cache file we specified above, and lastly, dumping the contents of the buffer into the cache file. Our final action is to clear the buffer, which is unnecessary to us now anyway.

That’s it. Your cache is reloaded, and will be served for the next three minutes, after which it will reload the cache every 3 minutes until no one hits the site for 30 minutes. Then it will go back to dynamic. If another digg visitor comes, it will recache and serve the cache. Having written several types of caching mechanisms for large sites myself, I can tell you this “cache on demand” method works. On OSNews v4, we use this for things like user-specific RSS files, which aren’t plausibly built via cron jobs and, frankly, we don’t want to allow access to MySQL without limit. They reload every 60 minutes, regardless of referer.

If you maintain a site and have any concern about being Dugg, I encourage you to research some sort of caching mechanism. Your web host will thank you, and you will be thankful for the maintained uptime and high hit count.