Dynamically Resize a Textarea

February 19th, 2009

The other day I was looking for a solution to allow a user to dynamically resize a textbox. I first saw this feature in wordpress and wanted something similar for a site I was designing. Since wordpress is open source I had considered looking at their code to figure out how it was done. After searching google for a few minutes I came across a site that had put together some functions to make the job of implementing this feature very easy.

When the textbox is displayed on a site it looks like the following:

In order to place the texbox on your site you just need to download the source code and put something like the following on a webpage.

<link rel="stylesheet" href="/include/resize-textbox/style.css" type="text/css" media="screen" />
<script src="/include/resize-textbox/resize-textbox.js" type="text/javascript"></script>
<div id="rtContainer" style="border: 1px solid black; width: 480px; height: 250px;">
    <script type="text/javascript">
    <!--
    var rt = new ResizeableTextbox('myRT');
    rt.SetText("I Am Some Text");
    // -->
    </script>
</div>

Doesn’t get much easier!

Now to critique the code a little. I wish the javascript functions were encapsulated in a class so I would not have to worry that another function might conflict with the functions for resizing the textarea. This is a fairly easy feature to add so it does not bother me to much.

Chrome Textarea

Chrome Textarea

In testing this code I found out that both Chrome (Google’s browser) and Safari already have the ability to dynamically resize a textarea built into the browser. Both browser’s implemented the feature by adding a little icon in the bottom right of the textarea. This is a nice feature and hopefully the other browsers will also add this feature to their future versions.

Now, if you are implementing the code on this page to give all browsers the ability to dynamically resize the textarea. You may want to disable the built in resize feature of both Chrome and Safari. This can easily be done with the following css.

#myRT{resize: none;}

Best Water Bottle for Computer Geeks

January 30th, 2009
Standard Mug

Standard Mug

Everyone will probably laugh at me for this one but I just have to say it. I have found the ultimate water bottle to have at my desk. There is always the standard coffee mug and I have seen other engineers use these. The problem with the mug is it is too small. When I am writting code I don’t like to stop to get more water and will often forget about the water because I’m more focused on the programming than anything else.

My prefered water container needs to hold a good amount of water since I should be drinking somewhere around 10 cups of water a day. Most water bottles contain around half of that amount which means only one (maybe two) trip to refill per day.  This makes a water bottle a good solution to have near the computer.

Now the problem with most water bottles is that they are easy to spill. Some have caps that you unscrew and then drink the water. As soon as I unscrew the cap there is a high chance that I won’t bother to put the cap back on. When developing software I am often shuffling books, papers, pens on my desk. With all of the shuffling my chance of nocking over the water bottle is pretty good. Considering I have a fairly expensive computer under my desk that would be a very bad thing! I just need to find a water bottle that is easy to use and won’t spill.

After a bit of searching I found the perfect water bottle to have at my desk it is called a CAMELBAK. This water bottle has a great design. You can drink from it and no longer worry about spilling water on your important documents, books, or computer equipment. You can hold it upside down and no water comes out. Then when you want to drink from it you bite the nipple and suck (was there a better way to say that?). The bottle comes in different sizes ranging from .5 Liter to 1 Liter and a wide variety of colors. I bought the black 1 Liter and have been very happy with it.

Open Excel in Multiple Windows

January 29th, 2009

In my previous post I mentioned that there was a way to create a bat file to force Excel to open each file in a new window. Opening Excel in multiple windows makes it easier to use Excel across multiple monitors and gives back the standard alt+tab to flip between Excel Spreadsheets. The problem with my previous solution was that the Excel files loose their icons. Unfortunately because the solution uses a bat file the icon cannot be changed. So I took the previous solution and enhanced it a little bit.

OpenOffice Icon

OpenOffice Icon

This solution uses the same principle but installs a program instead of using a bat file. This program has an icon so all the associated Excel files will also use that icon. I was originally hoping to use the Microsoft Icon for this program but after looking at their Terms of Use a decided to use the Open Office Icon.

Without further ado the directions to get Excel running on multiple monitors is below:

1. Download the following file and run the installer.

DOWNLOAD: Open Excel in Multiple Windows
If you cannot install this application because you need admin privileges you can download the following file. Then follow the directions below and make sure you browse to the location of where you stored this download (in the 2nd step).
DOWNLOAD: Standalone - Open Excel in Multiple Windows

2. Update the file association for each Excel File.

Right click the excel file and select “Open With…” and then in the window that opens click “Browse…”

Open With

Then select the program that you just installed. By default it will be installed at C:Program FilesBrett BatieExcel on Multiple MonitorsrunExcel.exe. Make sure that “Always use the selected program to open this kind of file” is checked in the “Open With” dialog.

Now anytime you open an Excel file it will open a new copy of Excel.

changelog:

1.1 - Fixed a problem where filenames with spaces would not open.

Selecting Overflowing Text in IE

January 21st, 2009

I noticed a problem with how IE supports overflowing text today. The problem is that the text can not be easily selected (with a mouse) when using overflow: auto; and white-space: nowrap. Here is an example to demonstrate this problem.

