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 });