plugin.js 4.6 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126
  1. /**
  2. * Copyright (c) Tiny Technologies, Inc. All rights reserved.
  3. * Licensed under the LGPL or a commercial license.
  4. * For LGPL see License.txt in the project root for license information.
  5. * For commercial licenses see https://www.tiny.cloud/
  6. *
  7. * Version: 5.2.0 (2020-02-13)
  8. */
  9. (function () {
  10. 'use strict';
  11. var global = tinymce.util.Tools.resolve('tinymce.PluginManager');
  12. var global$1 = tinymce.util.Tools.resolve('tinymce.util.Tools');
  13. var getPreviewDialogWidth = function (editor) {
  14. return parseInt(editor.getParam('plugin_preview_width', '650'), 10);
  15. };
  16. var getPreviewDialogHeight = function (editor) {
  17. return parseInt(editor.getParam('plugin_preview_height', '500'), 10);
  18. };
  19. var getContentStyle = function (editor) {
  20. return editor.getParam('content_style', '');
  21. };
  22. var shouldUseContentCssCors = function (editor) {
  23. return editor.getParam('content_css_cors', false, 'boolean');
  24. };
  25. var Settings = {
  26. getPreviewDialogWidth: getPreviewDialogWidth,
  27. getPreviewDialogHeight: getPreviewDialogHeight,
  28. getContentStyle: getContentStyle,
  29. shouldUseContentCssCors: shouldUseContentCssCors
  30. };
  31. var global$2 = tinymce.util.Tools.resolve('tinymce.Env');
  32. var getPreviewHtml = function (editor) {
  33. var headHtml = '';
  34. var encode = editor.dom.encode;
  35. var contentStyle = Settings.getContentStyle(editor);
  36. headHtml += '<base href="' + encode(editor.documentBaseURI.getURI()) + '">';
  37. if (contentStyle) {
  38. headHtml += '<style type="text/css">' + contentStyle + '</style>';
  39. }
  40. var cors = Settings.shouldUseContentCssCors(editor) ? ' crossorigin="anonymous"' : '';
  41. global$1.each(editor.contentCSS, function (url) {
  42. headHtml += '<link type="text/css" rel="stylesheet" href="' + encode(editor.documentBaseURI.toAbsolute(url)) + '"' + cors + '>';
  43. });
  44. var bodyId = editor.settings.body_id || 'tinymce';
  45. if (bodyId.indexOf('=') !== -1) {
  46. bodyId = editor.getParam('body_id', '', 'hash');
  47. bodyId = bodyId[editor.id] || bodyId;
  48. }
  49. var bodyClass = editor.settings.body_class || '';
  50. if (bodyClass.indexOf('=') !== -1) {
  51. bodyClass = editor.getParam('body_class', '', 'hash');
  52. bodyClass = bodyClass[editor.id] || '';
  53. }
  54. var isMetaKeyPressed = global$2.mac ? 'e.metaKey' : 'e.ctrlKey && !e.altKey';
  55. var 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> ';
  56. var directionality = editor.getBody().dir;
  57. var dirAttr = directionality ? ' dir="' + encode(directionality) + '"' : '';
  58. var previewHtml = '<!DOCTYPE html>' + '<html>' + '<head>' + headHtml + '</head>' + '<body id="' + encode(bodyId) + '" class="mce-content-body ' + encode(bodyClass) + '"' + dirAttr + '>' + editor.getContent() + preventClicksOnLinksScript + '</body>' + '</html>';
  59. return previewHtml;
  60. };
  61. var IframeContent = { getPreviewHtml: getPreviewHtml };
  62. var open = function (editor) {
  63. var content = IframeContent.getPreviewHtml(editor);
  64. var dataApi = editor.windowManager.open({
  65. title: 'Preview',
  66. size: 'large',
  67. body: {
  68. type: 'panel',
  69. items: [{
  70. name: 'preview',
  71. type: 'iframe',
  72. sandboxed: true
  73. }]
  74. },
  75. buttons: [{
  76. type: 'cancel',
  77. name: 'close',
  78. text: 'Close',
  79. primary: true
  80. }],
  81. initialData: { preview: content }
  82. });
  83. dataApi.focus('close');
  84. };
  85. var register = function (editor) {
  86. editor.addCommand('mcePreview', function () {
  87. open(editor);
  88. });
  89. };
  90. var Commands = { register: register };
  91. var register$1 = function (editor) {
  92. editor.ui.registry.addButton('preview', {
  93. icon: 'preview',
  94. tooltip: 'Preview',
  95. onAction: function () {
  96. return editor.execCommand('mcePreview');
  97. }
  98. });
  99. editor.ui.registry.addMenuItem('preview', {
  100. icon: 'preview',
  101. text: 'Preview',
  102. onAction: function () {
  103. return editor.execCommand('mcePreview');
  104. }
  105. });
  106. };
  107. var Buttons = { register: register$1 };
  108. function Plugin () {
  109. global.add('preview', function (editor) {
  110. Commands.register(editor);
  111. Buttons.register(editor);
  112. });
  113. }
  114. Plugin();
  115. }());