/*  ==============================================================
    Menu class
    ============================================================== */

function Menu(contentPane) {
  this.items = new Array();
  this.contentPane = contentPane;
  contentPane.menu = this;
}

Menu.prototype.newItem = function(o) {
  var item = new MenuItem();
  if (o) {
    (o.title==null) ? item.title='No title' : item.title=o.title;
    (o.content==null) ? item.content=null : item.content=o.content;
    (o.contentUrl==null) ? item.contentUrl='' : item.contentUrl=o.contentUrl;
    if (o.parentElement) {item.parentElement=o.parentElement;};
    if (o.rBoxType) {item.rBoxType=o.rBoxType;};
  } else {
    item.title='No title';
    item.content='No content';
  }
  item.menu = this;
  item.init();
  this.items.push(item);
  item.itemNo = this.items.length-1;
};

Menu.prototype.setActiveItem = function(menuItem) {
  for (var i=0; i<this.items.length; i++) {
    this.items[i].active=false;
  }
  $('.menuItemActive').removeClass('menuItemActive');
  $(menuItem.rBox.wrapperElement).addClass('menuItemActive');
  menuItem.active=true;
};

Menu.prototype.highlightActiveItem = function() {
  for (var i=0; i<this.items.length; i++) {
    if (this.items[i].active==true) {
      $(this.items[i].rBox.wrapperElement).addClass('menuItemActive');
    }
  }  
};


/*  ==============================================================
    MENU ITEM CLASS
    ============================================================== */

function MenuItem() {
  this.menu = null;
  this.title = '';
  this.content = null;
  this.rBox = null;
  this.rBoxType = 'white40';
  this.parentElement = $('body')[0];
  this.detachedContent = null;
  this.contentUrl = '';
  this.active = false;
  this.itemNo = null;
  this.speed = 500;
  //this.clickHandler = function(){};
}

MenuItem.prototype.init = function() {
  var _this = this;
  $(document).ready(function(){
    _this.rBox = new RoundedBox({parentElement:_this.parentElement, type:_this.rBoxType});
    _this.rBox.setContent(_this.title);
    $(_this.rBox.wrapperElement).addClass('menuItem');
    _this.rBox.show();
    $(_this.rBox.wrapperElement).click(function(){
      if(_this.active==false) {
        var id=$(contentPane.contentElement).attr('id');
        _this.menu.contentPane.activeMenuItem.detachedContent=$('#'+id+' #content').detach();
        _this.toggleContentPane();
        _this.menu.setActiveItem(_this);
        //_this.clickHandler();
      }
    });
 });
};

MenuItem.prototype.toggleContentPane = function() {
  var _this = this;
  //this.menu.contentPane.stopAnimation();
  this.animateOut(function(){ _this.getContent(); });
};

MenuItem.prototype.loadContent = function() {
  var _this = this;
  $(this.menu.contentPane.contentElement).load(_this.contentUrl+'#content',
      function() { 
        _this.content=$(_this.menu.contentPane.contentElement).html();
        _this.animateIn();
        Utils.extLinks();
      }
  );  
};

MenuItem.prototype.getContent = function() {
  var _this = this;
  if (_this.detachedContent!=null) 
  {
    _this.detachedContent.appendTo(this.menu.contentPane.contentElement);
    this.animateIn();
  } else if(_this.content!=null) 
  {
    $(this.menu.contentPane.contentElement).html(_this.content);
    this.animateIn();
  } else 
  {
    this.loadContent();
  }
};

MenuItem.prototype.animateIn = function() {
  var _this = this;
  $(this.menu.contentPane.roundedBox.wrapperElement).fadeIn(_this.speed, function(){
    $(_this.menu.contentPane.contentElement).trigger('newContent');
  });
  document.title=this.title;
  this.menu.contentPane.activeMenuItem = this;
};

MenuItem.prototype.animateOut = function(fn) {
  var _this = this;
  $(this.menu.contentPane.roundedBox.wrapperElement).fadeOut(_this.speed, fn );
};
