/** @fileoverview Markup Factory Client library
 *   Provides classes and methods for browser scripting of Markup Factory
 *   components.
 */

/**
 * @namespace Placeholder for the server side MF library.
 */
var MF = {

};

/**
 * @namespace Client Library for Markup Factory
 */
MF.Client = {
    /**
     * Check if the Prototype.js library is loaded.
     * @return Boolean
     */
    isPrototypeLoaded : typeof Prototype === "object",

    /**
     * Set any links in unordered list items of the element whith the 
     * specified (or default) ID to the active class name.
     */
    activateMenu : function (options) {
        options = options || {};

        var defaultOptions = {
            selector : "ul#mainMenu li a",
            activeClassName : "active"
        }

        var selector = options.selector || defaultOptions.selector;

        var activeClassName = options.activeClassName || 
            defaultOptions.activeClassName;

        $$(selector).each(function(a) {
            if (document.title.match(a.innerHTML)) {
                a.addClassName(activeClassName);
            }
        });
    },

    /**
     * Sets the target attribute to '_blank' on all links with the 
     * 'rel=external' attribute. This makes them open in a new window
     * while staying standards compliant.
     */
    externalLinks : function () {
      $$('a[rel=external]').each(function(a) { a.target = "_blank"; });
    }
};

/**
 * @class Newsletter acts upon the DOM objects of the code generated by the
 *  GetNewsLetterSignup Function.
 */
MF.Client.Newsletter = Class.create(
/** @scope MF.Client.Newsletter.prototype */
{
    /**
     * Default options
     * @type Object
     */
    defaultOptions : {
        container : "markupfactory-getnewslettersignup",
        input : "markupfactory-getnewslettersignup-email",
        submit : "markupfactory-getnewslettersignup-submit",
        inputText : "email address"
    },

    /**
     * Initialize the object
     */
    initialize : function (options) {
        options = options || {};
        this.container = options.container || this.defaultOptions.container;
        this.input = options.input || this.defaultOptions.input;
        this.submit = options.submit || this.defaultOptions.submit;
        this.inputText = options.inputText || this.defaultOptions.inputText;

        // Check for existence of elements
        if ($(this.container) && $(this.input) && $(this.submit)) { 
            // Set input text
            $(this.input).value = this.inputText;
            // Disable the submit button
            $(this.submit).disabled = true;
            // Observe input field
            $(this.input).observe("keyup", 
                this.validateInput.bindAsEventListener(this));
            $(this.input).observe("click", 
                this.clearInputContents.bindAsEventListener(this));
            $(this.input).observe("blur", 
                this.setInputContents.bindAsEventListener(this));
        }
    },

    /**
     * Keep the submit button disabled unless a valid email address is in the
     * input.
     */
    validateInput : function () {
        var validEmailPattern = 
            /^([a-zA-Z0-9_\.\-])+\@(([a-zA-Z0-9\-])+\.)+([a-zA-Z0-9]{2,4})+$/;
  
        if ($F(this.input).match(validEmailPattern)) {
            $(this.submit).disabled = false;
        } else {
            $(this.submit).disabled = true;
        }
    },

    /** 
     * Clear out the input contents if they match what was there initially.
     */
    clearInputContents : function () {
        if ($F(this.input) === this.inputText) {
            $(this.input).value = "";
        }
    },

    /** 
     * Reset the input contents if empty
     */
    setInputContents : function () {
        if ($F(this.input).empty()) { 
            $(this.input).value = this.inputText; 
        }
    },
});

var Gottung = Class.create(MF.Client, 
/** @scope Gottung.prototype */
{
    defaultOptions : {
        container : "container",
        mainMenu : "div#menu div ul li a",
        gallery : "gallery"
    },
    
    initialize : function (options) {
        options = options || {};
        this.container = options.conainer || this.defaultOptions.container;
        this.mainMenu = options.mainMenu || this.defaultOptions.mainMenu;
        this.gallery = options.gallery || this.defaultOptions.gallery;

        // Execute functions inherited from MF.Client 
        this.activateMenu({ selector : this.mainMenu });
        this.externalLinks();
        
        // Create Newsletter object
        this.Newsletter = new MF.Client.Newsletter({
            inputText : "Enter your email address" });

        // Execute function specfic to this class
        this.resizeToScreenHeight(this.container);
        this.resizeGallery(this.gallery);
    },

    /**
     * Resize the element to the height of the window.
     * @param el The element to be resized
     */
    resizeToScreenHeight : function (el) {
        el = el || this.defaultOptions.container;
        if ($(el)) {
            var windowHeight = document.documentElement.clientHeight;
            if ($(el).getHeight() < windowHeight) {
                $(el).setStyle({ height : windowHeight + 'px' });
            } 
        }
    },

    resizeGallery : function (el) {
        el = el || this.defaultOptions.gallery;
        var offset = 275; // Height of the window that won't be filled
        var newHeight = document.documentElement.clientHeight - offset;
        if ($(el)) {
            if ($(el).height < newHeight) {
                $(el).setStyle({ height : newHeight + 'px' });
            }
        }
    }
});

if (MF.Client.isPrototypeLoaded) {
    document.observe('dom:loaded', function () { new Gottung() });
}