feat: Add demo page back index.html

This commit is contained in:
Lokesh Dhakar
2019-07-14 09:19:41 -07:00
parent ced6b5300d
commit b41cd65747
4 changed files with 80 additions and 14 deletions

View File

@@ -1,12 +1,9 @@
var colorThief = new ColorThief();
var images = [
'black.png',
'red.png',
'rainbow-horizontal.png',
'rainbow-vertical.png',
// 'transparent.png',
// 'white.png',
'image-1.jpg',
'image-2.jpg',
'image-3.jpg',
];
// Render example images
@@ -28,9 +25,11 @@ document.querySelectorAll('.image').forEach((image) => {
// Run Color Thief functions and display results below image.
// We also log execution time of functions for display.
const showColorsForImage = function(image, section) {
// getColor(img)
let start = Date.now();
// 🎨🔓
let result = colorThief.getColor(image);
let elapsedTime = Date.now() - start;
const colorHTML = Mustache.to_html(document.getElementById('color-tpl').innerHTML, {
color: result,
@@ -40,10 +39,13 @@ const showColorsForImage = function(image, section) {
// getPalette(img)
let paletteHTML = '';
let colorCounts = [null, 1, 2, 3, 5, 7, 10, 20];
let colorCounts = [2, 9];
colorCounts.forEach((count) => {
let start = Date.now();
// 🎨🔓
let result = colorThief.getPalette(image, count);
let elapsedTime = Date.now() - start;
paletteHTML += Mustache.to_html(document.getElementById('palette-tpl').innerHTML, {
count,