Merge pull request #165 from lokesh/dist-folder-cleanup

build: `/dist` folder cleanup

README.md

@@ -8,15 +8,14 @@ A script for grabbing the color palette from an image. Uses Javascript and the c
 
 ### Import
 
-- `/dist/color-thief.umd.js`: UMD module. For simple script tag loading that exposes a global variable or for RequireJS AMD support.
+- `/dist/color-thief.js`: CommonJS module for use in Node.
-- `/dist/color-thief.js`: CommonJS module. Entry point for Node.js and Browserify.
+- `/dist/color-thief.mjs`: ES6 module for use in Browser. For modern browsers as well as Webpack and Rollup.
-- `/dist/color-thief.mjs`: ES6 module. For modern browsers as well as Webpack and Rollup.
+- `/dist/color-thief.umd.js`: UMD module for use in Browser. For simple script tag loading that exposes a global variable or for RequireJS AMD support. _color-thief.min.js_ is a duplicate of this file, kept around to maintain backwards compatibility.
-- `/dist/color-thief.min.js`: Duplicate of `/dist/color-thief.umd.js`. Kept around to maintain backwards compatibility.
 
 ### Get the dominant color from an image
 
 ```js
-var colorThief = new ColorThief();
+const colorThief = new ColorThief();
 colorThief.getColor(sourceImage);
 ```
 
@@ -25,7 +24,7 @@ colorThief.getColor(sourceImage);
 In this example, we build an 8 color palette.
 
 ```js
-var colorThief = new ColorThief();
+const colorThief = new ColorThief();
 colorThief.getPalette(sourceImage, 8);
 ```
 

build/build.js

@@ -26,7 +26,7 @@ fs.copyFile(umdPath, legacyPath, (err) => {
 });
 
 const srcNodeRelPath = 'src/color-thief-node.js';
-const distNodeRelPath = 'dist/color-thief-node.js';
+const distNodeRelPath = 'dist/color-thief.js';
 const srcNodePath = resolve(process.cwd(), srcNodeRelPath);
 const distNodePath = resolve(process.cwd(), distNodeRelPath);
 

dist/color-thief-node.js

@@ -1,101 +0,0 @@
-const getPixels = require('get-pixels');
-const quantize = require('quantize');
-
-function createPixelArray(imgData, pixelCount, quality) {
-    const pixels = imgData;
-    const pixelArray = [];
-
-    for (let i = 0, offset, r, g, b, a; i < pixelCount; i = i + quality) {
-        offset = i * 4;
-        r = pixels[offset + 0];
-        g = pixels[offset + 1];
-        b = pixels[offset + 2];
-        a = pixels[offset + 3];
-
-        // If pixel is mostly opaque and not white
-        if (typeof a === 'undefined' || a >= 125) {
-            if (!(r > 250 && g > 250 && b > 250)) {
-                pixelArray.push([r, g, b]);
-            }
-        }
-    }
-    return pixelArray;
-}
-
-function validateOptions(options) {
-    let { colorCount, quality } = options;
-
-    if (typeof colorCount === 'undefined' || !Number.isInteger(colorCount)) {
-        colorCount = 10;
-    } else if (colorCount === 1 ) {
-        throw new Error('colorCount should be between 2 and 20. To get one color, call getColor() instead of getPalette()');
-    } else {
-        colorCount = Math.max(colorCount, 2);
-        colorCount = Math.min(colorCount, 20);
-    }
-
-    if (typeof quality === 'undefined' || Number.isInteger(quality)) {
-        quality = 10;
-    } else if (quality < 1) {
-        quality = 10;
-    }
-
-    return {
-        colorCount,
-        quality
-    }
-}
-
-function loadImg(img) {
-    return new Promise((resolve, reject) => {
-        getPixels(img, function(err, data) {
-            if(err) {
-                reject(err)
-            } else {
-                resolve(data);
-            }
-        })
-    });
-}
-
-function getColor(img, quality) {
-    return new Promise((resolve, reject) => {
-        getPalette(img, 5, quality)
-            .then(palette => {
-                resolve(palette[0]);
-            })
-            .catch(err => {
-                reject(err);
-            })
-    });
-
-}
-
-function getPalette(img, colorCount = 10, quality = 10) {
-    const options = validateOptions({
-        colorCount,
-        quality
-    });
-
-    return new Promise((resolve, reject) => {
-        loadImg(img)
-            .then(imgData => {
-                const pixelCount = imgData.shape[0] * imgData.shape[1];
-                const pixelArray = createPixelArray(imgData.data, pixelCount, options.quality);
-
-                const cmap = quantize(pixelArray, options.colorCount);
-                const palette = cmap? cmap.palette() : null;
-
-                resolve(palette);
-            })
-            .catch(err => {
-                reject(err);
-            })
-    });
-}
-
-module.exports = {
-    getColor,
-    getPalette
-};
-

node.js

@@ -1,12 +0,0 @@
-const { resolve } = require('path');
-const ColorThief = require(resolve(process.cwd(), "src/color-thief-node.js"));
-
-const img = resolve(process.cwd(), 'cypress/test-pages/img/rainbow-vertical.png');
-
-ColorThief.getColor(img)
-    .then(color => { console.log(color) })
-    .catch(err => { console.log(err) })
-
-ColorThief.getPalette(img)
-    .then(palette => { console.log(palette) })
-    .catch(err => { console.log(err) })

package.json

@@ -28,8 +28,8 @@
     "umd:main": "dist/color-thief.umd.js",
     "amdName": "ColorThief",
     "scripts": {
-        "build": "microbundle; node ./build/build.js",
+        "build": "microbundle --no-sourcemap; node ./build/build.js",
-        "watch": "microbundle watch",
+        "watch": "microbundle watch --no-sourcemap",
         "dev": " ./node_modules/http-server/bin/http-server",
         "test": "mocha; ./node_modules/.bin/cypress run --config video=false",
         "test:browser": "./node_modules/.bin/cypress open",

test/node-test.js

@@ -1,5 +1,5 @@
 const { resolve } = require('path');
-const ColorThief = require(resolve(process.cwd(), "dist/color-thief-node.js"));
+const ColorThief = require(resolve(process.cwd(), "dist/color-thief.js"));
 const img = resolve(process.cwd(), 'cypress/test-pages/img/rainbow-vertical.png');
 const chai = require("chai");
 const expect = chai.expect;