Where can I download Olson timezone files?

If you’re working with timezone-js, or some other JavaScript timezone date library that works off of real tz information, you’ll likely need Olson timezone files to make that happen.

Unfortunately, too many sites or forums tell you to try sites like http://www.twinsun.com/tz/tz-link.htm which only have broken links.

Because it took me some time and google foo to find the correct download site, I’ve been linking to the IANI anytime I get a chance, as it serves up working tz files. Download Olson timezone files now!

Timezones and date manipulation in JavaScript

One issue with web development is that your applications are immediately available to the world. As such, you want your application to work well for whoever is using it, and a big part of who someone is, is where they live.

Where you live determines what language you speak, what units you measure with, etc. Another important aspect of location is time, and the fact that each location has its intricacies about how it deals with time, whether it be timezones, daylight savings, or what day the week starts.

Fortunately, JavaScript has native support for time, and for the timezone the user is currently located in. Unfortunately, your user might travel, or your app might require collaboration across continents. How do you deal?

As far as I know, there isn’t a single JavaScript library that supports both full timezone support and easy date manipulation. But there are two that are highly helpful for each of these tasks.

TimezoneJS creates a new TimezoneJS.Date object which has native timezone support using Olson TZ data files. Although it requires you to use a new Date object, its quite helpful in enabling the use of any timezone you want, as long as you keep those timezone files up to date.

Datejs is a great, albeit, old library that extends the prototype of the native JavaScript Date object to add incredibly useful helper methods and pretty date printing (another core feature missing from the native object). Another overlooked feature of Datejs is that its maturation means globalization support in the form of Culture files, which define how different parts of the world think of time.

Obviously, using both of these standalone is possibly, but switching between objects can be cumbersome, so I began the process of making Datejs work for the TimezoneJS.Date object.

For this to work, simply use TimezoneJS, add a culture file from Datejs’s repo, and add timezone-js-sugar. The timezone-js-sugar package is simply a port of Datejs’s core, but gives you a bunch of helpful helpers and pretty date printing.

Side notes:

  • timezone-js require Fleegix out of the box, however, you can also use it with jquery just by adding the timezone-js-jquery add on
  • I’ll be making some bug fixes to timezone-js at here

Canvas text labels in Flot graphs

While html ticks, labels, and legends are great for styling and extendability by default, there are times it’d be nice if all of that information was on the graph itself, like when you want to convert the canvas image to real image, i.e. through data uris:

canvas.toDataURL("image/png");

Anyway, Andre Lessa did just that with his Flot canvas text plugin that was inspired by the Jim Studt’s canvas text.

I’ve copied Lessa’s library to github and patched a small issue I encountered. Check it out at flot-text on github.

Side note, if you’re having trouble getting your canvas saved images to have a white background (in chrome and ie they’ll default to a black background because they’re actually transparent by default), then check out this blog on how to resolve that: http://www.mikechambers.com/blog/2011/01/31/setting-the-background-color-when-generating-images-from-canvas-todataurl/

Lessons learned: How to develop an idea

Introduction: During my self mandated separation from technical projects and ideas last summer, I decided to try to put together a list of lessons learned during past (failed, yes all failed) projects. I quickly jotted some things down and my reasoning for them, and have cleaned it up a bit. All of it is pretty obvious, but hard in practice, and I probably emphasize areas that afflict me most.

This list mainly concerns software startups, but applies to business/project ideas in general.

