OXIESEC PANEL

Name	Size	Modified	Perms
📁 ..	-	02/20/2020 06:33:39 AM	rwxr-xr-x
📄 ButtonSetupDemo.ts	2.82 KB	02/20/2020 06:33:34 AM	rw-r--r--
📄 Demos.ts	515 bytes	02/20/2020 06:33:34 AM	rw-r--r--
📄 FormatSelectDemo.ts	2.4 KB	02/20/2020 06:33:35 AM	rw-r--r--
📄 MenuItemDemo.ts	3.9 KB	02/20/2020 06:33:35 AM	rw-r--r--
📄 MockDemo.ts	508 bytes	02/20/2020 06:33:36 AM	rw-r--r--
📄 PlayDemo.ts	5.03 KB	02/20/2020 06:33:36 AM	rw-r--r--
📄 SidebarDemo.ts	1.46 KB	02/20/2020 06:33:37 AM	rw-r--r--
📄 ToolbarButtonDemo.ts	2.92 KB	02/20/2020 06:33:37 AM	rw-r--r--
📄 ToolbarComponentsDemo.ts	3.67 KB	02/20/2020 06:33:38 AM	rw-r--r--

Editing: FormatSelectDemo.ts

declare let tinymce: any;

export default function () {

tinymce.init({
    selector: 'textarea.tiny-text',
    theme: 'silver',
    toolbar: 'styleselect',
    plugins: [ 'lists', 'autolink', 'autosave', 'insertdatetime'  ],
    style_formats: [
      {title: 'Bold text', inline: 'b'},
      {title: 'Red text', inline: 'span', styles: {color: '#ff0000'}},
      {title: 'Red header', block: 'h1', styles: {color: '#ff0000'}},
      {title: 'Example 1', inline: 'span', classes: 'example1'},
      {title: 'Example 2', inline: 'span', classes: 'example2'},
      {title: 'Table styles'},
      {title: 'Table row 1', selector: 'tr', classes: 'tablerow1'},
      {
        title: 'Headings', items: [
          { title: 'Heading 1', format: 'h1' },
          { title: 'Heading 2', format: 'h2' },
          { title: 'Heading 3', format: 'h3' },
          { title: 'Heading 4', format: 'h4' },
          { title: 'Heading 5', format: 'h5' },
          { title: 'Heading 6', format: 'h6' }
        ]
      },

{
        title: 'Inline', items: [
          { title: 'Bold', icon: 'bold', format: 'bold' },
          { title: 'Italic', icon: 'italic', format: 'italic' },
          { title: 'Underline', icon: 'underline', format: 'underline' },
          { title: 'Strikethrough', icon: 'strikethrough', format: 'strikethrough' },
          { title: 'Superscript', icon: 'superscript', format: 'superscript' },
          { title: 'Subscript', icon: 'subscript', format: 'subscript' },
          { title: 'Code', icon: 'code', format: 'code' }
        ]
      },

{
        title: 'Blocks', items: [
          { title: 'Paragraph', format: 'p' },
          { title: 'Blockquote', format: 'blockquote' },
          { title: 'Div', format: 'div' },
          { title: 'Pre', format: 'pre' }
        ]
      },

{
        title: 'Alignment', items: [
          { title: 'Left', icon: 'alignleft', format: 'alignleft' },
          { title: 'Center', icon: 'aligncenter', format: 'aligncenter' },
          { title: 'Right', icon: 'alignright', format: 'alignright' },
          { title: 'Justify', icon: 'alignjustify', format: 'alignjustify' }
        ]
      }
    ],
  });

tinymce.init({
    selector: 'textarea.tiny-text2',
    theme: 'silver',
    toolbar: 'styleselect',
    block_formats: 'Paragraph=p;Header 1=h1;Header 2=h2;Separator Name=|;Header 3=h3',
    plugins: [ 'lists', 'autolink', 'autosave', 'insertdatetime' ],
  });
}