https://anotherjesse.com/categories/mouse/Recent content in Mouse on anotherjesse.comHugoen-usMon, 05 Nov 2018 00:00:00 +0000https://anotherjesse.com/sketches/mouse-color-worm/Mon, 05 Nov 2018 00:00:00 +0000https://anotherjesse.com/sketches/mouse-color-worm/<p>The worm grows randomly, but the color is based on the mouse position. By using HSB (Hue, Saturation, Brightness) color space, the user can control the color of the worm by moving the mouse.</p> <div id="demo"></div> <script src="../p5.min.js"></script> <script src="../addons/p5.dom.min.js"></script> <script src="../addons/p5.sound.min.js"></script> <script src="sketch.js"></script> <p>During setup we need to switch to HSB color space with a maximum value of 1.0 for each component:</p> <div class="highlight"><pre tabindex="0" style="background-color:#f7f7f7;-moz-tab-size:4;-o-tab-size:4;tab-size:4;-webkit-text-size-adjust:none;"><code class="language-javascript" data-lang="javascript"><span style="display:flex;"><span> <span style="color:#1f2328">colorMode</span><span style="color:#1f2328">(</span><span style="color:#1f2328">HSB</span><span style="color:#1f2328">,</span> <span style="color:#0550ae">1.0</span><span style="color:#1f2328">);</span> </span></span></code></pre></div><p>Then in the draw function, scale the <code>mouseX</code> and <code>mouseY</code> values to set the color of the worm.</p>