codemirror / codemirror5 Goto Github PK
View Code? Open in Web Editor NEWIn-browser code editor (version 5, legacy)
Home Page: http://codemirror.net/5/
License: MIT License
In-browser code editor (version 5, legacy)
Home Page: http://codemirror.net/5/
License: MIT License
Noticed that saveFunction isn't implemented in CM2 - is this a TODO, or should we be implementing this on a different level (on the page itself, for instance)?
It seems to somehow not take the border in account when computing offset coordinates, currently.
Hi!
So, my CodeMirror was lagging like crazy in Chrome, like I reported earlier, due to unknown reasons. Today I finally had some time to spare and tried to dig into this issue. I am glad to say after a LOT of trial and error I pinpointed the cause.
It's nothing to do with JS, it's in CSS. And it's not even to do with CSS applied to CodeMirror...
Adding the following CSS to the index.html in the root of the project will make the editor go berserk in chrome:
textarea {
width: 100%;
padding: 0;
border: 0;
}
I don't know why, or how... but this just makes CodeMirror lag like crazy, and the cursor won't position properly etc. Of course this is very much a cornercase, but I find it pretty curious nonetheless.
Hope this helps.
Chiel
how difficult would it be to add X/HTML tag-matching similar to SynWeb? which in my opinion has the most useful matching bracket+tag highlight of any editing component.
you can see a demo of how it handles unmatched tags, self closed tags etc. by cursoring back and forth through "<img /><span></span><div><img >" in DevPHP Portable: http://devphp.sourceforge.net/
thanks,
Leon
<script type="text/javascript">//<!-- foo(); //--></script> <p> bar </p>
After //-->
code doesn't highlight properly.
Hi,
Surprisingly couldn't find an issue on this so I've created this. Just upgraded to codemirror 2.0, but I am having problems with it.
On IE 9 (9.0.8112.16421), the demo here http://codemirror.net/mode/javascript/index.html is not operating correctly. It seems to skip every so often, and not read the input of the keyboard. I will be typing code and letters will be missing. Even when deleting (i.e. backspace), it sometimes does not pick up on it.
Another issue in my own implementation is that the cursor doesn't line up on IE 9 (it's slightly below the line), and blank lines aren't working correctly (they dont appear unless you select it - it's weird), but it seems to work at the above example so maybe I have done something incorrectly. Not sure what though since it works fine on Firefox.
Hope someone can help!
Thanks.
To show people how to do
On some platforms, pressing and holding a key doesn't result in immediate visible cursor movement. Probably because the key fires more slowly than CodeMirror expects, and thus the polling has already stopped when something happens.
Following the manual:
onChange (function)
When given, this function will be called every time the content of the editor is changed. It will be given the editor instance as only argument.
I setup this handler in an instance of CodeMirror 2 and it's executed only on component creation time, on setValue() and when 'delete' key is pressed. I would expect onChange to be executed on every keystroke that results in editor's content change.
It tried this in Chrome 10 and Firefox 3.6.
So, is the described behavior correct or is it a bug? I can simulate the requested behavior with onKeyEvent, but this would require me to check my self if a keystroke would result in editor's content change.
In CodeMirror1 there was a useful function reindent(). How to achieve the same functionality in CM2? Would be handy to have such a feature.
Hi!
I'm working on an app which will use CodeMirror2 as it's input editor. Everything is working great, except the way the height of the gutter updates. At the moment the height of the gutter gets updated every time a line gets added/removed, which is logical, but it doesn't seem to update when the codemirror instance gets resized.
I thought the best way to counter this, was to call .refresh() on the codemirror object, but it doesn't seem to help. I may be doing something horribly wrong, but it seems to me like .refresh() was created exactly for cases like this.
Looking forward to your reply!
Chiel.
(Observed on Chrome 9 Mac, JS demo)
When going off the bottom of the editor with my cursor, it will first scroll by a little bit a few times (as indented), but as I keep going, it'll suddenly jump down a whole screen's worth, which is jarring.
As in https://github.com/mozilla/skywriter/wiki/Common-JavaScript-Syntax-Highlighting-Specification
I'm holding out on this until ACE starts seriously working with this spec, but eventually it would be awesome if modes were portable.
Hi,
First of all well done with CodeMirror one i really like the customizations available. I would like to know if there are any plans when this should be released.
I would expect command-a to select the content and ctrl-a to move the cursor to the beginning of the current line.
It is currently possible (and will probably always remain possible) to start dragging above the editor, and end dragging below it, in order to select a chunk of the document that includes the editor. This will be somewhat confusing, as copying that text will include a randomly cut off part of the editor content.
However, the real problem is that it's also possible, by starting to drag somewhere in or near the editor where CodeMirror doesn't recognize the click as representing a character position, to select just a piece of the editor content, but select it as a browser selection, not a codemirror selection. This tends to look funny, and doesn't respond to editing as expected (you can copy, but you can't replace/delete/etc).
Maybe we can adjust the mouse coord reading code to make this less likely to happen. That still allows drag events starting (slightly) outside the editor though. It is not clear how to detect those.
Opening http://codemirror.net/demo/mustache.html in Chromium 12.0.724.0 (80289), clicking for example in the middle of the 3rd line and entering text, a big chunk of the initial text disappears.
On 8b5c31d , each time I return to the line the text is indented.
Not sure whether this is a codemirror.js or xml.js bug but, in the HTML demo, if I press enter at the end of the first line, and type , that line does not get colored. Adding similar closing tags in other places does work as expected.
start selecting and move mouse out of editor
view scrolls only on mousemove events, but should scroll all the time while mouse is outside
In the PHP demo here : http://codemirror.net/2/mode/php/ the following things happen around typing a forward slash:
Google Chrome 10.0.648.133 (Official Build 77742) beta
WebKit 534.16 (branches/chromium/648@80788)
V8 3.0.12.30
User Agent Mozilla/5.0 (Windows; U; Windows NT 6.1; en-US) AppleWebKit/534.16 (KHTML, like Gecko) Chrome/10.0.648.133 Safari/534.16
Cheers
Charlie
[email protected]
toTextArea method does not work - it throws exception probably because instance.div is null in #1515. Next problem - when I made an workaround for this (by adding id to the div and selecting it by getElementById) it says that rmSubmit is not a function.
I fixed it at one point... seems I didn't apply enough duct-tape.
(and whether a better interface can be invented for this)
Also: document it if it stays
No overkill like I initially had in CM1, but some of the more interesting parts of the code could really use clarification.
Beta 1.
In XML mode, try typing this in:
<div>
<img src=""/>
</div>
You can't type it. It hangs before you close the img tag after typing "/", and won't allow you to type any further.
[from askival]
Also, CodeMirror 2.0 beta 1 does render, and appears to work perfectly
at first glance, but certain simple keystrokes cause erroneous
behavior. For example, focus on the editor and press the down arrow.
The cursor moves to the right and then continues to move to the right
all on its own (as if you were holding down the right arrow key).
Syntax highlighting, however, seems to work just fine on 2.0 beta 1.
Is it possible to enable wrapping single long line to multiple lines instead of scrolling?
In Firefox 3.6.13 on Mac, the cursor appears to be misaligned. This happens in the examples at http://codemirror.net/2.
Small preview: http://img267.imageshack.us/img267/4179/screenshot20110215at259.png
The problem does not seem to exist in Windows on IE, Firefox, or Chrome. The problem also does not seem to exist on any other Mac browsers.
In, for example, the JavaScript mode, the line after this won't indent properly:
foo({
It shouldn't just count characters when determining the alignment of the brace, but also take tab width into account.
The line's meaning might have changed because of changes above it (think adding a quote, causing the next line to be string).
Nothing too elaborate, but a page that runs through the API sanity-checking each method would be a good way to catch regressions
While this isn't exactly an issue, I figured this might be the best place to bring your attention to support for iOS devices (and possibly Android, Windows 7, etc.). Obviously this wasn't possible with CodeMirror 1 and its use of an IFRAME and contentEditable, but with very little modification to codemirror.js I was able to get a functional version on my iPad and iPhone. That said, I think the future of CodeMirror on mobile devices is very promising, but there are a couple issues I immediately noticed that may prove to be very simple to solve.
First, for devices with soft keyboards the hidden textarea needs to gain focus in order for the keyboard to appear on-screen. I was able to work around this by making the text area visible and giving it focus. After it's initial focus, the keyboard responded rather naturally (but not perfectly) to focusing and blurring on CodeMirror itself. Further testing is needed, but I think it would be possible to make the textarea "visible" and position it absolutely off the screen to accommodate this.
The other problem I noticed is that, when the textarea receives input and is out of the viewport, mobile Safari centers the display on the textarea. This seems like it would be easy to fix by setting the vertical position of the hidden textarea to the same line the "cursor" is on.
Let me know what you think, Marijn. And congrats and great work on CodeMirror 2!
If you make the active line long enough to trigger overflow, then only the initial portion of the line will be highlighted. See this: http://img801.imageshack.us/f/codemirror.png/
(And find a better term for them.)
Hi,
I was just wondering if there's going to be support for highlighting the currently selected line in some fashion, at some point. Do you have any plans regarding this?
Keep up the awesome work!
Chiel.
Because the visible CodeMirror selection is not the real document selection. It might be possible to work around this by either
One possible reason is that charFromX does a full binary search of the whole line (should use heuristic to be faster). But that only comes into play on clicks, normal cursor movement should be fast.
This is probably a feature request, or is it possible to do it with current version?
What I want to achieve is to use one editor for different code without reloading, like for javascript and php. If editor is in php mode then user is free not to use <?php in front of code, e.t.c
Firefox is OK, but WebKit re-spaces spans by its own rules which throws off cursor placement whenever lines contain variable-width text. The result is that CodeMirror 2 currently can't support variable-width fonts, which is a problem CodeMirror 1 didn't have.
I've started experimenting with this, and it looks like as long as charX and charFromX are rewritten to account for this the problem should go away. If possible though I think it might be better to position the cursor relative to individual spans rather than from the beginning of the line, which eliminates the kerning issue altogether.
(a selected-style phantom space should be visible in this case, but isn't)
Hello, is it possible to make CodeMirror2 to be fullsize (full page size)? I added:
width: 100%; height: 100%; to the CodeMirror
style and this works only under Chromium. Any another browser doesn't want to make editor with that size.
Any ideas?
node is null
[Break On This Error] return node.textContent || node.innerText || node.nodeValue || "";
I am getting randomly this error.
Narrowed down to following (a bit awkward description, sorry):
It appears using setValue(xxxx), where xxx is some code,
To repeat:
mode -> htmlmixed
Select more than one lines and press TAB button.
Then try return indent using Ctrl+Z...
It'd be nice if a CodeMirror object had an API method / property containing the current mode. Or does it and I'm missing it?
Hi Marijn,
When using CodeMirror2 in Chrome/Safari, it responds very, very slowly to text input, and the cursor remains at the left of the textarea at all times, even after the text appears. Couldn't find an issue about this specifically.
Best,
Chiel
Safari, Chrome, and Firefox set the metaKey event object property for the cmd key, and ctrlKey for control. Opera seems to do this the other way around.
But the real problem is that Opera Mac does not seem to generate any key event at all for cmd-a, cmd-z, and probably a bunch of other keys. This means we can not intercept these to do the right thing. I'll have to see how/whether other projects (Ymacs, ACE) handle this.
Opera Linux (and probably Win) doesn't seem to have this problem.
Version two seems to easily outperform version 1 on all platforms except IE6.
I don't really care about IE6 all that much, but if someone wants to do some profiling (how do you even do that on IE6?) and suggest improvements, I'm open to that.
When selecting text backwards with the keyboard (using the left arrow key or up arrow key) it only selects for the first key event (one char to the left or one line upwards). Further key presses do nothing.
Happens on the example at http://codemirror.net/2/ with Chromium 12.0.710.0 (78857) Ubuntu 10.10
A declarative, efficient, and flexible JavaScript library for building user interfaces.
๐ Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. ๐๐๐
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google โค๏ธ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.