From 1627f8a3bdbdeb7304d011f2c915cfe1956afe1e Mon Sep 17 00:00:00 2001 From: Taly Date: Tue, 7 Aug 2018 09:32:32 +0300 Subject: [PATCH] update readme (#419) * update readme * update readme --- README.md | 30 ++++++++++++------------------ docs/installation.md | 25 +++++++++++-------------- docs/tools.md | 2 ++ package.json | 2 +- 4 files changed, 26 insertions(+), 33 deletions(-) diff --git a/README.md b/README.md index bd8d5114..b203e45d 100644 --- a/README.md +++ b/README.md @@ -1,6 +1,6 @@

-![](https://flat.badgen.net/badge/CodeX%20Editor/v2.0.0/blue?icon=npm) +![](https://flat.badgen.net/badge/CodeX%20Editor/v2.0.3/blue?icon=npm) ## Version 2.0-beta is here! @@ -136,33 +136,32 @@ Copy [codex-editor.js](build/codex-editor.js) file to your project and load it. ## Load Tools -Each Block at the CodeX Editor represented by [Tools](docs/tools.md). There are simple external scripts with own logic. To start using the Editor, you should connect at least one Block Tool. +Each Block at the CodeX Editor represented by [Tools](docs/tools.md). There are simple external scripts with own logic. Probably you want to use several Block Tools that should be connected. -For example check out our [Paragraph](https://github.com/codex-editor/paragraph) Tool that represents simple text block. +For example check out our [Header](https://github.com/codex-editor/header) Tool that represents heading blocks. -Each Tool should have an installation guide. You can install Paragraph Tool via the same ways as an Editor (Node.js, CDN, local file). +You can install Header Tool by the same way as the Editor (Node.js, CDN, local file). -Check [CodeX Editor's community](https://github.com/codex-editor) to see Tools examples. +Check [CodeX Editor's community](https://github.com/codex-editor) to see more ready-to-use Tools. -**Example:** use Paragragh from CDN +**Example:** use Header from CDN ```html - + ``` ## Create Editor instance -Create an instance of CodeX Editor and pass [Configuration Object](src/components/interfaces/editor-config.ts). -Minimal params is a `holderId`, `tools` list and `initialBlock` marker. +Create an instance of CodeX Editor and pass [Configuration Object](src/components/interfaces/editor-config.ts) with `holderId` and tools list. ```html
``` -You can create a simple Editor only with a default Paragraph Tool by passing a string with element's Id (wrapper for Editor) as a configuration param or use default `codex-editor`. +You can create a simple Editor with only default Paragraph Tool by passing a string with element's Id (wrapper for Editor) as a configuration param. Or use the default `codex-editor` id for wrapper. ```javascript -var editor = new CodexEditor(); +var editor = new CodexEditor(); /** Zero-configuration */ // equals @@ -183,17 +182,12 @@ var editor = new CodexEditor({ * Pass Tool's class or Settings object for each Tool you want to use */ tools: { - paragraph: { - class: Paragraph, + header: { + class: Header, inlineToolbar : true }, // ... }, - - /** - * What Block will be inserted by default - */ - initialBlock : 'paragraph', /** * Previously saved data that should be rendered diff --git a/docs/installation.md b/docs/installation.md index 59854e9e..67c75ca9 100644 --- a/docs/installation.md +++ b/docs/installation.md @@ -24,7 +24,7 @@ Install the package via NPM or Yarn npm i codex.editor --save-dev ``` -Include module at your application +Include module at your application ```javascript const CodexEditor = require('codex.editor'); @@ -52,21 +52,23 @@ Copy [codex-editor.js](../build/codex-editor.js) file to your project and load i ## Load Tools -Each Block at the CodeX Editor represented by [Tools](tools.md). There are simple external scripts with own logic. For example check out our [Paragraph](https://github.com/codex-editor/paragraph) Tool that represents simple text block. +Each Block at the CodeX Editor represented by [Tools](tools.md). There are simple external scripts with own logic. Probably you want to use several Block Tools that should be connected. -Each Tool should have an installation guide. You can install Paragraph Tool via the same ways as an Editor (Node.js, CDN, local file). +For example check out our [Header](https://github.com/codex-editor/header) Tool that represents heading blocks. + +You can install Header Tool via the same ways as an Editor (Node.js, CDN, local file). Check [CodeX Editor's community](https://github.com/codex-editor) to see Tools examples. -**Example:** use Paragragh from CDN +**Example:** use Header from CDN ```html - + ``` ## Create Editor instance -Create an instance of CodeX Editor and pass [Configuration Object](../src/components/interfaces/editor-config.ts). +Create an instance of CodeX Editor and pass [Configuration Object](../src/components/interfaces/editor-config.ts). Minimal params is a `holderId`, `tools` list and `initialBlock` marker. ```html @@ -76,7 +78,7 @@ Minimal params is a `holderId`, `tools` list and `initialBlock` marker. You can create a simple Editor only with a default Paragraph Tool by passing a string with element's Id (wrapper for Editor) as a configuration param or use default `codex-editor`. ```javascript -var editor = new CodexEditor(); +var editor = new CodexEditor(); /** Zero-configuration */ // equals @@ -97,18 +99,13 @@ var editor = new CodexEditor({ * Pass Tool's class or Settings object for each Tool you want to use */ tools: { - paragraph: { - class: Paragraph, + header: { + class: Header, inlineToolbar : true }, // ... }, - /** - * What Block will be inserted by default - */ - initialBlock : 'paragraph', - /** * Previously saved data that should be rendered */ diff --git a/docs/tools.md b/docs/tools.md index d1b06f68..841085d1 100644 --- a/docs/tools.md +++ b/docs/tools.md @@ -4,6 +4,8 @@ CodeX Editor is a block-oriented editor. It means that entry composed with the l `Tool` — is a class that provide custom `Block` type. All Tools represented by `Plugins`. +Each Tool should have an installation guide. + ## Tool class structure ### constructor() diff --git a/package.json b/package.json index d7b4c0fc..b983ce60 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "codex.editor", - "version": "2.0.2", + "version": "2.0.3", "description": "Codex Editor. Native JS, based on API and Open Source", "main": "build/codex-editor.js", "scripts": {