Rich Text Editor Interface in Perspective

Ignition Early Access
1

Hi

My client wants the Manager to have a Rich Text Editor to create his instructions for the operators.
So I wonder how we can have some Rich Text Editor interface in perspective like the following link.
I can use a simple text input component but it doesn’t support styling. The markdown component support styling but cant be editing.
So I’m stuck here. Appreciate for any idea.

Essential JS 2dq9su3_gaMjAxODcxNjIwNi4xNjQ5MTM4NjA2_ga_WC4JKKPHH0*MTY1MzQ5NTI5OS4yLjEuMTY1MzQ5NTM1Mi4w&_ga=2.104494342.727151857.1653495302-2018716206.1649138606#/material/rich-text-editor/tools.html

2

I believe this is the link you were trying to put:
Essential JS 2

I would think at this point it would need to be either a perspective module, or some trickery with webdev endpoints. I really want to implement the Monaco Editor as a component in a perspective module as well, feels pretty similar. However I have struggled narrowing down what's actually required perspective modules in general, vs what just happens to be in the SDK examples and isn't needed.

EDIT: You could technically do some of this with a text area, if you can have your client type in markdown format. Then allow the ability to upload images to specific directories, and add a tool for the client to select and add them into the text area. Definitely possible, albeit less than ideal.

1 Like
3

Check this out

Ignition Exchange - Markdown Editor

I think this is exactly what you are looking for.

1 Like
4

Dang I didnt know this was here! I was literally about to go build this for an example. Lol

5

Well… don’t let me stop you. lol But this might save ya some time.

Honestly I have not used it either. I just said in my head “Someone has to have done this already.” And a quick search on the Exchange turned up with great success. lol.

I’ll try to find time to play around with it later. Looks pretty neat.

6

I saw that but you know managers and operators, it is hard to do that way. of course, one big problem of this exchange resource is you cant select a text area and click the Bold icon to bold it!!! You need to click the bold icon and it inserts the format for you then you edit it which is not what we want.

7

Someone could probably make a Perspective component out of e.g. GitHub - sstur/react-rte: Pure React rich text WYSIWYG editor based on draft-js. relatively easily. Would probably require some external motivation (read: $$$) from interested parties.

4 Likes