EditScreen: Show the base version of the file in a CodeMirror merge view

This adds a merge view to the inline editing screen so that users can
diff against the patch set the change edit is based on while editing.

This new functionality makes use of CodeMirror's merge view addon, which
requires Google's diff-match-patch library to be loaded. The library
implements an algorithm based on the Myers diff in JavaScript on the
client side, so there is no extra usage of Gerrit's DiffApi.

The minified diff-match-patch library is bundled with CodeMirror's merge
view addon during the build process.

By default, the merge view is disabled. This can be changed via
EditPreferencesBox. Also added a checkbox to the EditScreen header to
toggle the view.

The loading of the content of the base version is lazy - it is only
loaded when the merge view is actually used.

The documentation and tutorial on this new feature will be added in
later changes.

Screenshot: https://i.imgur.com/uNMNzjM.png

Change-Id: I5eb4af9b67bbfcb0b149965b3c818c1f6118e6de
This commit is contained in:
Michael Zhou
2016-04-26 03:35:07 -04:00
parent 551ad0c20d
commit ecaf9b075c
12 changed files with 479 additions and 70 deletions

View File

@@ -0,0 +1,51 @@
// Copyright (C) 2016 The Android Open Source Project
//
// Licensed under the Apache License, Version 2.0 (the "License");
// you may not use this file except in compliance with the License.
// You may obtain a copy of the License at
//
// http://www.apache.org/licenses/LICENSE-2.0
//
// Unless required by applicable law or agreed to in writing, software
// distributed under the License is distributed on an "AS IS" BASIS,
// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
// See the License for the specific language governing permissions and
// limitations under the License.
package net.codemirror.lib;
import com.google.gwt.core.client.JavaScriptObject;
import com.google.gwt.dom.client.Element;
/** Object that represents a text marker within CodeMirror */
public class MergeView extends JavaScriptObject {
public static MergeView create(Element p, Configuration cfg) {
MergeView mv = newMergeView(p, cfg);
Extras.attach(mv.leftOriginal());
Extras.attach(mv.editor());
return mv;
}
private static native MergeView newMergeView(Element p, Configuration cfg) /*-{
return $wnd.CodeMirror.MergeView(p, cfg);
}-*/;
public final native CodeMirror leftOriginal() /*-{
return this.leftOriginal();
}-*/;
public final native CodeMirror editor() /*-{
return this.editor();
}-*/;
public final native void setShowDifferences(boolean b) /*-{
this.setShowDifferences(b);
}-*/;
public final native Element getGapElement() /*-{
return $doc.getElementsByClassName("CodeMirror-merge-gap")[0];
}-*/;
protected MergeView() {
}
}