The updated gist can be found here.

/* 
 * Full example here: http://jsfiddle.net/jboesch26/3SKsL/1/
 */
 
$.fn.outerHTML = function(){
 
    // IE, Chrome & Safari will comply with the non-standard outerHTML, all others (FF) will have a fall-back for cloning
    return (!this.length) ? this : (this[0].outerHTML || (
      function(el){
          var div = document.createElement('div');
          div.appendChild(el.cloneNode(true));
          var contents = div.innerHTML;
          div = null;
          return contents;
    })(this[0]));
 
}

Now call it like so, $(‘#myid’).outerHTML();

While on the command line inside my “app” directory, I typed:

svn propset svn:ignore '*' tmp/*

Here is what the output was:

property 'svn:ignore' set on 'tmp/cache'
property 'svn:ignore' set on 'tmp/logs'
property 'svn:ignore' set on 'tmp/sessions'
property 'svn:ignore' set on 'tmp/tests'

Looks good right? Nope, it’s not recursive. It stops at the first level, meaning it didn’t ignore ‘tmp/cache/models’ and ‘tmp/cache/persistent’.

I guess you have to specifically ignore each directory. Here’s what I ended up doing:

svn propset svn:ignore '*' tmp/cache/models*
svn propset svn:ignore '*' tmp/cache/persistent*
svn propset svn:ignore '*' tmp/sessions*
svn propset svn:ignore '*' tmp/logs*

Aaaaannndd it works! If anyone knows a better way of doing this I’d be more than happy to hear it.

• When you write out a GQL query, you have to remember to tick the “By GQL” checkbox before clicking “Run Query” or it removes your entire query.
• If you end up succeeding in running a GQL query, all of the sudden your “By Type” dropdown is disabled (greyed-out).
• If you search by namespace, the “By Type” dropdown is removed completely when the page refreshes.

All of these things combined make it annoying to use. So I’ve created a little greasmonkey script to fix all of those things.

In Google Chrome, navigate to http://boedesign.com/misc/appengine_ux_fix.user.js and install the script. Now go visit the Datastore Viewer on appengine – fixed!

This script only works in Google Chrome at the moment. Sorry Firefox users!

It’s called 7shifts and it’s an application where part-time employees can check/manage their availability and schedules online. It’s free to sign up for a trial, so if you’re a company that employs part-time staff, this could make your life a whole lot easier.

You can follow 7shifs on twitter as well.

1. Calling get_bloginfo() from within the WYSIWYG

Moving a WP site to another domain can sometimes be annoying, with broken image paths within the content fields etc. Yes, you could use a typical SQL REPLACE to fix all your paths – that’s definitely an option. Wouldn’t it be nice if you could code your path’s relatively and it would just work? Well, I think so. That’s why I’ve come up with this convention.

You know how you can call get_bloginfo(‘template_directory’) from a PHP file for the path to your template director? Awesome, but I want that same kind of functionality in the WYSIWYG content editor. Simple, just type {{ template_directory }} or {{ home }} or {{ rss2_url }} in the WYSIWYG. A full list of the options can be found here.

Put the code below in your themes functions.php file

// Add a filter to make all calls to the_content() run through our little custom filter.
add_filter('the_content', 'bloginfo_filter_content');
 
/**
* Handy-dandy find and replaces on things that are typed in the WYSIWYG
* Text betwen {{ }} should be keys for get_bloginfo();
*
* @param {String} $content The post_content passed in
*/
function bloginfo_filter_content($content){
 
    $c = $content;
 
    $pattern = "/{{(.*?)}}/";
    preg_match_all($pattern, $content, $matches);
 
    if($matches[1]){
        foreach($matches[1] as $i => $blog_option){
            $blog_option_clean = strtolower(trim($blog_option));
            $blog_val = get_bloginfo($blog_option_clean);
            // If we passed an invalid key argument (doesnt exist), skip over and do nothing
            // Note: invalid keys always default to the blogname key. That's how we check.
            if($blog_val == get_bloginfo() && $blog_option_clean != 'blogname'){
                continue; 
            }
            else {
                $c = str_replace($matches[0][$i], $blog_val, $c);
            }
        }
    }
 
    return $c;
 
}

Now whenever you call the_content() in your while loop, it will run it through this filter and do any necessary replacements.

2. List of tags without tag cloud weight

It seems kind of odd to me, but WordPress doesn’t seem to have a function to just list the tags like wp_list_categories() does. Instead it offers wp_tag_cloud(), which puts them in an ordered/unordered list but gives them a font-size weight (inline style attribute). It’s yucky if you’re not using it for an actual tag cloud and just want to display the tags in a list. You could just add a font-size: 11px !important; in your CSS to override any inline font-styles but I’m not a big fan of the !important declaration. Here’s a fix:

/**
* We want to list tags in an unordered list, but we don't want the style
* attribute to override our font-sizes that we set in the CSS
*/
function list_tags(){
 
    $tags = wp_tag_cloud(array('format' => 'list', 'echo' => false)); 
    // Get rid of that yucky style attribute that contains font-size
    return preg_replace('/style\s*=\s*(\'|").+(\'|")/i', '', $tags);
 
}

3. Get child pages from a parents page path

I wrote this function just because it’s short and useful. Getting all child pages based on a path has never been easier, pass in a path like ‘work/people’ or ‘people’ and you’ll get the child pages in an array.

/**
* Get an array of child pages based on a parents path
*
* @param {String} $path The path of the page (permalink slug) 
*/
function get_child_pages_by_page_path($path){
 
    $page_path = get_page_by_path($path);
    $pages = get_pages(array('child_of' => $page_path->ID));
    return $pages;
 
}

That is all.

For those who aren’t familiar with TaxiMe, it’s an app that I had created a year ago that estimates your cab fare for various cities across Canada and the US.

The iPhone app comes loaded with cool features that will make your pants drop. Check out the video, screenshots and more goodies at www.taxime.ca/iphone.

After reading various techniques on JavaScript templating, I decided to take John Resig’s idea of using script tags in your HTML. The reason I liked it was because you had your HTML in your HTML file. No funny stuff, just HTML where it belongs. I also liked the idea that it cached the templates – very good stuff. Here is what one of John’s examples looked like:

<script type="text/html" id="user_tmpl">
    <% for ( var i = 0; i < users.length; i++ ) { %>
        <li><a href="<%=users[i].url%>"><%=users[i].name%></a></li>
    <% } %>
</script>

Right off the bat, what do you think? Does it feel weird? Does it feel like someone just pissed in your corn flakes? To be honest, I felt that way when I first saw it. This could be partly due to the fact that I have never used a script tag with a type text/html before. As John points out, the browser doesn’t know how to treat it, so these script tags with text/html are ignored, which makes it a perfect cloaking device for sneaking in templates.

I love that it’s HTML right in the HTML, but I didn’t like that it still had JavaScript wrapped around it (for loop). In my case, all I want is simple templating with some caching, I don’t want to perform JavaScript actions. I would much rather pull in the template and then perform the JavaScript actions within the JavaScript file itself.

Ok, I’ll get down to the geeky stuff. Here is what I came up with.

Check out the Gist

Usage

HTML

// The following HTML is in a script tag and will not render out on the page
<script type="text/html" id="user_tpl">
    <div>
        <a href="<%= url %>"><%= user %></a>
        <span><%= something_in_span %></span>
    </div>
</script>

JavaScript

// @param 1 - The id/selector of the <script> element holding the HTML template
// @param 2 - The data object containing the replacements
// If you have jQuery you need to pass a jQuery selector
// or else just pass it an id (without #)
var tpl = Template.draw('user_tpl', { user: 'bob', url: 'http://cornflakes.com' });
alert(tpl); // outputs 
/*
<div>
        <a href="'http://cornflakes.com">bob</a>
        <span><%= something_in_span %></span>
</div>
*/

Oops, we forgot to run a replacement for <%= something_in_span %> – no problem. We can re-template the same string, by calling the append method.

tpl = Template.append(tpl, { something_in_span: 'Hi im text inside a span' })
alert(tpl); // outputs
/* 
<div>
        <a href="'http://cornflakes.com">bob</a>
        <span>Hi im text inside a span</span>
</div>
*/

There are a lot of templating scripts out there and by no means is this the all-in-one solution. This is just my approach to making something that’s lightweight, easy to use and utilizes caching.