This text is not easy to select in IE because it will not automatically scroll to the right when the user is selecting it

The HTML for this example is below:

<pre style="border: 1px solid black; overflow: auto; width: 250px; white-space: nowrap; height: 40px;">;This text is not easy to select in IE because it will not automatically scroll to the right when the user is selecting it</pre >

I was able to solve this problem by changing overflow: auto; to overflow: scroll; as can be seen below.

This text is not easy to select in IE because it will not automatically scroll to the right when the user is selecting it

The HTML for this example is below:

<pre style="border: 1px solid black; overflow: scroll; width: 250px; white-space: nowrap; height: 40px;">;This text IS easy to select in IE because it will not automatically scroll to the right when the user is selecting it</pre >

I do not love this solution as it will always show the scroll bars even when they are not needed. Until someone finds a better solution or IE handles this better I will have to put up with it.

Open Excel in Two Windows (Microsoft Excel 2007 / Windows Vista)

January 19th, 2009
There is a flaw with the below solution it causes the associated Excel files to loose their icons. I posted a follow-up article for opening Excel in Multiple Windows that provides the same solution while associating a new icon with the Excel Files.

When you open an Excel file in Windows Vista, it will only open 1 instance of Excel and force you to tile the windows in order to see both at the same time. I find this annoying especially when I want the Excel files to display on multiple monitors.

I looked around for some solutions and found the following:

I didn’t like using the start menu option as I like to use Windows Explorer to open my Excel files and I couldn’t get the DDE option to work. So, I took a minute and developed my own fairly simple solution.

1. Put the following line of text in a bat file and save it at as c:\Program Files\runExcel.bat

start "Excel" "c:\Program Files\Microsoft Office\Office12\EXCEL.EXE" /e %1

2. Modify the shortcut for the .xls extension

Right click the excel file and select “Open With…” and then in the window that opens click “Browse…”

Open With

Then select the bat file you created in the first step by browsing to c:\program files and selecting runExcel.bat. Make sure that “Always use the selected program to open this kind of file” is checked in the “Open With” dialog.

Now anytime you double click on an Excel file it will always open it in a new window – the way I think it should be.

Verify a Password Protected Site with Google (Adsense, Wordpress)

July 22nd, 2008

I previously discussed how to get Google to verify a WordPress blog by making a few modifications to the .htaccess file. I would like to take this a step further and discuss how a password protected site can be verified with Google. Verifying a password protected site became necessary for me when I wanted to add a password protected site to Adsense.

The first thing that needs to be done is to have your server respond with a valid 404 error by adding something like the following to your .htaccess file.

ErrorDocument 404 "This file does not exist."

Now you just need to give Google access to two files with a name similar to google54fbcc37db740a4d.html and noexist_54fbcc37db740a4d.html. You will need to login to Google’s Webmaster Tools Dashboard to see what the google*.html filename is in your case and then replace the “google” part with “noexist_” for the second file. Now that you have the names you will need to modify your password protection code that looks something like the following to exclude the two files from password protection.

AuthGroupFile /dev/null
AuthName "A Blog"
AuthType Basic
AuthUserFile /home/user/domains/domain.com/.htpasswd
require valid-user

To exclude the two files you would add the below code to your .htaccess file.

<FilesMatch "(google54fbcc37db740a4d\.html)|(noexist_54fbcc37db740a4d.html)">
  Allow from all
  Satisfy any
</FilesMatch>

Don’t forget to create the google*.html file on your server and replace the names of the files in the above code with your filenames.

Extra Directions for WordPress

Now the above directions should be enough for most password protected sites but for WordPress that is using permalinks one more thing needs to be done. You need to tell WordPress to not send the request for noexist_*.html to index.php. To do this find the following code in your .htaccess file.

1
2
3
4
5
6
7
<IfModule mod_rewrite.c>
RewriteEngine On
RewriteBase /
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule . /index.php [L]
</IfModule>

and add the following RewriteCond after line 5.

RewriteCond %{request_uri} !^/noexist_54fbcc37db740a4d.html$ [nc]

Verify a WordPress Blog with Google

July 21st, 2008

In order to verify your site with google you need to go to Google’s Webmaster Tools Dashboard and add your website and then click verify. After clicking verify it will ask you to put a file on your website with a name similar to google54fbcc37db740a4d.html. In most cases this is all that needs to be done and then google can verify that you are the owner.

If you are using permalinks with WordPress it is not so easy to get Google to verify your site. There are two items that are causing validation to not work with WordPress. First, Google is trying to access more than just google54fbcc37db740a4d.html it is also trying to request a page that does not exist. When I tested it, Google was also asking for noexist_54fbcc37db740a4d.html. You might notice that Google just replaced the word “google” with “noexist_”. Second, WordPress is taking a request for any page (including ones that do not exist) and trying to find an appropriate page and is therefore not returning a 404 error. These two problems cause Google to respond with the following error when you try to validate your site.

We’ve detected that your 404 (file not found) error page returns a status of 200 (Success) in the header.

 The code that causes WordPress to not return a 404 for an invalid page is the following which is in an .htaccess file.

