aboutsummaryrefslogtreecommitdiffstats
path: root/tests/visual/menu/menubar.js
blob: 0aadef94496e9c7f8d038bc53c131dadd497fc76 (plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
/*
 * jQuery UI menubar
 *
 * backported from Michael Lang's fork: http://www.nexul.com/prototypes/toolbar/demo.html
 */
(function($) {

// TODO take non-menubar buttons into account
$.widget("ui.menubar", {
   options: {
      buttons: false,
      menuIcon: false
   },
	_create: function() {
		var self = this;
		var items = this.items = this.element.children("button, a");
		var o = this.options;
				
		this.element.addClass('ui-menubar ui-widget-header ui-helper-clearfix');
		
		items.next("ul").each(function(i, elm) {
			$(elm).menu({
				select: function(event, ui) {
					ui.item.parents("ul:last").hide()
					self.options.select.apply(this, arguments);
				}
			}).hide().keydown(function(event) {
				var menu = $(this);
				if (menu.is(":hidden")) 
					return;
				event.stopPropagation();
				switch (event.keyCode) {
				case $.ui.keyCode.LEFT:
					self.left(event);
					event.preventDefault();
					break;
				case $.ui.keyCode.RIGHT:
					self.right(event);
					event.preventDefault();
					break;
				case $.ui.keyCode.TAB:
					self[ event.shiftKey ? "left" : "right" ]( event );
					event.preventDefault();
					break;
				};
			});
		});
		items.each(function() {
			var input = $(this),
				   menu = input.next("ul");
			
			input
			   .bind("click focus mouseenter", function(event) {
   				if (menu.length && (!/^mouse/.test(event.type) || self.active && self.active.is(":visible") )) {
   					self._open(event, menu);
   				}
   				event.preventDefault();
   				event.stopPropagation();
   			})
   			.button({
   				icons: {
   					secondary: o.menuIcon ? (menu.length ? 'ui-icon-triangle-1-s' : '') : ''   					
   				}
   			});
   			
         if (!o.buttons) {
            input.addClass('ui-menubar-link').removeClass('ui-state-default');
         };			
			
		});
		$(document).click(function(event) {
			!$(event.target).closest(".ui-menubar").length && self._close();
		});
	},
	
	_close: function() {
		this.items.next("ul").hide();
		this.items.removeClass("ui-state-active");
	},
	
	_open: function(event, menu) {
		if (this.active) {
			this.active.menu("closeAll").hide();
			this.active.prev().removeClass("ui-state-active");
		}
		var button = menu.prev().addClass("ui-state-active");
		this.active = menu.show().position({
			my: "left top",
			at: "left bottom",
			offset: "0 -1",
			of: button
		}).focus();
	},
	
	left: function(event) {
		var prev = this.active.prevAll( ".ui-menu" ).eq( 0 );
		if (prev.length) {
			this._open(event, prev);
		} else {
			this._open(event, this.element.children(".ui-menu:last"));
		}
	},
	
	right: function(event) {
		var next =  this.active.nextAll( ".ui-menu" ).eq( 0 );
		if (next.length) {
			this._open(event, next);
		} else {
			this._open(event, this.element.children(".ui-menu:first"));
		}
	}
});

}(jQuery));