Dashboard sipadu mbip
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

aui-dialog-iframe-debug.js 5.7KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280
  1. AUI.add('aui-dialog-iframe', function(A) {
  2. var Lang = A.Lang,
  3. getClassName = A.getClassName,
  4. IFRAME = 'iframe',
  5. CSS_IFRAME_BD = getClassName('dialog', IFRAME, 'bd'),
  6. CSS_IFRAME_NODE = getClassName('dialog', IFRAME, 'node'),
  7. CSS_IFRAME_ROOT_NODE = getClassName('dialog', IFRAME, 'root', 'node'),
  8. BUFFER_CSS_CLASS = [CSS_IFRAME_NODE],
  9. TPL_IFRAME = '<iframe class="{cssClass}" frameborder="0" id="{id}" name="{id}" src="{uri}"></iframe>',
  10. UI = A.Widget.UI_SRC,
  11. UI_SRC = {
  12. src: UI
  13. };
  14. var DialogIframePlugin = A.Component.create(
  15. {
  16. ATTRS: {
  17. bindLoadHandler: {
  18. validator: Lang.isFunction,
  19. value: function() {
  20. var instance = this;
  21. instance.node.on('load', A.bind(instance.fire, instance, 'load'));
  22. }
  23. },
  24. closeOnEscape: {
  25. value: true
  26. },
  27. iframeCssClass: {
  28. value: '',
  29. setter: '_setIframeCssClass'
  30. },
  31. iframeId: {
  32. valueFn: function() {
  33. var instance = this;
  34. return instance.get('id') || A.guid();
  35. }
  36. },
  37. uri: {
  38. }
  39. },
  40. EXTENDS: A.Plugin.Base,
  41. NAME: IFRAME,
  42. NS: IFRAME,
  43. prototype: {
  44. initializer: function(config) {
  45. var instance = this;
  46. instance._host = instance.get('host');
  47. instance._eventHandles = [];
  48. instance.publish(
  49. 'load',
  50. {
  51. defaultFn: instance._defaultLoadIframeFn
  52. }
  53. );
  54. instance.afterHostMethod(
  55. 'renderUI',
  56. A.debounce(instance._afterRenderUI, 50, instance),
  57. instance
  58. );
  59. },
  60. destructor: function() {
  61. var instance = this;
  62. instance._detachEventHandles();
  63. instance._host.set('bodyContent', instance._previousBodyContent);
  64. instance.node.remove(true);
  65. },
  66. _afterDialogVisibleChange: function(event) {
  67. var instance = this;
  68. instance._uiSetMonitor(event.newVal);
  69. },
  70. _afterMaskVisibleChange: function(event) {
  71. var instance = this;
  72. instance._uiSetMonitor(!event.newVal);
  73. },
  74. _afterRenderUI: function() {
  75. var instance = this;
  76. instance._plugIframe();
  77. instance._bindEvents();
  78. var bodyNode = instance._bodyNode;
  79. bodyNode.plug(A.LoadingMask);
  80. var loadingMask = bodyNode.loadingmask;
  81. loadingMask.overlayMask.after('visibleChange', instance._afterMaskVisibleChange, instance);
  82. loadingMask.show();
  83. },
  84. _afterUriChange: function(event) {
  85. var instance = this;
  86. if (event.src != UI) {
  87. instance._uiSetUri(event.newVal, event.prevVal);
  88. }
  89. },
  90. _bindEvents: function() {
  91. var instance = this;
  92. instance.afterHostEvent('heightChange', instance._updateIframeSize, instance);
  93. instance.afterHostEvent('widthChange', instance._updateIframeSize, instance);
  94. instance.afterHostEvent('visibleChange', instance._afterDialogVisibleChange);
  95. instance.after('uriChange', instance._afterUriChange);
  96. var bindLoadHandler = instance.get('bindLoadHandler');
  97. bindLoadHandler.call(instance);
  98. },
  99. _detachEventHandles: function() {
  100. var instance = this;
  101. var eventHandles = instance._eventHandles;
  102. A.Array.invoke(eventHandles, 'detach');
  103. eventHandles.length = 0;
  104. },
  105. _defaultLoadIframeFn: function(event) {
  106. var instance = this;
  107. var node = instance.node;
  108. try {
  109. var iframeWindow = node.get('contentWindow');
  110. iframeWindow.once('unload', instance._detachEventHandles, instance);
  111. var iframeDoc = iframeWindow.get('document');
  112. iframeDoc.get('documentElement').addClass(CSS_IFRAME_ROOT_NODE);
  113. instance.set('uri', iframeDoc.get('location.href'), UI_SRC);
  114. if (instance.get('closeOnEscape')) {
  115. instance._eventHandles.push(
  116. A.on(
  117. 'key',
  118. function(event) {
  119. instance._host.close();
  120. },
  121. [iframeDoc],
  122. 'down:27'
  123. )
  124. );
  125. }
  126. }
  127. catch (e) {
  128. }
  129. instance._bodyNode.loadingmask.hide();
  130. instance._host._syncUIPosAlign();
  131. },
  132. _plugIframe: function() {
  133. var instance = this;
  134. instance._previousBodyContent = instance._host.get('bodyContent');
  135. var iframeTpl = Lang.sub(
  136. TPL_IFRAME,
  137. {
  138. cssClass: instance.get('iframeCssClass'),
  139. id: instance.get('iframeId'),
  140. uri: instance.get('uri')
  141. }
  142. );
  143. var node = A.Node.create(iframeTpl);
  144. node.plug(A.Plugin.ResizeIframe);
  145. node.resizeiframe.addTarget(instance);
  146. instance._host.set('bodyContent', node);
  147. var bodyNode = instance._host.bodyNode;
  148. bodyNode.addClass(CSS_IFRAME_BD);
  149. instance._bodyNode = bodyNode;
  150. instance.node = node;
  151. },
  152. _setIframeCssClass: function(value) {
  153. BUFFER_CSS_CLASS[1] = value;
  154. return BUFFER_CSS_CLASS.join(' ');
  155. },
  156. _uiSetMonitor: function(value) {
  157. var instance = this;
  158. var resizeIframe = instance.node.resizeiframe;
  159. if (value) {
  160. resizeIframe.restartMonitor();
  161. }
  162. else {
  163. resizeIframe.pauseMonitor();
  164. }
  165. },
  166. _uiSetUri: function(newVal, prevVal) {
  167. var instance = this;
  168. var loadingMask = instance._bodyNode.loadingmask;
  169. var oldUrl = prevVal.split('#');
  170. var newUrl = newVal.split('#');
  171. if (newUrl[0] != oldUrl[0] && loadingMask) {
  172. loadingMask.show();
  173. }
  174. instance.node.attr('src', newVal);
  175. },
  176. _updateIframeSize: function(event) {
  177. var instance = this;
  178. var bodyNode = instance._bodyNode;
  179. var node = instance.node;
  180. var updateIframeSizeUI = instance._updateIframeSizeUI;
  181. if (!updateIframeSizeUI) {
  182. updateIframeSizeUI = function() {
  183. var bodyHeight = bodyNode.getStyle('height');
  184. node.resizeiframe.set('height', bodyHeight);
  185. bodyNode.loadingmask.refreshMask();
  186. };
  187. instance._updateIframeSizeUI = updateIframeSizeUI;
  188. }
  189. A.setTimeout(updateIframeSizeUI, 50);
  190. }
  191. }
  192. }
  193. );
  194. A.Plugin.DialogIframe = DialogIframePlugin;
  195. }, '@VERSION@' ,{skinnable:true, requires:['aui-base','aui-loading-mask','aui-resize-iframe','plugin']});