Use Only Genuine Interocitor Parts

Add to Technorati Favorites

Endorsements

Firefox 3

Kobayashi Maru For Developers

Friday, June 20th, 2008 at 12:45 pm by Kenny

Being the geek that I am, I remembered the reference to the Kobayashi Maru from Star Trek many years ago, but I was surprised when one of my professors in college brought it up in reference to a sorting algorithm. His linking these two references changed the way I thought about solving problems.

But first, a brief history…

In Star Trek lore, there is a test that captains must go through. Notice I said "go through" rather than "pass". The purpose was to test the character of the captain-to-be. The test setup a no-win situation in which the captain had to choose between letting one of two groups of people die. It was impossible to save both groups of people. However, as the story goes, Kirk was the only captain to find a way to "pass" the test. He did so by reprogramming the simulator such that there was a way to pass.

And now back to our story…

In my Data Structures II class in college, we were given the task to write the most efficient program to sort a list of 1000 random integers from the set 1 to 1000. (I think it was 1-1000, it might have been 1-10000 or more. It doesn't really matter for the purpose of this explanation.) That is, the list could contain the same number twice or more or there may not be any instances of a particular number. Every student would be given the same list of numbers, so the test was to see how fast you could sort the list.

Most students hit a wall when they Googled and found the fastest way to implement standard sorting algorithms that end up with O(n log n) time for best case performance. Dr. Charles Anderson, one of my professors for another class (who is now my business partner at Western Skies), suggested that he had a way to perform the sort in O(n) time but that it was cheating and he wouldn't tell me how until after the contest was over. The only hint he gave me was "Kobayashi Maru". I know what the Kobayashi Maru was, but I had no idea how it applied here, so he left me quite confused.

The next week, when the contest was over, he explained to me how he could sort the list of integers in O(n) time instead of O(n log n):

  1. Declare an array (we'll call it arr[]) that is the size of the largest integer possible in the list, in this case 1000, and initialize all the values of the array places to 0.
  2. Pass over the list with a loop. A every position in the list, increment the value at that location in arr[] by 1. That is, if the first item in the list is 47, perform arr[47] += 1.
  3. Once that first loop has been created, pass over each place the array and print that location the number of times of the value stored in that location.

In other words, in pseudocode:

arr[] = array(1000)

// load array
for x in unsortedIntegers while 0 < i <= 1000
  arr[x] += 1
  i++

// print sorted list
for x in a arr[] while 0 < i <= 1000
  while 0 < j <= arr[x]
    print i + ','
  i++

The trick is that you aren't actually sorting the list. You are identifying how many times each number occurs and then using the array data structure to identify those occurrences in order. Rather than O(n log n), you've only passed over n twice, which is then O(2n), or just O(n).

At the time, this blew my mind and, in a way, it still does. This isn't thinking outside the box. It's thinking of a different box to fix the problem in the first box! It opened up my mind to a new way of thinking and new possibilities.

I recently used this when I needed to search for the occurrence of a 2-letter country code in an array of country codes in JavaScript. Rather than loop through the array and search for the country codes, I converted the array to a string and then searched for the occurrence in that string, which was a O(n) operation. I will admit, however, that I'm not familiar with the internal workings of JavaScript. This version may be as inefficient as looping over the array, which is probably what toString().search() does anyway. Here's how I did it in JavaScript:

var countries = document.getElementById("CountryCode");
countries.onchange = function(){isEurope();};	

function isEurope()
{
  var codes = ["AL","DZ","AD","AO","AI","AQ","AM","AT","AZ","BH","BY","BE","BJ",
              "BA","BW","BV","BG","BF","BI","CM","CV","CF","TD","KM","CG","CD",
              "CI","HR","CY","CZ","DK","DJ","EG","GQ","ER","EE","ET","FO","FI",
              "FR","FX","GA","GM","GE","DE","GH","GI","GR","GL","GN","GW","IS",
              "IR","IQ","IE","IL","IT","JO","KZ","KE","KW","KG","LV","LB","LS",
              "LR","LY","LI","LT","LU","MK","MG","MW","ML","MT","MR","MU","YT",
              "MD","MC","ME","MA","MZ","NA","NL","NE","NG","NO","OM","PS","PL",
              "PT","QA","RE","RO","RU","RW","SH","SM","ST","SA","SN","RS","SC",
              "SL","SK","SI","SO","ZA","ES","SD","SJ","SZ","SE","CH","SY","TJ",
              "TZ","TG","TN","TR","TM","UG","UA","AE","GB","UZ","VA","EH","YE",
              "YU","ZM","ZW"];

  var isEurope = false;

  for(i = 0; i < countries.length; i++)
  {
    if(countries.options[i].selected)
    {
      if(codes.toString().search(countries.options[i].value) > 0)
      {
        isEurope = true;
      } // end if test
    } // end if test
  } // end for loop

  if(isEurope)
  {
    // do some stuff
  } // end if test
} // end function isEurope

And there you have it. My own little Kobayashi Maru. While this isn't the most spectacular example, the point of this demonstration is to show you that there are more interesting ways thinking about problems. Try putting the data in a different box to solve a problem.

Edit:

Dr. Anderson pointed out to me that another way to do this would be to put all the country codes into an associative array and then search by looking for a value at index country code. Also, the complexity is more like O(mn) than O(n) as the search() function, even implemented in C within JavaScript, has to be a linear search. Although that's still faster than doing your own nested search in JavaScript. The hot ticket is to put all the country codes into an associative array so that search is based on key, which drops the complexity to O(1).


  • E-mail this story to a friend!
  • Google
  • Digg
  • Technorati
  • del.icio.us
  • Slashdot
  • TwitThis
  • Furl
  • Fark
  • Reddit
  • StumbleUpon
  • Facebook

Attention Dogs

Thursday, June 19th, 2008 at 10:46 am by Kenny

Attention Dogs: Grrrrrr, bark, woof. Good dog.

I found this sign next to a sidewalk in the coastal town of Manzanita, Oregon. As a dog owner, this made me laugh, but then again, simple things amuse me.


  • E-mail this story to a friend!
  • Google
  • Digg
  • Technorati
  • del.icio.us
  • Slashdot
  • TwitThis
  • Furl
  • Fark
  • Reddit
  • StumbleUpon
  • Facebook

Posted in Comedy | No Comments »

Yahoo vs. Eric Meyer CSS Reset

Thursday, June 19th, 2008 at 12:09 am by Kenny

In my post titled WebVisions 2008 Conference Debriefing, I mentioned the concept of a CSS reset and provided links to two versions: the Eric Meyer CSS Reset and the Yahoo UI Library CSS Reset. Both address the issue of browser having their own internal stylesheets that don't necessarily match.

For example: an h2 tag in one browser might have font-size: 16px; and margin-bottom: 12px; while another might have font-size: 18px; and margin-bottom: 14px;. That means that without any of your own CSS work, the same plain-Jane <h2>Some Subtitle</h2> code will look differently. These are the battles web developers have to face and why we hate IE for its non-standard renderings.

The purpose of the concept of a CSS reset is to put all browsers on an even playing field before you begin to style the content. That is, make sure that all elements render the same on all browsers (or rather, all major browsers) so that adding your own styling will have the same effect across the spectrum of renderings. That's not to say that you won't need to make special hacks to fix inconsistent renderings *cough-IE-cough*, but a CSS reset puts you a lot closer to the end goal than where you started.

I've only tried implementing and developing CSS with the Eric Meyer CSS reset and the Yahoo reset once each, so my experience here is somewhat limited, but these are my initial impressions. While both are essentially the same technique and could be adapted to behave more like the other, I'm going to address the out-of-the-box functionality.

Eric Meyer's CSS Reset - Eric Meyer CSS Reset

This was my first attempt at using a CSS reset and you're looking at the results in this current blog theme (as of the date of this post). Meyer's method is to set all elements to be, essentially, unstyled. That is, all elements render as plain text. No bolding for <strong>, no italics for <em>, no margins for <p>, etc. The nice thing about this is that you get to style everything from the ground up. The bad thing about this is that you have to style everything from the ground up. I was excited at first, but I became increasingly frustrated with having to write quite a bit of CSS just to get elements to behave even remotely like they normally do. I understand the purpose in doing this, but it is a ton of work just to get the most basic HTML to display with standard behaviors. I eventually realized that a work-around for this would be to develop a "CSS starting point" where there are definitions for elements that just define the basic behavior.

Another downside to Meyer's method is that he simply provides the code. This didn't seem like a downside at all to me until I used Yahoo's implementation, which I will explain shortly. In fact, it never even occurred to me that there could be a better way.

Don't get me wrong. I have a tremendous amount of respect for Eric Meyer and he has done a great job putting together the code for the CSS reset. I only see the ways to improve on it after having used Yahoo's CSS reset. *Segue*

Yahoo's CSS Reset - Yahoo UI Library CSS Reset

First, let me admit my bypasses. I didn't use, or even look at, the Yahoo CSS Reset before trying Eric Meyer's because…well…I'm a Google-guy. If the link had been to the exact same content at Google, I would have not even looked at (okay, that's an exaggeration) Meyer's version. I drink the Google-flavored Kool-Aid with the left hand and the Apple-flavored Kool-Aid with the right. (There, Microsoft zealots. Are you happy? I'm an admitted zealot too, just on the other side.)

