X-Git-Url: https://jasonwoof.com/gitweb/?a=blobdiff_plain;f=README.md;h=97d26281a4e16569a35125e92f218d12acaba65d;hb=115352a3056c8456e9998e214458c2b10875e9c7;hp=02020d685f634231718583a4dfe4de306504cda8;hpb=071a77b51a7f9ba5da51b3fc43885e63771bc566;p=peach-html5-editor.git diff --git a/README.md b/README.md index 02020d6..97d2628 100644 --- a/README.md +++ b/README.md @@ -1,87 +1,69 @@ -wheic -===== +Peach HTML5 Editor +================== -This project is to build a HTML5 parser, then use that to build a WYSIWYG html -editor for the browser. +Peach Editor is a WYSIWYG HTML5 editor for the browser. -The code is written in CoffeeScript for modern browsers. The HTML5 parser can -also run under node.js. - -Status +Vision ------ -HTML5 parser: all (1581) tests pass. Works in the browser and node.js - -WYSIWYG editor: planning stages - - -Quick Start Guide ------------------ - -1. Open ``parser_tests_coffee.html`` in your browser. - -2. Open the console (right-click, inspect this element, console) +Most online HTML editors are built around the "contenteditable" feature of +modern browsers. While this gives developers a lot of features right out of the +box, they must surrender almost complete control over how it works, and thus +we all get stuck using editors that are frustrating and have loads of bugs and +compatibility issues. -3. After a few seconds, you should see "Tests passed: 1581, Failed: 0" in the - console. +Instead of trying to create an ever-expanding set of workarounds for the +quirks, limitations and bugs of different platforms/browsers implementation of +contenteditable, this project aims to create an HTML5 editor that does not use +this feature at all. -4. Try running the parser in the console, example: +This method is much more work, but has the potential to make an editor that is +actually good, since all the code that makes it tick is part of the project, +and its code can be modified. - window.wheic.parse_html("

foo

", {fragment: "body"}) +Jason couldn't find an HTML parser in JavaScript that was at all accurate +according to the HTML5 spec, so he wrote one; see ``parser.js``. -For further reading, see "Running Under node.js" below. - - -Running Under node.js ---------------------- - -Dependencies: node.js, CoffeeScript +Current work is going into the GUI. -1. Install node.js https://nodejs.org/en/ -2. Install CoffeeScript. Try: +Status +------ - apt-get install coffeescript - or +The HTML5 parser: complete component passes the full test suite (1581 tests). - npm install -g coffee-script +Editor GUI: in early development stages. -4. Compile to javascript: - make +Quick Start +----------- -Now you can do any of these things in any order: +Open ``index.html`` in a browser (no need for a web server) -* Run the tests directly from CoffeeScript: +For further reading, see "Running Under node.js" below. - coffee test.coffee -* Test the compiled (javascript) parser in your favorite browser by opening - up ``parser_tests.html`` and looking at the console. +Technologies +------------ -* Run tests via compiled code: +Programming language: JavaScript - nodejs test.js +HTML5 Parser: Spec compliant, also runs on node.js -* Try using the parser in your own javascript node.js project: +Interface: Implemented using the DOM api. No ``contenteditable`` or jquery. - var wheic = require('./parse-html.js'); - var dom = wheic.parse_html("

hi

", {fragment: 'body'}); - ... -* Try using the parser in your own CoffeeScript node.js project: +Running Parser with node.js +--------------------------- - wheic = require './parse-html.js' - dom = wheic.parse_html "

hi

", fragment: 'body' - ... +The parser can run without the browser, try: - Note: the CoffeeScript compile time is significant, so you'll want to use - the compiled javascript even though you could use the ``.coffee`` version. + nodejs parser_tests.js Feedback, Questions, Etc ------------------------ -Please communicate directly with Jason Woofenden by email: jason@jasonwoof.com -or on freenode /msg JasonWoof +Please communicate directly with Jason Woofenden via his website: +https://jasonwoof.com/contact