Calculating Difference Between Hex Colours (or "Hex to Bits to Decimal to Hex")

Converting HTML 'Hex' String to AS Hex Format

function cssToHex (input) {
   var pattern:RegExp=/\#/g;
   input=input.replace(pattern,"0x");
   return input;
}

Converting An Integer to Hex

function d2h( d:int ) : String { 
   var c:Array = [ '0', '1', '2', '3', '4', '5', '6', '7', '8', '9', 'A', 'B', 'C', 'D', 'E', 'F' ];
   if( d > 255 ) d = 255;
   var l:int = d / 16;
   var r:int = d % 16;
   return c[l]+c[r];
}

Bitwise Functions to Average Colours

function diffColors (startColor, endColor, increments, currentIncrement) {
   startColor =  cssToHex (startColor); //converts #123456 format to the 0x123456 hex format used by AS
   endColor = cssToHex (endColor);
   var rDifference = (endColor >> 16 & 0xFF) - (startColor >> 16 & 0xFF); 
   var gDifference = (endColor >> 8 & 0xFF) - (startColor >> 8 & 0xFF);
   var bDifference = (endColor & 0xFF) - (startColor & 0xFF);
   
   var rIncrement = Math.round(rDifference / increments);
   var gIncrement = Math.round(gDifference / increments);
   var bIncrement = Math.round(bDifference / increments);
   
   var currentR = (startColor >> 16 & 0xFF)+(currentIncrement * rIncrement);
   var currentG = (startColor >> 8 & 0xFF)+(currentIncrement * gIncrement);
   var currentB = (startColor & 0xFF)+(currentIncrement * bIncrement);
   
   return ("#" + d2h(currentR) + d2h(currentG) + d2h(currentB)) //spits out an HTML-like #123456 format
}

TAToo sends increments the count of the highest occurring word and currentIncrements is given the count of the word currently being colored. Thus, the highest occurring word becomes the end colour (in TAToo's case, white).

Regular Expression for Splitting Words

/\b([\w]+)([-]?)([\'\w]*)\b/g

Note that Actionscript's of "/w" (word characters) is pretty bad, and does not include accented characters. Therefore, what TAToo uses (and what would be needed in other Actionscript applications) is hardcoding of special characters. Below is an example with é and ç.

/\b([\w|é|ç]+)([-]?)([\'\w|é|ç]*)\b/g

The full list of special characters that TAToo counts as being within words is the following:

à|á|â|ã|ä|å|æ|ç|è|é|ê|ë|ì|í|î|ï|ð|ñ|ò|ó|ô|õ|ö|ø|ù|ú|û|ü|ý|ÿ

Any improvements or suggestions? Email Peter at organisciak@Ignore this text.gmail.com

Regular Expression for Cleaning HTML

   //Note: due to complexity of regular expression it is iteratively broken up and commented below
   var cleaningExpression = "<head\\b[^>]*>(((?!<\/?head).)*)<\/head>" //remove head tag and content
   +"|" +"<(script|style)\\b[^>]*>(((?!<\/?(script|style)).)*)<\/(script|style)>" //remove script/style tags and their content
   +"|" +"<\/?\\w+((\\s+\\w+(\\s*=\\s*(?:\".*?\"|'.*?'|[^'\">\\s]+))?)+\\s*|\\s*)\/?>" //remove any html tags
   +"|" +"(\\<|<)!--\s*.*?\\s*--(\\&gt;|>)" //remove HTML comments
   +"|" +"&(nbsp);";//remove non breaking stops
   var removeTagsExp:RegExp=new RegExp(cleaningExpression,"gis");

TAToo Technical Details

CSS Styling

Defining Stylesheet location in HTML

<param name="fstylesheet" value="style.css" />

Finding Stylesheet location in Actionscript 3

import flash.external.ExternalInterface;

if (ExternalInterface.available) {
   styleSheetLocation = ExternalInterface.call('document.getElementsByName("fstylesheet")[0].value.toString');
}

Loading Stylesheet

if (styleSheetLocation!=null) {
   var cssUrl:URLRequest=new URLRequest(styleSheetLocation);
   var cssLoader:URLLoader = new URLLoader();
   cssLoader.load(cssUrl);
   cssLoader.addEventListener(Event.COMPLETE,cssLoaded);
}

Interpreting CSS Definitions

function cssLoaded(event:Event):void {
   var css:StyleSheet = new StyleSheet();
   css.parseCSS(URLLoader(event.target).data);
   var pattern:RegExp=/\#/g;
   var categoryHeaderCSS:Object=css.getStyle(".TAPORcategoryHeader");
   var str=categoryHeaderCSS.backgroundColor;
   str=str.replace(pattern,"0x");
   var str2=parseInt(str,16);
   catColor=str2;
}

Notes

-- PeterOrganisciak - 23 Sep 2009