Twitter has a serious flaw in its user interface, and I’m surprised it hasn’t been fixed yet given how popular the service is. The “block” link in the right hand column of user pages has undergone a number of changes in the past months:

Notice how the link appears immediately under the “message” link for sending direct messages. Now, users probably rarely block their followers, but might direct message their followers very often. A mouse slip of about 10-20 pixels might cause the user to accidentally click “block” instead of “message”.

This wouldn’t be that bad of a problem, but Twitter has dropped all confirmation steps from the blocking process. This means that if you accidentally click “block” on a follower, you will instantly break the follows between you and that user (both ways), and that user will be added to your block list. If it was an accident, there’s no way you can cause the user to re-follow you. That user must do so themselves.

Previously Twitter brought you to a whole new confirmation page to ensure that you indeed wanted to block that particular user. That then changed to a Javascript popup, which was still acceptable. However, this no-confirmation style is a huge mistake, and a simple search of the terms “message block” will return tweets of users who accidentally blocked their friends.

Cmon Twitter.

Many blogs on the web display the number of RSS subscribers they have via a little FeedBurner chicklet that looks something like this:

It’s plain and simple HTML:

<img src="http://feeds2.feedburner.com/~fc/FEEDNAME?bg=2856e9
&amp;fg=FFFFFF&amp;anim=0" height="26" width="88" style="border:0" alt="" />

Since it doesn’t require authentication, this is also an easy way to look up how many subscribers a blog has if you know the name of the feed. Simply replace the “FEEDNAME” part of the URL with the name of the feed you want to look up. For example, if I replace it with “TechCrunch”, I get the following image:

Voila! An easy way to look up the number of subscribers of a blog that utilizes FeedBurner.

I wanted to load the default filter file of the PHP-IDS project into a PHP variable, and was trying to do it like so:

$filter_file = file_get_contents("./default_filter.xml");
$rules = new SimpleXMLElement($filter_file);

This is what the XML file looked like:

<filters>
    <filter>
        <id>1</id>
        <rule><![CDATA[(?:"[^"]*[^-]?>)|(?:[^\w\s]\s*\/>)|(?:>")]]></rule>
        <description>finds html breaking injections
                   including whitespace attacks</description>
        <tags>
            <tag>xss</tag>
            <tag>csrf</tag>
        </tags>
        <impact>4</impact>
    </filter>
...

Problem is, the CDATA wasn’t appearing in the resulting data structure:

object(SimpleXMLElement)#3 (1) {
  ["filter"]=>
  array(68) {
    [0]=>
    object(SimpleXMLElement)#4 (5) {
      ["id"]=>
      string(1) "1"
      ["rule"]=>
      object(SimpleXMLElement)#72 (0) {
      }
      ["description"]=>
      string(59) "finds html breaking injections including whitespace attacks"
      ["tags"]=>
      object(SimpleXMLElement)#73 (1) {
        ["tag"]=>
        array(2) {
          [0]=>
          string(3) "xss"
          [1]=>
          string(4) "csrf"
        }
      }
      ["impact"]=>
      string(1) "4"
    }

Notice how the “rule” variable in the object is blank. A quick Google search revealed that the solution was the load the XML in the following way:

simplexml_load_file("./default_filter.xml", 'SimpleXMLElement', LIBXML_NOCDATA);

Now the CDATA regex text appears in the object:

object(SimpleXMLElement)#3 (1) {
  ["filter"]=>
  array(68) {
    [0]=>
    object(SimpleXMLElement)#4 (5) {
      ["id"]=>
      string(1) "1"
      ["rule"]=>
      string(41) "(?:"[^"]*[^-]?>)|(?:[^\w\s]\s*\/>)|(?:>")"
      ["description"]=>
      string(59) "finds html breaking injections including whitespace attacks"
      ["tags"]=>
      object(SimpleXMLElement)#72 (1) {
        ["tag"]=>
        array(2) {
          [0]=>
          string(3) "xss"
          [1]=>
          string(4) "csrf"
        }
      }
      ["impact"]=>
      string(1) "4"
    }

[via Tech Thought]

A long while ago, I noticed that Mashable seemed to have faster growth than TechCrunch. Here’s what the latest Compete traffic comparison graph looks like:

