Commit | Line | Data |
---|---|---|
50ac472f D |
1 | _kiwi.view.MenuBox = Backbone.View.extend({ |
2 | events: { | |
3 | 'click .ui_menu_foot .close': '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; | |
50ac472f D |
15 | }, |
16 | ||
17 | ||
18 | render: function() { | |
19 | var that = this; | |
20 | ||
21 | this.$el.find('*').remove(); | |
22 | ||
23 | if (this._title) { | |
24 | $('<div class="ui_menu_title"></div>') | |
25 | .text(this._title) | |
26 | .appendTo(this.$el); | |
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 | onDocumentClick: function(event) { | |
43 | var $target = $(event.target); | |
44 | ||
45 | if (!this._close_on_blur) | |
46 | return; | |
47 | ||
48 | // If this is not itself AND we don't contain this element, dispose $el | |
49 | if ($target[0] != this.$el[0] && this.$el.has($target).length === 0) | |
50 | this.dispose(); | |
51 | }, | |
52 | ||
53 | ||
54 | dispose: function() { | |
55 | _.each(this._items, function(item) { | |
56 | item.dispose && item.dispose(); | |
57 | item.remove && item.remove(); | |
58 | }); | |
59 | ||
60 | this._items = null; | |
61 | this.remove(); | |
62 | ||
c3c793e0 D |
63 | if (this._close_proxy) |
64 | $(document).off('click', this._close_proxy); | |
50ac472f D |
65 | }, |
66 | ||
67 | ||
68 | addItem: function(item_name, $item) { | |
69 | $item = $($item); | |
70 | if ($item.is('a')) $item.addClass('icon-chevron-right'); | |
71 | this._items[item_name] = $item; | |
72 | }, | |
73 | ||
74 | ||
75 | removeItem: function(item_name) { | |
76 | delete this._items[item_name]; | |
77 | }, | |
78 | ||
79 | ||
80 | showFooter: function(show) { | |
81 | this._display_footer = show; | |
82 | }, | |
83 | ||
84 | ||
85 | closeOnBlur: function(close_it) { | |
86 | this._close_on_blur = close_it; | |
87 | }, | |
88 | ||
89 | ||
90 | show: function() { | |
c3c793e0 D |
91 | var that = this; |
92 | ||
50ac472f D |
93 | this.render(); |
94 | this.$el.appendTo(_kiwi.app.view.$el); | |
c3c793e0 D |
95 | |
96 | // We add this document click listener on the next javascript tick. | |
97 | // If the current tick is handling an existing click event (such as the nicklist click handler), | |
98 | // the click event bubbles up and hits the document therefore calling this callback to | |
99 | // remove this menubox before it's even shown. | |
100 | setTimeout(function() { | |
101 | that._close_proxy = function(event) { | |
102 | that.onDocumentClick(event); | |
103 | }; | |
104 | $(document).on('click', that._close_proxy); | |
105 | }, 0); | |
50ac472f D |
106 | } |
107 | }); |