The Rich Editor is enabled!

Unknown
edited July 2018 in General

The Rich Editor plugin has been enabled and deployed to our staff forum! Please play around with it and let us know any issues you have.

The editor is enabled for all new posts. If you edit an existing post or draft it will continue to use the existing Advanced Editor.

How to Report Issues

There a few things in particular that we are testing for and a few things to keep in mind during the testing process.

Please report any issues on this github issue, and not in new separate issues. There are already quite a few things that have been noted and I will triage this thread after so we don't end up with a bunch of duplicates.

  • Most differences between what you see in the editor and what you see in the final output and what you see in live editor are a bug. Please report any inconsistencies here.
  • Please report any behaviour that feels buggy or broken.
  • If something is confusing or not clear how to do, please report it here.
  • Issues with the appearance should be noted as well, but keep in mind some changes will have to be done on a theme by theme basis. https://github.com/vanilla/vanilla/issues/6732


Notes

  • Rich Editor has a conflict with our current "Quotes" addon. That functionality may be added to Rich Editor in a different way in the future.
«1

Comments

  • @charrondev Congrats to the whole team on finally getting it to this point! I can only imagine how much work went into it!



  • Also a quick question. So does that mean two plugins need to be turned on when this launches. This is essentially an add-on requiring the Advanced Editor (and hence why old posts will still use it)?

  • Unknown
    edited July 2018

    I can't seem to figure out how to upload an attachment - is that something sepearate? I don't think I've ever tried on the staff forum though so maybe we just lack the permission.


    I get a 403 error whenever I try to upload an image.

  • @franciscaisse

    To be clear, you no longer just copy paste the youtube URL, you need to put it in the isnert media thing?

  • The Advanced Editor is only needed for people that have existing posts using it (which is most current sites).

    In the future we may work on some way to convert posts. Right now copy/pasting most existing content in will preserve its formatting though. The copy paste doesn't work correctly for everything though. Some things either don't have an equivalent or might not be preserved exactly correctly such as

    • Mentions (will be turned into links with the username as text)
    • Existing embeds (won't be turned into new embeds).
    • Our existing fake emojis.
  • Unknown
    edited July 2018

    @BrendanParm Pasting the link and hitting enter will also transform into, but a manual action is required to do an embed. In this case pasting a link on its own line and hitting enter will do the transformation.

    This decision was made because we intend to have a direct 1:1 of a post in the editor and a post once it is published. This is also why there is no preview button.

  • @BrendanParm I forgot to run utility/update after the site was a set up. As a result a new permission (given out automatically in 2.7) had not been created yet. This will not be an issue when we do proper deploys when the release goes out. Image uploads should work now.

  • Let me try this fun editor. ?


    @ZoeyO @Haya since you're both pretty new, can you come and post some stuff to try it out. Share links, gifs, etc.


  • Unknown
    edited July 2018

    I am not sure if that is a bug or priority.

    It seem when mobile mode there are no buttons "preview", "edit", "save draft".

    But only "post comment"


    Screen Shot 2018-07-17 at 1.16.47 PM.png


  • @AlexanderKim Our staff forum is currently using our default mobile theme from a few years ago which has quite limited functionality. This is actually not specific to the Rich Editor, but comes from the themes choices of what it wants to present. The buttons are there but hidden.

    That icon on the left appearing on mobile is a bug though. The issue where we are triaging initial feedback is this github issue.

  • Alex Powell
    edited July 2018

    I am happy to file an issue, but I am not sure. I added a comment here


    and the link did not render -- I was confused that it was a post added after the editor.... or is it that any discussions created after the editor is enabled, will not have the editor features?


    **edited**

    Also as an aside, kind of weird to have a preview when a page does as above. Not sure there is a fix for it, but if people are self-referencing within a closed community, it's a weird preview (especially because I am signed in)

  • Unknown
    edited July 2018

    @Adrian Could you clarify what you mean by that?

    Please do note the same-site private community thing. I remember bringing it up before but I don't think it got much attention.

    I did just notice that the links are not coming through in our server side rendering of these generic link embeds. They appear differently than they do in the editor in a published comment or post.

    In Editor

    image.png

    Posted

    image.png


  • Is there a doc on how to use this editor? The reason I ask is I'd like to know what functioanlity was specifically supposed to be different about this compared to our advanced editor .Is it using WYSIWYG by default or is still Markdown?


    • I realized if I made a star it would make a bullet point but how exactly was that obvious to most people?


    Is it possible to do H3, h4, h5?


    If i were typing this out and wanted a few words in code block, is the only way to go back and highlight the section and then click code blocks? Is that how it always is?


    hawaii.jpg


  • Alex Powell
    edited July 2018

    So I had a discussion pre-editor turned on. I added a comment today and the link did not have a rich box. So we need to make clear the rich editor applies only to discussions created after ( assuming that’s intended behavior)

    secondarily we have lots of people with private or closed categories and I think the preview is suboptimal. Maybe if it returns a sign in it should just be the link, otherwise you have no idea where you are going as you noted in your screenshots...

    hope that makes more sense :)

  • Unknown
    edited July 2018

    I started a doc, but it still needs work. It will likely be screenshot filled and I didn't want to put a lot of time into that until everything is finalized.

    On List Styles

    @BrendanParm Are suggesting we put the list styles into this menu?

    image.png


    Its a valid suggestion. Please put it in the github issue.

    On Headings

    I don't think there is any intention to support more than 2 levels of headings (similar to our wysiwyg).

    The intention of the first version of the Rich Editor is to replace the WYSIWYG editor. @Todd has expressed interest in making a markdown version of the editor, but for now its just WYSIWYG. Formatting things inline requires a selection currently.

  • spoiler text

    I had to tab to get out of spoiler text

  • @BrendanParm there are multiple way to get out of the spoiler. You can click out, arrow out, or hit enter twice.

  • @BrendanParm The new spoiler is actually far more escapable than the previous one, although there is any issue to improve it further https://github.com/vanilla/rich-editor/issues/57

  • Great work Adam and Stéphane!

    ???

    babyorang.jpeg


  • @adam, so was my comment here helpful. Is there a way to fix this?


    We have lots of people with private or closed categories and I think the preview is suboptimal. Maybe if it returns a sign in it should just be the link, otherwise you have no idea where you are going as you noted in your screenshots...

  • Unknown
    edited July 2018

    ^^ We should put a slight brightness filter on images that are in an embed like that


    With the filter

    image.png


  • Unknown
    edited July 2018

    No, any modification you do may or may not work depending on the background chosen. On top of that, the image might look off. If we are to do something, a subtle border or shadow would do the trick.

  • A 2/3% brightness change would handle the issue of screenshots with pure white backgrounds appearing like that. It seems low priority to me though.

  • All the colours are dynamic, so any arbitrary change to the image may or may not work with the bg and image combination. I do agree with need a light border, I would just put a right border.

    All the colours moving forward are variables, so you always need to think of contrast with varying inputs.

  • 9B20F02F-0AF9-4345-97C3-50B9AE061A2F.jpeg

    Even works in mobile!!!