plugin.js 4.9 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145
  1. /**
  2. * @license Copyright (c) 2003-2015, CKSource - Frederico Knabben. All rights reserved.
  3. * For licensing, see LICENSE.md or http://ckeditor.com/license
  4. */
  5. /**
  6. * @fileOverview Preview plugin.
  7. */
  8. ( function() {
  9. var pluginPath;
  10. var previewCmd = { modes: { wysiwyg: 1, source: 1 },
  11. canUndo: false,
  12. readOnly: 1,
  13. exec: function( editor ) {
  14. var sHTML,
  15. config = editor.config,
  16. baseTag = config.baseHref ? '<base href="' + config.baseHref + '"/>' : '',
  17. eventData;
  18. if ( config.fullPage )
  19. sHTML = editor.getData().replace( /<head>/, '$&' + baseTag ).replace( /[^>]*(?=<\/title>)/, '$& &mdash; ' + editor.lang.preview.preview );
  20. else {
  21. var bodyHtml = '<body ',
  22. body = editor.document && editor.document.getBody();
  23. if ( body ) {
  24. if ( body.getAttribute( 'id' ) )
  25. bodyHtml += 'id="' + body.getAttribute( 'id' ) + '" ';
  26. if ( body.getAttribute( 'class' ) )
  27. bodyHtml += 'class="' + body.getAttribute( 'class' ) + '" ';
  28. }
  29. bodyHtml += '>';
  30. sHTML = editor.config.docType + '<html dir="' + editor.config.contentsLangDirection + '">' +
  31. '<head>' +
  32. baseTag +
  33. '<title>' + editor.lang.preview.preview + '</title>' +
  34. CKEDITOR.tools.buildStyleHtml( editor.config.contentsCss ) +
  35. '</head>' + bodyHtml +
  36. editor.getData() +
  37. '</body></html>';
  38. }
  39. var iWidth = 640,
  40. // 800 * 0.8,
  41. iHeight = 420,
  42. // 600 * 0.7,
  43. iLeft = 80; // (800 - 0.8 * 800) /2 = 800 * 0.1.
  44. try {
  45. var screen = window.screen;
  46. iWidth = Math.round( screen.width * 0.8 );
  47. iHeight = Math.round( screen.height * 0.7 );
  48. iLeft = Math.round( screen.width * 0.1 );
  49. } catch ( e ) {}
  50. // (#9907) Allow data manipulation before preview is displayed.
  51. // Also don't open the preview window when event cancelled.
  52. if ( editor.fire( 'contentPreview', eventData = { dataValue: sHTML } ) === false )
  53. return false;
  54. var sOpenUrl = '',
  55. ieLocation;
  56. if ( CKEDITOR.env.ie ) {
  57. window._cke_htmlToLoad = eventData.dataValue;
  58. ieLocation = 'javascript:void( (function(){' + // jshint ignore:line
  59. 'document.open();' +
  60. // Support for custom document.domain.
  61. // Strip comments and replace parent with window.opener in the function body.
  62. ( '(' + CKEDITOR.tools.fixDomain + ')();' ).replace( /\/\/.*?\n/g, '' ).replace( /parent\./g, 'window.opener.' ) +
  63. 'document.write( window.opener._cke_htmlToLoad );' +
  64. 'document.close();' +
  65. 'window.opener._cke_htmlToLoad = null;' +
  66. '})() )';
  67. // For IE we should use window.location rather than setting url in window.open. (#11146)
  68. sOpenUrl = '';
  69. }
  70. // With Firefox only, we need to open a special preview page, so
  71. // anchors will work properly on it. (#9047)
  72. if ( CKEDITOR.env.gecko ) {
  73. window._cke_htmlToLoad = eventData.dataValue;
  74. sOpenUrl = CKEDITOR.getUrl( pluginPath + 'preview.html' );
  75. }
  76. var oWindow = window.open( sOpenUrl, null, 'toolbar=yes,location=no,status=yes,menubar=yes,scrollbars=yes,resizable=yes,width=' +
  77. iWidth + ',height=' + iHeight + ',left=' + iLeft );
  78. // For IE we want to assign whole js stored in ieLocation, but in case of
  79. // popup blocker activation oWindow variable will be null. (#11597)
  80. if ( CKEDITOR.env.ie && oWindow )
  81. oWindow.location = ieLocation;
  82. if ( !CKEDITOR.env.ie && !CKEDITOR.env.gecko ) {
  83. var doc = oWindow.document;
  84. doc.open();
  85. doc.write( eventData.dataValue );
  86. doc.close();
  87. }
  88. return true;
  89. }
  90. };
  91. var pluginName = 'preview';
  92. // Register a plugin named "preview".
  93. CKEDITOR.plugins.add( pluginName, {
  94. // jscs:disable maximumLineLength
  95. lang: 'af,ar,bg,bn,bs,ca,cs,cy,da,de,el,en,en-au,en-ca,en-gb,eo,es,et,eu,fa,fi,fo,fr,fr-ca,gl,gu,he,hi,hr,hu,id,is,it,ja,ka,km,ko,ku,lt,lv,mk,mn,ms,nb,nl,no,pl,pt,pt-br,ro,ru,si,sk,sl,sq,sr,sr-latn,sv,th,tr,tt,ug,uk,vi,zh,zh-cn', // %REMOVE_LINE_CORE%
  96. // jscs:enable maximumLineLength
  97. icons: 'preview,preview-rtl', // %REMOVE_LINE_CORE%
  98. hidpi: true, // %REMOVE_LINE_CORE%
  99. init: function( editor ) {
  100. // Preview is not used for the inline creator.
  101. if ( editor.elementMode == CKEDITOR.ELEMENT_MODE_INLINE )
  102. return;
  103. pluginPath = this.path;
  104. editor.addCommand( pluginName, previewCmd );
  105. editor.ui.addButton && editor.ui.addButton( 'Preview', {
  106. label: editor.lang.preview.preview,
  107. command: pluginName,
  108. toolbar: 'document,40'
  109. } );
  110. }
  111. } );
  112. } )();
  113. /**
  114. * Event fired when executing `preview` command, which allows additional data manipulation.
  115. * With this event, the raw HTML content of the preview window to be displayed can be altered
  116. * or modified.
  117. *
  118. * @event contentPreview
  119. * @member CKEDITOR
  120. * @param {CKEDITOR.editor} editor This editor instance.
  121. * @param data
  122. * @param {String} data.dataValue The data that will go to the preview.
  123. */