Mercurial Hosting > freedit
changeset 35:1ce75c5ab0f7
minor
author | Franklin Schmidt <fschmidt@gmail.com> |
---|---|
date | Wed, 03 Aug 2022 14:13:12 -0600 |
parents | c8d47981c74f |
children | b54e9e2212b7 |
files | src/site.js src/test/tiny.html src/test/upload.html src/thread.html.luan |
diffstat | 4 files changed, 83 insertions(+), 16 deletions(-) [+] |
line wrap: on
line diff
--- a/src/site.js Tue Aug 02 20:46:02 2022 -0600 +++ b/src/site.js Wed Aug 03 14:13:12 2022 -0600 @@ -52,7 +52,7 @@ let response = JSON.parse(request.responseText); let filename = file.name; let url = 'https://ucarecdn.com/' + response.file + '/' + filename; - callback(url,filename); + callback(input,url,filename); }; let formData = new FormData(); formData.append( 'UPLOADCARE_PUB_KEY', 'fe3d30f3088a50941d45' );
--- a/src/test/tiny.html Tue Aug 02 20:46:02 2022 -0600 +++ b/src/test/tiny.html Wed Aug 03 14:13:12 2022 -0600 @@ -2,8 +2,12 @@ <html> <head> <meta name="viewport" content="width=device-width, initial-scale=1"> + <script src="/site.js"></script> <script src="http://tinymce.luan.software/tinymce.min.js" xreferrerpolicy="origin"></script> <style> + input[type="file"] { + display: none; + } </style> <script> function videoIframe(url) { @@ -93,9 +97,64 @@ return '<a data-video="'+url+'" href="'+url+'">'+url+'</a>'; } + function uploaded(input,url,filename) { + input.parentNode.parentNode.querySelector('input[type="url"]').value = url; + } + + let imageFileHtml = '<input type=file accept="image/*" onchange="upload(this,uploaded)">'; + imageFileHtml += '<button class="tox-button tox-button--secondary" onclick="fileButtonClick(this)">Upload Image</button>'; + + let videoFileHtml = '<input type=file accept="video/*" onchange="upload(this,uploaded)">'; + videoFileHtml += '<button class="tox-button tox-button--secondary" onclick="fileButtonClick(this)">Upload Video</button>'; function tinymceSetup(editor) { + editor.ui.registry.addButton('insertLink', { + icon: 'link', + tooltip: 'Insert link', + onAction: function(api) { + editor.windowManager.open({ + title: 'Insert Link', + body: { + type: 'panel', + items: [ + { + type: 'urlinput', + name: 'src', + label: 'URL' + }, + { + type: 'input', + name: 'text', + label: 'Text to display' + }, + ] + }, + buttons: [ + { + type: 'cancel', + text: 'Cancel' + }, + { + type: 'submit', + text: 'Save', + buttonType: 'primary' + } + ], + onSubmit: function(dialogApi) { + let data = dialogApi.getData(); + let src = data.src.value; + if(!src) return; + src = tinymce.DOM.encode(src); + let text = data.text; + let html = '<a href="' + src + '">' + text + '</a>'; + dialogApi.close(); + editor.insertContent(html); + } + }); + }, + }); + editor.ui.registry.addButton('insertImage', { icon: 'image', tooltip: 'Insert image', @@ -111,6 +170,10 @@ filetype: 'image', label: 'Source URL' }, + { + type: 'htmlpanel', + html: imageFileHtml + }, ] }, buttons: [ @@ -125,7 +188,7 @@ } ], onSubmit: function(dialogApi) { - let src = dialogApi.getData('src').src.value; + let src = dialogApi.getData().src.value; if(!src) return; src = tinymce.DOM.encode(src); let html = '<img src="' + src + '">'; @@ -148,9 +211,13 @@ { type: 'urlinput', name: 'src', - filetype: 'image', + filetype: 'media', label: 'Source URL' }, + { + type: 'htmlpanel', + html: videoFileHtml + }, ] }, buttons: [ @@ -165,7 +232,7 @@ } ], onSubmit: function(dialogApi) { - let src = dialogApi.getData('src').src.value; + let src = dialogApi.getData().src.value; if(!src) return; let html = videoUrlToHtml(src); //alert(html); @@ -211,7 +278,7 @@ //menubar: false, statusbar: false, plugins: ['link', 'image', 'media', 'lists', 'code', 'autoresize'], - toolbar: 'link insertImage insertVideo | styleCode bold italic underline strikethrough superscript styleText | blockquote numlist bullist', + toolbar: 'link insertLink insertImage insertVideo | styleCode bold italic underline strikethrough superscript styleText | blockquote numlist bullist', autoresize_bottom_margin: 0, link_target_list: false, link_title: false, @@ -233,7 +300,10 @@ </script> </head> <body> - <p><a href="https://www.tiny.cloud/">TinyMCE</a></p> + <p> + <a href="https://www.tiny.cloud/">TinyMCE</a> + <a href="https://github.com/tinymce/tinymce">source</a> + </p> <textarea></textarea> <p><button onclick="log()">log</button></p> </body>
--- a/src/test/upload.html Tue Aug 02 20:46:02 2022 -0600 +++ b/src/test/upload.html Wed Aug 03 14:13:12 2022 -0600 @@ -7,7 +7,7 @@ </style> <script src="/site.js"></script> <script> - function uploaded(url,filename) { + function uploaded(input,url,filename) { console.log(url); let a = document.querySelector('a'); a.textContent = filename;
--- a/src/thread.html.luan Tue Aug 02 20:46:02 2022 -0600 +++ b/src/thread.html.luan Wed Aug 03 14:13:12 2022 -0600 @@ -84,14 +84,11 @@ ajax('save_edit.js',postData); } - function gotFile(input) { - function uploaded(url,filename) { - let postDiv = getPostDiv(input); - let textarea = postDiv.querySelector('textarea'); - textarea.focus(); - textarea.setRangeText(url,textarea.selectionStart,textarea.selectionEnd,'select'); - } - upload(input,uploaded); + function uploaded(input,url,filename) { + let postDiv = getPostDiv(input); + let textarea = postDiv.querySelector('textarea'); + textarea.focus(); + textarea.setRangeText(url,textarea.selectionStart,textarea.selectionEnd,'select'); } function deletePost(span) { @@ -152,7 +149,7 @@ <div hidden edit> <textarea></textarea> <p> - <input type=file onchange="gotFile(this)"> + <input type=file onchange="upload(this,uploaded)"> <button onclick="fileButtonClick(this)">Upload File</button> <button onclick="saveEdit(this)">save</button> <button onclick="cancelEdit(this)">cancel</button>