diff --git a/.prettierrc b/.prettierrc new file mode 100644 index 0000000..97da0c9 --- /dev/null +++ b/.prettierrc @@ -0,0 +1,5 @@ +{ + "trailingComma": "es5", + "semi": false, + "singleQuote": true +} diff --git a/package.json b/package.json index 4103e65..fd3ea9c 100644 --- a/package.json +++ b/package.json @@ -17,10 +17,12 @@ "lint-staged": "^8.1.1", "microbundle": "^0.9.0", "npm-run-all": "^4.1.5", + "prettier": "^1.16.4", "static-server": "^2.2.1", "ts-jest": "^23.10.5", "tslib": "^1.9.3", "tslint": "^5.11.0", + "tslint-config-prettier": "^1.17.0", "tslint-config-standard": "^8.0.1" }, "scripts": { @@ -45,6 +47,7 @@ "lint-staged": { "*.{js,ts}": [ "tslint --fix -c tslint.json", + "prettier --write", "git add" ] }, diff --git a/src/helpers.ts b/src/helpers.ts index 28232d3..2df3ccf 100644 --- a/src/helpers.ts +++ b/src/helpers.ts @@ -1,12 +1,14 @@ - -export const getContext = (width, height) => { +const getContext = (width, height) => { const canvas = document.createElement('canvas') canvas.setAttribute('width', width) canvas.setAttribute('height', height) return canvas.getContext('2d') } -export const getImageData = (src: string, scale: number = 1): Promise => { +export function getImageData( + src: string, + scale: number = 1 +): Promise { const img = new Image() src = src || img.src @@ -15,7 +17,7 @@ export const getImageData = (src: string, scale: number = 1): Promise { - img.onload = function () { + img.onload = function() { const width = img.width * scale const height = img.height * scale const context = getContext(width, height) @@ -25,7 +27,8 @@ export const getImageData = (src: string, scale: number = 1): Promise reject(new Error('An error occurred attempting to load image')) + const errorHandler = () => + reject(new Error('An error occurred attempting to load image')) img.onerror = errorHandler img.onabort = errorHandler @@ -33,8 +36,8 @@ export const getImageData = (src: string, scale: number = 1): Promise { - const countMap = {} +export function getCounts(data: Uint8ClampedArray, ignore: string[]): [] { + let countMap = {} for (let i = 0; i < data.length; i += 4 /* 4 gives us r, g, b, and a*/) { let alpha: number = data[i + 3] @@ -46,9 +49,10 @@ export const getCounts = (data: Uint8ClampedArray, ignore: string[]): [] => { // skip undefined data if (rgbComponents.indexOf(undefined) !== -1) continue - let color: string = alpha && alpha !== 255 - ? `rgba(${[...rgbComponents, alpha].join(',')})` - : `rgb(${rgbComponents.join(',')})` + let color: string = + alpha && alpha !== 255 + ? `rgba(${[...rgbComponents, alpha].join(',')})` + : `rgb(${rgbComponents.join(',')})` // skip colors in the ignore list if (ignore.indexOf(color) !== -1) continue diff --git a/src/index.ts b/src/index.ts index 4574bff..44d16f9 100644 --- a/src/index.ts +++ b/src/index.ts @@ -1,7 +1,4 @@ -import { - getImageData, - getCounts -} from './helpers' +import { getImageData, getCounts } from './helpers' interface Opts { ignore?: string[] @@ -11,20 +8,25 @@ interface Opts { const defaultOpts: Opts = { ignore: [], - scale: 1 + scale: 1, } -export default async function (src: string, opts: Opts = defaultOpts): Promise<{ color: string, count: number }[] > { +export default async function( + src: string, + opts: Opts = defaultOpts +): Promise<{ color: string; count: number }[]> { opts = { ...defaultOpts, ...opts } const { ignore, // for example, to ignore white and black: [ 'rgb(0,0,0)', 'rgb(255,255,255)' ] - scale // 0 = best performance, lowest fidelity - // 1 = best fidelity, worst performance + scale, // 0 = best performance, lowest fidelity + // 1 = best fidelity, worst performance } = opts if (scale > 1 || scale <= 0) { - console.warn(`You set scale to ${scale}, which isn't between 0-1. This is either pointless (> 1) or a no-op (≤ 0)`) + console.warn( + `You set scale to ${scale}, which isn't between 0-1. This is either pointless (> 1) or a no-op (≤ 0)` + ) } const data = await getImageData(src, scale) diff --git a/tests/global-setup.ts b/tests/global-setup.ts index 82406c0..c5896f8 100644 --- a/tests/global-setup.ts +++ b/tests/global-setup.ts @@ -1,9 +1,9 @@ const { setup: setupDevServer } = require('jest-dev-server') -module.exports = async function globalSetup () { +module.exports = async function globalSetup() { await setupDevServer({ command: `static-server ./tests/images --debug`, launchTimeout: 50000, - port: 9080 + port: 9080, }) } diff --git a/tests/global-teardown.ts b/tests/global-teardown.ts index 6c7e469..ea7ac6c 100644 --- a/tests/global-teardown.ts +++ b/tests/global-teardown.ts @@ -1,5 +1,5 @@ const { teardown: teardownDevServer } = require('jest-dev-server') -module.exports = async function globalTeardown () { +module.exports = async function globalTeardown() { await teardownDevServer() } diff --git a/tests/index.test.ts b/tests/index.test.ts index 4177fa4..2d83d47 100644 --- a/tests/index.test.ts +++ b/tests/index.test.ts @@ -3,16 +3,17 @@ import analyze from '../src/index' const green = 'rgb(126,211,33)' const red = 'rgb(255,0,0)' - it('tests error with images', () => { const img = '' - expect.assertions(1); - return expect(analyze(img)).rejects.toEqual(new Error('An error occurred attempting to load image')); -}); - + expect.assertions(1) + return expect(analyze(img)).rejects.toEqual( + new Error('An error occurred attempting to load image') + ) +}) it('gets colors for base64 encoded images', async () => { - const img = 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB4AAAAeCAYAAAA7MK6iAAAAAXNSR0IArs4c6QAAAGhJREFUSA3t0rENgCAABVFxEwdgRRNmZABGEWsoPsWVZ6f5OZMH5e3Pdy1Pq2P5wr/efPKs6I/PnIBV+W/WdrmAbkx4xpGIGkhNScaO1JGIGkhNScaO1JGIGkhNScaO1JGIGkhNScbOBKiIBjchGZzYAAAAAElFTkSuQmCC' + const img = + 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB4AAAAeCAYAAAA7MK6iAAAAAXNSR0IArs4c6QAAAGhJREFUSA3t0rENgCAABVFxEwdgRRNmZABGEWsoPsWVZ6f5OZMH5e3Pdy1Pq2P5wr/efPKs6I/PnIBV+W/WdrmAbkx4xpGIGkhNScaO1JGIGkhNScaO1JGIGkhNScaO1JGIGkhNScbOBKiIBjchGZzYAAAAAElFTkSuQmCC' const result = await analyze(img) expect(result[0].count).toEqual(875) @@ -35,7 +36,7 @@ it('gets colors for images with a source', async () => { it('ignores a given color for images with a source', async () => { const img = 'http://localhost:9080/dominant-red-secondary-green.png' - const ignoreColors = [ 'rgb(255,0,0)'] + const ignoreColors = ['rgb(255,0,0)'] const result = await analyze(img, { ignore: ignoreColors }) expect(result[0].count).toEqual(25) @@ -68,7 +69,8 @@ it('works with jpgs', async () => { }) it('gets colors for images with semi transparency', async () => { - const img = 'http://localhost:9080/dominant-red-secondary-green-transparent.png' + const img = + 'http://localhost:9080/dominant-red-secondary-green-transparent.png' const result = await analyze(img) expect(result[0].count).toEqual(875) @@ -79,7 +81,8 @@ it('gets colors for images with semi transparency', async () => { }) it('skips fully transparent pixels', async () => { - const img = 'http://localhost:9080/dominant-red-secondary-green-mostly-transparent.png' + const img = + 'http://localhost:9080/dominant-red-secondary-green-mostly-transparent.png' const result = await analyze(img) expect(result[0].count).toEqual(4) diff --git a/tslint.json b/tslint.json index ea56093..216f449 100644 --- a/tslint.json +++ b/tslint.json @@ -1,7 +1,8 @@ { "defaultSeverity": "error", "extends": [ - "tslint-config-standard" + "tslint-config-standard", + "tslint-config-prettier" ], "jsRules": {}, "rules": {},