initial diagonal work (unfinished)

src/components/chart/LimitBuilder.vue

@@ -1,7 +1,7 @@
 <template>
   <rung-builder :name="prices.length>1?'Ladder':'Limit'" :order="order" :builder="builder"
                 v-model="priceEndpoints" :mode="0" :flip="flipped"
-                 :shape="HLine"
+                :shape="HLine"
                 :get-model-value="getModelValue" :set-model-value="setModelValue"
                 :get-points-value="getPointsValue"
                 :set-values="setPrices" :set-weights="setWeights"
@@ -42,14 +42,13 @@
 </template>
 
 <script setup>
-import {applyLine2, builderDefaults, useChartOrderStore} from "@/orderbuild.js";
+import {allocationText, applyLine, builderDefaults, useChartOrderStore} from "@/orderbuild.js";
 import {sideColor} from "@/misc.js";
-import {useTheme} from "vuetify";
 import {useOrderStore, useStore} from "@/store/store.js";
 import {MAX_FRACTION, newTranche} from "@/blockchain/orderlib.js";
 import RungBuilder from "@/components/chart/RungBuilder.vue";
-import {computed, ref, watchEffect} from "vue";
-import {chart} from "@/charts/chart.js";
+import {computed, ref} from "vue";
+import {chartMeanRange} from "@/charts/chart.js";
 import {HLine} from "@/charts/shape.js";
 
 const s = useStore()
@@ -93,7 +92,7 @@ function buildTranches() {
     })
     const symbol = co.selectedSymbol
     console.log('symbol', symbol)
-    applyLine2(t, !order.buy, p, 0, symbol.decimals, symbol.inverted)
+    applyLine(t, , p, 0, symbol.decimals, symbol.inverted)
     tranches.push(t)
   }
   return tranches
@@ -195,39 +194,8 @@ function setWeights(ws) { weights.value = ws }
 
 const color = computed(()=>props.builder.color ? props.builder.color : defaultColor)
 
-function computeRange() {
-  let range = 0
-  const series = chart.getSeries()
-  const bars = series.data().bars();
-  const final = Math.max(bars.size() - 50, 0)
-  let count = 0
-  for (let barIndex = bars.size() - 1; barIndex >= final; barIndex--) {
-    count++
-    const [_time, _open, high, low, _close, _volume, _ms] = bars.valueAt(barIndex)
-    range += (high - low)
-  }
-  if (count > 0)
-    range /= count
-  else
-    range = 1
-  return range
-}
+const stdWidth = 2*co.meanRange
 
-const stdWidth = 2*computeRange() // todo make reactive
-
-
-const amountSymbol = computed(()=>props.order.amountIsTokenA ? co.selectedSymbol.base.s : co.selectedSymbol.quote.s )
-
-
-// todo move into misc and use in shape as well
-function allocationText(weight) {
-  const alloc = props.builder.allocation
-  if (alloc===null) return ''
-  const w = weight * alloc
-  // console.log('weight', weight, alloc, props.amount)
-  const a = props.order.amount * w
-  return `${(w*100).toFixed(1)}% = ${a.toLocaleString('fullwide')} ${amountSymbol.value}`
-}
 
 function getModelValue(model) {
   if(!model)