I love this approach.
I've seen too many double-pane markdown editors, which strike me as an uninspired, bloated interface.
Markdown is already readable! You don't need to waste half your interface on a preview that's visible all the time, when you can just syntax-highlight the Markdown to be its own preview.
Isn't a specialized "editor" is antithetical to the very idea behind Markdown, which is to make written text as readable as possible both in plain text and the web? Markdown syntax is already too simple. The original authors even mention "plain text e-mail" as their biggest source inspiration. [1]
> Clients always want wysiwyg editors and you know that's bad for them, so this is a great compromise for them and for you
So far any time Ive released a content editing text area that uses markdown to the mass public, it's resulted in everyone treating it like a normal text box because they don't want to learn markdown. Wysiwyg editors, as much as we hate them, always gets much better adoption.
Storytella[0] takes the same approach. It uses a Markdown editor in a single pane, no preview, which is also based on CodeMirror[1]. CodeMirror makes this kind of editor straight forward to build, with a lot of configuration and extension options. This seems to hide a lot of the configuration, so I would think is great for dropping into new admin or comment systems where you need rich text but don't want to allow arbitrary HTML.
I would consider switching over to it, as it would mean less code for me to manage, but I'd need the CodeMirror extensibility exposed.
(disclosure, I built Storytella)
This is fantastic! I've seen a few of these WYSYWYG-like Markdown editors, but I like this because it doesn't come with an ugly toolbar and has automatic list, numbered list, and quote insertion upon typing the return key.
There's a lovely app for OS X called Mou that does this quite well: http://25.io/mou/
The problem which this is trying to solve is that clients like WYSIWYG and developers want control over their markup.
But, why not make a simple WYSIWYG -> Markdown editor? I've never found an elegant and mature editor which does this
Great work! Always happy to see people working towards a WYSIWYG editor for Markdown.
I did a similar project¹, with strong focus on editing math, inline, and āreal timeā wysiwyg. It failed. The problem is that most such approaches treat Markdown as _code_ instead of _text_, and inevitably mistake syntax highlighting for semantic, text-driven styling (as if one would style nouns, verbs, adjectives, instead of <h1>, <p>, <em>, etc.). Thus they use a code editor such as CodeMirror (like this one does, too). And then you must style `.cm-` syntax markers instead of the eventual (html) nodes that would be the output of a real Markdown parser. Which makes it impossible to just throw in any arbitrary html5 css-stylesheet. Which is imho the whole point of wysiwyg Markdown editing.
What youād really want instead is true Markdown parsing, which normalizes the userās input into a parse tree, then renders to clean html. But syncing input and output over an AST is quite impossible as long as Shadow DOM is not available in browsers. Cfr interesting discussion, over at Github (re: Quill editor).²
As for Markdown parsers: thereās many of them. The OPās project uses @chjjās marked.js³: wouldnāt harm to mention that on the homepage or in the README, since behavior (markdown interpretation) is very different from parser to parser. (I used to maintain a repo which lists all available Markdown parsers, apps, etc.)ā“
Meanwhile thereās CommonMarkāµ, of course, which has already some really fast implementations in JavaScript. (Plus, theyāre āStandardā ;-)ā¶ Would be nice to see one of the CommonMark reference implementations incorporated into a WYSIWYG editor like this one.
¹ https://github.com/rhythmus/mathdown ² https://github.com/quilljs/quill/issues/74#issuecomment-4294... ³ https://github.com/chjj/marked ⓠhttps://github.com/rhythmus/markdown-resources ⵠhttp://commonmark.org ⶠhttps://news.ycombinator.com/item?id=8264733
> Clients always want wysiwyg editors and you know that's bad for them
Not a fan of wysiwyg, but a bit arrogant no?
People are not born knowing how to use WYSIWYG, they learn it, and it is not easy, it is not more "natural" than writing Markdown or any other thing.
Funny, this is the kind of solution that programmers come up with (as opposed to UI designers).
I use SpaceGray theme in Sublime Text which provides syntax highlighting for markdown, which I simply adore and find indispensable. One thing I always missed in it was the better formatting of different headers, I am glad to see this and other features implemented so properly.
I think I may be in the minority for just not liking Markdown in general. I don't understand the hub-bub around it.
Codemirror is such a great peace of code!
Call me crazy but I still can't see what all the hype is with Markdown, BBcode, and all these other formatting languages that come out every few years. What ever was wrong with just defining and using a subset of HTML?
That's great. One thing: You may want to know that the link input is broken on the iPad. If you already have an open keyboard, you can't insert text on the alert form.
Would upload to s3 work?
I failed to see any mention of iPython notebook which does the same thing. Who borrowed from whom?
**foo*f**f*
The WYSIWYG should be closer to the Preview for these messy cases.You might want to consider changing the name. It's not great practice to use the name of someone else's open source thing to name yours. It's fine in the tagline.
Meh. Still doesn't come anywhere close to Emacs and Org-mode.
I would love to see a really good WYSIWYG-like thing that creates Markdown.
I'm one of the founders of Perch (http://grabaperch.com) and we have almost 6 years of experience with Perch - and many more of creating custom CMS solutions before launching Perch. We've always tried to get people to write Textile or Markdown.
When we were developing custom solutions we actually had pretty good success with getting our clients to use Textile, once we'd explained the benefits. With Perch we ship our default templates (which are really just samples) using the MarkItUp editor and set to use Markdown, and not allow HTML. However it's all configurable and we offer editor plugins so people can switch to using Redactor, CKEditor, TinyMCE or create their own editor plugin.
In discussing this stuff with our customers who are developing sites for clients, it's not something that inserts HTML that they want. They just don't want the end client to see the Markdown as they don't think they will cope. I think there is often an assumption that they won't cope, but for whatever reason they end up installing CKEditor or whatever and it allows in a load of junk markup. This makes me sad.
So, an editor that created Markdown yet allowed for some sort of preview of how things will look I can see the benefit of, if just to encourage confidence in not using things that allow inserted HTML.