From 96d255768aa77b146e40a3855cb85dcb54f4e689 Mon Sep 17 00:00:00 2001
From: Julie Lala <jules@okfoc.us>
Date: Sat, 12 Apr 2014 00:36:56 -0400
Subject: colors

---
 rectangles.html | 51 +++++++++++++++++++++++++++++++++++++++------------
 1 file changed, 39 insertions(+), 12 deletions(-)

(limited to 'rectangles.html')

diff --git a/rectangles.html b/rectangles.html
index 0c054d5..94bca0f 100644
--- a/rectangles.html
+++ b/rectangles.html
@@ -15,6 +15,11 @@ body > div {
 
 <div id="map"></div>
 <div id="info">
+	<select id="palette">
+		<option>colors</option>
+		<option>redblue</option>
+		<option selected>gray</option>
+	</select>
 	<span id="intersects"></span>
 </div>
 
@@ -24,6 +29,40 @@ body > div {
 <script type="text/javascript" src="vec2.js"></script>
 <script type="text/javascript">
 
+(function(){
+	var color_palettes = {
+		redblue: [
+			"rgba(0,0,0,0.2)",
+			"rgba(255,0,0,0.2)",
+			"rgba(0,0,255,0.2)",
+			"rgba(200,200,200,0.2)",
+		],
+		gray: [
+			"rgba(0,0,0,0.1)",
+			"rgba(0,0,0,0.2)",
+			"rgba(0,0,0,0.3)",
+			"rgba(0,0,0,0.4)",
+		],
+		colors: [
+			"rgba(255,0,0,0.5)",
+			"rgba(255,128,0,0.5)",
+			"rgba(128,255,0,0.5)",
+			"rgba(0,255,0,0.5)",
+			"rgba(0,255,128,0.5)",
+			"rgba(0,128,255,0.5)",
+			"rgba(0,0,255,0.5)",
+			"rgba(128,0,255,0.5)",
+			"rgba(255,0,255,0.5)",
+			"rgba(255,0,128,0.5)",
+		]
+	}
+
+	var select = document.querySelector("#palette")
+	select.addEventListener("change", function(){ colors = color_palettes[select.value] })
+
+	window.colors = color_palettes[select.value]
+})()
+
 var canvas = document.createElement("canvas")
 var ctx = canvas.getContext("2d")
 var w = canvas.width = 500
@@ -164,18 +203,6 @@ function solve_rects(){
 
 	document.getElementById("intersects").innerHTML = regions.join("<br>")
 
-	var colors = [
-		"rgba(255,0,0,0.5)",
-		"rgba(255,128,0,0.5)",
-		"rgba(128,255,0,0.5)",
-		"rgba(0,255,0,0.5)",
-		"rgba(0,255,128,0.5)",
-		"rgba(0,128,255,0.5)",
-		"rgba(0,0,255,0.5)",
-		"rgba(128,0,255,0.5)",
-		"rgba(255,0,255,0.5)",
-		"rgba(255,0,128,0.5)",
-	]
 	regions = regions.filter(function(r){ return !!r })
 	for (var i = 0; i < regions.length; i++) {
 		ctx.fillStyle = colors[i % colors.length]
-- 
cgit v1.2.3-70-g09d2