Tim Schumacher
parent
3f1e728781
commit
4385f1acbc
425 changed files with 59924 additions and 37200 deletions
237
web/semantic/dist/components/sidebar.js
vendored
237
web/semantic/dist/components/sidebar.js
vendored
|
|
@ -1,9 +1,9 @@
|
|||
/*!
|
||||
* # Semantic UI 1.11.4 - Sidebar
|
||||
* # Semantic UI 2.1.7 - Sidebar
|
||||
* http://github.com/semantic-org/semantic-ui/
|
||||
*
|
||||
*
|
||||
* Copyright 2014 Contributors
|
||||
* Copyright 2015 Contributors
|
||||
* Released under the MIT license
|
||||
* http://opensource.org/licenses/MIT
|
||||
*
|
||||
|
|
@ -83,12 +83,6 @@ $.fn.sidebar = function(parameters) {
|
|||
|
||||
transitionEvent = module.get.transitionEvent();
|
||||
|
||||
// cache on initialize
|
||||
if( ( settings.useLegacy == 'auto' && module.is.legacy() ) || settings.useLegacy === true) {
|
||||
settings.transition = 'overlay';
|
||||
settings.useLegacy = true;
|
||||
}
|
||||
|
||||
if(module.is.ios()) {
|
||||
module.set.ios();
|
||||
}
|
||||
|
|
@ -101,6 +95,10 @@ $.fn.sidebar = function(parameters) {
|
|||
module.setup.layout();
|
||||
}
|
||||
|
||||
requestAnimationFrame(function() {
|
||||
module.setup.cache();
|
||||
});
|
||||
|
||||
module.instantiate();
|
||||
},
|
||||
|
||||
|
|
@ -122,11 +120,13 @@ $.fn.sidebar = function(parameters) {
|
|||
|
||||
destroy: function() {
|
||||
module.verbose('Destroying previous module for', $module);
|
||||
module.remove.direction();
|
||||
$module
|
||||
.off(eventNamespace)
|
||||
.removeData(moduleNamespace)
|
||||
;
|
||||
if(module.is.ios()) {
|
||||
module.remove.ios();
|
||||
}
|
||||
// bound by uuid
|
||||
$context.off(elementNamespace);
|
||||
$window.off(elementNamespace);
|
||||
|
|
@ -171,7 +171,7 @@ $.fn.sidebar = function(parameters) {
|
|||
module.verbose('Adding clickaway events to context', $context);
|
||||
if(settings.closable) {
|
||||
$context
|
||||
.on('click' + elementNamespace, module.event.clickaway)
|
||||
.on('click' + elementNamespace, module.event.clickaway)
|
||||
.on('touchend' + elementNamespace, module.event.clickaway)
|
||||
;
|
||||
}
|
||||
|
|
@ -206,10 +206,11 @@ $.fn.sidebar = function(parameters) {
|
|||
},
|
||||
|
||||
add: {
|
||||
bodyCSS: function() {
|
||||
inlineCSS: function() {
|
||||
var
|
||||
width = $module.outerWidth(),
|
||||
height = $module.outerHeight(),
|
||||
width = module.cache.width || $module.outerWidth(),
|
||||
height = module.cache.height || $module.outerHeight(),
|
||||
isRTL = module.is.rtl(),
|
||||
direction = module.get.direction(),
|
||||
distance = {
|
||||
left : width,
|
||||
|
|
@ -219,13 +220,14 @@ $.fn.sidebar = function(parameters) {
|
|||
},
|
||||
style
|
||||
;
|
||||
if( module.is.rtl() ){
|
||||
|
||||
if(isRTL){
|
||||
module.verbose('RTL detected, flipping widths');
|
||||
distance.left = -width;
|
||||
distance.right = width;
|
||||
}
|
||||
|
||||
style = '<style title="' + namespace + '">';
|
||||
style = '<style>';
|
||||
|
||||
if(direction === 'left' || direction === 'right') {
|
||||
module.debug('Adding CSS rules for animation distance', width);
|
||||
|
|
@ -277,8 +279,9 @@ $.fn.sidebar = function(parameters) {
|
|||
;
|
||||
}
|
||||
style += '</style>';
|
||||
$head.append(style);
|
||||
$style = $('style[title=' + namespace + ']');
|
||||
$style = $(style)
|
||||
.appendTo($head)
|
||||
;
|
||||
module.debug('Adding sizing css to head', $style);
|
||||
}
|
||||
},
|
||||
|
|
@ -289,6 +292,7 @@ $.fn.sidebar = function(parameters) {
|
|||
$sidebars = $context.children(selector.sidebar);
|
||||
$pusher = $context.children(selector.pusher);
|
||||
$fixed = $context.children(selector.fixed);
|
||||
module.clear.cache();
|
||||
},
|
||||
|
||||
refreshSidebars: function() {
|
||||
|
|
@ -298,13 +302,20 @@ $.fn.sidebar = function(parameters) {
|
|||
|
||||
repaint: function() {
|
||||
module.verbose('Forcing repaint event');
|
||||
element.style.display='none';
|
||||
element.offsetHeight;
|
||||
element.style.display = 'none';
|
||||
var ignored = element.offsetHeight;
|
||||
element.scrollTop = element.scrollTop;
|
||||
element.style.display='';
|
||||
element.style.display = '';
|
||||
},
|
||||
|
||||
setup: {
|
||||
cache: function() {
|
||||
module.cache = {
|
||||
width : $module.outerWidth(),
|
||||
height : $module.outerHeight(),
|
||||
rtl : ($module.css('direction') == 'rtl')
|
||||
};
|
||||
},
|
||||
layout: function() {
|
||||
if( $context.children(selector.pusher).length === 0 ) {
|
||||
module.debug('Adding wrapper element for sidebar');
|
||||
|
|
@ -324,6 +335,7 @@ $.fn.sidebar = function(parameters) {
|
|||
$module.detach().prependTo($context);
|
||||
module.refresh();
|
||||
}
|
||||
module.clear.cache();
|
||||
module.set.pushable();
|
||||
module.set.direction();
|
||||
}
|
||||
|
|
@ -349,11 +361,6 @@ $.fn.sidebar = function(parameters) {
|
|||
},
|
||||
|
||||
show: function(callback) {
|
||||
var
|
||||
animateMethod = (settings.useLegacy === true)
|
||||
? module.legacyPushPage
|
||||
: module.pushPage
|
||||
;
|
||||
callback = $.isFunction(callback)
|
||||
? callback
|
||||
: function(){}
|
||||
|
|
@ -381,7 +388,7 @@ $.fn.sidebar = function(parameters) {
|
|||
settings.transition = 'overlay';
|
||||
}
|
||||
}
|
||||
animateMethod(function() {
|
||||
module.pushPage(function() {
|
||||
callback.call(element);
|
||||
settings.onShow.call(element);
|
||||
});
|
||||
|
|
@ -394,11 +401,6 @@ $.fn.sidebar = function(parameters) {
|
|||
},
|
||||
|
||||
hide: function(callback) {
|
||||
var
|
||||
animateMethod = (settings.useLegacy === true)
|
||||
? module.legacyPullPage
|
||||
: module.pullPage
|
||||
;
|
||||
callback = $.isFunction(callback)
|
||||
? callback
|
||||
: function(){}
|
||||
|
|
@ -406,7 +408,7 @@ $.fn.sidebar = function(parameters) {
|
|||
if(module.is.visible() || module.is.animating()) {
|
||||
module.debug('Hiding sidebar', callback);
|
||||
module.refreshSidebars();
|
||||
animateMethod(function() {
|
||||
module.pullPage(function() {
|
||||
callback.call(element);
|
||||
settings.onHidden.call(element);
|
||||
});
|
||||
|
|
@ -455,12 +457,11 @@ $.fn.sidebar = function(parameters) {
|
|||
pushPage: function(callback) {
|
||||
var
|
||||
transition = module.get.transition(),
|
||||
$transition = (transition == 'safe')
|
||||
? $context
|
||||
: (transition === 'overlay' || module.othersActive())
|
||||
? $module
|
||||
: $pusher,
|
||||
$transition = (transition === 'overlay' || module.othersActive())
|
||||
? $module
|
||||
: $pusher,
|
||||
animate,
|
||||
dim,
|
||||
transitionEnd
|
||||
;
|
||||
callback = $.isFunction(callback)
|
||||
|
|
@ -474,14 +475,12 @@ $.fn.sidebar = function(parameters) {
|
|||
module.repaint();
|
||||
animate = function() {
|
||||
module.bind.clickaway();
|
||||
module.add.bodyCSS();
|
||||
module.add.inlineCSS();
|
||||
module.set.animating();
|
||||
module.set.visible();
|
||||
if(!module.othersVisible()) {
|
||||
if(settings.dimPage) {
|
||||
$pusher.addClass(className.dimmed);
|
||||
}
|
||||
}
|
||||
};
|
||||
dim = function() {
|
||||
module.set.dimmed();
|
||||
};
|
||||
transitionEnd = function(event) {
|
||||
if( event.target == $transition[0] ) {
|
||||
|
|
@ -494,16 +493,17 @@ $.fn.sidebar = function(parameters) {
|
|||
$transition.off(transitionEvent + elementNamespace);
|
||||
$transition.on(transitionEvent + elementNamespace, transitionEnd);
|
||||
requestAnimationFrame(animate);
|
||||
if(settings.dimPage && !module.othersVisible()) {
|
||||
requestAnimationFrame(dim);
|
||||
}
|
||||
},
|
||||
|
||||
pullPage: function(callback) {
|
||||
var
|
||||
transition = module.get.transition(),
|
||||
$transition = (transition == 'safe')
|
||||
? $context
|
||||
: (transition == 'overlay' || module.othersActive())
|
||||
? $module
|
||||
: $pusher,
|
||||
$transition = (transition == 'overlay' || module.othersActive())
|
||||
? $module
|
||||
: $pusher,
|
||||
animate,
|
||||
transitionEnd
|
||||
;
|
||||
|
|
@ -513,11 +513,11 @@ $.fn.sidebar = function(parameters) {
|
|||
;
|
||||
module.verbose('Removing context push state', module.get.direction());
|
||||
|
||||
module.set.transition(transition);
|
||||
module.unbind.clickaway();
|
||||
module.unbind.scrollLock();
|
||||
|
||||
animate = function() {
|
||||
module.set.transition(transition);
|
||||
module.set.animating();
|
||||
module.remove.visible();
|
||||
if(settings.dimPage && !module.othersVisible()) {
|
||||
|
|
@ -529,7 +529,7 @@ $.fn.sidebar = function(parameters) {
|
|||
$transition.off(transitionEvent + elementNamespace, transitionEnd);
|
||||
module.remove.animating();
|
||||
module.remove.transition();
|
||||
module.remove.bodyCSS();
|
||||
module.remove.inlineCSS();
|
||||
if(transition == 'scale down' || (settings.returnScroll && module.is.mobile()) ) {
|
||||
module.scrollBack();
|
||||
}
|
||||
|
|
@ -541,62 +541,6 @@ $.fn.sidebar = function(parameters) {
|
|||
requestAnimationFrame(animate);
|
||||
},
|
||||
|
||||
legacyPushPage: function(callback) {
|
||||
var
|
||||
distance = $module.width(),
|
||||
direction = module.get.direction(),
|
||||
properties = {}
|
||||
;
|
||||
distance = distance || $module.width();
|
||||
callback = $.isFunction(callback)
|
||||
? callback
|
||||
: function(){}
|
||||
;
|
||||
properties[direction] = distance;
|
||||
module.debug('Using javascript to push context', properties);
|
||||
module.set.visible();
|
||||
module.set.transition();
|
||||
module.set.animating();
|
||||
if(settings.dimPage) {
|
||||
$pusher.addClass(className.dimmed);
|
||||
}
|
||||
$context
|
||||
.css('position', 'relative')
|
||||
.animate(properties, settings.duration, settings.easing, function() {
|
||||
module.remove.animating();
|
||||
module.bind.clickaway();
|
||||
callback.call(element);
|
||||
})
|
||||
;
|
||||
},
|
||||
legacyPullPage: function(callback) {
|
||||
var
|
||||
distance = 0,
|
||||
direction = module.get.direction(),
|
||||
properties = {}
|
||||
;
|
||||
distance = distance || $module.width();
|
||||
callback = $.isFunction(callback)
|
||||
? callback
|
||||
: function(){}
|
||||
;
|
||||
properties[direction] = '0px';
|
||||
module.debug('Using javascript to pull context', properties);
|
||||
module.unbind.clickaway();
|
||||
module.set.animating();
|
||||
module.remove.visible();
|
||||
if(settings.dimPage && !module.othersActive()) {
|
||||
$pusher.removeClass(className.dimmed);
|
||||
}
|
||||
$context
|
||||
.css('position', 'relative')
|
||||
.animate(properties, settings.duration, settings.easing, function() {
|
||||
module.remove.animating();
|
||||
callback.call(element);
|
||||
})
|
||||
;
|
||||
},
|
||||
|
||||
scrollToTop: function() {
|
||||
module.verbose('Scrolling to top of page to avoid animation issues');
|
||||
currentScroll = $(window).scrollTop();
|
||||
|
|
@ -609,8 +553,16 @@ $.fn.sidebar = function(parameters) {
|
|||
window.scrollTo(0, currentScroll);
|
||||
},
|
||||
|
||||
clear: {
|
||||
cache: function() {
|
||||
module.verbose('Clearing cached dimensions');
|
||||
module.cache = {};
|
||||
}
|
||||
},
|
||||
|
||||
set: {
|
||||
// html
|
||||
|
||||
// ios only (scroll on html not document). This prevent auto-resize canvas/scroll in ios
|
||||
ios: function() {
|
||||
$html.addClass(className.ios);
|
||||
},
|
||||
|
|
@ -623,6 +575,11 @@ $.fn.sidebar = function(parameters) {
|
|||
$context.addClass(className.pushable);
|
||||
},
|
||||
|
||||
// pusher
|
||||
dimmed: function() {
|
||||
$pusher.addClass(className.dimmed);
|
||||
},
|
||||
|
||||
// sidebar
|
||||
active: function() {
|
||||
$module.addClass(className.active);
|
||||
|
|
@ -647,13 +604,18 @@ $.fn.sidebar = function(parameters) {
|
|||
},
|
||||
remove: {
|
||||
|
||||
bodyCSS: function() {
|
||||
module.debug('Removing body css styles', $style);
|
||||
inlineCSS: function() {
|
||||
module.debug('Removing inline css styles', $style);
|
||||
if($style && $style.length > 0) {
|
||||
$style.remove();
|
||||
}
|
||||
},
|
||||
|
||||
// ios scroll on html not document
|
||||
ios: function() {
|
||||
$html.removeClass(className.ios);
|
||||
},
|
||||
|
||||
// context
|
||||
pushed: function() {
|
||||
$context.removeClass(className.pushed);
|
||||
|
|
@ -743,36 +705,13 @@ $.fn.sidebar = function(parameters) {
|
|||
return (isIE11 || isIE);
|
||||
},
|
||||
|
||||
legacy: function() {
|
||||
var
|
||||
element = document.createElement('div'),
|
||||
transforms = {
|
||||
'webkitTransform' :'-webkit-transform',
|
||||
'OTransform' :'-o-transform',
|
||||
'msTransform' :'-ms-transform',
|
||||
'MozTransform' :'-moz-transform',
|
||||
'transform' :'transform'
|
||||
},
|
||||
has3D
|
||||
;
|
||||
|
||||
// Add it to the body to get the computed style.
|
||||
document.body.insertBefore(element, null);
|
||||
for (var transform in transforms) {
|
||||
if (element.style[transform] !== undefined) {
|
||||
element.style[transform] = "translate3d(1px,1px,1px)";
|
||||
has3D = window.getComputedStyle(element).getPropertyValue(transforms[transform]);
|
||||
}
|
||||
}
|
||||
document.body.removeChild(element);
|
||||
return !(has3D !== undefined && has3D.length > 0 && has3D !== 'none');
|
||||
},
|
||||
ios: function() {
|
||||
var
|
||||
userAgent = navigator.userAgent,
|
||||
isIOS = userAgent.match(regExp.ios)
|
||||
userAgent = navigator.userAgent,
|
||||
isIOS = userAgent.match(regExp.ios),
|
||||
isMobileChrome = userAgent.match(regExp.mobileChrome)
|
||||
;
|
||||
if(isIOS) {
|
||||
if(isIOS && !isMobileChrome) {
|
||||
module.verbose('Browser was found to be iOS', userAgent);
|
||||
return true;
|
||||
}
|
||||
|
|
@ -814,7 +753,10 @@ $.fn.sidebar = function(parameters) {
|
|||
return $context.hasClass(className.animating);
|
||||
},
|
||||
rtl: function () {
|
||||
return $module.css('direction') == 'rtl';
|
||||
if(module.cache.rtl === undefined) {
|
||||
module.cache.rtl = ($module.css('direction') == 'rtl');
|
||||
}
|
||||
return module.cache.rtl;
|
||||
}
|
||||
},
|
||||
|
||||
|
|
@ -887,7 +829,7 @@ $.fn.sidebar = function(parameters) {
|
|||
});
|
||||
}
|
||||
clearTimeout(module.performance.timer);
|
||||
module.performance.timer = setTimeout(module.performance.display, 100);
|
||||
module.performance.timer = setTimeout(module.performance.display, 500);
|
||||
},
|
||||
display: function() {
|
||||
var
|
||||
|
|
@ -1001,7 +943,7 @@ $.fn.sidebar.settings = {
|
|||
namespace : 'sidebar',
|
||||
|
||||
debug : false,
|
||||
verbose : true,
|
||||
verbose : false,
|
||||
performance : true,
|
||||
|
||||
transition : 'auto',
|
||||
|
|
@ -1030,9 +972,7 @@ $.fn.sidebar.settings = {
|
|||
returnScroll : false,
|
||||
delaySetup : false,
|
||||
|
||||
useLegacy : 'auto',
|
||||
duration : 500,
|
||||
easing : 'easeInOutQuint',
|
||||
|
||||
onChange : function(){},
|
||||
onShow : function(){},
|
||||
|
|
@ -1063,8 +1003,9 @@ $.fn.sidebar.settings = {
|
|||
},
|
||||
|
||||
regExp: {
|
||||
ios : /(iPad|iPhone|iPod)/g,
|
||||
mobile : /Mobile|iP(hone|od|ad)|Android|BlackBerry|IEMobile|Kindle|NetFront|Silk-Accelerated|(hpw|web)OS|Fennec|Minimo|Opera M(obi|ini)|Blazer|Dolfin|Dolphin|Skyfire|Zune/g
|
||||
ios : /(iPad|iPhone|iPod)/g,
|
||||
mobileChrome : /(CriOS)/g,
|
||||
mobile : /Mobile|iP(hone|od|ad)|Android|BlackBerry|IEMobile|Kindle|NetFront|Silk-Accelerated|(hpw|web)OS|Fennec|Minimo|Opera M(obi|ini)|Blazer|Dolfin|Dolphin|Skyfire|Zune/g
|
||||
},
|
||||
|
||||
error : {
|
||||
|
|
@ -1077,13 +1018,5 @@ $.fn.sidebar.settings = {
|
|||
|
||||
};
|
||||
|
||||
// Adds easing
|
||||
$.extend( $.easing, {
|
||||
easeInOutQuint: function (x, t, b, c, d) {
|
||||
if ((t/=d/2) < 1) return c/2*t*t*t*t*t + b;
|
||||
return c/2*((t-=2)*t*t*t*t + 2) + b;
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
})( jQuery, window , document );
|
||||
})( jQuery, window, document );
|
||||
|
|
|
|||
Reference in a new issue