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
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
|
},
/**
Registers an event listener for this object's custom events.
The callback gets a CustomEvent object with a 'detail'
propertly holding any tab-related state for the event. The events
are:
- 'before-switch-to' is emitted immediately before a new tab is
switched to. detail = the tab element.
- 'after-switch-to' is emitted immediately after a new tab is
switched to. detail = the tab element.
Any exceptions thrown by listeners are caught and ignored, to
avoid that they knock the tab state out of sync.
Returns this object.
*/
addEventListener: function(eventName, callback){
this.e.container.addEventListener(eventName, callback, false);
return this;
},
/**
If the given DOM element, unique selector, or integer (0-based
tab number) is one of this object's tabs, the UI makes that tab
the currently-visible one. Returns this object.
*/
switchToTab: function(tab){
tab = tabArg(tab,this);
const self = this;
this.e.tabs.childNodes.forEach((e,ndx)=>{
const btn = this.e.tabBar.childNodes[ndx];
if(e===tab){
if(D.hasClass(e,'selected')){
return;
}
self._dispatchEvent('before-switch-to',tab);
setVisible(e, true);
D.addClass(btn,'selected');
self._dispatchEvent('after-switch-to',tab);
}else{
if(D.hasClass(e,'selected')){
return;
}
setVisible(e, false);
|
>
>
>
>
|
>
>
>
>
>
>
>
>
|
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
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
|
},
/**
Registers an event listener for this object's custom events.
The callback gets a CustomEvent object with a 'detail'
propertly holding any tab-related state for the event. The events
are:
- 'before-switch-from' is emitted immediately before a new tab
is switched away from. detail = the tab element being switched
away from.
- 'before-switch-to' is emitted immediately before a new tab is
switched to. detail = the tab element.
- 'after-switch-to' is emitted immediately after a new tab is
switched to. detail = the tab element.
Any exceptions thrown by listeners are caught and ignored, to
avoid that they knock the tab state out of sync.
Returns this object.
*/
addEventListener: function(eventName, callback){
this.e.container.addEventListener(eventName, callback, false);
return this;
},
/**
If the given DOM element, unique selector, or integer (0-based
tab number) is one of this object's tabs, the UI makes that tab
the currently-visible one, firing any relevant events. Returns
this object. If the argument is the current tab, this is a
no-op, and no events are fired.
*/
switchToTab: function(tab){
tab = tabArg(tab,this);
const self = this;
if(tab===this._currentTab) return this;
else if(this._currentTab){
this._dispatchEvent('before-switch-from', this._currentTab);
}
delete this._currentTab;
this.e.tabs.childNodes.forEach((e,ndx)=>{
const btn = this.e.tabBar.childNodes[ndx];
if(e===tab){
if(D.hasClass(e,'selected')){
return;
}
self._dispatchEvent('before-switch-to',tab);
setVisible(e, true);
this._currentTab = e;
D.addClass(btn,'selected');
self._dispatchEvent('after-switch-to',tab);
}else{
if(D.hasClass(e,'selected')){
return;
}
setVisible(e, false);
|