What not to do:

  • Plan too much: Some planning is necessary. But you should plan for your immediate goals and be okay with a slightly fuzzy long term goal. You WON’T be able to see everything ahead of time. And trying to solve every problem in advance is very unlikely. You won’t completely understand what you need until you get there. So get there. Do what you can do, and work on the problems as they present themselves.
  • Wait to get started because of the one part that doesn’t work right: Similar to above. Unless it’s the innovation, don’t wait to get started because you’re not sure about a small part/library you should use/design pattern. Try something out, and if it’s no good, redo/refactor it later.
  • Wait to do anything real: Work on the feature that’s the innovation if you can. This is what sets you apart.
  • Not buy the domain: It would really suck if it was gone. For whatever reason, names mean a lot to projects, and are often a source of motivation for their innovation/stupidity more that the project itself.
  • Not look for existing applications/implementation: If people are already using a tool like yours, it’s going to be hard for them to switch. The cost of change will almost always prevent people from trying out your site if they have something in place. You must either be able to make their lives easier in a short amount of time (so you’ve got to develop what already exists + the small upgrades within the same time the small change can be expected from your competition) or have an innovation that changes the way that tool works and demands a change.
  • Expect immediate success: Keep your eyes on your immediate goals. Don’t give up unless there’s an obvious reason to.
  • Need an amazing environment: You don’t need to have the most amazing development setup ever. Spending all your time trying to make yourself more efficient only makes you efficient at thinking about how to be more efficient. Do something.
  • Have to use the latest tools: Unless this is your goal, or you absolutely need something from a language/library, get it out there quickly by doing it the way you know how right now. If it’s modular, you can drop in another library later.
  • Take forever selecting a library: Test things instead of thinking too much. The best way to learn is to start writing example code.
  • Expect people to care: they won’t. Almost everyone will think your idea is horrible.

What to do before you start:

  • Have an innovation/idea: This seems obvious, but I’m being serious. Are you actually giving something to your audience that they haven’t had before? Just because its cool doesn’t mean it’s useful.
  • Source control: It’s easy and quick to do, don’t wait. Invest some time in knowing the best practices. Only need to learn once.
  • Planning tool: Pen and paper, to do list, project management software. You need something that allows you to list what you need to do and their priority. The priority is just as important as what you’re doing. The priority should be determined by necessary dependencies and what makes your idea special. The more granular and organized your tasks, the easier it’ll be to know what to do next.
  • Always know what to do next: Thinking about what to do wastes time.
  • Set goals/deadlines: If you’re serious, you need to know when you’ll get things done realistically. It’ll probably still take twice as much time as you intend, but this will let you know what you’re in for and if you’re up for it. Make SMART goals.
  • Revise your plans at everyso often. Iterative development
  • Reuse whatever you can: Don’t make your own because you think it’d be cool. Unless there’s a fundamental reason not to, reuse. If it’s open source and there’s a change you’d like, make the change. Don’t rewrite it all.
  • Let people know what you’re doing: Explain to people what you’re trying to do and the problem you’re trying to solve. You’ll immediately gain insight into requirements, features, etc. They’ll probably think it’s a horrible idea, but find out why. If you can rectify this issue to yourself, then move forward. If they aren’t interested, you have a user base, and an end goal to keep you motivated.

Programming Languages + Boats

While the intention of this blog was never to link to random programming related pages, that’s what I’m doing for now. The combination of life and my day job are keeping me busier than ever, so I’m holding off assumptions on when things will get done.

In the mean time, enjoy yourself here.

Programming Languages To Die For

While I generally like to think of programming languages as representative of the same processes that have evolved human speech, it is interesting to take it one step further. Undoubtedly, and unfortunately, there are many who grow so accustomed to one particular programming language that they abide by its paradigm and hold it above all others.

So what if programming languages were religions?

The Semiconductor Industry

Although I’m long removed from the world of microprocessors, there are still some fond memories. Many of them come at the tail end of the industry’s story

jQuery: Extending bind() to define context of execution (scope)

One of the main advantages of jQuery is that it does a lot of thinking for you, especially with more complex things like event handling. Unfortunately, as you move into more advanced application building, the jQuery developer is left without a standard method of applying context to an event.

Although creating a generic bind function to use the Function object’s call or apply methods is always an option, it suffers from two problems:

  • Not integrated with the library, which can cause developer confusion and creates hard to read code
  • Unbinding that handler becomes problematic without additional bookkeeping

