I just started with Ace online code editor and it looks very powerful and easily customizable. I am using the editor as a syntax highlighter on my website. I wanted to implement line bookmarking functionality like Github Gists on my editor. And since github uses Ace editor, I think it will be possible. But there are lots of api and events in Ace editor and I am confused which one to use.
If somebody has already implemented the above mentioned feature then please help me out with the api and events needed to implement it.
Thanks in advance.
I used this:
editor.on("guttermousedown", function(e){
console.log(e.getDocumentPosition().row);
})
The first line detects every mousedown event that occurs on the "line number" section of the text editor.
e.getDocumentPosition.row detects the row of the mousedown, that matches the number of the line that you've clicked.
That way, you can use other ace actions to what you want with the line you selected.
Okay, I think I figured it out. There is a event 'guttermousedown' which captures the event when the user clicks on the line numbers. Check this github issue
I'm use Vue.js
editor.on("mousedown", function(e) {
console.log(e.getDocumentPosition().row);
});
Related
For a few days now I've been searching for a solution to watch the ace editor fold, so I can put the code to do something when the folding event happen. A callback would work perfectly, but there is none, as long as I know, for the folding.
I searched on this directory of the project, but I didn't find a possible answer for that:
https://github.com/ajaxorg/ace/tree/master/lib/ace/edit_session
Does anybody knows if there is a core solution for that, or I will have to develop that for my own?
Thanks,
there is a changeFold event on editor.session see https://github.com/ajaxorg/ace/blob/v1.2.5/lib/ace/edit_session/folding.js#L343 https://github.com/ajaxorg/ace/search?q=changeFold&type=Code&utf8=%E2%9C%93
Is there any way to add view source code button to quilljs editor?
I looked into the documentation and no explanation for this or should be developed by the developer.
Any help will be appreciated.
Thanks
I haven't extensively looked at the api but I think you are best off rolling your own button. It seems quill.js allows you to add your own custom toolbars to the documentation. I would look at this page to do that. http://quilljs.com/docs/modules/toolbar/
You can add an on click on the button that simply gets the editor's html and puts it in an element using this. var html = editor.getHTML(); http://quilljs.com/docs/api/#quillprototypegethtml
Sorry to be brief, but if you need more info on how you can comment below.
I'm working on an ASP.NET MVC project which uses the MarkdownDeep Editor to add a rich editor on top of a basic markdown input textbox (very similar to the Stackoverflow editor window).
Generally it works great. However, in certain scenarios, I would like to disable the preview window. This is automatically generated below the textarea by MDD. Can this be disabled?
Just to be clear, I know I can use CSS to hide the preview. But on some devices it's slow and makes typing painful. I want to entirely turn off that feature. I don't see anything in the docs other than how to customize the preview.
Any ideas?
In the docs it specifically mentions that it is recommended that you have the div preview already in your document because it will be created if it isn't found and consequently, could could a visible page refresh if any re-layout has to occur.
Note: the associated divs are all optional and if missing, the plugin will create them. However... you might experience the page jumping around during load if you do this. ie: it's recommended to explicitly include them.
Thus from the sounds of this, and that there doesn't appear to be any option to turn it off in the API page I would say no, it's not possible.
I am a little confused here: if you don't want the preview, use a regular text area instead of mdd_editor... So, under the scenarios where you don't need the previews, instantiate a plain vanilla editor. What am I missing here?
I know this is old, but I was looking for something else on mdd. I recently had this same requirement.
Just comment out the code
// Update the DOM
if (this.m_divHtml)
this.m_divHtml.innerHTML=output;
in MarkdownDeepEditor.js
im searching for a libary or suggestions for making a real time styler in javascript/jquery. The idea is that my users have a html text input, i need to detect in real time some patterns and apply an style to it, for example is the user writes #some_text all after the # should be considered like a tag a have to be bold like #some_text.
Im very new at javascript so i have no idea of where to begin, i did some research but i didn't find any already made libary. Thanks for any help and suggestions!
What about something like jQuery Tagit?
You could initialize it like this:
<script>
$(function() {
var availableTags = [
"#some_text1",
"#some_text2",
"#some_text3"
];
$('#tags').tagit({tagSource: availableTags});
});
</script>
<ul id="tags"></ul>
Something like that is used right here, on this website. Whenever you write a question or an answer in the editor, you get a live update in the area below. When you apply formatting it's updated in real-time in the preview area.
This uses a standard mark-up syntax called Markdown. What's good about that is that there are many tools that support Markdown, so you can find integrations for jQuery and even offline editors (Windows and Mac).
Check this question and its answers for some editors that do this.
Also check out the stand-alone version of the Stack Overflow editor.
maybe this helps you a little bit to understand what you have to do:
http://jsfiddle.net/EeGxs/3/
All I did is add an event listener to 'keydown' which means a key is pressed, and then you just have a look if there is a '#' in the line and if you add it to the p -tag which is bold.
Its only a demonstration.
I have two questions:
While editing a source file, it's very convenient to be able to label the current position of cursor and then jump to it later by somehow calling that label. I VIM, there is the marking notion, but I'm not aware of such possibility in Eclipse text editor.
Is there any way in Eclipse to add a portion of the code to the outline window, such that you can easily jump to that part when you click on it? I know that for java source-code, almost all variables and functions are shown there, but what if I have a html/javascript code, in which I'm using jquery functions, and the outline doesn't show these functions.
Any help is appreciated!
I dont have any direct answers for your question.
May be you are looking for the following eclipse features.
Eclipse supports bookmarks, you may use that feature. Also CTRL + Q will go back to the last edited location.
You may be able to get this using the Mylyn, which is packaged along with eclipse by default. Implements the notion of a Task focussed IDE ( RECOMMENDED)