11 ms·

WYSIHTML5: A better approach to rich text editing

312 points by tiff 14y ago

Open source rich text editor based on HTML5 and the progressive-enhancement approach. Uses a sophisticated security concept and aims to generate fully valid HTML5 markup by preventing unmaintainable tag soups and inline styles. Twitter Bootstrap Plugin: http://jhollingworth.github.com/bootstrap-wysihtml5/

TazeTSchnitzel 14y ago
Valid HTML5 markup? It's certainly not semantic. <b> should be <strong>, <i> should be <em>
- decklin 14y ago
  You might want to take a look at this: http://www.whatwg.org/specs/web-apps/current-work/multipage/text-level-semantics.html#the-b-element http://www.whatwg.org/specs/web-apps/current-work/multipage/...
  - sandfox 14y ago
    You might want to read this bit from that section: "The b element should be used as a last resort when no other element is more appropriate. In particular, headings should use the h1 to h6 elements, stress emphasis should use the em element, importance should be denoted with the strong element, and text marked or highlighted should use the mark element." From the looks of it - while just about legal, it's the worst option going. <em> etc are far more preferable and 'right'
- batista 14y ago
  Only I don't want my text to be "strong", I want it to be bold, and I don't want my italicized items to me "emphasized", I bloody want them in italics. I don't consider my bolds and italics to be mere style and much less I consider them mere suggestions. Bold and italic are typographic conventions of author _intent_ (that is: semantics) with centuries of use. I put them there in purpose, and I don't want them converted to anything else via styling. Sure, someone can style "b" as "purple text with a yellow dotted underline", but I might as well make my _actual_ intention clear. Outside of its proper context, "semantic" is just a BS notion that got popular with designers and co because it sounds sophisticated, giving rise to inane arguments similar to how many angels fit in the head of a needle.
  - TazeTSchnitzel 14y ago
    I understand that, but when I open your page in lynx I don't want to read text without any formatting because there are no direct equivalents to "bold" or "italics".
    - batista 14y ago
      Well, then just ignore them --or show them with bold and _italics_, Markdown style. Although, I think modern terminals can do bold fonts, e.g this gives you bold in bash: echo -e "\033[1mtest\033[0m again"
    - DanBC 14y ago
      People actively block Internet Explorer. They've probably never heard of lynx / links / elinks / w3m. I'm happy when they don't use idiotic alt tags. If they manage to use good alt tags I'm really happy. Accessible web design is seen as some freakish niche need, and is often relegated to something to do later, if ever.
Udo 14y ago
This is very nice! And it feels very light weight, too. I've been looking for a saner rich text editor for a while...
zv 14y ago
Whenever I see "new rich HTML editor", I notice that there is no table editing. What's the point of editor that is missing the most needed function? You could argue that it is not needed, however lack of this function leads to cases of copy-paste from word/excel with bad markup.
- middus 14y ago
  If I could +1 this a million times... that's the number one feedback I receive from CMS users in commercial environments. Please make it convenient for them to create tables!
  - Angostura 14y ago
    Pah! "Just paste the table in from Word". ...and let the hilarity commence.
- laktek 14y ago
  Aloha handles Tables perfectly (including merge/split of rows & columns, plus pasting from Microsoft Word). Check the demo - http://aloha-editor.org/builds/development/latest/src/demo/boilerplate/ http://aloha-editor.org/builds/development/latest/src/demo/b...
  - davidw 14y ago
    Looks nice, but the Aloha licensing basically requires you to buy a license if you're going to use it commercially, whereas this one uses the very simple and open MIT license.
    - analog 14y ago
      It's licensed under AGPLv3. I prefer MIT as well, but surely you don't need to buy a licence to use this? https://github.com/alohaeditor/Aloha-Editor/blob/dev/LICENSE.txt https://github.com/alohaeditor/Aloha-Editor/blob/dev/LICENSE...
    - midnightmonster 14y ago
