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
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
|
require({cache:{
'url:dijit/layout/templates/_TabButton.html':"<div role=\"presentation\" data-dojo-attach-point=\"titleNode,innerDiv,tabContent\" class=\"dijitTabInner dijitTabContent\">\n\t<img src=\"${_blankGif}\" alt=\"\" class=\"dijitIcon dijitTabButtonIcon\" data-dojo-attach-point='iconNode'/>\n\t<span data-dojo-attach-point='containerNode,focusNode' class='tabLabel'></span>\n\t<span class=\"dijitInline dijitTabCloseButton dijitTabCloseIcon\" data-dojo-attach-point='closeNode'\n\t\t role=\"presentation\">\n\t\t<span data-dojo-attach-point='closeText' class='dijitTabCloseText'>[x]</span\n\t\t\t\t></span>\n</div>\n"}});
define("dijit/layout/TabController", [
"dojo/_base/declare", // declare
"dojo/dom", // dom.setSelectable
"dojo/dom-attr", // domAttr.attr
"dojo/dom-class", // domClass.toggle
"dojo/i18n", // i18n.getLocalization
"dojo/_base/lang", // lang.hitch lang.trim
"./StackController",
"../registry",
"../Menu",
"../MenuItem",
"dojo/text!./templates/_TabButton.html",
"dojo/i18n!../nls/common"
], function(declare, dom, domAttr, domClass, i18n, lang, StackController, registry, Menu, MenuItem, template){
// module:
// dijit/layout/TabController
var TabButton = declare("dijit.layout._TabButton", StackController.StackButton, {
// summary:
// A tab (the thing you click to select a pane).
// description:
// Contains the title of the pane, and optionally a close-button to destroy the pane.
// This is an internal widget and should not be instantiated directly.
// tags:
// private
// baseClass: String
// The CSS class applied to the domNode.
baseClass: "dijitTab",
// Apply dijitTabCloseButtonHover when close button is hovered
cssStateNodes: {
closeNode: "dijitTabCloseButton"
},
templateString: template,
// Override _FormWidget.scrollOnFocus.
// Don't scroll the whole tab container into view when the button is focused.
scrollOnFocus: false,
buildRendering: function(){
this.inherited(arguments);
dom.setSelectable(this.containerNode, false);
},
startup: function(){
this.inherited(arguments);
var n = this.domNode;
// Required to give IE6 a kick, as it initially hides the
// tabs until they are focused on.
this.defer(function(){
n.className = n.className;
}, 1);
},
_setCloseButtonAttr: function(/*Boolean*/ disp){
// summary:
// Hide/show close button
this._set("closeButton", disp);
domClass.toggle(this.domNode, "dijitClosable", disp);
this.closeNode.style.display = disp ? "" : "none";
if(disp){
var _nlsResources = i18n.getLocalization("dijit", "common");
if(this.closeNode){
domAttr.set(this.closeNode, "title", _nlsResources.itemClose);
}
}
},
_setDisabledAttr: function(/*Boolean*/ disabled){
// summary:
// Make tab selected/unselectable
this.inherited(arguments);
// Don't show tooltip for close button when tab is disabled
if(this.closeNode){
if(disabled){
domAttr.remove(this.closeNode, "title");
}else{
var _nlsResources = i18n.getLocalization("dijit", "common");
domAttr.set(this.closeNode, "title", _nlsResources.itemClose);
}
}
},
_setLabelAttr: function(/*String*/ content){
// summary:
// Hook for set('label', ...) to work.
// description:
// takes an HTML string.
// Inherited ToggleButton implementation will Set the label (text) of the button;
// Need to set the alt attribute of icon on tab buttons if no label displayed
this.inherited(arguments);
if(!this.showLabel && !this.params.title){
this.iconNode.alt = lang.trim(this.containerNode.innerText || this.containerNode.textContent || '');
}
}
});
var TabController = declare("dijit.layout.TabController", StackController, {
// summary:
// Set of tabs (the things with titles and a close button, that you click to show a tab panel).
// Used internally by `dijit/layout/TabContainer`.
// description:
// Lets the user select the currently shown pane in a TabContainer or StackContainer.
// TabController also monitors the TabContainer, and whenever a pane is
// added or deleted updates itself accordingly.
// tags:
// private
baseClass: "dijitTabController",
templateString: "<div role='tablist' data-dojo-attach-event='onkeypress:onkeypress'></div>",
// tabPosition: String
// Defines where tabs go relative to the content.
// "top", "bottom", "left-h", "right-h"
tabPosition: "top",
// buttonWidget: Constructor
// The tab widget to create to correspond to each page
buttonWidget: TabButton,
// buttonWidgetCloseClass: String
// Class of [x] close icon, used by event delegation code to tell when close button was clicked
buttonWidgetCloseClass: "dijitTabCloseButton",
postCreate: function(){
this.inherited(arguments);
// Setup a close menu to be shared between all the closable tabs (excluding disabled tabs)
var closeMenu = new Menu({
id: this.id+"_Menu",
ownerDocument: this.ownerDocument,
dir: this.dir,
lang: this.lang,
textDir: this.textDir,
targetNodeIds: [this.domNode],
selector: function(node){
return domClass.contains(node, "dijitClosable") && !domClass.contains(node, "dijitTabDisabled");
}
});
this.own(closeMenu);
var _nlsResources = i18n.getLocalization("dijit", "common"),
controller = this;
closeMenu.addChild(new MenuItem({
label: _nlsResources.itemClose,
ownerDocument: this.ownerDocument,
dir: this.dir,
lang: this.lang,
textDir: this.textDir,
onClick: function(evt){
var button = registry.byNode(this.getParent().currentTarget);
controller.onCloseButtonClick(button.page);
}
}));
}
});
TabController.TabButton = TabButton; // for monkey patching
return TabController;
});
|
