Added TypeScript linter

This commit is contained in:
Nathan Kunicki 2017-11-18 00:59:21 +00:00
parent a7725f7ca0
commit 68233dde85
5 changed files with 362 additions and 43 deletions

293
package-lock.json generated
View File

@ -4,11 +4,304 @@
"lockfileVersion": 1,
"requires": true,
"dependencies": {
"ansi-regex": {
"version": "2.1.1",
"resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-2.1.1.tgz",
"integrity": "sha1-w7M6te42DYbg5ijwRorn7yfWVN8=",
"dev": true
},
"ansi-styles": {
"version": "2.2.1",
"resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-2.2.1.tgz",
"integrity": "sha1-tDLdM1i2NM914eRmQ2gkBTPB3b4=",
"dev": true
},
"babel-code-frame": {
"version": "6.26.0",
"resolved": "https://registry.npmjs.org/babel-code-frame/-/babel-code-frame-6.26.0.tgz",
"integrity": "sha1-Y/1D99weO7fONZR9uP42mj9Yx0s=",
"dev": true,
"requires": {
"chalk": "1.1.3",
"esutils": "2.0.2",
"js-tokens": "3.0.2"
},
"dependencies": {
"chalk": {
"version": "1.1.3",
"resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
"integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg=",
"dev": true,
"requires": {
"ansi-styles": "2.2.1",
"escape-string-regexp": "1.0.5",
"has-ansi": "2.0.0",
"strip-ansi": "3.0.1",
"supports-color": "2.0.0"
}
}
}
},
"balanced-match": {
"version": "1.0.0",
"resolved": "https://registry.npmjs.org/balanced-match/-/balanced-match-1.0.0.tgz",
"integrity": "sha1-ibTRmasr7kneFk6gK4nORi1xt2c=",
"dev": true
},
"brace-expansion": {
"version": "1.1.8",
"resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-1.1.8.tgz",
"integrity": "sha1-wHshHHyVLsH479Uad+8NHTmQopI=",
"dev": true,
"requires": {
"balanced-match": "1.0.0",
"concat-map": "0.0.1"
}
},
"builtin-modules": {
"version": "1.1.1",
"resolved": "https://registry.npmjs.org/builtin-modules/-/builtin-modules-1.1.1.tgz",
"integrity": "sha1-Jw8HbFpywC9bZaR9+Uxf46J4iS8=",
"dev": true
},
"chalk": {
"version": "2.3.0",
"resolved": "https://registry.npmjs.org/chalk/-/chalk-2.3.0.tgz",
"integrity": "sha512-Az5zJR2CBujap2rqXGaJKaPHyJ0IrUimvYNX+ncCy8PJP4ltOGTrHUIo097ZaL2zMeKYpiCdqDvS6zdrTFok3Q==",
"dev": true,
"requires": {
"ansi-styles": "3.2.0",
"escape-string-regexp": "1.0.5",
"supports-color": "4.5.0"
},
"dependencies": {
"ansi-styles": {
"version": "3.2.0",
"resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-3.2.0.tgz",
"integrity": "sha512-NnSOmMEYtVR2JVMIGTzynRkkaxtiq1xnFBcdQD/DnNCYPoEPsVJhM98BDyaoNOQIi7p4okdi3E27eN7GQbsUug==",
"dev": true,
"requires": {
"color-convert": "1.9.1"
}
},
"supports-color": {
"version": "4.5.0",
"resolved": "https://registry.npmjs.org/supports-color/-/supports-color-4.5.0.tgz",
"integrity": "sha1-vnoN5ITexcXN34s9WRJQRJEvY1s=",
"dev": true,
"requires": {
"has-flag": "2.0.0"
}
}
}
},
"color-convert": {
"version": "1.9.1",
"resolved": "https://registry.npmjs.org/color-convert/-/color-convert-1.9.1.tgz",
"integrity": "sha512-mjGanIiwQJskCC18rPR6OmrZ6fm2Lc7PeGFYwCmy5J34wC6F1PzdGL6xeMfmgicfYcNLGuVFA3WzXtIDCQSZxQ==",
"dev": true,
"requires": {
"color-name": "1.1.3"
}
},
"color-name": {
"version": "1.1.3",
"resolved": "https://registry.npmjs.org/color-name/-/color-name-1.1.3.tgz",
"integrity": "sha1-p9BVi9icQveV3UIyj3QIMcpTvCU=",
"dev": true
},
"commander": {
"version": "2.11.0",
"resolved": "https://registry.npmjs.org/commander/-/commander-2.11.0.tgz",
"integrity": "sha512-b0553uYA5YAEGgyYIGYROzKQ7X5RAqedkfjiZxwi0kL1g3bOaBNNZfYkzt/CL0umgD5wc9Jec2FbB98CjkMRvQ==",
"dev": true
},
"concat-map": {
"version": "0.0.1",
"resolved": "https://registry.npmjs.org/concat-map/-/concat-map-0.0.1.tgz",
"integrity": "sha1-2Klr13/Wjfd5OnMDajug1UBdR3s=",
"dev": true
},
"diff": {
"version": "3.4.0",
"resolved": "https://registry.npmjs.org/diff/-/diff-3.4.0.tgz",
"integrity": "sha512-QpVuMTEoJMF7cKzi6bvWhRulU1fZqZnvyVQgNhPaxxuTYwyjn/j1v9falseQ/uXWwPnO56RBfwtg4h/EQXmucA==",
"dev": true
},
"escape-string-regexp": {
"version": "1.0.5",
"resolved": "https://registry.npmjs.org/escape-string-regexp/-/escape-string-regexp-1.0.5.tgz",
"integrity": "sha1-G2HAViGQqN/2rjuyzwIAyhMLhtQ=",
"dev": true
},
"esutils": {
"version": "2.0.2",
"resolved": "https://registry.npmjs.org/esutils/-/esutils-2.0.2.tgz",
"integrity": "sha1-Cr9PHKpbyx96nYrMbepPqqBLrJs=",
"dev": true
},
"fs.realpath": {
"version": "1.0.0",
"resolved": "https://registry.npmjs.org/fs.realpath/-/fs.realpath-1.0.0.tgz",
"integrity": "sha1-FQStJSMVjKpA20onh8sBQRmU6k8=",
"dev": true
},
"glob": {
"version": "7.1.2",
"resolved": "https://registry.npmjs.org/glob/-/glob-7.1.2.tgz",
"integrity": "sha512-MJTUg1kjuLeQCJ+ccE4Vpa6kKVXkPYJ2mOCQyUuKLcLQsdrMCpBPUi8qVE6+YuaJkozeA9NusTAw3hLr8Xe5EQ==",
"dev": true,
"requires": {
"fs.realpath": "1.0.0",
"inflight": "1.0.6",
"inherits": "2.0.3",
"minimatch": "3.0.4",
"once": "1.4.0",
"path-is-absolute": "1.0.1"
}
},
"has-ansi": {
"version": "2.0.0",
"resolved": "https://registry.npmjs.org/has-ansi/-/has-ansi-2.0.0.tgz",
"integrity": "sha1-NPUEnOHs3ysGSa8+8k5F7TVBbZE=",
"dev": true,
"requires": {
"ansi-regex": "2.1.1"
}
},
"has-flag": {
"version": "2.0.0",
"resolved": "https://registry.npmjs.org/has-flag/-/has-flag-2.0.0.tgz",
"integrity": "sha1-6CB68cx7MNRGzHC3NLXovhj4jVE=",
"dev": true
},
"inflight": {
"version": "1.0.6",
"resolved": "https://registry.npmjs.org/inflight/-/inflight-1.0.6.tgz",
"integrity": "sha1-Sb1jMdfQLQwJvJEKEHW6gWW1bfk=",
"dev": true,
"requires": {
"once": "1.4.0",
"wrappy": "1.0.2"
}
},
"inherits": {
"version": "2.0.3",
"resolved": "https://registry.npmjs.org/inherits/-/inherits-2.0.3.tgz",
"integrity": "sha1-Yzwsg+PaQqUC9SRmAiSA9CCCYd4=",
"dev": true
},
"js-tokens": {
"version": "3.0.2",
"resolved": "https://registry.npmjs.org/js-tokens/-/js-tokens-3.0.2.tgz",
"integrity": "sha1-mGbfOVECEw449/mWvOtlRDIJwls=",
"dev": true
},
"minimatch": {
"version": "3.0.4",
"resolved": "https://registry.npmjs.org/minimatch/-/minimatch-3.0.4.tgz",
"integrity": "sha512-yJHVQEhyqPLUTgt9B83PXu6W3rx4MvvHvSUvToogpwoGDOUQ+yDrR0HRot+yOCdCO7u4hX3pWft6kWBBcqh0UA==",
"dev": true,
"requires": {
"brace-expansion": "1.1.8"
}
},
"once": {
"version": "1.4.0",
"resolved": "https://registry.npmjs.org/once/-/once-1.4.0.tgz",
"integrity": "sha1-WDsap3WWHUsROsF9nFC6753Xa9E=",
"dev": true,
"requires": {
"wrappy": "1.0.2"
}
},
"path-is-absolute": {
"version": "1.0.1",
"resolved": "https://registry.npmjs.org/path-is-absolute/-/path-is-absolute-1.0.1.tgz",
"integrity": "sha1-F0uSaHNVNP+8es5r9TpanhtcX18=",
"dev": true
},
"path-parse": {
"version": "1.0.5",
"resolved": "https://registry.npmjs.org/path-parse/-/path-parse-1.0.5.tgz",
"integrity": "sha1-PBrfhx6pzWyUMbbqK9dKD/BVxME=",
"dev": true
},
"resolve": {
"version": "1.5.0",
"resolved": "https://registry.npmjs.org/resolve/-/resolve-1.5.0.tgz",
"integrity": "sha512-hgoSGrc3pjzAPHNBg+KnFcK2HwlHTs/YrAGUr6qgTVUZmXv1UEXXl0bZNBKMA9fud6lRYFdPGz0xXxycPzmmiw==",
"dev": true,
"requires": {
"path-parse": "1.0.5"
}
},
"semver": {
"version": "5.4.1",
"resolved": "https://registry.npmjs.org/semver/-/semver-5.4.1.tgz",
"integrity": "sha512-WfG/X9+oATh81XtllIo/I8gOiY9EXRdv1cQdyykeXK17YcUW3EXUAi2To4pcH6nZtJPr7ZOpM5OMyWJZm+8Rsg==",
"dev": true
},
"strip-ansi": {
"version": "3.0.1",
"resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-3.0.1.tgz",
"integrity": "sha1-ajhfuIU9lS1f8F0Oiq+UJ43GPc8=",
"dev": true,
"requires": {
"ansi-regex": "2.1.1"
}
},
"supports-color": {
"version": "2.0.0",
"resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz",
"integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc=",
"dev": true
},
"tslib": {
"version": "1.8.0",
"resolved": "https://registry.npmjs.org/tslib/-/tslib-1.8.0.tgz",
"integrity": "sha512-ymKWWZJST0/CkgduC2qkzjMOWr4bouhuURNXCn/inEX0L57BnRG6FhX76o7FOnsjHazCjfU2LKeSrlS2sIKQJg==",
"dev": true
},
"tslint": {
"version": "5.8.0",
"resolved": "https://registry.npmjs.org/tslint/-/tslint-5.8.0.tgz",
"integrity": "sha1-H0mtWy53x2w69N3K5VKuTjYS6xM=",
"dev": true,
"requires": {
"babel-code-frame": "6.26.0",
"builtin-modules": "1.1.1",
"chalk": "2.3.0",
"commander": "2.11.0",
"diff": "3.4.0",
"glob": "7.1.2",
"minimatch": "3.0.4",
"resolve": "1.5.0",
"semver": "5.4.1",
"tslib": "1.8.0",
"tsutils": "2.12.2"
}
},
"tsutils": {
"version": "2.12.2",
"resolved": "https://registry.npmjs.org/tsutils/-/tsutils-2.12.2.tgz",
"integrity": "sha1-rVikhl0X7D3bZjG2ylO+FKVlb/M=",
"dev": true,
"requires": {
"tslib": "1.8.0"
}
},
"typescript": {
"version": "2.6.1",
"resolved": "https://registry.npmjs.org/typescript/-/typescript-2.6.1.tgz",
"integrity": "sha1-7znN6ierrAtQAkLWcmq5DgyEZjE=",
"dev": true
},
"wrappy": {
"version": "1.0.2",
"resolved": "https://registry.npmjs.org/wrappy/-/wrappy-1.0.2.tgz",
"integrity": "sha1-tSQ9jz7BqjXxNkYFvA0QNuMKtp8=",
"dev": true
}
}
}

