Get the keyboard layout you want

some-key-stickersI started using computers ages ago in Argentina. We only had US Qwerty keyboards back then and I’ve got used to them. The Spanish keyboards appeared later on and I never switched. I never understood what was the deal with those. I can type almost any character I want with a US Qwerty keyboard, even Spanish ones like á, é, í, ó, ú, ñ, ü. But furthermore, most characters used for programming are much harder to access in a Spanish keyboard.

Years latter I switched to Dvorak, making my problems of layout even worse, but increasing my geek-coolnes. In some keyboards you can move the keys around to convert US Qwerty into Dvorak, but you cannot convert Spanish into Dvorak by moving keys around. That’s because the symbols are not grouped in the same key. While in both US Qwerty and Dvorak you have a key that has “.” (dot) and “>” (greater than) in Spanish you have a key that has “<” (lower than) and “>” (greater than).

So if you want to switch Spanish to Dvorak, like I did, or you want to switch Spanish into US Qwerty or French into German, or whatever, you have to totally re-label the keyboard. There’s a company called Hooleon that makes a Keyboard Replacement Overlay Kit that will allow you to turn any keyboard into US Qwerty, or Dvorak, or anything you can think that uses the US Qwerty set of keys. It’s basically a set of stickers that you put on your keys. They are very durable, more than some keyboards, and they look quite good.

They also make a Qwerty-Dvorak conversion kits, which is the best option to convert US Qwerty into Dvorak (they don’t provide numbers and other keys that stay the same). And if you switch to another language they have many language-changing kits to many languages. If you have a keyboard, you might just swap it for another one, but if you have a laptop, this solution is excellent. I’m really grateful there’s a company providing this product because it’s served me well for ages until I got a really good keyboard.

Now I have a MacBook Pro with beautiful back-light keys. I’m not going to put stickers on them, I have to remove them and re-place them. That’s not trivial in a laptop keyboard, so I’m still building up courage.
key-stickers

Disclaimer: I’m in no way affiliated with Hooleon, I just love their products.

Reviewed by Daniel Magliola. Thank you!

Advertisements

File input for forms in ASP.NET MVC

fileI’m not sure why ASP.NET MVC was shipped without a file input type for forms. Maybe it’ll come in MVC 2.0 or 3.0. Meanwhile, I created one. I spent two or three hours trying to figure out how to go from Object to IDictionary<String, Object> to follow the same ASP.NET MVC style where you have methods like:

TextBox(HtmlHelper, String, Object, IDictionary);
TextBox(HtmlHelper, String, Object, Object);

which are essentially the same. The last argument is a dictionary of extra HTML attributes, like style=”float: left;”. The good thing about accepting Object Is that you can call it this way:

Html.TextBox("email", new { style="float: left;" })

which is very handy for forms. The bad thing is that it is a pain in the ass to do that hocus pocus in C# using reflection. Thankfully ASP.NET MVC is open source. I downloaded the source and after 15 minutes I got it working nicely (and without manually using reflection). Use the source Luke!

In a recent episode of Hansel Minutes podcast someone argued what was the value of releasing the code of ASP.NET MVC at all. Well, this is the value. You help developers, you build a better developing community.

Without further ado, here’s the code:

public static class HtmlHelperExtensions {
   /// <summary>
   /// Returns a file input element by using the specified HTML helper and the name of the form field.
   /// </summary>
   /// <param name="htmlHelper">The HTML helper instance that this method extends.</param>
   /// <param name="name">The name of the form field and the <see cref="member">System.Web.Mvc.ViewDataDictionary</see> key that is used to look up the validation errors.</param>
   /// <returns>An input element that has its type attribute set to "file".</returns>
   public static string FileBox(this HtmlHelper htmlHelper, string name) {
       return htmlHelper.FileBox(name, (object)null);
   }

    /// <summary>
    /// Returns a file input element by using the specified HTML helper, the name of the form field, and the HTML attributes.
    /// </summary>
    /// <param name="htmlHelper">The HTML helper instance that this method extends.</param>
    /// <param name="name">The name of the form field and the <see cref="member">System.Web.Mvc.ViewDataDictionary</see> key that is used to look up the validation errors.</param>
    /// <param name="htmlAttributes">An object that contains the HTML attributes for the element. The attributes are retrieved through reflection by examining the properties of the object. The object is typically created by using object initializer syntax.</param>
    /// <returns>An input element that has its type attribute set to "file".</returns>
    public static string FileBox(this HtmlHelper htmlHelper, string name, object htmlAttributes) {
        return htmlHelper.FileBox(name, new RouteValueDictionary(htmlAttributes));
    }

    /// <summary>
    /// Returns a file input element by using the specified HTML helper, the name of the form field, and the HTML attributes.
    /// </summary>
    /// <param name="htmlHelper">The HTML helper instance that this method extends.</param>
    /// <param name="name">The name of the form field and the <see cref="member">System.Web.Mvc.ViewDataDictionary</see> key that is used to look up the validation errors.</param>
    /// <param name="htmlAttributes">An object that contains the HTML attributes for the element. The attributes are retrieved through reflection by examining the properties of the object. The object is typically created by using object initializer syntax.</param>
    /// <returns>An input element that has its type attribute set to "file".</returns>
    public static string FileBox(this HtmlHelper htmlHelper, string name, IDictionary<String, Object> htmlAttributes) {
        var tagBuilder = new TagBuilder("input");
        tagBuilder.MergeAttributes(htmlAttributes);
        tagBuilder.MergeAttribute("type", "file", true);
        tagBuilder.MergeAttribute("name", name, true);
        tagBuilder.GenerateId(name);

        ModelState modelState;
        if (htmlHelper.ViewData.ModelState.TryGetValue(name, out modelState)) {
            if (modelState.Errors.Count > 0) {
                tagBuilder.AddCssClass(HtmlHelper.ValidationInputCssClassName);
            }
        }

        return tagBuilder.ToString(TagRenderMode.SelfClosing);
    }
}

