TypeScript Plugin.default函数代码示例

export default function () {
  AdvListPlugin();
  AnchorPlugin();
  AutoLinkPlugin();
  AutoResizePlugin();
  AutoSavePlugin();
  BbCodePlugin();
  CharMapPlugin();
  CodePlugin();
  CodeSamplePlugin();
  ColorPickerPlugin();
  ContextMenuPlugin();
  DirectionalityPlugin();
  EmoticonsPlugin();
  FullPagePlugin();
  FullScreenPlugin();
  HrPlugin();
  ImagePlugin();
  ImageToolsPlugin();
  ImportCssPlugin();
  InsertDatetimePlugin();
  LegacyOutputPlugin();
  LinkPlugin();
  ListsPlugin();
  MediaPlugin();
  NonBreakingPlugin();
  NonEditablePlugin();
  PageBreakPlugin();
  PastePlugin();
  PreviewPlugin();
  PrintPlugin();
  SavePlugin();
  SearchReplacePlugin();
  SpellCheckerPlugin();
  TabFocusPlugin();
  TablePlugin();
  TemplatePlugin();
  TextColorPlugin();
  TextPatternPlugin();
  TocPlugin();
  VisualBlocksPlugin();
  VisualCharsPlugin();
  WordCountPlugin();
  ModernTheme();
  MobileTheme();
  HelpPlugin();

  PluginManager.urls.emoticons = '../../../../js/tinymce/plugins/emoticons';

  const settings = {
    skin_url: '../../../../js/tinymce/skins/lightgray',
    codesample_content_css: '../../../../js/tinymce/plugins/codesample/css/prism.css',
    visualblocks_content_css: '../../../../js/tinymce/plugins/visualblocks/css/visualblocks.css',
    images_upload_url: 'd',
    selector: 'textarea',
    // rtl_ui: true,
    link_list: [
      { title: 'My page 1', value: 'http://www.tinymce.com' },
      { title: 'My page 2', value: 'http://www.moxiecode.com' }
    ],
    image_list: [
      { title: 'My page 1', value: 'http://www.tinymce.com' },
      { title: 'My page 2', value: 'http://www.moxiecode.com' }
    ],
    image_class_list: [
      { title: 'None', value: '' },
      { title: 'Some class', value: 'class-name' }
    ],
    importcss_append: true,
    height: 400,
    file_picker_callback (callback, value, meta) {
      // Provide file and text for the link dialog
      if (meta.filetype === 'file') {
        callback('https://www.google.com/logos/google.jpg', { text: 'My text' });
      }

      // Provide image and alt text for the image dialog
      if (meta.filetype === 'image') {
        callback('https://www.google.com/logos/google.jpg', { alt: 'My alt text' });
      }

      // Provide alternative source and posted for the media dialog
      if (meta.filetype === 'media') {
        callback('movie.mp4', { source2: 'alt.ogg', poster: 'https://www.google.com/logos/google.jpg' });
      }
    },
    spellchecker_callback (method, text, success, failure) {
      const words = text.match(this.getWordCharPattern());

      if (method === 'spellcheck') {
        const suggestions = {};

        for (let i = 0; i < words.length; i++) {
          suggestions[words[i]] = ['First', 'Second'];
        }

        success(suggestions);
      }

      if (method === 'addToDictionary') {
//.........这里部分代码省略.........

export default function () {
  AdvListPlugin();
  AnchorPlugin();
  AutoLinkPlugin();
  AutoResizePlugin();
  AutoSavePlugin();
  BbCodePlugin();
  CharMapPlugin();
  CodePlugin();
  CodeSamplePlugin();
  ColorPickerPlugin();
  ContextMenuPlugin();
  DirectionalityPlugin();
  EmoticonsPlugin();
  FullPagePlugin();
  FullScreenPlugin();
  HrPlugin();
  ImagePlugin();
  ImageToolsPlugin();
  ImportCssPlugin();
  InsertDatetimePlugin();
  LegacyOutputPlugin();
  LinkPlugin();
  ListsPlugin();
  MediaPlugin();
  NonBreakingPlugin();
  NonEditablePlugin();
  PageBreakPlugin();
  PastePlugin();
  PreviewPlugin();
  PrintPlugin();
  SavePlugin();
  SearchReplacePlugin();
  SpellCheckerPlugin();
  TabFocusPlugin();
  TablePlugin();
  TemplatePlugin();
  TextColorPlugin();
  TextPatternPlugin();
  TocPlugin();
  VisualBlocksPlugin();
  VisualCharsPlugin();
  WordCountPlugin();
  ModernTheme();

  const cmd = function (command, value?) {
    return { command, value };
  };

  const commands = [
    cmd('Bold'),
    cmd('Italic'),
    cmd('Underline'),
    cmd('Strikethrough'),
    cmd('Superscript'),
    cmd('Subscript'),
    cmd('Cut'),
    cmd('Copy'),
    cmd('Paste'),
    cmd('Unlink'),
    cmd('JustifyLeft'),
    cmd('JustifyCenter'),
    cmd('JustifyRight'),
    cmd('JustifyFull'),
    cmd('JustifyNone'),
    cmd('InsertUnorderedList'),
    cmd('InsertOrderedList'),
    cmd('ForeColor', 'red'),
    cmd('HiliteColor', 'green'),
    cmd('FontName', 'Arial'),
    cmd('FontSize', 7),
    cmd('RemoveFormat'),
    cmd('mceBlockQuote'),
    cmd('FormatBlock', 'h1'),
    cmd('mceInsertContent', 'abc'),
    cmd('mceToggleFormat', 'bold'),
    cmd('mceSetContent', 'abc'),
    cmd('Indent'),
    cmd('Outdent'),
    cmd('InsertHorizontalRule'),
    cmd('mceToggleVisualAid'),
    cmd('mceInsertLink', 'url'),
    cmd('selectAll'),
    cmd('delete'),
    cmd('mceNewDocument'),
    cmd('Undo'),
    cmd('Redo'),
    cmd('mceAutoResize'),
    cmd('mceShowCharmap'),
    cmd('mceCodeEditor'),
    cmd('mceDirectionLTR'),
    cmd('mceDirectionRTL'),
    cmd('mceFullPageProperties'),
    cmd('mceFullscreen'),
    cmd('mceImage'),
    cmd('mceInsertDate'),
    cmd('mceInsertTime'),
    cmd('InsertDefinitionList'),
    cmd('mceNonBreaking'),
    cmd('mcePageBreak'),
//.........这里部分代码省略.........

  function () {
    const success = arguments[arguments.length - 2];
    const failure = arguments[arguments.length - 1];

    ModernTheme();
    TextcolorPlugin();

    const state = Cell(null);

    const sAssertState = function (expected) {
      return Step.sync(function () {
        RawAssertions.assertEq('should be same', expected, state.get());
      });
    };

    const sResetState = Step.sync(function () {
      state.set(null);
    });

    TinyLoader.setup(function (editor, onSuccess, onFailure) {

      editor.on('execCommand', function (e) {
        state.set(e.command);
      });

      const tinyUi = TinyUi(editor);
      const tinyApis = TinyApis(editor);

      Pipeline.async({}, [
        Logger.t('apply and remove forecolor and make sure of the right command has been executed', GeneralSteps.sequence([
          tinyApis.sSetContent('hello test'),
          tinyApis.sSetSelection([0, 0], 0, [0, 0], 5),
          tinyUi.sClickOnToolbar('click forecolor', 'div[aria-label="Text color"] > button.mce-open'),
          tinyUi.sClickOnUi('click green color', 'div[data-mce-color="#00FF00"]:first'),
          sAssertState('mceApplyTextcolor'),
          tinyApis.sSetSelection([0, 0, 0], 0, [0, 0, 0], 5),
          tinyUi.sClickOnToolbar('click forecolor', 'div[aria-label="Text color"] > button.mce-open'),
          tinyUi.sClickOnUi('click green color', 'div[data-mce-color="transparent"]:first'),
          sAssertState('mceRemoveTextcolor'),
          sResetState
        ])),
        Logger.t('apply and remove forecolor and make sure of the right command has been executed', GeneralSteps.sequence([
          tinyApis.sSetContent('hello test'),
          tinyApis.sSetSelection([0, 0], 0, [0, 0], 5),
          tinyUi.sClickOnToolbar('click backcolor', 'div[aria-label="Background color"] > button.mce-open'),
          tinyUi.sClickOnUi('click green color', 'div[data-mce-color="#00FF00"]:last'),
          sAssertState('mceApplyTextcolor'),
          tinyApis.sSetSelection([0, 0, 0], 0, [0, 0, 0], 5),
          tinyUi.sClickOnToolbar('click backcolor', 'div[aria-label="Background color"] > button.mce-open'),
          tinyUi.sClickOnUi('click green color', 'div[data-mce-color="transparent"]:first'),
          sAssertState('mceRemoveTextcolor'),
          sResetState
        ]))
      ], onSuccess, onFailure);
    }, {
      plugins: 'textcolor',
      toolbar: 'forecolor backcolor',
      skin_url: '/project/js/tinymce/skins/lightgray'
    }, success, failure);
  }

UnitTest.asynctest('browser.tinymce.plugins.colorpicker.ColorPickerSanityTest', function () {
  const success = arguments[arguments.length - 2];
  const failure = arguments[arguments.length - 1];

  TextColorPlugin();
  ColorPickerPlugin();
  ModernTheme();

  TinyLoader.setup(function (editor, onSuccess, onFailure) {
    const tinyUi = TinyUi(editor);

    Pipeline.async({}, [
      tinyUi.sClickOnToolbar('click forecolor arrow', 'div[aria-label="Text color"] button.mce-open'),
      tinyUi.sClickOnUi('click on custom btn', 'button:contains("Custom...")'),
      tinyUi.sWaitForPopup('wait for popup', 'div[role="dialog"][aria-label="Color"]'),
      tinyUi.sClickOnUi('could not find cancel button', 'button:contains("Cancel")'),
      tinyUi.sClickOnToolbar('click backcolor arrow', 'div[aria-label="Background color"] button.mce-open'),
      tinyUi.sClickOnUi('click on custom btn', 'button:contains("Custom...")'),
      tinyUi.sWaitForPopup('wait for popup', 'div[role="dialog"][aria-label="Color"]'),
      tinyUi.sClickOnUi('could not find cancel button', 'button:contains("Cancel")')
    ], onSuccess, onFailure);
  }, {
    plugins: 'colorpicker textcolor',
    toolbar: 'colorpicker forecolor backcolor',
    skin_url: '/project/js/tinymce/skins/lightgray'
  }, success, failure);
});

UnitTest.asynctest('browser.tinymce.themes.modern.test.HideFloatPanelsTest', (success, failure) => {
  Theme();
  TextcolorPlugin();

  const sSetProgressState = (editor: Editor, state) => Step.sync(() => {
    editor.setProgressState(state);
  });

  TinyLoader.setup(function (editor, onSuccess, onFailure) {
    const tinyUi = TinyUi(editor);

    Pipeline.async({}, [
      Log.stepsAsStep('TBA', 'Close float panels when setProgressState is called', [
        tinyUi.sClickOnToolbar('click forecolor', 'div[aria-label="Text color"] > button.mce-open'),
        UiFinder.sWaitFor('Float panel for color button should be open', Body.body(), '.mce-floatpanel'),
        sSetProgressState(editor, true),
        UiFinder.sWaitForHidden('', Body.body(), '.mce-floatpanel')
      ])
    ], onSuccess, onFailure);
  }, {
    theme: 'modern',
    skin_url: '/project/js/tinymce/skins/lightgray',
    plugins: 'textcolor',
    toolbar: 'forecolor'
  }, success, failure);
});

UnitTest.asynctest('browser.tinymce.plugins.textcolor.GetCurrentColorTest', (success, failure) => {
    const browser = PlatformDetection.detect().browser;

    ModernTheme();
    TextcolorPlugin();

    const sAssertCurrentColor = (editor, format, label, expected) => Step.sync(() => {
      const actual = TextColor.getCurrentColor(editor, format);

      RawAssertions.assertEq(label, expected, actual);
    });

    TinyLoader.setup(function (editor, onSuccess, onFailure) {
      const tinyApis = TinyApis(editor);

      Pipeline.async({}, browser.isIE() ? [] : [
        Logger.t('getCurrentColor should return the first found forecolor, not the parent color', GeneralSteps.sequence([
          tinyApis.sFocus,
          tinyApis.sSetContent('<p style="color: blue;">hello <span style="color: red;">world</span></p>'),
          tinyApis.sSetSelection([0, 1, 0], 2, [0, 1, 0], 2),
          sAssertCurrentColor(editor, 'forecolor', 'should return red', 'red')
        ])),
        Logger.t('getCurrentColor should return the first found backcolor, not the parent color', GeneralSteps.sequence([
          tinyApis.sFocus,
          tinyApis.sSetContent('<p style="background-color: red;">hello <span style="background-color: blue;">world</span></p>'),
          tinyApis.sSetSelection([0, 1, 0], 2, [0, 1, 0], 2),
          sAssertCurrentColor(editor, 'backcolor', 'should return blue', 'blue')
        ]))
      ], onSuccess, onFailure);
    }, {
      plugins: 'textcolor',
      toolbar: 'forecolor backcolor',
      skin_url: '/project/js/tinymce/skins/lightgray'
    }, success, failure);
  }

UnitTest.asynctest('browser.tinymce.plugins.textcolor.TextcolorSanityTest.js', function () {
  const success = arguments[arguments.length - 2];
  const failure = arguments[arguments.length - 1];

  ModernTheme();
  TextcolorPlugin();
  const forecolorStruct = ApproxStructure.build(function (s, str) {
    return s.element('body', {
      children: [
        s.element('p', {
          children: [
            s.element('span', {
              styles: {
                'color': str.is(Env.ie && Env.ie <= 11 ? '#0000ff' : 'rgb(0, 0, 255)'),
                'font-size': str.is('24pt')
              }
            }),
            s.text(str.is(' test'))
          ]
        })
      ]
    });
  });

  const backcolorStruct = ApproxStructure.build(function (s, str) {
    return s.element('body', {
      children: [
        s.element('p', {
          children: [
            s.element('span', {
              styles: {
                'background-color': str.is('rgb(204, 153, 255)'),
                'font-size': str.is('24pt')
              }
            }),
            s.text(str.is(' test'))
          ]
        })
      ]
    });
  });

  TinyLoader.setup(function (editor, onSuccess, onFailure) {
    const tinyApis = TinyApis(editor);
    const tinyUi = TinyUi(editor);

    Pipeline.async({}, [
      // forecolor test
      tinyApis.sSetContent('hello test'),
      tinyApis.sSetSelection([0, 0], 0, [0, 0], 5),
      tinyUi.sClickOnToolbar('click forecolor', 'div[aria-label="Text color"] > button.mce-open'),
      tinyUi.sClickOnUi('click green color', 'div[data-mce-color="#00FF00"]:first'),
      tinyUi.sClickOnToolbar('click fontsize', 'div[aria-label="Font Sizes"] > button'),
      tinyUi.sClickOnUi('click 24pt', 'div.mce-floatpanel span.mce-text:contains("24pt")'),
      tinyUi.sClickOnToolbar('click forecolor again', 'div[aria-label="Text color"] > button.mce-open'),
      tinyUi.sClickOnUi('click blue color', 'div[data-mce-color="#0000FF"]:first'),
      tinyApis.sAssertContentStructure(forecolorStruct),
      // backcolor test
      tinyApis.sSetContent('hello test'),
      tinyApis.sSetSelection([0, 0], 0, [0, 0], 5),
      tinyUi.sClickOnToolbar('click backcolor', 'div[aria-label="Background color"] > button.mce-open'),
      tinyUi.sClickOnUi('click green color', 'div[data-mce-color="#00FF00"]:last'),
      tinyUi.sClickOnToolbar('click fontsize', 'div[aria-label="Font Sizes"] > button'),
      tinyUi.sClickOnUi('click 24pt', 'div.mce-floatpanel span.mce-text:contains("24pt")'),
      tinyUi.sClickOnToolbar('click backcolor again', 'div[aria-label="Background color"] > button.mce-open'),
      tinyUi.sClickOnUi('click a nice purple color', 'div[data-mce-color="#CC99FF"]:last'),
      tinyApis.sAssertContentStructure(backcolorStruct)
    ], onSuccess, onFailure);
  }, {
    plugins: 'textcolor',
    toolbar: 'forecolor backcolor fontsizeselect',
    skin_url: '/project/js/tinymce/skins/lightgray'
  }, success, failure);
});

/**
 * Demo.js
 *
 * Released under LGPL License.
 * Copyright (c) 1999-2016 Ephox Corp. All rights reserved
 *
 * License: http://www.tinymce.com/license
 * Contributing: http://www.tinymce.com/contributing
 */

import TextColorPlugin from 'tinymce/plugins/textcolor/Plugin';

declare let tinymce: any;

TextColorPlugin();

tinymce.init({
  selector: 'textarea.tinymce',
  plugins: 'textcolor code',
  toolbar: 'forecolor backcolor code',
  skin_url: '../../../../../js/tinymce/skins/lightgray',
  height: 600
});