mirror of
https://github.com/wickedest/Mergely.git
synced 2026-03-20 09:38:39 +08:00
Mergely 3.0 that works with CodeMirror 3.0 beta.
This commit is contained in:
Jamie Peabody
@@ -12,11 +12,13 @@
|
||||
|
||||
<style type="text/css">
|
||||
body { font-family: Droid Sans, Arial, sans-serif; }
|
||||
pre.code { border: 1px solid #37AFFF; background-color: #efefef; padding: 12px; }
|
||||
pre.code { border: 1px solid #37AFFF; background-color: #fafafa; padding: 12px; }
|
||||
dt { color: #3FA6EA; font-weight: bold; }
|
||||
dd { margin-bottom: 1em; }
|
||||
h1 { margin-top: 0px; }
|
||||
h1 { margin-top: 0px; font-size: 2.4em; display: inline-block;}
|
||||
#logo { display: inline-block; width: 110px; height: 110px; background: transparent url(http://www.mergely.com/images/mergely_lg.png) no-repeat 0 center; }
|
||||
.code { border-radius: 8px; }
|
||||
span.code { font-family: "courier new", courier, fixed }
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
@@ -25,19 +27,17 @@
|
||||
|
||||
<div id="body">
|
||||
<div id="bodycontent" style="margin-right:0px;">
|
||||
<a id="logo" title="Back to Mergely" href="http://www.mergely.com"><div id="logo"></div></a>
|
||||
<h1>Mergely Reference Manual</h1>
|
||||
|
||||
<h2>Overview</h2>
|
||||
<p>
|
||||
The core of mergely is a javascript-based diff and customizable markup engine.
|
||||
Mergely provides a rich API that enables integration into your own application. It
|
||||
can be used as a diff tool (read-only) or as both a diff and merge
|
||||
The core of mergely is a javascript-based Longest Common Subsequence diff algorithm (LCS)
|
||||
and customizable markup engine. Mergely provides a rich API that enables integration into
|
||||
your own application. It can be used as a diff tool (read-only) or as both a diff and merge
|
||||
tool for plain text, CSS, HTML, XML, javascript, PHP, C, C++, etc.
|
||||
</p>
|
||||
<p>
|
||||
|
||||
</p>
|
||||
|
||||
|
||||
<h2>Basic Usage</h2>
|
||||
<p>
|
||||
Mergely requires <a href="http://jquery.com">jQuery</a> and <a href="http://codemirror.net">CodeMirror</a>.
|
||||
@@ -87,6 +87,8 @@ $(document).ready(function () {
|
||||
<dl>
|
||||
<dt>autoresize</dt>
|
||||
<dd>Enables/disables the auto-resizing of the editor. Defaults to <span class="code">true</span>.</dd>
|
||||
<dt>autoupdate</dt>
|
||||
<dd>Enables/disables the auto-updating of the editor when changes are made. Defaults to <span class="code">true</span></dd>
|
||||
<dt>cmsettings</dt>
|
||||
<dd>CodeMirror settings (see <a href="http://codemirror.net/doc/manual.html#option_value">CodeMirror</a>). Defaults to <span class="code">{mode: 'application/xml', readOnly: false, lineWrapping: false, lineNumbers: true}</span>.</dd>
|
||||
<dt>editor_width</dt>
|
||||
@@ -98,7 +100,11 @@ $(document).ready(function () {
|
||||
<dt>change_timeout</dt>
|
||||
<dd>The timeout, after a text change, before Mergely calcualtes a diff. Only used when readonly enabled. Defaults to <span class="code">500</span>.</dd>
|
||||
<dt>fgcolor</dt>
|
||||
<dd>The foreground color that mergely marks changes with on the canvas. Defaults to <span class="code">'#4ba3fa'</span></dd>
|
||||
<dd>
|
||||
The foreground color that mergely marks changes with on the canvas. Defaults to <span class="code">{a:'#4ba3fa',c:'#cccccc',d:'#ff7f7f'}</span>.
|
||||
The '<span class="code">a</span>' option is the color for additions, the '<span class="code">c</span>' option is the color for
|
||||
changes, and the '<span class="code">d</span>' option is the color for deletions.
|
||||
</dd>
|
||||
<dt>bgcolor</dt>
|
||||
<dd>The background color that mergely fills the margin canvas with. Defaults to <span class="code">'#eeeeee'<span></dd>
|
||||
<dt>fadein</dt>
|
||||
@@ -156,34 +162,45 @@ $(document).ready(function () {
|
||||
<dd>The editors.</dd>
|
||||
<dt>.mergely-active</dt>
|
||||
<dd>The active editor.</dd>
|
||||
<dt>mergely-c-start</dt>
|
||||
<dd>Styles the starting line of a change.</dd>
|
||||
<dt>mergely-c-end</dt>
|
||||
<dd>Styles the ending line of a change.</dd>
|
||||
<dt>mergely-a-start</dt>
|
||||
<dd>Styles the starting line of an addition.</dd>
|
||||
<dt>mergely-a-mid</dt>
|
||||
<dd>Styles the middle text region of an addition.</dd>
|
||||
<dt>mergely-a-end</dt>
|
||||
<dd>Styles the ending line of an addition.</dd>
|
||||
<dt>mergely-d-start</dt>
|
||||
<dd>Styles the starting line of a deletion.</dd>
|
||||
<dt>mergely-d-mid</dt>
|
||||
<dd>Styles the middle text region of a deletion.</dd>
|
||||
<dt>mergely-d-end</dt>
|
||||
<dd>Styles the ending line of a deletion.</dd>
|
||||
<dt>mergely-c-rem</dt>
|
||||
<dd>Styles the middle text region of a deletion.</dd>
|
||||
<dt>mergely-c-add</dt>
|
||||
<dd>Styles the middle text region of an addition.</dd>
|
||||
<dt>mergely-a-start-lhs</dt>
|
||||
<dd>Styles the start of an addition on the left-hand side.</dd>
|
||||
<dt>mergely-a-end-lhs</dt>
|
||||
<dd>Styles the end of an addition on the left-hand side.</dd>
|
||||
<dt>mergely-d-start-rhs</dt>
|
||||
<dd>Styles the start of an deletion on the right-hand side.</dd>
|
||||
<dt>mergely-d-end-rhs</dt>
|
||||
<dd>Styles the start of an deletion on the right-hand side.</dd>
|
||||
<dt>.mergely-canvas</dt>
|
||||
<dd>The mergely canvas elements</dd>
|
||||
|
||||
<dt>mergely.a.rhs</dt>
|
||||
<dd>Styles an addition to the right-hand side, regardless of starting or ending lines</dd>
|
||||
<dt>mergely.a.rhs.start</dt>
|
||||
<dd>Styles the starting line of an addition to the right-hand side</dd>
|
||||
<dt>mergely.a.rhs.end</dt>
|
||||
<dd>Styles the ending line of an addition to the right-hand side</dd>
|
||||
<dt>mergely.a.rhs.start.end</dt>
|
||||
<dd>Styles the start and ending line of an addition to the right-hand side when the start and end are the same line</dd>
|
||||
|
||||
<dt>mergely.d.lhs</dt>
|
||||
<dd>Styles a deletion from the left-hand side, regardless of starting or ending lines</dd>
|
||||
<dt>mergely.d.lhs.start</dt>
|
||||
<dd>Styles the starting line of a deletion from the left-hand side</dd>
|
||||
<dt>mergely.d.lhs.end</dt>
|
||||
<dd>Styles the ending line of a deletion from the left-hand side</dd>
|
||||
<dt>mergely.d.lhs.start.end</dt>
|
||||
<dd>Styles the start and ending line of a deletion from the left-hand side when the start and end are the same line</dd>
|
||||
|
||||
<dt>mergely.c.lhs</dt>
|
||||
<dd>Styles a change to the left-hand side, regardless of starting or ending lines</dd>
|
||||
<dt>mergely.c.lhs.start</dt>
|
||||
<dd>Styles the starting line of a change to the left-hand side</dd>
|
||||
<dt>mergely.c.lhs.end</dt>
|
||||
<dd>Styles the starting line of a change to the left-hand side</dd>
|
||||
|
||||
<dt>mergely.c.rhs</dt>
|
||||
<dd>Styles a change to the right-hand side, regardless of starting or ending lines</dd>
|
||||
<dt>mergely.c.rhs.start</dt>
|
||||
<dd>Styles the starting line of a change to the right-hand side</dd>
|
||||
<dt>mergely.c.rhs.end</dt>
|
||||
<dd>Styles the starting line of a change to the right-hand side</dd>
|
||||
|
||||
<dt>mergely.ch.a.rhs</dt>
|
||||
<dd>Styles the text of a change to the right-hand side</dd>
|
||||
<dt>mergely.ch.a.lhs</dt>
|
||||
<dd>Styles the text of a change to the right-hand side</dd>
|
||||
</dl>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user