It seems like Mashable is actually doing better than TechCrunch now in terms of traffic. Looking at the two sites and what they do, I would guess the difference is due to the fact that Mashable appeals to a much larger audience (ordinary folk) more, while TechCrunch focuses its content to entrepreneurs, venture capitalists, and people generally more interested in the business of Silicon Valley.

However, I would guess TechCrunch is still much more dominant in terms of value and advertising rates, since the readership of TechCrunch is focused and influential. This probably means that though Mashable is reaching more people, TechCrunch is still currently the more influential blog.

Came across this annoying little difference between Firefox and Safari today. Let’s say we have an image:

This uses the following html code:

<img src="http://www.folksonomy.org/assets/2009/11/one.jpg"
alt="one" title="one" name="one" width="300" height="144"
class="aligncenter size-full wp-image-381" />

Notice how there’s a name=”one” attribute on the image. Now, we can change the image using some text that we mouseover. Here’s an example that you can hover over:

Hover over this text

This uses the following HTML:

<strong onmouseover="one.src='http://www.folksonomy.org/assets/2009/11/two.jpg'" onmouseout="one.src='http://www.folksonomy.org/assets/2009/11/one.jpg'">
Hover over this text
</strong>

Now, the problem arises if you use id=”one” instead of name=”one”. Firefox and Safari behave differently in this case. Firefox understands which image you’re referring to, and behaves the same as if you used the name attribute, while Safari doesn’t respond at all.

Thus, if you’ve been using id to identify your elements while testing websites in Firefox, you might not know that a lot people using other browsers might not be seeing the same functionality as you.

This post comes at the end of a day’s worth of technical troubleshooting after I ran into a pretty devastating problem today. I’ll start from the beginning:

My fellow youth group staff and I use a program called CovenantEyes for Internet accountability. It’s a terrific program that works very well, except for one annoying issue on my MacBook Pro: It regularly causes kernel panics, which means my screen grays out and a message appears, telling me that I have to reboot my computer. I can’t backup what I’m working on or anything.

Anyhow, while I had my 500GB external harddrive plugged in and mounted today, CovenantEyes caused a kernel panic. After rebooting my computer, I discovered that I couldn’t access the drive. When I plugged in the drive in, an error would pop up saying, “The disk you inserted was not readable by this computer“, and gave me the options Initialize, Ignore, and Eject.

When I clicked Initialize, the Disk Utility popped up, but all the repair/recovery options were grayed out. There was nothing I could do. The computer could detect the drive, but could not repair it.

I suspected that the drive had gotten corrupted, even though I wasn’t using it at all at the time of the kernel panic. This problem never happened to me back when I used a PC, even though I pulled out USBs left and right without “safely stopping” the drives.

After poking around on the Internet, everyone seemed to recommend a program called DiskWarrior. They claimed that it almost always helped rebuild hard drives even when they’re unmountable.

With seemingly no other options, I shelled out $110 and purchased a copy of DiskWarrior. After all, I have a lifetimes worth of memories stored on this hard drive (I have most of it backed up on DVDs, but haven’t done so in the past half year).

When I opened up DiskWarrior, I was shocked to see that there was nothing it could do. The program displayed an error saying that the drive wasn’t formatted for Macs, so there was no way it could rebuild it.

At this point I realized that the disk wasn’t a HFS (Mac’s file system) formatted disk, but was instead formatted as FAT32. Thus, I had no choice but to wait a few hours until my roommate got home, so I could use his Windows XP laptop to attempt a recovery.

Once I was on his computer, I plugged in the drive and received the following error, “Drive E: is not formatted.“, and prompted me on whether to format it or not. Obviously I chose not to.

After poking around a bit more on the Internet, I saw that a lot of people mentioned a utility called TestDisk, which is free and available for most (if not all) operating systems. It’s extremely lightweight, and doesn’t even require an installation.

Here are the steps for what to do:

1. Choose a logging method (I chose No Log)
2. Select the drive you’re trying to fix (If your drive doesn’t show up, it’s likely that your problem is different)
3. Select the partition type (It will default to what it thinks the drive is. Most likely it’s right)
4. Select Advanced