I was very impressed initially with the organization and presentation of the Yahoo page. The code was very readable and the instructions were clear and concise. They also provide a cheat sheet (PDF download), an SDK download, and several other tools and examples that I found very helpful and interesting.

Yahoo also provides a hosted file for the CSS reset so you can simply call the include from their server in the head of your HTML. This was a nice feature. One less file to maintain and serve.

Additionally, and this was the biggest selling-point for me, Yahoo provided the "CSS starting point" code that I was looking for to get the elements to their minimal display characteristics and, like the CSS reset, they also provided a hosted file for me to include. After adding two lines of meta code in the head of my HTML file, I had reset the CSS to zero and then styled it to a standard display. Perfect! Just what I was looking for and here it was in an easy to consume, highly supported codebase.

Coming Soon…

Google CSS Library - Google Blueprint CSS Framework

As I was writing about being a Google zealot and wishing that Google had a CSS reset, I decided to search for "google css reset" and, lo and behold, the very first link that Google returned (imagine that!) was for the Google Blueprint CSS Framework, which includes a CSS reset and starting point styling. I should have known that Google would swoop in and save the day. I'll try the Google CSS reset for my next site and report my findings.

EDIT:

I recently tried validating some CSS that I added to a site after using the Yahoo CSS reset. I was sad to find out that it doesn't validate. I think I read somewhere that the Eric Meyer CSS reset doesn't validate either. I decided to punt on this one and just make sure that my personal CSS code that I built on top of the reset code will validate, but then, technically, my whole page doesn't validate since I'm using the CSS reset. I guess that's something I'll have to wrestle with until a better solution comes along.


  • E-mail this story to a friend!
  • Google
  • Digg
  • Technorati
  • del.icio.us
  • Slashdot
  • TwitThis
  • Furl
  • Fark
  • Reddit
  • StumbleUpon
  • Facebook

