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.

1067 lines
34 KiB

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