Now at this step, my screen looked something like this:

Notice how it tells you the status of your main boot sector and your backup boot sector. In my case, it said “Bad” under the main one and “Good” under the backup one. If this is the case for you as well, all you need to do is select “[Backup BS]“. What this does is recover the main boot sector using the backup one.

This “fix” literally takes less than a second (there’s a confirmation page). It then takes you back to the previous page and shows “Good” under both boot sectors.

Suddenly, I was able to access my external hard drive again, and everything was as good as new.

Wasted $110 on DiskWarrior for Mac, but at least it still has some usefulness and I learned a lot about disks along the way.

Hopefully this is helpful if anyone runs into the same problem I did.

There’s quite a lot that’s good about Macs and Mac OSX. However, I still feel like Windows wins in big ways. For example, DiskWarrior costs $99 and there isn’t even a demo to test whether it will actually fix your problem. TestDisk is free, and doesn’t even require an install (though it IS available for Mac too…).

I think Mac is WAY too proprietary. Next comes Windows. Then comes Linux. Haha.

Suppose you’re automatically parsing a webpage, and you come across the following kind of thing:

blah blah
some starting text
some useful content
some ending text
blah blah

We want to parse out the useful content from among the non-useful stuff, and we know there’s some starting text and some ending text that wraps the useful content.

A better example:

I like chicken
<div class="dog" style="border: 0px">
     I don't like to eat fish
</div>
<div class="fish">
I like to eat pork
</div>

How can we obtain just the text between the divs if we know the exact code that is immediately before and immediately after?

Here’s a PHP function you can use to accomplish this. It only uses the split() function:

<?php
function get_stuff_between($string, $start, $end){
	$content = split($start, $string);
	$content = split($end, $content[1]);
	return $content[0];
}
?>

If we have the example HTML code stored in the string $content, then we can obtain the text we want by calling the function like this:

get_stuff_between($content, '<div class="dog" style="border: 0px">', '</div>
<div class="fish">');

This returns the string

I don’t like to eat fish

Note that this requires the start and end strings be unique in the document, though it’s often pretty common for there to be such unique strings immediately before and after the content you want to parse.

The practical application for something like this is if you’re automatically parsing many HTML documents, and you’d like to extract only a portion of each document that’s neatly delimited by invariant tags.

There’s probably more flexible ways of doing this using preg_grep or preg_match_all, but I found this way to be easy and sufficient for what I needed to do today.

Was chatting with some youth groupers this evening when one of them started typing in text that was upside down. When we asked how did he it, he linked us to this page.

I tried fooling around with the app a little, and decided to confuse the youth groupers even more by only flipping every other word. This paragraph would end up looking like this:

i pǝıɹʇ fooling punoɹɐ with ǝɥʇ app ɐ little, puɐ decided oʇ confuse ǝɥʇ youth sɹǝdnoɹƃ even ǝɹoɯ by ʎןuo flipping ʎɹǝʌǝ other ˙pɹoʍ this ɥdɐɹƃɐɹɐd would puǝ up ƃuıʞooן like :sıɥʇ

Haha.

So anyhow. I decided to quickly make another “sandbox project” that allows you to flip every other word like this. It’s called scramblizer. Completely useless, but might be fun for playing a trick on your friends.

Maybe if there’s other interesting transformations I can add it to the app in the future.

Update on 10/7/09: Just added options for choosing how you’d like your words scrambled.

Got the following error today when trying to submit a form in Ruby on Rails:

ActionController::InvalidAuthenticityToken

The solution turned out to be as easy as inserting

<%= token_tag %>

into my form.

[via Nabble]

Twitter changed how links work recently, so now when you click a link the first thing that actually loads is something like:

http://twitter.com/link_click_count?url=STUFF

I don’t like it.

First off, it’s messier. Instead of clicking through normal links now we’re getting redirected for internal links. That’s weird.

Second, it puts another level of failure and slowness between users and the places they’re trying to reach via the links. It looks like the redirection/tracking is only happening for internal links, so if twitter is down then the link would probably be down anyway, but I feel like things are a little slower anyway with the intermediate step.

Hmm…