diff --git a/README.md b/README.md index dfc97e0..1e1632c 100644 --- a/README.md +++ b/README.md @@ -1,6 +1,6 @@ # Quill Delta to HTML Parser -A PHP library to parse [Quill WYSIWYG](https://quilljs.com/) editor [deltas](https://github.com/quilljs/delta) into HTML - flexible and extendible for custom elements. Every element is parsed by the same mechanism, this makes it easy to extend and understand. It will also sanitize the output value, so its more secure especially when using user generated text. +A PHP library to parse [Quill WYSIWYG](https://quilljs.com/) editor [deltas](https://github.com/quilljs/delta) into HTML - flexible and extendable for custom elements. Every element is parsed by the same mechanism, making it easy to extend and understand. It also sanitizes the output value, making it more secure, especially when using user-generated text.  [](https://codeclimate.com/github/nadar/quill-delta-parser/maintainability) @@ -13,7 +13,7 @@ What is Quill? Quill is a free, open source WYSIWYG editor built for the modern ## Installation -The package is only available through composer: +The package is available only through Composer: ```sh composer require nadar/quill-delta-parser @@ -22,17 +22,17 @@ composer require nadar/quill-delta-parser ## Usage ```php -// ensure to load the autoload file from composer somewhere in your application +// Ensure to load the autoload file from Composer somewhere in your application. require __DIR__ . '/vendor/autoload.php'; -// create the lexer object with your given quill json delta code (either PHP array or JSON string) +// Create the lexer object with your given Quill JSON delta code (either PHP array or JSON string). $lexer = new \nadar\quill\Lexer($json); -// echoing the html for the given json ops. +// Echo the HTML for the given JSON ops. echo $lexer->render(); ``` -Where `$json` is the ops json array from quill, for example: +Where `$json` is the ops JSON array from Quill, for example: ```json { @@ -47,7 +47,7 @@ Where `$json` is the ops json array from quill, for example: "insert": "\n" }, { - "insert": "\nThis is the php quill " + "insert": "\nThis is the PHP Quill " }, { "attributes": { @@ -67,17 +67,17 @@ This would render the following HTML: ```html
This is the php quill parser!
+This is the PHP Quill parser!
``` ## Extend the Parser -In order to extend the Parser by adding your own listeners (this can be the case if you are using quill plugins which generates custom delta code), you have to decide whether it's an: +To extend the Parser by adding your own listeners (this can be the case if you are using Quill plugins which generate custom delta code), you have to decide whether it's an: -+ inline element: Replaces content with new parsed content, this is mostly the case when working with quill extensions. -+ block element: Block elements which encloses the whole input with a tag, for example heading. ++ Inline element: Replaces content with new parsed content, mostly the case when working with Quill extensions. ++ Block element: Encloses the whole input with a tag, for example, a heading. -An example for a mention plugin which generates the following delta `{"insert":{"mention":{"id":"1","value":"Basil","denotationChar":"@"}}}` an inline plugin could look like this: +An example for a mention plugin that generates the following delta `{"insert":{"mention":{"id":"1","value":"Basil","denotationChar":"@"}}}`; an inline plugin could look like this: ```php class Mention extends InlineListener @@ -87,12 +87,12 @@ class Mention extends InlineListener */ public function process(Line $line) { - // check if input is json, decodes to an array and checks if the key "mention" - // exists, if yes return the value for this key. + // Check if input is JSON, decodes to an array, and checks if the key "mention" + // exists. If yes, return the value for this key. $mention = $line->insertJsonKey('mention'); if ($mention) { - // apply the inline behavior, updates the content and append to next "block" element. - // the value in this example would be "Basil". + // Apply the inline behavior, updates the content and append to the next "block" element. + // The value in this example would be "Basil". $this->updateInput($line, ''.$mention['value'].''); } } @@ -103,58 +103,60 @@ Now register the listener: ```php $lexer = new Lexer($json); -$lexer->registerListener(new Mention); +$lexer->registerListener(new Mention()); echo $lexer->render(); ``` -## Override built-in Listeners +## Override Built-in Listeners -Certain listeners (image, video, color) produce a HTML output which maybe not suit your use case, so you have the option to override the properties of those plugins and re-register the Listener, here an example with the image tag: +Certain listeners (image, video, color) produce an HTML output which may not suit your use case, so you have the option to override the properties of those plugins and re-register the Listener. Here's an example with the image tag: ```php $image = new Image(); + + $image->wrapper = '