yolo

dmarman · May 15, 2021 · fbfdcd0 · fbfdcd0
1 parent 6a6aa8b
commit fbfdcd0
Show file tree

Hide file tree

Showing 4 changed files with 19 additions and 15 deletions.
diff --git a/bin/main.js b/bin/main.js
diff --git a/index.html b/index.html
@@ -20,7 +20,7 @@
     <meta property="twitter:description" content="A tool for creating new color shades based on a neural network and trained with the Tailwindcss palette.">
     <meta property="twitter:image" content="https://raw.githubusercontent.com/dmarman/dmarman.github.io/master/bin/tailwind-ink.png">
 
-    <link rel="stylesheet" href="./bin/main.css?v=7">
+    <link rel="stylesheet" href="./bin/main.css?v=8">
     <link rel="shortcut icon" type="image/x-icon" href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAHklEQVQ4T2NkSPn/n4ECwDhqAMNoGDCMhgHDsAgDAPdXJjHWoQYSAAAAAElFTkSuQmCC">
      <!--Global site tag (gtag.js) - Google Analytics-->
     <script async src="https://www.googletagmanager.com/gtag/js?id=UA-179178286-1"></script>
@@ -597,4 +597,4 @@ <h2 class="text-gray-900 text-lg mb-1 mt-3 font-medium title-font title">Feedbac
 </body>
 </html>
 
-<script src="bin/main.js?v=8"></script>
+<script src="bin/main.js?v=9"></script>
diff --git a/src/chartjs-plugin-dragdata/src/index.js b/src/chartjs-plugin-dragdata/src/index.js
@@ -75,7 +75,8 @@ function calcRadar(e, chartInstance) {
   return v
 }
 
-let lasts = [];
+let last = null;
+
 function calcPosition(e, chartInstance, datasetIndex, index, data) {
   let x, y;
   if (e.touches) {
@@ -86,17 +87,14 @@ function calcPosition(e, chartInstance, datasetIndex, index, data) {
     y = chartInstance.scales[scale].getValueForPixel(e.clientY - chartInstance.canvas.getBoundingClientRect().top)
 
     if(e.metaKey || e.altKey || e.ctrlKey){
-      if(lasts[chartInstance.id] === undefined) lasts[chartInstance.id] = [];
-      if(lasts[chartInstance.id][datasetIndex] === undefined) lasts[chartInstance.id][datasetIndex] = [];
-      if(lasts[chartInstance.id][datasetIndex][index] === undefined) lasts[chartInstance.id][datasetIndex][index] = e.clientY;
-
-      if(lasts[chartInstance.id][datasetIndex][index] !== undefined) y = data + (lasts[chartInstance.id][datasetIndex][index] - e.clientY)/15;
+      if(last !== null) {
+        y = data + (last - e.clientY)/50;
+      } else {
+        y = data;
+      }
     }
-    if(lasts[chartInstance.id] === undefined) lasts[chartInstance.id] = [];
-    if(lasts[chartInstance.id][datasetIndex] === undefined) lasts[chartInstance.id][datasetIndex] = [];
-    if(lasts[chartInstance.id][datasetIndex][index] === undefined) lasts[chartInstance.id][datasetIndex][index] = e.clientY;
 
-    lasts[chartInstance.id][datasetIndex][index] = e.clientY;
+    last = e.clientY;
   }
 
   x = roundValue(x, chartInstance.options.dragDataRound)
@@ -176,6 +174,7 @@ function applyMagnet(chartInstance, i, j) {
 
 function dragEndCallback(chartInstance, callback) {
   return () => {
+    last = null;
     curDatasetIndex, curIndex = undefined
     if (typeof callback === 'function' && element) {
       const e = event.sourceEvent

diff --git a/src/main.js b/src/main.js
@@ -239,6 +239,8 @@ options.onDrag = function(e, datasetIndex, index, value) {
   grayOutLines(contrastWhiteCanva, datasetIndex);
 };
 options.scales.yAxes[0].ticks.max = 110;
+options.scales.yAxes[0].ticks.stepSize = 10;
+
 options.title.text = 'Chroma';
 
 let chromaCanva = new Chart('chroma-canva', {
@@ -301,7 +303,8 @@ options.onDrag = function(e, datasetIndex, index, value) {
   grayOutLines(contrastBlackCanva, datasetIndex);
   grayOutLines(contrastWhiteCanva, datasetIndex);
 };
-options.scales.yAxes[0].ticks.max = 400;
+options.scales.yAxes[0].ticks.max = 360;
+options.scales.yAxes[0].ticks.stepSize = 40;
 options.title.text = 'Hue';
 let hueCanva = new Chart('hue-canva', {
   type: 'line',
@@ -353,8 +356,9 @@ let hueCanva = new Chart('hue-canva', {
   options: options
 });
 
-options.scales.yAxes[0].ticks.max = 2.6;
+options.scales.yAxes[0].ticks.max = 2;
 options.scales.yAxes[0].ticks.min = 1;
+options.scales.yAxes[0].ticks.stepSize = 0.1;
 options.title.text = 'Contrast WCAG';
 options.dragData = false;
 options.tooltips.callbacks.label = function(tooltipItem, data) {return tooltipItem.yLabel.toFixed(2);};
@@ -447,6 +451,7 @@ let contrastCanva = new Chart('contrast-canva', {
 
 options.scales.yAxes[0].ticks.max = 20;
 options.scales.yAxes[0].ticks.min = 1;
+options.scales.yAxes[0].ticks.stepSize = 1;
 options.title.text = 'Contrast WCAG over White';
 options.annotation = {
   annotations: [{