define(['app-components','app-content'],function(){

/** spacer
 * @alias widget.spacer
 */
Ext.define('app.classes.spacer',{
  extend:'app.classes.component',
  config:{
    height:8
  },
  renderThis:function(){
    this._css('height');
  }
});

/** horzspacer
 * @alias widget.horzspacer
 */
Ext.define('app.classes.horzspacer',{
  extend:'app.classes.component',
  config:{
    width:8
  },
  renderThis:function(){
    this._css('width');
    this.$el.css('display','inline-block');
  }
});

/** splitter
 * @alias widget.splitter
 */
Ext.define('app.classes.splitter',{
  extend:'app.classes.component',
  config:{
    orientation:'horz'
  },
  events:{
    'mousedown':'_dragstart'
  },
  renderThis:function(){
    var o=this.options;
    this._props=[['top','height','pageY'],
                 ['left','width','pageX']][o.orientation=='horz' ? 0 :1];
    this.$el.addClass('unity-splitter unity-splitter-'+o.orientation);
  },
  _dragstart:function(e){
    $('body').on('mouseup.splitter',_.bind(this._dragend,this))
             .on('mousemove.splitter',_.bind(this._dragmove,this));
    this._loc=this.$el.offset();
    this._mouseLoc=e[this._props[2]];
    this.$bar=this.$el.clone().addClass('active').css({
      width:this.$el.width(),
      height:this.$el.height()
    }).appendTo('body').offset(this._loc);
    return false;
  },
  _dragmove:function(e){
    this._loc[this._props[0]]=e[this._props[2]];
    this.$bar.offset(this._loc);
  },
  _dragend:function(e){
    this.$bar.remove();
    $('body').off('.splitter');
    var d=e[this._props[2]]-this._mouseLoc;
    if (d) this.$el.trigger('mk_splitter',[this._props[1],d]);
  }
});

/**
 * ctxmenu
 * @alias widget.ctxmenu
 * */
Ext.define('app.classes.ctxmenu',{
  extend:'app.classes.component',
  config:{
    text:null,
    icon:null,
    title:null,
    hideText:null,
    type:'action'
  },
  statics:{
    defaultType:'ctxmenu'
  },
  constructor:function(cfg){
    this.cmds={
      action:[],
      filter:[],
      view:[],
      bottom:[]
    };
    app.classes.ctxmenu.__super__.constructor.apply(this,arguments);
  },
  destructor: function(){
    delete this.cmds;
    app.classes.ctxmenu.__super__.destructor.apply(this,arguments);
  },
  addChild:function(c){
    this.cmds[c.options.type].push(c);
  },
  detach:function(){
    _.each(this.cmds,function(arr){
      _.each(arr,function(item){
        item.$el.detach();
      });
    });
  }
});



});