dexorder/web
2
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

allocation text fix; props&points suppressed during drag

Browse Source
This commit is contained in:
Tim
2024-05-06 15:24:47 -04:00
parent 613cb7d7f5
commit c3c5db9c23
5 changed files with 38 additions and 26 deletions
Download Patch File Download Diff File Expand all files Collapse all files

11
src/charts/shape.js
View File

@@ -1,7 +1,7 @@
// noinspection JSPotentiallyInvalidUsageOfThis
import {invokeCallback, mixin} from "@/common.js";
import {chart, createShape, deleteShapeId, draggingShapeIds, drawShape, widget} from "@/charts/chart.js";
import {chart, createShape, deleteShapeId, dragging, draggingShapeIds, drawShape, widget} from "@/charts/chart.js";
import {pointsToOhlcStart, unique} from "@/misc.js";
import {allocationText} from "@/orderbuild.js";
import Color from "color";
@@ -57,7 +57,7 @@ export class Shape {
// lineColor, textColor, color, // lineColor and textColor default to color
// }
this.debug = true
this.debug = false
this.id = null // TradingView shapeId, or null if no TV shape created yet (drawing mode)
this.type = type // ShapeType
this.model = {} // set to nothing at first
@@ -95,8 +95,6 @@ export class Shape {
//
setModel(model) {
console.log('shape setModel', model)
if (model.color)
this.model.color = model.color
if (model.allocation !== null && model.allocation !== undefined)
@@ -376,11 +374,13 @@ class ShapeTVCallbacks {
if (!this.enabled) return // possible when shape is deleted and re-created
this.shape.id = shapeId
invokeCallback(this.shape, 'onCreate', points, props)
invokeCallback(this.shape, 'onPoints', points)
}
onPoints(shapeId, _tvShape, points) {
if (!this.enabled) return // possible when shape is deleted and re-created
if (this.shape.debug) console.log('tvcb onPoints', points)
if (!dragging || this.shape.beingDragged())
this.shape.onPoints(points)
this.shape.tvPoints = points
}
@@ -388,6 +388,7 @@ class ShapeTVCallbacks {
onProps(shapeId, _tvShape, props) {
if (!this.enabled) return // possible when shape is deleted and re-created
if (this.shape.debug) console.error('tvOnProps', props)
if (!dragging) // do not listen to props during redraw
this.shape.onProps(props)
this.shape.tvProps = props
}
@@ -563,7 +564,6 @@ export class DLine extends Line {
}
setModel(model) {
console.log("DLine setModel", {...this.model}, {...model})
super.setModel(model)
if (model.pointA === null && model.pointB === null)
this.delete()
@@ -584,7 +584,6 @@ export class DLine extends Line {
if( points[i].time !== this.tvPoints[i].time || points[i].price !== this.tvPoints[i].price )
dirty = true
}
console.log('DLine onPoints', dirty, this.tvPoints, points)
if (dirty) {
console.log('DLine points were dirty', this.tvPoints, points)
super.onPoints(points);

9
src/components/chart/DCABuilder.vue
View File

@@ -19,17 +19,17 @@
<td>
<absolute-time-entry v-model="absTimeA"/>
</td>
<td class="weight">{{ weights.length ? allocationText(weights[0]) : '' }}</td>
<td class="weight">{{ weights.length ? allocationTexts[0] : '' }}</td>
</tr>
<tr v-if="weights.length>2" v-for="i in weights.length-2" class="ml-5"> <!-- vue uses 1-based loops -->
<td class="d-flex justify-end pr-3">{{ dateStrings[i] }}</td>
<td class="weight">{{ allocationText(weights[i]) }}</td>
<td class="weight">{{ allocationTexts[i] }}</td>
</tr>
<tr v-if="weights.length>1">
<td>
<absolute-time-entry v-model="absTimeB"/>
</td>
<td class="weight">{{ allocationText(weights[weights.length-1]) }}</td>
<td class="weight">{{ allocationTexts[weights.length-1] }}</td>
</tr>
</tbody>
</table>
@@ -82,6 +82,9 @@ builderDefaults(props.builder, {
const times = ref([])
const weights = ref([])
const amountSymbol = computed(()=>props.order.amountIsTokenA ? co.selectedSymbol.base.s : co.selectedSymbol.quote.s )
const allocationTexts = computed(()=>weights.value.map((w)=>allocationText(w, w*props.order.amount, amountSymbol.value)))
const endTimes = computed(()=>{
if (props.builder.rungs === 1)
return DISTANT_FUTURE

28
src/components/chart/DiagonalBuilder.vue
View File

@@ -19,7 +19,7 @@
label="Price"
/>
</td>
<td rowspan="2" class="weight">{{ allocationText(weights[weights.length-1]) }}</td>
<td rowspan="2" class="weight">{{ allocationTexts[weights.length-1] }}</td>
</tr>
<tr>
<td>
@@ -37,7 +37,7 @@
<tr v-for="i in innerIndexes" class="ml-5">
<td class="text-right">&nbsp;</td>
<td colspan="2" class="text-center"><i>Diagonal</i></td>
<td class="weight">{{ allocationText(weights[i]) }}</td>
<td class="weight">{{ allocationTexts[i] }}</td>
</tr>
<tr v-if="weights.length>1">
<td rowspan="2" class="label">Line B</td>
@@ -52,7 +52,7 @@
label="Price"
/>
</td>
<td rowspan="2" class="weight">{{ allocationText(weights[weights.length-1]) }}</td>
<td rowspan="2" class="weight">{{ allocationTexts[0] }}</td>
</tr>
<tr v-if="weights.length>1">
<td>
@@ -150,8 +150,6 @@ const endpoints = computed({
let [a, b] = v
a = buildLine(a)
b = buildLine(b)
// noinspection JSValidateTypes
_endpoints.value = v
update(a, b)
}
})
@@ -172,7 +170,7 @@ const price1A = computed({
set(v) {
const flatline0 = _endpoints.value[0];
update(
[{time:flatline0[0], price: v}, {time:flatline0[2], price: flatline0[3]}],
[{time:flatline0[0], price: Number(v)}, {time:flatline0[2], price: flatline0[3]}],
_endpoints.value[1]
)
}
@@ -194,7 +192,7 @@ const price1B = computed({
set(v) {
const flatline0 = _endpoints.value[0];
update(
[{time:flatline0[0], price: flatline0[1]}, {time:flatline0[2], price: v}],
[{time:flatline0[0], price: flatline0[1]}, {time:flatline0[2], price: Number(v)}],
_endpoints.value[1]
)
}
@@ -217,7 +215,7 @@ const price2A = computed({
const flatline = _endpoints.value[1];
update(
_endpoints.value[0],
[{time:flatline[0], price: v}, {time:flatline[2], price: flatline[3]}],
[{time:flatline[0], price: Number(v)}, {time:flatline[2], price: flatline[3]}],
)
}
})
@@ -239,18 +237,23 @@ const price2B = computed({
const flatline = _endpoints.value[1];
update(
_endpoints.value[0],
[{time:flatline[0], price: flatline[1]}, {time:flatline[2], price: v}],
[{time:flatline[0], price: flatline[1]}, {time:flatline[2], price: Number(v)}],
)
}
})
function update(a, b) { // a and b are lines of two points
console.log('update', a, b)
if (!vectorEquals(props.builder.lineA, a) || !vectorEquals(props.builder.lineB, b)) {
console.log('update was dirty')
_endpoints.value = [flattenLine(a), flattenLine(b)]
const newBuilder = {...props.builder}
newBuilder.lineA = a
newBuilder.lineB = b
emit('update:builder', newBuilder)
}
else
console.log('update was not dirty')
}
@@ -275,6 +278,9 @@ function setWeights(ws) {
weights.value = ws
}
const amountSymbol = computed(()=>props.order.amountIsTokenA ? co.selectedSymbol.base.s : co.selectedSymbol.quote.s )
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])
@@ -321,8 +327,8 @@ function dirtyLine(a, b) {
<style scoped lang="scss">
td.weight {
width: 5em;
max-width: 8em;
min-width: 5em;
max-width: 20em;
padding-left: 0.5em;
padding-right: 0.5em;
text-align: right;

8
src/components/chart/LimitBuilder.vue
View File

@@ -17,11 +17,11 @@
style="flex: 6em"
/>
</td>
<td class="weight">{{ allocationText(weights[higherIndex]) }}</td>
<td class="weight">{{ allocationTexts[higherIndex] }}</td>
</tr>
<tr v-for="i in innerIndexes" class="ml-5">
<td class="pl-5">{{ prices[i] }}</td>
<td class="weight">{{ allocationText(weights[i]) }}</td>
<td class="weight">{{ allocationTexts[i] }}</td>
</tr>
</template>
<tr>
@@ -33,7 +33,7 @@
style="flex: 6em"
/>
</td>
<td class="weight">{{ weights.length ? allocationText(weights[lowerIndex]) : '' }}</td>
<td class="weight">{{ weights.length ? allocationTexts[lowerIndex] : '' }}</td>
</tr>
</tbody>
</table>
@@ -189,6 +189,8 @@ const weights = ref([])
function setPrices(ps) {prices.value = ps}
function setWeights(ws) { weights.value = ws }
const amountSymbol = computed(()=>props.order.amountIsTokenA ? co.selectedSymbol.base.s : co.selectedSymbol.quote.s )
const allocationTexts = computed(()=>weights.value.map((w)=>allocationText(w, w*props.order.amount, amountSymbol.value)))
const color = computed(()=>props.builder.color ? props.builder.color : defaultColor)

4
src/orderbuild.js
View File

@@ -240,6 +240,8 @@ export function weightColors(weights, color) {
}
export function allocationText(weight, amount, symbol) {
amount = Number(amount)
weight = Number(weight)
let text = ''
const hasWeight = weight!==null && weight!==undefined
if (hasWeight)
@@ -249,7 +251,7 @@ export function allocationText(weight, amount, symbol) {
if (hasAmount && hasSymbol) {
if (hasWeight)
text += ' = '
text += `${amount.toLocaleString('fullwide')} ${symbol}`
text += `${amount.toPrecision(3).toLocaleString('fullwide')} ${symbol}`
}
return text
}