title: Converting string to hexadecimal value in Processing.js (or javascript)
body: <p>I'm trying to make a processing.js sketch change color in response to clicks on html divs.</p>
  
  <p>The idea is that the id of the div will determine the color in the sketch, so I've given each div a hex value as an id.</p>
  
  <p>Here's an example div from my html file:</p>
  
  <pre><code>&lt;div class="swatch" id="008A2E"&gt;&lt;img src="img/green.png"&gt;&lt;/div&gt;
  </code></pre>
  
  <p>I've initialized a global variable 'color' in my javaScript file and added an onclick function 'selectColor(this.id)' to all the color swatch divs.</p>
  
  <pre><code>var color = "FFD119"; 
  
  function selectColor(id) { 
      color = id;
  }
  </code></pre>
  
  <p>This is the javascript function that gets called from within my processing.js file:</p>
  
  <pre><code>function getColor() {
      var hex = parseInt(color, 16);
      return hex;
  }
  </code></pre>
  
  <p>Here's the relevant bit of the Processing.js file:</p>
  
  <pre><code>function setFrameColor() {
      var hex = javascript.getColor();
      frameColor = hex;
  }
  </code></pre>
  
  <p>This function is called in:</p>
  
  <pre><code>void mouseClicked(){
      setFrameColor();
      if(!cycling){
          loop();
          cycling = true;
      } else {
          noLoop();
          cycling = false;
      }
  }
  </code></pre>
  
  <p>It's sort of working except that all I get are shades of grey. I'm obviously not converting the string data from the div ids correctly. Processing's hex() function doesn't help because it returns a string. Is what I'm trying to do even possible? I've also tried sending the div ids directly to the processing sketch (without using parseInt()) but that seems to have no effect.</p>
  
  <p>Thanks.</p>