Dcat.js 3.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167
  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. var proxy = function (e) {
  64. _window.$(_window.$(this.pjaxContainer)).one('pjax:loaded', proxy);
  65. callback(e);
  66. };
  67. _window.Dcat.ready(proxy);
  68. }
  69. /**
  70. * 如果是 pjax 响应的页面,需要调用此方法
  71. *
  72. * @returns {Dcat}
  73. */
  74. pjaxResponded() {
  75. pjaxResponded = true;
  76. return this
  77. }
  78. /**
  79. * 使用pjax重载页面
  80. *
  81. * @param url
  82. */
  83. reload(url) {
  84. let container = this.config.pjax_container_selector;
  85. let opt = {container: container};
  86. url && (opt.url = url);
  87. $.pjax.reload(opt);
  88. }
  89. /**
  90. * 监听pjax加载js脚本完毕事件方法,此事件在 pjax:complete 事件之后触发
  91. *
  92. * @param callback
  93. * @param once 默认true
  94. *
  95. * @returns {*|jQuery}
  96. */
  97. onPjaxLoaded(callback, once) {
  98. once = once === undefined ? true : once;
  99. if (once) {
  100. return $(document).one('pjax:loaded', callback);
  101. }
  102. return $(document).on('pjax:loaded', callback);
  103. }
  104. /**
  105. * 监听pjax加载完毕完毕事件方法
  106. *
  107. * @param callback
  108. * @param once 默认true
  109. * @returns {*|jQuery}
  110. */
  111. onPjaxComplete(callback, once) {
  112. once = once === undefined ? true : once;
  113. if (once) {
  114. return $(document).one('pjax:complete', callback);
  115. }
  116. return $(document).on('pjax:complete', callback);
  117. }
  118. withConfig(config) {
  119. this.config = $.extend(defaultOptions, config);
  120. this.withLang(config.lang);
  121. this.withToken(config.token);
  122. delete config.lang;
  123. delete config.token;
  124. return this
  125. }
  126. withToken(token) {
  127. token && (this.token = token);
  128. return this
  129. }
  130. withLang(lang) {
  131. lang && (this.lang = lang);
  132. return this
  133. }
  134. }