WYSIWYG rich text editor that supports diffs? - javascript

My web application is similar to StackOverflow in that different users frequently edit the same blob of text.
Currently we only support plain text, and therefore it's easy to show users how the text has changed between edits.
I want to support rich text in these fields, but my users are non-technical and therefore markup of any kind is not an option.
Are there any javascript-based rich text editors that support diffs? Ideally the diffs would be in rich text as well, but if necessary they could be rendered in markdown or similar (I'd like to avoid raw HTML at all costs).

Xopus 4 supports live tracking of text changes. As opposed to a diff change tracking allows you to follow and accept/reject the changes of multiple users.
Xopus is a web based WYSIWYG XML editor so you can have it edit your own XML flavor.

I don't think anyone can authoritatively answer no to this question, but I've never heard of a Javascript WYSIWYG editor that does diffs.
Stack Overflow does diffs on the server side. You'll probably have better luck if you look for a server-side component to do the job. If you need to show the diff as the user types, or something like that, you could use AJAX to hand off the diff work to the server.

Related

JS-based pdf report builder (with logic and rich-text)

I'm willing to make an easy to use web-interfaced report builder. Basically, I would be like a big html form with some custom logic (if you check this box then that part of the form appears/disappears), uploading of images and rich text (bold, italic, colors). The user should be able to extract a pdf (that might be either server or client rendered). Some parts of the page should appear in the final pdf, some not. I need to control the page-breaks.
I could build a totally custom web-page for that and plug the result in a custom template in PDFjs, but I was curious if some solutions already exist for this problem. I've looked into jsreport and it's nice, but it is too complicated for my users to edit html directly. I would need more of a wrapper with simple fields. PDF forms, on the other end of the spectrum, are too rigid (an frankly, a pain to deal with) for my use-case.
To me, it feels like this problem is common enough, and should appear in enough companies that some rich template solution (or at least, general approach) might exist somewhere. Are you aware of such solution ? If not, what general tools would you use ? (PDFjs, Prosemirror, ..)
Thanks for your help !

To include rich text area in XSLT page using Javascript

In one of the legacy project, business want to have rich text area on the client page.
The page is based on XSLT and javascript.
The knowledge that I am having about xsl/xslt is limited. I searched on internet but not able to find any helpful/complete answer to my question.
Need to know whether we can support rich text editor in XSL/XSLT page.
The traditional approach to using XSLT on the browser is that XSLT simply generates the HTML page content. So you have to think about how to do the rich text editing in HTML/Javascript, and then when you've worked out what HTML and Javascript you want, it's a fairly simple job to write the XSLT code to generate it.
If you want to code more of the actual interactive behaviour in XSLT, then you could consider using Saxon-JS. As well as supporting XSLT 3.0 rather than the rather ancient 1.0 standard supported natively by the browsers, it allows you to write XSLT code that actually responds to user input events, rather than having to write this in Javascript. Declaration of interest: Saxon-JS is my product.

API Design - What are the best practice to store Rich text like HTML

Let's say you want to be able to display some rich text in your app, and you want to design the backend API for that purpose.
Rich text can be :
paragraphs
Some bold or italic texts
titles from 1 to 6 weight
images
This is easy to do in HTML.
You could create the rich text I need, then store its whole HTML in the backend model's field.
Then retrieve it through your backend API as a HTML String and display it in a webview in your app or something.
But that sounds like a bad practice although I'm not too sure.
Please share your thoughts and experience about this.
Also, what would be a better practice for this kind of use case ?
It's usually not a good idea to store and display HTML as is, especially if it can be entered by a user (See HTML injection). If the HTML is always from a trusted source however it should be fine to store the HTML as is.
Some better alternatives would be to allow the users to enter markdown instead of HTML, that can then be converted to HTML when it is displayed.
If however markdown does not meet all of your criteria the HTML that will be stored and later displayed should be stripped of all possible malicious tags, for example <script> and <iframe>.
The best means of displaying HTML is likely some kind of web viewing component, which tend to be quite heavy by their nature.
What I would consider, in your situation, is a markdown component. The reason for this is markdown maps to NSAttributedString quite closely.
^^ All opinion, of course.

CKEditor and Wiki Markup (A Custom Data Processor?)

I am looking for a non-HTML Rich text editing solution.
Since I do not want to allow users to post HTML code from fear of various XSS reasons I implemented a Wiki Markup solution using MarkItUp which works great.
However, there is a loud demand for a real WYSIWYG Rich Text editing.
I found out that CKEditor can support external Custom Data Processors that theoretically can have it work with any markup language.
However, I couldn't find any implementation of such a Custom Processor...
Does anyone knows of such implementation (Wiki Markup or others: MarkDown, BBCode, etc.)?
Does anyone know of any other solution to the situation?
I would prefer a client side only solution but an Ajax based converter using a .Net based converter is also acceptable.
Thanks!
A basic BBCode plugin is available in the CKEditor package: http://nightly.ckeditor.com/latest/ckeditor/_samples/bbcode.html

Text input with options such as Bulleted list

Im looking to create an input field on a web application that is similar to the one we use here for posting questions, where you can put list items, make font bold/italic etc
Does anybody know here know of the code to do this? or could they point me in the right direction of code snippets/hints...ive tried using google chromes 'inspect element' function but cannot find the actual code behind it except that they have a class and id
The languages I can work with are JavaScript, HTML, CSS, VBScript. Ideally I wouldnt want to abstract from these languages at this time if possible.
Stack Exchange uses Markdown, a WYSIWYM (What you see is what you mean) markup language. The original implementation is in Perl, although ports to many other server-side languages are also available.
The editor you're looking at is a modified version of wmd, combined with showdown.js, a JavaScript implementation of the original Markdown language that allows client-side rendering of Markdown text into HTML which allows you to see the preview when writing and editing posts here.

Categories

Resources