hbswap

by lilione

HTML

<script src="https://unpkg.com/web3@1.3.0/dist/web3.min.js"></script>
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css">
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/js/bootstrap.min.js"></script>
<d class="container">

    <nav class="navbar navbar-default" role="navigation">
        <div class="container-fluid" style="padding-right: 0">
            <div class="navbar-header">
            </div>
            <ul class="nav navbar-nav navbar-right">
                <li>
                    <span id="usertitle">User</span>
                    <span class="badge" id="user"></span>
                </li>
            </ul>
        </div>
    </nav>

    <div class="row" id="title">
        <div class="text-center col-sm-12">HoneybadgerSwap V3</div>
    </div>

    <div class="card">
        <div class="card-header">
            Trade
        </div>
        <div>
            <div class="card-body">

                <div class="form-group row">
                    <label class="col-sm-3 control-label">Slippage Tolerance</label>
                    <div>
                        <select id='slippage' class="form-control" onfocus="updateAmtTradeFrom()" onchange="updateAmtTradeFrom()">
                            <option value="0.1">10%</option>
                            <option value="0.05">5%</option>
                        </select>
                    </div>
                </div>

                <div class="form-group row">
                    <div class="col-sm-5">
                        <div class="row">
                            <label class="col-sm-2 control-label" style="padding-top: 10px">TokenA</label>
                            <div class="col-sm-2"></div>
                            <div class="col-sm-7 balance row">
                                <label class="col-sm-7 control-label">balance</label>
                                <div class="col-sm-5">
                           ...

CSS

body {
	font-family: 'Roboto Mono',monospace;
	background-image: linear-gradient(140deg, #f5d0c7, #d1a8c4 41.6%, rgba(180, 203, 246, 0.99))
}

#title {
	font-size: 60px;
	margin-top: 50px;
	margin-bottom: 20px;
	border-color: #d8aee8;
	border-width: 10px;
	border-style: solid;
	background-color: #eee3ff;
	padding-top: 10px;
	padding-bottom: 10px;
	font-weight: bold;
	color: #6e2988;
	font-family:georgia;
}


.navbar {
	padding-right: 0;
	margin-right: 0;
	font-weight: bold;
	color: ##9d0312;
}

.navbar-right {
	margin-right: 0;
	border-radius: 12px;
	background-color: #dc3f355e;
	padding: 3px;
	border-style: solid;
	border-color: #4e7699;
	border-width: 4px;
	font-size: 20px;
	font-weight: bold;
}

#usertitle {
	color: #4e7699;
}

.card {
	margin-top: 50px;
	margin-bottom: 50px;
	padding-top: 0;
	padding-bottom: 0;
	border-color: #296588;
	border-width: 10px;
	border-style: solid;
	background-color: #e3fdff;
	font-weight: bold;
	color: #297588;
}

.card-header {
	border-bottom: 10px;
	border-bottom-style: solid;
	border-bottom-color: #296588;
	font-size: 30px;
}

.card-body {
	background-color: rgb(255,251,220);
}

.balance {
	border-style: solid; 
	border-color: #00000030; 
	border-width: 2px; 
	border-radius: 10px;
	padding-top: 5px;
}

#balance label {
	margin-top: .5rem;
	/*margin-bottom: 0;*/
}

JavaScript

const p = BigInt('52435875175126190479447740508185965837690552500527637822603658699938581184513')
const n = 4
const t = 1
const fp = 1 << 16

const ethAddr = '0x0000000000000000000000000000000000000000'
const hbsAddr = '0xf74eb25ab1785d24306ca6b3cbff0d0b0817c5e2'
const hbswapAddr = '0x6b5c9637e0207c72ee1a275b6c3b686ba8d87385'
// const hbswapAddr = '0xbc003e9dffe7306e6e414197267581fd732fe8b4'
// const hbsAddr = "0x78160ee9e55fd81626f98d059c84d21d8b71bfda"
// const daiAddr = "0x4f96fe3b7a6cf9725f59d353f723c1bdb64ca6aa"

const decimals = 10**15
const displayPrecision = 4

// const host = 'https://www.honeybadgerswap.org'
// const basePort = 8080
const host = 'http://localhost'
const basePort = 4000
//
// **** Internal functions ****

function isETH(token) {
    return token == tokenList.get('ETH')
}

function sleep(ms) {
    return new Promise(resolve => setTimeout(resolve, ms))
}

function floatToFix(f) {
    return BigInt(Math.round(f * fp))
}

function fixToFloat(i) {
    return parseFloat(i) / fp
}

function transferValue(x) {
    return BigInt(x) * BigInt(decimals)
}

function getElement(st, idx) {
    return st.slice(2 + idx * 64, 2 + (idx + 1) * 64)
}

function getInt(st, idx) {
    return parseInt('0x' + getElement(st, idx))
}

async function getInputMaskIndexes(num) {
    let tx = await hbswapContract.methods.reserveInput(num).send({from: user})
    data = tx['events']['InputMask']['raw']['data']
    var indexes = []
    for (let i = 0; i < num; i++) {
        indexes.push(getInt(data, i + 2))
    }
    return [indexes, tx]
}

function extended_gcd(a, b) {
    let s = BigInt(0)
    let old_s = BigInt(1)
    let t = BigInt(1)
    let old_t = BigInt(0)
    let r = b
    let old_r = a

    while (r !== BigInt(0)) {
        quotient = ~~(old_r / r);
        [old_r, r] = [r, old_r - quotient * r];
        [old_s, s] = [s, old_s - quotient * s];
        [old_t, t] = [t, old_t - quotient * t];
    }

    return [old_r, old_s, old_t]
}

function mod_reduce(x, p) {
...