Reviewed by Daniel Magliola. Thank you!

Music for coding

Back to the FutureI’ve been looking for ages for the perfect music for coding. I’ve asked around and tried new age, Mozart, Bach, and other academic music. I’ve tried instrumental soothing music and instrumental electronic music. Nothing worked until I started to expand my original coding music: Indiana Jones and the Last Crusade.

Yes, I used to code to the music of Indiana Jones and the Last Crusade and I loved it. I started to try others and I’ve found I like coding to these albums:

I’m looking for more. There’s a clear pattern: instrumental and fast. It has to be of movies I’ve seen. When I listened repeatedly to Indiana Jones and the Last Crusade when I was a teenager I would recreate the whole movie in my head. I don’t do that anymore but the music still carries some subconscious meaning. I’ve tried with music of movies that I haven’t seen and it doesn’t work. And some don’t work and I don’t know why. These songs work as isolated songs, but not the whole album:

All by Vangelis of course. Star Wars music kind of works, but only some songs. I still have to sit down and select them (6 albums, lot of work). I remember other music like Apollo 13 also worked, but I don’t have it anymore.

What do I mean by work? It seems that music speeds me up. It makes me work faster, concentrate more and enjoy myself more. It makes me not want to stop, like watching a good movie. What do you listen to? Any other movies with great coding music?

Reviewed by Daniel Magliola. Thank you!

SSL with multiple virtual hosts and only one IP

Image taken from http://www.artlebedev.com/everything/defendius/

I was writing this long post about how to use rewrite rules to make Apache query itself and serve various sites through the same SSLed virtual host using only one IP. After about four hours of struggling with it I thought I was done but then while writing this article I found out I was wrong. Something was not working as expected. Did I face another 4 hours of Apache struggling? Continue reading

Proper linking ettiquete

This has been mentioned thousands of times on the interwebs, but in case there’s at least one person reading this that didn’t know it, I’m explaining it again. Using hyperlinks in a piece of text doesn’t mean it has to stop being proper, readable English (or any other language). For example, imagine the phrase:

It was a nice movie, click here to read more about it.

Read it again. Now close your eyes and imagine someone reading it out loud. It doesn’t make any sense, does it?

Hyperlinks already carry the meaning that there’s more information behind them. No need to repeat it with “to read about it”. And they also carry the information about being clicked, so no need to say “click here”. And in some interfaces you don’t click, and I can think of already two cases:

  • People using the keyboard and only the keyboard to navigate. They are more than you think. I myself would be doing it much more if it wasn’t so hard on so many broken web sites.
  • People using a phone, like the iPhone. You don’t click, nothing clicks. It’s called tapping.

For computers “click here” doesn’t provide any proper meta-data. There are services that extract a lot of information about links. Google being one example. Let’s analyze what would happen to Google if you do it correctly, like:

It was a nice movie.

That was short, wasn’t it? Half the size and no-nonsense, but I digress. Google would index that link as a “nice movie” and that’s good because you are adding information to the web, you are expressing your opinion and when people search for “nice movie” they are more likely to find the movie you pointed to. Maybe you are the only one believing that’s a nice movie, but when lots of people link to it as a “nice movie”, Google will catch that.

Also, imagine that your page gets turned into plain text, or printed, or spoken, or whatever:

  • It was a nice movie, click here to read more about it.
  • It was a nice movie.

Which one makes more sense?

Now, we can take it a step further. Something else you can do to make your text more readable, more robust and nicer overall is to do more or less proper attribution. I’m not talking about academic proper attribution, I’m taking about simple things. I’ve recently found this sentence in the Stack Overflow article Advice for Computer Science College Students:

I’ve read an article from Joelonsoftware.com a few years agohttp://www.joelonsoftware.com/articles/CollegeAdvice.html

which I promptly edited, thanks to my karma earnings, to be:

I’ve read the article Advice for Computer Science College Students from Joel on Software a few years ago.

Aside from the proper period at the end of a sentence, do you see how and why my version is more readable, contains much more information (while being shorter on text on the screen) and can resist being turned into text, speech or braille? So, next time you write something, please, remember that even if you are using a computer, you are still writing a proper language.

Sometimes the links are so important that you want them to get to a text or spoken version. In that case, imagine how you would write it if you were speaking or writing with a pen on paper:

I really like Joel on Software, which you can read on http://joelonsoftware.com.

which you can then later enhance for the web:

I really like Joel on Software, which you can read on http://joelonsoftware.com.

Now there’s extra information in there. The URL is there three times, one in text, two in hyperlinks. But the text is not longer and it’s not harder to read (unless you pick up hyperlink colors badly) and it gives the user more places to link, machines that look for context information more to pick up from. It’s a win-win.

Reviewed by Daniel Magliola. Thank you!