From 702d29b8d11e91781e09c7617468e190f3531f90 Mon Sep 17 00:00:00 2001
From: Henrique Lorenzi <hlorenzi12@gmail.com>
Date: Sun, 14 Apr 2019 19:22:01 -0300
Subject: [PATCH] start chord toolbox

---
 src/toolbox/toolbox.js | 38 ++++++++++++++++++++++++++++++++++++--
 1 file changed, 36 insertions(+), 2 deletions(-)

diff --git a/src/toolbox/toolbox.js b/src/toolbox/toolbox.js
index 066728a..1944c47 100644
--- a/src/toolbox/toolbox.js
+++ b/src/toolbox/toolbox.js
@@ -1,6 +1,6 @@
 import React from "react"
 import { KeyChange } from "../song/song.js"
-import { Key, scales, getScaleDegreeForPitch, getNameForPitch, getColorForScaleDegree, getColorRotationForScale } from "../util/theory.js"
+import { Key, scales, getScaleDegreeForPitch, getPitchForScaleDegree, getNameForPitch, getColorForScaleDegree, getColorRotationForScale, getChordRecordFromPitches, getRomanNumeralScaleDegreeStr } from "../util/theory.js"
 import { Rational } from "../util/rational.js"
 
 
@@ -27,9 +27,43 @@ function NoteToolbox(props)
 }
 
 
+function ChordToolbox(props)
+{
+	return <div>
+		<span>Key: { props.songKey.getName() }</span>
+		<br/>
+	
+		{ [0, 1, 2, 3, 4, 5, 6].map(degree =>
+			{
+				const rootPitch = getPitchForScaleDegree(props.songKey, degree)
+				const secondPitch = getPitchForScaleDegree(props.songKey, degree + 2)
+				const thirdPitch = getPitchForScaleDegree(props.songKey, degree + 4)
+				const chordKind = getChordRecordFromPitches([0, secondPitch - rootPitch, thirdPitch - rootPitch])
+				const colorRotation = getColorRotationForScale(props.songKey.scalePitches)
+				const color = getColorForScaleDegree(colorRotation + degree)
+				
+				let baseStr = getRomanNumeralScaleDegreeStr(degree, 0)
+				if (chordKind.symbol[0])
+					baseStr = baseStr.toLowerCase()
+				
+				baseStr += chordKind.symbol[1]
+				
+				return <button key={degree} style={{ width:"6em", height:"4em", backgroundColor:"#eee", border:"0", borderTop:"0.5em solid " + color, borderBottom:"0.5em solid " + color, borderRadius:"0.25em", margin:"0.1em" }}>
+					<span style={{ fontWeight:"bold" }}>{ baseStr }<sup>{ chordKind.symbol[2] }</sup></span>					
+				</button>
+			}
+		)}
+	
+	</div>
+}
+
+
 export default function Toolbox(props)
 {
 	const keyChange = props.editor.song.keyChanges.findActiveAt(props.editor.cursorTime.start) || new KeyChange(new Rational(0), new Key(0, 0, scales.major.pitches))
 	
-	return <div style={{ fontFamily:"Verdana", fontSize:"18px" }}><NoteToolbox songKey={ keyChange.key }/></div>
+	return <div style={{ fontFamily:"Verdana", fontSize:"18px" }}>
+		{ props.editor.cursorTrack.start != 1 ? null : <NoteToolbox songKey={ keyChange.key }/> }
+		{ props.editor.cursorTrack.start != 2 ? null : <ChordToolbox songKey={ keyChange.key }/> }
+	</div>
 }
\ No newline at end of file