lunaru 14y ago
Wouldn't it be more desirable to have these WYSIWYG editors serialize to a non-HTML markup (like textile or markdown) to reduce the hassle of user-input sanitization on the back-end? (e.g. stripping script and iframe tags). What's best-practice these days for storing and displaying rich-edit user input?
- laktek 14y ago
  Depends on the use case. If you are using it in as a website authoring tool, it makes sense to store the rich-edit user input as HTML itself. However, in a scenario like commenting or composing a message (where only limited editing options are available), storing in a format such as Markdown make sense.
  - legutierr 14y ago
    Are you aware of any such editor that does store the data in Markdown or something similar?
    - patrickg 14y ago
      Not really what you're after, I guess, but a link anyway: http://code.google.com/p/pagedown/wiki/PageDown http://code.google.com/p/pagedown/wiki/PageDown "PageDown is the JavaScript Markdown previewer used on Stack Overflow and the rest of the Stack Exchange network. It includes a Markdown-to-HTML converter and an in-page Markdown editor with live preview."
    - yesbabyyes 14y ago
      Take a look at bergie's Hallo editor: http://bergie.github.com/hallo/markdown.html http://bergie.github.com/hallo/markdown.html He also has an interesting project called Create: http://createjs.org/ http://createjs.org/
    - zalew 14y ago
      http://markitup.jaysalvat.com/home/ http://markitup.jaysalvat.com/home/
    - 14y ago
SquareWheel 14y ago
I like it a lot. It's fast, not bloated, and has a decent feature set. I could see myself implementing this.
deleted 14y ago
[deleted]
laktek 14y ago
On a side note, it's worth mentioning W3C has a working group to standardize in-browser HTML editing (http://dvcs.w3.org/hg/editing/raw-file/tip/editing.html http://dvcs.w3.org/hg/editing/raw-file/tip/editing.html). The spec is still not settled, but safe to use as a guideline for an implementation. If libraries align their command API implementations with the specs, it would be easy for them to port to use native commands as the browser support gets strong.
bflesch 14y ago
Very nice. We discussed a lot whether to use the same <iframe> approach on text editing when working a project of ours called Quabel. In the end, we went even further with a pure DOM-based editor (via contenteditable) and no hidden <textarea>. However, we encountered lots of cross-browser issues because of the differences in contenteditable behavior when using FF / Chrome / Opera and later dropped contenteditable alltogether. I chuckled when noticing the odd editor behavior when pressing backspace at the beginning of a list item because we had exactly the kind of oddities.
fredley 14y ago
I desperately want this as a Wordpress plugin.
cristiantincu 14y ago
“(…) It uses a sophisticated security concept (…)” —Does anybody know what does this mean? Does this concept have a name, a description or anything?
- grimboy 14y ago
  As far as I can tell, it's referring to the sandboxed iframe.
eliben 14y ago
IE in browser support: IE8+ yay ;-)
- lunarscape 14y ago
  Out of curiosity is it working in IE8 for you? Doesn't appear to fully work for me using IE8 on XP. The editor buttons and most of the page don't appear.
  - emp_ 14y ago
    The editing does work for me, no buttons show but I am not sure if the demo is tailored to show that off. On IE7 nothing really happens.
- nosierbatiste 14y ago
  We officially support IE7 and IE8 in Aloha. I say officially, because, although it does seem to work, it doesn't work very well (at all). IE does some weird stuff with the DOM, especially inside a contenteditable (certain combinations of DOM elements completely mess up the structure if it's inside a contenteditable, but not if it's outside).
stef25 14y ago
The only way to add an image is to enter a URL? An upload feature would be great, most of my sites / clients require it.
junto 14y ago
I'm using the Twitter Bootstrap styled version of this in a current project. It looks stunning: http://jhollingworth.github.com/bootstrap-wysihtml5/ http://jhollingworth.github.com/bootstrap-wysihtml5/
- sundeep_b 14y ago
  Cool! That's the first thing that hit my mind - how would this look in bootstrap? Thanks for doing and sharing this!
  - junto 14y ago
    Just to be clear. I didn't write this! I just used it. The credit for writing this goes to James Hollingworth: https://github.com/jhollingworth https://github.com/jhollingworth
    - jfhollingworth 14y ago
      Thanks :) Glad you like it!
      - junto 14y ago
        Lol. You're lurking around here. Nice to see other Brits here!
      - therandomguy 14y ago
        Thanks for this. I would most definitely use this on my website. The only thing missing is the ability to add youtube embed code. Any way to make that happen?
    - deleted 14y ago
      [deleted]
