Page MenuHomePhabricator

Colorize lines in blame under DocumentEngine, to show relative age of changes
ClosedPublic

Authored by epriestley on Apr 9 2018, 1:09 PM.
Tags
None
Referenced Files
F15930137: D19314.id46212.diff
Mon, Jun 2, 5:45 AM
F15916183: D19314.id.diff
Sun, Jun 1, 7:51 PM
Unknown Object (File)
Sat, May 31, 6:24 AM
Unknown Object (File)
Apr 29 2025, 5:51 AM
Unknown Object (File)
Apr 26 2025, 9:40 PM
Unknown Object (File)
Apr 23 2025, 9:22 AM
Unknown Object (File)
Apr 6 2025, 1:36 AM
Unknown Object (File)
Apr 5 2025, 11:08 AM
Subscribers

Details

Summary

Depends on D19313. Ref T13105. Fixes T13015. We lost the coloration for ages in the switch to Document Engine.

Restore it, and use a wider range of colors to make the information more clear.

Test Plan

Viewed some blame, saw a nice explosion of bright colors. This is a cornerstone of good design.

Diff Detail

Repository
rP Phabricator
Lint
Lint Not Applicable
Unit
Tests Not Applicable

Event Timeline

This revision was not accepted when it landed; it landed in state Needs Review.Apr 9 2018, 1:10 PM
epriestley requested review of this revision.
This revision was automatically updated to reflect the committed changes.

Its probably completely personal preference but I found the variations of colors a little "in my face".. It didn't seem obvious to my brain which color was old and which was new (normally it was a mixture of green, cyan, oranges and purples!)

I changed the code slightly in my instance to use just a linear scaling of a single color (in this case green), the darker the green the older the commit. (adjusted slightly to keep it away from being bright green)

  var v_min = 0.0;
  var v_max = 1.00;
  var v = v_min + ((v_max - v_min) * epoch_value);
  row.info.style.background = getLinearGreen(v);
}

function getLinearGreen(v) {
  var r, g, b;

  r = Math.round(v*240);
  g = 240;
  b = Math.round(v*240);

  return 'rgb(' + r + ', ' + g + ', ' + b + ')';
}

I'm not a graphic artist and not gifted with artist talents! so feel free to ignore me..

image.png (459×229 px, 32 KB)