client/src/views/menubox.js

   1 _kiwi.view.MenuBox = Backbone.View.extend({
   2     events: {
   3         'click .ui_menu_foot .close, a.close_menu': 'dispose'
   4     },
   5
   6     initialize: function(title) {
   7         var that = this;
   8
   9         this.$el = $('<div class="ui_menu"></div>');
  10
  11         this._title = title || '';
  12         this._items = {};
  13         this._display_footer = true;
  14         this._close_on_blur = true;
  15     },
  16
  17
  18     render: function() {
  19         var that = this;
  20
  21         this.$el.find('*').remove();
  22
  23         $('<div class="ui_menu_title"></div>').appendTo(this.$el);
  24         if (this._title) {
  25             this.$el.find('.ui_menu_title')
  26                 .text(this._title);
  27         }
  28
  29
  30         _.each(this._items, function(item) {
  31             var $item = $('<div class="ui_menu_content hover"></div>')
  32                 .append(item);
  33
  34             that.$el.append($item);
  35         });
  36
  37         if (this._display_footer)
  38             this.$el.append('<div class="ui_menu_foot"><a class="close" onclick="">Close <i class="icon-remove"></i></a></div>');
  39     },
  40
  41
  42     setTitle: function(new_title) {
  43         this._title = new_title;
  44
  45         if (!this._title)
  46             return;
  47
  48         this.$el.find('.ui_menu_title').text(this._title);
  49     },
  50
  51
  52     onDocumentClick: function(event) {
  53         var $target = $(event.target);
  54
  55         if (!this._close_on_blur)
  56             return;
  57
  58         // If this is not itself AND we don't contain this element, dispose $el
  59         if ($target[0] != this.$el[0] && this.$el.has($target).length === 0)
  60             this.dispose();
  61     },
  62
  63
  64     dispose: function() {
  65         _.each(this._items, function(item) {
  66             item.dispose && item.dispose();
  67             item.remove && item.remove();
  68         });
  69
  70         this._items = null;
  71         this.remove();
  72
  73         if (this._close_proxy)
  74             $(document).off('click', this._close_proxy);
  75     },
  76
  77
  78     addItem: function(item_name, $item) {
  79         if ($item.is('a')) $item.addClass('icon-chevron-right');
  80         this._items[item_name] = $item;
  81     },
  82
  83
  84     removeItem: function(item_name) {
  85         delete this._items[item_name];
  86     },
  87
  88
  89     showFooter: function(show) {
  90         this._display_footer = show;
  91     },
  92
  93
  94     closeOnBlur: function(close_it) {
  95         this._close_on_blur = close_it;
  96     },
  97
  98
  99     show: function() {
 100         var that = this;
 101
 102         this.render();
 103         this.$el.appendTo(_kiwi.app.view.$el);
 104
 105         // We add this document click listener on the next javascript tick.
 106         // If the current tick is handling an existing click event (such as the nicklist click handler),
 107         // the click event bubbles up and hits the document therefore calling this callback to
 108         // remove this menubox before it's even shown.
 109         setTimeout(function() {
 110             that._close_proxy = function(event) {
 111                 that.onDocumentClick(event);
 112             };
 113             $(document).on('click', that._close_proxy);
 114         }, 0);
 115     }
 116 });