Skip to content

Commit

Permalink
Converted the feature-rich demo to NIM.
Browse files Browse the repository at this point in the history
  • Loading branch information
Reinmar committed May 22, 2024
1 parent e889756 commit 19f9dbe
Show file tree
Hide file tree
Showing 3 changed files with 134 additions and 175 deletions.
4 changes: 2 additions & 2 deletions feature-rich/index.html
Original file line number Diff line number Diff line change
Expand Up @@ -238,7 +238,7 @@ <h2>🚀 Autoformatting in CKEditor 5</h2>
</div>
</div>

<script src="https://cdn.ckbox.io/CKBox/2.0.0/ckbox.js"></script>
<script src="./dist/main.js"></script>
<script src="https://cdn.ckbox.io/CKBox/2.4.0/ckbox.js"></script>
<script type="module" src="index.js"></script>
</body>
</html>
210 changes: 115 additions & 95 deletions feature-rich/index.js
Original file line number Diff line number Diff line change
Expand Up @@ -3,85 +3,109 @@
* For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
*/

// Productivity features require license key to work properly, you can get a trial license key: https://orders.ckeditor.com/trial/premium-features?feature=pagination
const PRODUCTIVITY_PACK_LICENSE_KEY = '';
// CKEditor Commercial Features require a license key to work properly.
// * You can get a trial license key: https://orders.ckeditor.com/trial/premium-features
// * Or you can comment out (disable) the plugins imported from the "ckeditor5-premium-features" package.
const EDITOR_LICENSE_KEY = '';

/* You must provide a valid token URL in order to use the CKBox application.
After registering to CKBox, the fastest way to try out CKBox is to use the development token endpoint:
https://ckeditor.com/docs/ckbox/latest/guides/configuration/authentication.html#token-endpoint */
if ( !EDITOR_LICENSE_KEY ) {
alert(
'CKEditor Commercial Features included in this demo require a license key.\n' +
'Check the index.js file for more information.'
);
}

// You must provide a valid token URL in order to use the CKBox application.
// * After signing up for a trial, the fastest way to try out CKBox is to use the development token endpoint:
// https://ckeditor.com/docs/ckbox/latest/guides/configuration/authentication.html#token-endpoint
// * Or you can comment out (disable) the CKBox plugin.
const CKBOX_TOKEN_URL = '';

if ( !CKBOX_TOKEN_URL ) {
alert(
'CKBox included in this demo require a valid token URL.\n' +
'Check the index.js file for more information.'
);
}

// Put your Web Spell Checker license key here, for more info how to get the key see [LINK].
const WEB_SPELL_CHECKER_LICENSE_KEY = '';

import ClassicEditor from '@ckeditor/ckeditor5-editor-classic/src/classiceditor';
// Import editor styles. They will be bundled by Vite.
import 'ckeditor5/index.css';