cmelbye 14y ago
This is a fantastic rich text editor, easily one of the best I've seen. If I remember correctly, 37signals uses it in the note writing feature of the new Basecamp.
- javan 14y ago
  Correct.
mgkimsal 14y ago
Feature request - ability to add 'notes' to a document. I'd imagine these as toggleable divs that would be able to be inserted anywhere in the doc, then made visible or not by toggling a class. When 'on' the visible portion would just be a small box/space/marker that, when clicked, opened up a larger div with the full note. I'd tried to do this with the YUI and Dojo editors a couple years ago, but my JS-fu wasn't good enough. I'm possibly better now, and maybe wil try my hand at adding that to this editor (which looks nice for a lot of applications) but someone else with better skills could probably lay the foundation for a 'notes' system much better than me :)
- simonz05 14y ago
  > Feature request - ability to add 'notes' to a document. I'd imagine these as toggleable divs that would be able to be inserted anywhere in the doc, then made visible or not by toggling a class. When 'on' the visible portion would just be a small box/space/marker that, when clicked, opened up a larger div with the full note. I think this suggestion fully qualifies as something they don't want to do, "[to create] unmaintainable tag soups and inline styles".
  - mgkimsal 14y ago
    Who said inline styles? A class and an ID on a span tag inside a larger block would be all that's required. The clicking stuff would be applied outside of the document editing area. This is the sort of reaction that makes me hesitant to even attempt to fork/patch it, because if this sort of thing wouldn't be accepted back in to the main trunk, I'm stuck maintaining a separate branch.
- cmelbye 14y ago
  This seems like it would be beyond the scope of the project (to provide a simple rich text editor.) It should be very easy to add some sort of inline commenting/review system in your own application.
simonz05 14y ago
Creating a simple editor which works, seems to be quiet hard, judging based on all the horrible examples we have of existing ones. Hopefully, they'll keep it clean and don't add many new features.
- alisey 14y ago
  It's hard, especially if you want to support IE8. You need a 100-line function simply to get cursor position in a cross-browser fashion.
slikts 14y ago
Looking at the examples, I don't understand how this is "a better approach" to editing, because the HTML it outputs does not follow best practices. The HTML it outputs should look like a competent human had authored it, but currently it uses line-break hacks for paragraphs instead of semantic paragraph elements (two <br> elements aren't really a paragraph, it just looks like it), adds underline elements with Ctrl+U (underlines should be reserved for links and defined in stylesheets anyway) etc.
- DeepDuh 14y ago
  Want good WYSIWYG html? Try out Apple Pages, export to E-Pub, extract and look at the xhtml files. After pretty printing it's almost like human authored. It seems that we still need the Apples and Adobes of this world.
slikts 14y ago
Looking at the examples, I don't understand how this is "a better approach" to editing, because the HTML it outputs does not follow best practices. The HTML it outputs should look like a competent human had authored it, but currently it uses line-break hacks for paragraphs instead of semantic paragraph elements (two <br> elements aren't really a paragraph, it just looks like it), adds underline elements with Ctrl+U (these should be reserved for links and defined in stylesheets anyway) etc.
jorangreef 14y ago
How is it doing the speech input for Chrome? Is this an offline API provided by Chrome or backed by a Google web api?
- Joeri 14y ago
  http://slides.html5rocks.com/#speech-input http://slides.html5rocks.com/#speech-input
