Merge pull request #187 from zanata/codemirror3

Update codeMirror to 3.16
zanata · Sep 19, 2013 · f1c04cb · f1c04cb
2 parents 20e3838 + 4fa85fe
commit f1c04cb
Show file tree

Hide file tree

Showing 7 changed files with 440 additions and 173 deletions.
diff --git a/zanata-war/src/main/java/org/zanata/webtrans/client/ui/CodeMirrorEditor.java b/zanata-war/src/main/java/org/zanata/webtrans/client/ui/CodeMirrorEditor.java
@@ -1,5 +1,6 @@
 package org.zanata.webtrans.client.ui;
 
+import com.allen_sauer.gwt.log.client.*;
 import com.google.common.base.Strings;
 import com.google.gwt.core.client.GWT;
 import com.google.gwt.core.client.JavaScriptObject;
@@ -42,27 +43,27 @@ public CodeMirrorEditor(Command onFocusCallback)
    }
 
    // see http://codemirror.net/doc/manual.html#usage
-   private native JavaScriptObject initCodeMirror(Element element) /*-{
+   private native JavaScriptObject initCodeMirror(TextAreaElement element) /*-{
       var self = this;
 
       var codeMirrorEditor = $wnd.CodeMirror.fromTextArea(element, {
          lineNumbers: true,
          lineWrapping: true,
          disableSpellcheck: false,
          mode: "visibleSpace",
-         value: element.value,
-         onFocus: function() {
-            self.@org.zanata.webtrans.client.ui.CodeMirrorEditor::onFocus()();
-         },
-         onBlur: function() {
-            self.@org.zanata.webtrans.client.ui.CodeMirrorEditor::onBlur()();
-         },
-         onChange: function() {
-            self.@org.zanata.webtrans.client.ui.CodeMirrorEditor::onChange()();
-         }
+         value: element.value
+      });
+      codeMirrorEditor.on("focus", function() {
+           self.@org.zanata.webtrans.client.ui.CodeMirrorEditor::onFocus()();
+      });
 
+      codeMirrorEditor.on("blur", function() {
+           self.@org.zanata.webtrans.client.ui.CodeMirrorEditor::onBlur()();
       });
 
+      codeMirrorEditor.on("change", function() {
+           self.@org.zanata.webtrans.client.ui.CodeMirrorEditor::onChange()();
+      });
       return codeMirrorEditor;
 
    }-*/;
@@ -73,7 +74,7 @@ public void setText(String text)
       if (codeMirror == null)
       {
          textArea.setValue(text);
-         codeMirror = initCodeMirror(getElement());
+         codeMirror = initCodeMirror(textArea);
       }
       setCodeMirrorContent(text);
    }
@@ -90,7 +91,7 @@ protected void onLoad()
       super.onLoad();
       if (codeMirror == null)
       {
-         codeMirror = initCodeMirror(getElement());
+         codeMirror = initCodeMirror(textArea);
       }
    }
 

diff --git a/zanata-war/src/main/java/org/zanata/webtrans/client/view/TargetContentsView.ui.xml b/zanata-war/src/main/java/org/zanata/webtrans/client/view/TargetContentsView.ui.xml
@@ -26,10 +26,10 @@
         .saving {
             position: absolute;
             top: 8px;
-            left: 30px;
+            left: 32px;
             font-size: smaller;
             color: #ffffff;
-            z-index: 1;
+            z-index: 5;
             background-color: #416988;
         }
 

diff --git a/zanata-war/src/main/resources/org/zanata/webtrans/public/Dummy.html b/zanata-war/src/main/resources/org/zanata/webtrans/public/Dummy.html
@@ -10,8 +10,8 @@
     <link rel="stylesheet" href="images/fontello/css/fontello.css" />
     <link rel="stylesheet" href="../stylesheet/menu.css" />
 