import UploadAdapter from '@ckeditor/ckeditor5-adapter-ckfinder/src/uploadadapter';
import Alignment from '@ckeditor/ckeditor5-alignment/src/alignment';
import Autoformat from '@ckeditor/ckeditor5-autoformat/src/autoformat';
import Bold from '@ckeditor/ckeditor5-basic-styles/src/bold';
import CKBox from '@ckeditor/ckeditor5-ckbox/src/ckbox';
import Code from '@ckeditor/ckeditor5-basic-styles/src/code';
import Italic from '@ckeditor/ckeditor5-basic-styles/src/italic';
import Strikethrough from '@ckeditor/ckeditor5-basic-styles/src/strikethrough';
import Subscript from '@ckeditor/ckeditor5-basic-styles/src/subscript';
import Superscript from '@ckeditor/ckeditor5-basic-styles/src/superscript';
import Underline from '@ckeditor/ckeditor5-basic-styles/src/underline';
import BlockQuote from '@ckeditor/ckeditor5-block-quote/src/blockquote';
import CloudServices from '@ckeditor/ckeditor5-cloud-services/src/cloudservices.js';
import CodeBlock from '@ckeditor/ckeditor5-code-block/src/codeblock';
import Essentials from '@ckeditor/ckeditor5-essentials/src/essentials';
import ExportPdf from '@ckeditor/ckeditor5-export-pdf/src/exportpdf';
import ExportWord from '@ckeditor/ckeditor5-export-word/src/exportword';
import FindAndReplace from '@ckeditor/ckeditor5-find-and-replace/src/findandreplace';
import Font from '@ckeditor/ckeditor5-font/src/font';
import Heading from '@ckeditor/ckeditor5-heading/src/heading';
import Highlight from '@ckeditor/ckeditor5-highlight/src/highlight';
import HorizontalLine from '@ckeditor/ckeditor5-horizontal-line/src/horizontalline';
import GeneralHtmlSupport from '@ckeditor/ckeditor5-html-support/src/generalhtmlsupport';
import AutoImage from '@ckeditor/ckeditor5-image/src/autoimage';
import Image from '@ckeditor/ckeditor5-image/src/image';
import ImageCaption from '@ckeditor/ckeditor5-image/src/imagecaption';
import ImageInsert from '@ckeditor/ckeditor5-image/src/imageinsert';
import ImageResize from '@ckeditor/ckeditor5-image/src/imageresize';
import ImageStyle from '@ckeditor/ckeditor5-image/src/imagestyle';
import ImageToolbar from '@ckeditor/ckeditor5-image/src/imagetoolbar';
import ImageUpload from '@ckeditor/ckeditor5-image/src/imageupload';
import Base64UploadAdapter from '@ckeditor/ckeditor5-upload/src/adapters/base64uploadadapter';
import PictureEditing from '@ckeditor/ckeditor5-image/src/pictureediting';
import ImportWord from '@ckeditor/ckeditor5-import-word/src/importword';
import Indent from '@ckeditor/ckeditor5-indent/src/indent';
import IndentBlock from '@ckeditor/ckeditor5-indent/src/indentblock';
import TextPartLanguage from '@ckeditor/ckeditor5-language/src/textpartlanguage';
import AutoLink from '@ckeditor/ckeditor5-link/src/autolink';
import Link from '@ckeditor/ckeditor5-link/src/link';
import LinkImage from '@ckeditor/ckeditor5-link/src/linkimage';
import List from '@ckeditor/ckeditor5-list/src/list';
import ListProperties from '@ckeditor/ckeditor5-list/src/listproperties';
import TodoList from '@ckeditor/ckeditor5-list/src/todolist';
import MediaEmbed from '@ckeditor/ckeditor5-media-embed/src/mediaembed';
import Mention from '@ckeditor/ckeditor5-mention/src/mention';
import PageBreak from '@ckeditor/ckeditor5-page-break/src/pagebreak';
import Paragraph from '@ckeditor/ckeditor5-paragraph/src/paragraph';
import PasteFromOffice from '@ckeditor/ckeditor5-paste-from-office/src/pastefromoffice';
import RemoveFormat from '@ckeditor/ckeditor5-remove-format/src/removeformat';
import SpecialCharacters from '@ckeditor/ckeditor5-special-characters/src/specialcharacters';
import SpecialCharactersEssentials from '@ckeditor/ckeditor5-special-characters/src/specialcharactersessentials';
import Style from '@ckeditor/ckeditor5-style/src/style';
import Table from '@ckeditor/ckeditor5-table/src/table';
import TableCaption from '@ckeditor/ckeditor5-table/src/tablecaption';
import TableCellProperties from '@ckeditor/ckeditor5-table/src/tablecellproperties';
import TableColumnResize from '@ckeditor/ckeditor5-table/src/tablecolumnresize';
import TableProperties from '@ckeditor/ckeditor5-table/src/tableproperties';
import TableToolbar from '@ckeditor/ckeditor5-table/src/tabletoolbar';
import TextTransformation from '@ckeditor/ckeditor5-typing/src/texttransformation';
import WordCount from '@ckeditor/ckeditor5-word-count/src/wordcount';
import WProofreader from '@webspellchecker/wproofreader-ckeditor5/src/wproofreader';
// Productivity Pack features
import Template from '@ckeditor/ckeditor5-template/src/template';
import TableOfContents from '@ckeditor/ckeditor5-document-outline/src/tableofcontents';
import FormatPainter from '@ckeditor/ckeditor5-format-painter/src/formatpainter';
import SlashCommand from '@ckeditor/ckeditor5-slash-command/src/slashcommand';
import {
ClassicEditor,
Alignment,
Autoformat,
Bold,
CKBox,
Code,
Italic,
Strikethrough,
Subscript,
Superscript,
Underline,
BlockQuote,
CloudServices,
CodeBlock,
Essentials,
FindAndReplace,
Font,
Heading,
Highlight,
HorizontalLine,
GeneralHtmlSupport,
AutoImage,
Image,
ImageCaption,
ImageInsert,
ImageResize,
ImageStyle,
ImageToolbar,
ImageUpload,
Base64UploadAdapter,
PictureEditing,
Indent,
IndentBlock,
TextPartLanguage,
AutoLink,
Link,
LinkImage,
List,
ListProperties,
TodoList,
MediaEmbed,
Mention,
PageBreak,
Paragraph,
PasteFromOffice,
RemoveFormat,
SpecialCharacters,
SpecialCharactersEssentials,
Style,
Table,
TableCaption,
TableCellProperties,
TableColumnResize,
TableProperties,
TableToolbar,
TextTransformation,
WordCount,
} from 'ckeditor5';