snookca 14y ago
wysihtml5 is a decent editor. It's fairly lightweight in comparison to the other editors. I feel that its approach to DOM changes makes it easier to create cross-browser consistency. However, I feel the event system could really use some work and I find myself working against the editor to add new features. I would prefer if the framework made it easier to add new features rather than having to change the core to get the desired result. (and maybe I just need to spend more time with it.) Oh, and I should add that the built-in parser isn't very flexible and requires lengthy configuration.
- WimLeers 14y ago
  Could you go into a little bit more detail on how you think it compares to other editors? And more specifically: what are your thoughts on the Aloha editor?
  - snookca 14y ago
    The problem I have with most editors is that they try to be like a piece of desktop software. "Install me and get all of these features including themes and plugins." That's not what I want. I want an API. I want a consistent cross-browser approach to wysiwyg html editing that doesn't weigh in at 200+k minified. What does Aloha come in at? (Web Inspector is telling me 1.6MB!) I haven't used Aloha but my impression is that it's trying to be like all the other editors like TinyMCE or CKEditor. wysihtml5 is lightweight, which is nice. It provides a command API so that I can wire up commands to my own toolbar and provides state management. But I don't like that some built-in commands don't offer up enough externalization, like autolinking. Or that I can't cancel an event like beforecommand. beforecommand doesn't even tell me what command is being fired. (or if it does, I couldn't find out how.)
dmbaggett 14y ago
We really need to escape the tyranny of the browser "design mode," with all its quirks. These RTEs are really lipstick on a pig, sadly. Does anyone know of a JavaScript RTE that does all the text layout and formatting itself using pure JS?
- evan_ 14y ago
  The RTE for Google Docs is written in Javascript, bypassing design mode: http://googledocs.blogspot.com/2010/05/whats-different-about-new-google-docs.html http://googledocs.blogspot.com/2010/05/whats-different-about... The code isn't officially released anywhere, but someone grabbed the source, prettied it up, and put it up here: https://github.com/benjamn/kix-standalone https://github.com/benjamn/kix-standalone Obviously you can't use it for anything without a proper license.
cickpass_broken 14y ago
A little related: If anyone is interested I've been working on a WYSI-Markdown editor. http://draftbin.com/c3993540679e0a1af4e5704a208b60ceb46d20dc/ http://draftbin.com/c3993540679e0a1af4e5704a208b60ceb46d20dc... Haven't gotten around to a github repo or fixing some pretty annoying bugs. But, there it is.
rogermugs 14y ago
I'm genuinely embarrassed that this seems so revolutionary. Brilliant, but seems like it shouldn't be strikingly so... as though it SHOULD have been done before.
joelrunyon 14y ago
Any idea if/how this integrates w/ Vanilla Forums?
AlexFromBelgium 14y ago
Now make a WYSILatex editor in html5 :)

312 points by tiff 14y ago

TazeTSchnitzel 14y ago

Valid HTML5 markup? It's certainly not semantic. <b> should be <strong>, <i> should be <em>

decklin 14y ago
You might want to take a look at this: http://www.whatwg.org/specs/web-apps/current-work/multipage/text-level-semantics.html#the-b-element http://www.whatwg.org/specs/web-apps/current-work/multipage/...
- sandfox 14y ago
  You might want to read this bit from that section: "The b element should be used as a last resort when no other element is more appropriate. In particular, headings should use the h1 to h6 elements, stress emphasis should use the em element, importance should be denoted with the strong element, and text marked or highlighted should use the mark element." From the looks of it - while just about legal, it's the worst option going. <em> etc are far more preferable and 'right'
batista 14y ago
Only I don't want my text to be "strong", I want it to be bold, and I don't want my italicized items to me "emphasized", I bloody want them in italics. I don't consider my bolds and italics to be mere style and much less I consider them mere suggestions. Bold and italic are typographic conventions of author _intent_ (that is: semantics) with centuries of use. I put them there in purpose, and I don't want them converted to anything else via styling. Sure, someone can style "b" as "purple text with a yellow dotted underline", but I might as well make my _actual_ intention clear. Outside of its proper context, "semantic" is just a BS notion that got popular with designers and co because it sounds sophisticated, giving rise to inane arguments similar to how many angels fit in the head of a needle.
- TazeTSchnitzel 14y ago
  I understand that, but when I open your page in lynx I don't want to read text without any formatting because there are no direct equivalents to "bold" or "italics".
  - batista 14y ago
    Well, then just ignore them --or show them with bold and _italics_, Markdown style. Although, I think modern terminals can do bold fonts, e.g this gives you bold in bash: echo -e "\033[1mtest\033[0m again"
  - DanBC 14y ago
    People actively block Internet Explorer. They've probably never heard of lynx / links / elinks / w3m. I'm happy when they don't use idiotic alt tags. If they manage to use good alt tags I'm really happy. Accessible web design is seen as some freakish niche need, and is often relegated to something to do later, if ever.