RewriteEngine On
RewriteBase /
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule . /index.php [L]

After creating your file google54fbcc37db740a4d.html and adding it to your server you just have to modify the above .htaccess file to have it not redirect the request for noexist_54fbcc37db740a4d.html to index.php. You also need to specify a specific page or message to display when a 404 error occurs. You can do that by replacing the above code with the following code.

RewriteEngine On
ErrorDocument 404 "This page does not exist"
RewriteBase /
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteCond %{request_uri} !^/noexist_54fbcc37db740a4d.html$ [nc]
RewriteRule . /index.php [L]

Make sure you replace the 54fbcc37db740a4d in the above code with the same characters of the file that google tells you to add to your website.

Password Protect All but One File (htaccess)

July 20th, 2008

Once in a while need to allow someone access to one file but no other files in the same directory. I often solve this problem by moving the one file to a sub directory and then adding the following to an htaccess file in that same sub directory.

allow from all
satisfy any

This normally works well but is not a perfect solution since it is not always appropriate to move the file to a different directory. So, I took the time and figured out how to password protect everything but one file. Below is the basic password protection that I had in the htaccess file that blocked everything in the directory (and sub-directories).

AuthGroupFile /dev/null
AuthName "A Blog"
AuthType Basic
AuthUserFile /path/to/.htpasswd
require valid-user

Now in order to exclude a file I just had to add the following below the above six lines of code.

<Files "page.html">
  Allow from all
  Satisfy any
</Files>

Of course this can be taken one step further if you wanted to exclude multiple files from password protection.

<FilesMatch "(page1\.html)|(page2\.html)">
  Allow from all
  Satisfy any
</FilesMatch>

FilesMatch can take a regular expression so you don’t necessarily have to list out each file. The below code will also accomplish the same thing (as above).

<FilesMatch "page[1-2]\.html">
  Allow from all
  Satisfy any
</FilesMatch>

Count Lines of Code in C#

December 4th, 2007

When I am programming I often wonder how much code I have actually typed. Sometimes when I get in the zone, have a well thought out design and have auto-completion helping, I can generate code pretty quick. Although there are quite a few programs out there that will count the lines of code some are a bit more intelligent than others.

At the most basic level a simple command in DOS can count the lines of code in a file or directory. But, I often want to a little more than just the the number of lines in each file. I want to know things like the lines of code vs empty lines and the number of lines that contain comments. Fortunately, there is a plug-in for Visual Studio that will do just that. Since, I am normally using Visual Studio to write any program in C# this is a very logical place to have this tool.

C# count lines of code

My next mission will be to find a good line counter for Java. Anyone know of any?

What Is the Best Email Client?

December 1st, 2007

Determining the best email client is not a clear cut decision as there are quite a few ways one might manage their email. Although, I do think it is interesting that Thunderbird comes up first when searching Google for the phrase What Is the Best Email Client. I have to admit I agree with Google on this one Thunderbird is really good!

The thing I love most about Thunderbird is it’s IMAP support. I believe IMAP is the best way to read email since the email is kept on the server. This allows the email to be accessed from any computer (home, work, friends house, etc). With that definition it doesn’t sound like it is much different than a web based email client (SquirrelMail, GMail, Hotmail, etc) but it is!

The main feature that makes me believe that Thunderbird is better than a web based email client is the way email accounts are accessed. I can have 10 different email accounts that exist on 10 different servers and only need 1 application (Thunderbird) to access them all. Also, since the application is running on my computer it tends to run a little faster than a web site that will need to reload the page anytime I click something.

GMail does have a good user interface and page load time is pretty quick with their use of ajax. Although, if you are using dial-up Internet you will definitely notice a difference as the first time Google loads it can take quite a while which can be seen in the screenshot below.

GMail slow startup when using dialup

GMail is probably my favorite web based email client but I really like to have more control over my email than what Google gives me. I like to know that if my email starts consuming 100 gigabytes of space that I won’t have a problem. Since I run my own mail server, I like knowing that my email is backed up and where it is backed up. So I don’t have to worry about Google one day saying sorry we lost half of your email. I also like knowing that I have control over my email and Google can’t one day decide to hold my email for ransom (not that I really believe Google would).

Google has recently started offering IMAP support (where they were only offering pop). I have been waiting for that feature for a few years and am very glad that that started supporting it. Now I can access my GMail account in Thunderbird too!

So, what about other email clients like Outlook, Outlook Express, Windows Mail. Although, I do like a lot of the features that Outlook has like managing appointments and contacts. It’s support for IMAP is pretty bad. Since IMAP is what I like using there really is no good competition.

Actually, I can think of one other email client that I have considered moving to in the past due to its speed and quick access keys. That client is Pine developed by the University of Washington. It is a text only email reading client and it supports IMAP. I love how fast I can read my email’s in Pine and I also love that I don’t have to wait for large HTML email’s to load or worry about some hidden link (phishing) or virus that could be hidden in the HTML. Unfortunately, I also like reading some email’s that come in an HTML only format. So, that one reason alone is enough for me to not use it.

That said, I would love to hear what email client you are using and why you have chosen to use it?