From: Dan Brown Date: Tue, 8 Feb 2022 01:01:37 +0000 (+0000) Subject: Aligned some editor events, Changed wysiwyg custom styles loading X-Git-Tag: v22.02~1^2~16^2~3 X-Git-Url: http://source.bookstackapp.com/bookstack/commitdiff_plain/e0d938005591c14e1b9ad593b772ea427b8f281d Aligned some editor events, Changed wysiwyg custom styles loading - Removed old 'editor-*-update' commands to instead use the aligned 'editor::replace' command that we already have. - Changed the way custom styles are loaded for the WYSIWYG editor so we don't need an API call but instead scape content from the parent page header using comments as identifiers. Added tests to ensure comments exist and align. --- diff --git a/app/Http/Controllers/HomeController.php b/app/Http/Controllers/HomeController.php index 9e66a0640..f38bd71df 100644 --- a/app/Http/Controllers/HomeController.php +++ b/app/Http/Controllers/HomeController.php @@ -107,14 +107,6 @@ class HomeController extends Controller return view('home.default', $commonData); } - /** - * Get custom head HTML, Used in ajax calls to show in editor. - */ - public function customHeadContent() - { - return view('common.custom-head'); - } - /** * Show the view for /robots.txt. */ diff --git a/resources/js/components/markdown-editor.js b/resources/js/components/markdown-editor.js index a14047d2f..e41ab15f6 100644 --- a/resources/js/components/markdown-editor.js +++ b/resources/js/components/markdown-editor.js @@ -98,11 +98,6 @@ class MarkdownEditor { toolbarLabel.closest('.markdown-editor-wrap').classList.add('active'); }); - window.$events.listen('editor-markdown-update', value => { - this.cm.setValue(value); - this.updateAndRender(); - }); - this.codeMirrorSetup(); this.listenForBookStackEditorEvents(); diff --git a/resources/js/components/page-editor.js b/resources/js/components/page-editor.js index 5f35e6499..dae807122 100644 --- a/resources/js/components/page-editor.js +++ b/resources/js/components/page-editor.js @@ -158,8 +158,10 @@ class PageEditor { this.draftDisplay.innerText = this.editingPageText; this.toggleDiscardDraftVisibility(false); - window.$events.emit('editor-html-update', response.data.html || ''); - window.$events.emit('editor-markdown-update', response.data.markdown || response.data.html); + window.$events.emit('editor::replace', { + html: response.data.html, + markdown: response.data.markdown, + }); this.titleElem.value = response.data.name; window.setTimeout(() => { diff --git a/resources/js/wysiwyg/config.js b/resources/js/wysiwyg/config.js index f1eca3348..0b43b9c79 100644 --- a/resources/js/wysiwyg/config.js +++ b/resources/js/wysiwyg/config.js @@ -138,16 +138,16 @@ function gatherPlugins(options) { } /** - * Load custom HTML head content from the settings into the editor. - * TODO: We should be able to get this from current parent page? - * @param {Editor} editor + * Fetch custom HTML head content from the parent page head into the editor. */ -function loadCustomHeadContent(editor) { - window.$http.get(window.baseUrl('/custom-head-content')).then(resp => { - if (!resp.data) return; - let head = editor.getDoc().querySelector('head'); - head.innerHTML += resp.data; - }); +function fetchCustomHeadContent() { + const headContentLines = document.head.innerHTML.split("\n"); + const startLineIndex = headContentLines.findIndex(line => line.trim() === ''); + const endLineIndex = headContentLines.findIndex(line => line.trim() === ''); + if (startLineIndex === -1 || endLineIndex === -1) { + return '' + } + return headContentLines.slice(startLineIndex + 1, endLineIndex).join('\n'); } /** @@ -176,15 +176,6 @@ function getSetupCallback(options) { window.$events.emit('editor-html-change', content); } - // TODO - Update to standardise across both editors - // Use events within listenForBookStackEditorEvents instead (Different event signature) - window.$events.listen('editor-html-update', html => { - editor.setContent(html); - editor.selection.select(editor.getBody(), true); - editor.selection.collapse(false); - editorChange(html); - }); - // Custom handler hook window.$events.emitPublic(options.containerElement, 'editor-tinymce::setup', {editor}); @@ -253,7 +244,9 @@ export function build(options) { } }, init_instance_callback(editor) { - loadCustomHeadContent(editor); + let head = editor.getDoc().querySelector('head'); + console.log(fetchCustomHeadContent()); + head.innerHTML += fetchCustomHeadContent(); }, setup(editor) { for (const [key, config] of Object.entries(toolBarGroupButtons)) { diff --git a/resources/views/common/custom-head.blade.php b/resources/views/common/custom-head.blade.php index 6f88bd43f..7f2e93cdc 100644 --- a/resources/views/common/custom-head.blade.php +++ b/resources/views/common/custom-head.blade.php @@ -1,7 +1,7 @@ @inject('headContent', 'BookStack\Theming\CustomHtmlHeadContentProvider') @if(setting('app-custom-head') && \Route::currentRouteName() !== 'settings') - + {!! $headContent->forWeb() !!} - + @endif \ No newline at end of file diff --git a/routes/web.php b/routes/web.php index 7a12acc31..ad4fb9067 100644 --- a/routes/web.php +++ b/routes/web.php @@ -206,7 +206,6 @@ Route::middleware('auth')->group(function () { // Other Pages Route::get('/', [HomeController::class, 'index']); Route::get('/home', [HomeController::class, 'index']); - Route::get('/custom-head-content', [HomeController::class, 'customHeadContent']); // Settings Route::get('/settings', [SettingController::class, 'index'])->name('settings'); diff --git a/tests/Settings/CustomHeadContentTest.php b/tests/Settings/CustomHeadContentTest.php index 36c8a4c0f..eeeab3f45 100644 --- a/tests/Settings/CustomHeadContentTest.php +++ b/tests/Settings/CustomHeadContentTest.php @@ -14,6 +14,15 @@ class CustomHeadContentTest extends TestCase $resp->assertSee('console.log("cat")', false); } + public function test_content_wrapped_in_specific_html_comments() + { + // These comments are used to identify head content for editor injection + $this->setSettings(['app-custom-head' => '']); + $resp = $this->get('/login'); + $resp->assertSee('', false); + $resp->assertSee('', false); + } + public function test_configured_content_does_not_show_on_settings_page() { $this->setSettings(['app-custom-head' => '']);