up

Author: Koushikphy

src/css/style.css

@@ -854,14 +854,24 @@ a:focus{
     margin-bottom: 5px;
 }
 
+:root{
+    --selectColor : darkred
+}
 .selected{
-    background-color: #f5f4f4;
+    /* background-color: rgb(238, 252, 238); */
     border-width: 1px;
     border-style: solid;
-    box-shadow: 0 10px 7px 0 rgb(0 0 0 / 20%);
-    background-image: linear-gradient(180deg, #c1c1c1, transparent);
+    /* box-shadow: 0 10px 7px 0 rgb(0 0 0 / 20%); */
+    background-image: linear-gradient(180deg, rgb(250, 233, 236), transparent);
+    color: var(--selectColor);
+}
+.selected select{
+    color: var(--selectColor);
 }
 
+.selected select option{
+    color: var(--selectColor);
+}
 
 
 .colBar{
@@ -899,6 +909,7 @@ a:focus{
     text-align-last: center;
 }
 
+
 .sideBar span{
     min-width: 1.5pc;
     text-align: center;

src/html/index.html

@@ -87,26 +87,27 @@
 
 
     <div id="full" >
-        <div class="borders column" id="container" style="padding-top: 4px;">
+        <div class="borders" id="container" style="padding-top: 4px;">
 
-            <div class="mySelect 3D" >
-                <span id='xLabel'>X</span>
-                <select class="testSelect sWheel" id="xCol" onchange="updateData();this.blur()"></select>
-            </div>
+            <div class="column">
+                <div class="mySelect 3D" >
+                    <span id='xLabel'>X</span>
+                    <select class="testSelect sWheel" id="xCol" onchange="updateData();this.blur()"></select>
+                </div>
 
-            <div class="mySelect">
-                <span id='yLabel'>Y</span>
-                <select class="testSelect sWheel" id="yCol" onchange="updateData();this.blur()"></select>
-            </div>
+                <div class="mySelect">
+                    <span id='yLabel'>Y</span>
+                    <select class="testSelect sWheel" id="yCol" onchange="updateData();this.blur()"></select>
+                </div>
 
-            <div class="mySelect">
-                <span id='zLabel'>Z</span>
-                <select class="testSelect sWheel" id="zCol" onchange="colChanged(this.selectedIndex);this.blur()">
-                </select>
-                <select class="sWheel" id="sCol" onchange="colsChanged(this.selectedIndex);this.blur()"></select>
+                <div class="mySelect">
+                    <span id='zLabel'>Z</span>
+                    <select class="testSelect sWheel" id="zCol" onchange="colChanged(this.selectedIndex);this.blur()">
+                    </select>
+                    <select class="sWheel" id="sCol" onchange="colsChanged(this.selectedIndex);this.blur()"></select>
+                </div>
             </div>
 
-
             <div id="range-div" class='3D' >
                 <input type="range" name="" id="range" min=0 max=100 step=1 value=0 onclick="this.blur()">
                 <span id="thumb"></span>

src/js/functions.js

@@ -442,7 +442,7 @@ function changeEditable(index,reset=false){
         updateOnServer();
         return
     }
-    $(`.scatterlayer .trace:nth-of-type(${currentEditable+1}) .points path`).css({'pointer-events':'none'})
+    $(`.scatterlayer .trace: .points path`).css({'pointer-events':'none'})
 
     let line1 = figurecontainer._fullData[currentEditable].line
     let marker1 = figurecontainer._fullData[currentEditable].marker
@@ -776,7 +776,7 @@ function closeNav() {
 
 
 function tools(option,index,ev){
-    console.log(option,index)
+    ev.stopPropagation()
     if(option==0){ //select editable
         if(currentEditable!=index) changeEditable(index)
     }else if (option==1) { // clone this
@@ -788,8 +788,8 @@ function tools(option,index,ev){
         addTrace()
     }else if(option==2) { // close this
         if(fileNames.length==1) return // nothing to delete here
+        if(index==currentEditable) return
         if(index <=currentEditable) changeEditable2(currentEditable-1) // currentEditable is changed within the function
-
         Plotly.deleteTraces(figurecontainer,index)
         fullData.splice(index,1)
         fullDataCols.splice(index,1)
@@ -798,7 +798,6 @@ function tools(option,index,ev){
         legendNames.splice(index,1)
     }
     makeRows()
-    ev.stopPropagation()
 }
 
 function tools2(option,index,ev,elem){
@@ -817,6 +816,8 @@ function tools2(option,index,ev,elem){
         }
     }else{
         fullDataCols[index][option] = val
+        let colC = fullDataCols[index]
+        legendNames[index] = path.basename(fileNames[index]) + ` ${(swapped? colC.x: colC.y) + 1}:${colC.z + 1}`
         updatePlot(true)
     }
 }