|
1 /** |
|
2 * PanelButton.js |
|
3 * |
|
4 * Copyright, Moxiecode Systems AB |
|
5 * Released under LGPL License. |
|
6 * |
|
7 * License: http://www.tinymce.com/license |
|
8 * Contributing: http://www.tinymce.com/contributing |
|
9 */ |
|
10 |
|
11 /** |
|
12 * Creates a new panel button. |
|
13 * |
|
14 * @class tinymce.ui.PanelButton |
|
15 * @extends tinymce.ui.Button |
|
16 */ |
|
17 define("tinymce/ui/PanelButton", [ |
|
18 "tinymce/ui/Button", |
|
19 "tinymce/ui/FloatPanel" |
|
20 ], function(Button, FloatPanel) { |
|
21 "use strict"; |
|
22 |
|
23 return Button.extend({ |
|
24 /** |
|
25 * Shows the panel for the button. |
|
26 * |
|
27 * @method showPanel |
|
28 */ |
|
29 showPanel: function() { |
|
30 var self = this, settings = self.settings; |
|
31 |
|
32 self.active(true); |
|
33 |
|
34 if (!self.panel) { |
|
35 var panelSettings = settings.panel; |
|
36 |
|
37 // Wrap panel in grid layout if type if specified |
|
38 // This makes it possible to add forms or other containers directly in the panel option |
|
39 if (panelSettings.type) { |
|
40 panelSettings = { |
|
41 layout: 'grid', |
|
42 items: panelSettings |
|
43 }; |
|
44 } |
|
45 |
|
46 panelSettings.role = panelSettings.role || 'dialog'; |
|
47 panelSettings.popover = true; |
|
48 panelSettings.autohide = true; |
|
49 panelSettings.ariaRoot = true; |
|
50 |
|
51 self.panel = new FloatPanel(panelSettings).on('hide', function() { |
|
52 self.active(false); |
|
53 }).on('cancel', function(e) { |
|
54 e.stopPropagation(); |
|
55 self.focus(); |
|
56 self.hidePanel(); |
|
57 }).parent(self).renderTo(self.getContainerElm()); |
|
58 |
|
59 self.panel.fire('show'); |
|
60 self.panel.reflow(); |
|
61 } else { |
|
62 self.panel.show(); |
|
63 } |
|
64 |
|
65 self.panel.moveRel(self.getEl(), settings.popoverAlign || (self.isRtl() ? ['bc-tr', 'bc-tc'] : ['bc-tl', 'bc-tc'])); |
|
66 }, |
|
67 |
|
68 /** |
|
69 * Hides the panel for the button. |
|
70 * |
|
71 * @method hidePanel |
|
72 */ |
|
73 hidePanel: function() { |
|
74 var self = this; |
|
75 |
|
76 if (self.panel) { |
|
77 self.panel.hide(); |
|
78 } |
|
79 }, |
|
80 |
|
81 /** |
|
82 * Called after the control has been rendered. |
|
83 * |
|
84 * @method postRender |
|
85 */ |
|
86 postRender: function() { |
|
87 var self = this; |
|
88 |
|
89 self.aria('haspopup', true); |
|
90 |
|
91 self.on('click', function(e) { |
|
92 if (e.control === self) { |
|
93 if (self.panel && self.panel.visible()) { |
|
94 self.hidePanel(); |
|
95 } else { |
|
96 self.showPanel(); |
|
97 self.panel.focus(!!e.aria); |
|
98 } |
|
99 } |
|
100 }); |
|
101 |
|
102 return self._super(); |
|
103 }, |
|
104 |
|
105 remove: function() { |
|
106 if (this.panel) { |
|
107 this.panel.remove(); |
|
108 this.panel = null; |
|
109 } |
|
110 |
|
111 return this._super(); |
|
112 } |
|
113 }); |
|
114 }); |