Udo 14y ago

This is very nice! And it feels very light weight, too. I've been looking for a saner rich text editor for a while...

zv 14y ago

Whenever I see "new rich HTML editor", I notice that there is no table editing. What's the point of editor that is missing the most needed function? You could argue that it is not needed, however lack of this function leads to cases of copy-paste from word/excel with bad markup.

middus 14y ago
If I could +1 this a million times... that's the number one feedback I receive from CMS users in commercial environments. Please make it convenient for them to create tables!
- Angostura 14y ago
  Pah! "Just paste the table in from Word". ...and let the hilarity commence.
laktek 14y ago
Aloha handles Tables perfectly (including merge/split of rows & columns, plus pasting from Microsoft Word). Check the demo - http://aloha-editor.org/builds/development/latest/src/demo/boilerplate/ http://aloha-editor.org/builds/development/latest/src/demo/b...
- davidw 14y ago
  Looks nice, but the Aloha licensing basically requires you to buy a license if you're going to use it commercially, whereas this one uses the very simple and open MIT license.
  - analog 14y ago
    It's licensed under AGPLv3. I prefer MIT as well, but surely you don't need to buy a licence to use this? https://github.com/alohaeditor/Aloha-Editor/blob/dev/LICENSE.txt https://github.com/alohaeditor/Aloha-Editor/blob/dev/LICENSE...
  - midnightmonster 14y ago

lunaru 14y ago

Wouldn't it be more desirable to have these WYSIWYG editors serialize to a non-HTML markup (like textile or markdown) to reduce the hassle of user-input sanitization on the back-end? (e.g. stripping script and iframe tags). What's best-practice these days for storing and displaying rich-edit user input?

laktek 14y ago
Depends on the use case. If you are using it in as a website authoring tool, it makes sense to store the rich-edit user input as HTML itself. However, in a scenario like commenting or composing a message (where only limited editing options are available), storing in a format such as Markdown make sense.
- legutierr 14y ago
  Are you aware of any such editor that does store the data in Markdown or something similar?
  - patrickg 14y ago
    Not really what you're after, I guess, but a link anyway: http://code.google.com/p/pagedown/wiki/PageDown http://code.google.com/p/pagedown/wiki/PageDown "PageDown is the JavaScript Markdown previewer used on Stack Overflow and the rest of the Stack Exchange network. It includes a Markdown-to-HTML converter and an in-page Markdown editor with live preview."
  - yesbabyyes 14y ago
    Take a look at bergie's Hallo editor: http://bergie.github.com/hallo/markdown.html http://bergie.github.com/hallo/markdown.html He also has an interesting project called Create: http://createjs.org/ http://createjs.org/
  - zalew 14y ago
    http://markitup.jaysalvat.com/home/ http://markitup.jaysalvat.com/home/
  - 14y ago

SquareWheel 14y ago

I like it a lot. It's fast, not bloated, and has a decent feature set. I could see myself implementing this.

deleted 14y ago

[deleted]

laktek 14y ago

On a side note, it's worth mentioning W3C has a working group to standardize in-browser HTML editing (http://dvcs.w3.org/hg/editing/raw-file/tip/editing.html http://dvcs.w3.org/hg/editing/raw-file/tip/editing.html). The spec is still not settled, but safe to use as a guideline for an implementation. If libraries align their command API implementations with the specs, it would be easy for them to port to use native commands as the browser support gets strong.

bflesch 14y ago

Very nice. We discussed a lot whether to use the same <iframe> approach on text editing when working a project of ours called Quabel. In the end, we went even further with a pure DOM-based editor (via contenteditable) and no hidden <textarea>. However, we encountered lots of cross-browser issues because of the differences in contenteditable behavior when using FF / Chrome / Opera and later dropped contenteditable alltogether. I chuckled when noticing the odd editor behavior when pressing backspace at the beginning of a list item because we had exactly the kind of oddities.

