Foundation.js JavaScript Framework

Foundation.Resourceful

Foundation.Resourceful is a collection of methods to manage constants (strings, numbers, titles, HTML, URLS, etc.) for classes. It makes customizing appearences, localization, and multi-lingual support a breeze.

For example, take the following simple class:

var MyClass=Foundation.createClass(
   null, //Extends nothing.
   Foundation.Resourceful, //Inherits Foundation.Resourceful.
   function()  // Empty constructor.
   {
   },
   {
      getHtml:function()
      {
         return this.resource("homeUrl").htmlEncode();
      }
   },
   {
      resourcePack:{
         homeUrl:"http://FoundationDotJS.org"
      }
   });

var mc=new MyClass();
document.write(mc.getHtml());

An empty class is defined, with a method that retrieves a resource from the resourcePack:

Granted, that example is not all that complicated. But what makes the method handy is how it resolves the location of the resource:
First, it looks for the entry in a property called resourcePack in the object itsself.
Second, it looks for the entry in resourcePack of the object's class (like the example above).
Third, if this class was extended from another class, it looks for the entry in resourcePack of the object's parent class (and up and up until found).

This makes it easy to override some or all the resources for localization. For example, the home url for that one instance can be easily changed without modifying every other instance, like so:

mc.resourcePack={homeUrl:"http://FoundationDotJS.co.uk"};
document.write(mc.getHtml());

Now this one instance will display a different URL:

Even more handy is the substitution the method can perform on string resources. For example:

var Person=Foundation.createClass(
   null,Foundation.Resourceful, ////Extends nothing, inherits Foundation.Resourceful.
   function(firstName,lastName)
   {
      this.firstName=firstName;
      this.lastName=lastName;
   },
   {
      getHtml:function()
      {
         return this.resource("html",
                              'f',this.firstName,
                              'l',this.lastName);
      }
   },
   {
      resourcePack:{
         html:"Hello, my name is %f %l."
      }
   });

var p=new Person("John","Doe");
document.write(p.getHtml());

Which yields:

Note that the extra parameters to the resouce method call were character-value pairs, and that the %f and %l in the string resource were replaced with corresponding values. This makes it easy to format strings and customize them. For example, if your class is being used on a spanish site that wants the HTML displayed Last Name, First Name with a green background, you can simply add a second script file to the page that redefines the resource pack entry like so:

Person.resourcePack.html="<span style=\"background-color:lime\">Hola, mi nombre es %l, %f.</span>";

Then, when you use your class, you will see the following:

The substituting, along with the object->class->parent class resolution, makes creating easily customizable and multi-lingual objects a breeze.