post-order line draw improvements

src/components/LimitPrice.vue

@@ -17,12 +17,12 @@
 
 <script setup>
 import {useOrderStore, useStore} from "@/store/store";
-import {routeInverted} from "@/misc.js";
 import RoutePrice from "@/components/RoutePrice.vue";
 import {validateAmount, validateRequired} from "@/validate.js";
 import {computed} from "vue";
 // noinspection ES6UnusedImports
 import {vAutoSelect} from "@/misc.js";
+import {routeInverted} from "@/misc.js";
 
 const os = useOrderStore()
 const props = defineProps({

src/components/Order.vue

@@ -23,11 +23,10 @@ import {useOrderStore, useStore} from "@/store/store";
 import PhoneCard from "@/components/PhoneCard.vue";
 import Amount from "@/components/Amount.vue"
 // noinspection ES6UnusedImports
-import {nav, routeInverted, SingletonCoroutine, vAutoSelect} from "@/misc.js";
+import {nav, SingletonCoroutine, vAutoSelect} from "@/misc.js";
 import {newOrder} from "@/blockchain/orderlib.js";
 import {FixedNumber} from "ethers";
 import {pendOrder} from "@/blockchain/wallet.js";
-import router from "@/router/index.js";
 import PairChoice from "@/components/PairChoice.vue";
 import NeedsSigner from "@/components/NeedsSigner.vue";
 import {useChartOrderStore} from "@/orderbuild.js";

src/components/PairChoice.vue

@@ -33,10 +33,9 @@
 import TokenChoice from "@/components/TokenChoice.vue"
 import {useOrderStore, useStore} from "@/store/store";
 import RoutePrice from "@/components/RoutePrice.vue";
-import {findRoute, routeFinder} from "@/blockchain/route.js";
-import {SingletonCoroutine, routeInverted} from "@/misc.js";
-import {computed, ref} from "vue";
-import {queryHelperContract} from "@/blockchain/contract.js";
+import {routeFinder} from "@/blockchain/route.js";
+import {computed} from "vue";
+import {routeInverted} from "@/misc.js";
 
 const s = useStore()
 const os = useOrderStore()

src/components/RoutePrice.vue

@@ -7,8 +7,8 @@ import {useOrderStore, useStore} from "@/store/store";
 import {subPrices, unsubPrices, WIDE_PRICE_FORMAT} from "@/blockchain/prices.js";
 import {computed, onBeforeUnmount} from "vue";
 import {FixedNumber} from "ethers";
-import {routeInverted} from "@/misc.js";
 import {subOHLCs} from "@/blockchain/ohlcs.js";
+import {routeInverted} from "@/misc.js";
 
 const s = useStore()
 const os = useOrderStore()

src/components/SplitPane.vue

@@ -142,5 +142,6 @@ body {
   flex: 1;
   width: 100%;
   min-height: 5em;
+  max-height: 100%;
 }
 </style>

src/components/Status.vue

@@ -177,7 +177,6 @@ import {useStore} from "@/store/store";
 import {computed, defineAsyncComponent, onUnmounted, ref, watch} from "vue";
 import Btn from "@/components/Btn.vue"
 import {cancelOrder, PendingOrderState, useWalletStore} from "@/blockchain/wallet.js";
-import {timestampString} from "@/misc.js";
 import {DISTANT_FUTURE, isOpen, OrderState} from "@/blockchain/orderlib.js";
 import Pulse from "@/components/Pulse.vue";
 import {OrderShapes} from "@/charts/ordershapes.js";
@@ -185,6 +184,7 @@ import {useChartOrderStore} from "@/orderbuild.js";
 import {lookupSymbol, tickerForOrder} from "@/charts/datafeed.js";
 import {setSymbol} from "@/charts/chart.js";
 import {uniswapV3AveragePrice} from "@/blockchain/uniswap.js";
+import {timestampString} from "@/misc.js";
 
 const PairPrice = defineAsyncComponent(()=>import("@/components/PairPrice.vue"))
 const TokenAmount = defineAsyncComponent(()=>import('./TokenAmount.vue'))

src/components/TimedOrder.vue

@@ -7,10 +7,10 @@
 
 <script setup>
 // noinspection ES6UnusedImports
-import {routeInverted, SingletonCoroutine, vAutoSelect} from "@/misc.js";
+import {SingletonCoroutine, vAutoSelect} from "@/misc.js";
 import Order from "@/components/Order.vue";
 import LimitPrice from "@/components/LimitPrice.vue";
-import {timesliceTranches, applyLimitOld} from "@/orderbuild.js";
+import {applyLimitOld, timesliceTranches} from "@/orderbuild.js";
 import Tranches from "@/components/Tranches.vue";
 import {useOrderStore} from "@/store/store.js";
 

src/components/TokenChoice.vue

@@ -81,13 +81,6 @@ function updateValue(v) {
 }
 </script>
 
-<script>
-import {ethers} from "ethers";
-import {useStore} from "@/store/store.js";
-const s = useStore()
-
-</script>
-
 
 <style scoped lang="scss">
 @use "src/styles/vars" as *;

src/components/chart/DiagonalBuilder.vue

@@ -398,7 +398,7 @@ function dirtyLine(a, b) {
   return result
 }
 
-const name = computed(()=>(props.builder.breakout?'Breakout':'Limit')+' Diagonal'+(weights.value.length>1?'s':''))
+const name = computed(()=>props.builder.breakout?'Breakout':'Limit')
 
 const description = computed(()=>{
   const buy = props.order.buy

src/components/chart/LimitBuilder.vue

@@ -1,5 +1,5 @@
 <template>
-  <rung-builder :name="(builder.breakout?'Breakout':'Limit')+(prices.length>1?' Ladder':'')"
+  <rung-builder :name="(builder.breakout?'Breakout':'Limit')"
                 :description="description"
                 :order="order" :builder="builder"
                 v-model="priceEndpoints" :mode="0" :flip="flipped"

src/components/chart/RungBuilder.vue

@@ -4,15 +4,16 @@
     <div style="min-width: 4em; font-size: larger" :style="colorStyle"
          class="d-flex flex-column align-self-start ml-2">
       <div class="flex-row align-items-center">
-        <v-btn variant="outlined" @click="props.builder.breakout=!props.builder.breakout">{{ name }}</v-btn>
-        <div class="description">{{description}}</div>
+        <v-btn variant="outlined" style="width: 8em"
+               @click="props.builder.breakout=!props.builder.breakout">{{ name }}</v-btn>
+        <div class="description w-100 text-center">{{description}}</div>
       </div>
       <v-text-field type="number" v-model="rungs"
                     density="compact" hide-details class="mx-1 my-2" variant="outlined"
                     label="Rungs"
                     :color="color" :base-color="color" min="1" :max="MAX_RUNGS"
                     :disabled="rungsDisabled"
-                    style="width: 4.5em;"
+                    style="width: 6.6em;"
       />
     </div>
 
@@ -96,7 +97,6 @@ let lastBuy = null
 watchEffect(()=>{
   if (props.order.buy!==lastBuy) {
     lastBuy = props.order.buy
-    console.log('updating colors')
     props.builder.color=computeDefaultColor()
   }
 })
@@ -332,9 +332,8 @@ function makeModel(index) {
     amount: props.order.amount * alloc,
     amountSymbol: amountSymbol.value,
     textLocation: above ? 'above' : 'below',
-    extraText: !props.builder.breakout ? ' ' :
-        // (above ? '↑ Breakout ↑' : '↓ Breakout ↓')
-        (above ? '▲ Breakout ▲' : '▼ Breakout ▼')
+    breakout: props.builder.breakout,
+    extraText: null,
   }
   setModelValue(result, values.value[index])
   return result

src/components/chart/ToolbarButton.vue

@@ -13,7 +13,6 @@ import {useRoute} from "vue-router";
 import {nav} from "/src/misc.js"
 
 const props = defineProps(['icon', 'route', 'tooltip'])
-console.log('toolbar button props', props.route)
 const router = useRoute();
 const isCurrent = computed(() => router.name === props.route)
 </script>