22
|
1 <!doctype html>
|
|
2 <html>
|
|
3 <head>
|
|
4 <meta name="viewport" content="width=device-width, initial-scale=1">
|
24
|
5 <script src="http://tinymce.luan.software/tinymce.min.js" xreferrerpolicy="origin"></script>
|
22
|
6 <style>
|
|
7 </style>
|
|
8 <script>
|
|
9 var youtubePtn1 = new RegExp('https://youtu.be/([a-zA-Z0-9_-]+)(?:\\?t=([0-9]+))?');
|
|
10 var youtubePtn2 = new RegExp('https://www.youtube.com/watch\\?v=([a-zA-Z0-9_-]+)(?:\\?t=([0-9]+)s)?');
|
|
11 var bitchutePtn = new RegExp('https://www.bitchute.com/video/([a-zA-Z0-9]+)/');
|
27
|
12 var rumblePtn = new RegExp('https://rumble.com/embed/[a-z0-9]+/\\?pub=[a-z0-9]+');
|
22
|
13 var url2;
|
|
14
|
|
15 function media_url_resolver(data,resolve,reject) {
|
|
16 let html;
|
|
17 let url = data.url;
|
|
18 url2 = url;
|
|
19 let result;
|
|
20 if( result = url.match(youtubePtn1) || url.match(youtubePtn2) ) {
|
23
|
21 html = '<iframe data-video="'+url+'" width="560" height="315" src="https://www.youtube.com/embed/' + result[1];
|
22
|
22 if( result[2] )
|
|
23 html += '?start=' + result[2]
|
|
24 html += '" frameborder="0" allowfullscreen></iframe>';
|
|
25 } else if( result = url.match(bitchutePtn) ) {
|
23
|
26 html = '<iframe data-video="'+url+'" width="560" height="315" scrolling="no" frameborder="0" style="border: none;" src="https://www.bitchute.com/embed/' + result[1] + '/"></iframe>';
|
27
|
27 } else if( url.match(rumblePtn) ) {
|
|
28 html = '<iframe data-video="'+url+'" width="560" height="315" frameborder="0" allowfullscreen src="' + url + '"></iframe>';
|
22
|
29 } else {
|
23
|
30 html = '<a data-video="'+url+'" href="'+url+'">'+url+'</a>';
|
22
|
31 }
|
|
32 resolve({ html: html });
|
|
33 }
|
|
34
|
24
|
35
|
23
|
36 function tinymceSetup(editor) {
|
24
|
37
|
|
38 editor.ui.registry.addToggleButton('styleCode', {
|
|
39 icon: 'sourcecode',
|
|
40 tooltip: 'Code',
|
|
41 onAction: function(api) {
|
|
42 editor.execCommand('mceToggleFormat', false, 'code')
|
|
43 },
|
|
44 onSetup: function(api) {
|
|
45 api.setActive(editor.formatter.match('code'));
|
|
46 let changed = editor.formatter.formatChanged('code', api.setActive);
|
|
47 return function() { changed.unbind(); };
|
|
48 }
|
|
49 });
|
|
50
|
|
51 editor.ui.registry.addMenuButton('styleText', {
|
|
52 icon: 'format',
|
|
53 tooltip: 'Text',
|
|
54 fetch: function(callback) {
|
|
55 callback([
|
|
56 'fontsize',
|
|
57 'forecolor',
|
|
58 ])
|
|
59 }
|
23
|
60 });
|
26
|
61
|
|
62 editor.on( 'init', function(e) {editor.focus()} );
|
23
|
63 }
|
|
64
|
22
|
65 tinymce.init({
|
|
66 selector: 'textarea',
|
23
|
67 setup: tinymceSetup,
|
27
|
68 //menubar: false,
|
26
|
69 statusbar: false,
|
24
|
70 toolbar: 'link image media | styleCode bold italic underline strikethrough superscript styleText | blockquote numlist bullist',
|
26
|
71 plugins: ['link', 'image', 'media', 'lists', 'code', 'autoresize'],
|
|
72 autoresize_bottom_margin: 0,
|
22
|
73 link_target_list: false,
|
|
74 link_title: false,
|
|
75 image_description: false,
|
|
76 image_dimensions: false,
|
|
77 object_resizing: false,
|
|
78 contextmenu: false,
|
|
79 media_alt_source: false,
|
|
80 media_dimensions: false,
|
|
81 media_poster: false,
|
|
82 media_url_resolver: media_url_resolver,
|
|
83 text_patterns: false,
|
26
|
84 content_style: 'img {max-width: 500px;} p {margin: 0}',
|
23
|
85 //newline_behavior: 'linebreak',
|
22
|
86 extended_valid_elements: 'b,i',
|
|
87 formats: {
|
|
88 bold: { inline: 'b' },
|
|
89 italic: {inline: 'i'},
|
|
90 underline: {inline: 'u'},
|
|
91 },
|
|
92 });
|
|
93
|
|
94 function log() {
|
|
95 console.log(tinymce.activeEditor.getContent());
|
|
96 }
|
|
97 </script>
|
|
98 </head>
|
|
99 <body>
|
23
|
100 <p><a href="https://www.tiny.cloud/">TinyMCE</a></p>
|
22
|
101 <textarea></textarea>
|
|
102 <p><button onclick="log()">log</button></p>
|
|
103 </body>
|
|
104 </html>
|