]>
Commit | Line | Data |
---|---|---|
f0cfe83e AD |
1 | require({cache:{ |
2 | '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"}}); | |
3 | define("dijit/layout/TabController", [ | |
4 | "dojo/_base/declare", // declare | |
5 | "dojo/dom", // dom.setSelectable | |
6 | "dojo/dom-attr", // domAttr.attr | |
7 | "dojo/dom-class", // domClass.toggle | |
8 | "dojo/i18n", // i18n.getLocalization | |
9 | "dojo/_base/lang", // lang.hitch lang.trim | |
10 | "./StackController", | |
11 | "../registry", | |
12 | "../Menu", | |
13 | "../MenuItem", | |
14 | "dojo/text!./templates/_TabButton.html", | |
15 | "dojo/i18n!../nls/common" | |
16 | ], function(declare, dom, domAttr, domClass, i18n, lang, StackController, registry, Menu, MenuItem, template){ | |
17 | ||
18 | // module: | |
19 | // dijit/layout/TabController | |
20 | ||
21 | var TabButton = declare("dijit.layout._TabButton", StackController.StackButton, { | |
22 | // summary: | |
23 | // A tab (the thing you click to select a pane). | |
24 | // description: | |
25 | // Contains the title of the pane, and optionally a close-button to destroy the pane. | |
26 | // This is an internal widget and should not be instantiated directly. | |
27 | // tags: | |
28 | // private | |
29 | ||
30 | // baseClass: String | |
31 | // The CSS class applied to the domNode. | |
32 | baseClass: "dijitTab", | |
33 | ||
34 | // Apply dijitTabCloseButtonHover when close button is hovered | |
35 | cssStateNodes: { | |
36 | closeNode: "dijitTabCloseButton" | |
37 | }, | |
38 | ||
39 | templateString: template, | |
40 | ||
41 | // Override _FormWidget.scrollOnFocus. | |
42 | // Don't scroll the whole tab container into view when the button is focused. | |
43 | scrollOnFocus: false, | |
44 | ||
45 | buildRendering: function(){ | |
46 | this.inherited(arguments); | |
47 | ||
48 | dom.setSelectable(this.containerNode, false); | |
49 | }, | |
50 | ||
51 | startup: function(){ | |
52 | this.inherited(arguments); | |
53 | var n = this.domNode; | |
54 | ||
55 | // Required to give IE6 a kick, as it initially hides the | |
56 | // tabs until they are focused on. | |
57 | this.defer(function(){ | |
58 | n.className = n.className; | |
59 | }, 1); | |
60 | }, | |
61 | ||
62 | _setCloseButtonAttr: function(/*Boolean*/ disp){ | |
63 | // summary: | |
64 | // Hide/show close button | |
65 | this._set("closeButton", disp); | |
66 | domClass.toggle(this.domNode, "dijitClosable", disp); | |
67 | this.closeNode.style.display = disp ? "" : "none"; | |
68 | if(disp){ | |
69 | var _nlsResources = i18n.getLocalization("dijit", "common"); | |
70 | if(this.closeNode){ | |
71 | domAttr.set(this.closeNode, "title", _nlsResources.itemClose); | |
72 | } | |
73 | } | |
74 | }, | |
75 | ||
76 | _setDisabledAttr: function(/*Boolean*/ disabled){ | |
77 | // summary: | |
78 | // Make tab selected/unselectable | |
79 | ||
80 | this.inherited(arguments); | |
81 | ||
82 | // Don't show tooltip for close button when tab is disabled | |
83 | if(this.closeNode){ | |
84 | if(disabled){ | |
85 | domAttr.remove(this.closeNode, "title"); | |
86 | }else{ | |
87 | var _nlsResources = i18n.getLocalization("dijit", "common"); | |
88 | domAttr.set(this.closeNode, "title", _nlsResources.itemClose); | |
89 | } | |
90 | } | |
91 | }, | |
92 | ||
93 | _setLabelAttr: function(/*String*/ content){ | |
94 | // summary: | |
95 | // Hook for set('label', ...) to work. | |
96 | // description: | |
97 | // takes an HTML string. | |
98 | // Inherited ToggleButton implementation will Set the label (text) of the button; | |
99 | // Need to set the alt attribute of icon on tab buttons if no label displayed | |
100 | this.inherited(arguments); | |
101 | if(!this.showLabel && !this.params.title){ | |
102 | this.iconNode.alt = lang.trim(this.containerNode.innerText || this.containerNode.textContent || ''); | |
103 | } | |
104 | } | |
105 | }); | |
106 | ||
107 | var TabController = declare("dijit.layout.TabController", StackController, { | |
108 | // summary: | |
109 | // Set of tabs (the things with titles and a close button, that you click to show a tab panel). | |
110 | // Used internally by `dijit/layout/TabContainer`. | |
111 | // description: | |
112 | // Lets the user select the currently shown pane in a TabContainer or StackContainer. | |
113 | // TabController also monitors the TabContainer, and whenever a pane is | |
114 | // added or deleted updates itself accordingly. | |
115 | // tags: | |
116 | // private | |
117 | ||
118 | baseClass: "dijitTabController", | |
119 | ||
120 | templateString: "<div role='tablist' data-dojo-attach-event='onkeypress:onkeypress'></div>", | |
121 | ||
122 | // tabPosition: String | |
123 | // Defines where tabs go relative to the content. | |
124 | // "top", "bottom", "left-h", "right-h" | |
125 | tabPosition: "top", | |
126 | ||
127 | // buttonWidget: Constructor | |
128 | // The tab widget to create to correspond to each page | |
129 | buttonWidget: TabButton, | |
130 | ||
131 | // buttonWidgetCloseClass: String | |
132 | // Class of [x] close icon, used by event delegation code to tell when close button was clicked | |
133 | buttonWidgetCloseClass: "dijitTabCloseButton", | |
134 | ||
135 | postCreate: function(){ | |
136 | this.inherited(arguments); | |
137 | ||
138 | // Setup a close menu to be shared between all the closable tabs (excluding disabled tabs) | |
139 | var closeMenu = new Menu({ | |
140 | id: this.id+"_Menu", | |
141 | ownerDocument: this.ownerDocument, | |
142 | dir: this.dir, | |
143 | lang: this.lang, | |
144 | textDir: this.textDir, | |
145 | targetNodeIds: [this.domNode], | |
146 | selector: function(node){ | |
147 | return domClass.contains(node, "dijitClosable") && !domClass.contains(node, "dijitTabDisabled"); | |
148 | } | |
149 | }); | |
150 | this.own(closeMenu); | |
151 | ||
152 | var _nlsResources = i18n.getLocalization("dijit", "common"), | |
153 | controller = this; | |
154 | closeMenu.addChild(new MenuItem({ | |
155 | label: _nlsResources.itemClose, | |
156 | ownerDocument: this.ownerDocument, | |
157 | dir: this.dir, | |
158 | lang: this.lang, | |
159 | textDir: this.textDir, | |
160 | onClick: function(evt){ | |
161 | var button = registry.byNode(this.getParent().currentTarget); | |
162 | controller.onCloseButtonClick(button.page); | |
163 | } | |
164 | })); | |
165 | } | |
166 | }); | |
167 | ||
168 | TabController.TabButton = TabButton; // for monkey patching | |
169 | ||
170 | return TabController; | |
171 | }); |