fixed weight slider bounds

.env-arb1

@@ -1,2 +1,2 @@
-VITE_WS_URL=wss://ws.dexorder.trade
-VITE_SHARE_URL=https://dexorder.trade
+VITE_WS_URL=wss://ws.dexorder.com
+VITE_SHARE_URL=https://app.dexorder.com

src/blockchain/transaction.js

@@ -22,6 +22,7 @@ export class Transaction {
     }
 
     submit() {
+        console.log('submitting transaction', this.type)
         const ws = useWalletStore();
         if ( ws.transaction !== null ) {
             console.error('Transaction already in progress', ws.transaction)
@@ -32,6 +33,7 @@ export class Transaction {
 
     // "propose" means attach the transaction to a specific vault
     propose(owner, vault) {
+        console.log('transaction bind', owner, vault)
         if (this.vault !== null && this.vault !== vault) {
             this.failed('proposed vault did not match withdrawl vault', vault, this.vault)
             return

src/blockchain/wallet.js

@@ -33,12 +33,14 @@ export const useWalletStore = defineStore('wallet', ()=>{
     set(v) {
       _tx.value = v;
       if (v===null) {
+        console.log('clear transaction')
         if (progressionInvoker!==null) {
           clearTimeout(progressionInvoker)
           progressionInvoker = null
         }
       }
       else {
+        console.log('set transaction', v)
         transactionProgressor.invoke();
         if (progressionInvoker===null)
           progressionInvoker = setInterval(()=>transactionProgressor.invoke(), 1000)
@@ -242,7 +244,7 @@ async function _discoverVaults(owner) {
     if( useWalletStore().transaction ) {
       const num = 0 // todo multiple vaults
       if (result.length)
-        flushOrders(s.chainId, owner, num, result[0])
+        flushWalletTransactions(s.chainId, owner, num, result[0])
       else
         ensureVault2(s.chainId, owner, num)
     }
@@ -284,7 +286,7 @@ async function doEnsureVault(chainId, owner, num) {
   if (s.vaults.length <= num)
     await _discoverVaults(owner)
   if( s.vaults[num] )
-    flushOrders(chainId, owner, num, s.vaults[num])
+    flushWalletTransactions(chainId, owner, num, s.vaults[num])
   else {
     console.log(`requesting vault ${owner} ${num}`)
     socket.emit('ensureVault', chainId, owner, num)
@@ -309,11 +311,13 @@ export async function cancelOrder(vault, orderIndex) {
 async function progressTransactions() {
   const s = useStore()
   const ws = useWalletStore();
+  console.log('progressTransactions', ws.transaction)
   if( ws.transaction===null )
     return
   if( s.account === null ) {
     let signer = null
     try {
+      console.log('account is null. requesting sign-in.')
       signer = await provider.getSigner()
     }
     catch (e) {
@@ -333,11 +337,27 @@ async function progressTransactions() {
     }
   }
   if( s.vault === null ) {
+    console.log('vault is null. requesting vault creation.')
     ensureVault()
     return
   }
+  if( ws.transaction.state < TransactionState.Proposed )
+    ws.transaction.propose(s.account, s.vault)
   if( ws.transaction.type === TransactionType.PlaceOrder ) {
-    flushOrders(s.chainId, s.account, 0, s.vault)
+    flushWalletTransactions(s.chainId, s.account, 0, s.vault)
+  }
+  else {
+    console.log('flushing transaction', ws.transaction.type)
+    if (ws.transaction.state < TransactionState.Proposed) {
+      pendTransaction(async (signer) => {
+        if (signer.address !== ws.transaction.owner) {
+          console.error('signer address does not match transaction owner', signer.address, ws.transaction.owner)
+          return
+        }
+        const contract = await vaultContract(ws.transaction.vault, signer)
+        return await ws.transaction.createTx(contract)
+      })
+    }
   }
 }
 
@@ -346,12 +366,10 @@ const transactionProgressor = new SingletonCoroutine(progressTransactions, 10)
 let progressionInvoker = null
 
 
-export function flushOrders(chainId, owner, num, vault) {
+export function flushWalletTransactions(chainId, owner, num, vault) {
   const ws = useWalletStore();
-  console.log('flushOrders', chainId, owner, num, vault)
-  if (ws.transaction!==null && ws.transaction.type === TransactionType.PlaceOrder && ws.transaction.state < TransactionState.Proposed)
-    ws.transaction.propose(owner, vault)
-  let needsFlush = false
+  console.log('flushWalletTransactions', chainId, owner, num, vault)
+  let needsFlush = ws.transaction !== null && ws.transaction.type !== TransactionType.PlaceOrder
   for( const pend of ws.pendingOrders ) {
     if (pend.vault === null)
       pend.vault = vault
@@ -420,6 +438,7 @@ function pendOrderAsTransaction(pend) {
 
 
 export function pendTransaction(sender, errHandler) {
+  console.log('pendTransaction')
   const s = useStore()
   s.transactionSenders.push([sender,errHandler])
   flushTransactions()
@@ -438,6 +457,7 @@ async function asyncFlushTransactions() {
   console.log('flushTransactions', ws.transaction, s.vault)
   if (ws.transaction !== null) {
     if (s.vault === null) {
+      console.log('transaction doesn\'t have a vault. creating one.')
       await ensureVault()
       if (s.vault === null) {
         console.error('vault could not be created')
@@ -455,8 +475,10 @@ async function asyncFlushTransactions() {
     return
   }
   const senders = s.transactionSenders
-  if (!senders.length)
+  if (!senders.length) {
+    console.log('no transactionSenders!')
     return
+  }
   console.log(`flushing ${senders.length} transactions`)
   let signer
   try {
@@ -572,7 +594,7 @@ const _chainInfos = {
   1337: {
     "chainId": "0x539",
     "chainName": "Dexorder Alpha Testnet",
-    "rpcUrls": ["https://rpc.alpha.dexorder.trade"],
+    "rpcUrls": ["https://rpc.alpha.dexorder.com"],
     "nativeCurrency": {
       "name": "Test Ethereum",
       "symbol": "TETH",

src/charts/chart.js

@@ -158,6 +158,7 @@ export function initTVButtons() {
 }
 
 export function initWidget(el) {
+    getAllSymbols()
     const symbol = prefs.selectedTicker === null ? 'default' : prefs.selectedTicker
     const interval = prefs.selectedTimeframe === null ? '15' : prefs.selectedTimeframe
     widget = window.tvWidget = new TradingView.widget({

src/charts/datafeed.js

@@ -6,7 +6,7 @@ import {useChartOrderStore} from "@/orderbuild.js";
 import {useStore} from "@/store/store.js";
 import {subOHLC, unsubOHLC} from "@/blockchain/ohlcs.js";
 import {ohlcStart} from "@/charts/chart-misc.js";
-import {timestamp} from "@/common.js";
+import {timestamp, withTimeout} from "@/common.js";
 import {erc20Contract} from "@/blockchain/contract.js";
 import {track} from "@/track.js";
 
@@ -140,7 +140,7 @@ function addSymbol(chainId, p, base, quote, inverted) {
 	// 	console.log(`invertedDefault(${symbolInfo.base.s}, ${symbolInfo.quote.s})`,invertedDefault(symbolInfo.base.a, symbolInfo.quote.a))
 	// }
 	if (defaultSymbol===null && !invertedDefault(symbolInfo.base.a, symbolInfo.quote.a)) {
-		// console.log('setting default symbol', symbolInfo.base.s, symbolInfo.quote.s, symbolInfo.base.a, symbolInfo.quote.a)
+		console.log('setting default symbol', symbolInfo.base.s, symbolInfo.quote.s, symbolInfo.base.a, symbolInfo.quote.a)
 		defaultSymbol = _symbols[ticker]
 	}
 	log('new symbol', ticker, _symbols[ticker])
@@ -335,6 +335,14 @@ class RealtimeSubscription {
 }
 
 
+async function getLiquidities(markToken, symbolItem) {
+	const token = await erc20Contract(markToken.a, provider)
+	const liquidities = await Promise.all(symbolItem.feeGroup.map(
+		async ([addr, fee]) => await token.balanceOf(addr)
+	))
+	return liquidities;
+}
+
 export const DataFeed = {
 	onReady(callback) {
 		log('[onReady]: Method call');
@@ -381,9 +389,12 @@ export const DataFeed = {
 		onResolveErrorCallback,
 		extension
 	) {
-		// console.log('[resolveSymbol]: Method call', symbolName);
+		console.log('resolveSymbol', symbolName);
 		const symbols = getAllSymbols();
 		const symbolItem = symbolName === 'default' ? defaultSymbol : symbols[symbolName]
+		if (symbolName==='default') {
+			console.log('using default symbol', defaultSymbol)
+		}
 		if (!symbolItem) {
 			console.log('[resolveSymbol]: Cannot resolve symbol', symbolName);
 			onResolveErrorCallback('cannot resolve symbol');
@@ -399,10 +410,11 @@ export const DataFeed = {
 				const inv = invertedDefault(symbolItem.base.a, symbolItem.quote.a)
 				const markToken = inv ? symbolItem.base : symbolItem.quote
 				const mark = useStore().markPrice(markToken.a)
-				const token = await erc20Contract(markToken.a, provider)
-				const liquidities = await Promise.all(symbolItem.feeGroup.map(
-					async ([addr, fee]) => await token.balanceOf(addr)
-				))
+				const liquidities = await withTimeout(
+					getLiquidities(markToken, symbolItem),
+					3000,
+					'liquidity fetch timeout'
+				)
 				symbolItem.liquidities = liquidities.map(l => Number(l / 10n ** BigInt(markToken.d)))
 				if (mark) {
 					symbolItem.liquidities = symbolItem.liquidities.map(l => l * mark)

src/common.js

@@ -178,3 +178,13 @@ export function decodeBase62(str) {
     return str.split('').reverse().reduce((acc, char, i) =>
         acc + base62charset.indexOf(char) * Math.pow(62, i), 0);
 }
+
+
+export function withTimeout(promise, timeoutDuration, fallbackErrorMessage) {
+    return Promise.race([
+        promise,
+        new Promise((_, reject) =>
+            setTimeout(() => reject(new Error(fallbackErrorMessage)), timeoutDuration)
+        ),
+    ]);
+}

src/components/Alerts.vue

@@ -1,4 +1,5 @@
 <template>
+  <v-alert class="d-sm-none" type="info" title="Mobile Screen" text="Dexorder is designed for desktop. Mobile coming soon!" rounded="0"/>
   <v-alert v-if='!s.connected' icon="mdi-wifi-off" type="error" title="Not Connected" class="mb-3" rounded="0" density="compact"/>
   <v-alert v-for="e in s.errors" icon="mdi-alert" type="error" :title="e.title" :text="e.text" class="mb-3" :closable="e.closeable" rounded="0"/>
 </template>

src/components/FloatingDiv.vue

@@ -0,0 +1,142 @@
+<template>
+  <div
+    ref="floatingDiv"
+    :style="divStyle"
+    @mousedown="startDrag"
+  >
+    <slot></slot>
+  </div>
+</template>
+
+<script setup>
+import { ref, reactive, onMounted, onBeforeUnmount } from 'vue';
+
+const props = defineProps({
+  id: {
+    type: String,
+    required: false,
+  }
+});
+
+const floatingDiv = ref(null);
+const position = reactive({ x: 0, y: 0 });
+const isDragging = ref(false);
+const isFloating = ref(false);
+const dragStartOffset = reactive({ x: 0, y: 0 });
+
+const divStyle = reactive({
+  position: "",
+  top: "",
+  left: "",
+  zIndex: "",
+  cursor: "default",
+});
+
+let activeComponent = null;
+
+function positionKey() {
+  return props.id ? `floating-div-pos:${props.id}` : null;
+}
+
+function savePosition() {
+  if (props.id) {
+    localStorage.setItem(
+      positionKey(),
+      JSON.stringify({ x: position.x, y: position.y })
+    );
+  }
+}
+
+function loadPosition() {
+  if (props.id) {
+    const data = localStorage.getItem(positionKey());
+    if (data) {
+      try {
+        const { x, y } = JSON.parse(data);
+        position.x = x;
+        position.y = y;
+        divStyle.position = "fixed";
+        divStyle.top = `${position.y}px`;
+        divStyle.left = `${position.x}px`;
+        divStyle.zIndex = 9999;
+        isFloating.value = true;
+      } catch {
+        // Ignore corrupted data
+      }
+    }
+  }
+}
+
+const startDrag = (event) => {
+  if (event.shiftKey || event.ctrlKey) {
+    if (!isFloating.value) {
+      const rect = floatingDiv.value.getBoundingClientRect();
+      position.x = rect.left;
+      position.y = rect.top;
+      divStyle.position = "fixed";
+      divStyle.top = `${position.y}px`;
+      divStyle.left = `${position.x}px`;
+      divStyle.zIndex = 9999;
+      isFloating.value = true;
+    }
+
+    isDragging.value = true;
+    dragStartOffset.x = event.clientX - position.x;
+    dragStartOffset.y = event.clientY - position.y;
+    divStyle.cursor = "move";
+    document.body.style.userSelect = "none";
+
+    activeComponent = floatingDiv;
+
+    window.addEventListener("mousemove", handleDrag);
+    window.addEventListener("mouseup", stopDrag);
+  }
+};
+
+const handleDrag = (event) => {
+  if (isDragging.value && activeComponent === floatingDiv) {
+    position.x = event.clientX - dragStartOffset.x;
+    position.y = event.clientY - dragStartOffset.y;
+    divStyle.top = `${position.y}px`;
+    divStyle.left = `${position.x}px`;
+  }
+};
+
+const stopDrag = () => {
+  if (isDragging.value && activeComponent === floatingDiv) {
+    isDragging.value = false;
+    divStyle.cursor = "default";
+    document.body.style.userSelect = "auto";
+    activeComponent = null;
+
+    savePosition();
+
+    window.removeEventListener("mousemove", handleDrag);
+    window.removeEventListener("mouseup", stopDrag);
+  }
+};
+
+const handleOutsideDrag = (event) => {
+  if (event.key === "Shift" || event.key === "Control") {
+    stopDrag();
+  }
+};
+
+onMounted(() => {
+  document.addEventListener("keyup", handleOutsideDrag);
+  loadPosition();
+});
+
+onBeforeUnmount(() => {
+  document.removeEventListener("keyup", handleOutsideDrag);
+  window.removeEventListener("mousemove", handleDrag);
+  window.removeEventListener("mouseup", stopDrag);
+});
+</script>
+
+<style>
+div[ref="floatingDiv"] {
+  background: rgba(255, 255, 255, 0.8);
+  box-shadow: 0 4px 8px rgba(0,0,0,0.2);
+}
+</style>

src/components/SupportChat.vue

@@ -3,6 +3,6 @@
 
 <script setup>
   if(window.location.hostname !== 'localhost') {
-    window.$crisp = [];window.CRISP_WEBSITE_ID = "b153f30a-4b0b-49cc-8a38-989409a73acb";(function () {const d = document;const s = d.createElement("script");s.src = "https://client.crisp.chat/l.js";s.async = 1;d.getElementsByTagName("head")[0].appendChild(s);})();
+    window.$crisp=[];window.CRISP_WEBSITE_ID="a88f707f-adee-4960-b6de-c328c9d86945";(function(){const d=document;const s=d.createElement("script");s.src="https://client.crisp.chat/l.js";s.async=1;d.getElementsByTagName("head")[0].appendChild(s);})();
   }
 </script>

src/components/TosCard.vue

@@ -5,10 +5,10 @@
     <v-card-text class="text-center">Last Updated November 18, 2024</v-card-text>
 
     <v-card-text>
-      Please read these Terms of Service (the “<b>Terms</b>”) and our <a href="https://dexorder.trade/privacy-policy" target="dexorder">Privacy Policy</a> carefully because they govern your
+      Please read these Terms of Service (the “<b>Terms</b>”) and our <a href="https://dexorder.com/privacy-policy" target="dexorder">Privacy Policy</a> carefully because they govern your
       use of the
-      website (and all subdomains and subpages thereon) located at dexorder.trade, including without limitation the
-      subdomains app.dexorder.trade and www.dexorder.trade (collectively, the “<b>Site</b>”), and the Dexorder web
+      website (and all subdomains and subpages thereon) located at dexorder.com, including without limitation the
+      subdomains app.dexorder.com and www.dexorder.com (collectively, the “<b>Site</b>”), and the Dexorder web
       application graphical user interface and any other services accessible via the Site (together with the Site, web
       application, and other services, collectively, the “<b>Dexorder Service</b>”) offered by Dexorder Trading Services
       Ltd.
@@ -205,7 +205,7 @@
       (i) Subject to your compliance with these Terms, Dexorder will use its commercially
       reasonable efforts to provide you with access to the Dexorder Service and to cause your Interactions to be
       executed on the applicable DEX in accordance with Dexorder’s Execution Policy located at
-      <a href="https://dexorder.trade/execution-policy">https://dexorder.trade/execution-policy</a>
+      <a href="https://dexorder.com/execution-policy">https://dexorder.com/execution-policy</a>
       (“<b>Execution Policy</b>”), however from time to time the Site and the Dexorder Service may be inaccessible or
       inoperable for any
       reason, including, without limitation: (a) if an Interaction repeatedly fails to be executed (such as due to an
@@ -690,7 +690,7 @@
     <v-card-title>18. Contact Information</v-card-title>
     <v-card-text>
       If you have any questions about these Terms or the Dexorder Service, please contact Dexorder
-      at <a href="mailto:legal@dexorder.trade">legal@dexorder.trade</a> or <a href="mailto:support@dexorder.trade">support@dexorder.trade</a>.
+      at <a href="mailto:legal@dexorder.com">legal@dexorder.com</a> or <a href="mailto:support@dexorder.com">support@dexorder.com</a>.
     </v-card-text>
 
 

src/components/Vault.vue

@@ -34,10 +34,10 @@
       <v-card-item v-if="!empty">
         <v-table>
           <tbody>
-          <native-row v-if="nativeBalance" :chain-id="s.chainId" :addr="s.vault" :amount="nativeBalance"
+          <native-row v-if="nativeBalance && BigInt(nativeBalance)>0n" :chain-id="s.chainId" :addr="s.vault" :amount="nativeBalance"
                       :on-withdraw="onWithdrawNative" :on-wrap="()=>wrapShow=true"/>
           <suspense v-for="(amount,addr) of balances">
-            <token-row v-if="BigInt(amount)>0n" :chain-id="s.chainId" :addr="addr" :amount="amount" :onWithdraw="onWithdraw"/>
+            <token-row v-if="amount && BigInt(amount)>0n" :chain-id="s.chainId" :addr="addr" :amount="amount" :onWithdraw="onWithdraw"/>
           </suspense>
           </tbody>
         </v-table>
@@ -90,7 +90,7 @@ const hasVault = computed(()=>s.vault!==null)
 const withdrawToken = ref(null)
 const withdrawShow = ref(false)
 async function onWithdraw(token) {
-  console.log('withdraw', addr, token)
+  console.log('withdraw', addr.value, token)
   withdrawToken.value = token
   withdrawShow.value = true
 }

src/components/WelcomeDialog.vue

@@ -59,7 +59,7 @@ function tryIt() {
 
 function learnMore() {
   track('learn-more')
-  window.open('https://dexorder.trade/introduction.html', 'dexordertrade')
+  window.open('https://dexorder.com/introduction.html', 'dexorderwww')
   modelValue.value = false
 }
 

src/components/Withdraw.vue

@@ -11,7 +11,7 @@
             <v-btn variant="text" text="max" @click="floatAmount=balanceFloat"/>
           </template>
           <template v-slot:append-inner>
-            <span>{{ token.s }}</span>
+            <span style="max-width: 6em">{{ token.s }}</span>
           </template>
         </v-text-field>
         <v-card-actions>
@@ -36,11 +36,17 @@ const s = useStore()
 const props = defineProps(['modelValue', 'vault', 'token'])
 const emit = defineEmits(['update:modelValue'])
 const balance = computed(() => {
-  console.log('balance', props.vault, props.token, s.vaultBalances)
-  const b = s.vaultBalances[props.vault][props.token.address];
+  const b = s.getBalance(props.token?.a)
+  console.log('balance', b)
+  // const b = s.vaultBalances[props.vault][props.token.address];
   return b === undefined ? 0n : BigInt(b)
 })
-const balanceFloat = computed(() => tokenFloat(props.token, balance.value))
+const balanceFloat = computed(() => {
+  let balance = tokenFloat(props.token, s.getBalance(props.token?.a))
+  balance /= 10**props.token.d
+  console.log('balanceFloat', balance, s.getBalance(props.token?.a), props.token)
+  return balance
+})
 const floatAmount = ref(0)
 
 function withdraw() {

src/components/chart/RungBuilder.vue

@@ -132,7 +132,7 @@ const flippedSign = computed(()=>props.flip?-1:1)
 const balance100 = computed( {
   get() {return flippedSign.value*props.builder.balance*100},
   set(v) {
-    if (v<-60) v = -60;
+    // if (v<-60) v = -60;
     props.builder.balance = flippedSign.value*v/100; }
 } )
 

src/components/chart/Toolbar.vue

@@ -10,7 +10,7 @@
       <toolbar-button tooltip="Assets" icon="mdi-currency-btc" route="Assets"/>
       <!-- mdi-format-list-checks mdi-format-list-bulleted-square -->
       <toolbar-button tooltip="Status" icon="mdi-format-list-checks" route="Status"/>
-      <toolbar-button tooltip="About" icon="mdi-information-outline" href="https://dexorder.trade/" target="dexorder"/>
+      <toolbar-button tooltip="About" icon="mdi-information-outline" href="https://dexorder.com/" target="dexorderwww"/>
     </div>
   </div>
 </template>

src/corp/AppBtn.vue

@@ -4,7 +4,7 @@
 
 <script setup>
 function openApp() {
-  window.open('https://app.dexorder.trade/', 'dexorderapp')
+  window.open('https://app.dexorder.com/', 'dexorderapp')
 }
 </script>
 

src/corp/MenuBar.vue

@@ -24,7 +24,7 @@ import {router} from "@/router/router.js";
 const theme = useTheme().current
 
 function openApp() {
-  window.open('https://app.dexorder.trade/', 'dexorderapp')
+  window.open('https://app.dexorder.com/', 'dexorderapp')
 }
 </script>
 

src/misc.js

@@ -66,7 +66,9 @@ export const uint32max = 4294967295
 export const uint64max = 18446744073709551615n
 
 export function tokenNumber(token, balance) {
-    return FixedNumber.fromValue(balance, token.decimals, {decimals: token.decimals, width: 256})
+    const dec = token ? token.decimals : 0
+    console.log('token dec', dec, balance)
+    return FixedNumber.fromValue(balance, dec, {decimals: dec, width: 256})
 }
 
 export function tokenFloat(token, balance) {

src/socketInit.js

@@ -1,6 +1,6 @@
 import {socket} from "@/socket.js";
 import {useStore} from "@/store/store.js";
-import {flushOrders} from "@/blockchain/wallet.js";
+import {flushWalletTransactions} from "@/blockchain/wallet.js";
 import {parseElaboratedOrderStatus} from "@/blockchain/orderlib.js";
 import {DataFeed} from "./charts/datafeed";
 import {notifyFillEvent} from "@/notify.js";
@@ -76,7 +76,7 @@ socket.on('vaults', (chainId, owner, vaults)=>{
         s.vaults = vaults
         if( vaults.length ) {
             const vault = vaults[0]
-            flushOrders(chainId, owner, 0, vault)
+            flushWalletTransactions(chainId, owner, 0, vault)
         }
     }
 })