quantadex / react_quantadex Goto Github PK

http://testnet.quantadex.com/

Port this code:

(ignore calls and settlement, we don't support)

<DepthHighChart
                            marketReady={marketReady}
                            orders={marketLimitOrders}
                            showCallLimit={showCallLimit}
                            call_orders={marketCallOrders}
                            flat_asks={flatAsks}
                            flat_bids={flatBids}
                            flat_calls={ showCallLimit ? flatCalls : []}
                            flat_settles={this.props.settings.get("showSettles") && flatSettles}
                            settles={marketSettleOrders}
                            invertedCalls={invertedCalls}
                            totalBids={totals.bid}
                            totalAsks={totals.ask}
                            base={base}
                            quote={quote}
                            height={200}
                            onClick={this._depthChartClick.bind(this, base, quote)}
                            settlementPrice={(!hasPrediction && feedPrice) && feedPrice.toReal()}
                            spread={spread}
                            LCP={showCallLimit ? lowestCallPrice : null}
                            leftOrderBook={leftOrderBook}
                            hasPrediction={hasPrediction}
                            noText={true}
                            theme={this.props.settings.get("themes")}
                        />

https://github.com/openledger/graphene-ui/blob/master/web/app/components/Exchange/DepthHighChart.jsx

An easy option to link to a custom stylesheet

In the mainnet selection at the bottom, for now, default to Testnet, and in testnet display the following:

QDEX Fantasy
Leaderbook as a tab at the top.

The orderbook now shows the highest ask and you need to scroll to see the best ask. It should display the best ask and it needs to be visible that it is scroll-able.

Steps to reproduce:

1. Make a buy order
2. Orderbook should change.

We use stream event instead of websocket.

http://orderbook-api-792236404.us-west-2.elb.amazonaws.com/stream/depth/ETH*QB3WOAL55IVT6E7BVUNRW6TUVCAOPH5RJYPUUL643YMKMJSZFZGWDJU3/BTC*QB3WOAL55IVT6E7BVUNRW6TUVCAOPH5RJYPUUL643YMKMJSZFZGWDJU3

https://developer.mozilla.org/en-US/docs/Web/API/Server-sent_events/Using_server-sent_events

Calculation:

1. Take the max total across either bids, or asks, and scale it 100%
2. Any other level will be proportional to the max

When no activity on a chart maybe place a message that no trading occurred in selected period

more customization: be able to drag and drop the different views, hide/unhide them and resize them. be able to add multiple different views (for example both the QDEX/BTC as the QDEX/ETH pairs or different timeframes).

Motivation

We received several feedbacks that we need to up our exchange design. People asked that the design be more well spaced out, and professional looking; They often referred to switcheo, and binance advanced as a better example. The other concerns was the usability for login as a decentralized exchange.

Dev Branch

release12

Features

This design includes:

• Larger vertical order entry, with #17 - Show commission & Fees. Wallet Balance links to their account on the explorer.
• Spacing between different modules clearly.
• Block # linked on open orders
• Smaller status bar
• Select market from the top menu.
• Login as a module. Users land directly without authentication.

Design

https://zpl.io/brWGqzX

display in order amounts (now wallet shows only free balance)

Steps to reproduce:

1. click menu
2. click wallets
3. click menu
4. click exchange

chart disappears

mainnet not yet active but there must be a clear visual difference between on testnet and mainnet

when entering an order the commission should be shown (and subtracted from the total amount)

Basic and Advanced View/Layout options depending on the user trading experience and preference.

Advanced tool bar for fast trading analysis and indicators.

I have deployed a node which indexes into elastic search with an API hosted on Python.

• This should provide account operations in explorer & Filled order in trading ui

Filled orders:

https://wya99cec1d.execute-api.us-east-1.amazonaws.com/testnet/account?operation_type=4

parameters:

    account_id = request.args.get('account_id', False)
    operation_type = request.args.get('operation_type', False)
    from_ = request.args.get('from_', 0)
    size = request.args.get('size', 10)
    from_date = request.args.get('from_date', "2015-10-10")
    to_date = request.args.get('to_date', "now")
    sort_by = request.args.get('sort_by', "-block_data.block_time")
    type = request.args.get('type', "data")
    agg_field = request.args.get('agg_field', "operation_type")

Filled orders w/ accountID:

https://wya99cec1d.execute-api.us-east-1.amazonaws.com/testnet/account?operation_type=4&account_id=1.2.55&size=100

All TX w/ accountID:

https://wya99cec1d.execute-api.us-east-1.amazonaws.com/testnet/account?account_id=1.2.55&size=100

the issue with the orders not getting placed had to do with the fact that there was not enough balance in QDEX to place an order. We really need clearer warnings.
took me a lot of time to figure this out and the system should just have stated: not enough QDEX balance. 0.05 QDEX needed while only 0.0049 free balance is available.
I also thought that this was done automatically by the system if approved

Open orders displays all orders while order history displays only the current instrument. Display current instrument by default and a checkbox to display all. Then a filter box to be able to filter for certain instruments. A separate, full size overview page is nice as well as is a save option.

Be able to optionally pay the platform fee in other currencies. This can be done by actually using that currency or automatically doing another exchange on the background (to QDEX)

Be able to identify where your orders are in the orderbook. When there are orders from others as well on the same level then on a hover show how much is yours and how much in front of you.

Layout first, I will provide api specs:

Deposit flow is only available for QUANTA crosschain assets, which is identified by the issuer. In the testnet, it is "tokensale". On the mainnet it will be "crosschain". (Make this configurable)

Crosschain assets has a special (Q) logo next to it. For these assets, the call to action will be:

Deposit, and Withdrawal. Transfer is a switchable screen from withdrawal.

Ethereum crosschain

Ethereum & ERC20 deposit are special cases where crosschain address must be deployed with metamask. So if the user does not such an address (As in API 1) then we must display the instruction below:

It will take about 30 seconds for the crosschain address, then you will be able to pick up the crosschain address:

API:

1. https://wya99cec1d.execute-api.us-east-1.amazonaws.com/testnet/node1/address/eth/{accountId}
   or
2. https://wya99cec1d.execute-api.us-east-1.amazonaws.com/testnet/node1/address/btc/{accountId}

contains array of addresses.

Similarly to #51 , only cross-chain address support withdrawal flow. For these assets, the user will see withdrawal first, and have a chance to switch to transfer to transfer among each other.

Withdrawal is a special case of transfer, the flow essentially works by sending the deposit back to the issuer. (See the asset object). This is set to read-only field automatically for the user. Then the user fills out amount, and beneficiary address onto the "Memo line" to withdraw the address to.

The question mark allows see some tool tips (https://getbootstrap.com/docs/3.4/javascript/#tooltips)

Destination Address text = "Withdraw requires funds to go back to the QUANTA cross-chain issuer for processing".

Beneficiary Address text = "Specify the outgoing address where you want to withdraw your tokens."

History including failed orders, option to save

Left should show price
Right should show spread.

When spread cannot be calculated, show N/A

Success:

BUY ETH[QFCE] price @ amount
OrderId: 0x213123113 (edited)

BUY ETH[QFCE] price @ amount
Failed order: msg

Ask Afonso

Encryption

// precondition: Check password length and requirement ( uppercase, lowercase, and alpha required, 8 chars)

let password_aes = Aes.fromSeed( password_plaintext )
let encryption_buffer = key.get_random_key().toBuffer() // for new wallet
 // encryption_key is the global encryption key (does not change even if the passsword changes)
let encryption_key = password_aes.encryptToHex( encryption_buffer )
let local_aes_private = Aes.fromSeed( encryption_buffer )
let encrypted_brainkey = local_aes_private.encryptToHex( brainkey_plaintext )

Decrypt

let private_key_hex = aes_private.decryptHex(private_key_tcomb.encrypted_key)
return PrivateKey.fromBuffer(new Buffer(private_key_hex, 'hex'))

Use case: Transfer QDEX to another account

Tech design:

See walletapi / transfer function

Cursor on text bar should not be regular I

On top left. 5, 15 and 30 minutes do not show anything

one click button converts all small balances to qdex tokens.

Instead of QDEX/ETH be able to show ETH/QDEX

Be able to set conditions on orders to trigger and an easy way to set them (take profit(s), stop loss)

On top there can be a customizable bar with main market quotes displayed.

I prefer dark themes myself but others may not: add a white theme for people used to that.

Signing Message

Create new a bytebuffer with the "content"
Signature.signBuffer(content, privatekey)

-----BEGIN QUANTA SIGNED MESSAGE-----
This is an example of a signed message.
-----BEGIN SIGNATURE-----
account=accountId
memokey=QA131rVNvFRCuBxdESyf2R5KwLrYGE4cMbCx
HEXWVHhC4+iLdP9e3v3c9Wd037yFTaWLN+nlgiSdc4BiLBNpVOZ9ouIgfZWy8b4rLLjOl7XutOxUsBlCC8jSFso=
-----END QUANTA SIGNED MESSAGE-----

Verify message

Input:
Signed message above

Signature.verifyBuffer(signature, publicKey) returns true or false

Signed

https://github.com/bitshares/bitsharesjs/search?q=Signature.signBuffer&unscoped_q=Signature.signBuffer

new api has been created : /api/register (on the same node)
install babel-node to run index.js

POST
{
"user_name": "test4",
"public_key": "QA6yQiNYRUNourci9oG3simE4FT22PeSHuoyYkMGdukQMiYhxutb"
}

Status: 200 == success
status : 500 or non 200 is a failure

Account will be granted 10,000 QDEX

Before running the service , you need to

EXPORT KEY=...

I will provide this key for you.

1. Login
2. Click on QDEX/ETH
3. Click on menu-> Wallet
4. Click back to exchange

Result: blank screen

Warnings to prevent prices to high/low (on big spread, prices much lower then best bid and much higher then highest ask) and of course the option to override or totally disable it.

post only (only maker not taker)
fill or kill
fill what's there and kill the remaining

Listing my orders, query this list, and filter for orders matching myself as the seller.

			Apis.instance()
				.db_api()
				.exec("get_full_accounts", [["1.2.8"], true])
				.then(results => {
					console.log("full accounts ", results);
				});

Balances is available, and limit order is available. The true flag enables subscription.

                                    .db_api()
                                    .exec("set_subscribe_callback", [
                                        this.onUpdate.bind(this),
                                        subscribe_to_new
                                    ])

This callback will give you back the full account data.

As visible there is an increase in the chart at the high 120s but no entry in the dom for it.

1. Top left text is visible, should say Volume
2. Hide market closed text
3. Hide symbol top left
4. top right symbol is not visible, format same way as the header
5. 1D is not working
6. Collapse top left

How to calculate Platform fee:

set_tx_fee, and inspect the TX

Display in the maker/taker.

Maker/taker fee is always calculated based on the "receiving asset".

So if in BTC/USD ..

If you buy BTC , then your receiving asset is BTC
If you were selling BTC, then you are receiving USD.

How to caculate maker/taker fee:

Look at the asset data for the asset being traded (see the unit/receiving asset).
get_object 1.3.0
market_fee_percent has a precision of zero, therefore, we must divided by 100. So 10000 = 100%

Taker fee = market_fee
Maker fee = market_fee - discounts.

Discounts to be deploy a future release, so for now, set it to 0%.

• 100% 75% 50% 25%
• maybe settings per instrument for mouse scroll or %
• set total and calculate amount (maybe be able to fix one settings and calculate other based on the one changed)
• idea; different changes when clicking on the order book:
  • no values? > fill all with clicked row
  • already values? > set the clicked value only (so only price/amount or total)
  • regarding volume: when clicking it now only uses that line. I expect it to do all items up to that that line (so total volume up to that price)

SIMPLETOKEN0X541D973A7168DBBF413EAB6993A5E504EC5ACCB0

If valid erc20 when 0X is contained, display in the following format

Show first 4 hex, and a tooltip w/ the full address

If it is issued by the crosschain (eg tokensale), display the Q

Additionally, please link the address box to the ethereum erc-20 address: (example for USDC coin)

Production:
https://etherscan.io/token/0xa0b86991c6218b36c1d19d4a2e9eb0ce3606eb48
Testnet:
https://ropsten.etherscan.io/token/0x1709aa5af3d7555908248af003e61bafadb10202?a=0xba420ef5d725361d8fdc58cb1e4fa62eda9ec990 (example for TOK)