Dcat.js 4.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222
  1. import Helpers from './extensions/Helpers'
  2. import Translator from './extensions/Translator'
  3. let $ = jQuery,
  4. pjaxResponded = false,
  5. bootingCallbacks = [],
  6. actions = {},
  7. defaultOptions = {
  8. pjax_container_selector: '#pjax-container',
  9. };
  10. export default class Dcat {
  11. constructor(config) {
  12. this.token = null;
  13. this.lang = null;
  14. // 工具函数
  15. new Helpers(this);
  16. this.withConfig(config);
  17. }
  18. /**
  19. * 初始化事件监听方法
  20. *
  21. * @param callback
  22. * @param once
  23. * @returns {Dcat}
  24. */
  25. booting(callback, once) {
  26. once = once === undefined ? true : once;
  27. bootingCallbacks.push([callback, once]);
  28. return this
  29. }
  30. /**
  31. * 初始化事件监听方法,每个请求都会触发
  32. *
  33. * @param callback
  34. * @returns {Dcat}
  35. */
  36. bootingEveryRequest(callback) {
  37. return this.booting(callback, false)
  38. }
  39. /**
  40. * 初始化
  41. */
  42. boot() {
  43. let _this = this,
  44. callbacks = bootingCallbacks;
  45. bootingCallbacks = [];
  46. callbacks.forEach(data => {
  47. data[0](this);
  48. if (data[1] === false) {
  49. bootingCallbacks.push(data)
  50. }
  51. });
  52. // 脚本加载完毕后重新触发
  53. _this.onPjaxLoaded(_this.boot.bind(this))
  54. }
  55. /**
  56. * 监听所有js脚本加载完毕事件,需要用此方法代替 $.ready 方法
  57. * 此方法允许在iframe中监听父窗口的事件
  58. *
  59. * @param callback
  60. * @param _window
  61. * @returns {*|jQuery|*|jQuery.fn.init|jQuery|HTMLElement}
  62. */
  63. ready(callback, _window) {
  64. let _this = this;
  65. if (! _window || _window === window) {
  66. if (! pjaxResponded) {
  67. return $(callback);
  68. }
  69. return _this.onPjaxLoaded(callback);
  70. }
  71. function run(e) {
  72. _window.$(_this.config.pjax_container_selector).one('pjax:loaded', run);
  73. callback(e);
  74. }
  75. _window.Dcat.ready(run);
  76. }
  77. /**
  78. * 主动触发 ready 事件
  79. */
  80. triggerReady() {
  81. if (! pjaxResponded) {
  82. return;
  83. }
  84. $(() => {
  85. $(document).trigger('pjax:loaded');
  86. });
  87. }
  88. /**
  89. * 如果是 pjax 响应的页面,需要调用此方法
  90. *
  91. * @returns {Dcat}
  92. */
  93. pjaxResponded(value) {
  94. pjaxResponded = value !== false;
  95. return this
  96. }
  97. /**
  98. * 使用pjax重载页面
  99. *
  100. * @param url
  101. */
  102. reload(url) {
  103. let container = this.config.pjax_container_selector,
  104. opt = {container: container};
  105. if ($(container).length) {
  106. url && (opt.url = url);
  107. $.pjax.reload(opt);
  108. return;
  109. }
  110. if (url) {
  111. location.href = url;
  112. } else {
  113. location.reload();
  114. }
  115. }
  116. /**
  117. * 监听pjax加载js脚本完毕事件方法,此事件在 pjax:complete 事件之后触发
  118. *
  119. * @param callback
  120. * @param once 默认true
  121. *
  122. * @returns {*|jQuery}
  123. */
  124. onPjaxLoaded(callback, once) {
  125. once = once === undefined ? true : once;
  126. if (once) {
  127. return $(document).one('pjax:loaded', callback);
  128. }
  129. return $(document).on('pjax:loaded', callback);
  130. }
  131. /**
  132. * 监听pjax加载完毕完毕事件方法
  133. *
  134. * @param callback
  135. * @param once 默认true
  136. * @returns {*|jQuery}
  137. */
  138. onPjaxComplete(callback, once) {
  139. once = once === undefined ? true : once;
  140. if (once) {
  141. return $(document).one('pjax:complete', callback);
  142. }
  143. return $(document).on('pjax:complete', callback);
  144. }
  145. withConfig(config) {
  146. this.config = $.extend(defaultOptions, config);
  147. this.withLang(config.lang);
  148. this.withToken(config.token);
  149. delete config.lang;
  150. delete config.token;
  151. return this
  152. }
  153. withToken(token) {
  154. token && (this.token = token);
  155. return this
  156. }
  157. withLang(lang) {
  158. if (lang && typeof lang === 'object') {
  159. this.lang = this.Translator(lang);
  160. }
  161. return this
  162. }
  163. // 语言包
  164. Translator(lang) {
  165. return new Translator(this, lang);
  166. }
  167. // 注册动作
  168. addAction(name, callback) {
  169. if (typeof callback === 'function') {
  170. actions[name] = callback;
  171. }
  172. }
  173. // 获取动作
  174. actions() {
  175. return actions
  176. }
  177. }