plugin.js 3.4 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394959697
  1. /**
  2. * TinyMCE version 6.1.2 (2022-07-29)
  3. */
  4. (function () {
  5. 'use strict';
  6. var global$2 = tinymce.util.Tools.resolve('tinymce.PluginManager');
  7. var global$1 = tinymce.util.Tools.resolve('tinymce.Env');
  8. var global = tinymce.util.Tools.resolve('tinymce.util.Tools');
  9. const option = name => editor => editor.options.get(name);
  10. const getContentStyle = option('content_style');
  11. const shouldUseContentCssCors = option('content_css_cors');
  12. const getBodyClass = option('body_class');
  13. const getBodyId = option('body_id');
  14. const getPreviewHtml = editor => {
  15. var _a;
  16. let headHtml = '';
  17. const encode = editor.dom.encode;
  18. const contentStyle = (_a = getContentStyle(editor)) !== null && _a !== void 0 ? _a : '';
  19. headHtml += '<base href="' + encode(editor.documentBaseURI.getURI()) + '">';
  20. const cors = shouldUseContentCssCors(editor) ? ' crossorigin="anonymous"' : '';
  21. global.each(editor.contentCSS, url => {
  22. headHtml += '<link type="text/css" rel="stylesheet" href="' + encode(editor.documentBaseURI.toAbsolute(url)) + '"' + cors + '>';
  23. });
  24. if (contentStyle) {
  25. headHtml += '<style type="text/css">' + contentStyle + '</style>';
  26. }
  27. const bodyId = getBodyId(editor);
  28. const bodyClass = getBodyClass(editor);
  29. const isMetaKeyPressed = global$1.os.isMacOS() || global$1.os.isiOS() ? 'e.metaKey' : 'e.ctrlKey && !e.altKey';
  30. const preventClicksOnLinksScript = '<script>' + 'document.addEventListener && document.addEventListener("click", function(e) {' + 'for (var elm = e.target; elm; elm = elm.parentNode) {' + 'if (elm.nodeName === "A" && !(' + isMetaKeyPressed + ')) {' + 'e.preventDefault();' + '}' + '}' + '}, false);' + '</script> ';
  31. const directionality = editor.getBody().dir;
  32. const dirAttr = directionality ? ' dir="' + encode(directionality) + '"' : '';
  33. const previewHtml = '<!DOCTYPE html>' + '<html>' + '<head>' + headHtml + '</head>' + '<body id="' + encode(bodyId) + '" class="mce-content-body ' + encode(bodyClass) + '"' + dirAttr + '>' + editor.getContent() + preventClicksOnLinksScript + '</body>' + '</html>';
  34. return previewHtml;
  35. };
  36. const open = editor => {
  37. const content = getPreviewHtml(editor);
  38. const dataApi = editor.windowManager.open({
  39. title: 'Preview',
  40. size: 'large',
  41. body: {
  42. type: 'panel',
  43. items: [{
  44. name: 'preview',
  45. type: 'iframe',
  46. sandboxed: true,
  47. transparent: false
  48. }]
  49. },
  50. buttons: [{
  51. type: 'cancel',
  52. name: 'close',
  53. text: 'Close',
  54. primary: true
  55. }],
  56. initialData: { preview: content }
  57. });
  58. dataApi.focus('close');
  59. };
  60. const register$1 = editor => {
  61. editor.addCommand('mcePreview', () => {
  62. open(editor);
  63. });
  64. };
  65. const register = editor => {
  66. const onAction = () => editor.execCommand('mcePreview');
  67. editor.ui.registry.addButton('preview', {
  68. icon: 'preview',
  69. tooltip: 'Preview',
  70. onAction
  71. });
  72. editor.ui.registry.addMenuItem('preview', {
  73. icon: 'preview',
  74. text: 'Preview',
  75. onAction
  76. });
  77. };
  78. var Plugin = () => {
  79. global$2.add('preview', editor => {
  80. register$1(editor);
  81. register(editor);
  82. });
  83. };
  84. Plugin();
  85. })();