Dcat.js 3.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169
  1. let $ = jQuery,
  2. pjaxResponded = false,
  3. bootingCallbacks = [],
  4. defaultOptions = {
  5. pjax_container_selector: '#pjax-container',
  6. };
  7. export default class Dcat {
  8. constructor(config) {
  9. this.withConfig(config);
  10. }
  11. /**
  12. * 初始化事件监听方法
  13. *
  14. * @param callback
  15. * @param once
  16. * @returns {Dcat}
  17. */
  18. booting(callback, once) {
  19. once = once === undefined ? true : once;
  20. bootingCallbacks.push([callback, once]);
  21. return this
  22. }
  23. /**
  24. * 初始化事件监听方法,每个请求都会触发
  25. *
  26. * @param callback
  27. * @returns {Dcat}
  28. */
  29. bootingEveryRequest(callback) {
  30. return this.booting(callback, false)
  31. }
  32. /**
  33. * 初始化
  34. */
  35. boot() {
  36. let _this = this,
  37. callbacks = bootingCallbacks;
  38. bootingCallbacks = [];
  39. callbacks.forEach(data => {
  40. data[0](this);
  41. if (data[1] === false) {
  42. bootingCallbacks.push(data)
  43. }
  44. });
  45. // 脚本加载完毕后重新触发
  46. _this.onPjaxLoaded(_this.boot.bind(this))
  47. }
  48. /**
  49. * 监听所有js脚本加载完毕事件,需要用此方法代替 $.ready 方法
  50. * 此方法允许在iframe中监听父窗口的事件
  51. *
  52. * @param callback
  53. * @param _window
  54. * @returns {*|jQuery|*|jQuery.fn.init|jQuery|HTMLElement}
  55. */
  56. ready(callback, _window) {
  57. if (! _window || _window === window) {
  58. if (! pjaxResponded) {
  59. return $(callback);
  60. }
  61. return this.onPjaxLoaded(callback);
  62. }
  63. let _this = this;
  64. function proxy(e) {
  65. _window.$(_this.config.pjax_container_selector).one('pjax:loaded', proxy);
  66. callback(e);
  67. }
  68. _window.Dcat.ready(proxy);
  69. }
  70. /**
  71. * 如果是 pjax 响应的页面,需要调用此方法
  72. *
  73. * @returns {Dcat}
  74. */
  75. pjaxResponded() {
  76. pjaxResponded = true;
  77. return this
  78. }
  79. /**
  80. * 使用pjax重载页面
  81. *
  82. * @param url
  83. */
  84. reload(url) {
  85. let container = this.config.pjax_container_selector;
  86. let opt = {container: container};
  87. url && (opt.url = url);
  88. $.pjax.reload(opt);
  89. }
  90. /**
  91. * 监听pjax加载js脚本完毕事件方法,此事件在 pjax:complete 事件之后触发
  92. *
  93. * @param callback
  94. * @param once 默认true
  95. *
  96. * @returns {*|jQuery}
  97. */
  98. onPjaxLoaded(callback, once) {
  99. once = once === undefined ? true : once;
  100. if (once) {
  101. return $(document).one('pjax:loaded', callback);
  102. }
  103. return $(document).on('pjax:loaded', callback);
  104. }
  105. /**
  106. * 监听pjax加载完毕完毕事件方法
  107. *
  108. * @param callback
  109. * @param once 默认true
  110. * @returns {*|jQuery}
  111. */
  112. onPjaxComplete(callback, once) {
  113. once = once === undefined ? true : once;
  114. if (once) {
  115. return $(document).one('pjax:complete', callback);
  116. }
  117. return $(document).on('pjax:complete', callback);
  118. }
  119. withConfig(config) {
  120. this.config = $.extend(defaultOptions, config);
  121. this.withLang(config.lang);
  122. this.withToken(config.token);
  123. delete config.lang;
  124. delete config.token;
  125. return this
  126. }
  127. withToken(token) {
  128. token && (this.token = token);
  129. return this
  130. }
  131. withLang(lang) {
  132. lang && (this.lang = lang);
  133. return this
  134. }
  135. }