I need to add a text area that also has line numbering capabilities. I tried EditArea, but I couldn't make it work with text files. It would be ideal if it could highlight syntax for existing programming languages, but that would only be a side bonus.
The main thing I'm after is line numbering for whatever I paste in it. Please only list open source ones.
Try Etherpad, we can configure it to show line numbers.
Etherpad is a highly customizable Open Source online editor providing
collaborative editing in really real-time
Other opensource alternatives CodeMirror and Firepad
Firepad is feature rich, built on Google's Firebase, so no need to setup a server
Related
I want to make a feature using vuejs jsust like MS word to edit PDFs. How can I make such pdf editor with vuejs in which I can add my own customization logic?
e.g.
Feature should be able to do things like
Adding conditional replace text
Adding tags to text within pdf
Change background color of text.
This would be a fairly major project. Perhaps you should look for libraries already built, read through issues on Github and project documentation to get a sense as to how these products are built.
There are only a handful of packages in the 'awesome vuejs' library that deal with PDF viewers. No PDF creators that I can see; it's probably very hard to do.
This one has 1700 stars and is not recently active, meaning there may not be a lot of people actively working on the custom PDF editor space. This may be the largest in the Vue community for viewing, not editing.
https://github.com/FranckFreiburger/vue-pdf
Take a look at this curated list for inspiration in various UI areas:
https://awesome-vue.js.org/components-and-libraries/ui-components.html#pdf
Best of luck to you,
Marcus
I copy code from VSCode to Quill, it has a nice color scheme. But when I enable code-block, it becomes just dark and boring. Is there any way to preserve original colors?
The colorscheme you see in VSCode is what's called syntax highlighting, and its done dynamically, i.e. is procedural and only "exists" in VSCode as it reads that code and displays it to you in some kind of visual buffer.
Typically, when working with code snippets/markup/markdown and a clipboard which copies and pastes, its pretty much just the text. Code, like this html code you are working with here, is never what is called rich text. Mainly because rich text is already a kind of code! It is something which defines the bold and colored aspects of your text (or image uris, links, etc), that, when you see it in Word or your web browser, it is something that has been parsed as a code and turned into a presentation of formatted text (in a way, the entire history of software and/or application development revolves around this very idea, consider the history of WYSIWG).
For this reason, something like html markup existing in your IDE which is itself only a "representation" of html markup, would be quite a weird thing that would be complicated to handle, not to mention quite distressing ontologically in coding world.
What you need is something that will reproduce the same procedural syntax highlighting you see in VSCode within css/js within Quilljs, and... your in luck!
https://quilljs.com/docs/modules/syntax/
That seems to be what you need, and you can even configure it to the exact colors you like in VSCode with some patience. (Quill is using the highlight.js library internally, as the module description page notes, so thats why the config link is pointing to those docs.)
Is there any open source low level web based editor ?
(I'm aware of wysiwyg editors like CKEditor, I'm looking for something different. )
The editor should work in a way like new Google Docs editor.
The editor should take user's input key by key and should build the text. so that the client JavaScript can have complete control while editing.
Why i need it ? I need to build a DSL editor for my application with syntax highlighting and auto complete.
I already found code editor ace http://ace.ajax.org . but it has lots of features that I don't need, so I'm searching for alternatives.
I'm looking for similar lightweight editor, so that I can add my features (like autocomplete ) easily to it.
Have you seen Aloha Editor?
HTML5 and fast too:
http://www.aloha-editor.org/
It's open source there are no iframes and you can access the page contents just as they are.
It's the future of html editors.
There's collabedit:
http://collabedit.com/
I am after a JavaScript Rich Text Editor that supports highlighting words and triggering events when those highlighted words are clicked, like what Gmail does when in spellcheck mode.
I will need to heavily customize any existing solution, so something that is easy to extend would be ideal. Currently I am leaning towards TinyMCE.
Richtextbox or HTML?
If it is HTML, then you should stick with TinyMCE. :
It's (very) easy to integrate
It works across browsers
The toolbars were easy to modify
Wordpress uses it!
For what its worth, we also looked at FCKEditor but preferred TinyMCE
UPDATE: While some users wanted it, spell checking has never been on the "essentials" list. It has always been quicker / cheaper for us to teach the handful of users how to use the spell checking features of IE, Firefox or Chrome instead of putting it in the editor.
Imagine trying to code the 3 been soup example!!!
TinyMCE seems to be the best one these days. You might want to take a look at FCKEditor and HTMLArea as well. You can find a list of such WYSIWYG HTML editors here.
I'm looking for a customizable JavaScript script which dynamically highlights code in a block like
<code class="someclass">source code...</code>
It needs to be customizable because the source code is in a quite esoteric programming language (Mozart/Oz). Ideally, I'd just edit some regexes to make it work.
I need dynamic highlighting because it should work in the github wiki which escapes all HTML code within a pre tag.
My Google fu has forsaken me so far...
SyntaxHighlighter might be what you're looking for. It supports custom languages, as well.
jQuery Syntax Highlighter is a new one based on version 3 of Alex Gorbatchev's Syntax Highlighter - a really really really popular plain javascript syntax highlighter.
It supports such things as code and pre blocks, able to use classnames like language-javascript to indicate we want it to highlight, as well as wordwrap. You can copy and paste code by selecting it normally instead of having to open a raw view like many others. It can be further customised by using the HTML5 data attribute data-sh or via specifying options at initialisation. A great stable choice which is updated regularly.