Skip to content

Commit df6d5bb

Browse files
author
Rodrigo Fernandes
committed
Merge pull request #15 from rtfpessoa/cleaning
Clean project, better module exposing and documentation
2 parents ffeaec2 + aac689e commit df6d5bb

File tree

14 files changed

+238
-128
lines changed

14 files changed

+238
-128
lines changed

‎README.md‎

Lines changed: 55 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
# Diff to Html by [rtfpessoa](https://github.com/rtfpessoa)
22

3-
Diff to Html generates pretty HTML diffs from git word diff output.
3+
Diff to Html generates pretty HTML diffs from git diff output.
44

55
## Features
66

@@ -12,6 +12,8 @@ Diff to Html generates pretty HTML diffs from git word diff output.
1212

1313
* GitHub like style
1414

15+
* Code syntax highlight
16+
1517
## Online Example
1618

1719
> Go to [Diff2HTML](http://rtfpessoa.github.io/diff2html/)
@@ -24,6 +26,8 @@ Diff to Html generates pretty HTML diffs from git word diff output.
2426

2527
* [Bower Package](http://bower.io/search/?q=diff2html)
2628

29+
* [Node CLI](https://www.npmjs.org/package/diff2html-cli)
30+
2731
* Manually download and import `dist/diff2html.min.js` into your page
2832

2933
## How to use
@@ -50,11 +54,60 @@ Diff to Html generates pretty HTML diffs from git word diff output.
5054

5155
> Check out the `index.html` for a complete example.
5256
57+
## Sintax Hightlight
58+
59+
> Add the dependencies.
60+
Choose one color scheme, and add the main highlight code.
61+
If your favourite language is not included in the default package also add its javascript highlight file.
62+
jQuery is optional, just using it to help managing the highlight.
63+
64+
```html
65+
<!-- Stylesheet -->
66+
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/8.6/styles/github.min.css">
67+
68+
<!-- Javascripts -->
69+
<script src="https://code.jquery.com/jquery-2.1.3.min.js"></script>
70+
<script src="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/8.6/highlight.min.js"></script>
71+
<script src="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/8.6/languages/scala.min.js"></script>
72+
```
73+
74+
> Invoke the highlightjs plugin
75+
76+
```js
77+
document.addEventListener("DOMContentLoaded", function () {
78+
// parse the diff to json
79+
var diffJson = Diff2Html.getJsonFromDiff(lineDiffExample);
80+
81+
// collect all the file extensions in the json
82+
var allFileLanguages = diffJson.map(function (line) {
83+
return line.language;
84+
});
85+
86+
// remove duplicated languages
87+
var distinctLanguages = allFileLanguages.filter(function (v, i) {
88+
return allFileLanguages.indexOf(v) == i;
89+
});
90+
91+
// pass the languages to the highlightjs plugin
92+
hljs.configure({languages: distinctLanguages});
93+
94+
// generate and inject the diff HTML into the desired place
95+
document.getElementById("line-by-line").innerHTML = Diff2Html.getPrettyHtmlFromJson(diffJson);
96+
document.getElementById("side-by-side").innerHTML = Diff2Html.getPrettySideBySideHtmlFromJson(diffJson);
97+
98+
// collect all the code lines and execute the highlight on them
99+
var codeLines = document.getElementsByClassName("d2h-code-line-ctn");
100+
[].forEach.call(codeLines, function (line) {
101+
hljs.highlightBlock(line);
102+
});
103+
});
104+
```
105+
53106
## Contributions
54107

55108
All the contributions are welcome.
56109

57-
To contribute just send a pull request with your feature,fix,... and it will be reviewed asap.
110+
To contribute just send a pull request with your changes and I will review it asap.
58111

59112
## License
60113

‎bower.json‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
{
22
"name": "diff2html",
33
"version": "0.2.5-1",
4-
"homepage": "https://github.com/rtfpessoa/diff2html",
4+
"homepage": "http://rtfpessoa.github.io/diff2html/",
55
"description": "Fast Diff to colorized HTML",
66
"keywords": [
77
"git",

‎dist/diff2html.js‎

Lines changed: 83 additions & 57 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,25 @@
11
// Diff2Html minifier version (automatically generated)
2-
var global = this;
2+
/*
3+
* Hack to allow nodejs require("package/file") in the browser
4+
* How?
5+
* Since every require is used as an object:
6+
* `require("./utils.js").Utils` // (notice the `.Utils`)
7+
*
8+
* We can say that when there is no require method
9+
* we use the global object in which the `Utils`
10+
* object was already injected.
11+
*/
12+
13+
var $globalHolder = (typeof module !== 'undefined' && module.exports) ||
14+
(typeof exports !== 'undefined' && exports) ||
15+
(typeof window !== 'undefined' && window) ||
16+
(typeof self !== 'undefined' && self) ||
17+
(typeof this !== 'undefined' && this) ||
18+
Function('return this')();
319
function require() {
4-
return global;
5-
}/* See LICENSE file for terms of use */
20+
return $globalHolder;
21+
}
22+
/* See LICENSE file for terms of use */
623

724
/*
825
* Text diff implementation.
@@ -652,7 +669,7 @@ function require() {
652669
*
653670
*/
654671

655-
(function (global, undefined) {
672+
(function (ctx, undefined) {
656673

657674
function Utils() {
658675
}
@@ -673,11 +690,13 @@ function require() {
673690
return value ? value : "";
674691
};
675692

676-
if (typeof module !== 'undefined' && module.exports) {
677-
module.exports.Utils = new Utils();
678-
} else if (typeof global.Utils === 'undefined') {
679-
global.Utils = new Utils();
680-
}
693+
// expose this module
694+
((typeof module !== 'undefined' && module.exports) ||
695+
(typeof exports !== 'undefined' && exports) ||
696+
(typeof window !== 'undefined' && window) ||
697+
(typeof self !== 'undefined' && self) ||
698+
(typeof $this !== 'undefined' && $this) ||
699+
Function('return this')())["Utils"] = new Utils();
681700

682701
})(this);
683702
/*
@@ -687,7 +706,7 @@ function require() {
687706
*
688707
*/
689708

690-
(function (global, undefined) {
709+
(function (ctx, undefined) {
691710

692711
var utils = require("./utils.js").Utils;
693712

@@ -895,11 +914,13 @@ function require() {
895914
else return language;
896915
}
897916

898-
if (typeof module !== 'undefined' && module.exports) {
899-
module.exports.DiffParser = new DiffParser();
900-
} else if (typeof global.DiffParser === 'undefined') {
901-
global.DiffParser = new DiffParser();
902-
}
917+
// expose this module
918+
((typeof module !== 'undefined' && module.exports) ||
919+
(typeof exports !== 'undefined' && exports) ||
920+
(typeof window !== 'undefined' && window) ||
921+
(typeof self !== 'undefined' && self) ||
922+
(typeof $this !== 'undefined' && $this) ||
923+
Function('return this')())["DiffParser"] = new DiffParser();
903924

904925
})(this);
905926
/*
@@ -909,12 +930,10 @@ function require() {
909930
*
910931
*/
911932

912-
(function (global, undefined) {
933+
(function (ctx, undefined) {
913934

914935
// dirty hack for browser compatibility
915-
var jsDiff = (typeof JsDiff !== "undefined" && JsDiff) ||
916-
require("diff") ||
917-
require("../lib/diff.js");
936+
var jsDiff = (typeof JsDiff !== "undefined" && JsDiff) || require("diff");
918937
var utils = require("./utils.js").Utils;
919938

920939
function PrinterUtils() {
@@ -988,11 +1007,13 @@ function require() {
9881007
return line.replace(/(<del>((.|\n)*?)<\/del>)/g, "");
9891008
}
9901009

991-
if (typeof module !== 'undefined' && module.exports) {
992-
module.exports.PrinterUtils = new PrinterUtils();
993-
} else if (typeof global.PrinterUtils === 'undefined') {
994-
global.PrinterUtils = new PrinterUtils();
995-
}
1010+
// expose this module
1011+
((typeof module !== 'undefined' && module.exports) ||
1012+
(typeof exports !== 'undefined' && exports) ||
1013+
(typeof window !== 'undefined' && window) ||
1014+
(typeof self !== 'undefined' && self) ||
1015+
(typeof $this !== 'undefined' && $this) ||
1016+
Function('return this')())["PrinterUtils"] = new PrinterUtils();
9961017

9971018
})(this);
9981019
/*
@@ -1002,7 +1023,7 @@ function require() {
10021023
*
10031024
*/
10041025

1005-
(function (global, undefined) {
1026+
(function (ctx, undefined) {
10061027

10071028
var diffParser = require("./diff-parser.js").DiffParser;
10081029
var printerUtils = require("./printer-utils.js").PrinterUtils;
@@ -1183,11 +1204,13 @@ function require() {
11831204
return fileHtml;
11841205
}
11851206

1186-
if (typeof module !== 'undefined' && module.exports) {
1187-
module.exports.SideBySidePrinter = new SideBySidePrinter();
1188-
} else if (typeof global.SideBySidePrinter === 'undefined') {
1189-
global.SideBySidePrinter = new SideBySidePrinter();
1190-
}
1207+
// expose this module
1208+
((typeof module !== 'undefined' && module.exports) ||
1209+
(typeof exports !== 'undefined' && exports) ||
1210+
(typeof window !== 'undefined' && window) ||
1211+
(typeof self !== 'undefined' && self) ||
1212+
(typeof $this !== 'undefined' && $this) ||
1213+
Function('return this')())["SideBySidePrinter"] = new SideBySidePrinter();
11911214

11921215
})(this);
11931216
/*
@@ -1197,7 +1220,7 @@ function require() {
11971220
*
11981221
*/
11991222

1200-
(function (global, undefined) {
1223+
(function (ctx, undefined) {
12011224

12021225
var diffParser = require("./diff-parser.js").DiffParser;
12031226
var printerUtils = require("./printer-utils.js").PrinterUtils;
@@ -1342,11 +1365,13 @@ function require() {
13421365
"</tr>\n";
13431366
}
13441367

1345-
if (typeof module !== 'undefined' && module.exports) {
1346-
module.exports.LineByLinePrinter = new LineByLinePrinter();
1347-
} else if (typeof global.LineByLinePrinter === 'undefined') {
1348-
global.LineByLinePrinter = new LineByLinePrinter();
1349-
}
1368+
// expose this module
1369+
((typeof module !== 'undefined' && module.exports) ||
1370+
(typeof exports !== 'undefined' && exports) ||
1371+
(typeof window !== 'undefined' && window) ||
1372+
(typeof self !== 'undefined' && self) ||
1373+
(typeof $this !== 'undefined' && $this) ||
1374+
Function('return this')())["LineByLinePrinter"] = new LineByLinePrinter();
13501375

13511376
})(this);
13521377
/*
@@ -1356,7 +1381,7 @@ function require() {
13561381
*
13571382
*/
13581383

1359-
(function (global, undefined) {
1384+
(function (ctx, undefined) {
13601385

13611386
var lineByLinePrinter = require("./line-by-line-printer.js").LineByLinePrinter;
13621387
var sideBySidePrinter = require("./side-by-side-printer.js").SideBySidePrinter;
@@ -1368,23 +1393,23 @@ function require() {
13681393

13691394
HtmlPrinter.prototype.generateSideBySideJsonHtml = sideBySidePrinter.generateSideBySideJsonHtml;
13701395

1371-
if (typeof module !== 'undefined' && module.exports) {
1372-
module.exports.HtmlPrinter = new HtmlPrinter();
1373-
} else if (typeof global.HtmlPrinter === 'undefined') {
1374-
global.HtmlPrinter = new HtmlPrinter();
1375-
}
1396+
// expose this module
1397+
((typeof module !== 'undefined' && module.exports) ||
1398+
(typeof exports !== 'undefined' && exports) ||
1399+
(typeof window !== 'undefined' && window) ||
1400+
(typeof self !== 'undefined' && self) ||
1401+
(typeof $this !== 'undefined' && $this) ||
1402+
Function('return this')())["HtmlPrinter"] = new HtmlPrinter();
13761403

13771404
})(this);
13781405
/*
13791406
*
13801407
* Diff to HTML (diff2html.js)
13811408
* Author: rtfpessoa
13821409
*
1383-
* Diff commands:
1384-
* git diff
13851410
*/
13861411

1387-
(function (global, undefined) {
1412+
(function (ctx, undefined) {
13881413

13891414
var diffParser = require("./diff-parser.js").DiffParser;
13901415
var htmlPrinter = require("./html-printer.js").HtmlPrinter;
@@ -1393,13 +1418,12 @@ function require() {
13931418
}
13941419

13951420
/*
1396-
* config
1397-
* {
1398-
* "wordByWord" : true (default)
1399-
* OR
1400-
* "charByChar" : true
1401-
* }
1402-
*
1421+
* Line diff type configuration
1422+
var config = {
1423+
"wordByWord": true, // (default)
1424+
// OR
1425+
"charByChar": true
1426+
};
14031427
*/
14041428

14051429
/*
@@ -1444,10 +1468,12 @@ function require() {
14441468
return htmlPrinter.generateSideBySideJsonHtml(diffJson, configOrEmpty);
14451469
};
14461470

1447-
if (typeof module !== 'undefined' && module.exports) {
1448-
module.exports.Diff2Html = new Diff2Html();
1449-
} else if (typeof global.Diff2Html === 'undefined') {
1450-
global.Diff2Html = new Diff2Html();
1451-
}
1471+
// expose this module
1472+
((typeof module !== 'undefined' && module.exports) ||
1473+
(typeof exports !== 'undefined' && exports) ||
1474+
(typeof window !== 'undefined' && window) ||
1475+
(typeof self !== 'undefined' && self) ||
1476+
(typeof $this !== 'undefined' && $this) ||
1477+
Function('return this')())["Diff2Html"] = new Diff2Html();
14521478

14531479
})(this);

‎dist/diff2html.min.js‎

Lines changed: 1 addition & 1 deletion
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎lib/fakeRequire.js‎

Lines changed: 19 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,20 @@
1-
var global = this;
1+
/*
2+
* Hack to allow nodejs require("package/file") in the browser
3+
* How?
4+
* Since every require is used as an object:
5+
* `require("./utils.js").Utils` // (notice the `.Utils`)
6+
*
7+
* We can say that when there is no require method
8+
* we use the global object in which the `Utils`
9+
* object was already injected.
10+
*/
11+
12+
var $globalHolder = (typeof module !== 'undefined' && module.exports) ||
13+
(typeof exports !== 'undefined' && exports) ||
14+
(typeof window !== 'undefined' && window) ||
15+
(typeof self !== 'undefined' && self) ||
16+
(typeof this !== 'undefined' && this) ||
17+
Function('return this')();
218
function require() {
3-
return global;
4-
}
19+
return $globalHolder;
20+
}

‎package.json‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
{
22
"name": "diff2html",
3-
"version": "0.2.5-1",
4-
"homepage": "https://www.github.com/rtfpessoa/diff2html",
3+
"version": "0.2.6",
4+
"homepage": "http://rtfpessoa.github.io/diff2html/",
55
"description": "Fast Diff to colorized HTML",
66
"keywords": [
77
"git",

0 commit comments

Comments
 (0)