From 0e67024be5993049ea6acd9add96b76be6017a4d Mon Sep 17 00:00:00 2001 From: Ananya Sen Date: Mon, 30 Apr 2012 13:22:23 -0700 Subject: IKNINJA-1562 : override font-size for some themes to allow xooming Signed-off-by: Ananya Sen --- .../codemirror-ninja/lib/ninja-simple-hint.js | 78 ++++++++++++++++++++++ .../codemirror-ninja/theme/lesser-dark-ninja.css | 45 +++++++++++++ .../codemirror-ninja/theme/rubyblue-ninja.css | 22 ++++++ 3 files changed, 145 insertions(+) create mode 100644 js/code-editor/codemirror-ninja/lib/ninja-simple-hint.js create mode 100644 js/code-editor/codemirror-ninja/theme/lesser-dark-ninja.css create mode 100644 js/code-editor/codemirror-ninja/theme/rubyblue-ninja.css (limited to 'js/code-editor/codemirror-ninja') diff --git a/js/code-editor/codemirror-ninja/lib/ninja-simple-hint.js b/js/code-editor/codemirror-ninja/lib/ninja-simple-hint.js new file mode 100644 index 00000000..866e1a8b --- /dev/null +++ b/js/code-editor/codemirror-ninja/lib/ninja-simple-hint.js @@ -0,0 +1,78 @@ +(function() { + CodeMirror.simpleHint = function(editor, getHints) { + // We want a single cursor position. + if (editor.somethingSelected()) return; + + // Ninja override: don't show code hinting if the token is empty + var tempToken = editor.getTokenAt(editor.getCursor()); + if(tempToken && ((tempToken.string === "") || !(/[\S]/gi.test(tempToken.string)))) return;//check that token has only spaces + + + var result = getHints(editor); + if (!result || !result.list.length) return; + var completions = result.list; + function insert(str) { + editor.replaceRange(str, result.from, result.to); + } + // Ninja override: don't autocomplete to reduce user's typing errors +// if (completions.length == 1) {insert(completions[0]); return true;} + + // Build the select widget + var complete = document.createElement("div"); + complete.className = "CodeMirror-completions"; + var sel = complete.appendChild(document.createElement("select")); + // Opera doesn't move the selection when pressing up/down in a + // multi-select, but it does properly support the size property on + // single-selects, so no multi-select is necessary. + if (!window.opera) sel.multiple = true; + for (var i = 0; i < completions.length; ++i) { + var opt = sel.appendChild(document.createElement("option")); + opt.appendChild(document.createTextNode(completions[i])); + } + sel.firstChild.selected = true; + sel.size = Math.min(10, completions.length); + var pos = editor.cursorCoords(); + complete.style.left = pos.x + "px"; + complete.style.top = pos.yBot + "px"; + document.body.appendChild(complete); + // If we're at the edge of the screen, then we want the menu to appear on the left of the cursor. + var winW = window.innerWidth || Math.max(document.body.offsetWidth, document.documentElement.offsetWidth); + if(winW - pos.x < sel.clientWidth) + complete.style.left = (pos.x - sel.clientWidth) + "px"; + // Hack to hide the scrollbar. + if (completions.length <= 10) + complete.style.width = (sel.clientWidth - 1) + "px"; + + var done = false; + function close() { + if (done) return; + done = true; + complete.parentNode.removeChild(complete); + } + function pick() { + insert(completions[sel.selectedIndex]); + close(); + setTimeout(function(){editor.focus();}, 50); + } + CodeMirror.connect(sel, "blur", close); + CodeMirror.connect(sel, "keydown", function(event) { + var code = event.keyCode; + // Enter + if (code == 13) {CodeMirror.e_stop(event); pick();} + // Escape + else if (code == 27) {CodeMirror.e_stop(event); close(); editor.focus();} + else if (code != 38 && code != 40) { + close(); editor.focus(); + // Pass the event to the CodeMirror instance so that it can handle things like backspace properly. + editor.triggerOnKeyDown(event); + setTimeout(function(){CodeMirror.simpleHint(editor, getHints);}, 50); + } + }); + CodeMirror.connect(sel, "dblclick", pick); + + sel.focus(); + // Opera sometimes ignores focusing a freshly created node + if (window.opera) setTimeout(function(){if (!done) sel.focus();}, 100); + return true; + }; +})(); diff --git a/js/code-editor/codemirror-ninja/theme/lesser-dark-ninja.css b/js/code-editor/codemirror-ninja/theme/lesser-dark-ninja.css new file mode 100644 index 00000000..fa7e8e07 --- /dev/null +++ b/js/code-editor/codemirror-ninja/theme/lesser-dark-ninja.css @@ -0,0 +1,45 @@ +/* +http://lesscss.org/ dark theme +Ported to CodeMirror by Peter Kroon +*/ +.CodeMirror{ + line-height: 15px; +} +.cm-s-lesser-dark { + font-family: 'Bitstream Vera Sans Mono', 'DejaVu Sans Mono', 'Monaco', Courier, monospace !important; + /*font-size:12px;*/ +} + +.cm-s-lesser-dark { background: #262626; color: #EBEFE7; text-shadow: 0 -1px 1px #262626; } +.cm-s-lesser-dark div.CodeMirror-selected {background: #45443B !important;} /* 33322B*/ +.cm-s-lesser-dark .CodeMirror-cursor { border-left: 1px solid white !important; } +.cm-s-lesser-dark .CodeMirror-lines { margin-left:3px; margin-right:3px; }/*editable code holder*/ + +div.CodeMirror span.CodeMirror-matchingbracket { color: #7EFC7E; }/*65FC65*/ + +.cm-s-lesser-dark .CodeMirror-gutter { background: #262626; border-right:1px solid #aaa; padding-right:3px; min-width:2.5em; } +.cm-s-lesser-dark .CodeMirror-gutter-text { color: #777; } + +.cm-s-lesser-dark span.cm-keyword { color: #599eff; } +.cm-s-lesser-dark span.cm-atom { color: #C2B470; } +.cm-s-lesser-dark span.cm-number { color: #B35E4D; } +.cm-s-lesser-dark span.cm-def {color: color: white;} +.cm-s-lesser-dark span.cm-variable { color:#D9BF8C; } +.cm-s-lesser-dark span.cm-variable-2 { color: #669199; } +.cm-s-lesser-dark span.cm-variable-3 { color: white; } +.cm-s-lesser-dark span.cm-property {color: #92A75C;} +.cm-s-lesser-dark span.cm-operator {color: #92A75C;} +.cm-s-lesser-dark span.cm-comment { color: #666; } +.cm-s-lesser-dark span.cm-string { color: #BCD279; } +.cm-s-lesser-dark span.cm-string-2 {color: #f50;} +.cm-s-lesser-dark span.cm-meta { color: #738C73; } +.cm-s-lesser-dark span.cm-error { color: #9d1e15; } +.cm-s-lesser-dark span.cm-qualifier {color: #555;} +.cm-s-lesser-dark span.cm-builtin { color: #ff9e59; } +.cm-s-lesser-dark span.cm-bracket { color: #EBEFE7; } +.cm-s-lesser-dark span.cm-tag { color: #669199; } +.cm-s-lesser-dark span.cm-attribute {color: #00c;} +.cm-s-lesser-dark span.cm-header {color: #a0a;} +.cm-s-lesser-dark span.cm-quote {color: #090;} +.cm-s-lesser-dark span.cm-hr {color: #999;} +.cm-s-lesser-dark span.cm-link {color: #00c;} diff --git a/js/code-editor/codemirror-ninja/theme/rubyblue-ninja.css b/js/code-editor/codemirror-ninja/theme/rubyblue-ninja.css new file mode 100644 index 00000000..b09e4e3e --- /dev/null +++ b/js/code-editor/codemirror-ninja/theme/rubyblue-ninja.css @@ -0,0 +1,22 @@ +.cm-s-rubyblue { + font:Trebuchet, Verdana, sans-serif; } /* - customized editor font - */ + +.cm-s-rubyblue { background: #112435; color: white; } +.cm-s-rubyblue div.CodeMirror-selected { background: #38566F !important; } +.cm-s-rubyblue .CodeMirror-gutter { background: #1F4661; border-right: 7px solid #3E7087; min-width:2.5em; } +.cm-s-rubyblue .CodeMirror-gutter-text { color: white; } +.cm-s-rubyblue .CodeMirror-cursor { border-left: 1px solid white !important; } + +.cm-s-rubyblue span.cm-comment { color: #999; font-style:italic; line-height: 1em; } +.cm-s-rubyblue span.cm-atom { color: #F4C20B; } +.cm-s-rubyblue span.cm-number, .cm-s-rubyblue span.cm-attribute { color: #82C6E0; } +.cm-s-rubyblue span.cm-keyword { color: #F0F; } +.cm-s-rubyblue span.cm-string { color: #F08047; } +.cm-s-rubyblue span.cm-meta { color: #F0F; } +.cm-s-rubyblue span.cm-variable-2, .cm-s-rubyblue span.cm-tag { color: #7BD827; } +.cm-s-rubyblue span.cm-variable-3, .cm-s-rubyblue span.cm-def { color: white; } +.cm-s-rubyblue span.cm-error { color: #AF2018; } +.cm-s-rubyblue span.cm-bracket { color: #F0F; } +.cm-s-rubyblue span.cm-link { color: #F4C20B; } +.cm-s-rubyblue span.CodeMirror-matchingbracket { color:#F0F !important; } +.cm-s-rubyblue span.cm-builtin, .cm-s-rubyblue span.cm-special { color: #FF9D00; } -- cgit v1.2.3