From 99f904adcc37d93c90defcd8ce898598e25be212 Mon Sep 17 00:00:00 2001 From: Hugues Hiegel Date: Wed, 11 Mar 2015 16:55:04 +0100 Subject: Lot of plugins --- .../lib/CodeMirror-2.3/demo/activeline.html | 72 ++++++++++ .../lib/CodeMirror-2.3/demo/changemode.html | 50 +++++++ .../lib/CodeMirror-2.3/demo/closetag.html | 65 +++++++++ .../lib/CodeMirror-2.3/demo/complete.html | 70 ++++++++++ codemirror_ui/lib/CodeMirror-2.3/demo/emacs.html | 59 ++++++++ codemirror_ui/lib/CodeMirror-2.3/demo/folding.html | 61 +++++++++ .../lib/CodeMirror-2.3/demo/formatting.html | 80 +++++++++++ .../lib/CodeMirror-2.3/demo/fullscreen.html | 152 +++++++++++++++++++++ .../lib/CodeMirror-2.3/demo/loadmode.html | 39 ++++++ codemirror_ui/lib/CodeMirror-2.3/demo/marker.html | 52 +++++++ .../lib/CodeMirror-2.3/demo/matchhighlighter.html | 37 +++++ .../lib/CodeMirror-2.3/demo/multiplex.html | 59 ++++++++ .../lib/CodeMirror-2.3/demo/mustache.html | 57 ++++++++ codemirror_ui/lib/CodeMirror-2.3/demo/preview.html | 76 +++++++++++ codemirror_ui/lib/CodeMirror-2.3/demo/resize.html | 41 ++++++ codemirror_ui/lib/CodeMirror-2.3/demo/runmode.html | 49 +++++++ codemirror_ui/lib/CodeMirror-2.3/demo/search.html | 83 +++++++++++ codemirror_ui/lib/CodeMirror-2.3/demo/theme.html | 78 +++++++++++ codemirror_ui/lib/CodeMirror-2.3/demo/vim.html | 50 +++++++ .../lib/CodeMirror-2.3/demo/visibletabs.html | 61 +++++++++ 20 files changed, 1291 insertions(+) create mode 100644 codemirror_ui/lib/CodeMirror-2.3/demo/activeline.html create mode 100644 codemirror_ui/lib/CodeMirror-2.3/demo/changemode.html create mode 100644 codemirror_ui/lib/CodeMirror-2.3/demo/closetag.html create mode 100644 codemirror_ui/lib/CodeMirror-2.3/demo/complete.html create mode 100644 codemirror_ui/lib/CodeMirror-2.3/demo/emacs.html create mode 100644 codemirror_ui/lib/CodeMirror-2.3/demo/folding.html create mode 100644 codemirror_ui/lib/CodeMirror-2.3/demo/formatting.html create mode 100644 codemirror_ui/lib/CodeMirror-2.3/demo/fullscreen.html create mode 100644 codemirror_ui/lib/CodeMirror-2.3/demo/loadmode.html create mode 100644 codemirror_ui/lib/CodeMirror-2.3/demo/marker.html create mode 100644 codemirror_ui/lib/CodeMirror-2.3/demo/matchhighlighter.html create mode 100644 codemirror_ui/lib/CodeMirror-2.3/demo/multiplex.html create mode 100644 codemirror_ui/lib/CodeMirror-2.3/demo/mustache.html create mode 100644 codemirror_ui/lib/CodeMirror-2.3/demo/preview.html create mode 100644 codemirror_ui/lib/CodeMirror-2.3/demo/resize.html create mode 100644 codemirror_ui/lib/CodeMirror-2.3/demo/runmode.html create mode 100644 codemirror_ui/lib/CodeMirror-2.3/demo/search.html create mode 100644 codemirror_ui/lib/CodeMirror-2.3/demo/theme.html create mode 100644 codemirror_ui/lib/CodeMirror-2.3/demo/vim.html create mode 100644 codemirror_ui/lib/CodeMirror-2.3/demo/visibletabs.html (limited to 'codemirror_ui/lib/CodeMirror-2.3/demo') diff --git a/codemirror_ui/lib/CodeMirror-2.3/demo/activeline.html b/codemirror_ui/lib/CodeMirror-2.3/demo/activeline.html new file mode 100644 index 0000000..a5b3c2c --- /dev/null +++ b/codemirror_ui/lib/CodeMirror-2.3/demo/activeline.html @@ -0,0 +1,72 @@ + + + + CodeMirror: Active Line Demo + + + + + + + + +

