You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

1122 lines
36 KiB

9 years ago
9 years ago
10 years ago
9 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
9 years ago
10 years ago
9 years ago
9 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
9 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
9 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
9 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
9 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
  1. /*!
  2. * # Semantic UI 2.0.0 - Sidebar
  3. * http://github.com/semantic-org/semantic-ui/
  4. *
  5. *
  6. * Copyright 2015 Contributors
  7. * Released under the MIT license
  8. * http://opensource.org/licenses/MIT
  9. *
  10. */
  11. ;(function ( $, window, document, undefined ) {
  12. "use strict";
  13. $.fn.sidebar = function(parameters) {
  14. var
  15. $allModules = $(this),
  16. $window = $(window),
  17. $document = $(document),
  18. $html = $('html'),
  19. $head = $('head'),
  20. moduleSelector = $allModules.selector || '',
  21. time = new Date().getTime(),
  22. performance = [],
  23. query = arguments[0],
  24. methodInvoked = (typeof query == 'string'),
  25. queryArguments = [].slice.call(arguments, 1),
  26. requestAnimationFrame = window.requestAnimationFrame
  27. || window.mozRequestAnimationFrame
  28. || window.webkitRequestAnimationFrame
  29. || window.msRequestAnimationFrame
  30. || function(callback) { setTimeout(callback, 0); },
  31. returnedValue
  32. ;
  33. $allModules
  34. .each(function() {
  35. var
  36. settings = ( $.isPlainObject(parameters) )
  37. ? $.extend(true, {}, $.fn.sidebar.settings, parameters)
  38. : $.extend({}, $.fn.sidebar.settings),
  39. selector = settings.selector,
  40. className = settings.className,
  41. namespace = settings.namespace,
  42. regExp = settings.regExp,
  43. error = settings.error,
  44. eventNamespace = '.' + namespace,
  45. moduleNamespace = 'module-' + namespace,
  46. $module = $(this),
  47. $context = $(settings.context),
  48. $sidebars = $module.children(selector.sidebar),
  49. $fixed = $context.children(selector.fixed),
  50. $pusher = $context.children(selector.pusher),
  51. $style,
  52. element = this,
  53. instance = $module.data(moduleNamespace),
  54. elementNamespace,
  55. id,
  56. currentScroll,
  57. transitionEvent,
  58. module
  59. ;
  60. module = {
  61. initialize: function() {
  62. module.debug('Initializing sidebar', parameters);
  63. module.create.id();
  64. transitionEvent = module.get.transitionEvent();
  65. // cache on initialize
  66. if( ( settings.useLegacy == 'auto' && module.is.legacy() ) || settings.useLegacy === true) {
  67. settings.transition = 'overlay';
  68. settings.useLegacy = true;
  69. }
  70. if(module.is.ios()) {
  71. module.set.ios();
  72. }
  73. // avoids locking rendering if initialized in onReady
  74. if(settings.delaySetup) {
  75. requestAnimationFrame(module.setup.layout);
  76. }
  77. else {
  78. module.setup.layout();
  79. }
  80. requestAnimationFrame(function() {
  81. module.setup.cache();
  82. });
  83. module.instantiate();
  84. },
  85. instantiate: function() {
  86. module.verbose('Storing instance of module', module);
  87. instance = module;
  88. $module
  89. .data(moduleNamespace, module)
  90. ;
  91. },
  92. create: {
  93. id: function() {
  94. id = (Math.random().toString(16) + '000000000').substr(2,8);
  95. elementNamespace = '.' + id;
  96. module.verbose('Creating unique id for element', id);
  97. }
  98. },
  99. destroy: function() {
  100. module.verbose('Destroying previous module for', $module);
  101. module.remove.direction();
  102. $module
  103. .off(eventNamespace)
  104. .removeData(moduleNamespace)
  105. ;
  106. // bound by uuid
  107. $context.off(elementNamespace);
  108. $window.off(elementNamespace);
  109. $document.off(elementNamespace);
  110. },
  111. event: {
  112. clickaway: function(event) {
  113. var
  114. clickedInPusher = ($pusher.find(event.target).length > 0 || $pusher.is(event.target)),
  115. clickedContext = ($context.is(event.target))
  116. ;
  117. if(clickedInPusher) {
  118. module.verbose('User clicked on dimmed page');
  119. module.hide();
  120. }
  121. if(clickedContext) {
  122. module.verbose('User clicked on dimmable context (scaled out page)');
  123. module.hide();
  124. }
  125. },
  126. touch: function(event) {
  127. //event.stopPropagation();
  128. },
  129. containScroll: function(event) {
  130. if(element.scrollTop <= 0) {
  131. element.scrollTop = 1;
  132. }
  133. if((element.scrollTop + element.offsetHeight) >= element.scrollHeight) {
  134. element.scrollTop = element.scrollHeight - element.offsetHeight - 1;
  135. }
  136. },
  137. scroll: function(event) {
  138. if( $(event.target).closest(selector.sidebar).length === 0 ) {
  139. event.preventDefault();
  140. }
  141. }
  142. },
  143. bind: {
  144. clickaway: function() {
  145. module.verbose('Adding clickaway events to context', $context);
  146. if(settings.closable) {
  147. $context
  148. .on('click' + elementNamespace, module.event.clickaway)
  149. .on('touchend' + elementNamespace, module.event.clickaway)
  150. ;
  151. }
  152. },
  153. scrollLock: function() {
  154. if(settings.scrollLock) {
  155. module.debug('Disabling page scroll');
  156. $window
  157. .on('DOMMouseScroll' + elementNamespace, module.event.scroll)
  158. ;
  159. }
  160. module.verbose('Adding events to contain sidebar scroll');
  161. $document
  162. .on('touchmove' + elementNamespace, module.event.touch)
  163. ;
  164. $module
  165. .on('scroll' + eventNamespace, module.event.containScroll)
  166. ;
  167. }
  168. },
  169. unbind: {
  170. clickaway: function() {
  171. module.verbose('Removing clickaway events from context', $context);
  172. $context.off(elementNamespace);
  173. },
  174. scrollLock: function() {
  175. module.verbose('Removing scroll lock from page');
  176. $document.off(elementNamespace);
  177. $window.off(elementNamespace);
  178. $module.off('scroll' + eventNamespace);
  179. }
  180. },
  181. add: {
  182. bodyCSS: function() {
  183. var
  184. width = module.cache.width || $module.outerWidth(),
  185. height = module.cache.height || $module.outerHeight(),
  186. isRTL = module.is.rtl(),
  187. direction = module.get.direction(),
  188. distance = {
  189. left : width,
  190. right : -width,
  191. top : height,
  192. bottom : -height
  193. },
  194. style
  195. ;
  196. if(isRTL){
  197. module.verbose('RTL detected, flipping widths');
  198. distance.left = -width;
  199. distance.right = width;
  200. }
  201. style = '<style>';
  202. if(direction === 'left' || direction === 'right') {
  203. module.debug('Adding CSS rules for animation distance', width);
  204. style += ''
  205. + ' .ui.visible.' + direction + '.sidebar ~ .fixed,'
  206. + ' .ui.visible.' + direction + '.sidebar ~ .pusher {'
  207. + ' -webkit-transform: translate3d('+ distance[direction] + 'px, 0, 0);'
  208. + ' transform: translate3d('+ distance[direction] + 'px, 0, 0);'
  209. + ' }'
  210. ;
  211. }
  212. else if(direction === 'top' || direction == 'bottom') {
  213. style += ''
  214. + ' .ui.visible.' + direction + '.sidebar ~ .fixed,'
  215. + ' .ui.visible.' + direction + '.sidebar ~ .pusher {'
  216. + ' -webkit-transform: translate3d(0, ' + distance[direction] + 'px, 0);'
  217. + ' transform: translate3d(0, ' + distance[direction] + 'px, 0);'
  218. + ' }'
  219. ;
  220. }
  221. /* IE is only browser not to create context with transforms */
  222. /* https://www.w3.org/Bugs/Public/show_bug.cgi?id=16328 */
  223. if( module.is.ie() ) {
  224. if(direction === 'left' || direction === 'right') {
  225. module.debug('Adding CSS rules for animation distance', width);
  226. style += ''
  227. + ' body.pushable > .ui.visible.' + direction + '.sidebar ~ .pusher:after {'
  228. + ' -webkit-transform: translate3d('+ distance[direction] + 'px, 0, 0);'
  229. + ' transform: translate3d('+ distance[direction] + 'px, 0, 0);'
  230. + ' }'
  231. ;
  232. }
  233. else if(direction === 'top' || direction == 'bottom') {
  234. style += ''
  235. + ' body.pushable > .ui.visible.' + direction + '.sidebar ~ .pusher:after {'
  236. + ' -webkit-transform: translate3d(0, ' + distance[direction] + 'px, 0);'
  237. + ' transform: translate3d(0, ' + distance[direction] + 'px, 0);'
  238. + ' }'
  239. ;
  240. }
  241. /* opposite sides visible forces content overlay */
  242. style += ''
  243. + ' body.pushable > .ui.visible.left.sidebar ~ .ui.visible.right.sidebar ~ .pusher:after,'
  244. + ' body.pushable > .ui.visible.right.sidebar ~ .ui.visible.left.sidebar ~ .pusher:after {'
  245. + ' -webkit-transform: translate3d(0px, 0, 0);'
  246. + ' transform: translate3d(0px, 0, 0);'
  247. + ' }'
  248. ;
  249. }
  250. style += '</style>';
  251. $style = $(style)
  252. .appendTo($head)
  253. ;
  254. module.debug('Adding sizing css to head', $style);
  255. }
  256. },
  257. refresh: function() {
  258. module.verbose('Refreshing selector cache');
  259. $context = $(settings.context);
  260. $sidebars = $context.children(selector.sidebar);
  261. $pusher = $context.children(selector.pusher);
  262. $fixed = $context.children(selector.fixed);
  263. module.clear.cache();
  264. },
  265. refreshSidebars: function() {
  266. module.verbose('Refreshing other sidebars');
  267. $sidebars = $context.children(selector.sidebar);
  268. },
  269. repaint: function() {
  270. module.verbose('Forcing repaint event');
  271. element.style.display = 'none';
  272. var ignored = element.offsetHeight;
  273. element.scrollTop = element.scrollTop;
  274. element.style.display = '';
  275. },
  276. setup: {
  277. cache: function() {
  278. module.cache = {
  279. width : $module.outerWidth(),
  280. height : $module.outerHeight(),
  281. rtl : ($module.css('direction') == 'rtl')
  282. };
  283. },
  284. layout: function() {
  285. if( $context.children(selector.pusher).length === 0 ) {
  286. module.debug('Adding wrapper element for sidebar');
  287. module.error(error.pusher);
  288. $pusher = $('<div class="pusher" />');
  289. $context
  290. .children()
  291. .not(selector.omitted)
  292. .not($sidebars)
  293. .wrapAll($pusher)
  294. ;
  295. module.refresh();
  296. }
  297. if($module.nextAll(selector.pusher).length === 0 || $module.nextAll(selector.pusher)[0] !== $pusher[0]) {
  298. module.debug('Moved sidebar to correct parent element');
  299. module.error(error.movedSidebar, element);
  300. $module.detach().prependTo($context);
  301. module.refresh();
  302. }
  303. module.clear.cache();
  304. module.set.pushable();
  305. module.set.direction();
  306. }
  307. },
  308. attachEvents: function(selector, event) {
  309. var
  310. $toggle = $(selector)
  311. ;
  312. event = $.isFunction(module[event])
  313. ? module[event]
  314. : module.toggle
  315. ;
  316. if($toggle.length > 0) {
  317. module.debug('Attaching sidebar events to element', selector, event);
  318. $toggle
  319. .on('click' + eventNamespace, event)
  320. ;
  321. }
  322. else {
  323. module.error(error.notFound, selector);
  324. }
  325. },
  326. show: function(callback) {
  327. var
  328. animateMethod = (settings.useLegacy === true)
  329. ? module.legacyPushPage
  330. : module.pushPage
  331. ;
  332. callback = $.isFunction(callback)
  333. ? callback
  334. : function(){}
  335. ;
  336. if(module.is.hidden()) {
  337. module.refreshSidebars();
  338. if(settings.overlay) {
  339. module.error(error.overlay);
  340. settings.transition = 'overlay';
  341. }
  342. module.refresh();
  343. if(module.othersActive()) {
  344. module.debug('Other sidebars currently visible');
  345. if(settings.exclusive) {
  346. // if not overlay queue animation after hide
  347. if(settings.transition != 'overlay') {
  348. module.hideOthers(module.show);
  349. return;
  350. }
  351. else {
  352. module.hideOthers();
  353. }
  354. }
  355. else {
  356. settings.transition = 'overlay';
  357. }
  358. }
  359. animateMethod(function() {
  360. callback.call(element);
  361. settings.onShow.call(element);
  362. });
  363. settings.onChange.call(element);
  364. settings.onVisible.call(element);
  365. }
  366. else {
  367. module.debug('Sidebar is already visible');
  368. }
  369. },
  370. hide: function(callback) {
  371. var
  372. animateMethod = (settings.useLegacy === true)
  373. ? module.legacyPullPage
  374. : module.pullPage
  375. ;
  376. callback = $.isFunction(callback)
  377. ? callback
  378. : function(){}
  379. ;
  380. if(module.is.visible() || module.is.animating()) {
  381. module.debug('Hiding sidebar', callback);
  382. module.refreshSidebars();
  383. animateMethod(function() {
  384. callback.call(element);
  385. settings.onHidden.call(element);
  386. });
  387. settings.onChange.call(element);
  388. settings.onHide.call(element);
  389. }
  390. },
  391. othersAnimating: function() {
  392. return ($sidebars.not($module).filter('.' + className.animating).length > 0);
  393. },
  394. othersVisible: function() {
  395. return ($sidebars.not($module).filter('.' + className.visible).length > 0);
  396. },
  397. othersActive: function() {
  398. return(module.othersVisible() || module.othersAnimating());
  399. },
  400. hideOthers: function(callback) {
  401. var
  402. $otherSidebars = $sidebars.not($module).filter('.' + className.visible),
  403. sidebarCount = $otherSidebars.length,
  404. callbackCount = 0
  405. ;
  406. callback = callback || function(){};
  407. $otherSidebars
  408. .sidebar('hide', function() {
  409. callbackCount++;
  410. if(callbackCount == sidebarCount) {
  411. callback();
  412. }
  413. })
  414. ;
  415. },
  416. toggle: function() {
  417. module.verbose('Determining toggled direction');
  418. if(module.is.hidden()) {
  419. module.show();
  420. }
  421. else {
  422. module.hide();
  423. }
  424. },
  425. pushPage: function(callback) {
  426. var
  427. transition = module.get.transition(),
  428. $transition = (transition == 'safe')
  429. ? $context
  430. : (transition === 'overlay' || module.othersActive())
  431. ? $module
  432. : $pusher,
  433. animate,
  434. dim,
  435. transitionEnd
  436. ;
  437. callback = $.isFunction(callback)
  438. ? callback
  439. : function(){}
  440. ;
  441. if(settings.transition == 'scale down') {
  442. module.scrollToTop();
  443. }
  444. module.set.transition(transition);
  445. module.repaint();
  446. animate = function() {
  447. module.bind.clickaway();
  448. module.add.bodyCSS();
  449. module.set.animating();
  450. module.set.visible();
  451. };
  452. dim = function() {
  453. module.set.dimmed();
  454. };
  455. transitionEnd = function(event) {
  456. if( event.target == $transition[0] ) {
  457. $transition.off(transitionEvent + elementNamespace, transitionEnd);
  458. module.remove.animating();
  459. module.bind.scrollLock();
  460. callback.call(element);
  461. }
  462. };
  463. $transition.off(transitionEvent + elementNamespace);
  464. $transition.on(transitionEvent + elementNamespace, transitionEnd);
  465. requestAnimationFrame(animate);
  466. if(settings.dimPage && !module.othersVisible()) {
  467. requestAnimationFrame(dim);
  468. }
  469. },
  470. pullPage: function(callback) {
  471. var
  472. transition = module.get.transition(),
  473. $transition = (transition == 'safe')
  474. ? $context
  475. : (transition == 'overlay' || module.othersActive())
  476. ? $module
  477. : $pusher,
  478. animate,
  479. transitionEnd
  480. ;
  481. callback = $.isFunction(callback)
  482. ? callback
  483. : function(){}
  484. ;
  485. module.verbose('Removing context push state', module.get.direction());
  486. module.unbind.clickaway();
  487. module.unbind.scrollLock();
  488. animate = function() {
  489. module.set.transition(transition);
  490. module.set.animating();
  491. module.remove.visible();
  492. if(settings.dimPage && !module.othersVisible()) {
  493. $pusher.removeClass(className.dimmed);
  494. }
  495. };
  496. transitionEnd = function(event) {
  497. if( event.target == $transition[0] ) {
  498. $transition.off(transitionEvent + elementNamespace, transitionEnd);
  499. module.remove.animating();
  500. module.remove.transition();
  501. module.remove.bodyCSS();
  502. if(transition == 'scale down' || (settings.returnScroll && module.is.mobile()) ) {
  503. module.scrollBack();
  504. }
  505. callback.call(element);
  506. }
  507. };
  508. $transition.off(transitionEvent + elementNamespace);
  509. $transition.on(transitionEvent + elementNamespace, transitionEnd);
  510. requestAnimationFrame(animate);
  511. },
  512. legacyPushPage: function(callback) {
  513. var
  514. distance = $module.width(),
  515. direction = module.get.direction(),
  516. properties = {}
  517. ;
  518. distance = distance || $module.width();
  519. callback = $.isFunction(callback)
  520. ? callback
  521. : function(){}
  522. ;
  523. properties[direction] = distance;
  524. module.debug('Using javascript to push context', properties);
  525. module.set.visible();
  526. module.set.transition();
  527. module.set.animating();
  528. if(settings.dimPage) {
  529. $pusher.addClass(className.dimmed);
  530. }
  531. $context
  532. .css('position', 'relative')
  533. .animate(properties, settings.duration, settings.easing, function() {
  534. module.remove.animating();
  535. module.bind.clickaway();
  536. callback.call(element);
  537. })
  538. ;
  539. },
  540. legacyPullPage: function(callback) {
  541. var
  542. distance = 0,
  543. direction = module.get.direction(),
  544. properties = {}
  545. ;
  546. distance = distance || $module.width();
  547. callback = $.isFunction(callback)
  548. ? callback
  549. : function(){}
  550. ;
  551. properties[direction] = '0px';
  552. module.debug('Using javascript to pull context', properties);
  553. module.unbind.clickaway();
  554. module.set.animating();
  555. module.remove.visible();
  556. if(settings.dimPage && !module.othersActive()) {
  557. $pusher.removeClass(className.dimmed);
  558. }
  559. $context
  560. .css('position', 'relative')
  561. .animate(properties, settings.duration, settings.easing, function() {
  562. module.remove.animating();
  563. callback.call(element);
  564. })
  565. ;
  566. },
  567. scrollToTop: function() {
  568. module.verbose('Scrolling to top of page to avoid animation issues');
  569. currentScroll = $(window).scrollTop();
  570. $module.scrollTop(0);
  571. window.scrollTo(0, 0);
  572. },
  573. scrollBack: function() {
  574. module.verbose('Scrolling back to original page position');
  575. window.scrollTo(0, currentScroll);
  576. },
  577. clear: {
  578. cache: function() {
  579. module.verbose('Clearing cached dimensions');
  580. module.cache = {};
  581. }
  582. },
  583. set: {
  584. // html
  585. ios: function() {
  586. $html.addClass(className.ios);
  587. },
  588. // container
  589. pushed: function() {
  590. $context.addClass(className.pushed);
  591. },
  592. pushable: function() {
  593. $context.addClass(className.pushable);
  594. },
  595. // pusher
  596. dimmed: function() {
  597. $pusher.addClass(className.dimmed);
  598. },
  599. // sidebar
  600. active: function() {
  601. $module.addClass(className.active);
  602. },
  603. animating: function() {
  604. $module.addClass(className.animating);
  605. },
  606. transition: function(transition) {
  607. transition = transition || module.get.transition();
  608. $module.addClass(transition);
  609. },
  610. direction: function(direction) {
  611. direction = direction || module.get.direction();
  612. $module.addClass(className[direction]);
  613. },
  614. visible: function() {
  615. $module.addClass(className.visible);
  616. },
  617. overlay: function() {
  618. $module.addClass(className.overlay);
  619. }
  620. },
  621. remove: {
  622. bodyCSS: function() {
  623. module.debug('Removing body css styles', $style);
  624. if($style && $style.length > 0) {
  625. $style.remove();
  626. }
  627. },
  628. // context
  629. pushed: function() {
  630. $context.removeClass(className.pushed);
  631. },
  632. pushable: function() {
  633. $context.removeClass(className.pushable);
  634. },
  635. // sidebar
  636. active: function() {
  637. $module.removeClass(className.active);
  638. },
  639. animating: function() {
  640. $module.removeClass(className.animating);
  641. },
  642. transition: function(transition) {
  643. transition = transition || module.get.transition();
  644. $module.removeClass(transition);
  645. },
  646. direction: function(direction) {
  647. direction = direction || module.get.direction();
  648. $module.removeClass(className[direction]);
  649. },
  650. visible: function() {
  651. $module.removeClass(className.visible);
  652. },
  653. overlay: function() {
  654. $module.removeClass(className.overlay);
  655. }
  656. },
  657. get: {
  658. direction: function() {
  659. if($module.hasClass(className.top)) {
  660. return className.top;
  661. }
  662. else if($module.hasClass(className.right)) {
  663. return className.right;
  664. }
  665. else if($module.hasClass(className.bottom)) {
  666. return className.bottom;
  667. }
  668. return className.left;
  669. },
  670. transition: function() {
  671. var
  672. direction = module.get.direction(),
  673. transition
  674. ;
  675. transition = ( module.is.mobile() )
  676. ? (settings.mobileTransition == 'auto')
  677. ? settings.defaultTransition.mobile[direction]
  678. : settings.mobileTransition
  679. : (settings.transition == 'auto')
  680. ? settings.defaultTransition.computer[direction]
  681. : settings.transition
  682. ;
  683. module.verbose('Determined transition', transition);
  684. return transition;
  685. },
  686. transitionEvent: function() {
  687. var
  688. element = document.createElement('element'),
  689. transitions = {
  690. 'transition' :'transitionend',
  691. 'OTransition' :'oTransitionEnd',
  692. 'MozTransition' :'transitionend',
  693. 'WebkitTransition' :'webkitTransitionEnd'
  694. },
  695. transition
  696. ;
  697. for(transition in transitions){
  698. if( element.style[transition] !== undefined ){
  699. return transitions[transition];
  700. }
  701. }
  702. }
  703. },
  704. is: {
  705. ie: function() {
  706. var
  707. isIE11 = (!(window.ActiveXObject) && 'ActiveXObject' in window),
  708. isIE = ('ActiveXObject' in window)
  709. ;
  710. return (isIE11 || isIE);
  711. },
  712. legacy: function() {
  713. var
  714. element = document.createElement('div'),
  715. transforms = {
  716. 'webkitTransform' :'-webkit-transform',
  717. 'OTransform' :'-o-transform',
  718. 'msTransform' :'-ms-transform',
  719. 'MozTransform' :'-moz-transform',
  720. 'transform' :'transform'
  721. },
  722. has3D
  723. ;
  724. // Add it to the body to get the computed style.
  725. document.body.insertBefore(element, null);
  726. for (var transform in transforms) {
  727. if (element.style[transform] !== undefined) {
  728. element.style[transform] = "translate3d(1px,1px,1px)";
  729. has3D = window.getComputedStyle(element).getPropertyValue(transforms[transform]);
  730. }
  731. }
  732. document.body.removeChild(element);
  733. return !(has3D !== undefined && has3D.length > 0 && has3D !== 'none');
  734. },
  735. ios: function() {
  736. var
  737. userAgent = navigator.userAgent,
  738. isIOS = userAgent.match(regExp.ios)
  739. ;
  740. if(isIOS) {
  741. module.verbose('Browser was found to be iOS', userAgent);
  742. return true;
  743. }
  744. else {
  745. return false;
  746. }
  747. },
  748. mobile: function() {
  749. var
  750. userAgent = navigator.userAgent,
  751. isMobile = userAgent.match(regExp.mobile)
  752. ;
  753. if(isMobile) {
  754. module.verbose('Browser was found to be mobile', userAgent);
  755. return true;
  756. }
  757. else {
  758. module.verbose('Browser is not mobile, using regular transition', userAgent);
  759. return false;
  760. }
  761. },
  762. hidden: function() {
  763. return !module.is.visible();
  764. },
  765. visible: function() {
  766. return $module.hasClass(className.visible);
  767. },
  768. // alias
  769. open: function() {
  770. return module.is.visible();
  771. },
  772. closed: function() {
  773. return module.is.hidden();
  774. },
  775. vertical: function() {
  776. return $module.hasClass(className.top);
  777. },
  778. animating: function() {
  779. return $context.hasClass(className.animating);
  780. },
  781. rtl: function () {
  782. if(module.cache.rtl === undefined) {
  783. module.cache.rtl = ($module.css('direction') == 'rtl');
  784. }
  785. return module.cache.rtl;
  786. }
  787. },
  788. setting: function(name, value) {
  789. module.debug('Changing setting', name, value);
  790. if( $.isPlainObject(name) ) {
  791. $.extend(true, settings, name);
  792. }
  793. else if(value !== undefined) {
  794. settings[name] = value;
  795. }
  796. else {
  797. return settings[name];
  798. }
  799. },
  800. internal: function(name, value) {
  801. if( $.isPlainObject(name) ) {
  802. $.extend(true, module, name);
  803. }
  804. else if(value !== undefined) {
  805. module[name] = value;
  806. }
  807. else {
  808. return module[name];
  809. }
  810. },
  811. debug: function() {
  812. if(settings.debug) {
  813. if(settings.performance) {
  814. module.performance.log(arguments);
  815. }
  816. else {
  817. module.debug = Function.prototype.bind.call(console.info, console, settings.name + ':');
  818. module.debug.apply(console, arguments);
  819. }
  820. }
  821. },
  822. verbose: function() {
  823. if(settings.verbose && settings.debug) {
  824. if(settings.performance) {
  825. module.performance.log(arguments);
  826. }
  827. else {
  828. module.verbose = Function.prototype.bind.call(console.info, console, settings.name + ':');
  829. module.verbose.apply(console, arguments);
  830. }
  831. }
  832. },
  833. error: function() {
  834. module.error = Function.prototype.bind.call(console.error, console, settings.name + ':');
  835. module.error.apply(console, arguments);
  836. },
  837. performance: {
  838. log: function(message) {
  839. var
  840. currentTime,
  841. executionTime,
  842. previousTime
  843. ;
  844. if(settings.performance) {
  845. currentTime = new Date().getTime();
  846. previousTime = time || currentTime;
  847. executionTime = currentTime - previousTime;
  848. time = currentTime;
  849. performance.push({
  850. 'Name' : message[0],
  851. 'Arguments' : [].slice.call(message, 1) || '',
  852. 'Element' : element,
  853. 'Execution Time' : executionTime
  854. });
  855. }
  856. clearTimeout(module.performance.timer);
  857. module.performance.timer = setTimeout(module.performance.display, 500);
  858. },
  859. display: function() {
  860. var
  861. title = settings.name + ':',
  862. totalTime = 0
  863. ;
  864. time = false;
  865. clearTimeout(module.performance.timer);
  866. $.each(performance, function(index, data) {
  867. totalTime += data['Execution Time'];
  868. });
  869. title += ' ' + totalTime + 'ms';
  870. if(moduleSelector) {
  871. title += ' \'' + moduleSelector + '\'';
  872. }
  873. if( (console.group !== undefined || console.table !== undefined) && performance.length > 0) {
  874. console.groupCollapsed(title);
  875. if(console.table) {
  876. console.table(performance);
  877. }
  878. else {
  879. $.each(performance, function(index, data) {
  880. console.log(data['Name'] + ': ' + data['Execution Time']+'ms');
  881. });
  882. }
  883. console.groupEnd();
  884. }
  885. performance = [];
  886. }
  887. },
  888. invoke: function(query, passedArguments, context) {
  889. var
  890. object = instance,
  891. maxDepth,
  892. found,
  893. response
  894. ;
  895. passedArguments = passedArguments || queryArguments;
  896. context = element || context;
  897. if(typeof query == 'string' && object !== undefined) {
  898. query = query.split(/[\. ]/);
  899. maxDepth = query.length - 1;
  900. $.each(query, function(depth, value) {
  901. var camelCaseValue = (depth != maxDepth)
  902. ? value + query[depth + 1].charAt(0).toUpperCase() + query[depth + 1].slice(1)
  903. : query
  904. ;
  905. if( $.isPlainObject( object[camelCaseValue] ) && (depth != maxDepth) ) {
  906. object = object[camelCaseValue];
  907. }
  908. else if( object[camelCaseValue] !== undefined ) {
  909. found = object[camelCaseValue];
  910. return false;
  911. }
  912. else if( $.isPlainObject( object[value] ) && (depth != maxDepth) ) {
  913. object = object[value];
  914. }
  915. else if( object[value] !== undefined ) {
  916. found = object[value];
  917. return false;
  918. }
  919. else {
  920. module.error(error.method, query);
  921. return false;
  922. }
  923. });
  924. }
  925. if ( $.isFunction( found ) ) {
  926. response = found.apply(context, passedArguments);
  927. }
  928. else if(found !== undefined) {
  929. response = found;
  930. }
  931. if($.isArray(returnedValue)) {
  932. returnedValue.push(response);
  933. }
  934. else if(returnedValue !== undefined) {
  935. returnedValue = [returnedValue, response];
  936. }
  937. else if(response !== undefined) {
  938. returnedValue = response;
  939. }
  940. return found;
  941. }
  942. }
  943. ;
  944. if(methodInvoked) {
  945. if(instance === undefined) {
  946. module.initialize();
  947. }
  948. module.invoke(query);
  949. }
  950. else {
  951. if(instance !== undefined) {
  952. module.invoke('destroy');
  953. }
  954. module.initialize();
  955. }
  956. });
  957. return (returnedValue !== undefined)
  958. ? returnedValue
  959. : this
  960. ;
  961. };
  962. $.fn.sidebar.settings = {
  963. name : 'Sidebar',
  964. namespace : 'sidebar',
  965. debug : false,
  966. verbose : false,
  967. performance : true,
  968. transition : 'auto',
  969. mobileTransition : 'auto',
  970. defaultTransition : {
  971. computer: {
  972. left : 'uncover',
  973. right : 'uncover',
  974. top : 'overlay',
  975. bottom : 'overlay'
  976. },
  977. mobile: {
  978. left : 'uncover',
  979. right : 'uncover',
  980. top : 'overlay',
  981. bottom : 'overlay'
  982. }
  983. },
  984. context : 'body',
  985. exclusive : false,
  986. closable : true,
  987. dimPage : true,
  988. scrollLock : false,
  989. returnScroll : false,
  990. delaySetup : false,
  991. useLegacy : false,
  992. duration : 500,
  993. easing : 'easeInOutQuint',
  994. onChange : function(){},
  995. onShow : function(){},
  996. onHide : function(){},
  997. onHidden : function(){},
  998. onVisible : function(){},
  999. className : {
  1000. active : 'active',
  1001. animating : 'animating',
  1002. dimmed : 'dimmed',
  1003. ios : 'ios',
  1004. pushable : 'pushable',
  1005. pushed : 'pushed',
  1006. right : 'right',
  1007. top : 'top',
  1008. left : 'left',
  1009. bottom : 'bottom',
  1010. visible : 'visible'
  1011. },
  1012. selector: {
  1013. fixed : '.fixed',
  1014. omitted : 'script, link, style, .ui.modal, .ui.dimmer, .ui.nag, .ui.fixed',
  1015. pusher : '.pusher',
  1016. sidebar : '.ui.sidebar'
  1017. },
  1018. regExp: {
  1019. ios : /(iPad|iPhone|iPod)/g,
  1020. 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
  1021. },
  1022. error : {
  1023. method : 'The method you called is not defined.',
  1024. pusher : 'Had to add pusher element. For optimal performance make sure body content is inside a pusher element',
  1025. movedSidebar : 'Had to move sidebar. For optimal performance make sure sidebar and pusher are direct children of your body tag',
  1026. overlay : 'The overlay setting is no longer supported, use animation: overlay',
  1027. notFound : 'There were no elements that matched the specified selector'
  1028. }
  1029. };
  1030. // Adds easing
  1031. $.extend( $.easing, {
  1032. easeInOutQuint: function (x, t, b, c, d) {
  1033. if ((t/=d/2) < 1) return c/2*t*t*t*t*t + b;
  1034. return c/2*((t-=2)*t*t*t*t + 2) + b;
  1035. }
  1036. });
  1037. })( jQuery, window , document );