From d40c7d9f09d9b012837d6060a4c598b23b19646f Mon Sep 17 00:00:00 2001
From: Martin Ashby <martin@martin-laptop.lan>
Date: Thu, 17 May 2018 18:18:11 +0100
Subject: Palette, tools, load & save working

---
 src/Palette.js | 44 ++++++++++++++++++++++++++++++++++++++++++++
 1 file changed, 44 insertions(+)
 create mode 100644 src/Palette.js

(limited to 'src/Palette.js')

diff --git a/src/Palette.js b/src/Palette.js
new file mode 100644
index 0000000..ad0ad46
--- /dev/null
+++ b/src/Palette.js
@@ -0,0 +1,44 @@
+import React, {Component} from 'react'
+import { rgb } from './Utils.js'
+
+const colorPalette = [
+    [0,0,0],
+    [132,0,0],
+    [0,132,0],
+    [132,132,0],
+    [0,0,132],
+    [132,0,132],
+    [0,132,132],
+    [132,132,132],
+    [198,198,198],
+    [255,0,0],
+    [0,255,0],
+    [255,255,0],
+    [0,0,255],
+    [255,0,255],
+    [0,255,255],
+    [255,255,255],
+  ]
+  
+  
+  export default class Palette extends Component {
+    render() {
+      let paletteListItems = colorPalette.map((item) => {
+        var className = "paletteitem"
+        let { r, g, b } = rgb(item)
+        let selected = rgb(this.props.selectedColor)
+        if (r === selected.r && g === selected.g && b === selected.b) {
+          className += " selected"
+        }
+        return <div
+          onClick={() => this.props.onSelectColor([r, g, b])}
+          style={{background: `rgb(${r},${g},${b})`}} 
+          className={className}
+          key={r*10000+g*1000+b}/>
+      })
+      return (
+        <div className="palette">
+          {paletteListItems}
+        </div>)
+    }
+  }
\ No newline at end of file
-- 
cgit v1.2.3-ZIG