Remove Fancy Quotes From WordPress

Wednesday, June 18th, 2008 at 2:09 pm by Kenny

If you're annoyed by the fancy quotes that WordPress replaces your normal quotes with (i.e. “these quotes” rather than "these regular quotes"), there's an easy way to get rid of them. Just use Semiologic's Unfancy Quote Plugin For WordPress and presto chango, your fancy quotes are gone!

I had found some lower-level hacks to WordPress and some crazy-complex Javascript that fixed this, but none of them were as simple and easy to use as Semiologic's solution.


  • E-mail this story to a friend!
  • Google
  • Digg
  • Technorati
  • del.icio.us
  • Slashdot
  • TwitThis
  • Furl
  • Fark
  • Reddit
  • StumbleUpon
  • Facebook

Remove Generator Field From WordPress Meta

Wednesday, June 18th, 2008 at 2:03 pm by Kenny

WordPress automagically interjects meta content specifying that the generator of the webpage is WordPress and, specifically, what version it is. Like this:

<meta name="generator" content="WordPress 2.5.1" />

If you want to remove that, there's an easy way to do it. If you don't already have a functions.php file in your theme, create one. Make sure that it starts with <?php and ends with ?> and has NOTHING outside those tags or it will cause your theme to yak.

Now add the following line to your functions.php file:

remove_action('wp_head', 'wp_generator');