CodeMirror: Active Line Demo

+ +

+<?xml version="1.0" encoding="UTF-8"?>
+<rss xmlns:atom="http://www.w3.org/2005/Atom" version="2.0"
+     xmlns:georss="http://www.georss.org/georss"
+     xmlns:twitter="http://api.twitter.com">
+  <channel>
+    <title>Twitter / codemirror</title>
+    <link>http://twitter.com/codemirror</link>
+    <atom:link type="application/rss+xml"
+               href="http://twitter.com/statuses/user_timeline/242283288.rss" rel="self"/>
+    <description>Twitter updates from CodeMirror / codemirror.</description>
+    <language>en-us</language>
+    <ttl>40</ttl>
+  <item>
+    <title>codemirror: http://cloud-ide.com — they're springing up like mushrooms. This one
+      uses CodeMirror as its editor.</title>
+    <description>codemirror: http://cloud-ide.com — they're springing up like mushrooms. This
+      one uses CodeMirror as its editor.</description>
+    <pubDate>Thu, 17 Mar 2011 23:34:47 +0000</pubDate>
+    <guid>http://twitter.com/codemirror/statuses/48527733722058752</guid>
+    <link>http://twitter.com/codemirror/statuses/48527733722058752</link>
+    <twitter:source>web</twitter:source>
+    <twitter:place/>
+  </item>
+  <item>
+    <title>codemirror: Posted a description of the CodeMirror 2 internals at
+      http://codemirror.net/2/internals.html</title>
+    <description>codemirror: Posted a description of the CodeMirror 2 internals at
+      http://codemirror.net/2/internals.html</description>
+    <pubDate>Wed, 02 Mar 2011 12:15:09 +0000</pubDate>
+    <guid>http://twitter.com/codemirror/statuses/42920879788789760</guid>
+    <link>http://twitter.com/codemirror/statuses/42920879788789760</link>
+    <twitter:source>web</twitter:source>
+    <twitter:place/>
+  </item>
+  </channel>
+</rss>

+ + + +

Styling the current cursor line.

+ + + diff --git a/codemirror_ui/lib/CodeMirror-2.3/demo/changemode.html b/codemirror_ui/lib/CodeMirror-2.3/demo/changemode.html new file mode 100644 index 0000000..f5e0661 --- /dev/null +++ b/codemirror_ui/lib/CodeMirror-2.3/demo/changemode.html @@ -0,0 +1,50 @@ + + + + CodeMirror: Mode-Changing Demo + + + + + + + + + +

CodeMirror: Mode-Changing demo

+ + + +

On changes to the content of the above editor, a (crude) script +tries to auto-detect the language used, and switches the editor to +either JavaScript or Scheme mode based on that.

+ + + + diff --git a/codemirror_ui/lib/CodeMirror-2.3/demo/closetag.html b/codemirror_ui/lib/CodeMirror-2.3/demo/closetag.html new file mode 100644 index 0000000..57cd4be --- /dev/null +++ b/codemirror_ui/lib/CodeMirror-2.3/demo/closetag.html @@ -0,0 +1,65 @@ + + + + CodeMirror: Close-Tag Demo + + + + + + + + + + + + +

Close-Tag Demo

Type an html tag. When you type '>' or '/', the tag will auto-close/complete. Block-level tags will indent.
There are options for disabling tag closing or customizing the list of tags to indent.
Works with "text/html" (based on htmlmixed.js or xml.js) mode.
View source for key binding details.

CodeMirror: Autocomplete Demo

CodeMirror: Autocomplete demo

