Ticket #3205: t3205_enlighten_too_dark_chat_colors.patch

File t3205_enlighten_too_dark_chat_colors.patch, 7.8 KB (added by elexis, 9 years ago)

Thanks for uploading a patch with all changes in a single file. Unfortunately this patch can't be applied, since the directory names are different. This patch works for SVN. The only thing I still would change is the red color in the gamesetup chat, it looks too bright in my opinion. Not sure how to fix this without making blue unreadable again and not changing each color individually (maybe thats just the easiest way then?).

  • binaries/data/mods/public/gui/common/color.js

     
     1// Ensure `value` is between 0 and 1.
     2function clampColorValue(value)
     3{
     4    return Math.abs(1 - Math.abs(value - 1));
     5}
     6
     7function rgbToHsl(r, g, b)
     8{
     9    r /= 255;
     10    g /= 255;
     11    b /= 255;
     12    var max = Math.max(r, g, b), min = Math.min(r, g, b);
     13    var h, s, l = (max + min) / 2;
     14
     15    if (max == min)
     16        h = s = 0; // achromatic
     17    else
     18    {
     19        var d = max - min;
     20        s = l > 0.5 ? d / (2 - max - min) : d / (max + min);
     21        switch (max)
     22        {
     23            case r: h = (g - b) / d + (g < b ? 6 : 0); break;
     24            case g: h = (b - r) / d + 2; break;
     25            case b: h = (r - g) / d + 4; break;
     26        }
     27        h /= 6;
     28    }
     29
     30    return [h, s, l];
     31}
     32
     33function hslToRgb(h, s, l)
     34{
     35    function hue2rgb(p, q, t)
     36    {
     37        if (t < 0) t += 1;
     38        if (t > 1) t -= 1;
     39        if (t < 1/6) return p + (q - p) * 6 * t;
     40        if (t < 1/2) return q;
     41        if (t < 2/3) return p + (q - p) * (2/3 - t) * 6;
     42        return p;
     43    }
     44
     45    [h, s, l] = [h, s, l].map(clampColorValue);
     46    var r, g, b;
     47
     48    if (s == 0)
     49        r = g = b = l; // achromatic
     50    else {
     51        var q = l < 0.5 ? l * (1 + s) : l + s - l * s;
     52        var p = 2 * l - q;
     53        r = hue2rgb(p, q, h + 1/3);
     54        g = hue2rgb(p, q, h);
     55        b = hue2rgb(p, q, h - 1/3);
     56    }
     57
     58    return [r, g, b].map(function (n) Math.round(n * 255));
     59}
     60 No newline at end of file
  • binaries/data/mods/public/gui/gamesetup/gamesetup.js

     
    16741674        var mapData = loadMapData(mapName);
    16751675        var mapSettings = (mapData && mapData.settings ? mapData.settings : {});
    16761676        var pData = mapSettings.PlayerData ? mapSettings.PlayerData[player] : {};
    16771677        var pDefs = g_DefaultPlayerData ? g_DefaultPlayerData[player] : {};
    16781678
    1679         color = rgbToGuiColor(getSetting(pData, pDefs, "Color"));
     1679        color = getSetting(pData, pDefs, "Color");
     1680
     1681        // enlighten colors to improve readability
     1682        var [h, s, l] = rgbToHsl(color.r, color.g, color.b);
     1683        var [r, g, b] = hslToRgb(h, s, Math.max(0.7, l));
     1684        color = rgbToGuiColor({"r": r, "g": g, "b": b});
    16801685    }
    16811686
    16821687    var formatted;
    16831688    switch (msg.type)
    16841689    {
  • binaries/data/mods/public/gui/gamesetup/gamesetup.xml

     
    11<?xml version="1.0" encoding="utf-8"?>
    22
    33<objects>
    44
     5    <script file="gui/common/color.js"/>
    56    <script file="gui/common/network.js"/>
    67    <script file="gui/common/functions_civinfo.js"/>
    78    <script file="gui/common/functions_global_object.js"/>
    89    <script file="gui/common/functions_utility.js"/>
    910    <script file="gui/gamesetup/gamesetup.js"/>
  • binaries/data/mods/public/gui/lobby/lobby.js

     
    233233    if (role && caller == "lobbylist")
    234234    {
    235235        // Make the role uppercase.
    236236        role = role.charAt(0).toUpperCase() + role.slice(1);
    237237        if (role == "Moderator")
    238             role = '[color="0 125 0"]' + translate(role) + '[/color]';
     238            role = '[color="0 219 0"]' + translate(role) + '[/color]';
    239239    }
    240240    else
    241241        role = "";
    242242
    243243    Engine.GetGUIObjectByName("usernameText").caption = user;
     
    393393        if(!filterGame(g))
    394394        {
    395395            // 'waiting' games are highlighted in orange, 'running' in red, and 'init' in green.
    396396            let name = escapeText(g.name);
    397397            if (g.state == 'init')
    398                 name = '[color="0 125 0"]' + name + '[/color]';
     398                name = '[color="0 219 0"]' + name + '[/color]';
    399399            else if (g.state == 'waiting')
    400400                name = '[color="255 127 0"]' + name + '[/color]';
    401401            else
    402                 name = '[color="255 0 0"]' + name + '[/color]';
     402                name = '[color="219 0 0"]' + name + '[/color]';
    403403            list_name.push(name);
    404404            list_ip.push(g.ip);
    405405            list_mapName.push(translate(g.niceMapName));
    406406            list_mapSize.push(translatedMapSize(g.mapSize));
    407407            let idx = g_mapTypes.indexOf(g.mapType);
     
    451451    case "away":
    452452        color = "229 76 13";
    453453        status = translate("Away");
    454454        break;
    455455    case "available":
    456         color = "0 125 0";
     456        color = "0 219 0";
    457457        status = translate("Online");
    458458        break;
    459459    case "offline":
    460460        color = "0 0 0";
    461461        status = translate("Offline");
     
    10361036    // First create the color in RGB then HSL, clamp the lightness so it's not too dark to read, and then convert back to RGB to display.
    10371037    // The reason for this roundabout method is this algorithm can generate values from 0 to 255 for RGB but only 0 to 100 for HSL; this gives
    10381038    // us much more variety if we generate in RGB. Unfortunately, enforcing that RGB values are a certain lightness is very difficult, so
    10391039    // we convert to HSL to do the computation. Since our GUI code only displays RGB colors, we have to convert back.
    10401040    var [h, s, l] = rgbToHsl(hash >> 24 & 0xFF, hash >> 16 & 0xFF, hash >> 8 & 0xFF);
    1041     return hslToRgb(h, s, Math.max(0.4, l)).join(" ");
     1041    return hslToRgb(h, s, Math.max(0.7, l)).join(" ");
    10421042}
    10431043
    10441044function repeatString(times, string) {
    10451045    return Array(times + 1).join(string);
    10461046}
     
    10641064function clampColorValue(value)
    10651065{
    10661066    return Math.abs(1 - Math.abs(value - 1));
    10671067}
    10681068
    1069 // See http://stackoverflow.com/questions/2353211/hsl-to-rgb-color-conversion
    1070 function rgbToHsl(r, g, b)
    1071 {
    1072     r /= 255;
    1073     g /= 255;
    1074     b /= 255;
    1075     var max = Math.max(r, g, b), min = Math.min(r, g, b);
    1076     var h, s, l = (max + min) / 2;
    1077 
    1078     if (max == min)
    1079         h = s = 0; // achromatic
    1080     else
    1081     {
    1082         var d = max - min;
    1083         s = l > 0.5 ? d / (2 - max - min) : d / (max + min);
    1084         switch (max)
    1085         {
    1086             case r: h = (g - b) / d + (g < b ? 6 : 0); break;
    1087             case g: h = (b - r) / d + 2; break;
    1088             case b: h = (r - g) / d + 4; break;
    1089         }
    1090         h /= 6;
    1091     }
    1092 
    1093     return [h, s, l];
    1094 }
    1095 
    1096 function hslToRgb(h, s, l)
    1097 {
    1098     function hue2rgb(p, q, t)
    1099     {
    1100         if (t < 0) t += 1;
    1101         if (t > 1) t -= 1;
    1102         if (t < 1/6) return p + (q - p) * 6 * t;
    1103         if (t < 1/2) return q;
    1104         if (t < 2/3) return p + (q - p) * (2/3 - t) * 6;
    1105         return p;
    1106     }
    1107 
    1108     [h, s, l] = [h, s, l].map(clampColorValue);
    1109     var r, g, b;
    1110 
    1111     if (s == 0)
    1112         r = g = b = l; // achromatic
    1113     else {
    1114         var q = l < 0.5 ? l * (1 + s) : l + s - l * s;
    1115         var p = 2 * l - q;
    1116         r = hue2rgb(p, q, h + 1/3);
    1117         g = hue2rgb(p, q, h);
    1118         b = hue2rgb(p, q, h - 1/3);
    1119     }
    1120 
    1121     return [r, g, b].map(function (n) Math.round(n * 255));
    1122 }
    1123 
    11241069(function () {
    11251070function hexToRgb(hex) {
    11261071    return parseInt(hex.slice(0, 2), 16) + "." + parseInt(hex.slice(2, 4), 16) + "." + parseInt(hex.slice(4, 6), 16) + ".";
    11271072}
    11281073function r(times, hex) {
  • binaries/data/mods/public/gui/lobby/lobby.xml

     
    11<?xml version="1.0" encoding="utf-8"?>
    22
    33<objects>
    44    <script file="gui/common/functions_global_object.js"/>
    55    <script file="gui/common/functions_utility.js"/>
     6    <script file="gui/common/color.js"/>
    67    <script file="gui/common/timer.js"/>
    78    <script file="gui/common/music.js"/>
    8 
    99    <script file="gui/lobby/lobby.js"/>
    1010
    1111    <object type="image" style="ModernWindow" size="0 0 100% 100%" name="lobbyWindow">
    1212
    1313        <object style="ModernLabelText" type="text" size="50%-128 0%+4 50%+128 36">