While many have called for scope of execution to be added to bind, you can simply extend the functionality yourself with the following:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
function() {
    jQuery.extend(jQuery.event, {
        add: function(elem, types, handler, data, scope) {
            if ( elem.nodeType == 3 || elem.nodeType == 8 )
                return;
 
            // For whatever reason, IE has trouble passing the window object
            // around, causing it to be cloned in the process
            if ( elem.setInterval && elem != window )
                elem = window;
 
            // Make sure that the function being executed has a unique ID
            if ( !handler.guid )
                handler.guid = this.guid++;
 
            // if data or scope is defined, use a proxy function
            if( data !== undefined || scope !== undefined) {
                // Create temporary function pointer to original handler
                var fn = handler;
 
                // Create unique handler function, wrapped around original handler
                if ( scope !== undefined) {
                    // Create proxy function to apply correct context determined by scope
                    var proxyFn = function(){ return fn.apply(scope, arguments); };
                    handler = this.proxy( fn, proxyFn );
                } else {
                    handler = this.proxy( fn );
                }
            }
 
            // if data is passed, bind to handler
            if ( data !== undefined ) {
                // Store data in unique handler
                handler.data = data;
            }
 
            // Init the element's event structure
            var events = jQuery.data(elem, "events") || jQuery.data(elem, "events", {}),
                handle = jQuery.data(elem, "handle") || jQuery.data(elem, "handle", function(){
                    // Handle the second event of a trigger and when
                    // an event is called after a page has unloaded
                    return typeof jQuery !== "undefined" && !jQuery.event.triggered ?
                        jQuery.event.handle.apply(arguments.callee.elem, arguments) :
                        undefined;
                });
            // Add elem as a property of the handle function
            // This is to prevent a memory leak with non-native
            // event in IE.
            handle.elem = elem;
 
            // Handle multiple events separated by a space
            // jQuery(...).bind("mouseover mouseout", fn);
            jQuery.each(types.split(/\s+/), function(index, type) {
                // Namespaced event handlers
                var namespaces = type.split(".");
                type = namespaces.shift();
                handler.type = namespaces.slice().sort().join(".");
 
                // Get the current list of functions bound to this event
                var handlers = events[type];
 
                if ( jQuery.event.specialAll[type] )
                    jQuery.event.specialAll[type].setup.call(elem, data, namespaces);
 
                // Init the event handler queue
                if (!handlers) {
                    handlers = events[type] = {};
 
                    // Check for a special event handler
                    // Only use addEventListener/attachEvent if the special
                    // events handler returns false
                    if ( !jQuery.event.special[type] || jQuery.event.special[type].setup.call(elem, data, namespaces) === false ) {
                        // Bind the global event handler to the element
                        if (elem.addEventListener)
                            elem.addEventListener(type, handle, false);
                        else if (elem.attachEvent)
                            elem.attachEvent("on" + type, handle);
                    }
                }
 
                // Add the function to the element's handler list
                handlers[handler.guid] = handler;
 
                // Keep track of which events have been used, for global triggering
                jQuery.event.global[type] = true;
            });
 
            // Nullify elem to prevent memory leaks in IE
            elem = null;
        }
    });
 
    jQuery.fn.extend({
        bind: function( type, data, fn, scope ) {
            return type == "unload" ? this.one(type, data, fn, fn && scope) : this.each(function(){
                jQuery.event.add( this, type, fn || data, fn && data, (fn && data) && scope );
            });
        }
    });
}();

As you can see, you simply use bind as you always have, but, if you wish to define scope, pass the context in as the last parameter. You ARE required to pass something for data with this method. If you have nothing to pass, simply send an empty object: {}. The bookkeeping is done by jQuery, and you should be able to unbind without any headaches.

Please note: This isn’t fully tested, but it’s based off changes I made elsewhere. I will update this later if I find issues with it.

Much needed updates

It’s been too long.

The plan:

  1. Update the theme of this blog
  2. Customize that theme to my liking (this shouldn’t be important, but it is to me)
  3. Post some unfinished library code that has been over-promised and under-delivered.
  4. Continuing to write posts I’ve stored up

Why you shouldn’t use ExtJS

A few months ago I began to resurrect my web development projects, and came across a use case for a highly involved web UI, and thought it simplest, and best, to just write it most in JavaScript. I began using ExtJS early in 2008 and quickly fell in love.

Why? A terrific project that made the best of OO features in JavaScript, and allowed you to develop a functional and pretty application (stress intended) within hours.

So, when presented with the task of writing another application in JavaScript, I immediately went over to ExtJS to download the source and hack away. Unfortunately, I happened to notice the license update. While I remembered the library being free for noncomerical use, I wasn’t expecting what I received.

GPL? GPL!!?!!?

I won’t go into details, as my frustration is most exemplified here.

All I have to say is: way to kill a tremendous project. The people make the product, and I’m afraid ExtJS will lose too many good people.

Unfortunately, back to basics with YUI.