(function(){
  var Basic;
  Basic = this.Basic = {};
  Basic.VERSION = '0.1.0';
  Basic.AUTHOR = 'mrchess';
  var $ = this.jQuery;

  //helpers
  var h = {}

  h.format = function() {
    for(var i=1;i<arguments.length;i++) {
        var exp = new RegExp('\\{' + (i-1) + '\\}','gm');
        arguments[0] = arguments[0].replace(exp,arguments[i]);
    }
    return arguments[0];
  }
  //Watcher for menu removal, not sure where to put this
  $(document).click(function() {
    Basic.clearMenus();
  });

  // begin Basic componentry

  /**
    Basic constructor
    returns a Basic button element
  * properties:
    cls - custom css class
    iconCls - icon class
    text - also accepts html
    click - the click action
    primary - bolds button
    pointer - shows pointer or not on hover
  */
  Basic._renderButton = function(config) {
    var el = $('<div>');
    // apply defaults
    el.addClass('basic-btn');
    if(config.pointer) {
        el.addClass('basic-btn-pointer');
    }
    // add hover
    el.hover(function() {
        $(this).addClass('basic-btn-hover');
    }, function() {
        $(this).removeClass('basic-btn-hover');
    });
    // add mousedown
    el.mousedown(function() {
        $(this).addClass('basic-btn-down');
    });
    el.mouseup(function() {
        $(this).removeClass('basic-btn-down');
    });
    el.mouseout(function() {
        $(this).removeClass('basic-btn-down');
    });
    // apply config
    el.addClass(config.cls);
    el.addClass(config.iconCls);

    if(config.id) {
        el.attr('id',config.id);
    }
    if(config.title) {
        el.attr('title',config.title);
    }
    if(config.click) {
        el.click(config.click);
    }
    if(config.primary) {
        el.html('<b>'+config.text+'</b>');
    } else {
        el.html(config.text);
    }
    return el;
  }


  Basic.Button = function(config) {
    config = config || {};
    var el = new Basic._renderButton(config);

    // attach custom click action
    return el;
  };

  Basic._doButtonMenuLayout = function(menu, config) {
      menu.hide();
      Basic.clearMenus();
      $(this).addClass('basic-btn-menu-down');
      //adjust pointer configure. remove it fromt he button class and recursilvy apply to all items
      if(config.pointer) {
          menu.find('.basic-btn-menu-item').addClass('basic-btn-pointer');
      }

      // hide menu before display so I can adjust position

      $(this).append(menu);

      // calculate position
      var css = {};
      var position = config.position || 'bl';
      if(position.indexOf('t') >= 0) {
          css['top'] = (menu.height() * -1) - 11;
      }
      if(position.indexOf('b') >= 0) {
          css['bottom'] = (menu.height() * -1) - 11;
      }
      if(position.indexOf('l') >= 0) {
          css['left'] = -1;
      }
      if(position.indexOf('r') >= 0) {
          css['right'] = -1;
      }
      if(position.indexOf('m') >= 0) {
          css['top'] = -2;
          if(position.indexOf('l') >= 0) {
            css['left'] = menu.width() * -1 - 10;
          }
          if(position.indexOf('r') >= 0) {
            css['right'] = menu.width() * -1 - 10;
          }
      }
      menu.css(css);
      menu.show();
  }
  Basic._renderButtonMenuItems = function(store) {
      // build menu
      var menu = $('<div>').addClass('basic-btn-menu');

      // make from menu items
      var items = store;
      for(var i in items) {
          //check for splitter
          if(items[i] == "|") {
              var item = $('<div>').addClass('basic-btn-menu-split');
          } else if(items[i].text == '|') {
              var item = $('<div>').addClass('basic-btn-menu-split');
          } else {
              var item = $('<div>').addClass('basic-btn-menu-item');
              item.html(items[i].text);
              item.hover(function() {
                  $(this).addClass('basic-btn-menu-item-hover');
              }, function() {
                  $(this).removeClass('basic-btn-menu-item-hover');
              });
              item.click(Basic.clearMenus);
              item.click(items[i].click);
          }

          if(!items[i].skip) {
              if(items[i].cls) {
                  item.addClass(items[i].cls);
              }
              if(items[i].pointer) {
                  item.addClass('basic-btn-pointer');
              }
              if(items[i].id) {
                  item.attr('id',items[i].id);
              }
              menu.append(item);
          }
      }
      return menu;
  }
  Basic.ButtonMenu = function(config) {
    config = config || {};

    var el = new Basic._renderButton(config);
    var arrowTpl = '<div class="basic-btn-menu-arrow"></div>';
    el.append(arrowTpl);

    // clear stuff from constructor
    if(config.pointer) {
        el.removeClass('basic-btn-pointer');
    }

    // if no custom click handler load default store
    if(!config.click) {
        el.click(function(e) {
            var menu = Basic._renderButtonMenuItems(config.store);
            Basic._doButtonMenuLayout.call(this,menu,config);
            e.stopPropagation(); // prevent the document watcher from destroying the menu
            return false;
        });
    } else {
        el.unbind('click');
        el.click(function(e) {
            config.click.call(this, e, config);
        });
    }
    return el;
  };

  // Takes a group of Basic buttons and makes a controlbar
  Basic.ButtonBar = function(buttons) {
    var el = $('<div>').addClass('basic-btn-btnbar');
    for(i in buttons) {
        // add bar round corner edge
        if(i == 0) {
            buttons[i].addClass('basic-btn-btnbar-left');
        }
        if(i == buttons.length-1) {
            buttons[i].addClass('basic-btn-btnbar-right');
        }

        el.append(buttons[i]);
    }
    return el;
  };

  Basic.Box = function(config) {
    config = config || {};

    var node = $('<div>');
    node.addClass(config.cls);
    node.html(config.html);
    return node;
  };

  // basic widget with view/edit modes
  Basic.Widget = function(config) {};

  // ui functions
  // destroys any existing menu stuff
  Basic.clearMenus = function() {
    $('.basic-btn-hover').removeClass('basic-btn-hover');
    if($('.basic-btn-menu').length > 0) {
        $('.basic-btn-menu').remove();
        $('.basic-btn-menu-down').removeClass('basic-btn-menu-down');
    }
  }
  Basic.destroy = function(el) {
    el.remove();
  };
})();




_____            _____                   _____
         /\    \          |\    \                 /\    \
        /::\    \         |:\____\               /::\____\
       /::::\    \        |::|   |              /::::|   |
      /::::::\    \       |::|   |             /:::::|   |
     /:::/\:::\    \      |::|   |            /::::::|   |
    /:::/__\:::\    \     |::|   |           /:::/|::|   |
    \:::\   \:::\    \    |::|   |          /:::/ |::|   |
  ___\:::\   \:::\    \   |::|___|______   /:::/  |::|   | _____
 /\   \:::\   \:::\    \  /::::::::\    \ /:::/   |::|   |/\    \
/::\   \:::\   \:::\____\/::::::::::\____/:: /    |::|   /::\____\
\:::\   \:::\   \::/    /:::/~~~~/~~     \::/    /|::|  /:::/    /
 \:::\   \:::\   \/____/:::/    /         \/____/ |::| /:::/    /
  \:::\   \:::\    \  /:::/    /                  |::|/:::/    /
   \:::\   \:::\____\/:::/    /                   |::::::/    /
    \:::\  /:::/    /\::/    /                    |:::::/    /
     \:::\/:::/    /  \/____/                     |::::/    /
      \::::::/    /                               /:::/    /
       \::::/    /                               /:::/    /
        \::/    /                                \::/    /
         \/____/                                  \/____/