diff --git a/timestamp-plugin/cdn/final-project/index.html b/timestamp-plugin/cdn/final-project/index.html new file mode 100644 index 0000000..600e81b --- /dev/null +++ b/timestamp-plugin/cdn/final-project/index.html @@ -0,0 +1,19 @@ + + + + + + CKEditor 5 Framework – timestamp plugin + + + +
+

Timestamp plugin

+

Press the timestamp button to insert the current date and time.

+
+ + + + + + diff --git a/timestamp-plugin/cdn/final-project/main.js b/timestamp-plugin/cdn/final-project/main.js new file mode 100644 index 0000000..9dd218d --- /dev/null +++ b/timestamp-plugin/cdn/final-project/main.js @@ -0,0 +1,58 @@ +/** + * @license Copyright (c) 2003-2024, CKSource Holding sp. z o.o. All rights reserved. + * For licensing, see LICENSE.md. + */ + +const { + ClassicEditor, + Bold, + Essentials, + Heading, + Italic, + Paragraph, + List, + Plugin, + ButtonView +} = CKEDITOR; + +class Timestamp extends Plugin { + init() { + const editor = this.editor; + + editor.ui.componentFactory.add( 'timestamp', () => { + // The button will be an instance of ButtonView. + const button = new ButtonView(); + + button.set( { + label: 'Timestamp', + withText: true + } ); + + //Execute a callback function when the button is clicked + button.on( 'execute', () => { + const now = new Date(); + + //Change the model using the model writer + editor.model.change( writer => { + + //Insert the text at the user's current position + editor.model.insertContent( writer.createText( now.toString() ) ); + } ); + } ); + + return button; + } ); + } +} + +ClassicEditor + .create( document.querySelector( '#editor' ), { + plugins: [ Essentials, Paragraph, Heading, List, Bold, Italic, Timestamp ], + toolbar: [ 'heading', 'bold', 'italic', 'numberedList', 'bulletedList', 'timestamp' ] + } ) + .then( editor => { + console.log( 'Editor was initialized', editor ); + } ) + .catch( error => { + console.error( error.stack ); + } ); diff --git a/timestamp-plugin/cdn/final-project/package.json b/timestamp-plugin/cdn/final-project/package.json new file mode 100644 index 0000000..e1b2590 --- /dev/null +++ b/timestamp-plugin/cdn/final-project/package.json @@ -0,0 +1,14 @@ +{ + "name": "final-project", + "private": true, + "version": "0.0.0", + "type": "module", + "scripts": { + "dev": "vite", + "build": "vite build", + "preview": "vite preview" + }, + "devDependencies": { + "vite": "^5.4.1" + } +} diff --git a/timestamp-plugin/cdn/starter-files/index.html b/timestamp-plugin/cdn/starter-files/index.html new file mode 100644 index 0000000..600e81b --- /dev/null +++ b/timestamp-plugin/cdn/starter-files/index.html @@ -0,0 +1,19 @@ + + + + + + CKEditor 5 Framework – timestamp plugin + + + +
+

Timestamp plugin

+

Press the timestamp button to insert the current date and time.

+
+ + + + + + diff --git a/timestamp-plugin/cdn/starter-files/main.js b/timestamp-plugin/cdn/starter-files/main.js new file mode 100644 index 0000000..521d0d3 --- /dev/null +++ b/timestamp-plugin/cdn/starter-files/main.js @@ -0,0 +1,27 @@ +/** + * @license Copyright (c) 2003-2024, CKSource Holding sp. z o.o. All rights reserved. + * For licensing, see LICENSE.md. + */ + +const { + ClassicEditor, + Bold, + Essentials, + Heading, + Italic, + Paragraph, + List +} = CKEDITOR; + +ClassicEditor + .create( document.querySelector( '#editor' ), { + licenseKey: 'GPL', + plugins: [ Essentials, Paragraph, Heading, List, Bold, Italic ], + toolbar: [ 'heading', 'bold', 'italic', 'numberedList', 'bulletedList' ] + } ) + .then( editor => { + console.log( 'Editor was initialized', editor ); + } ) + .catch( error => { + console.error( error.stack ); + } ); diff --git a/timestamp-plugin/cdn/starter-files/package.json b/timestamp-plugin/cdn/starter-files/package.json new file mode 100644 index 0000000..f517aed --- /dev/null +++ b/timestamp-plugin/cdn/starter-files/package.json @@ -0,0 +1,14 @@ +{ + "name": "starter-files", + "private": true, + "version": "0.0.0", + "type": "module", + "scripts": { + "dev": "vite", + "build": "vite build", + "preview": "vite preview" + }, + "devDependencies": { + "vite": "^5.4.1" + } +} diff --git a/timestamp-plugin/final-project/index.html b/timestamp-plugin/npm/final-project/index.html similarity index 100% rename from timestamp-plugin/final-project/index.html rename to timestamp-plugin/npm/final-project/index.html diff --git a/timestamp-plugin/final-project/main.js b/timestamp-plugin/npm/final-project/main.js similarity index 100% rename from timestamp-plugin/final-project/main.js rename to timestamp-plugin/npm/final-project/main.js diff --git a/timestamp-plugin/final-project/package.json b/timestamp-plugin/npm/final-project/package.json similarity index 100% rename from timestamp-plugin/final-project/package.json rename to timestamp-plugin/npm/final-project/package.json diff --git a/timestamp-plugin/starter-files/index.html b/timestamp-plugin/npm/starter-files/index.html similarity index 100% rename from timestamp-plugin/starter-files/index.html rename to timestamp-plugin/npm/starter-files/index.html diff --git a/timestamp-plugin/starter-files/main.js b/timestamp-plugin/npm/starter-files/main.js similarity index 100% rename from timestamp-plugin/starter-files/main.js rename to timestamp-plugin/npm/starter-files/main.js diff --git a/timestamp-plugin/starter-files/package.json b/timestamp-plugin/npm/starter-files/package.json similarity index 100% rename from timestamp-plugin/starter-files/package.json rename to timestamp-plugin/npm/starter-files/package.json