Improved formatting with markdown

Background: https://trello.com/c/rFovhOID

There seems to be a bit of consensus on the idea of adding formatting to proposals/comments etc.

I did a bit of research into this while trying to learn integration tests and ended up in favour of Github style markdown as seen here:
https://github.com/mojombo/github-flavored-markdown/issues/1

If it's useful you can have a look at an example of redcarpet in loomio with these changes:
https://github.com/tixpaul/loomio/tree/feature/markdown

There's lots of different ways and styles to do this, if it's needed at all. Thoughts?

This would make me so damn happy. Markdown is so beautiful.

Sweet. Can we use github-flavored markdown with redcarpet? I definitely think formatting for comments is necessary in the long-term, I'm just not entirely convinced on the best way to do it. Does github-flavored markdown provide everything we need? From a non-coder's perspective, would they find it easy-to-use? If we add in a WYSIWYG editor later on would it play nicely?

In terms of markdown... I do like github-flavored markdown better because it handles line-breaks nicely.

Any kind of markdown is all good with me

Ah the github flavoured markdown isn't as easy as a WYSIWYG however:

It is really intuitive, less tech savvy people will be put off only until they try it.

If we just embedded a cheatsheet help button I'm sure it wouldn't take long for people to adopt it.

I typed out a big rant about wysiwyg editors and their validation and sanitization problems butttt then I found MarkitUp.

http://markitup.jaysalvat.com/examples/markdown/

Apparently there's even a github repo with a tidy guide:
https://github.com/ZhangHanDong/rails_markitup

As far as whether it will do everything you need, I believe it's actually the same markdown engine Github actually uses (http://github.github.com/github-flavored-markdown/) and it's really flexible if there was something else that came up.

Ah sweet. That all looks good to me. And I think a cheat-sheet for now would do just fine.

Maybe it is better with WYSIWYG or visual editor, so any member can use it easily.

Totally agree @christaklis. My ideal comment box would have drag-and-drop images too.

I wonder if there are any good gems out there to handle this? If not we should build one!

@richarddbartlett Jack_up looks like it could do the trick

how is that going? because some members of my group asked again and again how to format their text.

hi @christaklis — the comment box is shortly going to be improved a little, so that when a user attaches an image it will insert an image preview into the comment. Should be live next week. But I'm sorry, I have no idea when WYSIWYG commenting might be coming down the pipeline!

I think the most important is the context discussion box and comments of course.

But usually in the context discussion's box we usually write a big text or update it with something new. There must be as simple we can everyone to format the text so to look good in others eyes.

@christaklis, just checking, have you read this?

@richarddbartlett of course I have read it. I use it often but the other members of my group can not understand it easy.

@christaklis can you think of any examples of websites that do text formatting in a really use friendly way?

here a screenshot from google search how do i think it.

somethink like that:

@richarddbartlett here is the wysiwyg builder site: (http://wysiwygwebbuilder.com/)

I made a small mock-up to understand everyone.

i think like that for beginning it would be easy for every member of each group can format their text.

it is a simple bar with few buttons (or all the formating buttons, like quote, headings, code, etc.), and when you select the text you want and press the button you wish in the bar it transforms the text in the "markdown".

So the buttons can convert the text to the code you have to put each time.

Except of course if the designers / developers go to wysiwyg or visual editors!

This is really nice @christaklis! This is definitely coming, we'll just need to figure out when we can prioritise it. Will keep you posted!

Hey...... I just found this:
http://toopay.github.io/bootstrap-markdown/

I rekon someone would feel pretty cool if they decided to put that in for us.

I would like to try using it as the default editor around loomio. (both comments and positions)

I wonder if we could throw it in an enable it only for some groups to get well tested user feedback.

That looks great @christaklis! Looks like the kind of little coding project for me to take on in my spare time one of these days :)

@richarddbartlett I think you missed my post! No coding project for you!

Rad @robertguthrie, looks like my project got a lot easier! We have a way to enable beta features eh? So I could slap this on the Loomio Community and Enspiral groups and we could play for a week or two?

@robertguthrie that is exactly what we want a simple editor. As I see it is ready so no one has to develop it from zero but to put only that code.

@christaklis @robertguthrie @matthewbartlett @benjaminknightloom
what do you think of these mockups?

Here's the comment box with bigger more attractive buttons:
http://i.imgur.com/arXBuNl.png

And when you click on the "A" icon, it brings up more formatting options:
http://i.imgur.com/4RZ0fOJ.png

So you put in some text:
http://i.imgur.com/HYp7TEe.png

And hit 'preview':
http://i.imgur.com/wz75Te3.png

@richarddbartlett that mockups are excellent.

Only it would be better if also had button for images.

@richarddbartlett love it. Wonder if you could lose 'Comment preview:' + maybe even the border around the preview? (which border doesn't quite align with the comment box). GREAT though

@richarddbartlett I wonder now why we wouldn't just show everyone the formatting buttons from ze get-go?

Richard I love it. I think that hiding the formatting buttons at first is right, it's way less complex looking that way.

Really nice and clean mockups.

@matthewbartlett I think you're right about losing the heading and border on the comment preview.

@christaklis a button for adding images is an obvious next step, but I think we could get this version out first, and add images later as there is a fair bit of extra work in that.

Also I should add that clicking the '?' button would bring up a Markdown cheat-sheet, like how Github does it.

@richarddbartlett i totally agree. Get this version and is updated or extended in the future.

Any news about this? It's over one year discussion...

Hehe @christaklis the news is: the way we have markdown implemented is really nasty so every time someone starts to fix it they run away.

It will definitely happen at some point in the future, it is just a more difficult job than I imagined a year ago.

that's too bad news... that would help a lot of people who don't understand markup.

i wait news about the development of this... i hope that won't "fall in the drawer"!

@robertguthrie is actually working on this today! Expect some improvements soon and vast improvements in the next several weeks. @christaklis we are moving away from markdown and into using HTML formatting that's a lot more user friendly and also will allow formatting when people reply by email. But as @richarddbartlett said it's actually a complicated issue.

thanks @alanna that's good news! i want to see how it will become... so i am waiting till it's ready!