synesthesia.js 10 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320
  1. /*
  2. ----------------------------------------------------------
  3. MIDI.Synesthesia : 0.3.1 : 2012-01-06
  4. ----------------------------------------------------------
  5. Peacock: “Instruments to perform color-music: Two centuries of technological experimentation,” Leonardo, 21 (1988), 397-406.
  6. Gerstner: Karl Gerstner, The Forms of Color 1986
  7. Klein: Colour-Music: The art of light, London: Crosby Lockwood and Son, 1927.
  8. Jameson: “Visual music in a visual programming language,” IEEE Symposium on Visual Languages, 1999, 111-118.
  9. Helmholtz: Treatise on Physiological Optics, New York: Dover Books, 1962
  10. Jones: The art of light & color, New York: Van Nostrand Reinhold, 1972
  11. ----------------------------------------------------------
  12. Reference: http://rhythmiclight.com/archives/ideas/colorscales.html
  13. ----------------------------------------------------------
  14. */
  15. if (typeof MIDI === 'undefined') var MIDI = {};
  16. MIDI.Synesthesia = MIDI.Synesthesia || {};
  17. (function(root) {
  18. root.data = {
  19. 'Isaac Newton (1704)': {
  20. format: 'HSL',
  21. ref: 'Gerstner, p.167',
  22. english: ['red',null,'orange',null,'yellow','green',null,'blue',null,'indigo',null,'violet'],
  23. 0: [ 0, 96, 51 ], // C
  24. 1: [ 0, 0, 0 ], // C#
  25. 2: [ 29, 94, 52 ], // D
  26. 3: [ 0, 0, 0 ], // D#
  27. 4: [ 60, 90, 60 ], // E
  28. 5: [ 135, 76, 32 ], // F
  29. 6: [ 0, 0, 0 ], // F#
  30. 7: [ 248, 82, 28 ], // G
  31. 8: [ 0, 0, 0 ], // G#
  32. 9: [ 302, 88, 26 ], // A
  33. 10: [ 0, 0, 0 ], // A#
  34. 11: [ 325, 84, 46 ] // B
  35. },
  36. 'Louis Bertrand Castel (1734)': {
  37. format: 'HSL',
  38. ref: 'Peacock, p.400',
  39. english: ['blue','blue-green','green','olive green','yellow','yellow-orange','orange','red','crimson','violet','agate','indigo'],
  40. 0: [ 248, 82, 28 ],
  41. 1: [ 172, 68, 34 ],
  42. 2: [ 135, 76, 32 ],
  43. 3: [ 79, 59, 36 ],
  44. 4: [ 60, 90, 60 ],
  45. 5: [ 49, 90, 60 ],
  46. 6: [ 29, 94, 52 ],
  47. 7: [ 360, 96, 51 ],
  48. 8: [ 1, 89, 33 ],
  49. 9: [ 325, 84, 46 ],
  50. 10: [ 273, 80, 27 ],
  51. 11: [ 302, 88, 26 ]
  52. },
  53. 'George Field (1816)': {
  54. format: 'HSL',
  55. ref: 'Klein, p.69',
  56. english: ['blue',null,'purple',null,'red','orange',null,'yellow',null,'yellow green',null,'green'],
  57. 0: [ 248, 82, 28 ],
  58. 1: [ 0, 0, 0 ],
  59. 2: [ 302, 88, 26 ],
  60. 3: [ 0, 0, 0 ],
  61. 4: [ 360, 96, 51 ],
  62. 5: [ 29, 94, 52 ],
  63. 6: [ 0, 0, 0 ],
  64. 7: [ 60, 90, 60 ],
  65. 8: [ 0, 0, 0 ],
  66. 9: [ 79, 59, 36 ],
  67. 10: [ 0, 0, 0 ],
  68. 11: [ 135, 76, 32 ]
  69. },
  70. 'D. D. Jameson (1844)': {
  71. format: 'HSL',
  72. ref: 'Jameson, p.12',
  73. english: ['red','red-orange','orange','orange-yellow','yellow','green','green-blue','blue','blue-purple','purple','purple-violet','violet'],
  74. 0: [ 360, 96, 51 ],
  75. 1: [ 14, 91, 51 ],
  76. 2: [ 29, 94, 52 ],
  77. 3: [ 49, 90, 60 ],
  78. 4: [ 60, 90, 60 ],
  79. 5: [ 135, 76, 32 ],
  80. 6: [ 172, 68, 34 ],
  81. 7: [ 248, 82, 28 ],
  82. 8: [ 273, 80, 27 ],
  83. 9: [ 302, 88, 26 ],
  84. 10: [ 313, 78, 37 ],
  85. 11: [ 325, 84, 46 ]
  86. },
  87. 'Theodor Seemann (1881)': {
  88. format: 'HSL',
  89. ref: 'Klein, p.86',
  90. english: ['carmine','scarlet','orange','yellow-orange','yellow','green','green blue','blue','indigo','violet','brown','black'],
  91. 0: [ 0, 58, 26 ],
  92. 1: [ 360, 96, 51 ],
  93. 2: [ 29, 94, 52 ],
  94. 3: [ 49, 90, 60 ],
  95. 4: [ 60, 90, 60 ],
  96. 5: [ 135, 76, 32 ],
  97. 6: [ 172, 68, 34 ],
  98. 7: [ 248, 82, 28 ],
  99. 8: [ 302, 88, 26 ],
  100. 9: [ 325, 84, 46 ],
  101. 10: [ 0, 58, 26 ],
  102. 11: [ 0, 0, 3 ]
  103. },
  104. 'A. Wallace Rimington (1893)': {
  105. format: 'HSL',
  106. ref: 'Peacock, p.402',
  107. english: ['deep red','crimson','orange-crimson','orange','yellow','yellow-green','green','blueish green','blue-green','indigo','deep blue','violet'],
  108. 0: [ 360, 96, 51 ],
  109. 1: [ 1, 89, 33 ],
  110. 2: [ 14, 91, 51 ],
  111. 3: [ 29, 94, 52 ],
  112. 4: [ 60, 90, 60 ],
  113. 5: [ 79, 59, 36 ],
  114. 6: [ 135, 76, 32 ],
  115. 7: [ 163, 62, 40 ],
  116. 8: [ 172, 68, 34 ],
  117. 9: [ 302, 88, 26 ],
  118. 10: [ 248, 82, 28 ],
  119. 11: [ 325, 84, 46 ]
  120. },
  121. 'Bainbridge Bishop (1893)': {
  122. format: 'HSL',
  123. ref: 'Bishop, p.11',
  124. english: ['red','orange-red or scarlet','orange','gold or yellow-orange','yellow or green-gold','yellow-green','green','greenish-blue or aquamarine','blue','indigo or violet-blue','violet','violet-red','red'],
  125. 0: [ 360, 96, 51 ],
  126. 1: [ 1, 89, 33 ],
  127. 2: [ 29, 94, 52 ],
  128. 3: [ 50, 93, 52 ],
  129. 4: [ 60, 90, 60 ],
  130. 5: [ 73, 73, 55 ],
  131. 6: [ 135, 76, 32 ],
  132. 7: [ 163, 62, 40 ],
  133. 8: [ 302, 88, 26 ],
  134. 9: [ 325, 84, 46 ],
  135. 10: [ 343, 79, 47 ],
  136. 11: [ 360, 96, 51 ]
  137. },
  138. 'H. von Helmholtz (1910)': {
  139. format: 'HSL',
  140. ref: 'Helmholtz, p.22',
  141. english: ['yellow','green','greenish blue','cayan-blue','indigo blue','violet','end of red','red','red','red','red orange','orange'],
  142. 0: [ 60, 90, 60 ],
  143. 1: [ 135, 76, 32 ],
  144. 2: [ 172, 68, 34 ],
  145. 3: [ 211, 70, 37 ],
  146. 4: [ 302, 88, 26 ],
  147. 5: [ 325, 84, 46 ],
  148. 6: [ 330, 84, 34 ],
  149. 7: [ 360, 96, 51 ],
  150. 8: [ 10, 91, 43 ],
  151. 9: [ 10, 91, 43 ],
  152. 10: [ 8, 93, 51 ],
  153. 11: [ 28, 89, 50 ]
  154. },
  155. 'Alexander Scriabin (1911)': {
  156. format: 'HSL',
  157. ref: 'Jones, p.104',
  158. english: ['red','violet','yellow','steely with the glint of metal','pearly blue the shimmer of moonshine','dark red','bright blue','rosy orange','purple','green','steely with a glint of metal','pearly blue the shimmer of moonshine'],
  159. 0: [ 360, 96, 51 ],
  160. 1: [ 325, 84, 46 ],
  161. 2: [ 60, 90, 60 ],
  162. 3: [ 245, 21, 43 ],
  163. 4: [ 211, 70, 37 ],
  164. 5: [ 1, 89, 33 ],
  165. 6: [ 248, 82, 28 ],
  166. 7: [ 29, 94, 52 ],
  167. 8: [ 302, 88, 26 ],
  168. 9: [ 135, 76, 32 ],
  169. 10: [ 245, 21, 43 ],
  170. 11: [ 211, 70, 37 ]
  171. },
  172. 'Adrian Bernard Klein (1930)': {
  173. format: 'HSL',
  174. ref: 'Klein, p.209',
  175. english: ['dark red','red','red orange','orange','yellow','yellow green','green','blue-green','blue','blue violet','violet','dark violet'],
  176. 0: [ 0, 91, 40 ],
  177. 1: [ 360, 96, 51 ],
  178. 2: [ 14, 91, 51 ],
  179. 3: [ 29, 94, 52 ],
  180. 4: [ 60, 90, 60 ],
  181. 5: [ 73, 73, 55 ],
  182. 6: [ 135, 76, 32 ],
  183. 7: [ 172, 68, 34 ],
  184. 8: [ 248, 82, 28 ],
  185. 9: [ 292, 70, 31 ],
  186. 10: [ 325, 84, 46 ],
  187. 11: [ 330, 84, 34 ]
  188. },
  189. 'August Aeppli (1940)': {
  190. format: 'HSL',
  191. ref: 'Gerstner, p.169',
  192. english: ['red',null,'orange',null,'yellow',null,'green','blue-green',null,'ultramarine blue','violet','purple'],
  193. 0: [ 0, 96, 51 ],
  194. 1: [ 0, 0, 0 ],
  195. 2: [ 29, 94, 52 ],
  196. 3: [ 0, 0, 0 ],
  197. 4: [ 60, 90, 60 ],
  198. 5: [ 0, 0, 0 ],
  199. 6: [ 135, 76, 32 ],
  200. 7: [ 172, 68, 34 ],
  201. 8: [ 0, 0, 0 ],
  202. 9: [ 211, 70, 37 ],
  203. 10: [ 273, 80, 27 ],
  204. 11: [ 302, 88, 26 ]
  205. },
  206. 'I. J. Belmont (1944)': {
  207. ref: 'Belmont, p.226',
  208. english: ['red','red-orange','orange','yellow-orange','yellow','yellow-green','green','blue-green','blue','blue-violet','violet','red-violet'],
  209. 0: [ 360, 96, 51 ],
  210. 1: [ 14, 91, 51 ],
  211. 2: [ 29, 94, 52 ],
  212. 3: [ 50, 93, 52 ],
  213. 4: [ 60, 90, 60 ],
  214. 5: [ 73, 73, 55 ],
  215. 6: [ 135, 76, 32 ],
  216. 7: [ 172, 68, 34 ],
  217. 8: [ 248, 82, 28 ],
  218. 9: [ 313, 78, 37 ],
  219. 10: [ 325, 84, 46 ],
  220. 11: [ 338, 85, 37 ]
  221. },
  222. 'Steve Zieverink (2004)': {
  223. format: 'HSL',
  224. ref: 'Cincinnati Contemporary Art Center',
  225. english: ['yellow-green','green','blue-green','blue','indigo','violet','ultra violet','infra red','red','orange','yellow-white','yellow'],
  226. 0: [ 73, 73, 55 ],
  227. 1: [ 135, 76, 32 ],
  228. 2: [ 172, 68, 34 ],
  229. 3: [ 248, 82, 28 ],
  230. 4: [ 302, 88, 26 ],
  231. 5: [ 325, 84, 46 ],
  232. 6: [ 326, 79, 24 ],
  233. 7: [ 1, 89, 33 ],
  234. 8: [ 360, 96, 51 ],
  235. 9: [ 29, 94, 52 ],
  236. 10: [ 62, 78, 74 ],
  237. 11: [ 60, 90, 60 ]
  238. },
  239. 'Circle of Fifths (Johnston 2003)': {
  240. format: 'RGB',
  241. ref: 'Joseph Johnston',
  242. english: ['yellow', 'blue', 'orange', 'teal', 'red', 'green', 'purple', 'light orange', 'light blue', 'dark orange', 'dark green', 'violet' ],
  243. 0: [ 255, 255, 0 ],
  244. 1: [ 50, 0, 255 ],
  245. 2: [ 255, 150, 0 ],
  246. 3: [ 0, 210, 180 ],
  247. 4: [ 255, 0, 0 ],
  248. 5: [ 130, 255, 0 ],
  249. 6: [ 150, 0, 200 ],
  250. 7: [ 255, 195, 0 ],
  251. 8: [ 30, 130, 255 ],
  252. 9: [ 255, 100, 0 ],
  253. 10: [ 0, 200, 0 ],
  254. 11: [ 225, 0, 225 ]
  255. },
  256. 'Circle of Fifths (Wheatman 2002)': {
  257. format: 'HEX',
  258. ref: 'Stuart Wheatman', // http://www.valleysfamilychurch.org/
  259. english: [],
  260. data: ['#122400', '#2E002E', '#002914', '#470000', '#002142', '#2E2E00', '#290052', '#003D00', '#520029', '#003D3D', '#522900', '#000080', '#244700', '#570057', '#004D26', '#7A0000', '#003B75', '#4C4D00', '#47008F', '#006100', '#850042', '#005C5C', '#804000', '#0000C7', '#366B00', '#80007F', '#00753B', '#B80000', '#0057AD', '#6B6B00', '#6600CC', '#008A00', '#B8005C', '#007F80', '#B35900', '#2424FF', '#478F00', '#AD00AD', '#00994D', '#F00000', '#0073E6', '#8F8F00', '#8A14FF', '#00AD00', '#EB0075', '#00A3A3', '#E07000', '#6B6BFF', '#5CB800', '#DB00DB', '#00C261', '#FF5757', '#3399FF', '#ADAD00', '#B56BFF', '#00D600', '#FF57AB', '#00C7C7', '#FF9124', '#9999FF', '#6EDB00', '#FF29FF', '#00E070', '#FF9999', '#7ABDFF', '#D1D100', '#D1A3FF', '#00FA00', '#FFA3D1', '#00E5E6', '#FFC285', '#C2C2FF', '#80FF00', '#FFA8FF', '#00E070', '#FFCCCC', '#C2E0FF', '#F0F000', '#EBD6FF', '#ADFFAD', '#FFD6EB', '#8AFFFF', '#FFEBD6', '#EBEBFF', '#E0FFC2', '#FFEBFF', '#E5FFF2', '#FFF5F5'] }
  261. };
  262. root.map = function(type) {
  263. var data = {};
  264. var blend = function(a, b) {
  265. return [ // blend two colors and round results
  266. (a[0] * 0.5 + b[0] * 0.5 + 0.5) >> 0,
  267. (a[1] * 0.5 + b[1] * 0.5 + 0.5) >> 0,
  268. (a[2] * 0.5 + b[2] * 0.5 + 0.5) >> 0
  269. ];
  270. };
  271. ///
  272. var syn = root.data;
  273. var colors = syn[type] || syn['D. D. Jameson (1844)'];
  274. for (var note = 0, pclr, H, S, L; note <= 88; note ++) { // creates mapping for 88 notes
  275. if (colors.data) {
  276. data[note] = {
  277. hsl: colors.data[note],
  278. hex: colors.data[note]
  279. };
  280. } else {
  281. var clr = colors[(note + 9) % 12];
  282. ///
  283. switch(colors.format) {
  284. case 'RGB':
  285. clr = Color.Space(clr, 'RGB>HSL');
  286. H = clr.H >> 0;
  287. S = clr.S >> 0;
  288. L = clr.L >> 0;
  289. break;
  290. case 'HSL':
  291. H = clr[0];
  292. S = clr[1];
  293. L = clr[2];
  294. break;
  295. }
  296. ///
  297. if (H === S && S === L) { // note color is unset
  298. clr = blend(pclr, colors[(note + 10) % 12]);
  299. }
  300. ///
  301. // var amount = L / 10;
  302. // var octave = note / 12 >> 0;
  303. // var octaveLum = L + amount * octave - 3.0 * amount; // map luminance to octave
  304. ///
  305. data[note] = {
  306. hsl: 'hsla(' + H + ',' + S + '%,' + L + '%, 1)',
  307. hex: Color.Space({H: H, S: S, L: L}, 'HSL>RGB>HEX>W3')
  308. };
  309. ///
  310. pclr = clr;
  311. }
  312. }
  313. return data;
  314. };
  315. })(MIDI.Synesthesia);