diff --git a/Makefile b/Makefile
index b85fd58..c792c5b 100644
--- a/Makefile
+++ b/Makefile
@@ -1,8 +1,10 @@
.PHONY: build setup copy serve clean
-build: setup build/katex.js build/katex.less.css
+build: setup build/katex.js build/katex.less.css pdiff
setup:
npm install
+ brew install webkit2png
+ brew install graphicsmagick
compress: build/katex.min.js
@printf "Minified, gzipped size: "
@@ -20,5 +22,12 @@ build/katex.less.css: static/katex.less
serve:
node server.js
+pdiff:
+ @printf "Creating new pdiff image...\n"
+ @webkit2png http://localhost:7936/test/pdiff.html -F --transparent -D build -o pdiff >/dev/null 2>&1
+ @mv build/pdiff-full.png build/pdiff.png
+ @printf "Comparing to reference pdiff image...\n"
+ @node test/pdiff.js
+
clean:
rm -rf build/*
diff --git a/README.md b/README.md
new file mode 100644
index 0000000..57fad4d
--- /dev/null
+++ b/README.md
@@ -0,0 +1,17 @@
+KaTeX
+=====
+
+Fast math!
+
+To run locally
+--------------
+ make setup
+ make serve
+
+* [Test page](localhost:7936/)
+* [Unit tests](localhost:7936/test/test.html)
+* [Perceptual diff](localhost:7936/test/pdiff.html)
+
+Perceptual diff
+---------------
+ make pdiff
diff --git a/package.json b/package.json
index 41f012f..6d67f36 100644
--- a/package.json
+++ b/package.json
@@ -1,10 +1,16 @@
{
"name": "katex",
"version": "0.0.1",
+ "description": "Fast math!",
+ "repository": {
+ "type": "git",
+ "url": "git://github.com/Khan/KaTeX.git"
+ },
"devDependencies": {
"browserify": "~2.29.1",
"express": "~3.3.3",
"less": "~1.4.2",
- "through": "~2.3.4"
+ "through": "~2.3.4",
+ "gm": "~1.14.2"
}
}
diff --git a/test/pdiff.html b/test/pdiff.html
new file mode 100644
index 0000000..0286eb5
--- /dev/null
+++ b/test/pdiff.html
@@ -0,0 +1,53 @@
+
+
+
+ KaTeX Perceptual Diff
+
+
+
+
+
+
+
+
+
+
+
+ 1\le2+2=4\ge3\ne\pi
+ x^{x^{x_b}_b}x_{b_b}x^x_b
+ \tiny{a}\scriptsize{b}\footnotesize{c}\small{d}\normalsize{e}f
+ \blue{a}\orange{b}\pink{c}\red{d}\green{e}\gray{f}\purple{g}
+ \angle ABC \approx \frac{3}{4}\!\lvert x \rvert \cos\theta
+ \langle a , b \rangle \colon \div \pm \infty
+ (mn)^3=\blue{m^3n^3}\in\dfrac{5m^4\cdot\blue{m^3n^3}}{15m^2} \dfrac{5m^7n^3}{15m^2}
+ \blue\dfrac{\frac{\phi^2}{3}-G_a^{x^3}}{2\times3+4}+\orange\dfrac{(x^2+y^2)^\frac{1}{2}}{\tan\psi^\tau+2/3}
+ \quad 800\cdot (\frac{1}{2})^{\frac{t}{14}}=50
+ text text text\dfrac{stuff}{things}text text text
+
+
diff --git a/test/pdiff.js b/test/pdiff.js
new file mode 100644
index 0000000..db8915e
--- /dev/null
+++ b/test/pdiff.js
@@ -0,0 +1,37 @@
+var fs = require('fs'),
+ gm = require('gm'),
+ path = require('path');
+
+var original = path.join(__dirname, 'pdiff.png'),
+ modified = path.join(__dirname, '../build/pdiff.png'),
+ difference = path.join(__dirname, '../build/DIFF.png');
+
+var colors = {
+ reset: "\033[0m",
+ red: "\033[31m",
+ green: "\033[32m"
+};
+
+function log(message, color) {
+ console.log(color + message + colors.reset);
+}
+
+gm.compare(original, modified, /* tolerance */ 0, function(err, isEqual) {
+ if (err) {
+ console.error(err);
+ } else if (isEqual) {
+ log("No perceptible differences.", colors.green);
+ // Remove any previously generated difference images
+ fs.unlink(difference, function() {});
+ } else {
+ log("Perceptible difference detected! See build/DIFF.png", colors.red);
+ // Generate new difference image
+ gm.compare(original, modified, {
+ /* output */ file: difference
+ }, function(err) {
+ if (err) {
+ console.error(err);
+ }
+ });
+ }
+});
\ No newline at end of file
diff --git a/test/pdiff.png b/test/pdiff.png
new file mode 100644
index 0000000..dce413d
Binary files /dev/null and b/test/pdiff.png differ