BoxRefresh.js 3.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119
  1. /* BoxRefresh()
  2. * =========
  3. * Adds AJAX content control to a box.
  4. *
  5. * @Usage: $('#my-box').boxRefresh(options)
  6. * or add [data-widget="box-refresh"] to the box element
  7. * Pass any option as data-option="value"
  8. */
  9. +function ($) {
  10. 'use strict';
  11. var DataKey = 'lte.boxrefresh';
  12. var Default = {
  13. source : '',
  14. params : {},
  15. trigger : '.refresh-btn',
  16. content : '.box-body',
  17. loadInContent : true,
  18. responseType : '',
  19. overlayTemplate: '<div class="overlay"><div class="fa fa-refresh fa-spin"></div></div>',
  20. onLoadStart : function () {
  21. },
  22. onLoadDone : function (response) {
  23. return response;
  24. }
  25. };
  26. var Selector = {
  27. data: '[data-widget="box-refresh"]'
  28. };
  29. // BoxRefresh Class Definition
  30. // =========================
  31. var BoxRefresh = function (element, options) {
  32. this.element = element;
  33. this.options = options;
  34. this.$overlay = $(options.overlayTemplate);
  35. if (options.source === '') {
  36. throw new Error('Source url was not defined. Please specify a url in your BoxRefresh source option.');
  37. }
  38. this._setUpListeners();
  39. this.load();
  40. };
  41. BoxRefresh.prototype.load = function () {
  42. this._addOverlay();
  43. this.options.onLoadStart.call($(this));
  44. $.get(this.options.source, this.options.params, function (response) {
  45. if (this.options.loadInContent) {
  46. $(this.element).find(this.options.content).html(response);
  47. }
  48. this.options.onLoadDone.call($(this), response);
  49. this._removeOverlay();
  50. }.bind(this), this.options.responseType !== '' && this.options.responseType);
  51. };
  52. // Private
  53. BoxRefresh.prototype._setUpListeners = function () {
  54. $(this.element).on('click', this.options.trigger, function (event) {
  55. if (event) event.preventDefault();
  56. this.load();
  57. }.bind(this));
  58. };
  59. BoxRefresh.prototype._addOverlay = function () {
  60. $(this.element).append(this.$overlay);
  61. };
  62. BoxRefresh.prototype._removeOverlay = function () {
  63. $(this.$overlay).remove();
  64. };
  65. // Plugin Definition
  66. // =================
  67. function Plugin(option) {
  68. return this.each(function () {
  69. var $this = $(this);
  70. var data = $this.data(DataKey);
  71. if (!data) {
  72. var options = $.extend({}, Default, $this.data(), typeof option == 'object' && option);
  73. $this.data(DataKey, (data = new BoxRefresh($this, options)));
  74. }
  75. if (typeof data == 'string') {
  76. if (typeof data[option] == 'undefined') {
  77. throw new Error('No method named ' + option);
  78. }
  79. data[option]();
  80. }
  81. });
  82. }
  83. var old = $.fn.boxRefresh;
  84. $.fn.boxRefresh = Plugin;
  85. $.fn.boxRefresh.Constructor = BoxRefresh;
  86. // No Conflict Mode
  87. // ================
  88. $.fn.boxRefresh.noConflict = function () {
  89. $.fn.boxRefresh = old;
  90. return this;
  91. };
  92. // BoxRefresh Data API
  93. // =================
  94. $(window).on('load', function () {
  95. $(Selector.data).each(function () {
  96. Plugin.call($(this));
  97. });
  98. });
  99. }(jQuery);