annotate src/test/tiny.html @ 47:7ef9222474e2

add more button
author Franklin Schmidt <fschmidt@gmail.com>
date Mon, 14 Nov 2022 23:01:29 -0700
parents 1ac7aee13eca
children
Ignore whitespace changes - Everywhere: Within whitespace: At end of lines:
rev   line source
22
d87a8f9f43d7 tinymce work
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff changeset
1 <!doctype html>
d87a8f9f43d7 tinymce work
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff changeset
2 <html>
d87a8f9f43d7 tinymce work
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff changeset
3 <head>
d87a8f9f43d7 tinymce work
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff changeset
4 <meta name="viewport" content="width=device-width, initial-scale=1">
40
1ac7aee13eca test cleanup
Franklin Schmidt <fschmidt@gmail.com>
parents: 39
diff changeset
5 <script src="upload.js"></script>
24
fccbe5554fcc tinymce work
Franklin Schmidt <fschmidt@gmail.com>
parents: 23
diff changeset
6 <script src="http://tinymce.luan.software/tinymce.min.js" xreferrerpolicy="origin"></script>
22
d87a8f9f43d7 tinymce work
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff changeset
7 <style>
35
Franklin Schmidt <fschmidt@gmail.com>
parents: 32
diff changeset
8 input[type="file"] {
Franklin Schmidt <fschmidt@gmail.com>
parents: 32
diff changeset
9 display: none;
Franklin Schmidt <fschmidt@gmail.com>
parents: 32
diff changeset
10 }
22
d87a8f9f43d7 tinymce work
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff changeset
11 </style>
d87a8f9f43d7 tinymce work
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff changeset
12 <script>
28
d9d7aa2a79db more video types
Franklin Schmidt <fschmidt@gmail.com>
parents: 27
diff changeset
13 function videoIframe(url) {
d9d7aa2a79db more video types
Franklin Schmidt <fschmidt@gmail.com>
parents: 27
diff changeset
14 return '<iframe data-video="'+url+'" width="560" height="315" frameborder="0" allowfullscreen src="'+url+'"></iframe>';
d9d7aa2a79db more video types
Franklin Schmidt <fschmidt@gmail.com>
parents: 27
diff changeset
15 }
d9d7aa2a79db more video types
Franklin Schmidt <fschmidt@gmail.com>
parents: 27
diff changeset
16
30
8ff35379cc89 regex cleanup
Franklin Schmidt <fschmidt@gmail.com>
parents: 28
diff changeset
17 // fucking moronic javascript doesn't have \Q \E in regex
28
d9d7aa2a79db more video types
Franklin Schmidt <fschmidt@gmail.com>
parents: 27
diff changeset
18 var videoHandlers = {};
d9d7aa2a79db more video types
Franklin Schmidt <fschmidt@gmail.com>
parents: 27
diff changeset
19 {
30
8ff35379cc89 regex cleanup
Franklin Schmidt <fschmidt@gmail.com>
parents: 28
diff changeset
20 let ptn1 = /^https:\/\/youtu\.be\/([a-zA-Z0-9_-]+)(?:\?t=([0-9]+))?/;
8ff35379cc89 regex cleanup
Franklin Schmidt <fschmidt@gmail.com>
parents: 28
diff changeset
21 let ptn2 = /^https:\/\/www\.youtube\.com\/watch\?v=([a-zA-Z0-9_-]+)(?:&t=([0-9]+)s)?/;
28
d9d7aa2a79db more video types
Franklin Schmidt <fschmidt@gmail.com>
parents: 27
diff changeset
22 videoHandlers.youtube = function(url) {
d9d7aa2a79db more video types
Franklin Schmidt <fschmidt@gmail.com>
parents: 27
diff changeset
23 let result = url.match(ptn1) || url.match(ptn2);
d9d7aa2a79db more video types
Franklin Schmidt <fschmidt@gmail.com>
parents: 27
diff changeset
24 if( result ) {
d9d7aa2a79db more video types
Franklin Schmidt <fschmidt@gmail.com>
parents: 27
diff changeset
25 url = 'https://www.youtube.com/embed/' + result[1];
d9d7aa2a79db more video types
Franklin Schmidt <fschmidt@gmail.com>
parents: 27
diff changeset
26 if( result[2] )
d9d7aa2a79db more video types
Franklin Schmidt <fschmidt@gmail.com>
parents: 27
diff changeset
27 url += '?start=' + result[2];
d9d7aa2a79db more video types
Franklin Schmidt <fschmidt@gmail.com>
parents: 27
diff changeset
28 return videoIframe(url);
d9d7aa2a79db more video types
Franklin Schmidt <fschmidt@gmail.com>
parents: 27
diff changeset
29 }
d9d7aa2a79db more video types
Franklin Schmidt <fschmidt@gmail.com>
parents: 27
diff changeset
30 }
d9d7aa2a79db more video types
Franklin Schmidt <fschmidt@gmail.com>
parents: 27
diff changeset
31 }
d9d7aa2a79db more video types
Franklin Schmidt <fschmidt@gmail.com>
parents: 27
diff changeset
32 {
30
8ff35379cc89 regex cleanup
Franklin Schmidt <fschmidt@gmail.com>
parents: 28
diff changeset
33 let ptn = /^https:\/\/rumble\.com\/embed\/[a-z0-9]+\/\?pub=[a-z0-9]+/;
28
d9d7aa2a79db more video types
Franklin Schmidt <fschmidt@gmail.com>
parents: 27
diff changeset
34 videoHandlers.rumble = function(url) {
d9d7aa2a79db more video types
Franklin Schmidt <fschmidt@gmail.com>
parents: 27
diff changeset
35 if( url.match(ptn) ) {
d9d7aa2a79db more video types
Franklin Schmidt <fschmidt@gmail.com>
parents: 27
diff changeset
36 return videoIframe(url);
d9d7aa2a79db more video types
Franklin Schmidt <fschmidt@gmail.com>
parents: 27
diff changeset
37 }
d9d7aa2a79db more video types
Franklin Schmidt <fschmidt@gmail.com>
parents: 27
diff changeset
38 }
d9d7aa2a79db more video types
Franklin Schmidt <fschmidt@gmail.com>
parents: 27
diff changeset
39 }
d9d7aa2a79db more video types
Franklin Schmidt <fschmidt@gmail.com>
parents: 27
diff changeset
40 {
30
8ff35379cc89 regex cleanup
Franklin Schmidt <fschmidt@gmail.com>
parents: 28
diff changeset
41 let ptn = /^https:\/\/www\.bitchute\.com\/video\/([a-zA-Z0-9]+)\//;
28
d9d7aa2a79db more video types
Franklin Schmidt <fschmidt@gmail.com>
parents: 27
diff changeset
42 videoHandlers.bitchute = function(url) {
d9d7aa2a79db more video types
Franklin Schmidt <fschmidt@gmail.com>
parents: 27
diff changeset
43 let result = url.match(ptn);
d9d7aa2a79db more video types
Franklin Schmidt <fschmidt@gmail.com>
parents: 27
diff changeset
44 if( result ) {
d9d7aa2a79db more video types
Franklin Schmidt <fschmidt@gmail.com>
parents: 27
diff changeset
45 url = 'https://www.bitchute.com/embed/' + result[1];
d9d7aa2a79db more video types
Franklin Schmidt <fschmidt@gmail.com>
parents: 27
diff changeset
46 return videoIframe(url);
d9d7aa2a79db more video types
Franklin Schmidt <fschmidt@gmail.com>
parents: 27
diff changeset
47 }
d9d7aa2a79db more video types
Franklin Schmidt <fschmidt@gmail.com>
parents: 27
diff changeset
48 }
d9d7aa2a79db more video types
Franklin Schmidt <fschmidt@gmail.com>
parents: 27
diff changeset
49 }
d9d7aa2a79db more video types
Franklin Schmidt <fschmidt@gmail.com>
parents: 27
diff changeset
50 {
30
8ff35379cc89 regex cleanup
Franklin Schmidt <fschmidt@gmail.com>
parents: 28
diff changeset
51 let ptn = /^https:\/\/vimeo\.com\/([0-9]+)/;
28
d9d7aa2a79db more video types
Franklin Schmidt <fschmidt@gmail.com>
parents: 27
diff changeset
52 videoHandlers.vimeo = function(url) {
d9d7aa2a79db more video types
Franklin Schmidt <fschmidt@gmail.com>
parents: 27
diff changeset
53 let result = url.match(ptn);
d9d7aa2a79db more video types
Franklin Schmidt <fschmidt@gmail.com>
parents: 27
diff changeset
54 if( result ) {
d9d7aa2a79db more video types
Franklin Schmidt <fschmidt@gmail.com>
parents: 27
diff changeset
55 url = 'https://player.vimeo.com/video/' + result[1];
d9d7aa2a79db more video types
Franklin Schmidt <fschmidt@gmail.com>
parents: 27
diff changeset
56 return videoIframe(url);
d9d7aa2a79db more video types
Franklin Schmidt <fschmidt@gmail.com>
parents: 27
diff changeset
57 }
d9d7aa2a79db more video types
Franklin Schmidt <fschmidt@gmail.com>
parents: 27
diff changeset
58 }
d9d7aa2a79db more video types
Franklin Schmidt <fschmidt@gmail.com>
parents: 27
diff changeset
59 }
d9d7aa2a79db more video types
Franklin Schmidt <fschmidt@gmail.com>
parents: 27
diff changeset
60 {
30
8ff35379cc89 regex cleanup
Franklin Schmidt <fschmidt@gmail.com>
parents: 28
diff changeset
61 let ptn = /^https:\/\/dai\.ly\/([a-z0-9]+)/;
28
d9d7aa2a79db more video types
Franklin Schmidt <fschmidt@gmail.com>
parents: 27
diff changeset
62 videoHandlers.dailymotion = function(url) {
d9d7aa2a79db more video types
Franklin Schmidt <fschmidt@gmail.com>
parents: 27
diff changeset
63 let result = url.match(ptn);
d9d7aa2a79db more video types
Franklin Schmidt <fschmidt@gmail.com>
parents: 27
diff changeset
64 if( result ) {
d9d7aa2a79db more video types
Franklin Schmidt <fschmidt@gmail.com>
parents: 27
diff changeset
65 url = 'https://www.dailymotion.com/embed/video/' + result[1];
d9d7aa2a79db more video types
Franklin Schmidt <fschmidt@gmail.com>
parents: 27
diff changeset
66 return videoIframe(url);
d9d7aa2a79db more video types
Franklin Schmidt <fschmidt@gmail.com>
parents: 27
diff changeset
67 }
d9d7aa2a79db more video types
Franklin Schmidt <fschmidt@gmail.com>
parents: 27
diff changeset
68 }
d9d7aa2a79db more video types
Franklin Schmidt <fschmidt@gmail.com>
parents: 27
diff changeset
69 }
d9d7aa2a79db more video types
Franklin Schmidt <fschmidt@gmail.com>
parents: 27
diff changeset
70 {
30
8ff35379cc89 regex cleanup
Franklin Schmidt <fschmidt@gmail.com>
parents: 28
diff changeset
71 let ptn = /^https:\/\/www\.tiktok\.com\/[^/]+\/video\/([0-9]+)/;
28
d9d7aa2a79db more video types
Franklin Schmidt <fschmidt@gmail.com>
parents: 27
diff changeset
72 videoHandlers.tiktok = function(url) {
d9d7aa2a79db more video types
Franklin Schmidt <fschmidt@gmail.com>
parents: 27
diff changeset
73 let result = url.match(ptn);
d9d7aa2a79db more video types
Franklin Schmidt <fschmidt@gmail.com>
parents: 27
diff changeset
74 if( result ) {
31
6d265f5e18e2 tinymce work
Franklin Schmidt <fschmidt@gmail.com>
parents: 30
diff changeset
75 //let html = '<blockquote class="tiktok-embed" data-video="'+result[1]+'" style="max-width: 560px; margin-left: 0;"><section></section></blockquote>';
28
d9d7aa2a79db more video types
Franklin Schmidt <fschmidt@gmail.com>
parents: 27
diff changeset
76 //html += '<script async src="https://www.tiktok.com/embed.js"></'+'script>';
31
6d265f5e18e2 tinymce work
Franklin Schmidt <fschmidt@gmail.com>
parents: 30
diff changeset
77 let html = '<img data-video="'+result[1]+'" src="whataever">';
28
d9d7aa2a79db more video types
Franklin Schmidt <fschmidt@gmail.com>
parents: 27
diff changeset
78 return html;
d9d7aa2a79db more video types
Franklin Schmidt <fschmidt@gmail.com>
parents: 27
diff changeset
79 }
d9d7aa2a79db more video types
Franklin Schmidt <fschmidt@gmail.com>
parents: 27
diff changeset
80 }
d9d7aa2a79db more video types
Franklin Schmidt <fschmidt@gmail.com>
parents: 27
diff changeset
81 }
d9d7aa2a79db more video types
Franklin Schmidt <fschmidt@gmail.com>
parents: 27
diff changeset
82 {
30
8ff35379cc89 regex cleanup
Franklin Schmidt <fschmidt@gmail.com>
parents: 28
diff changeset
83 let ptn = /\.[a-zA-Z0-9]+$/;
28
d9d7aa2a79db more video types
Franklin Schmidt <fschmidt@gmail.com>
parents: 27
diff changeset
84 videoHandlers.file = function(url) {
d9d7aa2a79db more video types
Franklin Schmidt <fschmidt@gmail.com>
parents: 27
diff changeset
85 if( url.match(ptn) ) {
d9d7aa2a79db more video types
Franklin Schmidt <fschmidt@gmail.com>
parents: 27
diff changeset
86 return '<video controls width="560" height><source src="'+url+'"></video>';
d9d7aa2a79db more video types
Franklin Schmidt <fschmidt@gmail.com>
parents: 27
diff changeset
87 }
d9d7aa2a79db more video types
Franklin Schmidt <fschmidt@gmail.com>
parents: 27
diff changeset
88 }
d9d7aa2a79db more video types
Franklin Schmidt <fschmidt@gmail.com>
parents: 27
diff changeset
89 }
d9d7aa2a79db more video types
Franklin Schmidt <fschmidt@gmail.com>
parents: 27
diff changeset
90
d9d7aa2a79db more video types
Franklin Schmidt <fschmidt@gmail.com>
parents: 27
diff changeset
91 function videoUrlToHtml(url) {
d9d7aa2a79db more video types
Franklin Schmidt <fschmidt@gmail.com>
parents: 27
diff changeset
92 for (let key in videoHandlers) {
d9d7aa2a79db more video types
Franklin Schmidt <fschmidt@gmail.com>
parents: 27
diff changeset
93 let handle = videoHandlers[key];
d9d7aa2a79db more video types
Franklin Schmidt <fschmidt@gmail.com>
parents: 27
diff changeset
94 let html = handle(url);
d9d7aa2a79db more video types
Franklin Schmidt <fschmidt@gmail.com>
parents: 27
diff changeset
95 if(html) return html;
d9d7aa2a79db more video types
Franklin Schmidt <fschmidt@gmail.com>
parents: 27
diff changeset
96 }
d9d7aa2a79db more video types
Franklin Schmidt <fschmidt@gmail.com>
parents: 27
diff changeset
97 return '<a data-video="'+url+'" href="'+url+'">'+url+'</a>';
d9d7aa2a79db more video types
Franklin Schmidt <fschmidt@gmail.com>
parents: 27
diff changeset
98 }
22
d87a8f9f43d7 tinymce work
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff changeset
99
35
Franklin Schmidt <fschmidt@gmail.com>
parents: 32
diff changeset
100 function uploaded(input,url,filename) {
Franklin Schmidt <fschmidt@gmail.com>
parents: 32
diff changeset
101 input.parentNode.parentNode.querySelector('input[type="url"]').value = url;
Franklin Schmidt <fschmidt@gmail.com>
parents: 32
diff changeset
102 }
Franklin Schmidt <fschmidt@gmail.com>
parents: 32
diff changeset
103
Franklin Schmidt <fschmidt@gmail.com>
parents: 32
diff changeset
104 let imageFileHtml = '<input type=file accept="image/*" onchange="upload(this,uploaded)">';
Franklin Schmidt <fschmidt@gmail.com>
parents: 32
diff changeset
105 imageFileHtml += '<button class="tox-button tox-button--secondary" onclick="fileButtonClick(this)">Upload Image</button>';
Franklin Schmidt <fschmidt@gmail.com>
parents: 32
diff changeset
106
Franklin Schmidt <fschmidt@gmail.com>
parents: 32
diff changeset
107 let videoFileHtml = '<input type=file accept="video/*" onchange="upload(this,uploaded)">';
Franklin Schmidt <fschmidt@gmail.com>
parents: 32
diff changeset
108 videoFileHtml += '<button class="tox-button tox-button--secondary" onclick="fileButtonClick(this)">Upload Video</button>';
24
fccbe5554fcc tinymce work
Franklin Schmidt <fschmidt@gmail.com>
parents: 23
diff changeset
109
23
cdcd1b70c15e tinymce work
Franklin Schmidt <fschmidt@gmail.com>
parents: 22
diff changeset
110 function tinymceSetup(editor) {
24
fccbe5554fcc tinymce work
Franklin Schmidt <fschmidt@gmail.com>
parents: 23
diff changeset
111
35
Franklin Schmidt <fschmidt@gmail.com>
parents: 32
diff changeset
112 editor.ui.registry.addButton('insertLink', {
Franklin Schmidt <fschmidt@gmail.com>
parents: 32
diff changeset
113 icon: 'link',
Franklin Schmidt <fschmidt@gmail.com>
parents: 32
diff changeset
114 tooltip: 'Insert link',
Franklin Schmidt <fschmidt@gmail.com>
parents: 32
diff changeset
115 onAction: function(api) {
Franklin Schmidt <fschmidt@gmail.com>
parents: 32
diff changeset
116 editor.windowManager.open({
Franklin Schmidt <fschmidt@gmail.com>
parents: 32
diff changeset
117 title: 'Insert Link',
Franklin Schmidt <fschmidt@gmail.com>
parents: 32
diff changeset
118 body: {
Franklin Schmidt <fschmidt@gmail.com>
parents: 32
diff changeset
119 type: 'panel',
Franklin Schmidt <fschmidt@gmail.com>
parents: 32
diff changeset
120 items: [
Franklin Schmidt <fschmidt@gmail.com>
parents: 32
diff changeset
121 {
Franklin Schmidt <fschmidt@gmail.com>
parents: 32
diff changeset
122 type: 'urlinput',
Franklin Schmidt <fschmidt@gmail.com>
parents: 32
diff changeset
123 name: 'src',
Franklin Schmidt <fschmidt@gmail.com>
parents: 32
diff changeset
124 label: 'URL'
Franklin Schmidt <fschmidt@gmail.com>
parents: 32
diff changeset
125 },
Franklin Schmidt <fschmidt@gmail.com>
parents: 32
diff changeset
126 {
Franklin Schmidt <fschmidt@gmail.com>
parents: 32
diff changeset
127 type: 'input',
Franklin Schmidt <fschmidt@gmail.com>
parents: 32
diff changeset
128 name: 'text',
Franklin Schmidt <fschmidt@gmail.com>
parents: 32
diff changeset
129 label: 'Text to display'
Franklin Schmidt <fschmidt@gmail.com>
parents: 32
diff changeset
130 },
Franklin Schmidt <fschmidt@gmail.com>
parents: 32
diff changeset
131 ]
Franklin Schmidt <fschmidt@gmail.com>
parents: 32
diff changeset
132 },
Franklin Schmidt <fschmidt@gmail.com>
parents: 32
diff changeset
133 buttons: [
Franklin Schmidt <fschmidt@gmail.com>
parents: 32
diff changeset
134 {
Franklin Schmidt <fschmidt@gmail.com>
parents: 32
diff changeset
135 type: 'cancel',
Franklin Schmidt <fschmidt@gmail.com>
parents: 32
diff changeset
136 text: 'Cancel'
Franklin Schmidt <fschmidt@gmail.com>
parents: 32
diff changeset
137 },
Franklin Schmidt <fschmidt@gmail.com>
parents: 32
diff changeset
138 {
Franklin Schmidt <fschmidt@gmail.com>
parents: 32
diff changeset
139 type: 'submit',
Franklin Schmidt <fschmidt@gmail.com>
parents: 32
diff changeset
140 text: 'Save',
Franklin Schmidt <fschmidt@gmail.com>
parents: 32
diff changeset
141 buttonType: 'primary'
Franklin Schmidt <fschmidt@gmail.com>
parents: 32
diff changeset
142 }
Franklin Schmidt <fschmidt@gmail.com>
parents: 32
diff changeset
143 ],
Franklin Schmidt <fschmidt@gmail.com>
parents: 32
diff changeset
144 onSubmit: function(dialogApi) {
Franklin Schmidt <fschmidt@gmail.com>
parents: 32
diff changeset
145 let data = dialogApi.getData();
Franklin Schmidt <fschmidt@gmail.com>
parents: 32
diff changeset
146 let src = data.src.value;
Franklin Schmidt <fschmidt@gmail.com>
parents: 32
diff changeset
147 if(!src) return;
Franklin Schmidt <fschmidt@gmail.com>
parents: 32
diff changeset
148 src = tinymce.DOM.encode(src);
Franklin Schmidt <fschmidt@gmail.com>
parents: 32
diff changeset
149 let text = data.text;
Franklin Schmidt <fschmidt@gmail.com>
parents: 32
diff changeset
150 let html = '<a href="' + src + '">' + text + '</a>';
Franklin Schmidt <fschmidt@gmail.com>
parents: 32
diff changeset
151 dialogApi.close();
Franklin Schmidt <fschmidt@gmail.com>
parents: 32
diff changeset
152 editor.insertContent(html);
Franklin Schmidt <fschmidt@gmail.com>
parents: 32
diff changeset
153 }
Franklin Schmidt <fschmidt@gmail.com>
parents: 32
diff changeset
154 });
Franklin Schmidt <fschmidt@gmail.com>
parents: 32
diff changeset
155 },
Franklin Schmidt <fschmidt@gmail.com>
parents: 32
diff changeset
156 });
Franklin Schmidt <fschmidt@gmail.com>
parents: 32
diff changeset
157
31
6d265f5e18e2 tinymce work
Franklin Schmidt <fschmidt@gmail.com>
parents: 30
diff changeset
158 editor.ui.registry.addButton('insertImage', {
6d265f5e18e2 tinymce work
Franklin Schmidt <fschmidt@gmail.com>
parents: 30
diff changeset
159 icon: 'image',
6d265f5e18e2 tinymce work
Franklin Schmidt <fschmidt@gmail.com>
parents: 30
diff changeset
160 tooltip: 'Insert image',
6d265f5e18e2 tinymce work
Franklin Schmidt <fschmidt@gmail.com>
parents: 30
diff changeset
161 onAction: function(api) {
6d265f5e18e2 tinymce work
Franklin Schmidt <fschmidt@gmail.com>
parents: 30
diff changeset
162 editor.windowManager.open({
6d265f5e18e2 tinymce work
Franklin Schmidt <fschmidt@gmail.com>
parents: 30
diff changeset
163 title: 'Insert Image',
6d265f5e18e2 tinymce work
Franklin Schmidt <fschmidt@gmail.com>
parents: 30
diff changeset
164 body: {
6d265f5e18e2 tinymce work
Franklin Schmidt <fschmidt@gmail.com>
parents: 30
diff changeset
165 type: 'panel',
6d265f5e18e2 tinymce work
Franklin Schmidt <fschmidt@gmail.com>
parents: 30
diff changeset
166 items: [
6d265f5e18e2 tinymce work
Franklin Schmidt <fschmidt@gmail.com>
parents: 30
diff changeset
167 {
6d265f5e18e2 tinymce work
Franklin Schmidt <fschmidt@gmail.com>
parents: 30
diff changeset
168 type: 'urlinput',
6d265f5e18e2 tinymce work
Franklin Schmidt <fschmidt@gmail.com>
parents: 30
diff changeset
169 name: 'src',
6d265f5e18e2 tinymce work
Franklin Schmidt <fschmidt@gmail.com>
parents: 30
diff changeset
170 filetype: 'image',
6d265f5e18e2 tinymce work
Franklin Schmidt <fschmidt@gmail.com>
parents: 30
diff changeset
171 label: 'Source URL'
6d265f5e18e2 tinymce work
Franklin Schmidt <fschmidt@gmail.com>
parents: 30
diff changeset
172 },
35
Franklin Schmidt <fschmidt@gmail.com>
parents: 32
diff changeset
173 {
Franklin Schmidt <fschmidt@gmail.com>
parents: 32
diff changeset
174 type: 'htmlpanel',
Franklin Schmidt <fschmidt@gmail.com>
parents: 32
diff changeset
175 html: imageFileHtml
Franklin Schmidt <fschmidt@gmail.com>
parents: 32
diff changeset
176 },
31
6d265f5e18e2 tinymce work
Franklin Schmidt <fschmidt@gmail.com>
parents: 30
diff changeset
177 ]
6d265f5e18e2 tinymce work
Franklin Schmidt <fschmidt@gmail.com>
parents: 30
diff changeset
178 },
6d265f5e18e2 tinymce work
Franklin Schmidt <fschmidt@gmail.com>
parents: 30
diff changeset
179 buttons: [
6d265f5e18e2 tinymce work
Franklin Schmidt <fschmidt@gmail.com>
parents: 30
diff changeset
180 {
6d265f5e18e2 tinymce work
Franklin Schmidt <fschmidt@gmail.com>
parents: 30
diff changeset
181 type: 'cancel',
6d265f5e18e2 tinymce work
Franklin Schmidt <fschmidt@gmail.com>
parents: 30
diff changeset
182 text: 'Cancel'
6d265f5e18e2 tinymce work
Franklin Schmidt <fschmidt@gmail.com>
parents: 30
diff changeset
183 },
6d265f5e18e2 tinymce work
Franklin Schmidt <fschmidt@gmail.com>
parents: 30
diff changeset
184 {
6d265f5e18e2 tinymce work
Franklin Schmidt <fschmidt@gmail.com>
parents: 30
diff changeset
185 type: 'submit',
6d265f5e18e2 tinymce work
Franklin Schmidt <fschmidt@gmail.com>
parents: 30
diff changeset
186 text: 'Save',
6d265f5e18e2 tinymce work
Franklin Schmidt <fschmidt@gmail.com>
parents: 30
diff changeset
187 buttonType: 'primary'
6d265f5e18e2 tinymce work
Franklin Schmidt <fschmidt@gmail.com>
parents: 30
diff changeset
188 }
6d265f5e18e2 tinymce work
Franklin Schmidt <fschmidt@gmail.com>
parents: 30
diff changeset
189 ],
6d265f5e18e2 tinymce work
Franklin Schmidt <fschmidt@gmail.com>
parents: 30
diff changeset
190 onSubmit: function(dialogApi) {
35
Franklin Schmidt <fschmidt@gmail.com>
parents: 32
diff changeset
191 let src = dialogApi.getData().src.value;
31
6d265f5e18e2 tinymce work
Franklin Schmidt <fschmidt@gmail.com>
parents: 30
diff changeset
192 if(!src) return;
6d265f5e18e2 tinymce work
Franklin Schmidt <fschmidt@gmail.com>
parents: 30
diff changeset
193 src = tinymce.DOM.encode(src);
6d265f5e18e2 tinymce work
Franklin Schmidt <fschmidt@gmail.com>
parents: 30
diff changeset
194 let html = '<img src="' + src + '">';
6d265f5e18e2 tinymce work
Franklin Schmidt <fschmidt@gmail.com>
parents: 30
diff changeset
195 dialogApi.close();
6d265f5e18e2 tinymce work
Franklin Schmidt <fschmidt@gmail.com>
parents: 30
diff changeset
196 editor.insertContent(html);
6d265f5e18e2 tinymce work
Franklin Schmidt <fschmidt@gmail.com>
parents: 30
diff changeset
197 }
6d265f5e18e2 tinymce work
Franklin Schmidt <fschmidt@gmail.com>
parents: 30
diff changeset
198 });
6d265f5e18e2 tinymce work
Franklin Schmidt <fschmidt@gmail.com>
parents: 30
diff changeset
199 },
6d265f5e18e2 tinymce work
Franklin Schmidt <fschmidt@gmail.com>
parents: 30
diff changeset
200 });
6d265f5e18e2 tinymce work
Franklin Schmidt <fschmidt@gmail.com>
parents: 30
diff changeset
201
6d265f5e18e2 tinymce work
Franklin Schmidt <fschmidt@gmail.com>
parents: 30
diff changeset
202 editor.ui.registry.addButton('insertVideo', {
6d265f5e18e2 tinymce work
Franklin Schmidt <fschmidt@gmail.com>
parents: 30
diff changeset
203 icon: 'embed',
6d265f5e18e2 tinymce work
Franklin Schmidt <fschmidt@gmail.com>
parents: 30
diff changeset
204 tooltip: 'Insert video',
6d265f5e18e2 tinymce work
Franklin Schmidt <fschmidt@gmail.com>
parents: 30
diff changeset
205 onAction: function(api) {
6d265f5e18e2 tinymce work
Franklin Schmidt <fschmidt@gmail.com>
parents: 30
diff changeset
206 editor.windowManager.open({
6d265f5e18e2 tinymce work
Franklin Schmidt <fschmidt@gmail.com>
parents: 30
diff changeset
207 title: 'Insert Video',
6d265f5e18e2 tinymce work
Franklin Schmidt <fschmidt@gmail.com>
parents: 30
diff changeset
208 body: {
6d265f5e18e2 tinymce work
Franklin Schmidt <fschmidt@gmail.com>
parents: 30
diff changeset
209 type: 'panel',
6d265f5e18e2 tinymce work
Franklin Schmidt <fschmidt@gmail.com>
parents: 30
diff changeset
210 items: [
6d265f5e18e2 tinymce work
Franklin Schmidt <fschmidt@gmail.com>
parents: 30
diff changeset
211 {
6d265f5e18e2 tinymce work
Franklin Schmidt <fschmidt@gmail.com>
parents: 30
diff changeset
212 type: 'urlinput',
6d265f5e18e2 tinymce work
Franklin Schmidt <fschmidt@gmail.com>
parents: 30
diff changeset
213 name: 'src',
35
Franklin Schmidt <fschmidt@gmail.com>
parents: 32
diff changeset
214 filetype: 'media',
31
6d265f5e18e2 tinymce work
Franklin Schmidt <fschmidt@gmail.com>
parents: 30
diff changeset
215 label: 'Source URL'
6d265f5e18e2 tinymce work
Franklin Schmidt <fschmidt@gmail.com>
parents: 30
diff changeset
216 },
35
Franklin Schmidt <fschmidt@gmail.com>
parents: 32
diff changeset
217 {
Franklin Schmidt <fschmidt@gmail.com>
parents: 32
diff changeset
218 type: 'htmlpanel',
Franklin Schmidt <fschmidt@gmail.com>
parents: 32
diff changeset
219 html: videoFileHtml
Franklin Schmidt <fschmidt@gmail.com>
parents: 32
diff changeset
220 },
31
6d265f5e18e2 tinymce work
Franklin Schmidt <fschmidt@gmail.com>
parents: 30
diff changeset
221 ]
6d265f5e18e2 tinymce work
Franklin Schmidt <fschmidt@gmail.com>
parents: 30
diff changeset
222 },
6d265f5e18e2 tinymce work
Franklin Schmidt <fschmidt@gmail.com>
parents: 30
diff changeset
223 buttons: [
6d265f5e18e2 tinymce work
Franklin Schmidt <fschmidt@gmail.com>
parents: 30
diff changeset
224 {
6d265f5e18e2 tinymce work
Franklin Schmidt <fschmidt@gmail.com>
parents: 30
diff changeset
225 type: 'cancel',
6d265f5e18e2 tinymce work
Franklin Schmidt <fschmidt@gmail.com>
parents: 30
diff changeset
226 text: 'Cancel'
6d265f5e18e2 tinymce work
Franklin Schmidt <fschmidt@gmail.com>
parents: 30
diff changeset
227 },
6d265f5e18e2 tinymce work
Franklin Schmidt <fschmidt@gmail.com>
parents: 30
diff changeset
228 {
6d265f5e18e2 tinymce work
Franklin Schmidt <fschmidt@gmail.com>
parents: 30
diff changeset
229 type: 'submit',
6d265f5e18e2 tinymce work
Franklin Schmidt <fschmidt@gmail.com>
parents: 30
diff changeset
230 text: 'Save',
6d265f5e18e2 tinymce work
Franklin Schmidt <fschmidt@gmail.com>
parents: 30
diff changeset
231 buttonType: 'primary'
6d265f5e18e2 tinymce work
Franklin Schmidt <fschmidt@gmail.com>
parents: 30
diff changeset
232 }
6d265f5e18e2 tinymce work
Franklin Schmidt <fschmidt@gmail.com>
parents: 30
diff changeset
233 ],
6d265f5e18e2 tinymce work
Franklin Schmidt <fschmidt@gmail.com>
parents: 30
diff changeset
234 onSubmit: function(dialogApi) {
35
Franklin Schmidt <fschmidt@gmail.com>
parents: 32
diff changeset
235 let src = dialogApi.getData().src.value;
31
6d265f5e18e2 tinymce work
Franklin Schmidt <fschmidt@gmail.com>
parents: 30
diff changeset
236 if(!src) return;
6d265f5e18e2 tinymce work
Franklin Schmidt <fschmidt@gmail.com>
parents: 30
diff changeset
237 let html = videoUrlToHtml(src);
6d265f5e18e2 tinymce work
Franklin Schmidt <fschmidt@gmail.com>
parents: 30
diff changeset
238 //alert(html);
6d265f5e18e2 tinymce work
Franklin Schmidt <fschmidt@gmail.com>
parents: 30
diff changeset
239 dialogApi.close();
6d265f5e18e2 tinymce work
Franklin Schmidt <fschmidt@gmail.com>
parents: 30
diff changeset
240 editor.insertContent(html);
6d265f5e18e2 tinymce work
Franklin Schmidt <fschmidt@gmail.com>
parents: 30
diff changeset
241 }
6d265f5e18e2 tinymce work
Franklin Schmidt <fschmidt@gmail.com>
parents: 30
diff changeset
242 });
6d265f5e18e2 tinymce work
Franklin Schmidt <fschmidt@gmail.com>
parents: 30
diff changeset
243 },
6d265f5e18e2 tinymce work
Franklin Schmidt <fschmidt@gmail.com>
parents: 30
diff changeset
244 });
6d265f5e18e2 tinymce work
Franklin Schmidt <fschmidt@gmail.com>
parents: 30
diff changeset
245
24
fccbe5554fcc tinymce work
Franklin Schmidt <fschmidt@gmail.com>
parents: 23
diff changeset
246 editor.ui.registry.addToggleButton('styleCode', {
32
Franklin Schmidt <fschmidt@gmail.com>
parents: 31
diff changeset
247 icon: 'code-sample',
24
fccbe5554fcc tinymce work
Franklin Schmidt <fschmidt@gmail.com>
parents: 23
diff changeset
248 tooltip: 'Code',
fccbe5554fcc tinymce work
Franklin Schmidt <fschmidt@gmail.com>
parents: 23
diff changeset
249 onAction: function(api) {
31
6d265f5e18e2 tinymce work
Franklin Schmidt <fschmidt@gmail.com>
parents: 30
diff changeset
250 editor.execCommand('mceToggleFormat', false, 'code');
24
fccbe5554fcc tinymce work
Franklin Schmidt <fschmidt@gmail.com>
parents: 23
diff changeset
251 },
fccbe5554fcc tinymce work
Franklin Schmidt <fschmidt@gmail.com>
parents: 23
diff changeset
252 onSetup: function(api) {
fccbe5554fcc tinymce work
Franklin Schmidt <fschmidt@gmail.com>
parents: 23
diff changeset
253 api.setActive(editor.formatter.match('code'));
fccbe5554fcc tinymce work
Franklin Schmidt <fschmidt@gmail.com>
parents: 23
diff changeset
254 let changed = editor.formatter.formatChanged('code', api.setActive);
fccbe5554fcc tinymce work
Franklin Schmidt <fschmidt@gmail.com>
parents: 23
diff changeset
255 return function() { changed.unbind(); };
fccbe5554fcc tinymce work
Franklin Schmidt <fschmidt@gmail.com>
parents: 23
diff changeset
256 }
fccbe5554fcc tinymce work
Franklin Schmidt <fschmidt@gmail.com>
parents: 23
diff changeset
257 });
fccbe5554fcc tinymce work
Franklin Schmidt <fschmidt@gmail.com>
parents: 23
diff changeset
258
fccbe5554fcc tinymce work
Franklin Schmidt <fschmidt@gmail.com>
parents: 23
diff changeset
259 editor.ui.registry.addMenuButton('styleText', {
fccbe5554fcc tinymce work
Franklin Schmidt <fschmidt@gmail.com>
parents: 23
diff changeset
260 icon: 'format',
fccbe5554fcc tinymce work
Franklin Schmidt <fschmidt@gmail.com>
parents: 23
diff changeset
261 tooltip: 'Text',
fccbe5554fcc tinymce work
Franklin Schmidt <fschmidt@gmail.com>
parents: 23
diff changeset
262 fetch: function(callback) {
fccbe5554fcc tinymce work
Franklin Schmidt <fschmidt@gmail.com>
parents: 23
diff changeset
263 callback([
fccbe5554fcc tinymce work
Franklin Schmidt <fschmidt@gmail.com>
parents: 23
diff changeset
264 'fontsize',
fccbe5554fcc tinymce work
Franklin Schmidt <fschmidt@gmail.com>
parents: 23
diff changeset
265 'forecolor',
fccbe5554fcc tinymce work
Franklin Schmidt <fschmidt@gmail.com>
parents: 23
diff changeset
266 ])
fccbe5554fcc tinymce work
Franklin Schmidt <fschmidt@gmail.com>
parents: 23
diff changeset
267 }
23
cdcd1b70c15e tinymce work
Franklin Schmidt <fschmidt@gmail.com>
parents: 22
diff changeset
268 });
26
0837820b97fb tinymce work
Franklin Schmidt <fschmidt@gmail.com>
parents: 24
diff changeset
269
31
6d265f5e18e2 tinymce work
Franklin Schmidt <fschmidt@gmail.com>
parents: 30
diff changeset
270 editor.on( 'init', function(e) {
6d265f5e18e2 tinymce work
Franklin Schmidt <fschmidt@gmail.com>
parents: 30
diff changeset
271 editor.focus();
6d265f5e18e2 tinymce work
Franklin Schmidt <fschmidt@gmail.com>
parents: 30
diff changeset
272 } );
23
cdcd1b70c15e tinymce work
Franklin Schmidt <fschmidt@gmail.com>
parents: 22
diff changeset
273 }
cdcd1b70c15e tinymce work
Franklin Schmidt <fschmidt@gmail.com>
parents: 22
diff changeset
274
22
d87a8f9f43d7 tinymce work
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff changeset
275 tinymce.init({
d87a8f9f43d7 tinymce work
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff changeset
276 selector: 'textarea',
23
cdcd1b70c15e tinymce work
Franklin Schmidt <fschmidt@gmail.com>
parents: 22
diff changeset
277 setup: tinymceSetup,
27
6871eec2cf4c add rumble
Franklin Schmidt <fschmidt@gmail.com>
parents: 26
diff changeset
278 //menubar: false,
26
0837820b97fb tinymce work
Franklin Schmidt <fschmidt@gmail.com>
parents: 24
diff changeset
279 statusbar: false,
32
Franklin Schmidt <fschmidt@gmail.com>
parents: 31
diff changeset
280 plugins: ['link', 'image', 'media', 'lists', 'code', 'autoresize'],
35
Franklin Schmidt <fschmidt@gmail.com>
parents: 32
diff changeset
281 toolbar: 'link insertLink insertImage insertVideo | styleCode bold italic underline strikethrough superscript styleText | blockquote numlist bullist',
26
0837820b97fb tinymce work
Franklin Schmidt <fschmidt@gmail.com>
parents: 24
diff changeset
282 autoresize_bottom_margin: 0,
22
d87a8f9f43d7 tinymce work
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff changeset
283 link_target_list: false,
d87a8f9f43d7 tinymce work
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff changeset
284 link_title: false,
d87a8f9f43d7 tinymce work
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff changeset
285 object_resizing: false,
d87a8f9f43d7 tinymce work
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff changeset
286 contextmenu: false,
d87a8f9f43d7 tinymce work
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff changeset
287 text_patterns: false,
26
0837820b97fb tinymce work
Franklin Schmidt <fschmidt@gmail.com>
parents: 24
diff changeset
288 content_style: 'img {max-width: 500px;} p {margin: 0}',
22
d87a8f9f43d7 tinymce work
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff changeset
289 extended_valid_elements: 'b,i',
39
Franklin Schmidt <fschmidt@gmail.com>
parents: 35
diff changeset
290 resize: 'both',
22
d87a8f9f43d7 tinymce work
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff changeset
291 formats: {
d87a8f9f43d7 tinymce work
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff changeset
292 bold: { inline: 'b' },
d87a8f9f43d7 tinymce work
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff changeset
293 italic: {inline: 'i'},
d87a8f9f43d7 tinymce work
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff changeset
294 underline: {inline: 'u'},
d87a8f9f43d7 tinymce work
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff changeset
295 },
d87a8f9f43d7 tinymce work
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff changeset
296 });
d87a8f9f43d7 tinymce work
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff changeset
297
d87a8f9f43d7 tinymce work
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff changeset
298 function log() {
d87a8f9f43d7 tinymce work
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff changeset
299 console.log(tinymce.activeEditor.getContent());
d87a8f9f43d7 tinymce work
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff changeset
300 }
d87a8f9f43d7 tinymce work
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff changeset
301 </script>
d87a8f9f43d7 tinymce work
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff changeset
302 </head>
d87a8f9f43d7 tinymce work
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff changeset
303 <body>
35
Franklin Schmidt <fschmidt@gmail.com>
parents: 32
diff changeset
304 <p>
Franklin Schmidt <fschmidt@gmail.com>
parents: 32
diff changeset
305 <a href="https://www.tiny.cloud/">TinyMCE</a>
Franklin Schmidt <fschmidt@gmail.com>
parents: 32
diff changeset
306 <a href="https://github.com/tinymce/tinymce">source</a>
Franklin Schmidt <fschmidt@gmail.com>
parents: 32
diff changeset
307 </p>
22
d87a8f9f43d7 tinymce work
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff changeset
308 <textarea></textarea>
d87a8f9f43d7 tinymce work
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff changeset
309 <p><button onclick="log()">log</button></p>
d87a8f9f43d7 tinymce work
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff changeset
310 </body>
d87a8f9f43d7 tinymce work
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff changeset
311 </html>