codemirror

Is it possible to highlight a search pattern when codemirror loads

故事扮演 提交于 2019-12-06 13:37:15
Is there a way for codemirror to highlight the code matching a pattern (like if I use the search addon) when the page load? So I could load the page with ?search=my_pattern and pass the pattern to codemirror. Here's a sample code and a jsfiddle. You can use CTRL+F to use the search addon. <html> <head> <meta http-equiv="Content-Type" content="text/html;charset=UTF-8"/> <link rel="stylesheet" href="http://cdnjs.cloudflare.com/ajax/libs/codemirror/2.36.0/codemirror.css" /> <script src="http://cdnjs.cloudflare.com/ajax/libs/codemirror/2.36.0/codemirror.min.js"></script> <script src="http://cdnjs

Integrating CodeMirror with Angular2 (typescript)

醉酒当歌 提交于 2019-12-06 07:29:07
I'm currently working on adding a CodeMirror editor to a project, an Angular2 project more precisely. But Im' having trouble doing it. The instantiation of my editor doesn't seem to work correctly. My code is the following: editor.component.ts import {Component} from 'angular2/core' import {BrowserDomAdapter} from 'angular2/platform/browser' declare var CodeMirror: any; @Component({ selector: 'editor', templateUrl: './meang2app/partials/editor.html' }) export class Editor{ dom: BrowserDomAdapter; editor: any; constructor(){ this.dom = new BrowserDomAdapter(); this.editor = new CodeMirror

CodeMirror simple mode - regex not highlighting as expected

只愿长相守 提交于 2019-12-06 04:46:58
问题 I'm trying to use CodeMirror simple mode to create my own editor and highlight some custom keywords. However, it's highlighting occurrences of these words inside other words. Here's my code to define the mode of the editor: CodeMirror.defineSimpleMode("simple", { // The start state contains the rules that are intially used start: [ // The regex matches the token, the token property contains the type {regex: /["'](?:[^\\]|\\.)*?(?:["']|$)/, token: "string"}, {regex: /;.*/, token: "comment"},

How do I format HTML code in Code Mirror when the value is set to it?

笑着哭i 提交于 2019-12-06 04:22:47
问题 I am using the Code Mirror plugin to edit HTML source of a page. The HTML code is fetched from database and set as value in Code Mirror. But, after setting the value it is displayed in the same format in which it was saved in the database. How can I display it in proper format? Thanks in advance. 回答1: There is a function called autoFormatRange editor.autoFormatRange(range.from, range.to); This fragment from the CodeMirror Group might be what you need: function autoFormat() { var totalLines =

ui-codemirror placed within custom directives fails without an error

余生长醉 提交于 2019-12-06 02:44:01
问题 I am trying to use ui-codemirror angular directive from code mirror angular library and the use case is that I have to place it within a custom directive . But when I place it within a custom directive I am unable to see the code mirror in the text area. infact the text area becomes non editable . But when I place it outside the custom directive it works as expected . I am attaching the fiddle code for this http://plnkr.co/edit/NVFuumrGq2FJ8d8EC8Xn?p=preview . I have no option to even debug

Creating new modes for CodeMirror

那年仲夏 提交于 2019-12-05 18:24:02
问题 I want to highlight only keywords that look like this: {KEYWORD} (basically UPPERCASE words wrapped between single {} parentheses) I tried this by copying the code from the Mustache Overlay demo, and by replacing the double brackets with single ones: CodeMirror.defineMode('mymode', function(config, parserConfig) { var mymodeOverlay = { token: function(stream, state) { if (stream.match("{")) { while ((ch = stream.next()) != null) if (ch == "}" && stream.next() == "}") break; return 'mymode'; }

Changing mode for (ng2-)codemirror in Angular 2

痴心易碎 提交于 2019-12-05 15:56:46
I managed to make ng2-codemirror editor work perfectly in my Angular 2 app, but there's one small detail that bugs me - I can't change its mode because it requires importing .js file which I am not able to accomplish. I need to import script from path node_modules\codemirror\mode\clike\clike.js , but it seems I don't know how to do it. I tried to import it in index.html : <script src="node_modules/codemirror/mode/clike/clike.js"></script> But I get the following error: Uncaught ReferenceError: CodeMirror is not defined I'll simplify my code so it's easy to understand the problem: system.config

codemirror how to install

与世无争的帅哥 提交于 2019-12-05 06:42:36
问题 I am not sure what to do after this: <link rel="stylesheet" href="lib/codemirror.css"> <script src="lib/codemirror.js"></script> <script> var editor = CodeMirror.fromTextArea(myTextarea, { mode: "text/html" }); </script> can someone help me? 回答1: does this points you to the right direction? <link rel="stylesheet" href="lib/codemirror.css"> <script src="lib/codemirror.js"></script> <script src="mode/javascript/javascript.js"></script> <script src="addon/fold/foldcode.js"></script> </head>

Codemirror content not visible in bootstrap modal until it is clicked

╄→尐↘猪︶ㄣ 提交于 2019-12-05 01:00:58
I am using codemirror 3 with bootstrap. In my bootstrap modal, there is a textarea, and i am replacing it with codemirror. I am using task_name_editor.setValue('initial value') to initialise codemirror with an input. The problem is that the content is there, but it is not visible until it is clicked or any key is pressed while it is focused. I tried Marijn's answer to a similar question, but i don't know where to place task_name_editor.refresh() I tried placing it where i show the modal - $('#edit_task_modal').modal('show'); task_name_editor.setValue('initial value'); task_name_editor.refresh(

The height of the code-mirror block are not the same in Chrome and Safari

倖福魔咒の 提交于 2019-12-04 23:18:31
I want to make a layout that satisfies the following conditions: 1) it has a block on the top whose height is up to its content 2) below it has a code-mirror and a block side by side, which fill in exactly the rest of the page in terms of height . I have made a plunker here. The problem is it works well in Chrome 57.0.2987.133 , whereas it does NOT work well in Safari 10.1 : the height of the code-mirror is NOT enough; it shows only 76 lines of the code rather than the correct 80 lines. Does anyone know how to fix this? <style> .rb { display: flex; flex-direction: column; height: 100%; } .rb