|
|
|
@ -7,61 +7,64 @@
|
|
|
|
|
* ======================================================================== */ |
|
|
|
|
|
|
|
|
|
!(function () { |
|
|
|
|
'use strict'; |
|
|
|
|
|
|
|
|
|
var getTarget = function (target) { |
|
|
|
|
var i; |
|
|
|
|
var segmentedControls = document.querySelectorAll('.segmented-control .control-item'); |
|
|
|
|
|
|
|
|
|
for (; target && target !== document; target = target.parentNode) { |
|
|
|
|
for (i = segmentedControls.length; i--;) { |
|
|
|
|
if (segmentedControls[i] === target) { |
|
|
|
|
return target; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
}; |
|
|
|
|
var tabTouchEnd = function (e) { |
|
|
|
|
var activeTab; |
|
|
|
|
var activeBodies; |
|
|
|
|
var targetBody; |
|
|
|
|
var targetTab = getTarget(e.target); |
|
|
|
|
var className = 'active'; |
|
|
|
|
var classSelector = '.control-content.active'; |
|
|
|
|
var tabClassSelector = '.control-item.active'; |
|
|
|
|
|
|
|
|
|
if (!targetTab) { |
|
|
|
|
return; |
|
|
|
|
} |
|
|
|
|
'use strict'; |
|
|
|
|
|
|
|
|
|
activeTab = targetTab.parentNode.querySelector(tabClassSelector); |
|
|
|
|
var getTarget = function (target) { |
|
|
|
|
var i; |
|
|
|
|
var segmentedControls = document.querySelectorAll('.segmented-control .control-item'); |
|
|
|
|
|
|
|
|
|
if (activeTab) { |
|
|
|
|
activeTab.classList.remove(className); |
|
|
|
|
for (; target && target !== document; target = target.parentNode) { |
|
|
|
|
for (i = segmentedControls.length; i--;) { |
|
|
|
|
if (segmentedControls[i] === target) { |
|
|
|
|
return target; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
}; |
|
|
|
|
|
|
|
|
|
targetTab.classList.add(className); |
|
|
|
|
window.addEventListener('touchend', function (e) { |
|
|
|
|
var activeTab; |
|
|
|
|
var activeBodies; |
|
|
|
|
var targetBody; |
|
|
|
|
var targetTab = getTarget(e.target); |
|
|
|
|
var className = 'active'; |
|
|
|
|
var classSelector = '.' + className; |
|
|
|
|
|
|
|
|
|
if (!targetTab.hash) { |
|
|
|
|
return; |
|
|
|
|
} |
|
|
|
|
if (!targetTab) { |
|
|
|
|
return; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
targetBody = document.querySelector(targetTab.hash); |
|
|
|
|
activeTab = targetTab.parentNode.querySelector(classSelector); |
|
|
|
|
|
|
|
|
|
if (!targetBody) { |
|
|
|
|
return; |
|
|
|
|
} |
|
|
|
|
if (activeTab) { |
|
|
|
|
activeTab.classList.remove(className); |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
activeBodies = targetBody.parentNode.querySelectorAll(classSelector); |
|
|
|
|
targetTab.classList.add(className); |
|
|
|
|
|
|
|
|
|
for (var i = 0; i < activeBodies.length; i++) { |
|
|
|
|
activeBodies[i].classList.remove(className); |
|
|
|
|
} |
|
|
|
|
if (!targetTab.hash) { |
|
|
|
|
return; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
targetBody = document.querySelector(targetTab.hash); |
|
|
|
|
|
|
|
|
|
if (!targetBody) { |
|
|
|
|
return; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
activeBodies = targetBody.parentNode.querySelectorAll(classSelector); |
|
|
|
|
|
|
|
|
|
for (var i = 0; i < activeBodies.length; i++) { |
|
|
|
|
activeBodies[i].classList.remove(className); |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
targetBody.classList.add(className); |
|
|
|
|
}); |
|
|
|
|
|
|
|
|
|
targetBody.classList.add(className); |
|
|
|
|
}; |
|
|
|
|
window.addEventListener('touchend', tabTouchEnd); |
|
|
|
|
window.addEventListener("MSPointerUp", tabTouchEnd); |
|
|
|
|
window.addEventListener('click', function (e) { |
|
|
|
|
if (getTarget(e.target)) { |
|
|
|
|
e.preventDefault(); |
|
|
|
|
} |
|
|
|
|
}); |
|
|
|
|
|
|
|
|
|
window.addEventListener('click', function (e) { if (getTarget(e.target)) { preventDef(e); } }); |
|
|
|
|
}()); |
|
|
|
|