Skip to content

Commit 73f81df

Browse files
author
Edwin Hui
committed
Optimization code
1 parent 5d21fba commit 73f81df

File tree

1 file changed

+39
-45
lines changed

1 file changed

+39
-45
lines changed

‎js/multitabs.js

Lines changed: 39 additions & 45 deletions
Original file line numberDiff line numberDiff line change
@@ -239,7 +239,7 @@ if (typeof jQuery === "undefined") {
239239
*/
240240
create : function (obj, active) {
241241
var self = this, options = self.options;
242-
var param, index, id, $navTab;
242+
var param, $navTab;
243243
if(! ( param = self._getParam(obj) )) {
244244
return self; //return multitabs obj when is invaid obj
245245
}
@@ -251,14 +251,14 @@ if (typeof jQuery === "undefined") {
251251
return self;
252252
}
253253
param.active = param.active === undefined ? active : param.active;
254-
index = getTabIndex(param.content, options.navBar.maxTabs);
255-
id = self._generateId(param, index);
256-
257-
$navTab = self._createNavTab(param, index);
254+
param.index = getTabIndex(param.content, options.navBar.maxTabs);
255+
param.id = self._generateId(param);
256+
//nav tab create
257+
$navTab = self._createNavTab(param);
258258
//tab-pane create
259-
self._createTabPane(param, index);
259+
self._createTabPane(param);
260260
//add tab to storage
261-
self._storage(id, param);
261+
self._storage( param.id, param);
262262
if(param.active) {
263263
self.active($navTab);
264264
}
@@ -272,10 +272,10 @@ if (typeof jQuery === "undefined") {
272272
* @returns {*|{}}
273273
* @private
274274
*/
275-
_createTabPane : function (param, index) {
276-
var self = this, $el = self.$element, id = self._generateId(param, index);
277-
$el.tabContent.append(self._getTabPaneHtml(param, index));
278-
return $el.tabContent.find('#' + id);
275+
_createTabPane : function (param) {
276+
var self = this, $el = self.$element;
277+
$el.tabContent.append(self._getTabPaneHtml(param));
278+
return $el.tabContent.find('#' + param.id);
279279
},
280280

281281
/**
@@ -285,17 +285,16 @@ if (typeof jQuery === "undefined") {
285285
* @returns {string}
286286
* @private
287287
*/
288-
_getTabPaneHtml : function (param, index) {
289-
var self = this, options = self.options,
290-
id = self._generateId(param, index);
288+
_getTabPaneHtml : function (param) {
289+
var self = this, options = self.options;
291290
if(param.iframe){
292291
return defaultLayoutTemplates.iframeTabPane
293292
.replace('{class}', options.iframeTabPane.class)
294-
.replace('{tabPaneId}', id);
293+
.replace('{tabPaneId}', param.id);
295294
}else{
296295
return defaultLayoutTemplates.ajaxTabPane
297296
.replace('{class}', options.ajaxTabPane.class)
298-
.replace('{tabPaneId}', id);
297+
.replace('{tabPaneId}', param.id);
299298
}
300299
},
301300

@@ -306,18 +305,18 @@ if (typeof jQuery === "undefined") {
306305
* @returns {*|{}}
307306
* @private
308307
*/
309-
_createNavTab : function (param, index) {
308+
_createNavTab : function (param) {
310309
var self = this, $el = self.$element;
311-
var navTabHtml = self._getNavTabHtml(param, index);
310+
var navTabHtml = self._getNavTabHtml(param);
312311

313-
var $navTabLi = $el.navPanelList.find('a[data-content="'+ param.content +'"][data-index="'+ index +'"]').parent('li');
312+
var $navTabLi = $el.navPanelList.find('a[data-content="'+ param.content +'"][data-index="'+ param.index +'"]').parent('li');
314313
if($navTabLi.length){
315314
$navTabLi.html(navTabHtml);
316315
self._getTabPane($navTabLi.find('a:first')).remove(); //remove old content pane directly
317316
}else {
318317
$el.navPanelList.append( '<li>' + navTabHtml + '</li>');
319318
}
320-
return $el.navPanelList.find('a[data-content="'+ param.content +'"][data-index="'+ index +'"]');
319+
return $el.navPanelList.find('a[data-content="'+ param.content +'"][data-index="'+ param.index +'"]:first');
321320

322321
},
323322

@@ -328,17 +327,16 @@ if (typeof jQuery === "undefined") {
328327
* @returns {string}
329328
* @private
330329
*/
331-
_getNavTabHtml : function (param, index) {
330+
_getNavTabHtml : function (param) {
332331
var self = this,
333332
options = self.options;
334-
var closeBtnHtml, display, id;
333+
var closeBtnHtml, display;
335334

336-
id = self._generateId(param, index);
337335
display = options.showClose ? 'display:inline;' : '';
338336
closeBtnHtml = (param.content === 'main') ? '' : defaultLayoutTemplates.closeBtn.replace('{style}', display); //main content can not colse.
339337
return defaultLayoutTemplates.navTab
340-
.replace('{index}', index)
341-
.replace('{navTabId}', id)
338+
.replace('{index}', param.index)
339+
.replace('{navTabId}', param.id)
342340
.replace('{url}', param.url)
343341
.replace('{title}', param.title)
344342
.replace('{content}', param.content)
@@ -352,8 +350,8 @@ if (typeof jQuery === "undefined") {
352350
* @returns {string}
353351
* @private
354352
*/
355-
_generateId : function(param, index){
356-
return 'multitabs_' + param.content + '_' + index;
353+
_generateId : function(param){
354+
return 'multitabs_' + param.content + '_' + param.index;
357355
},
358356

359357
/**
@@ -667,18 +665,18 @@ if (typeof jQuery === "undefined") {
667665
handler($el.navPanelList, 'mousedown', '.mt-nav-tab', function (event) {
668666
var $navTab = $(this), $navTabLi = $navTab.closest('li');
669667
var $prevNavTabLi = $navTabLi.prev();
670-
var isMove = true, moved = false, isMain = ($navTab.data('content') === "main");
671-
var navTabBlankHtml = '<li id="multitabs_tmp_tab_blank" class="mt-tmp" style="width:' + $navTabLi.outerWidth() + 'px; height:'+ $navTabLi.outerHeight() +'px;"><a style="width: 100%; height: 100%; "></a></li>';
668+
var dragMode = true, moved = false, isMain = ($navTab.data('content') === "main");
669+
var navTabBlankHtml = '<li id="multitabs_tmp_tab_blank" class="mt-drag-tmp" style="width:' + $navTabLi.outerWidth() + 'px; height:'+ $navTabLi.outerHeight() +'px;"><a style="width: 100%; height: 100%; "></a></li>';
672670
var abs_x = event.pageX - $navTabLi.offset().left + $el.navBar.offset().left;
673671
$navTabLi.before(navTabBlankHtml);
674672
$navTabLi.css({'left': event.pageX - abs_x + 'px', 'position': 'absolute', 'z-index': 9999})
675-
.addClass('mt-tmp')
673+
.addClass('mt-drag-tmp')
676674
.find('a:first').css({'background' : '#f39c12'});
677675

678676
$(document).on('mousemove', function (event) {
679-
if (isMove && !isMain) {
677+
if (dragMode && !isMain) {
680678
$navTabLi.css({'left': event.pageX - abs_x + 'px'});
681-
$el.navPanelList.children('li:not(".mt-tmp")').each(function () {
679+
$el.navPanelList.children('li:not(".mt-drag-tmp")').each(function () {
682680
var leftWidth = $(this).offset().left + $(this).outerWidth() + 20; //20 px more for gap
683681
if( leftWidth > $navTabLi.offset().left ){
684682
if($(this).next().attr('id') !== 'multitabs_tmp_tab_blank'){
@@ -692,20 +690,20 @@ if (typeof jQuery === "undefined") {
692690
});
693691
}
694692
}).on("selectstart",function(){ //disable text selection
695-
if (isMove) {
693+
if (dragMode) {
696694
return false;
697695
}
698696
}).on('mouseup', function () {
699-
if(isMove){
697+
if(dragMode){
700698
$navTabLi.css({'left': '0px', 'position': 'relative', 'z-index': 'inherit'})
701-
.removeClass('mt-tmp')
699+
.removeClass('mt-drag-tmp')
702700
.find('a:first').css({'background' : ''});
703701
$('#multitabs_tmp_tab_blank').remove();
704702
if(moved){
705703
$prevNavTabLi.after($navTabLi);
706704
}
707705
}
708-
isMove = false;
706+
dragMode = false;
709707
});
710708
});
711709
}
@@ -824,6 +822,10 @@ if (typeof jQuery === "undefined") {
824822
if (!param.url.length){
825823
return false;
826824
}
825+
//id
826+
param.id = $obj.data('id') || obj.id;
827+
//index
828+
param.index = $obj.data('index') || obj.index;
827829
//iframe
828830
param.iframe = $obj.data('iframe') || obj.iframe || isExtUrl(param.url) || options.iframe;
829831
//content
@@ -1059,15 +1061,7 @@ if (typeof jQuery === "undefined") {
10591061
iframe : false, //Global iframe mode, default is false, is the auto mode (for the self page, use ajax, and the external, use iframe)
10601062
class : '', //class for whole multitabs
10611063
content : 'info', //change the data-content name, is not necessary to change.
1062-
init : [ //tabs in initial
1063-
// {
1064-
// content :'', //content type, may be main | info | editor, if empty, default is 'info'
1065-
// title : '', //title of tab, if empty, show the URL
1066-
// url : '' //URL, if it's external link, content type change to 'info'
1067-
// },
1068-
// { ...... }, //add more page.
1069-
// { ...... },
1070-
],
1064+
init : [], //tabs in initial
10711065
navBar : {
10721066
class : '', //class of navBar
10731067
maxTabs : 15, //Max tabs number (without counting main and editor), when is 1, hide the whole navBar

0 commit comments

Comments
 (0)