ordershape fixes
This commit is contained in:
@@ -51,7 +51,7 @@ function changeInterval(interval, _timeframe) {
|
||||
|
||||
function dataLoaded() {
|
||||
const range = chartMeanRange()
|
||||
console.log('new mean range', range)
|
||||
console.log('new mean range', range,)
|
||||
co.meanRange = range
|
||||
}
|
||||
|
||||
@@ -400,6 +400,8 @@ export function deleteShapeId(id) {
|
||||
chart.removeEntity(id)
|
||||
}
|
||||
|
||||
const MEAN_RANGE_MULTIPLIER = 10
|
||||
|
||||
function chartMeanRange() {
|
||||
let range = 0
|
||||
const series = chart.getSeries()
|
||||
@@ -415,5 +417,5 @@ function chartMeanRange() {
|
||||
range /= count
|
||||
else
|
||||
range = 1
|
||||
return range
|
||||
return range * MEAN_RANGE_MULTIPLIER
|
||||
}
|
||||
|
||||
@@ -1,7 +1,6 @@
|
||||
import {DISTANT_FUTURE, DISTANT_PAST} from "@/blockchain/orderlib.js";
|
||||
import {DLine, HLine} from "@/charts/shape.js";
|
||||
import {allocationText, DLine, HLine} from "@/charts/shape.js";
|
||||
import {createShape, deleteShapeId} from "@/charts/chart.js";
|
||||
import {allocationText} from "@/orderbuild.js";
|
||||
import {timestamp} from "@/misc.js";
|
||||
|
||||
export class OrderShapes {
|
||||
@@ -63,28 +62,37 @@ class TrancheShapes {
|
||||
const symbol = this.symbol
|
||||
const scale = 10**symbol.decimals;
|
||||
const buy = order.tokenIn === this.symbol.quote.a
|
||||
const inverted = buy === symbol.inverted
|
||||
const amountIsBase = buy !== this.status.order.amountIsInput
|
||||
const filledAmount = this.status.order.amountIsInput ? f.filledIn : f.filledOut;
|
||||
const amount = Number(filledAmount)
|
||||
* 10 ** -(amountIsBase ? this.symbol.base.d : this.symbol.quote.d)
|
||||
const weight = Number(filledAmount) / Number(this.status.order.amount)
|
||||
const amountSymbol = amountIsBase ? this.symbol.base.s : this.symbol.quote.s
|
||||
console.log('fillpoint', buy, filledAmount, this.status.order, this.symbol)
|
||||
const time = f.time
|
||||
const out = Number(f.filledOut) / (1-this.status.order.route.fee/1000000)
|
||||
let price = out / Number(f.filledIn)
|
||||
if (inverted)
|
||||
if (buy)
|
||||
price = 1/price
|
||||
price *= scale
|
||||
// console.log('price', price)
|
||||
const channel = buy?'low':'high';
|
||||
const text = (buy ? 'Buy ' : 'Sell ') + allocationText(null, f.filled, '')
|
||||
const text = (buy ? 'Buy ' : 'Sell ') + allocationText(weight, amount, amountSymbol, '\n')
|
||||
const s = createShape(buy?'arrow_up':'arrow_down', {time, price}, {channel,text,lock:true})
|
||||
// console.log('created fill shape at', time, price)
|
||||
this.fills.push(s)
|
||||
}
|
||||
|
||||
createLine(slope, intercept) {
|
||||
createLine(slope, intercept, amount) {
|
||||
const t = this.tranche
|
||||
const status = this.status
|
||||
const symbol = this.symbol
|
||||
const scale = 10**symbol.decimals;
|
||||
const buy = status.order.tokenIn === this.symbol.quote.a
|
||||
const inverted = buy === symbol.inverted
|
||||
amount = Number(amount)
|
||||
* 10 ** -(buy ? this.symbol.base.d : this.symbol.quote.d)
|
||||
const amountSymbol = buy ? this.symbol.base.s : this.symbol.quote.s
|
||||
const color = buy ? 'green' : 'red'
|
||||
if (intercept !== 0 || slope !== 0) {
|
||||
// console.log('tranche line', intercept, slope)
|
||||
@@ -96,19 +104,16 @@ class TrancheShapes {
|
||||
price *= scale
|
||||
// horizontal line
|
||||
// console.log('hline', price, inverted)
|
||||
const s = new HLine({price, color,
|
||||
// todo allocation maxAllocation amount amountSymbol
|
||||
}, null, null, null, true)
|
||||
const model = {price, color, maxAllocation: status.order.amount, amount, amountSymbol};
|
||||
const s = new HLine(model, null, null, null, true)
|
||||
this.shapes.push(s)
|
||||
} else {
|
||||
// diagonal line
|
||||
let startTime = t.startTime
|
||||
// noinspection EqualityComparisonWithCoercionJS
|
||||
if (startTime == DISTANT_PAST)
|
||||
if (startTime === DISTANT_PAST)
|
||||
startTime = 1231006505 // use Bitcoin genesis as the drawing point's start time. unnecessary.
|
||||
let endTime = t.endTime
|
||||
// noinspection EqualityComparisonWithCoercionJS
|
||||
if (endTime == DISTANT_FUTURE)
|
||||
if (endTime === DISTANT_FUTURE)
|
||||
endTime = timestamp() // use "now" as the drawing point's time
|
||||
let startPrice = (intercept + slope * startTime);
|
||||
let endPrice = (intercept + slope * endTime);
|
||||
@@ -118,15 +123,17 @@ class TrancheShapes {
|
||||
}
|
||||
startPrice *= scale
|
||||
endPrice *= scale
|
||||
// console.log('dline', startTime, endTime, DISTANT_FUTURE, startPrice, endPrice)
|
||||
const s = new DLine({
|
||||
pointA: {time: t.startTime, price: startPrice},
|
||||
pointB: {time: t.endTime, price: endPrice},
|
||||
console.log('dline', startTime, endTime, DISTANT_FUTURE, startPrice, endPrice)
|
||||
// noinspection EqualityComparisonWithCoercionJS
|
||||
const model = {
|
||||
pointA: {time: startTime, price: startPrice},
|
||||
pointB: {time: endTime, price: endPrice},
|
||||
extendLeft: t.startTime === DISTANT_PAST,
|
||||
extendRight: t.endTime === DISTANT_FUTURE,
|
||||
color,
|
||||
// todo allocation maxAllocation amount amountSymbol
|
||||
}, null, null, null, true)
|
||||
maxAllocation: status.order.amount, amount, amountSymbol,
|
||||
};
|
||||
const s = new DLine(model, null, null, null, true)
|
||||
this.shapes.push(s)
|
||||
}
|
||||
}
|
||||
|
||||
@@ -2,7 +2,6 @@
|
||||
|
||||
import {invokeCallback, mixin} from "@/common.js";
|
||||
import {chart, createShape, deleteShapeId, dragging, draggingShapeIds, drawShape, widget} from "@/charts/chart.js";
|
||||
import {allocationText} from "@/orderbuild.js";
|
||||
import Color from "color";
|
||||
import {dirtyItems, dirtyPoints, pointsToTvOhlcStart} from "@/charts/chart-misc.js";
|
||||
|
||||
@@ -39,6 +38,25 @@ export const ShapeType = {
|
||||
}
|
||||
|
||||
|
||||
export function allocationText(weight, amount, symbol, separator = ' ') {
|
||||
const hasAmount = amount !== null && amount !== undefined && amount > 0
|
||||
if (hasAmount)
|
||||
amount = Number(amount)
|
||||
const hasWeight = weight !== null && weight !== undefined
|
||||
if (hasWeight)
|
||||
weight = Number(weight)
|
||||
let text = ''
|
||||
if (hasWeight)
|
||||
text += `${(weight * 100).toFixed(1)}%`
|
||||
const hasSymbol = symbol !== null && symbol !== undefined
|
||||
if (hasAmount && hasSymbol) {
|
||||
if (hasWeight)
|
||||
text += separator
|
||||
text += `${amount.toPrecision(3).toLocaleString('fullwide')} ${symbol}`
|
||||
}
|
||||
return text
|
||||
}
|
||||
|
||||
export class Shape {
|
||||
|
||||
constructor(type, onModel=null, onDelete=null, props=null, readonly=false, overrides={}) {
|
||||
@@ -555,6 +573,7 @@ export class DLine extends Line {
|
||||
if (model.pointA === null && model.pointB === null)
|
||||
this.delete()
|
||||
else {
|
||||
this.setProps({extendLeft:model.extendLeft, extendRight: model.extendRight})
|
||||
if ('pointA' in model && 'pointB' in model) {
|
||||
const newPoints = [model.pointA, model.pointB];
|
||||
const oldPoints = [this.model.pointA, this.model.pointB];
|
||||
@@ -564,7 +583,6 @@ export class DLine extends Line {
|
||||
this.setPoints(newPoints)
|
||||
}
|
||||
}
|
||||
this.setProps({extendLeft:model.extendLeft, extendRight: model.extendRight})
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@@ -80,68 +80,77 @@
|
||||
<!-- </btn>-->
|
||||
<!-- </template>-->
|
||||
<template v-slot:expanded-row="{item}">
|
||||
<tr v-for="(t, i) in item.order.tranches">
|
||||
<td class="text-right" colspan="2">
|
||||
Tranche {{ i + 1 }}
|
||||
<div class="text-right">
|
||||
<div v-if="s.clock < item.trancheStatus[i].startTime">
|
||||
Activates {{timestampString(item.trancheStatus[i].startTime)}}
|
||||
<template v-for="(t, i) in item.order.tranches">
|
||||
<tr>
|
||||
<td class="text-right" colspan="2">
|
||||
Tranche {{ i + 1 }}
|
||||
<div class="text-right">
|
||||
<div v-if="s.clock < item.trancheStatus[i].startTime">
|
||||
Activates {{ timestampString(item.trancheStatus[i].startTime) }}
|
||||
</div>
|
||||
<div v-if="item.trancheStatus[i].endTime<DISTANT_FUTURE">
|
||||
Expires {{ timestampString(item.trancheStatus[i].endTime) }}
|
||||
</div>
|
||||
</div>
|
||||
<div v-if="item.trancheStatus[i].endTime<DISTANT_FUTURE">
|
||||
Expires {{timestampString(item.trancheStatus[i].endTime)}}
|
||||
<div>
|
||||
<div class="mx-3" v-if="t.marketOrder">market order</div>
|
||||
<line-price class="mx-3" v-if="!t.marketOrder"
|
||||
:base="item.order.tokenIn" :quote="item.order.tokenOut"
|
||||
:b="t.minLine.intercept" :m="t.minLine.slope" :is-min="true"
|
||||
:show-btn="false"/>
|
||||
<line-price class="mx-3" v-if="!t.marketOrder"
|
||||
:base="item.order.tokenIn" :quote="item.order.tokenOut"
|
||||
:b="t.maxLine.intercept" :m="t.maxLine.slope" :is-min="false"
|
||||
:show-btn="false"/>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<div class="mx-3" v-if="t.marketOrder">market order</div>
|
||||
<line-price class="mx-3" v-if="!t.marketOrder"
|
||||
:base="item.order.tokenIn" :quote="item.order.tokenOut"
|
||||
:b="t.minLine.intercept" :m="t.minLine.slope" :is-min="true"
|
||||
:show-btn="false"/>
|
||||
<line-price class="mx-3" v-if="!t.marketOrder"
|
||||
:base="item.order.tokenIn" :quote="item.order.tokenOut"
|
||||
:b="t.maxLine.intercept" :m="t.maxLine.slope" :is-min="false"
|
||||
:show-btn="false"/>
|
||||
</div>
|
||||
|
||||
</td>
|
||||
<td class="text-right">
|
||||
<suspense>
|
||||
</td>
|
||||
<td class="text-right">
|
||||
<suspense>
|
||||
<span v-if="item.state > OrderState.Signing">
|
||||
<pulse :touch="item.trancheStatus[i].filledIn">
|
||||
<token-amount :chain-id="item.chainId" :addr="item.order.tokenIn" :amount="item.trancheStatus[i].filledIn" :raw="true"/>
|
||||
<token-amount :chain-id="item.chainId" :addr="item.order.tokenIn"
|
||||
:amount="item.trancheStatus[i].filledIn" :raw="true"/>
|
||||
</pulse>
|
||||
</span>
|
||||
</suspense>
|
||||
<suspense>
|
||||
</suspense>
|
||||
<suspense>
|
||||
<span v-if="item.order.amountIsInput">
|
||||
/
|
||||
<token-amount :chain-id="item.chainId" :addr="item.amountToken" :amount="item.order.amount*BigInt(t.fraction)/65535n"/>
|
||||
<token-amount :chain-id="item.chainId" :addr="item.amountToken"
|
||||
:amount="item.order.amount*BigInt(t.fraction)/65535n"/>
|
||||
</span>
|
||||
</suspense>
|
||||
</td>
|
||||
<td class="text-right w-33">
|
||||
<suspense>
|
||||
</suspense>
|
||||
</td>
|
||||
<td class="text-right w-33">
|
||||
<suspense>
|
||||
<span v-if="item.state > OrderState.Signing">
|
||||
<pulse :touch="item.trancheStatus[i].filledOut">
|
||||
<token-amount :chain-id="item.chainId" :addr="item.order.tokenOut" :amount="item.trancheStatus[i].filledOut" :raw="true"/>
|
||||
<token-amount :chain-id="item.chainId" :addr="item.order.tokenOut"
|
||||
:amount="item.trancheStatus[i].filledOut" :raw="true"/>
|
||||
</pulse>
|
||||
<token-symbol :addr="item.order.tokenOut"/>
|
||||
</span>
|
||||
</suspense>
|
||||
<suspense>
|
||||
</suspense>
|
||||
<suspense>
|
||||
<span v-if="!item.order.amountIsInput">
|
||||
/
|
||||
<token-amount :chain-id="item.chainId" :addr="item.amountToken" :amount="item.order.amount*BigInt(t.fraction)/65535n"/>
|
||||
<token-amount :chain-id="item.chainId" :addr="item.amountToken"
|
||||
:amount="item.order.amount*BigInt(t.fraction)/65535n"/>
|
||||
</span>
|
||||
</suspense>
|
||||
</td>
|
||||
<td class="text-right">
|
||||
<suspense>
|
||||
<pair-price :base="item.order.tokenIn" :quote="item.order.tokenOut" :value="item.trancheStatus[i].avg" :show-btn="false"/>
|
||||
</suspense>
|
||||
</td>
|
||||
<td>{{ item.trancheStatus[i].status }}<!--todo:tranche status--></td>
|
||||
</tr>
|
||||
</suspense>
|
||||
</td>
|
||||
<td class="text-right">
|
||||
<suspense>
|
||||
<pair-price :base="item.order.tokenIn" :quote="item.order.tokenOut" :value="item.trancheStatus[i].avg"
|
||||
:show-btn="false"/>
|
||||
</suspense>
|
||||
</td>
|
||||
<td>{{ item.trancheStatus[i].status }}<!--todo:tranche status--></td>
|
||||
</tr>
|
||||
<tr>
|
||||
</tr>
|
||||
</template>
|
||||
</template>
|
||||
</v-data-table>
|
||||
</div>
|
||||
|
||||
@@ -39,8 +39,8 @@
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import {allocationText, builderDefaults, MIN_EXECUTION_TIME, useChartOrderStore} from "@/orderbuild.js";
|
||||
import {VLine} from "@/charts/shape.js";
|
||||
import {builderDefaults, MIN_EXECUTION_TIME, useChartOrderStore} from "@/orderbuild.js";
|
||||
import {allocationText, VLine} from "@/charts/shape.js";
|
||||
import {sideColor} from "@/misc.js";
|
||||
import {useTheme} from "vuetify";
|
||||
import {useOrderStore, useStore} from "@/store/store.js";
|
||||
|
||||
@@ -92,12 +92,12 @@
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import {allocationText, applyLinePoints, builderDefaults, useChartOrderStore} from "@/orderbuild.js";
|
||||
import {applyLinePoints, builderDefaults, useChartOrderStore} from "@/orderbuild.js";
|
||||
import {sideColor} from "@/misc.js";
|
||||
import {MAX_FRACTION, newTranche} from "@/blockchain/orderlib.js";
|
||||
import RungBuilder from "@/components/chart/RungBuilder.vue";
|
||||
import {computed, ref} from "vue";
|
||||
import {DLine} from "@/charts/shape.js";
|
||||
import {allocationText, DLine} from "@/charts/shape.js";
|
||||
import {vectorEquals, vectorInterpolate} from "@/vector.js";
|
||||
import AbsoluteTimeEntry from "@/components/AbsoluteTimeEntry.vue";
|
||||
|
||||
@@ -345,7 +345,7 @@ const amountSymbol = computed(()=>props.order.amountIsTokenA ? co.selectedSymbol
|
||||
|
||||
const allocationTexts = computed(()=>weights.value.map((w)=>allocationText(w, w*props.order.amount, amountSymbol.value)))
|
||||
|
||||
const stdWidth = computed(()=>[0, 2 * co.meanRange, 0, 2 * co.meanRange])
|
||||
const stdWidth = computed(()=>[0, co.meanRange, 0, co.meanRange])
|
||||
|
||||
|
||||
function getModelValue(model) {
|
||||
|
||||
@@ -41,13 +41,13 @@
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import {allocationText, applyLinePoint, builderDefaults, useChartOrderStore} from "@/orderbuild.js";
|
||||
import {applyLinePoint, builderDefaults, useChartOrderStore} from "@/orderbuild.js";
|
||||
import {sideColor} from "@/misc.js";
|
||||
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} from "vue";
|
||||
import {HLine} from "@/charts/shape.js";
|
||||
import {allocationText, HLine} from "@/charts/shape.js";
|
||||
|
||||
const s = useStore()
|
||||
const os = useOrderStore()
|
||||
@@ -194,7 +194,7 @@ const allocationTexts = computed(()=>weights.value.map((w)=>allocationText(w, w*
|
||||
|
||||
const color = computed(()=>props.builder.color ? props.builder.color : defaultColor)
|
||||
|
||||
const stdWidth = computed(()=>2*co.meanRange)
|
||||
const stdWidth = computed(()=>co.meanRange)
|
||||
|
||||
|
||||
function getModelValue(model) {
|
||||
|
||||
@@ -66,7 +66,7 @@ export const vAutoSelect = {
|
||||
input.onfocus = () => setTimeout(() => input.select(), 0)
|
||||
}
|
||||
}
|
||||
export const uint32max = 4294967295n
|
||||
export const uint32max = 4294967295
|
||||
export const uint64max = 18446744073709551615n
|
||||
|
||||
export function tokenNumber(token, balance) {
|
||||
|
||||
@@ -1,4 +1,4 @@
|
||||
import {routeInverted, timestamp, uuid} from "@/misc.js";
|
||||
import {timestamp, uuid} from "@/misc.js";
|
||||
import {MAX_FRACTION, newTranche} from "@/blockchain/orderlib.js";
|
||||
import {useOrderStore, useStore} from "@/store/store.js";
|
||||
import {encodeIEE754} from "@/common.js";
|
||||
@@ -251,25 +251,6 @@ export function weightColors(weights, color) {
|
||||
return adj.map((a) => a.string())
|
||||
}
|
||||
|
||||
export function allocationText(weight, amount, symbol) {
|
||||
const hasAmount = amount!==null && amount!==undefined && amount > 0
|
||||
if (hasAmount)
|
||||
amount = Number(amount)
|
||||
const hasWeight = weight!==null && weight!==undefined
|
||||
if (hasWeight)
|
||||
weight = Number(weight)
|
||||
let text = ''
|
||||
if (hasWeight)
|
||||
text += `${(weight * 100).toFixed(1)}%`
|
||||
const hasSymbol = symbol!==null && symbol!==undefined
|
||||
if (hasAmount && hasSymbol) {
|
||||
if (hasWeight)
|
||||
text += ' = '
|
||||
text += `${amount.toPrecision(3).toLocaleString('fullwide')} ${symbol}`
|
||||
}
|
||||
return text
|
||||
}
|
||||
|
||||
export function deleteBuilder(order, builder) {
|
||||
order.builders = order.builders.filter((b) => b !== builder)
|
||||
}
|
||||
Reference in New Issue
Block a user