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.

1084 lines
34 KiB

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