Improve docs, lock npm versions, and update deps
This commit is contained in:
Rodrigo Fernandes
parent
0da16bbb4f
commit
7821447330
5 changed files with 2900 additions and 35 deletions
63
README.md
63
README.md
|
|
@ -54,15 +54,39 @@ diff2html generates pretty HTML diffs from git or unified diff output.
|
|||
|
||||
## How to use
|
||||
|
||||
### Browser Library
|
||||
|
||||
Import the stylesheet and the library code
|
||||
|
||||
```html
|
||||
<!-- CSS -->
|
||||
<link rel="stylesheet" type="text/css" href="dist/diff2html.css">
|
||||
|
||||
<!-- Javascripts -->
|
||||
<script type="text/javascript" src="dist/diff2html.js"></script>
|
||||
```
|
||||
|
||||
It will now be available as a global variable named `Diff2Html`.
|
||||
|
||||
### Node Module
|
||||
|
||||
```js
|
||||
let dif2html = require("diff2html").Diff2Html
|
||||
```
|
||||
|
||||
## API
|
||||
|
||||
> Pretty HTML diff
|
||||
|
||||
Diff2Html.getPrettyHtml(exInput, configuration)
|
||||
getJsonFromDiff(input: string, configuration?: Options): Result
|
||||
|
||||
> Intermediate Json From Git Word Diff Output
|
||||
|
||||
Diff2Html.getJsonFromDiff(exInput)
|
||||
getPrettyHtml(input: any, configuration?: Options): string
|
||||
|
||||
> Check out the `index.html` for a complete example.
|
||||
> Check out the `docs/diff2html.d.ts` for a complete API definition in TypeScript.
|
||||
|
||||
> Check out the `docs/index.html` for a demo example.
|
||||
|
||||
## Configuration
|
||||
The HTML output accepts a Javascript object with configuration. Possible options:
|
||||
|
|
@ -79,9 +103,14 @@ The HTML output accepts a Javascript object with configuration. Possible options
|
|||
|
||||
> Simple wrapper to ease simple tasks in the browser such as: code highlight and js effects
|
||||
|
||||
* Invoke Diff2html
|
||||
* Inject output in DOM element
|
||||
* Enable collapsible file summary list
|
||||
* Enable syntax highlight of the code in the diffs
|
||||
|
||||
### How to use
|
||||
|
||||
> HTML resource imports
|
||||
#### Mandatory HTML resource imports
|
||||
|
||||
```html
|
||||
<!-- CSS -->
|
||||
|
|
@ -92,7 +121,7 @@ The HTML output accepts a Javascript object with configuration. Possible options
|
|||
<script type="text/javascript" src="dist/diff2html-ui.js"></script>
|
||||
```
|
||||
|
||||
> Init
|
||||
#### Init
|
||||
|
||||
```js
|
||||
var diff2htmlUi = new Diff2HtmlUI({diff: diffString});
|
||||
|
|
@ -100,25 +129,13 @@ var diff2htmlUi = new Diff2HtmlUI({diff: diffString});
|
|||
var diff2htmlUi = new Diff2HtmlUI({json: diffJson});
|
||||
```
|
||||
|
||||
> Draw
|
||||
#### Draw
|
||||
|
||||
```js
|
||||
diff2htmlUi.draw('html-target-elem', {inputFormat: 'json', showFiles: true, matching: 'lines'});
|
||||
```
|
||||
|
||||
> Highlight Code
|
||||
|
||||
```js
|
||||
diff2htmlUi.highlightCode('html-target-elem');
|
||||
```
|
||||
|
||||
> Collapse File Summary List
|
||||
|
||||
```js
|
||||
diff2htmlUi.fileListCloseable('html-target-elem', false);
|
||||
```
|
||||
|
||||
## Syntax Highlight
|
||||
#### Syntax Highlight
|
||||
|
||||
> Add the dependencies.
|
||||
Choose one color scheme, and add the main highlight code.
|
||||
|
|
@ -126,12 +143,12 @@ If your favourite language is not included in the default package also add its j
|
|||
|
||||
```html
|
||||
<!-- Stylesheet -->
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/9.3.0/styles/github.min.css">
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/9.6.0/styles/github.min.css">
|
||||
|
||||
<!-- Javascripts -->
|
||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.2.3/jquery.js"></script>
|
||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/9.3.0/highlight.min.js"></script>
|
||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/9.3.0/languages/scala.min.js"></script>
|
||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/9.6.0/highlight.min.js"></script>
|
||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/9.6.0/languages/scala.min.js"></script>
|
||||
<script type="text/javascript" src="dist/diff2html-ui.js"></script>
|
||||
```
|
||||
|
||||
|
|
@ -145,7 +162,7 @@ $(document).ready(function() {
|
|||
});
|
||||
```
|
||||
|
||||
## Collapsable File Summary List
|
||||
#### Collapsable File Summary List
|
||||
|
||||
> Add the dependencies.
|
||||
|
||||
|
|
|
|||
66
docs/diff2html.d.ts
vendored
Normal file
66
docs/diff2html.d.ts
vendored
Normal file
|
|
@ -0,0 +1,66 @@
|
|||
// Type definitions for diff2html
|
||||
// Project: https://github.com/rtfpessoa/diff2html
|
||||
// Definitions by: rtfpessoa <https://github.com/rtfpessoa/>
|
||||
// Definitions: https://github.com/DefinitelyTyped/DefinitelyTyped
|
||||
|
||||
declare namespace Diff2Html {
|
||||
|
||||
export interface Options {
|
||||
inputFormat?: string;
|
||||
outputFormat?: string;
|
||||
showFiles?: boolean;
|
||||
matching?: string;
|
||||
synchronisedScroll?: boolean;
|
||||
matchWordsThreshold?: number;
|
||||
matchingMaxComparisons?: number;
|
||||
}
|
||||
|
||||
export interface Line {
|
||||
content: string;
|
||||
type: string;
|
||||
oldNumber: number;
|
||||
newNumber: number;
|
||||
}
|
||||
|
||||
export interface Block {
|
||||
oldStartLine: number;
|
||||
oldStartLine2?: number;
|
||||
newStartLine: number;
|
||||
header: string;
|
||||
lines: Line[];
|
||||
}
|
||||
|
||||
export interface Result {
|
||||
addedLines: number;
|
||||
deletedLines: number;
|
||||
isCombined: boolean;
|
||||
isGitDiff: boolean;
|
||||
oldName: string;
|
||||
newName: string;
|
||||
language: string;
|
||||
blocks: Block[];
|
||||
oldMode?: string;
|
||||
newMode?: string;
|
||||
deletedFileMode?: string;
|
||||
newFileMode?: string;
|
||||
isDeleted?: boolean;
|
||||
isNew?: boolean;
|
||||
isCopy?: boolean;
|
||||
isRename?: boolean;
|
||||
unchangedPercentage?: number;
|
||||
changedPercentage?: number;
|
||||
checksumBefore?: string;
|
||||
checksumAfter?: string;
|
||||
mode?: string;
|
||||
}
|
||||
|
||||
export interface Diff2Html {
|
||||
getJsonFromDiff(input: string, configuration?: Options): Result;
|
||||
getPrettyHtml(input: any, configuration?: Options): string;
|
||||
}
|
||||
}
|
||||
|
||||
declare module "diff2html" {
|
||||
var d2h: { "Diff2Html": Diff2Html.Diff2Html };
|
||||
export = d2h;
|
||||
}
|
||||
|
|
@ -9,12 +9,12 @@
|
|||
Author: rtfpessoa
|
||||
-->
|
||||
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/9.4.0/styles/github.min.css">
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/9.6.0/styles/github.min.css">
|
||||
|
||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.2.3/jquery.js"></script>
|
||||
|
||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/9.4.0/highlight.min.js"></script>
|
||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/9.4.0/languages/scala.min.js"></script>
|
||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/9.6.0/highlight.min.js"></script>
|
||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/9.6.0/languages/scala.min.js"></script>
|
||||
|
||||
<!-- diff2html -->
|
||||
<link rel="stylesheet" type="text/css" href="../dist/diff2html.css">
|
||||
2782
npm-shrinkwrap.json
generated
Normal file
2782
npm-shrinkwrap.json
generated
Normal file
File diff suppressed because it is too large
Load diff
18
package.json
18
package.json
|
|
@ -53,21 +53,21 @@
|
|||
"fs": false
|
||||
},
|
||||
"dependencies": {
|
||||
"diff": "^2.2.3",
|
||||
"diff": "^3.0.0",
|
||||
"hogan.js": "^3.0.2"
|
||||
},
|
||||
"devDependencies": {
|
||||
"autoprefixer": "^6.3.6",
|
||||
"browserify": "^13.0.1",
|
||||
"clean-css": "^3.4.18",
|
||||
"codacy-coverage": "^1.1.3",
|
||||
"eslint": "^3.0.1",
|
||||
"eslint-plugin-promise": "^1.3.2",
|
||||
"eslint-plugin-standard": "^1.3.2",
|
||||
"autoprefixer": "^6.4.0",
|
||||
"browserify": "^13.1.0",
|
||||
"clean-css": "^3.4.19",
|
||||
"codacy-coverage": "^2.0.0",
|
||||
"eslint": "^3.3.1",
|
||||
"eslint-plugin-promise": "^2.0.1",
|
||||
"eslint-plugin-standard": "^2.0.0",
|
||||
"fast-html-parser": "^1.0.1",
|
||||
"istanbul": "^0.4.4",
|
||||
"mkdirp": "^0.5.1",
|
||||
"mocha": "^2.5.3",
|
||||
"mocha": "^3.0.2",
|
||||
"nopt": "^3.0.6",
|
||||
"postcss-cli": "^2.5.2",
|
||||
"uglifyjs": "^2.4.10"
|
||||
|
|
|
|||
Loading…
Reference in a new issue