transition.js 34 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942943944945946947948949950951952953954955956957958959960961962963964965966967968969970971972973974975976977978979980981982983984985986987988989990991992993994995996997998999100010011002100310041005100610071008100910101011101210131014101510161017101810191020102110221023102410251026102710281029103010311032103310341035103610371038103910401041104210431044104510461047104810491050105110521053105410551056105710581059106010611062106310641065106610671068106910701071107210731074107510761077107810791080108110821083108410851086108710881089109010911092109310941095
  1. /*!
  2. * # Semantic UI 2.4.2 - Transition
  3. * http://github.com/semantic-org/semantic-ui/
  4. *
  5. *
  6. * Released under the MIT license
  7. * http://opensource.org/licenses/MIT
  8. *
  9. */
  10. ;(function ($, window, document, undefined) {
  11. 'use strict';
  12. window = (typeof window != 'undefined' && window.Math == Math)
  13. ? window
  14. : (typeof self != 'undefined' && self.Math == Math)
  15. ? self
  16. : Function('return this')()
  17. ;
  18. $.fn.transition = function() {
  19. var
  20. $allModules = $(this),
  21. moduleSelector = $allModules.selector || '',
  22. time = new Date().getTime(),
  23. performance = [],
  24. moduleArguments = arguments,
  25. query = moduleArguments[0],
  26. queryArguments = [].slice.call(arguments, 1),
  27. methodInvoked = (typeof query === 'string'),
  28. requestAnimationFrame = window.requestAnimationFrame
  29. || window.mozRequestAnimationFrame
  30. || window.webkitRequestAnimationFrame
  31. || window.msRequestAnimationFrame
  32. || function(callback) { setTimeout(callback, 0); },
  33. returnedValue
  34. ;
  35. $allModules
  36. .each(function(index) {
  37. var
  38. $module = $(this),
  39. element = this,
  40. // set at run time
  41. settings,
  42. instance,
  43. error,
  44. className,
  45. metadata,
  46. animationEnd,
  47. animationName,
  48. namespace,
  49. moduleNamespace,
  50. eventNamespace,
  51. module
  52. ;
  53. module = {
  54. initialize: function() {
  55. // get full settings
  56. settings = module.get.settings.apply(element, moduleArguments);
  57. // shorthand
  58. className = settings.className;
  59. error = settings.error;
  60. metadata = settings.metadata;
  61. // define namespace
  62. eventNamespace = '.' + settings.namespace;
  63. moduleNamespace = 'module-' + settings.namespace;
  64. instance = $module.data(moduleNamespace) || module;
  65. // get vendor specific events
  66. animationEnd = module.get.animationEndEvent();
  67. if(methodInvoked) {
  68. methodInvoked = module.invoke(query);
  69. }
  70. // method not invoked, lets run an animation
  71. if(methodInvoked === false) {
  72. module.verbose('Converted arguments into settings object', settings);
  73. if(settings.interval) {
  74. module.delay(settings.animate);
  75. }
  76. else {
  77. module.animate();
  78. }
  79. module.instantiate();
  80. }
  81. },
  82. instantiate: function() {
  83. module.verbose('Storing instance of module', module);
  84. instance = module;
  85. $module
  86. .data(moduleNamespace, instance)
  87. ;
  88. },
  89. destroy: function() {
  90. module.verbose('Destroying previous module for', element);
  91. $module
  92. .removeData(moduleNamespace)
  93. ;
  94. },
  95. refresh: function() {
  96. module.verbose('Refreshing display type on next animation');
  97. delete module.displayType;
  98. },
  99. forceRepaint: function() {
  100. module.verbose('Forcing element repaint');
  101. var
  102. $parentElement = $module.parent(),
  103. $nextElement = $module.next()
  104. ;
  105. if($nextElement.length === 0) {
  106. $module.detach().appendTo($parentElement);
  107. }
  108. else {
  109. $module.detach().insertBefore($nextElement);
  110. }
  111. },
  112. repaint: function() {
  113. module.verbose('Repainting element');
  114. var
  115. fakeAssignment = element.offsetWidth
  116. ;
  117. },
  118. delay: function(interval) {
  119. var
  120. direction = module.get.animationDirection(),
  121. shouldReverse,
  122. delay
  123. ;
  124. if(!direction) {
  125. direction = module.can.transition()
  126. ? module.get.direction()
  127. : 'static'
  128. ;
  129. }
  130. interval = (interval !== undefined)
  131. ? interval
  132. : settings.interval
  133. ;
  134. shouldReverse = (settings.reverse == 'auto' && direction == className.outward);
  135. delay = (shouldReverse || settings.reverse == true)
  136. ? ($allModules.length - index) * settings.interval
  137. : index * settings.interval
  138. ;
  139. module.debug('Delaying animation by', delay);
  140. setTimeout(module.animate, delay);
  141. },
  142. animate: function(overrideSettings) {
  143. settings = overrideSettings || settings;
  144. if(!module.is.supported()) {
  145. module.error(error.support);
  146. return false;
  147. }
  148. module.debug('Preparing animation', settings.animation);
  149. if(module.is.animating()) {
  150. if(settings.queue) {
  151. if(!settings.allowRepeats && module.has.direction() && module.is.occurring() && module.queuing !== true) {
  152. module.debug('Animation is currently occurring, preventing queueing same animation', settings.animation);
  153. }
  154. else {
  155. module.queue(settings.animation);
  156. }
  157. return false;
  158. }
  159. else if(!settings.allowRepeats && module.is.occurring()) {
  160. module.debug('Animation is already occurring, will not execute repeated animation', settings.animation);
  161. return false;
  162. }
  163. else {
  164. module.debug('New animation started, completing previous early', settings.animation);
  165. instance.complete();
  166. }
  167. }
  168. if( module.can.animate() ) {
  169. module.set.animating(settings.animation);
  170. }
  171. else {
  172. module.error(error.noAnimation, settings.animation, element);
  173. }
  174. },
  175. reset: function() {
  176. module.debug('Resetting animation to beginning conditions');
  177. module.remove.animationCallbacks();
  178. module.restore.conditions();
  179. module.remove.animating();
  180. },
  181. queue: function(animation) {
  182. module.debug('Queueing animation of', animation);
  183. module.queuing = true;
  184. $module
  185. .one(animationEnd + '.queue' + eventNamespace, function() {
  186. module.queuing = false;
  187. module.repaint();
  188. module.animate.apply(this, settings);
  189. })
  190. ;
  191. },
  192. complete: function (event) {
  193. module.debug('Animation complete', settings.animation);
  194. module.remove.completeCallback();
  195. module.remove.failSafe();
  196. if(!module.is.looping()) {
  197. if( module.is.outward() ) {
  198. module.verbose('Animation is outward, hiding element');
  199. module.restore.conditions();
  200. module.hide();
  201. }
  202. else if( module.is.inward() ) {
  203. module.verbose('Animation is outward, showing element');
  204. module.restore.conditions();
  205. module.show();
  206. }
  207. else {
  208. module.verbose('Static animation completed');
  209. module.restore.conditions();
  210. settings.onComplete.call(element);
  211. }
  212. }
  213. },
  214. force: {
  215. visible: function() {
  216. var
  217. style = $module.attr('style'),
  218. userStyle = module.get.userStyle(),
  219. displayType = module.get.displayType(),
  220. overrideStyle = userStyle + 'display: ' + displayType + ' !important;',
  221. currentDisplay = $module.css('display'),
  222. emptyStyle = (style === undefined || style === '')
  223. ;
  224. if(currentDisplay !== displayType) {
  225. module.verbose('Overriding default display to show element', displayType);
  226. $module
  227. .attr('style', overrideStyle)
  228. ;
  229. }
  230. else if(emptyStyle) {
  231. $module.removeAttr('style');
  232. }
  233. },
  234. hidden: function() {
  235. var
  236. style = $module.attr('style'),
  237. currentDisplay = $module.css('display'),
  238. emptyStyle = (style === undefined || style === '')
  239. ;
  240. if(currentDisplay !== 'none' && !module.is.hidden()) {
  241. module.verbose('Overriding default display to hide element');
  242. $module
  243. .css('display', 'none')
  244. ;
  245. }
  246. else if(emptyStyle) {
  247. $module
  248. .removeAttr('style')
  249. ;
  250. }
  251. }
  252. },
  253. has: {
  254. direction: function(animation) {
  255. var
  256. hasDirection = false
  257. ;
  258. animation = animation || settings.animation;
  259. if(typeof animation === 'string') {
  260. animation = animation.split(' ');
  261. $.each(animation, function(index, word){
  262. if(word === className.inward || word === className.outward) {
  263. hasDirection = true;
  264. }
  265. });
  266. }
  267. return hasDirection;
  268. },
  269. inlineDisplay: function() {
  270. var
  271. style = $module.attr('style') || ''
  272. ;
  273. return $.isArray(style.match(/display.*?;/, ''));
  274. }
  275. },
  276. set: {
  277. animating: function(animation) {
  278. var
  279. animationClass,
  280. direction
  281. ;
  282. // remove previous callbacks
  283. module.remove.completeCallback();
  284. // determine exact animation
  285. animation = animation || settings.animation;
  286. animationClass = module.get.animationClass(animation);
  287. // save animation class in cache to restore class names
  288. module.save.animation(animationClass);
  289. // override display if necessary so animation appears visibly
  290. module.force.visible();
  291. module.remove.hidden();
  292. module.remove.direction();
  293. module.start.animation(animationClass);
  294. },
  295. duration: function(animationName, duration) {
  296. duration = duration || settings.duration;
  297. duration = (typeof duration == 'number')
  298. ? duration + 'ms'
  299. : duration
  300. ;
  301. if(duration || duration === 0) {
  302. module.verbose('Setting animation duration', duration);
  303. $module
  304. .css({
  305. 'animation-duration': duration
  306. })
  307. ;
  308. }
  309. },
  310. direction: function(direction) {
  311. direction = direction || module.get.direction();
  312. if(direction == className.inward) {
  313. module.set.inward();
  314. }
  315. else {
  316. module.set.outward();
  317. }
  318. },
  319. looping: function() {
  320. module.debug('Transition set to loop');
  321. $module
  322. .addClass(className.looping)
  323. ;
  324. },
  325. hidden: function() {
  326. $module
  327. .addClass(className.transition)
  328. .addClass(className.hidden)
  329. ;
  330. },
  331. inward: function() {
  332. module.debug('Setting direction to inward');
  333. $module
  334. .removeClass(className.outward)
  335. .addClass(className.inward)
  336. ;
  337. },
  338. outward: function() {
  339. module.debug('Setting direction to outward');
  340. $module
  341. .removeClass(className.inward)
  342. .addClass(className.outward)
  343. ;
  344. },
  345. visible: function() {
  346. $module
  347. .addClass(className.transition)
  348. .addClass(className.visible)
  349. ;
  350. }
  351. },
  352. start: {
  353. animation: function(animationClass) {
  354. animationClass = animationClass || module.get.animationClass();
  355. module.debug('Starting tween', animationClass);
  356. $module
  357. .addClass(animationClass)
  358. .one(animationEnd + '.complete' + eventNamespace, module.complete)
  359. ;
  360. if(settings.useFailSafe) {
  361. module.add.failSafe();
  362. }
  363. module.set.duration(settings.duration);
  364. settings.onStart.call(element);
  365. }
  366. },
  367. save: {
  368. animation: function(animation) {
  369. if(!module.cache) {
  370. module.cache = {};
  371. }
  372. module.cache.animation = animation;
  373. },
  374. displayType: function(displayType) {
  375. if(displayType !== 'none') {
  376. $module.data(metadata.displayType, displayType);
  377. }
  378. },
  379. transitionExists: function(animation, exists) {
  380. $.fn.transition.exists[animation] = exists;
  381. module.verbose('Saving existence of transition', animation, exists);
  382. }
  383. },
  384. restore: {
  385. conditions: function() {
  386. var
  387. animation = module.get.currentAnimation()
  388. ;
  389. if(animation) {
  390. $module
  391. .removeClass(animation)
  392. ;
  393. module.verbose('Removing animation class', module.cache);
  394. }
  395. module.remove.duration();
  396. }
  397. },
  398. add: {
  399. failSafe: function() {
  400. var
  401. duration = module.get.duration()
  402. ;
  403. module.timer = setTimeout(function() {
  404. $module.triggerHandler(animationEnd);
  405. }, duration + settings.failSafeDelay);
  406. module.verbose('Adding fail safe timer', module.timer);
  407. }
  408. },
  409. remove: {
  410. animating: function() {
  411. $module.removeClass(className.animating);
  412. },
  413. animationCallbacks: function() {
  414. module.remove.queueCallback();
  415. module.remove.completeCallback();
  416. },
  417. queueCallback: function() {
  418. $module.off('.queue' + eventNamespace);
  419. },
  420. completeCallback: function() {
  421. $module.off('.complete' + eventNamespace);
  422. },
  423. display: function() {
  424. $module.css('display', '');
  425. },
  426. direction: function() {
  427. $module
  428. .removeClass(className.inward)
  429. .removeClass(className.outward)
  430. ;
  431. },
  432. duration: function() {
  433. $module
  434. .css('animation-duration', '')
  435. ;
  436. },
  437. failSafe: function() {
  438. module.verbose('Removing fail safe timer', module.timer);
  439. if(module.timer) {
  440. clearTimeout(module.timer);
  441. }
  442. },
  443. hidden: function() {
  444. $module.removeClass(className.hidden);
  445. },
  446. visible: function() {
  447. $module.removeClass(className.visible);
  448. },
  449. looping: function() {
  450. module.debug('Transitions are no longer looping');
  451. if( module.is.looping() ) {
  452. module.reset();
  453. $module
  454. .removeClass(className.looping)
  455. ;
  456. }
  457. },
  458. transition: function() {
  459. $module
  460. .removeClass(className.visible)
  461. .removeClass(className.hidden)
  462. ;
  463. }
  464. },
  465. get: {
  466. settings: function(animation, duration, onComplete) {
  467. // single settings object
  468. if(typeof animation == 'object') {
  469. return $.extend(true, {}, $.fn.transition.settings, animation);
  470. }
  471. // all arguments provided
  472. else if(typeof onComplete == 'function') {
  473. return $.extend({}, $.fn.transition.settings, {
  474. animation : animation,
  475. onComplete : onComplete,
  476. duration : duration
  477. });
  478. }
  479. // only duration provided
  480. else if(typeof duration == 'string' || typeof duration == 'number') {
  481. return $.extend({}, $.fn.transition.settings, {
  482. animation : animation,
  483. duration : duration
  484. });
  485. }
  486. // duration is actually settings object
  487. else if(typeof duration == 'object') {
  488. return $.extend({}, $.fn.transition.settings, duration, {
  489. animation : animation
  490. });
  491. }
  492. // duration is actually callback
  493. else if(typeof duration == 'function') {
  494. return $.extend({}, $.fn.transition.settings, {
  495. animation : animation,
  496. onComplete : duration
  497. });
  498. }
  499. // only animation provided
  500. else {
  501. return $.extend({}, $.fn.transition.settings, {
  502. animation : animation
  503. });
  504. }
  505. },
  506. animationClass: function(animation) {
  507. var
  508. animationClass = animation || settings.animation,
  509. directionClass = (module.can.transition() && !module.has.direction())
  510. ? module.get.direction() + ' '
  511. : ''
  512. ;
  513. return className.animating + ' '
  514. + className.transition + ' '
  515. + directionClass
  516. + animationClass
  517. ;
  518. },
  519. currentAnimation: function() {
  520. return (module.cache && module.cache.animation !== undefined)
  521. ? module.cache.animation
  522. : false
  523. ;
  524. },
  525. currentDirection: function() {
  526. return module.is.inward()
  527. ? className.inward
  528. : className.outward
  529. ;
  530. },
  531. direction: function() {
  532. return module.is.hidden() || !module.is.visible()
  533. ? className.inward
  534. : className.outward
  535. ;
  536. },
  537. animationDirection: function(animation) {
  538. var
  539. direction
  540. ;
  541. animation = animation || settings.animation;
  542. if(typeof animation === 'string') {
  543. animation = animation.split(' ');
  544. // search animation name for out/in class
  545. $.each(animation, function(index, word){
  546. if(word === className.inward) {
  547. direction = className.inward;
  548. }
  549. else if(word === className.outward) {
  550. direction = className.outward;
  551. }
  552. });
  553. }
  554. // return found direction
  555. if(direction) {
  556. return direction;
  557. }
  558. return false;
  559. },
  560. duration: function(duration) {
  561. duration = duration || settings.duration;
  562. if(duration === false) {
  563. duration = $module.css('animation-duration') || 0;
  564. }
  565. return (typeof duration === 'string')
  566. ? (duration.indexOf('ms') > -1)
  567. ? parseFloat(duration)
  568. : parseFloat(duration) * 1000
  569. : duration
  570. ;
  571. },
  572. displayType: function(shouldDetermine) {
  573. shouldDetermine = (shouldDetermine !== undefined)
  574. ? shouldDetermine
  575. : true
  576. ;
  577. if(settings.displayType) {
  578. return settings.displayType;
  579. }
  580. if(shouldDetermine && $module.data(metadata.displayType) === undefined) {
  581. // create fake element to determine display state
  582. module.can.transition(true);
  583. }
  584. return $module.data(metadata.displayType);
  585. },
  586. userStyle: function(style) {
  587. style = style || $module.attr('style') || '';
  588. return style.replace(/display.*?;/, '');
  589. },
  590. transitionExists: function(animation) {
  591. return $.fn.transition.exists[animation];
  592. },
  593. animationStartEvent: function() {
  594. var
  595. element = document.createElement('div'),
  596. animations = {
  597. 'animation' :'animationstart',
  598. 'OAnimation' :'oAnimationStart',
  599. 'MozAnimation' :'mozAnimationStart',
  600. 'WebkitAnimation' :'webkitAnimationStart'
  601. },
  602. animation
  603. ;
  604. for(animation in animations){
  605. if( element.style[animation] !== undefined ){
  606. return animations[animation];
  607. }
  608. }
  609. return false;
  610. },
  611. animationEndEvent: function() {
  612. var
  613. element = document.createElement('div'),
  614. animations = {
  615. 'animation' :'animationend',
  616. 'OAnimation' :'oAnimationEnd',
  617. 'MozAnimation' :'mozAnimationEnd',
  618. 'WebkitAnimation' :'webkitAnimationEnd'
  619. },
  620. animation
  621. ;
  622. for(animation in animations){
  623. if( element.style[animation] !== undefined ){
  624. return animations[animation];
  625. }
  626. }
  627. return false;
  628. }
  629. },
  630. can: {
  631. transition: function(forced) {
  632. var
  633. animation = settings.animation,
  634. transitionExists = module.get.transitionExists(animation),
  635. displayType = module.get.displayType(false),
  636. elementClass,
  637. tagName,
  638. $clone,
  639. currentAnimation,
  640. inAnimation,
  641. directionExists
  642. ;
  643. if( transitionExists === undefined || forced) {
  644. module.verbose('Determining whether animation exists');
  645. elementClass = $module.attr('class');
  646. tagName = $module.prop('tagName');
  647. $clone = $('<' + tagName + ' />').addClass( elementClass ).insertAfter($module);
  648. currentAnimation = $clone
  649. .addClass(animation)
  650. .removeClass(className.inward)
  651. .removeClass(className.outward)
  652. .addClass(className.animating)
  653. .addClass(className.transition)
  654. .css('animationName')
  655. ;
  656. inAnimation = $clone
  657. .addClass(className.inward)
  658. .css('animationName')
  659. ;
  660. if(!displayType) {
  661. displayType = $clone
  662. .attr('class', elementClass)
  663. .removeAttr('style')
  664. .removeClass(className.hidden)
  665. .removeClass(className.visible)
  666. .show()
  667. .css('display')
  668. ;
  669. module.verbose('Determining final display state', displayType);
  670. module.save.displayType(displayType);
  671. }
  672. $clone.remove();
  673. if(currentAnimation != inAnimation) {
  674. module.debug('Direction exists for animation', animation);
  675. directionExists = true;
  676. }
  677. else if(currentAnimation == 'none' || !currentAnimation) {
  678. module.debug('No animation defined in css', animation);
  679. return;
  680. }
  681. else {
  682. module.debug('Static animation found', animation, displayType);
  683. directionExists = false;
  684. }
  685. module.save.transitionExists(animation, directionExists);
  686. }
  687. return (transitionExists !== undefined)
  688. ? transitionExists
  689. : directionExists
  690. ;
  691. },
  692. animate: function() {
  693. // can transition does not return a value if animation does not exist
  694. return (module.can.transition() !== undefined);
  695. }
  696. },
  697. is: {
  698. animating: function() {
  699. return $module.hasClass(className.animating);
  700. },
  701. inward: function() {
  702. return $module.hasClass(className.inward);
  703. },
  704. outward: function() {
  705. return $module.hasClass(className.outward);
  706. },
  707. looping: function() {
  708. return $module.hasClass(className.looping);
  709. },
  710. occurring: function(animation) {
  711. animation = animation || settings.animation;
  712. animation = '.' + animation.replace(' ', '.');
  713. return ( $module.filter(animation).length > 0 );
  714. },
  715. visible: function() {
  716. return $module.is(':visible');
  717. },
  718. hidden: function() {
  719. return $module.css('visibility') === 'hidden';
  720. },
  721. supported: function() {
  722. return(animationEnd !== false);
  723. }
  724. },
  725. hide: function() {
  726. module.verbose('Hiding element');
  727. if( module.is.animating() ) {
  728. module.reset();
  729. }
  730. element.blur(); // IE will trigger focus change if element is not blurred before hiding
  731. module.remove.display();
  732. module.remove.visible();
  733. module.set.hidden();
  734. module.force.hidden();
  735. settings.onHide.call(element);
  736. settings.onComplete.call(element);
  737. // module.repaint();
  738. },
  739. show: function(display) {
  740. module.verbose('Showing element', display);
  741. module.remove.hidden();
  742. module.set.visible();
  743. module.force.visible();
  744. settings.onShow.call(element);
  745. settings.onComplete.call(element);
  746. // module.repaint();
  747. },
  748. toggle: function() {
  749. if( module.is.visible() ) {
  750. module.hide();
  751. }
  752. else {
  753. module.show();
  754. }
  755. },
  756. stop: function() {
  757. module.debug('Stopping current animation');
  758. $module.triggerHandler(animationEnd);
  759. },
  760. stopAll: function() {
  761. module.debug('Stopping all animation');
  762. module.remove.queueCallback();
  763. $module.triggerHandler(animationEnd);
  764. },
  765. clear: {
  766. queue: function() {
  767. module.debug('Clearing animation queue');
  768. module.remove.queueCallback();
  769. }
  770. },
  771. enable: function() {
  772. module.verbose('Starting animation');
  773. $module.removeClass(className.disabled);
  774. },
  775. disable: function() {
  776. module.debug('Stopping animation');
  777. $module.addClass(className.disabled);
  778. },
  779. setting: function(name, value) {
  780. module.debug('Changing setting', name, value);
  781. if( $.isPlainObject(name) ) {
  782. $.extend(true, settings, name);
  783. }
  784. else if(value !== undefined) {
  785. if($.isPlainObject(settings[name])) {
  786. $.extend(true, settings[name], value);
  787. }
  788. else {
  789. settings[name] = value;
  790. }
  791. }
  792. else {
  793. return settings[name];
  794. }
  795. },
  796. internal: function(name, value) {
  797. if( $.isPlainObject(name) ) {
  798. $.extend(true, module, name);
  799. }
  800. else if(value !== undefined) {
  801. module[name] = value;
  802. }
  803. else {
  804. return module[name];
  805. }
  806. },
  807. debug: function() {
  808. if(!settings.silent && settings.debug) {
  809. if(settings.performance) {
  810. module.performance.log(arguments);
  811. }
  812. else {
  813. module.debug = Function.prototype.bind.call(console.info, console, settings.name + ':');
  814. module.debug.apply(console, arguments);
  815. }
  816. }
  817. },
  818. verbose: function() {
  819. if(!settings.silent && settings.verbose && settings.debug) {
  820. if(settings.performance) {
  821. module.performance.log(arguments);
  822. }
  823. else {
  824. module.verbose = Function.prototype.bind.call(console.info, console, settings.name + ':');
  825. module.verbose.apply(console, arguments);
  826. }
  827. }
  828. },
  829. error: function() {
  830. if(!settings.silent) {
  831. module.error = Function.prototype.bind.call(console.error, console, settings.name + ':');
  832. module.error.apply(console, arguments);
  833. }
  834. },
  835. performance: {
  836. log: function(message) {
  837. var
  838. currentTime,
  839. executionTime,
  840. previousTime
  841. ;
  842. if(settings.performance) {
  843. currentTime = new Date().getTime();
  844. previousTime = time || currentTime;
  845. executionTime = currentTime - previousTime;
  846. time = currentTime;
  847. performance.push({
  848. 'Name' : message[0],
  849. 'Arguments' : [].slice.call(message, 1) || '',
  850. 'Element' : element,
  851. 'Execution Time' : executionTime
  852. });
  853. }
  854. clearTimeout(module.performance.timer);
  855. module.performance.timer = setTimeout(module.performance.display, 500);
  856. },
  857. display: function() {
  858. var
  859. title = settings.name + ':',
  860. totalTime = 0
  861. ;
  862. time = false;
  863. clearTimeout(module.performance.timer);
  864. $.each(performance, function(index, data) {
  865. totalTime += data['Execution Time'];
  866. });
  867. title += ' ' + totalTime + 'ms';
  868. if(moduleSelector) {
  869. title += ' \'' + moduleSelector + '\'';
  870. }
  871. if($allModules.length > 1) {
  872. title += ' ' + '(' + $allModules.length + ')';
  873. }
  874. if( (console.group !== undefined || console.table !== undefined) && performance.length > 0) {
  875. console.groupCollapsed(title);
  876. if(console.table) {
  877. console.table(performance);
  878. }
  879. else {
  880. $.each(performance, function(index, data) {
  881. console.log(data['Name'] + ': ' + data['Execution Time']+'ms');
  882. });
  883. }
  884. console.groupEnd();
  885. }
  886. performance = [];
  887. }
  888. },
  889. // modified for transition to return invoke success
  890. invoke: function(query, passedArguments, context) {
  891. var
  892. object = instance,
  893. maxDepth,
  894. found,
  895. response
  896. ;
  897. passedArguments = passedArguments || queryArguments;
  898. context = element || context;
  899. if(typeof query == 'string' && object !== undefined) {
  900. query = query.split(/[\. ]/);
  901. maxDepth = query.length - 1;
  902. $.each(query, function(depth, value) {
  903. var camelCaseValue = (depth != maxDepth)
  904. ? value + query[depth + 1].charAt(0).toUpperCase() + query[depth + 1].slice(1)
  905. : query
  906. ;
  907. if( $.isPlainObject( object[camelCaseValue] ) && (depth != maxDepth) ) {
  908. object = object[camelCaseValue];
  909. }
  910. else if( object[camelCaseValue] !== undefined ) {
  911. found = object[camelCaseValue];
  912. return false;
  913. }
  914. else if( $.isPlainObject( object[value] ) && (depth != maxDepth) ) {
  915. object = object[value];
  916. }
  917. else if( object[value] !== undefined ) {
  918. found = object[value];
  919. return false;
  920. }
  921. else {
  922. return false;
  923. }
  924. });
  925. }
  926. if ( $.isFunction( found ) ) {
  927. response = found.apply(context, passedArguments);
  928. }
  929. else if(found !== undefined) {
  930. response = found;
  931. }
  932. if($.isArray(returnedValue)) {
  933. returnedValue.push(response);
  934. }
  935. else if(returnedValue !== undefined) {
  936. returnedValue = [returnedValue, response];
  937. }
  938. else if(response !== undefined) {
  939. returnedValue = response;
  940. }
  941. return (found !== undefined)
  942. ? found
  943. : false
  944. ;
  945. }
  946. };
  947. module.initialize();
  948. })
  949. ;
  950. return (returnedValue !== undefined)
  951. ? returnedValue
  952. : this
  953. ;
  954. };
  955. // Records if CSS transition is available
  956. $.fn.transition.exists = {};
  957. $.fn.transition.settings = {
  958. // module info
  959. name : 'Transition',
  960. // hide all output from this component regardless of other settings
  961. silent : false,
  962. // debug content outputted to console
  963. debug : false,
  964. // verbose debug output
  965. verbose : false,
  966. // performance data output
  967. performance : true,
  968. // event namespace
  969. namespace : 'transition',
  970. // delay between animations in group
  971. interval : 0,
  972. // whether group animations should be reversed
  973. reverse : 'auto',
  974. // animation callback event
  975. onStart : function() {},
  976. onComplete : function() {},
  977. onShow : function() {},
  978. onHide : function() {},
  979. // whether timeout should be used to ensure callback fires in cases animationend does not
  980. useFailSafe : true,
  981. // delay in ms for fail safe
  982. failSafeDelay : 100,
  983. // whether EXACT animation can occur twice in a row
  984. allowRepeats : false,
  985. // Override final display type on visible
  986. displayType : false,
  987. // animation duration
  988. animation : 'fade',
  989. duration : false,
  990. // new animations will occur after previous ones
  991. queue : true,
  992. metadata : {
  993. displayType: 'display'
  994. },
  995. className : {
  996. animating : 'animating',
  997. disabled : 'disabled',
  998. hidden : 'hidden',
  999. inward : 'in',
  1000. loading : 'loading',
  1001. looping : 'looping',
  1002. outward : 'out',
  1003. transition : 'transition',
  1004. visible : 'visible'
  1005. },
  1006. // possible errors
  1007. error: {
  1008. noAnimation : 'Element is no longer attached to DOM. Unable to animate. Use silent setting to surpress this warning in production.',
  1009. repeated : 'That animation is already occurring, cancelling repeated animation',
  1010. method : 'The method you called is not defined',
  1011. support : 'This browser does not support CSS animations'
  1012. }
  1013. };
  1014. })( jQuery, window, document );