Loading a stylesheet

The next step is to load the stylesheet. Presumably, the user has passed the name of a stylesheet as a parameter to the constructor. For example, the user might construct the class with 'myStyles.css' as a parameter:

var myStylesheet = new Stylesheet ("myStyles.css");

Our constructor receives this value as the stylesheet variable, and it passes that variable onto the init () method. So within our init () method, we can use the stylesheet variable to access the name of the stylesheet passed to the constructor by the user.

Since we might use this variable later on in the class, it's a good idea to store it as a class variable. Thus, the next step in our init () method is to store the value of stylesheet as this.stylesheet so that other methods can access the value of this.stylesheet later on:

Stylesheet.prototype.init = function (stylesheet) {
        // create an object to hold all the styles
        this.stylesDictionary = new Object ();
        // save 'stylesheet' as 'this.stylesheet'
        this.stylesheet = stylesheet;
} // end init () method

At this point the class is initialized as much as we need for now, so
we are ready to load the stylesheet. Since our Stylesheet class
inherits from the LoadVars object, we don't need to define a load ()
method. The LoadVars load () method is already available. This is
convenient because we don't need to write the load () method ourself.
It is already done for us. Thus, we simply need to call this.load
(this.stylesheet) in our init () method, and our class will load the
specified stylesheet:
Stylesheet.prototype.init = function (stylesheet) {
        // create an object to hold all the styles
        this.stylesDictionary = new Object ();
        // save 'stylesheet' as 'this.stylesheet'
        this.stylesheet = stylesheet;
        // load the stylesheet
        this.load (this.stylesheet);
} // end init () method

Before moving on, we should do one more thing to our init () method. As
it stands, the user has to provide the name of a stylesheet to the
constructor when they instantiate the class. There may be situations
when this is not very desirable. Thus, we should make it optional. To
do that, we simply need to check whether stylesheet is defined. If it
is defined, then we can store stylesheet and this.stylesheet and load
the stylesheet. If it is not defined, we should make our class do
nothing. If the user does not provide the name of a stylesheet to the
constructor, then they will have to invoke the load () method
themselves. We can modify our init () method to look like this:
Stylesheet.prototype.init = function (stylesheet) {
        // create an object to hold all the styles
        this.stylesDictionary = new Object ();
        // if 'stylesheet' has been defined,
        // then save it as 'this.stylesheet'
        // and then load it. If it hasn't been
        // defined, do nothing and the user can
        // invoke the load (stylesheet) method themselves.
        if (stylesheet != undefined) {
                this.stylesheet = stylesheet;
                this.load (stylesheet);
        } // end if (stylesheet != undefined)
} // end init () method