// © 2007-2008, Applied Geographics, Inc.  All rights reserved.

/// <reference name="AppGeo.Web.Extensions.js" assembly="AppGeo.Web" />

// Ag.UI.MultiView (component)

// Define our namespaces
Type.registerNamespace("Ag");
Type.registerNamespace("Ag.UI");

Ag.UI.MultiView = function() {
  /// <summary>A MultiView implementation</summary>
  /// <remarks>
  /// This is just a component, no UI element.
  /// </remarks>
  Ag.UI.MultiView.initializeBase(this);

  this._viewIds = [];
  this._selectedIndex = -1;
}

Ag.UI.MultiView.prototype = {

  // Public Methods

  addView: function(viewId) {
    /// <summary>Adds the div to the MultiView</summary>
    /// <param name="viewId" type="String">The div to add to the MultiView</param>
    var newView = $get(viewId);

    if (newView != null) {
      Array.add(this._viewIds, viewId);
      if (this._viewIds.length - 1 == this._selectedIndex)
        $common.setVisible(newView, true);
      else
        $common.setVisible(newView, false);
    }
  },

  addViews: function(viewIds) {
    /// <summary>Add an array of view ids</summary>
    /// <param name="viewIds" type="Array" elementType="String">An array of view div element ids</param>
    for (var i = 0; i < viewIds.length; i++)
      this.addView(viewIds[i]);
  },

  clear: function() {
    /// <summary>Remove all views from the MultiView</summary>
    this._viewIds = [];
    this._selectedIndex = -1;
  },

  indexOf: function(viewId) {
    /// <summary>Get the index of the div</summary>
    /// <param name="viewId" type="String">The div to look up</param>
    /// <returns>The index of the div with the given id or -1 if the item is not found</returns>
    return Array.indexOf(this._viewIds, viewId);
  },

  // Public Properties

  get_selectedId: function() {
    /// <value type="String">Get or set the selected id</value>
    if (this._selectedIndex >= 0 && this._selectedIndex < this._viewIds.length)
      return this._viewIds[this._selectedIndex];
    else
      return "";
  },

  set_selectedId: function(value) {
    var index = this.indexOf(value);
    this.set_selectedIndex(index);
  },

  get_selectedIndex: function() {
    /// <value type="Number">Gets or sets the selected index</value>
    return this._selectedIndex;
  },

  set_selectedIndex: function(index) {
    if (index >= -1 && index < this._viewIds.length) {
      if (this._selectedIndex !== index) {
        if (this._selectedIndex >= 0 && this._selectedIndex < this._viewIds.length)
          $common.setVisible($get(this._viewIds[this._selectedIndex]), false);

        if (index >= 0 && index < this._viewIds.length)
          $common.setVisible($get(this._viewIds[index]), true);

        this._selectedIndex = index;
        this.raisePropertyChanged("selectedIndex");
      }
    }
  },

  get_viewIds: function() {
    /// <value type="Array" elementType="String">Gets or sets the view IDs for this MultiView, setting will clear current view list</value>
    return Array.clone(this._viewIds);
  },

  set_viewIds: function(value) {
    var e = Function._validateParams(arguments, [
      { name: "value", type: Array, elementType: String }
    ]);
    if (e) throw e;

    this.clear();
    for (var i = 0; i < value.length; i++)
      this.addView(value[i]);
  }
}

Ag.UI.MultiView.registerClass("Ag.UI.MultiView", Sys.Component);

if(typeof(Sys)!=='undefined')Sys.Application.notifyScriptLoaded();