ContentTools: A WYSIWYG editor for HTML content

by prawn • 11 years ago

48 11 11 years ago

I've got to say, this entire set of tools looks incredibly polished and well designed. The documentation is amazingly thorough, and the getting started tutorials cover exactly what I hoped they'd cover. (I'm looking at building a collaborative, real-time editor for Markdown-like content.)

Everything was super positive.

And then I went to browse the code, and it turns out it isn't actually hosted on NPM; it has a weird custom build process that means every file has implicit module dependencies between them, but you can't really tell which; and everything's written in Coffeescript.

Went from super excited to questioning whether it's something that is going to be more of a hassle to develop and contribute to than it's worth.

The design decisions of the library itself still seem strong, but the developer experience design decisions will probably mean that it sees nowhere near the adoption it could have seen. If anyone knows of similar libraries I'd be really curious to hear what people have used in the past.

voltagex_• 11 years ago

I hope you don't mind, I've quoted you in https://github.com/GetmeUK/ContentTools/issues/28

arethuza• 11 years ago

You might want to change the page that has "Click the pencil icon top-left" to make it clear which icon you are referring to - I was clicking on the pencil icon in the logo and getting confused. Took me three attempts before I noticed the red pencil icon on the far left (I had the page opened full screen on a very wide monitor).

NB I was up early and haven't had much coffee - so it could just be me... :-)

nickjackson• 11 years ago

Have you seen http://prosemirror.net? Not quite as well polished, but probably more suited to real time collaboration.

anthonyjb3• 11 years ago

Thank you for the feedback. Right now all dependencies are included with the package in a folder called '/externals' and the build process concatenates them to the start of the final output file - which 'hands up' isn't ideal and moving towards correct node/npm support is a goal for the very near future.

To provide a very quick overview: ContentTools is a collection of libraries all written in CoffeeScript (this is up for debate https://github.com/GetmeUK/ContentTools/issues/10), the collection includes:

- FSM (https://github.com/GetmeUK/FSM) [no dependencies]

- HTMLString (https://github.com/GetmeUK/HTMLString) [depends on FSM]

- ContentSelect (https://github.com/GetmeUK/ContentSelect) [no dependencies]

- ContentEdit (https://github.com/GetmeUK/ContentEdit) [depends on HTMLString, ContentSelect]

- ContentEdit (https://github.com/GetmeUK/ContentTools) [depends on ContentEdit]

For developers each library does have other grunt related dependencies which are required to transcompile the CoffeeScript and SASS as well as perform some base concatenation. Instructions on building/testing each library is provided on each of the GitHub pages.

Along with implementing better dependency support, for those looking to contribute:

- I still haven't added a release numbers to the builds yet (so that's first priority)

- I haven't posted any contributor guidelines as of yet.

Please bare with me, didn't expect the amount if interest so far (though that's been awesome), not released an open-source project before, still learning about git (everything was on Mercurial before release) and publishing packages using bower/npm.

scoot• 11 years ago

Desktop only unfortunately. What are the plans for touch devices?

anthonyjb3• 11 years ago

That's a good question. In reality whilst it's not too much work to make the editor function in a touch environment, I think there will be a lot of work in designing the UX for smaller screen touch devices - for example the floating toolbox really doesn't work on a mobile or smaller tablets.

It is a goal for the editor to support touch such devices but I wouldn't feel comfortable saying it's something that's likely to be supported soon as there are other tasks ahead of it (including completing the test suite and finishing some additional tutorials). Thanks for your interest.

orf• 11 years ago

Looks amazing, not sure about the lack of bower/npm though

cttet• 11 years ago

Is there any external WYSIWYG HTML editors which I do not need to add the extra Javascript inside (except Dreamweaver)?

ContentTools: A WYSIWYG editor for HTML content

Related Stories