loader.js 3.9 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168
  1. /*
  2. * Fuel UX Loader
  3. * https://github.com/ExactTarget/fuelux
  4. *
  5. * Copyright (c) 2014 ExactTarget
  6. * Licensed under the BSD New license.
  7. */
  8. // -- BEGIN UMD WRAPPER PREFACE --
  9. // For more information on UMD visit:
  10. // https://github.com/umdjs/umd/blob/master/jqueryPlugin.js
  11. (function (factory) {
  12. if (typeof define === 'function' && define.amd) {
  13. // if AMD loader is available, register as an anonymous module.
  14. define(['jquery'], factory);
  15. } else {
  16. // OR use browser globals if AMD is not present
  17. factory(jQuery);
  18. }
  19. }(function ($) {
  20. // -- END UMD WRAPPER PREFACE --
  21. // -- BEGIN MODULE CODE HERE --
  22. var old = $.fn.loader;
  23. // LOADER CONSTRUCTOR AND PROTOTYPE
  24. var Loader = function (element, options) {
  25. this.$element = $(element);
  26. this.options = $.extend({}, $.fn.loader.defaults, options);
  27. this.begin = (this.$element.is('[data-begin]')) ? parseInt(this.$element.attr('data-begin'), 10) : 1;
  28. this.delay = (this.$element.is('[data-delay]')) ? parseFloat(this.$element.attr('data-delay')) : 150;
  29. this.end = (this.$element.is('[data-end]')) ? parseInt(this.$element.attr('data-end'), 10) : 8;
  30. this.frame = (this.$element.is('[data-frame]')) ? parseInt(this.$element.attr('data-frame'), 10) : this.begin;
  31. this.isIElt9 = false;
  32. this.timeout = {};
  33. var ieVer = this.msieVersion();
  34. if (ieVer !== false && ieVer < 9) {
  35. this.$element.addClass('iefix');
  36. this.isIElt9 = true;
  37. }
  38. this.$element.attr('data-frame', this.frame + '');
  39. this.play();
  40. };
  41. Loader.prototype = {
  42. constructor: Loader,
  43. destroy: function () {
  44. this.$element.remove();
  45. // any external bindings
  46. // [none]
  47. // empty elements to return to original markup
  48. // [none]
  49. // returns string of markup
  50. return this.$element[0].outerHTML;
  51. },
  52. ieRepaint: function () {
  53. if (this.isIElt9) {
  54. this.$element.addClass('iefix_repaint').removeClass('iefix_repaint');
  55. }
  56. },
  57. msieVersion: function () {
  58. var ua = window.navigator.userAgent;
  59. var msie = ua.indexOf('MSIE ');
  60. if (msie > 0) {
  61. return parseInt(ua.substring(msie + 5, ua.indexOf(".", msie)), 10);
  62. } else {
  63. return false;
  64. }
  65. },
  66. next: function () {
  67. this.frame++;
  68. if (this.frame > this.end) {
  69. this.frame = this.begin;
  70. }
  71. this.$element.attr('data-frame', this.frame + '');
  72. this.ieRepaint();
  73. },
  74. pause: function () {
  75. clearTimeout(this.timeout);
  76. },
  77. play: function () {
  78. var self = this;
  79. clearTimeout(this.timeout);
  80. this.timeout = setTimeout(function () {
  81. self.next();
  82. self.play();
  83. }, this.delay);
  84. },
  85. previous: function () {
  86. this.frame--;
  87. if (this.frame < this.begin) {
  88. this.frame = this.end;
  89. }
  90. this.$element.attr('data-frame', this.frame + '');
  91. this.ieRepaint();
  92. },
  93. reset: function () {
  94. this.frame = this.begin;
  95. this.$element.attr('data-frame', this.frame + '');
  96. this.ieRepaint();
  97. }
  98. };
  99. // LOADER PLUGIN DEFINITION
  100. $.fn.loader = function (option) {
  101. var args = Array.prototype.slice.call(arguments, 1);
  102. var methodReturn;
  103. var $set = this.each(function () {
  104. var $this = $(this);
  105. var data = $this.data('fu.loader');
  106. var options = typeof option === 'object' && option;
  107. if (!data) {
  108. $this.data('fu.loader', (data = new Loader(this, options)));
  109. }
  110. if (typeof option === 'string') {
  111. methodReturn = data[option].apply(data, args);
  112. }
  113. });
  114. return (methodReturn === undefined) ? $set : methodReturn;
  115. };
  116. $.fn.loader.defaults = {};
  117. $.fn.loader.Constructor = Loader;
  118. $.fn.loader.noConflict = function () {
  119. $.fn.loader = old;
  120. return this;
  121. };
  122. // INIT LOADER ON DOMCONTENTLOADED
  123. $(function () {
  124. $('[data-initialize=loader]').each(function () {
  125. var $this = $(this);
  126. if (!$this.data('fu.loader')) {
  127. $this.loader($this.data());
  128. }
  129. });
  130. });
  131. // -- BEGIN UMD WRAPPER AFTERWORD --
  132. }));
  133. // -- END UMD WRAPPER AFTERWORD --