View File

@ -3,7 +3,8 @@
"version": "0.0.1",
"description": "BittMapp - A monochrome bitmap editor",
"scripts": {
"build": "tsc"
"build": "tsc",
"lint": "tslint -c tslint.json \"src/**/*.ts\""
},
"author": "Nathan Kunicki <me@nathankunicki.com>",
"license": "MIT",
@ -11,6 +12,7 @@
"node": ">=8.9.1"
},
"devDependencies": {
"tslint": "^5.8.0",
"typescript": "^2.6.1"
}
}

View File

@ -1,9 +1,15 @@
interface BittMappEditorConstructorOptions {
canvas: HTMLCanvasElement,
canvasWidth: number,
canvasHeight: number,
width: number,
height: number
interface IBittMappEditorConstructorOptions {
canvas: HTMLCanvasElement;
canvasWidth: number;
canvasHeight: number;
width: number;
height: number;
}
enum MouseButton {
LEFT = 0,
RIGHT = 2
}
@ -25,12 +31,12 @@ class BittMappEditor {
private _pixelHeight: number = 0;
private _mouseDown: boolean = false;
private _mouseButton: number;
private _mouseButton: MouseButton;
private _data: Uint8Array;
constructor (options: BittMappEditorConstructorOptions) {
constructor (options: IBittMappEditorConstructorOptions) {
options = options || {};
@ -64,10 +70,10 @@ class BittMappEditor {
throw new Error("BittMappEditor must be constructed with a height.");
}
this._context = <CanvasRenderingContext2D> this._canvas.getContext("2d");
this._context = this._canvas.getContext("2d") as CanvasRenderingContext2D;
const deviceRatio: number = window.devicePixelRatio,
backingStoreRatio: number = <number> (this._context as any).backingStorePixelRatio || 1;
const deviceRatio: number = window.devicePixelRatio;
const backingStoreRatio: number = (this._context as any).backingStorePixelRatio as number || 1;
this._scale = deviceRatio / backingStoreRatio;
this._deviceRatio = deviceRatio;
@ -87,7 +93,7 @@ class BittMappEditor {
this._canvas.addEventListener("mousedown", (event) => {
this._mouseDown = true;
this._mouseButton = event.button;
this._mouseButton = event.button as MouseButton;
this._handleMouseEvent(event, this._mouseButton);
});
@ -104,21 +110,21 @@ class BittMappEditor {
}
setPixel (x: number, y: number): void {
const byte: number = ((y * (this._width / 8)) + Math.floor(x / 8)),
mask: number = 1 << (x % 8);
public setPixel (x: number, y: number): void {
const byte: number = ((y * (this._width / 8)) + Math.floor(x / 8));
const mask: number = 1 << (x % 8);
this._data[byte] = this._data[byte] |= mask;
}
unsetPixel (x: number, y: number): void {
const byte: number = ((y * (this._width / 8)) + Math.floor(x / 8)),
mask: number = 1 << (x % 8);
public unsetPixel (x: number, y: number): void {
const byte: number = ((y * (this._width / 8)) + Math.floor(x / 8));
const mask: number = 1 << (x % 8);
this._data[byte] = this._data[byte] &= ~mask;
}
resize (width: number = this._width, height: number = this._height): void {
public resize (width: number = this._width, height: number = this._height): void {
this._data = new Uint8Array((width / 8) * height);
this._pixelWidth = this.canvasWidth / this._width;
this._pixelHeight = this.canvasHeight / this._height;
@ -146,14 +152,14 @@ class BittMappEditor {
}
_handleMouseEvent (event: MouseEvent, button: number): void {
private _handleMouseEvent (event: MouseEvent, button: number): void {
const pixelX: number = Math.floor(event.offsetX / this._pixelWidth),
pixelY: number = Math.floor(event.offsetY / this._pixelHeight);
const pixelX: number = Math.floor(event.offsetX / this._pixelWidth);
const pixelY: number = Math.floor(event.offsetY / this._pixelHeight);
if (button === 0) {
if (button === MouseButton.LEFT) {
this.setPixel(pixelX, pixelY);
} else if (button === 2) {
} else if (button === MouseButton.RIGHT) {
this.unsetPixel(pixelX, pixelY);
}
@ -162,13 +168,13 @@ class BittMappEditor {
}
_redraw (): void {
private _redraw (): void {
this._drawGrid();
this._drawPixels();
}
_drawGrid (): void {
private _drawGrid (): void {
this._context.fillStyle = "#FFFFFF";
this._context.strokeStyle = "#CCCCCC";
@ -209,7 +215,7 @@ class BittMappEditor {
}
_drawPixels (): void {
private _drawPixels (): void {
this._context.fillStyle = "#000000";
this._context.strokeStyle = "#FFFFFFF";
@ -222,7 +228,10 @@ class BittMappEditor {
for (let k: number = 0; k < 8; k++) {
if (byte & 1) {
this._context.fillRect(0.5 + (((j * 8) + k) * this._pixelWidth), 0.5 + (i * this._pixelHeight), this._pixelWidth - 1, this._pixelHeight - 1);
const startX: number = 0.5 + (((j * 8) + k) * this._pixelWidth);
const startY: number = 0.5 + (i * this._pixelHeight);
this._context.fillRect(startX, startY, this._pixelWidth - 1, this._pixelHeight - 1);
}
byte = byte >> 1;

View File

@ -1,11 +1,11 @@
window.onload = function (): void {
window.onload = (): void => {
let editor: BittMappEditor = new BittMappEditor({
canvas: <HTMLCanvasElement> document.getElementById("editor"),
canvasWidth: 640,
const editor: BittMappEditor = new BittMappEditor({
canvas: document.getElementById("editor") as HTMLCanvasElement,
canvasHeight: 640,
width: 32,
height: 32
canvasWidth: 640,
height: 32,
width: 32
});
};

15
tslint.json Normal file
View File

@ -0,0 +1,15 @@
{
"defaultSeverity": "error",
"extends": [
"tslint:recommended"
],
"jsRules": {},
"rules": {
"no-consecutive-blank-lines": false,
"space-before-function-paren": false,
"no-bitwise": false,
"trailing-comma": false,
"variable-name": [true, "ban-keywords", "check-format", "allow-leading-underscore"]
},
"rulesDirectory": []
}