-    <script src="codemirror-compressed.js" type="text/javascript"></script>
-    <link rel="stylesheet" type="text/css" href="codemirror.css"/>
+    <script src="codemirror-compressed-old.js" type="text/javascript"></script>
+    <link rel="stylesheet" type="text/css" href="codemirror-old.css"/>
 
     <script src="diff_match_patch/javascript/diff_match_patch.js" type="text/javascript"></script>
 

diff --git a/zanata-war/src/main/resources/org/zanata/webtrans/public/codemirror-compressed-old.js b/zanata-war/src/main/resources/org/zanata/webtrans/public/codemirror-compressed-old.js
diff --git a/zanata-war/src/main/resources/org/zanata/webtrans/public/codemirror-compressed.js b/zanata-war/src/main/resources/org/zanata/webtrans/public/codemirror-compressed.js
diff --git a/zanata-war/src/main/resources/org/zanata/webtrans/public/codemirror-old.css b/zanata-war/src/main/resources/org/zanata/webtrans/public/codemirror-old.css
@@ -0,0 +1,214 @@
+.CodeMirror {
+  line-height: 1em;
+  font-family: monospace;
+
+  /* Necessary so the scrollbar can be absolutely positioned within the wrapper on Lion. */
+  position: relative;
+  /* This prevents unwanted scrollbars from showing up on the body and wrapper in IE. */
+  overflow: hidden;
+
+    background-color: #ffffff;
+}
+
+.CodeMirror-scroll {
+  overflow-x: auto;
+  overflow-y: visible;
+  height: auto;
+    min-height: 4em;
+    line-height: normal;
+
+    /* This is needed to prevent an IE[67] bug where the scrolled content
+is visible outside of the scrolling box. */
+  position: relative;
+  outline: none;
+}
+
+/* Vertical scrollbar */
+.CodeMirror-scrollbar {
+  float: right;
+  overflow-x: hidden;
+  overflow-y: scroll;
+
+  /* This corrects for the 1px gap introduced to the left of the scrollbar
+     by the rule for .CodeMirror-scrollbar-inner. */
+  margin-left: -1px;
+}
+.CodeMirror-scrollbar-inner {
+  /* This needs to have a nonzero width in order for the scrollbar to appear
+     in Firefox and IE9. */
+  width: 1px;
+}
+.CodeMirror-scrollbar.cm-sb-overlap {
+  /* Ensure that the scrollbar appears in Lion, and that it overlaps the content
+     rather than sitting to the right of it. */
+  position: absolute;
+  z-index: 1;
+  float: none;
+  right: 0;
+  min-width: 12px;
+}
+.CodeMirror-scrollbar.cm-sb-nonoverlap {
+  min-width: 12px;
+}
+.CodeMirror-scrollbar.cm-sb-ie7 {
+  min-width: 18px;
+}
+
+.CodeMirror-gutter {
+  position: absolute; left: 0; top: 0;
+    /* below z-index is commented out because it will lay gutter/line number on top of everything including gwt pop up */
+  /*z-index: 10;*/
+  background-color: #f7f7f7;
+  border-right: 1px solid #eee;
+  min-width: 2em;
+  height: 100%;
+}
+.CodeMirror-gutter-text {
+  color: #aaa;
+  text-align: right;
+  padding: .4em .2em .4em .4em;
+  white-space: pre !important;
+  cursor: default;
+}
+.CodeMirror-lines {
+  padding: .4em;
+  white-space: pre;
+  cursor: text;
+}
+.CodeMirror-lines * {
+  /* Necessary for throw-scrolling to decelerate properly on Safari. */
+  pointer-events: none;
+}
+
+.CodeMirror pre {
+  border-radius: 0;
+  border-width: 0; margin: 0; padding: 0; background: transparent;
+  font-family: inherit;
+  font-size: inherit;
+  padding: 0; margin: 0;
+  white-space: pre;
+  word-wrap: normal;
+  line-height: 1.5em;
+  color: inherit;
+}
+
+.CodeMirror-wrap pre {
+  word-wrap: break-word;
+  white-space: pre-wrap;
+  word-break: normal;
+}
+.CodeMirror-wrap .CodeMirror-scroll {
+  overflow-x: hidden;
+}
+
+.CodeMirror textarea {
+  outline: none !important;
+}
+
+.CodeMirror pre.CodeMirror-cursor {
+  z-index: 10;
+  position: absolute;
+  visibility: hidden;
+  border-left: 1px solid black;
+  border-right: none;
+  width: 0;
+}
+.cm-keymap-fat-cursor pre.CodeMirror-cursor {
+  width: auto;
+  border: 0;
+  background: transparent;
+  background: rgba(0, 200, 0, .4);
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#6600c800, endColorstr=#4c00c800);
+}
+/* Kludge to turn off filter in ie9+, which also accepts rgba */
+.cm-keymap-fat-cursor pre.CodeMirror-cursor:not(#nonsense_id) {
+  filter: progid:DXImageTransform.Microsoft.gradient(enabled=false);
+}
+.CodeMirror pre.CodeMirror-cursor.CodeMirror-overwrite {}
+.CodeMirror-focused pre.CodeMirror-cursor {
+  visibility: visible;
+}
+
+div.CodeMirror-selected { background: #dcecf7; }
+.CodeMirror-focused div.CodeMirror-selected { background: #cce2f5; }
+
+.CodeMirror-searching {
+  background: #ffa;
+  background: rgba(255, 255, 0, .4);
+}
+
+/* Default theme */
+
+.cm-s-default span.cm-keyword {color: #708;}
+.cm-s-default span.cm-atom {color: #219;}
+.cm-s-default span.cm-number {color: #164;}
+.cm-s-default span.cm-def {color: #00f;}
+.cm-s-default span.cm-variable {color: black;}
+.cm-s-default span.cm-variable-2 {color: #05a;}
+.cm-s-default span.cm-variable-3 {color: #085;}
+.cm-s-default span.cm-property {color: black;}
+.cm-s-default span.cm-operator {color: black;}
+.cm-s-default span.cm-comment {color: #a50;}
+.cm-s-default span.cm-string {color: #a11;}
+.cm-s-default span.cm-string-2 {color: #f50;}
+.cm-s-default span.cm-meta {color: #555;}
+.cm-s-default span.cm-error {color: #e0575b;}
+.cm-s-default span.cm-qualifier {color: #555;}
+.cm-s-default span.cm-builtin {color: #30a;}
+.cm-s-default span.cm-bracket {color: #cc7;}
+.cm-s-default span.cm-tag {color: #170;}
+.cm-s-default span.cm-attribute {color: #00c;}
+.cm-s-default span.cm-header {color: blue;}
+.cm-s-default span.cm-quote {color: #090;}
+.cm-s-default span.cm-hr {color: #999;}
+.cm-s-default span.cm-link {color: #00c;}
+
+span.cm-header, span.cm-strong {font-weight: bold;}
+span.cm-em {font-style: italic;}
+span.cm-emstrong {font-style: italic; font-weight: bold;}
+span.cm-link {text-decoration: underline;}
+
+div.CodeMirror span.CodeMirror-matchingbracket {color: #0f0;}
+div.CodeMirror span.CodeMirror-nonmatchingbracket {color: #f22;}
+
+
+
+.CodeMirror {
+    border-top: 1px solid #eee; border-bottom: 1px solid #eee;
+}
+
+/* show visible tab */
+.cm-tab:after {
+    content: "\21e5";
+    display: inline-block;
+    width: 1em;
+    position: relative;
+    overflow: visible;
+    color: #aaa;
+}
+
+/* visible space */
+.cm-space
+{
+    border-bottom: #dcecf7 solid 2px;
+}
+
+/* visible line break*/
+.CodeMirror-lines pre.CodeMirror-cursor:after
+{
+    content: '';
+}
+.CodeMirror-lines pre:after
+{
+    content: '\00b6';
+    color: #aaaaaa;
+}
+.CodeMirror-lines pre:last-child:after {
+    content: '';
+}
+
+/* for highlighting label (runs code mirror runmode) */
+.newline:after {
+    content: '\00b6';
+    color: #aaaaaa;
+}