+function getCompletions(token, context) {
+  var found = [], start = token.string;
+  function maybeAdd(str) {
+    if (str.indexOf(start) == 0) found.push(str);
+  }
+  function gatherCompletions(obj) {
+    if (typeof obj == "string") forEach(stringProps, maybeAdd);
+    else if (obj instanceof Array) forEach(arrayProps, maybeAdd);
+    else if (obj instanceof Function) forEach(funcProps, maybeAdd);
+    for (var name in obj) maybeAdd(name);
+  }
+
+  if (context) {
+    // If this is a property, see if it belongs to some object we can
+    // find in the current environment.
+    var obj = context.pop(), base;
+    if (obj.className == "js-variable")
+      base = window[obj.string];
+    else if (obj.className == "js-string")
+      base = "";
+    else if (obj.className == "js-atom")
+      base = 1;
+    while (base != null && context.length)
+      base = base[context.pop().string];
+    if (base != null) gatherCompletions(base);
+  }
+  else {
+    // If not, just look in the window object and any local scope
+    // (reading into JS mode internals to get at the local variables)
+    for (var v = token.state.localVars; v; v = v.next) maybeAdd(v.name);
+    gatherCompletions(window);
+    forEach(keywords, maybeAdd);
+  }
+  return found;
+}
+

Press ctrl-space to activate autocompletion. See +the code (here +and here) to figure out +how it works.

CodeMirror: Emacs bindings demo

The emacs keybindings are enabled by +including keymap/emacs.js and setting +the keyMap option to "emacs". Because +CodeMirror's internal API is quite different from Emacs, they are only +a loose approximation of actual emacs bindings, though.

Also note that a lot of browsers disallow certain keys from being +captured. For example, Chrome blocks both Ctrl-W and Ctrl-N, with the +result that idiomatic use of Emacs keys will constantly close your tab +or open a new window.

CodeMirror: Code Folding Demo

Demonstration of code folding using the code + in foldcode.js. + Press ctrl-q or click on the gutter to fold a block, again + to unfold.

CodeMirror: Formatting Demo

CodeMirror: Formatting demo

Select a piece of code and click one of the links below to apply automatic formatting to the selected text or comment/uncomment the selected text. Note that the formatting behavior depends on the current block's mode. + + + + + + +
+ + Autoformat Selected + + + + Comment Selected + + + + Uncomment Selected + +
+

CodeMirror: Full Screen Editing

+  <dt id="option_indentWithTabs"><code>indentWithTabs (boolean)</code></dt>
+  <dd>Whether, when indenting, the first N*8 spaces should be
+  replaced by N tabs. Default is false.</dd>
+
+  <dt id="option_tabMode"><code>tabMode (string)</code></dt>
+  <dd>Determines what happens when the user presses the tab key.
+  Must be one of the following:
+    <dl>
+      <dt><code>"classic" (the default)</code></dt>
+      <dd>When nothing is selected, insert a tab. Otherwise,
+      behave like the <code>"shift"</code> mode. (When shift is
+      held, this behaves like the <code>"indent"</code> mode.)</dd>
+      <dt><code>"shift"</code></dt>
+      <dd>Indent all selected lines by
+      one <a href="#option_indentUnit"><code>indentUnit</code></a>.
+      If shift was held while pressing tab, un-indent all selected
+      lines one unit.</dd>
+      <dt><code>"indent"</code></dt>
+      <dd>Indent the line the 'correctly', based on its syntactic
+      context. Only works if the
+      mode <a href="#indent">supports</a> it.</dd>
+      <dt><code>"default"</code></dt>
+      <dd>Do not capture tab presses, let the browser apply its
+      default behaviour (which usually means it skips to the next
+      control).</dd>
+    </dl></dd>
+
+  <dt id="option_enterMode"><code>enterMode (string)</code></dt>
+  <dd>Determines whether and how new lines are indented when the
+  enter key is pressed. The following modes are supported:
+    <dl>
+      <dt><code>"indent" (the default)</code></dt>
+      <dd>Use the mode's indentation rules to give the new line
+      the correct indentation.</dd>
+      <dt><code>"keep"</code></dt>
+      <dd>Indent the line the same as the previous line.</dd>
+      <dt><code>"flat"</code></dt>
+      <dd>Do not indent the new line.</dd>
+    </dl></dd>
+
+  <dt id="option_enterMode"><code>enterMode (string)</code></dt>
+  <dd>Determines whether and how new lines are indented when the
+  enter key is pressed. The following modes are supported:
+    <dl>
+      <dt><code>"indent" (the default)</code></dt>
+      <dd>Use the mode's indentation rules to give the new line
+      the correct indentation.</dd>
+      <dt><code>"keep"</code></dt>
+      <dd>Indent the line the same as the previous line.</dd>
+      <dt><code>"flat"</code></dt>
+      <dd>Do not indent the new line.</dd>
+    </dl></dd>
+
+  <dt id="option_enterMode"><code>enterMode (string)</code></dt>
+  <dd>Determines whether and how new lines are indented when the
+  enter key is pressed. The following modes are supported:
+    <dl>
+      <dt><code>"indent" (the default)</code></dt>
+      <dd>Use the mode's indentation rules to give the new line
+      the correct indentation.</dd>
+      <dt><code>"keep"</code></dt>
+      <dd>Indent the line the same as the previous line.</dd>
+      <dt><code>"flat"</code></dt>
+      <dd>Do not indent the new line.</dd>
+    </dl></dd>
+
+  <dt id="option_enterMode"><code>enterMode (string)</code></dt>
+  <dd>Determines whether and how new lines are indented when the
+  enter key is pressed. The following modes are supported:
+    <dl>
+      <dt><code>"indent" (the default)</code></dt>
+      <dd>Use the mode's indentation rules to give the new line
+      the correct indentation.</dd>
+      <dt><code>"keep"</code></dt>
+      <dd>Indent the line the same as the previous line.</dd>
+      <dt><code>"flat"</code></dt>
+      <dd>Do not indent the new line.</dd>
+    </dl></dd>
+
+

