stag-popup.js 10 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284
  1. window.stagPopupsQueue = [];
  2. function showStagPopup(_key, _noAutoFocus) {
  3. /*$('html, body').addClass('no-scroll');
  4. $(window.top.document.body).find('#stag_mcp_lhs').addClass('no-scroll');*/
  5. let stagPopup = $('[stag-popup-key="' + _key + '"]');
  6. if(stagPopup.is('.show')) return false;
  7. else {
  8. let zIndex = $('.stag-popup.show[stag-popup-key]').last().css('z-index');
  9. if(zIndex) zIndex++; else zIndex = 100;
  10. stagPopup.css('z-index', zIndex);
  11. }
  12. stagPopup.addClass('show');
  13. stagPopup.find('[moe][initialized]').removeAttr('initialized');
  14. initMoes();
  15. initFileInputs();
  16. if(!_noAutoFocus) {
  17. window.setTimeout(function() {
  18. stagPopup.find('input[type="text"]:not([readonly]):visible,select:visible').first().focus();
  19. }, 150);
  20. }
  21. stagPopupsQueue.push(stagPopup);
  22. return false;
  23. }
  24. function submitStagPopup(_form) {
  25. if(!_form[0].checkValidity()) {
  26. _form[0].reportValidity();
  27. return false;
  28. }
  29. showMask();
  30. $.post(_form.attr('action'), _form.serialize(), function(_data) {
  31. stagPopupsQueue = [];
  32. fastReload();
  33. });
  34. return false;
  35. }
  36. function closeStagPopup(_noEvent = false) {
  37. hideMoeFormMask();
  38. if(!stagPopupsQueue.length) return false;
  39. let popup = stagPopupsQueue[stagPopupsQueue.length - 1];
  40. let closeAll = !!popup.attr('close-all-with-self');
  41. popup.removeClass('show');
  42. stagPopupsQueue.splice(stagPopupsQueue.length - 1, 1);
  43. if(closeAll) {
  44. while(stagPopupsQueue.length) {
  45. closeStagPopup(true);
  46. }
  47. }
  48. else {
  49. if(popup.is('[update-parent]') && !_noEvent) {
  50. if(stagPopupsQueue.length) {
  51. refreshDynamicStagPopup();
  52. }
  53. else {
  54. fastReload(popup.is('[update-target]') ? popup.attr('update-target') : '');
  55. return;
  56. }
  57. }
  58. }
  59. // remove from the DOM
  60. if(popup.is('.dynamic-popup')) popup.remove();
  61. // if all closed
  62. if(!stagPopupsQueue.length) {
  63. $('html, body').removeClass('no-scroll');
  64. $(window.top.document.body).find('#stag_mcp_lhs').removeClass('no-scroll');
  65. if(!_noEvent) {
  66. $('body').trigger('stag-popup-closed');
  67. }
  68. }
  69. return false;
  70. }
  71. function convertContentLinksForInPopupNavigation(popup) {
  72. popup.find('.stag-popup-content-inner').find('a').each(function() {
  73. let a = $(this);
  74. if(!(!a.attr('href') ||
  75. a.is('[open-in-stag-popup]') ||
  76. a.is('[native]') ||
  77. a.attr('href') === '#' ||
  78. a[0].onclick)) {
  79. a.attr('replace-in-stag-popup', 1);
  80. }
  81. });
  82. }
  83. function openDynamicStagPopup(_url, initer, title, updateParent, style = '', replace = false, updateTarget = null) {
  84. let url = _url;
  85. if(url.indexOf('popupmode') === -1) {
  86. url += (url.indexOf('?') !== -1 ? '&' : '?') + 'popupmode=1';
  87. }
  88. showMask();
  89. window.noMc = true;
  90. $.get(url, (_data) => {
  91. let popup = null;
  92. if(replace) {
  93. if(!stagPopupsQueue.length) {
  94. console.error('No stag-popup currently visible!');
  95. return false;
  96. }
  97. popup = stagPopupsQueue[stagPopupsQueue.length - 1];
  98. if(!popup.is('.dynamic-popup')) {
  99. console.error('Topmost stag-popup is not dynamic!');
  100. return false;
  101. }
  102. popup.attr('stag-popup-key', url);
  103. }
  104. else {
  105. popup = $('.dynamic-popup[stag-popup-key="' + url + '"]');
  106. if(!popup.length) {
  107. $('main.stag-content').append(
  108. '<div class="stag-popup ' + (style ? style : 'stag-popup-lg') + ' dynamic-popup mcp-theme-1" stag-popup-key="' + url + '">' +
  109. '<div class="stag-popup-content p-0">' +
  110. '<h3 class="stag-popup-title mb-0 mt-3 mx-3 pb-0 border-bottom-0"><span></span>' +
  111. '<a href="#" class="ml-auto text-secondary" onclick="return closeStagPopup()"><i class="fa fa-times-circle"></i></a>\n' +
  112. '</h3>' +
  113. '<div class="stag-popup-content-inner"></div>' +
  114. '</div>' +
  115. '</div>'
  116. );
  117. popup = $('.dynamic-popup[stag-popup-key="' + url + '"]');
  118. }
  119. }
  120. popup.attr('mc-initer', initer);
  121. popup.find('.stag-popup-title>span').html(title);
  122. popup.find('.stag-popup-content-inner').html(_data);
  123. convertContentLinksForInPopupNavigation(popup);
  124. if(!replace) {
  125. if(updateParent) {
  126. popup.attr('update-parent', 1);
  127. }
  128. else {
  129. popup.removeAttr('update-parent');
  130. }
  131. showStagPopup(url, true);
  132. if(updateTarget) {
  133. popup.attr('update-target', updateTarget);
  134. }
  135. }
  136. if(initer) runMCInitializer(initer);
  137. runMCInitializer('pro-suggest'); // not the place for this! Move to better place.
  138. initMoes();
  139. hideMask();
  140. initFileInputs();
  141. }).fail(() => {
  142. toastr.error('Unable to open ' + _url);
  143. hideMask();
  144. });
  145. }
  146. function isDynamicStagPopupPresent() {
  147. if(!stagPopupsQueue.length) return false;
  148. let popup = stagPopupsQueue[stagPopupsQueue.length - 1];
  149. if(popup.is('.dynamic-popup')) return true;
  150. return false;
  151. }
  152. function refreshDynamicStagPopup(_url = false, _target = null) {
  153. if(!stagPopupsQueue.length) return false;
  154. let popup = stagPopupsQueue[stagPopupsQueue.length - 1];
  155. if(popup.is('.dynamic-popup')) {
  156. showMask();
  157. window.noMc = true;
  158. if(_url) {
  159. popup.attr('stag-popup-key', _url);
  160. }
  161. let url = popup.attr('stag-popup-key'),
  162. initer = popup.attr('mc-initer');
  163. $.get(url, (_data) => {
  164. if(_target) {
  165. _data = '<div>' + _data + '</div>';
  166. _target = _target.split(',').map(_x => $.trim(_x));
  167. for (let i = 0; i < _target.length; i++) {
  168. let t = _target[i];
  169. let targetElement = $(t).first();
  170. if(targetElement.length) {
  171. let sourceElement = $(_data).find(t).first();
  172. if (sourceElement && sourceElement.length) {
  173. targetElement.html(sourceElement.html());
  174. initFastLoad(targetElement);
  175. console.log('Replaced ' + t);
  176. }
  177. else {
  178. console.warn(t + ' not found in returned content');
  179. }
  180. }
  181. else {
  182. console.warn(t + ' not found in existing content');
  183. }
  184. }
  185. }
  186. else {
  187. popup.find('.stag-popup-content-inner').html(_data);
  188. }
  189. convertContentLinksForInPopupNavigation(popup);
  190. if(initer) runMCInitializer(initer);
  191. runMCInitializer('pro-suggest');
  192. initMoes();
  193. hideMask();
  194. initFileInputs();
  195. });
  196. }
  197. return false;
  198. }
  199. function hasResponseError(_data) {
  200. let msg = 'Unknown error!';
  201. if (_data) {
  202. if (_data.success) return false;
  203. else if (_data.message) msg = _data.message;
  204. }
  205. toastr.error(msg);
  206. return true;
  207. }
  208. (function() {
  209. window.initStagPopupEvents = function () {
  210. $(document)
  211. .off('mousedown.stag-popup-discard', '.stag-popup')
  212. .on('mousedown.stag-popup-discard', '.stag-popup', function(_e) {
  213. if($(_e.target).is('.stag-popup') && !isEventConsumed(_e)) {
  214. closeStagPopup();
  215. return false;
  216. }
  217. });
  218. // catch ESC and discard any visible popups
  219. $(document)
  220. .off('keydown.stag-popup-escape')
  221. .on('keydown.stag-popup-escape', function (e) {
  222. if(e.which === 27) {
  223. if(!isEventConsumed(e)) {
  224. if(stagPopupsQueue.length) {
  225. if($('.stag-popup.show [moe] [url]:visible').length || $('.stag-popup.show [visit-moe] [url]:visible').length) {
  226. return;
  227. }
  228. closeStagPopup();
  229. markEventAsConsumed(e);
  230. return false;
  231. }
  232. }
  233. }
  234. });
  235. $(document)
  236. .off('click.open-in-stag-popup', '[open-in-stag-popup]')
  237. .on('click.open-in-stag-popup', '[open-in-stag-popup]', function() {
  238. let trig = $(this);
  239. openDynamicStagPopup(
  240. trig.attr('href'),
  241. trig.attr('mc-initer'),
  242. trig.attr('title'),
  243. trig.is('[update-parent]'),
  244. trig.attr('popup-style'),
  245. false,
  246. trig.is('[update-target]') ? trig.attr('update-target') : null
  247. );
  248. return false;
  249. });
  250. $(document)
  251. .off('click.replace-in-stag-popup', '[replace-in-stag-popup]')
  252. .on('click.replace-in-stag-popup', '[replace-in-stag-popup]', function() {
  253. let trig = $(this);
  254. openDynamicStagPopup(
  255. trig.attr('href'),
  256. trig.attr('mc-initer'),
  257. trig.attr('title'),
  258. null, // will be inherited when replacing
  259. null, // will be inherited when replacing
  260. true,
  261. null
  262. );
  263. return false;
  264. });
  265. $(document)
  266. .off('click.close-stag-popup', '.btn-close-stag-popup')
  267. .on('click.close-stag-popup', '.btn-close-stag-popup', function() {
  268. closeStagPopup();
  269. return false;
  270. });
  271. }
  272. addMCInitializer('stag-popups', window.initStagPopupEvents);
  273. })();