import {
ExportPdf,
ExportWord,
FormatPainter,
ImportWord,
SlashCommand,
TableOfContents,
Template,
} from 'ckeditor5-premium-features';

// TODO
// import { WProofreader } from '@webspellchecker/wproofreader-ckeditor5';

const exportHorizontalSpace = '10mm';
const exportVerticalSpace = '12mm';
Expand Down Expand Up @@ -495,10 +519,7 @@ ClassicEditor.create(document.querySelector('#cke5-feature-rich-demo'), {
AutoLink,
BlockQuote,
Bold,
/* You must provide a valid token URL in order to use the CKBox application.
After registering to CKBox, the fastest way to try out CKBox is to use the development token endpoint:
https://ckeditor.com/docs/ckbox/latest/guides/configuration/authentication.html#token-endpoint */
// CKBox,
CKBox,
CloudServices,
Code,
CodeBlock,
Expand All @@ -519,7 +540,6 @@ ClassicEditor.create(document.querySelector('#cke5-feature-rich-demo'), {
ImageToolbar,
ImageUpload,
Base64UploadAdapter,
ImportWord,
Indent,
IndentBlock,
Italic,
Expand Down Expand Up @@ -551,15 +571,18 @@ ClassicEditor.create(document.querySelector('#cke5-feature-rich-demo'), {
TextTransformation,
TodoList,
Underline,
UploadAdapter,
WordCount,
WProofreader,
// SlashCommand,
// Template,
// FormatPainter,
// TableOfContents,

// TODO
// WProofreader,

SlashCommand,
Template,
FormatPainter,
TableOfContents,
ImportWord,
],
licenseKey: PRODUCTIVITY_PACK_LICENSE_KEY,
licenseKey: EDITOR_LICENSE_KEY,
toolbar: {
shouldNotGroupWhenFull: true,
items: [
Expand All @@ -573,22 +596,19 @@ ClassicEditor.create(document.querySelector('#cke5-feature-rich-demo'), {
'|',
'findAndReplace',
'selectAll',
'wproofreader',
// TODO
// 'wproofreader',
'|',
'insertTemplate',
'tableOfContents',
'|',
'formatPainter',
'|',
// 'insertTemplate',
// 'tableOfContents',
// '|',
// 'formatPainter',
// '|',

// --- "Insertables" ----------------------------------------------------------------------------

'link',
'insertImage',
/* You must provide a valid token URL in order to use the CKBox application.
After registering to CKBox, the fastest way to try out CKBox is to use the development token endpoint:
https://ckeditor.com/docs/ckbox/latest/guides/configuration/authentication.html#token-endpoint*/
// 'ckbox',
'ckbox',
'insertTable',
'blockQuote',
'mediaEmbed',
Expand Down
95 changes: 17 additions & 78 deletions feature-rich/package.json
Original file line number Diff line number Diff line change
@@ -1,80 +1,19 @@
{
"name": "feature-rich",
"version": "0.0.1",
"main": "index.js",
"repository": "https://github.com/ckeditor/ckeditor5-demos",
"author": "CKSource (http://cksource.com/)",
"license": "GPL-2.0-or-later",
"private": true,
"devDependencies": {
"@ckeditor/ckeditor5-adapter-ckfinder": "41.2.1",
"@ckeditor/ckeditor5-alignment": "41.2.1",
"@ckeditor/ckeditor5-autoformat": "41.2.1",
"@ckeditor/ckeditor5-basic-styles": "41.2.1",
"@ckeditor/ckeditor5-block-quote": "41.2.1",
"@ckeditor/ckeditor5-ckbox": "41.2.1",
"@ckeditor/ckeditor5-ckfinder": "41.2.1",
"@ckeditor/ckeditor5-clipboard": "41.2.1",
"@ckeditor/ckeditor5-cloud-services": "41.2.1",
"@ckeditor/ckeditor5-code-block": "41.2.1",
"@ckeditor/ckeditor5-core": "41.2.1",
"@ckeditor/ckeditor5-dev-translations": "^39.5.0",
"@ckeditor/ckeditor5-dev-utils": "^39.5.0",
"@ckeditor/ckeditor5-editor-classic": "41.2.1",
"@ckeditor/ckeditor5-engine": "41.2.1",
"@ckeditor/ckeditor5-enter": "41.2.1",
"@ckeditor/ckeditor5-essentials": "41.2.1",
"@ckeditor/ckeditor5-export-pdf": "41.2.1",
"@ckeditor/ckeditor5-export-word": "41.2.1",
"@ckeditor/ckeditor5-find-and-replace": "41.2.1",
"@ckeditor/ckeditor5-font": "41.2.1",
"@ckeditor/ckeditor5-heading": "41.2.1",
"@ckeditor/ckeditor5-highlight": "41.2.1",
"@ckeditor/ckeditor5-horizontal-line": "41.2.1",
"@ckeditor/ckeditor5-html-embed": "41.2.1",
"@ckeditor/ckeditor5-html-support": "41.2.1",
"@ckeditor/ckeditor5-image": "41.2.1",
"@ckeditor/ckeditor5-import-word": "41.2.1",
"@ckeditor/ckeditor5-indent": "41.2.1",
"@ckeditor/ckeditor5-language": "41.2.1",
"@ckeditor/ckeditor5-link": "41.2.1",
"@ckeditor/ckeditor5-list": "41.2.1",
"@ckeditor/ckeditor5-media-embed": "41.2.1",
"@ckeditor/ckeditor5-mention": "41.2.1",
"@ckeditor/ckeditor5-page-break": "41.2.1",
"@ckeditor/ckeditor5-paragraph": "41.2.1",
"@ckeditor/ckeditor5-paste-from-office": "41.2.1",
"@ckeditor/ckeditor5-remove-format": "41.2.1",
"@ckeditor/ckeditor5-select-all": "41.2.1",
"@ckeditor/ckeditor5-special-characters": "41.2.1",
"@ckeditor/ckeditor5-style": "41.2.1",
"@ckeditor/ckeditor5-table": "41.2.1",
"@ckeditor/ckeditor5-theme-lark": "41.2.1",
"@ckeditor/ckeditor5-typing": "41.2.1",
"@ckeditor/ckeditor5-ui": "41.2.1",
"@ckeditor/ckeditor5-undo": "41.2.1",
"@ckeditor/ckeditor5-upload": "41.2.1",
"@ckeditor/ckeditor5-utils": "41.2.1",
"@ckeditor/ckeditor5-widget": "41.2.1",
"@ckeditor/ckeditor5-word-count": "41.2.1",
"@ckeditor/ckeditor5-template": "41.2.1",
"@ckeditor/ckeditor5-document-outline": "41.2.1",
"@ckeditor/ckeditor5-format-painter": "41.2.1",
"@ckeditor/ckeditor5-slash-command": "41.2.1",
"@webspellchecker/wproofreader-ckeditor5": "2.3.1",
"css-loader": "^5.2.7",
"postcss": "^8.4.19",
"postcss-loader": "^4.3.0",
"raw-loader": "^4.0.2",
"style-loader": "^2.0.0",
"terser-webpack-plugin": "^4.2.3",
"webpack": "^5.75.0",
"webpack-cli": "^4.10.0",
"webpack-dev-server": "^4.11.1"
},
"scripts": {
"build": "webpack --mode production",
"build-dev": "webpack --mode development",
"start": "webpack serve --open /index.html --mode development"
}
"name": "feature-rich",
"version": "0.0.1",
"main": "index.js",
"repository": "https://github.com/ckeditor/ckeditor5-demos",
"author": "CKSource (http://cksource.com/)",
"license": "GPL-2.0-or-later",
"private": true,
"devDependencies": {
"ckeditor5": "0.0.0-nightly-20240522.0",
"ckeditor5-premium-features": "0.0.0-nightly-20240522.0",
"vite": "5.2.0"
},
"scripts": {
"dev": "vite",
"build": "vite build",
"preview": "vite preview"
}
}

0 comments on commit 19f9dbe

Please sign in to comment.