Press F11 when cursor is in the editor to toggle full screen editing. Esc can also be used to exit full screen editing.

Note: Does not currently work correctly in IE + 6 and 7, where setting the height of something + to 100% doesn't make it full screen.

CodeMirror: Lazy Mode Loading Demo

CodeMirror: Lazy Mode Loading

CodeMirror: Breakpoint Demo

CodeMirror: Breakpoint demo

Click the line-number gutter to add or remove 'breakpoints'.

CodeMirror: Match Highlighter Demo

Highlight matches of selected text on select

CodeMirror: Multiplexing Parser Demo

Demonstration of a multiplexing mode, which, at certain + boundary strings, switches to one or more inner modes. The out + (HTML) mode does not get fed the content of the << + >> blocks. See + the manual and + the source for more + information.

CodeMirror: Overlay Parser Demo

Demonstration of a mode that parses HTML, highlighting + the Mustache templating + directives inside of it by using the code + in overlay.js. View + source to see the 15 lines of code needed to accomplish this.

CodeMirror: HTML5 preview

CodeMirror: Autoresize Demo

CodeMirror: Autoresize demo

By setting a few CSS properties, CodeMirror can be made to +automatically resize to fit its content.

CodeMirror: Mode Runner Demo

Running a CodeMirror mode outside of the editor. + The CodeMirror.runMode function, defined + in lib/runmode.js takes the following arguments:

text (string): The document to run through the highlighter.
mode (mode spec): The mode to use (must be loaded as normal).
output (function or DOM node): If this is a function, it will be called for each token with + two arguments, the token's text and the token's style class (may + be null for unstyled tokens). If it is a DOM node, + the tokens will be converted to span elements as in + an editor, and inserted into the node + (through innerHTML).

CodeMirror: Search/Replace Demo

Demonstration of primitive search/replace functionality. The + keybindings (which can be overridden by custom keymaps) are:

Ctrl-F / Cmd-F: Start searching
Ctrl-G / Cmd-G: Find next
Shift-Ctrl-G / Shift-Cmd-G: Find previous
Shift-Ctrl-F / Cmd-Option-F: Replace
Shift-Ctrl-R / Shift-Cmd-Option-F: Replace all

Searching is enabled by + including lib/util/search.js. + For good-looking input dialogs, you also want to include + lib/util/dialog.js + and lib/util/dialog.css.

CodeMirror: Theme Demo

CodeMirror: Theme demo

Select a theme: +

CodeMirror: Vim bindings demo

The vim keybindings are enabled by +including keymap/vim.js and setting +the keyMap option to "vim". Because +CodeMirror's internal API is quite different from Vim, they are only +a loose approximation of actual vim bindings, though.

CodeMirror: Visible tabs demo

Tabs inside the editor are spans with the +class cm-tab, and can be styled. This demo uses +an :after pseudo-class CSS hack that will not work on old +browsers. You can use a more conservative technique like a background +image as an alternative.