fredley 14y ago

I desperately want this as a Wordpress plugin.

cristiantincu 14y ago

“(…) It uses a sophisticated security concept (…)” —Does anybody know what does this mean? Does this concept have a name, a description or anything?

grimboy 14y ago
As far as I can tell, it's referring to the sandboxed iframe.

eliben 14y ago

IE in browser support: IE8+ yay ;-)

lunarscape 14y ago
Out of curiosity is it working in IE8 for you? Doesn't appear to fully work for me using IE8 on XP. The editor buttons and most of the page don't appear.
- emp_ 14y ago
  The editing does work for me, no buttons show but I am not sure if the demo is tailored to show that off. On IE7 nothing really happens.
nosierbatiste 14y ago
We officially support IE7 and IE8 in Aloha. I say officially, because, although it does seem to work, it doesn't work very well (at all). IE does some weird stuff with the DOM, especially inside a contenteditable (certain combinations of DOM elements completely mess up the structure if it's inside a contenteditable, but not if it's outside).

stef25 14y ago

The only way to add an image is to enter a URL? An upload feature would be great, most of my sites / clients require it.

junto 14y ago

I'm using the Twitter Bootstrap styled version of this in a current project. It looks stunning: http://jhollingworth.github.com/bootstrap-wysihtml5/ http://jhollingworth.github.com/bootstrap-wysihtml5/

sundeep_b 14y ago
Cool! That's the first thing that hit my mind - how would this look in bootstrap? Thanks for doing and sharing this!
- junto 14y ago
  Just to be clear. I didn't write this! I just used it. The credit for writing this goes to James Hollingworth: https://github.com/jhollingworth https://github.com/jhollingworth
  - jfhollingworth 14y ago
    Thanks :) Glad you like it!
    - junto 14y ago
      Lol. You're lurking around here. Nice to see other Brits here!
    - therandomguy 14y ago
      Thanks for this. I would most definitely use this on my website. The only thing missing is the ability to add youtube embed code. Any way to make that happen?
  - deleted 14y ago
    [deleted]

cmelbye 14y ago

This is a fantastic rich text editor, easily one of the best I've seen. If I remember correctly, 37signals uses it in the note writing feature of the new Basecamp.

javan 14y ago
Correct.

mgkimsal 14y ago

Feature request - ability to add 'notes' to a document. I'd imagine these as toggleable divs that would be able to be inserted anywhere in the doc, then made visible or not by toggling a class. When 'on' the visible portion would just be a small box/space/marker that, when clicked, opened up a larger div with the full note. I'd tried to do this with the YUI and Dojo editors a couple years ago, but my JS-fu wasn't good enough. I'm possibly better now, and maybe wil try my hand at adding that to this editor (which looks nice for a lot of applications) but someone else with better skills could probably lay the foundation for a 'notes' system much better than me :)

simonz05 14y ago
> Feature request - ability to add 'notes' to a document. I'd imagine these as toggleable divs that would be able to be inserted anywhere in the doc, then made visible or not by toggling a class. When 'on' the visible portion would just be a small box/space/marker that, when clicked, opened up a larger div with the full note. I think this suggestion fully qualifies as something they don't want to do, "[to create] unmaintainable tag soups and inline styles".
- mgkimsal 14y ago
  Who said inline styles? A class and an ID on a span tag inside a larger block would be all that's required. The clicking stuff would be applied outside of the document editing area. This is the sort of reaction that makes me hesitant to even attempt to fork/patch it, because if this sort of thing wouldn't be accepted back in to the main trunk, I'm stuck maintaining a separate branch.
cmelbye 14y ago
This seems like it would be beyond the scope of the project (to provide a simple rich text editor.) It should be very easy to add some sort of inline commenting/review system in your own application.

simonz05 14y ago

Creating a simple editor which works, seems to be quiet hard, judging based on all the horrible examples we have of existing ones. Hopefully, they'll keep it clean and don't add many new features.

alisey 14y ago
It's hard, especially if you want to support IE8. You need a 100-line function simply to get cursor position in a cross-browser fashion.

