Skip to content

Commit e240bb4

Browse files
committed
Improvements on dark theme. Dynamic label font color depending on lable color. + Dark mode activated
1 parent 1341888 commit e240bb4

File tree

8 files changed

+55
-21
lines changed

8 files changed

+55
-21
lines changed

source/src/main/java/org/cerberus/core/crud/entity/Label.java

Lines changed: 33 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -19,6 +19,7 @@
1919
*/
2020
package org.cerberus.core.crud.entity;
2121

22+
import java.awt.Color;
2223
import lombok.EqualsAndHashCode;
2324
import lombok.Getter;
2425
import lombok.Setter;
@@ -44,6 +45,7 @@ public class Label {
4445
private String label;
4546
private String type;
4647
private String color;
48+
private String fontColor;
4749
private Integer parentLabelID;
4850
private String requirementType;
4951
private String requirementStatus;
@@ -80,6 +82,7 @@ public JSONObject toJson() {
8082
labelJson.put("label", this.getLabel());
8183
labelJson.put("type", this.getType());
8284
labelJson.put("color", this.getColor());
85+
labelJson.put("fontColor", this.guessFontColor());
8386
labelJson.put("parentLabelID", this.getParentLabelID());
8487
labelJson.put("requirementType", this.getRequirementType());
8588
labelJson.put("requirementStatus", this.getRequirementStatus());
@@ -106,6 +109,7 @@ public JSONObject toJsonV001() {
106109
labelJson.put("label", this.getLabel());
107110
labelJson.put("type", this.getType());
108111
labelJson.put("color", this.getColor());
112+
labelJson.put("fontColor", this.guessFontColor());
109113
labelJson.put("parentLabelID", this.getParentLabelID());
110114
labelJson.put("requirementType", this.getRequirementType());
111115
labelJson.put("requirementStatus", this.getRequirementStatus());
@@ -129,9 +133,38 @@ public JSONObject toJsonGUI() {
129133
result.put("label", this.getLabel());
130134
result.put("type", this.getType());
131135
result.put("color", this.getColor());
136+
result.put("fontColor", this.guessFontColor());
132137
} catch (JSONException ex) {
133138
LOG.error(ex.toString(), ex);
134139
}
135140
return result;
136141
}
142+
143+
public String guessFontColor() {
144+
return (this.isColorDark(this.getColor()) ? "white" : "black");
145+
}
146+
147+
public boolean isColorDark(String hexaCodeColor) {
148+
149+
try {
150+
// remove hash character from string
151+
String rawFontColor = hexaCodeColor.substring(1, hexaCodeColor.length());
152+
153+
// convert hex string to int
154+
int rgb = Integer.parseInt(rawFontColor, 16);
155+
156+
Color c = new Color(rgb);
157+
158+
float[] hsb = Color.RGBtoHSB(c.getRed(), c.getGreen(), c.getBlue(), null);
159+
160+
float brightness = hsb[2];
161+
162+
LOG.debug("is the Color Dark ? " + hexaCodeColor + " : " + (brightness < 0.5));
163+
return (brightness < 0.5);
164+
} catch (Exception e) {
165+
LOG.warn("Could not guess is color " + hexaCodeColor + "is Dark.", e);
166+
}
167+
return true;
168+
}
169+
137170
}

source/src/main/java/org/cerberus/core/servlet/crud/transversaltables/ReadLabel.java

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -328,7 +328,9 @@ private JSONArray getTree(List<String> system, String type, ApplicationContext a
328328
text += " <span class='glyphicon glyphicon-list'></span></button>";
329329
}
330330

331-
text += "<span class='label label-primary' style='background-color:" + label.getColor() + ";color:white;' data-toggle='tooltip' data-labelid='" + label.getId() + "' title='' data-original-title=''>" + label.getLabel() + "</span>";
331+
text += "<span class='label label-primary' style='background-color:" + label.getColor() + ";color:"
332+
+ label.guessFontColor()
333+
+ ";' data-toggle='tooltip' data-labelid='" + label.getId() + "' title='' data-original-title=''>" + label.getLabel() + "</span>";
332334
text += "<span style='margin-left: 5px; margin-right: 5px;' class=''>" + label.getDescription() + "</span>";
333335

334336
text += "%COUNTER1TEXT%";
@@ -424,6 +426,7 @@ private JSONObject convertLabelToJSONObject(Label label) throws JSONException {
424426
JSONObject display = new JSONObject();
425427
display.put("label", label.getLabel());
426428
display.put("color", label.getColor());
429+
display.put("fontColor", label.guessFontColor());
427430
result.put("display", display);
428431
return result;
429432
}

source/src/main/webapp/TestCaseScript.jsp

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -138,7 +138,7 @@
138138
</div>
139139
<div id="tcButton">
140140
<!--<h4>Actions</h4>-->
141-
<button class="btn btn-block btnLightTurquoise marginTop25" id="addStep" disabled>Add Step</button>
141+
<button class="btn btn-block btnLightTurquoise marginTop25 marginBottom20" id="addStep" disabled>Add Step</button>
142142
<!-- <button class="btn btn-info btn-block marginTop25" id="duplicateStep" disabled>Duplicate Step</button>-->
143143
</div>
144144
</div>

source/src/main/webapp/css/pages/TestCaseExecution.css

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -21,7 +21,9 @@
2121
Author : cerberus
2222
*/
2323

24-
24+
a.list-group-item, button.list-group-item{
25+
color: inherit;
26+
}
2527
#NavtabsScriptEdit {
2628
height: 40px;
2729
}

source/src/main/webapp/js/global/header.js

Lines changed: 8 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -301,19 +301,15 @@ function displayHeaderLabel(doc) {
301301
$("#menuAccount").attr("style", "display: block;");
302302
}
303303

