From f6caf64a294c5d6d2a898811326d8cc76cb3e7fc Mon Sep 17 00:00:00 2001
From: Pranab Das <31024886+pranabdas@users.noreply.github.com>
Date: Tue, 14 May 2024 18:01:34 +0800
Subject: [PATCH] SOF-7354: more experiment with colors

---
 src/mixins/atoms.js                           | 22 ++++++++++++++-----
 .../colorsOfAtomsWithLabels.expected.png      |  4 ++--
 .../colorsOfAtomsWithLabels.expected.png      |  4 ++--
 .../colorsOfAtomsWithLabels.expected.png      |  4 ++--
 4 files changed, 23 insertions(+), 11 deletions(-)

diff --git a/src/mixins/atoms.js b/src/mixins/atoms.js
index d51fd9b..bd15287 100644
--- a/src/mixins/atoms.js
+++ b/src/mixins/atoms.js
@@ -97,23 +97,35 @@ export const AtomsMixin = (superclass) =>
                 });
                 sphereMesh.name = `${element}-${atomicIndex}`;
                 sphereMesh.nameWithLabel = `${elementsWithLabelsArray[atomicIndex]}`;
-
                 // set glow according to the labels, currently only single digit
                 // numeric labels are allowed, in practice we expect only two
                 // different labels: 1 and 2 for up and down spin representations
+                const atomColor = this.getAtomColorByElement(element).toLowerCase();
+                const atomHSL = {};
+                new THREE.Color(atomColor).getHSL(atomHSL);
                 const label = parseInt(atomicLabelsArray[atomicIndex], 10) || 0;
                 let hue;
                 if (label !== 0) {
                     if (label % 2 === 0) {
                         // even labels
-                        hue = (label * 0.1) / 2; // [0.1, 0.4]
+                        hue = atomHSL.h + (label * 0.05) / 2;
                     } else {
                         // odd labels
-                        hue = 0.9 - ((label - 1) * 0.1) / 2; // [0.9, 0.5]
+                        hue = atomHSL.h - ((label + 1) * 0.05) / 2;
+                    }
+
+                    // hue is cyclic
+                    while (hue > 1) {
+                        hue -= 1;
                     }
-                    hue = Math.max(0, Math.min(1, hue)); // make sure bounds
+
+                    while (hue < 0) {
+                        hue += 1;
+                    }
+
+                    new THREE.Color(atomColor).setHSL(atomHSL);
                     sphereMesh.material.emissiveIntensity = 0.2;
-                    sphereMesh.material.emissive.setHSL(hue, 0.4, 0.5);
+                    sphereMesh.material.emissive.setHSL(hue, atomHSL.s, atomHSL.l);
                 }
                 atomsGroup.add(sphereMesh);
             });
diff --git a/tests/__tests__/__snapshots__/centos/colorsOfAtomsWithLabels.expected.png b/tests/__tests__/__snapshots__/centos/colorsOfAtomsWithLabels.expected.png
index 8427e56..e9d2210 100644
--- a/tests/__tests__/__snapshots__/centos/colorsOfAtomsWithLabels.expected.png
+++ b/tests/__tests__/__snapshots__/centos/colorsOfAtomsWithLabels.expected.png
@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:93639f05fcda56014ec3d2cce9bf0ac859dfd060cc5d46b83070df15e6bebb98
-size 22317
+oid sha256:e8722c5ab99207742597551ced2ab306947c8592ca0ff06ef7db3fcad26c1ceb
+size 22109
diff --git a/tests/__tests__/__snapshots__/macos/colorsOfAtomsWithLabels.expected.png b/tests/__tests__/__snapshots__/macos/colorsOfAtomsWithLabels.expected.png
index 320773d..87e1437 100644
--- a/tests/__tests__/__snapshots__/macos/colorsOfAtomsWithLabels.expected.png
+++ b/tests/__tests__/__snapshots__/macos/colorsOfAtomsWithLabels.expected.png
@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:07d57dc875bf98a809350829b747ea87bbdfbd7a0a3f676e620d63e9a632676b
-size 22036
+oid sha256:bdd3126f621a802d6a02733ce2afebb674a34ce09b63e72ab0d9f043e2fdf51f
+size 21878
diff --git a/tests/__tests__/__snapshots__/ubuntu/colorsOfAtomsWithLabels.expected.png b/tests/__tests__/__snapshots__/ubuntu/colorsOfAtomsWithLabels.expected.png
index 877a1c3..b123bf5 100644
--- a/tests/__tests__/__snapshots__/ubuntu/colorsOfAtomsWithLabels.expected.png
+++ b/tests/__tests__/__snapshots__/ubuntu/colorsOfAtomsWithLabels.expected.png
@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:7ab4a0e31c90d4e5fe2d0c939e9d0601e755ffc51f4b8a2672a86b97ed9d85a7
-size 22317
+oid sha256:c7d92872b2945a359e2ebff9bc05eab058aa5f4b63c129932561ca02cd7dc781
+size 22109