slikts 14y ago

Looking at the examples, I don't understand how this is "a better approach" to editing, because the HTML it outputs does not follow best practices. The HTML it outputs should look like a competent human had authored it, but currently it uses line-break hacks for paragraphs instead of semantic paragraph elements (two <br> elements aren't really a paragraph, it just looks like it), adds underline elements with Ctrl+U (underlines should be reserved for links and defined in stylesheets anyway) etc.

DeepDuh 14y ago
Want good WYSIWYG html? Try out Apple Pages, export to E-Pub, extract and look at the xhtml files. After pretty printing it's almost like human authored. It seems that we still need the Apples and Adobes of this world.

slikts 14y ago

Looking at the examples, I don't understand how this is "a better approach" to editing, because the HTML it outputs does not follow best practices. The HTML it outputs should look like a competent human had authored it, but currently it uses line-break hacks for paragraphs instead of semantic paragraph elements (two <br> elements aren't really a paragraph, it just looks like it), adds underline elements with Ctrl+U (these should be reserved for links and defined in stylesheets anyway) etc.

jorangreef 14y ago

How is it doing the speech input for Chrome? Is this an offline API provided by Chrome or backed by a Google web api?

Joeri 14y ago
http://slides.html5rocks.com/#speech-input http://slides.html5rocks.com/#speech-input

snookca 14y ago

wysihtml5 is a decent editor. It's fairly lightweight in comparison to the other editors. I feel that its approach to DOM changes makes it easier to create cross-browser consistency. However, I feel the event system could really use some work and I find myself working against the editor to add new features. I would prefer if the framework made it easier to add new features rather than having to change the core to get the desired result. (and maybe I just need to spend more time with it.) Oh, and I should add that the built-in parser isn't very flexible and requires lengthy configuration.

WimLeers 14y ago
Could you go into a little bit more detail on how you think it compares to other editors? And more specifically: what are your thoughts on the Aloha editor?
- snookca 14y ago
  The problem I have with most editors is that they try to be like a piece of desktop software. "Install me and get all of these features including themes and plugins." That's not what I want. I want an API. I want a consistent cross-browser approach to wysiwyg html editing that doesn't weigh in at 200+k minified. What does Aloha come in at? (Web Inspector is telling me 1.6MB!) I haven't used Aloha but my impression is that it's trying to be like all the other editors like TinyMCE or CKEditor. wysihtml5 is lightweight, which is nice. It provides a command API so that I can wire up commands to my own toolbar and provides state management. But I don't like that some built-in commands don't offer up enough externalization, like autolinking. Or that I can't cancel an event like beforecommand. beforecommand doesn't even tell me what command is being fired. (or if it does, I couldn't find out how.)

dmbaggett 14y ago

We really need to escape the tyranny of the browser "design mode," with all its quirks. These RTEs are really lipstick on a pig, sadly. Does anyone know of a JavaScript RTE that does all the text layout and formatting itself using pure JS?

evan_ 14y ago
The RTE for Google Docs is written in Javascript, bypassing design mode: http://googledocs.blogspot.com/2010/05/whats-different-about-new-google-docs.html http://googledocs.blogspot.com/2010/05/whats-different-about... The code isn't officially released anywhere, but someone grabbed the source, prettied it up, and put it up here: https://github.com/benjamn/kix-standalone https://github.com/benjamn/kix-standalone Obviously you can't use it for anything without a proper license.

cickpass_broken 14y ago

A little related: If anyone is interested I've been working on a WYSI-Markdown editor. http://draftbin.com/c3993540679e0a1af4e5704a208b60ceb46d20dc/ http://draftbin.com/c3993540679e0a1af4e5704a208b60ceb46d20dc... Haven't gotten around to a github repo or fixing some pretty annoying bugs. But, there it is.

rogermugs 14y ago

I'm genuinely embarrassed that this seems so revolutionary. Brilliant, but seems like it shouldn't be strikingly so... as though it SHOULD have been done before.

joelrunyon 14y ago

Any idea if/how this integrates w/ Vanilla Forums?

AlexFromBelgium 14y ago

Now make a WYSILatex editor in html5 :)