304-
if ((window.location.hostname.includes('localhost'))
305-
|| (window.location.hostname.includes('qa.cerberus-testing.com'))
306-
) {
307-
$('#darkModeEntry').show();
308-
darkMode = getFromStorage("#menuDarkMode", 'false');
304+
305+
$('#darkModeEntry').show();
306+
darkMode = getFromStorage("#menuDarkMode", 'false');
307+
refreshToggleDarkMode('#menuDarkMode', darkMode);
308+
$('#menuDarkMode').click(function () {
309+
darkMode = (darkMode === 'true') ? 'false' : 'true';
309310
refreshToggleDarkMode('#menuDarkMode', darkMode);
310-
$('#menuDarkMode').click(function () {
311-
darkMode = (darkMode === 'true') ? 'false' : 'true';
312-
refreshToggleDarkMode('#menuDarkMode', darkMode);
313-
});
314-
} else {
315-
$('#darkModeEntry').hide();
316-
}
311+
});
312+
317313

318314
if (user.menu.logoutLink === "") {
319315
$("#menuLogout").attr("style", "display: none;");

source/src/main/webapp/js/pages/Label.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -556,7 +556,7 @@ function aoColumnsFunc(tableId) {
556556
"bSortable": false,
557557
"bSearchable": false,
558558
"render": function (data, type, full, meta) {
559-
return '<span class="label label-primary" style="background-color:' + data.color + '">' + data.label + '</span> ';
559+
return '<span class="label label-primary" style="background-color:' + data.color + ';color:' + data.fontColor + '">' + data.label + '</span> ';
560560
}
561561
},
562562
{"sName": "parentLabelid",

source/src/main/webapp/js/pages/TestCaseExecution.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2680,7 +2680,7 @@ Action.prototype.draw = function (idMotherStep, id) {
26802680

26812681
// STATUS & BUTTON
26822682
var status = $("<div class='status'></div>").addClass("col-sm-1");
2683-
var elapsedTime = $("<span>").attr("style", "font-size:0.9em;margin:0px;line-height:1;height:0.9em;overflow:hidden;word-wrap: break-word;text-overflow: ellipsis;");
2683+
var elapsedTime = $("<span>").attr("style", "font-size:0.9em;margin:0px;line-height:1;height:0.9em;overflow:hidden;text-overflow: ellipsis;");
26842684
/**
26852685
* If returnCode is NE, display button, else display status & elapsed time
26862686
*/

source/src/main/webapp/js/pages/TestCaseList.js

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -957,7 +957,7 @@ function aoColumnsFunc(countries, tableId) {
957957
"render": function (data, type, full, meta) {
958958
var labelValue = '';
959959
$.each(data, function (i, e) {
960-
labelValue += '<div style="float:left"><span class="label label-primary" onclick="filterOnLabel(this)" style="cursor:pointer;background-color:' + e.color + '" data-toggle="tooltip" title="' + e.description + '">' + e.label + '</span></div> ';
960+
labelValue += '<div style="float:left"><span class="label label-primary" onclick="filterOnLabel(this)" style="cursor:pointer;background-color:' + e.color + ';color:' + e.fontColor + '" data-toggle="tooltip" title="' + e.description + '">' + e.label + '</span></div> ';
961961
});
962962
return labelValue;
963963
}
@@ -973,7 +973,7 @@ function aoColumnsFunc(countries, tableId) {
973973
var labelValue = '';
974974
$.each(data, function (i, e) {
975975
if (e.type === "STICKER") {
976-
labelValue += '<div style="float:left"><span class="label label-primary" onclick="filterOnLabel(this)" style="cursor:pointer;background-color:' + e.color + '" data-toggle="tooltip" title="' + e.description + '">' + e.label + '</span></div> ';
976+
labelValue += '<div style="float:left"><span class="label label-primary" onclick="filterOnLabel(this)" style="cursor:pointer;background-color:' + e.color + ';color:' + e.fontColor + '" data-toggle="tooltip" title="' + e.description + '">' + e.label + '</span></div> ';
977977
}
978978
});
979979
return labelValue;
@@ -991,7 +991,7 @@ function aoColumnsFunc(countries, tableId) {
991991
var labelValue = '';
992992
$.each(data, function (i, e) {
993993
if (e.type === "REQUIREMENT") {
994-
labelValue += '<div style="float:left"><span class="label label-primary" onclick="filterOnLabel(this)" style="cursor:pointer;background-color:' + e.color + '" data-toggle="tooltip" title="' + e.description + '">' + e.label + '</span></div> ';
994+
labelValue += '<div style="float:left"><span class="label label-primary" onclick="filterOnLabel(this)" style="cursor:pointer;background-color:' + e.color + ';color:' + e.fontColor + '" data-toggle="tooltip" title="' + e.description + '">' + e.label + '</span></div> ';
995995
}
996996
});
997997
return labelValue;
@@ -1009,7 +1009,7 @@ function aoColumnsFunc(countries, tableId) {
10091009
var labelValue = '';
10101010
$.each(data, function (i, e) {
10111011
if (e.type === "BATTERY") {
1012-
labelValue += '<div style="float:left"><span class="label label-primary" onclick="filterOnLabel(this)" style="cursor:pointer;background-color:' + e.color + '" data-toggle="tooltip" title="' + e.description + '">' + e.label + '</span></div> ';
1012+
labelValue += '<div style="float:left"><span class="label label-primary" onclick="filterOnLabel(this)" style="cursor:pointer;background-color:' + e.color + ';color:' + e.fontColor + '" data-toggle="tooltip" title="' + e.description + '">' + e.label + '</span></div> ';
10131013
}
10141014
});
10151015
return labelValue;

0 commit comments

Comments
 (0)