And that should do it! Now you can go through all your plugins and remove the comments and other garbage they interject in order to try to hide the fact that you're running WordPress.

Edit:

As Jerry pointed out in the comments, you could still see the generator meta in the RSS feed. I found a solution to this at Bioneural.net.

Simply add this code to your theme's functions.php file.

// Remove WP version info
function hide_wp_vers()
{
    return '';
} // end hide_wp_vers function

add_filter('the_generator','hide_wp_vers');

  • E-mail this story to a friend!
  • Google
  • Digg
  • Technorati
  • del.icio.us
  • Slashdot
  • TwitThis
  • Furl
  • Fark
  • Reddit
  • StumbleUpon
  • Facebook

Posted in WordPress | 3 Comments »

Disable Firefox 3 AwesomeBar

Tuesday, June 17th, 2008 at 12:34 pm by Kenny

I just downloaded FireFox 3 and I'm pretty happy with it. It's fast and works well. The AwesomeBar is a cool feature, but I generally don't like auto-complete (EDIT: for bookmarks or previously typed-in URLs) in a browser, so having it search my entire bookmarks and list all the possible matches is something I wanted to disable. If you're annoyed by the Firefox 3 AwesomeBar (or SmartBar or whatever it's called) like I am, there's an easy way to display it.

Warning: if you are unfamiliar with FireFox's about:config settings, be VERY careful following these steps as you could hose your browser.

  • In the address field, type "about:config", without the quotes, and hit enter
  • In the filter field, type "browser.urlbar", also without the quotes, and hit enter
  • Double-click on the line with browser.urlbar.matchBehavior, change the value in the popup to 0, and click OK
  • Double-click on the line with browser.urlbar.maxRichResults, change the value in the popup to 0, and click OK
  • Now restart FireFox and enjoy!

EDIT: I should clarify that my intent is to COMPLETELY disable the AwesomeBar, not turn it into the old type-in-address-only-matching address bar from FireFox 2.


  • E-mail this story to a friend!
  • Google
  • Digg
  • Technorati
  • del.icio.us
  • Slashdot
  • TwitThis
  • Furl
  • Fark
  • Reddit
  • StumbleUpon
  • Facebook

Posted in Mac | 6 Comments »

Sending Email From PHP On GoDaddy (And Possibly Other Hosts)

Monday, June 16th, 2008 at 11:37 pm by Kenny

Recently, while working on the temporary site for Moonfar, I wanted to send the user an email as confirmation that they had signed up for email notifications. Essentially, you define the recipient, the subject line, the body, a few headers, and then call the mail() function while passing those parameters to it. PHP's mail() function does the rest, provided that your host has PHP configured properly.

Let me preface this by saying that I've only tested this on GoDaddy's Linux Deluxe Hosting plan. If you are trying to do this with another web host, you need to make sure that the install of PHP you are using supports the mail() function.

<?php
  $to = 'user@theirdomain.com';
  $subject = 'Your subject line';

  // the message here is HTML, but you could
  // use plain text in the same manner
  // this could also be pulled from a template file
  $message = '
    <html>
    <head>
      <title>Your Title Here</title>
    </head>
    <body>
      <p>Your content here...</p>
    </body>
    </html>';

  // To send HTML mail, the Content-type header must be set
  $headers  = 'MIME-Version: 1.0' . "\r\n";
  $headers .= 'Content-type: text/html; charset=iso-8859-1' . "\r\n";
  // Additional headers
  // I'm not sure how the To: field in the header functions since it's part
  // of the function call, so I've commented it out here
  //$headers .= 'To: ' . $emailAddr . "\r\n";
  $headers .= 'From: YourName <you@yourdomain.com>' . "\r\n";
  $headers .= 'Cc: ' . "\r\n";
  // if you want to receive a copy
  $headers .= 'Bcc: you@yourdomain.com' . "\r\n";

  // Mail it
  mail($to, $subject, $message, $headers);
?>

It's as easy as that. That said, I read somewhere that there is a 1000 emails per day limit using this method on GoDaddy without paying for outbound emailing services, but I could be mistaken.


  • E-mail this story to a friend!
  • Google
  • Digg
  • Technorati
  • del.icio.us
  • Slashdot
  • TwitThis
  • Furl
  • Fark
  • Reddit
  • StumbleUpon
  • Facebook

WebVisions 2008 Conference Debriefing

Sunday, June 15th, 2008 at 11:05 pm by Kenny

I recently attended the WebVisions 2008 conference in Portland, OR. It was my first conference, so I can't speak to the quality with much experience. However, my general opinion was that there was some good, some bad, and some ugly, as one might expect. That said, the good was well worth the experience. Plus, I won the grand prize raffle: Adobe CS3 Premier. Although, as of the date of this post, I have not yet received it.

You can find the podcasts of the presentations and the associated presentation slides with these links:

Here is a quick debriefing of my impressions of the presentations and the most important things I learned

Blogging For A Living
Jim Turner
http://www.genuineblog.com/

  • Bloggers are social media managers
  • Be an evangelist through your blog
  • Monitor the net for negative or inaccurate information about your organization and use your blog to rapidly respond and provide an official statement to correct misinformation
  • "Control is an illusion. You can't control what is being said. It's already happening. You can't stop employees from spreading information, so push forward with positive blogging." (Paraphrased)

Hacking Social Media
DL Byron
http://texturadesign.com/
http://bikehugger.com/

  • DL was a very inspiring individual, but there wasn't much that I was able to draw from the presentation except for providing examples of how small organizations can combine (through mashups, etc.) services for cheap, rich aggregate tools.

Design Is In The Details
Dan Rubin, Bryan Veloso
http://design.isinthedetails.com/
http://bryanveloso.com/
http://superfluousbanter.org/

  • Great presentation. The best of the conference.
  • Let your layout breathe
    • Allow space between elements
    • You don't need borders on elements if you have 2 elements with a different colored space in between, such as two white boxes with a gap between them on a black background
  • Multiples and factors of a common measurement
    • If your main text font is 12px, then 6, 12, 18, 24, etc. for margins and other sizes are a good way to keep common feel through your site
  • Subtle effects
    • Use effects subtly, such as in drop shadows
    • Add noise for a subtle texture on a background to add a real-world feel
  • To get varying shades of the same color, pick your base hue, then add layers of black or white using soft light blending mode and transparencies to achieve shades and tints

Drupal
Sean Larkin
http://www.opensourcery.com/

  • This presentation sucked was less of a "howto" and more of a "this is how we make money" presentation. I wanted to hear more about how to use Drupal.

Faster, Cheaper, Better
David Verba
http://www.adaptivepath.com/aboutus/david.php

  • This was essentially a review of how it's cheaper and faster to make web apps now, which is obvious and doesn't require a conference session to make that point.
  • Saying "…and finally…" 6 times is 5 times too many.

CSS Transformation
Christopher Schmidtt
http://christopherschmitt.com/

Ruby On Rails
Jim Meyer
http://www.cucinamedia.com/
http://blog.geekdaily.org/

  • Very pro-Agile Dev and pro-TDD (Test Driven Development)
  • For any development, to improve scalability and performance:
    • Stay out of the DB as much as possible
    • Stay out of the dynamic code as much as possible
    • Push info (code?) as close to the user as possible

Web Site Optimization
Kimberly Blessing
http://www.kimberlyblessing.com/

  • Analyze, test, and tune
  • Validate
    • declare a valid DOCTYPE to ensure that the browser will stay in STANDARDS MODE, otherwise it will go into QUIRKS MODE which will cause slower rendering
    • Validate (X)HTML/CSS
  • Simplify
  • Concatenate
    • Use only 1 CSS file and 1 JS file; you can always merge at the build cycle if you prefer to keep them separate for development organization
  • IE-Proof CSS
    • Code against the FOUC (Flash Of Unstyled Content)
    • Don't use @import, use link
  • Call Javascript As Needed
    • Define JS near where it is needed
  • Save Scripts For Last
    • If it isn't needed on load, define it at the end of the page to prevent parsing until the page has displayed
  • If you can't GZip, then strip
    • Get rid of whitespace and comments, convert spaces to tabs (if you want to save spacing) in build phase

  • E-mail this story to a friend!
  • Google
  • Digg
  • Technorati
  • del.icio.us
  • Slashdot
  • TwitThis
  • Furl
  • Fark
  • Reddit
  • StumbleUpon
  • Facebook