From 4a2f4cfcefe7d205eab902cc5fd4aabdff653c9b Mon Sep 17 00:00:00 2001 From: panr Date: Tue, 24 Mar 2020 13:19:03 +0100 Subject: [PATCH 1/3] Add more buttons to the Table snippet toolbar --- docs/_snippets/features/build-table-source.js | 8 ++++---- docs/_snippets/features/table-styling-colors.js | 16 +++++++++++++++- docs/_snippets/features/table-styling.js | 16 +++++++++++++++- docs/_snippets/features/table.js | 16 +++++++++++++++- 4 files changed, 49 insertions(+), 7 deletions(-) diff --git a/docs/_snippets/features/build-table-source.js b/docs/_snippets/features/build-table-source.js index b75aa557..980ec668 100644 --- a/docs/_snippets/features/build-table-source.js +++ b/docs/_snippets/features/build-table-source.js @@ -7,13 +7,13 @@ import ClassicEditor from '@ckeditor/ckeditor5-build-classic/src/ckeditor'; -import Table from '@ckeditor/ckeditor5-table/src/table'; -import TableToolbar from '@ckeditor/ckeditor5-table/src/tabletoolbar'; +import FontFamily from '@ckeditor/ckeditor5-font/src/fontfamily'; +import FontSize from '@ckeditor/ckeditor5-font/src/fontsize'; +import Alignment from '@ckeditor/ckeditor5-alignment/src/alignment'; import TableProperties from '@ckeditor/ckeditor5-table/src/tableproperties'; import TableCellProperties from '@ckeditor/ckeditor5-table/src/tablecellproperties'; -ClassicEditor.builtinPlugins.push( Table ); -ClassicEditor.builtinPlugins.push( TableToolbar ); +ClassicEditor.builtinPlugins.push( FontFamily, FontSize, Alignment ); window.ClassicEditor = ClassicEditor; window.CKEditorPlugins = { diff --git a/docs/_snippets/features/table-styling-colors.js b/docs/_snippets/features/table-styling-colors.js index e99cbb1b..51a4795e 100644 --- a/docs/_snippets/features/table-styling-colors.js +++ b/docs/_snippets/features/table-styling-colors.js @@ -99,7 +99,21 @@ ClassicEditor cloudServices: CS_CONFIG, toolbar: { items: [ - 'insertTable', '|', 'heading', '|', 'bold', 'italic', '|', 'undo', 'redo' + 'insertTable', + '|', + 'fontFamily', 'fontSize', + '|', + 'bold', 'italic', + '|', + 'alignment:left', 'alignment:center', 'alignment:right', 'alignment:justify', + '|', + 'bulletedList', 'numberedList', + '|', + 'indent', 'outdent', + '|', + 'link', 'blockQuote', + '|', + 'undo', 'redo' ], viewportTopOffset: window.getViewportTopOffsetConfig() }, diff --git a/docs/_snippets/features/table-styling.js b/docs/_snippets/features/table-styling.js index 8ca4e93e..1ed9f017 100644 --- a/docs/_snippets/features/table-styling.js +++ b/docs/_snippets/features/table-styling.js @@ -100,7 +100,21 @@ ClassicEditor cloudServices: CS_CONFIG, toolbar: { items: [ - 'insertTable', '|', 'heading', '|', 'bold', 'italic', '|', 'undo', 'redo' + 'insertTable', + '|', + 'fontFamily', 'fontSize', + '|', + 'bold', 'italic', + '|', + 'alignment:left', 'alignment:center', 'alignment:right', 'alignment:justify', + '|', + 'bulletedList', 'numberedList', + '|', + 'indent', 'outdent', + '|', + 'link', 'blockQuote', + '|', + 'undo', 'redo' ], viewportTopOffset: window.getViewportTopOffsetConfig() }, diff --git a/docs/_snippets/features/table.js b/docs/_snippets/features/table.js index bcd64066..ecc03173 100644 --- a/docs/_snippets/features/table.js +++ b/docs/_snippets/features/table.js @@ -12,7 +12,21 @@ ClassicEditor cloudServices: CS_CONFIG, toolbar: { items: [ - 'insertTable', '|', 'heading', '|', 'bold', 'italic', '|', 'undo', 'redo' + 'insertTable', + '|', + 'fontFamily', 'fontSize', + '|', + 'bold', 'italic', + '|', + 'alignment:left', 'alignment:center', 'alignment:right', 'alignment:justify', + '|', + 'bulletedList', 'numberedList', + '|', + 'indent', 'outdent', + '|', + 'link', 'blockQuote', + '|', + 'undo', 'redo' ], viewportTopOffset: window.getViewportTopOffsetConfig() }, From 62da9fa746e393676a50bccd9865bf61cae1fe24 Mon Sep 17 00:00:00 2001 From: panr Date: Tue, 24 Mar 2020 13:24:18 +0100 Subject: [PATCH 2/3] Fix whitespaces --- docs/_snippets/features/table-styling-colors.js | 2 +- docs/_snippets/features/table-styling.js | 2 +- docs/_snippets/features/table.js | 2 +- 3 files changed, 3 insertions(+), 3 deletions(-) diff --git a/docs/_snippets/features/table-styling-colors.js b/docs/_snippets/features/table-styling-colors.js index 51a4795e..639e73f4 100644 --- a/docs/_snippets/features/table-styling-colors.js +++ b/docs/_snippets/features/table-styling-colors.js @@ -105,7 +105,7 @@ ClassicEditor '|', 'bold', 'italic', '|', - 'alignment:left', 'alignment:center', 'alignment:right', 'alignment:justify', + 'alignment:left', 'alignment:center', 'alignment:right', 'alignment:justify', '|', 'bulletedList', 'numberedList', '|', diff --git a/docs/_snippets/features/table-styling.js b/docs/_snippets/features/table-styling.js index 1ed9f017..8f2ed21a 100644 --- a/docs/_snippets/features/table-styling.js +++ b/docs/_snippets/features/table-styling.js @@ -106,7 +106,7 @@ ClassicEditor '|', 'bold', 'italic', '|', - 'alignment:left', 'alignment:center', 'alignment:right', 'alignment:justify', + 'alignment:left', 'alignment:center', 'alignment:right', 'alignment:justify', '|', 'bulletedList', 'numberedList', '|', diff --git a/docs/_snippets/features/table.js b/docs/_snippets/features/table.js index ecc03173..8366b389 100644 --- a/docs/_snippets/features/table.js +++ b/docs/_snippets/features/table.js @@ -18,7 +18,7 @@ ClassicEditor '|', 'bold', 'italic', '|', - 'alignment:left', 'alignment:center', 'alignment:right', 'alignment:justify', + 'alignment:left', 'alignment:center', 'alignment:right', 'alignment:justify', '|', 'bulletedList', 'numberedList', '|', From 3c75814f2adcf3464f973b81c4070b0fc6e162cb Mon Sep 17 00:00:00 2001 From: panr Date: Wed, 25 Mar 2020 09:11:35 +0100 Subject: [PATCH 3/3] Add IndentBlock plugin & make editor config simpler --- docs/_snippets/features/build-table-source.js | 29 ++++++++++++++++++- .../features/table-styling-colors.js | 23 --------------- docs/_snippets/features/table-styling.js | 23 --------------- docs/_snippets/features/table.js | 23 --------------- 4 files changed, 28 insertions(+), 70 deletions(-) diff --git a/docs/_snippets/features/build-table-source.js b/docs/_snippets/features/build-table-source.js index 980ec668..ca75518f 100644 --- a/docs/_snippets/features/build-table-source.js +++ b/docs/_snippets/features/build-table-source.js @@ -10,10 +10,37 @@ import ClassicEditor from '@ckeditor/ckeditor5-build-classic/src/ckeditor'; import FontFamily from '@ckeditor/ckeditor5-font/src/fontfamily'; import FontSize from '@ckeditor/ckeditor5-font/src/fontsize'; import Alignment from '@ckeditor/ckeditor5-alignment/src/alignment'; +import IndentBlock from '@ckeditor/ckeditor5-indent/src/indentblock'; import TableProperties from '@ckeditor/ckeditor5-table/src/tableproperties'; import TableCellProperties from '@ckeditor/ckeditor5-table/src/tablecellproperties'; -ClassicEditor.builtinPlugins.push( FontFamily, FontSize, Alignment ); +import { CS_CONFIG } from '@ckeditor/ckeditor5-cloud-services/tests/_utils/cloud-services-config'; + +ClassicEditor.builtinPlugins.push( FontFamily, FontSize, Alignment, IndentBlock ); +ClassicEditor.defaultConfig = { + cloudServices: CS_CONFIG, + toolbar: { + items: [ + 'insertTable', + '|', + 'fontFamily', 'fontSize', + '|', + 'bold', 'italic', + '|', + 'alignment:left', 'alignment:center', 'alignment:right', 'alignment:justify', + '|', + 'bulletedList', 'numberedList', + '|', + 'indent', 'outdent', + '|', + 'link', 'blockQuote', + '|', + 'undo', 'redo' + ], + viewportTopOffset: window.getViewportTopOffsetConfig() + }, + indentBlock: { offset: 30, unit: 'px' } +}; window.ClassicEditor = ClassicEditor; window.CKEditorPlugins = { diff --git a/docs/_snippets/features/table-styling-colors.js b/docs/_snippets/features/table-styling-colors.js index 639e73f4..0d13f1a1 100644 --- a/docs/_snippets/features/table-styling-colors.js +++ b/docs/_snippets/features/table-styling-colors.js @@ -5,8 +5,6 @@ /* globals ClassicEditor, CKEditorPlugins, console, window, document */ -import { CS_CONFIG } from '@ckeditor/ckeditor5-cloud-services/tests/_utils/cloud-services-config'; - const customColorPalette = [ { color: 'hsl(4, 90%, 58%)', @@ -96,27 +94,6 @@ ClassicEditor CKEditorPlugins.TableProperties, CKEditorPlugins.TableCellProperties ], - cloudServices: CS_CONFIG, - toolbar: { - items: [ - 'insertTable', - '|', - 'fontFamily', 'fontSize', - '|', - 'bold', 'italic', - '|', - 'alignment:left', 'alignment:center', 'alignment:right', 'alignment:justify', - '|', - 'bulletedList', 'numberedList', - '|', - 'indent', 'outdent', - '|', - 'link', 'blockQuote', - '|', - 'undo', 'redo' - ], - viewportTopOffset: window.getViewportTopOffsetConfig() - }, table: { contentToolbar: [ 'tableColumn', 'tableRow', 'mergeTableCells', 'tableProperties', 'tableCellProperties' ], tableProperties: { diff --git a/docs/_snippets/features/table-styling.js b/docs/_snippets/features/table-styling.js index 8f2ed21a..c8f4a97e 100644 --- a/docs/_snippets/features/table-styling.js +++ b/docs/_snippets/features/table-styling.js @@ -5,8 +5,6 @@ /* globals ClassicEditor, CKEditorPlugins, console, window, document */ -import { CS_CONFIG } from '@ckeditor/ckeditor5-cloud-services/tests/_utils/cloud-services-config'; - const COLOR_PALETTE = [ { color: 'hsl(0, 0%, 0%)', @@ -97,27 +95,6 @@ ClassicEditor CKEditorPlugins.TableProperties, CKEditorPlugins.TableCellProperties ], - cloudServices: CS_CONFIG, - toolbar: { - items: [ - 'insertTable', - '|', - 'fontFamily', 'fontSize', - '|', - 'bold', 'italic', - '|', - 'alignment:left', 'alignment:center', 'alignment:right', 'alignment:justify', - '|', - 'bulletedList', 'numberedList', - '|', - 'indent', 'outdent', - '|', - 'link', 'blockQuote', - '|', - 'undo', 'redo' - ], - viewportTopOffset: window.getViewportTopOffsetConfig() - }, table: { contentToolbar: [ 'tableColumn', 'tableRow', 'mergeTableCells', 'tableProperties', 'tableCellProperties' ], tableProperties: { diff --git a/docs/_snippets/features/table.js b/docs/_snippets/features/table.js index 8366b389..74ccb4b0 100644 --- a/docs/_snippets/features/table.js +++ b/docs/_snippets/features/table.js @@ -5,31 +5,8 @@ /* globals ClassicEditor, console, window, document */ -import { CS_CONFIG } from '@ckeditor/ckeditor5-cloud-services/tests/_utils/cloud-services-config'; - ClassicEditor .create( document.querySelector( '#snippet-table' ), { - cloudServices: CS_CONFIG, - toolbar: { - items: [ - 'insertTable', - '|', - 'fontFamily', 'fontSize', - '|', - 'bold', 'italic', - '|', - 'alignment:left', 'alignment:center', 'alignment:right', 'alignment:justify', - '|', - 'bulletedList', 'numberedList', - '|', - 'indent', 'outdent', - '|', - 'link', 'blockQuote', - '|', - 'undo', 'redo' - ], - viewportTopOffset: window.getViewportTopOffsetConfig() - }, table: { contentToolbar: [ 'tableColumn', 'tableRow', 'mergeTableCells' ] }