define([
                                "dojo/_base/declare",
                                "dojo/dom",
                                "dojo/dom-construct",
                                "dojo/dom-style",
                                "dojo/_base/fx",
                                "dojo/fx",
                                "dojo/fx/easing"
                            ],
                            function (
                                declare,
                                dom,
                                domConstruct,
                                domStyle,
                                baseFx,
                                fx,
                                easing) {
                            
                                return declare(null, {
                                    //properties
                                    mapElementId: null,
                            
                                    /**
                                   * Constructs a new ViewportController class.
                                   * A user interface control that displays an Viewports.
                                   *
                                   * @class Common.Viewport.ViewportController
                                   * @constructor
                                   */
                                    constructor: function (options) {
                                        this.mapElementId = options.mapElementId;
                                        this.map = options.map;
                                    },
                                    
                                    /**
                                    * Toggles the footer on and off.
                                    * @method toggleFooter
                                    * @param {Boolean} doAnimate  
                                    * @param {Function} callback  
                                    */
                                    toggleFooter: function (doAnimate, callback) {
                                        var footer = dom.byId("footer");
                                        if (footer) {
                                            var state = domStyle.get(footer, "display");
                                            if (state == "none") {
                                                this.showFooter(doAnimate, callback);
                                            }
                                            else {
                                                this.hideFooter(doAnimate);
                                            }
                                        }
                                    },
                                    /**
                                    * Shows the footer.
                                    * @method showFooter
                                    * @param {Boolean} doAnimate  
                                    * @param {Function} callback  
                                    */
                                    showFooter: function (doAnimate, callback) {
                                        var _self = this;
                                        var footer = dom.byId("footer");
                                        if (footer) {
                                            var state = domStyle.get(footer, "display");
                                            if (state == "none") {
                                                if (dom.byId("main-container")) {
                                                    domStyle.set("main-container", "float", "left");
                                                }
                                                var footerHeight = domStyle.get(footer, "height");
                                                var mapHeight = domStyle.get(this.mapElementId, "height");
                                                var h = mapHeight - footerHeight;
                            
                                                domStyle.set(footer, "display", "block");
                            
                                                if (doAnimate === true) {
                                                    baseFx.animateProperty({
                                                        node: dom.byId(this.mapElementId),
                                                        properties: {
                                                            height: h
                                                        },
                                                        easing: easing.linear,
                                                        onEnd: function () {
                                                            _self.map.resize();
                                                            if (callback) callback();
                                                        }
                                                    }).play();
                                                }
                                                else {
                                                    domStyle.set(this.mapElementId, "height", h + "px");
                                                    _self.map.resize();
                                                    if (callback) callback();
                                                }
                                            }
                                        }
                                    },
                                    /**
                                    * Hides the footer.
                                    * @method hideFooter
                                    * @param {Boolean} doAnimate  
                                    */
                                    hideFooter: function (doAnimate) {
                                        var _self = this;
                                        var footer = dom.byId("footer");
                                        if (footer) {
                                            var state = domStyle.get(footer, "display");
                                            if (state != "none") {
                                                var footerHeight = domStyle.get(footer, "height");
                                                var mapHeight = domStyle.get(this.mapElementId, "height");
                                                var h = mapHeight + footerHeight;
                            
                                                if (doAnimate === true) {
                                                    baseFx.animateProperty({
                                                        node: dom.byId(this.mapElementId),
                                                        properties: {
                                                            height: h
                                                        },
                                                        duration: 200,
                                                        onEnd: function () {
                                                            _self.map.resize();
                                                            domStyle.set(footer, "display", "none");
                                                        },
                                                        easing: easing.linear
                                                    }).play();
                                                }
                                                else {
                                                    domStyle.set(this.mapElementId, "height", h + "px");
                                                    _self.map.resize();
                                                    domStyle.set(footer, "display", "none");
                                                }
                                            }
                                        }
                                    }
                                });
                            
                            });