Merge pull request #524 from marcelklehr/master

Dynamic text color (adding dynamic link text color)
ether · Feb 29, 2012 · 6fd73ec · 6fd73ec
2 parents b148a42 + f5f82a7
commit 6fd73ec
Show file tree

Hide file tree

Showing 2 changed files with 38 additions and 7 deletions.
diff --git a/static/js/ace2_inner.js b/static/js/ace2_inner.js
@@ -229,18 +229,34 @@ function Ace2Inner(){
  bgcolor = fadeColor(bgcolor, info.fade);
  }
 
- // Text color
- var txtcolor = (colorutils.luminosity(colorutils.css2triple(bgcolor)) < 0.5) ? '#ffffff' : '#000000';
-
  var authorStyle = dynamicCSS.selectorStyle(getAuthorColorClassSelector(
  getAuthorClassName(author)));
- authorStyle.backgroundColor = bgcolor;
- authorStyle.color = txtcolor;
-
  var authorStyleTop = dynamicCSSTop.selectorStyle(getAuthorColorClassSelector(
  getAuthorClassName(author)));
+ var anchorStyle = dynamicCSS.selectorStyle(getAuthorColorClassSelector(
+ getAuthorClassName(author))+' > a')
+
+ // author color
+ authorStyle.backgroundColor = bgcolor;
  authorStyleTop.backgroundColor = bgcolor;
- authorStyleTop.color = txtcolor;
+
+ // text contrast
+ if(colorutils.luminosity(colorutils.css2triple(bgcolor)) < 0.5)
+ {
+ authorStyle.color = '#ffffff';
+ authorStyleTop.color = '#ffffff';
+ }else{
+ authorStyle.color = null;
+ authorStyleTop.color = null;
+ }
+
+ // anchor text contrast
+ if(colorutils.luminosity(colorutils.css2triple(bgcolor)) < 0.55)
+ {
+ anchorStyle.color = colorutils.triple2css(colorutils.complementary(colorutils.css2triple(bgcolor)));
+ }else{
+ anchorStyle.color = null;
+ }
  }
  }
  }

diff --git a/static/js/colorutils.js b/static/js/colorutils.js
@@ -120,4 +120,19 @@ colorutils.blend = function(c1, c2, t)
  return [colorutils.scale(t, c1[0], c2[0]), colorutils.scale(t, c1[1], c2[1]), colorutils.scale(t, c1[2], c2[2])];
 }
 
+colorutils.invert = function(c)
+{
+ return [1 - c[0], 1 - c[1], 1- c[2]];
+}
+
+colorutils.complementary = function(c)
+{
+ var inv = colorutils.invert(c);
+ return [
+ (inv[0] >= c[0]) ? Math.min(inv[0] * 1.30, 1) : (c[0] * 0.30),
+ (inv[1] >= c[1]) ? Math.min(inv[1] * 1.59, 1) : (c[1] * 0.59),
+ (inv[2] >= c[2]) ? Math.min(inv[2] * 1.11, 1) : (c[2] * 0.11)
+ ];
+}
+
 exports.colorutils = colorutils;