intro vid on homepage

src/charts/chart.js

@@ -4,6 +4,7 @@ import {DataFeed, feelessTickerKey, getAllSymbols, lookupSymbol} from "@/charts/
 import {intervalToSeconds, SingletonCoroutine} from "@/misc.js";
 import {useStore} from "@/store/store.js";
 import {tvCustomThemes} from "../../theme.js";
+import {copyPoints} from "@/charts/chart-misc.js";
 
 export let widget = null
 export let chart = null
@@ -310,10 +311,14 @@ function onSelectedLineToolChanged() {
 
 export let dragging = false
 export let draggingShapeIds = []
+let draggingShapeStartPoints = null
+let mouseClickPoint = null
+
 function mouseDown() {
     // console.log('mouseDown')
     // todo push into drawing event queue instead, then set dragging there
     dragging = true
+    mouseClickPoint = {time: crosshairPoint.time, price: crosshairPoint.price}
 }
 
 function mouseUp() {
@@ -340,8 +345,12 @@ function doHandleCrosshairMovement(point) {
         const selection = chart.selection().allSources();
         if (selection.length)
             draggingShapeIds = selection
-        // console.log('dragging selected', draggingShapeIds)
-        for (const shapeId of draggingShapeIds) {
+        console.log('dragging selected', draggingShapeIds)
+        const initStartPoints = draggingShapeStartPoints === null
+        if (initStartPoints)
+            draggingShapeStartPoints = []
+        for (const i in draggingShapeIds) {
+            const shapeId = draggingShapeIds[i]
             let shape
             try {
                 shape = chart.getShapeById(shapeId);
@@ -349,15 +358,33 @@ function doHandleCrosshairMovement(point) {
             catch (e) {
                 continue
             }
-            const points = structuredClone(shape.getPoints());
+            const shapePoints = shape.getPoints();
             const lpbe = shape._model._linePointBeingEdited
-            points[lpbe] = point
+            const points = [];
+            const dt = point.time - mouseClickPoint.time
+            const dp = point.price - mouseClickPoint.price
+            if (initStartPoints)
+                draggingShapeStartPoints.push(copyPoints(shapePoints))
+            for (const j in shapePoints) {
+                if (lpbe!==null)
+                    // if this is the point being dragged, set it to the cursor position. otherwise pass it unchanged.
+                    points.push(j===lpbe ? {time: point.time, price: point.price} : shapePoints[j])
+                else {
+                    // lpbe is null if the user is dragging the entire object (translation,) meaning all points are affected
+                    // todo use the origin of any selected point
+                    const startPoint = draggingShapeStartPoints[i][j];
+                    // push a point that applies the cursor delta to the starting position of the shape
+                    points.push({time: startPoint.time + dt, price: startPoint.price + dp})
+                }
+            }
+            //console.log('lpbe', lpbe)
             // console.log('drag calling onPoints', points, shape, lpbe)
             invokeCallbacks(shapeCallbacks[shapeId], 'onPoints', shapeId, shape, points)
         }
     }
     else if (draggingShapeIds.length > 0) {
         draggingShapeIds = []
+        draggingShapeStartPoints = []
     }
 }