Adding simple client page
This commit is contained in:
parent
a137237010
commit
46f1c9b6c5
162
public/fn.js
Normal file
162
public/fn.js
Normal file
@ -0,0 +1,162 @@
|
||||
//console.log(document.cookie.toString());
|
||||
|
||||
function ResponseError(status, data) {
|
||||
if (this instanceof ResponseError) {
|
||||
this.data = data;
|
||||
this.status = status;
|
||||
} else
|
||||
return new ResponseError(status, data);
|
||||
}
|
||||
|
||||
function responseParse(response, json_ = true) {
|
||||
return new Promise((resolve, reject) => {
|
||||
if (!response.ok)
|
||||
response.text()
|
||||
.then(result => reject(ResponseError(response.status, result)))
|
||||
.catch(error => reject(error));
|
||||
else if (json_)
|
||||
response.json()
|
||||
.then(result => resolve(result))
|
||||
.catch(error => reject(error));
|
||||
else
|
||||
response.text()
|
||||
.then(result => resolve(result))
|
||||
.catch(error => reject(error));
|
||||
});
|
||||
}
|
||||
|
||||
function getAccount() {
|
||||
return new Promise((resolve, reject) => {
|
||||
fetch('/account')
|
||||
.then(result => responseParse(result)
|
||||
.then(result => resolve(result))
|
||||
.catch(error => reject(error)))
|
||||
.catch(error => reject(error));
|
||||
});
|
||||
}
|
||||
|
||||
function getBuyList() {
|
||||
return new Promise((resolve, reject) => {
|
||||
fetch('/list-buyorders')
|
||||
.then(result => responseParse(result)
|
||||
.then(result => resolve(result))
|
||||
.catch(error => reject(error)))
|
||||
.catch(error => reject(error));
|
||||
});
|
||||
}
|
||||
|
||||
function getSellList() {
|
||||
return new Promise((resolve, reject) => {
|
||||
fetch('/list-sellorders')
|
||||
.then(result => responseParse(result)
|
||||
.then(result => resolve(result))
|
||||
.catch(error => reject(error)))
|
||||
.catch(error => reject(error));
|
||||
});
|
||||
}
|
||||
|
||||
function getTransactionList() {
|
||||
return new Promise((resolve, reject) => {
|
||||
fetch('/list-transactions')
|
||||
.then(result => responseParse(result)
|
||||
.then(result => resolve(result))
|
||||
.catch(error => reject(error)))
|
||||
.catch(error => reject(error));
|
||||
});
|
||||
}
|
||||
|
||||
function signUp(privKey, sid) {
|
||||
return new Promise((resolve, reject) => {
|
||||
let pubKey = floCrypto.getPubKeyHex(privKey);
|
||||
let floID = floCrypto.getFloID(pubKey);
|
||||
let sign = floCrypto.signData(sid, privKey);
|
||||
console.log(privKey, pubKey, floID, sid)
|
||||
fetch("/signup", {
|
||||
method: "POST",
|
||||
headers: {
|
||||
'Content-Type': 'application/json'
|
||||
},
|
||||
body: JSON.stringify({
|
||||
floID,
|
||||
pubKey,
|
||||
sign
|
||||
})
|
||||
}).then(result => responseParse(result, false)
|
||||
.then(result => resolve(result))
|
||||
.catch(error => reject(error)))
|
||||
.catch(error => console.error(error));
|
||||
})
|
||||
|
||||
}
|
||||
|
||||
function login(privKey, sid, rememberMe = false) {
|
||||
return new Promise((resolve, reject) => {
|
||||
let pubKey = floCrypto.getPubKeyHex(privKey);
|
||||
let floID = floCrypto.getFloID(pubKey);
|
||||
if(!floID || !floCrypto.verifyPrivKey(privKey, floID))
|
||||
return reject("Invalid Private key");
|
||||
let sign = floCrypto.signData(sid, privKey);
|
||||
fetch("/login", {
|
||||
method: "POST",
|
||||
headers: {
|
||||
'Content-Type': 'application/json'
|
||||
},
|
||||
body: JSON.stringify({
|
||||
floID,
|
||||
sign,
|
||||
saveSession: rememberMe
|
||||
})
|
||||
}).then(result => responseParse(result, false)
|
||||
.then(result => resolve(result))
|
||||
.catch(error => reject(error)))
|
||||
.catch(error => console.error(error));
|
||||
})
|
||||
}
|
||||
|
||||
function logout() {
|
||||
return new Promise((resolve, reject) => {
|
||||
fetch("/logout")
|
||||
.then(result => responseParse(result, false)
|
||||
.then(result => resolve(result))
|
||||
.catch(error => reject(error)))
|
||||
.catch(error => reject(error))
|
||||
})
|
||||
}
|
||||
|
||||
function buy(quantity, max_price) {
|
||||
return new Promise((resolve, reject) => {
|
||||
fetch('/buy', {
|
||||
method: "POST",
|
||||
headers: {
|
||||
'Content-Type': 'application/json'
|
||||
},
|
||||
body: JSON.stringify({
|
||||
quantity,
|
||||
max_price
|
||||
})
|
||||
}).then(result => responseParse(result, false)
|
||||
.then(result => resolve(result))
|
||||
.catch(error => reject(error)))
|
||||
.catch(error => console.error(error))
|
||||
})
|
||||
|
||||
}
|
||||
|
||||
function sell(quantity, min_price) {
|
||||
return new Promise((resolve, reject) => {
|
||||
fetch('/sell', {
|
||||
method: "POST",
|
||||
headers: {
|
||||
'Content-Type': 'application/json'
|
||||
},
|
||||
body: JSON.stringify({
|
||||
quantity,
|
||||
min_price
|
||||
})
|
||||
}).then(result => responseParse(result, false)
|
||||
.then(result => resolve(result))
|
||||
.catch(error => reject(error)))
|
||||
.catch(error => console.error(error))
|
||||
})
|
||||
|
||||
}
|
||||
205
public/home.html
Normal file
205
public/home.html
Normal file
@ -0,0 +1,205 @@
|
||||
<html>
|
||||
|
||||
<head>
|
||||
<style>
|
||||
table td,
|
||||
table th {
|
||||
border: 1px solid black;
|
||||
}
|
||||
</style>
|
||||
<script src="https://sairajzero.github.io/Standard_Operations/cdn/floCrypto.js"></script>
|
||||
<script src="fn.js"></script>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<form id="login-form">
|
||||
<fieldset>
|
||||
<legend>Login</legend>
|
||||
<input type="password" name="priv-key" placeholder="Enter Private Key" />
|
||||
<input type="text" name="sid" style="display: none;"/>
|
||||
<input type="button" name="login" value="login" /><br/>
|
||||
<input type="checkbox" name="remember-me" checked/>RememberMe
|
||||
</fieldset>
|
||||
</form>
|
||||
<div id="user-container">
|
||||
<fieldset>
|
||||
<legend>User</legend>
|
||||
<span id="user_id"></span><br/>
|
||||
FLO: <span id="flo_bal"></span><br/>
|
||||
Rupee: <span id="rupee_bal"></span><br/>
|
||||
<button id="logout">logout</button>
|
||||
</fieldset>
|
||||
<form id="buy">
|
||||
<fieldset>
|
||||
<legend>Buy</legend>
|
||||
<input type="number" name="quantity" placeholder="Enter Quantity" />
|
||||
<input type="number" name="max-price" placeholder="Enter Max Price" />
|
||||
<input type="button" name="buy" value="buy" />
|
||||
</fieldset>
|
||||
</form>
|
||||
<form id="sell">
|
||||
<fieldset>
|
||||
<legend>Sell</legend>
|
||||
<input type="number" name="quantity" placeholder="Enter Quantity" />
|
||||
<input type="number" name="min-price" placeholder="Enter Min Price" />
|
||||
<input type="button" name="sell" value="sell" />
|
||||
</fieldset>
|
||||
</form>
|
||||
</div>
|
||||
<div id="buy-orders">
|
||||
<fieldset>
|
||||
<legend>BuyOrders</legend>
|
||||
<table>
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Buyer</th>
|
||||
<th>Quantity</th>
|
||||
<th>Max Price</th>
|
||||
<th>Order Placed</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody></tbody>
|
||||
</table>
|
||||
</fieldset>
|
||||
</div>
|
||||
<div id="sell-orders">
|
||||
<fieldset>
|
||||
<legend>SellOrders</legend>
|
||||
<table>
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Seller</th>
|
||||
<th>Quantity</th>
|
||||
<th>Min Price</th>
|
||||
<th>Order Placed</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody></tbody>
|
||||
</table>
|
||||
</fieldset>
|
||||
</div>
|
||||
<div id="transactions">
|
||||
<fieldset>
|
||||
<legend>transactions</legend>
|
||||
<table>
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Seller</th>
|
||||
<th>Buyer</th>
|
||||
<th>Quantity</th>
|
||||
<th>Unit Value</th>
|
||||
<th>Time</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody></tbody>
|
||||
</table>
|
||||
</fieldset>
|
||||
</div>
|
||||
|
||||
<button onclick="refresh();">refresh</button>
|
||||
|
||||
<script>
|
||||
function list_buy() {
|
||||
getBuyList().then(list => {
|
||||
let container = document.getElementById("buy-orders").getElementsByTagName("tbody")[0];
|
||||
container.innerHTML = '';
|
||||
list.forEach(o => {
|
||||
let row = container.insertRow();
|
||||
row.insertCell().textContent = o.floID;
|
||||
row.insertCell().textContent = o.quantity;
|
||||
row.insertCell().textContent = o.maxPrice;
|
||||
row.insertCell().textContent = new Date(o.time_placed);
|
||||
row.dataset["id"] = o.id;
|
||||
});
|
||||
}).catch(error => console.error(error))
|
||||
}
|
||||
|
||||
function list_sell() {
|
||||
getSellList().then(list => {
|
||||
let container = document.getElementById("sell-orders").getElementsByTagName("tbody")[0];
|
||||
container.innerHTML = '';
|
||||
list.forEach(o => {
|
||||
let row = container.insertRow();
|
||||
row.insertCell().textContent = o.floID;
|
||||
row.insertCell().textContent = o.quantity;
|
||||
row.insertCell().textContent = o.minPrice;
|
||||
row.insertCell().textContent = new Date(o.time_placed);
|
||||
row.dataset["id"] = o.id;
|
||||
});
|
||||
}).catch(error => console.error(error))
|
||||
}
|
||||
|
||||
function list_txns() {
|
||||
getTransactionList().then(list => {
|
||||
let container = document.getElementById("transactions").getElementsByTagName("tbody")[0];
|
||||
container.innerHTML = '';
|
||||
list.forEach(o => {
|
||||
let row = container.insertRow();
|
||||
row.insertCell().textContent = o.seller;
|
||||
row.insertCell().textContent = o.buyer;
|
||||
row.insertCell().textContent = o.quantity;
|
||||
row.insertCell().textContent = o.unitValue;
|
||||
row.insertCell().textContent = new Date(o.tx_time);
|
||||
});
|
||||
}).catch(error => console.error(error))
|
||||
}
|
||||
|
||||
function refresh() {
|
||||
console.info("refresh");
|
||||
list_buy();
|
||||
list_sell();
|
||||
list_txns();
|
||||
}
|
||||
|
||||
function account() {
|
||||
getAccount().then(acc => {
|
||||
document.getElementById("login-form").style.display = "none";
|
||||
document.getElementById('user-container').style.display = "block";
|
||||
document.getElementById("user_id").textContent = acc.floID;
|
||||
let flo_total = acc.coins.reduce((a, x) => x.quantity, 0);
|
||||
let flo_locked = acc.sellOrders.reduce((a, x) => x.quantity);
|
||||
let flo_net = flo_total - flo_locked;
|
||||
document.getElementById("flo_bal").textContent = flo_net + "(+" + flo_locked + ")";
|
||||
let rupee_total = acc.rupee_total;
|
||||
let rupee_locked = acc.buyOrders.reduce((a, x) => x.quantity * x.maxPrice, 0);
|
||||
let rupee_net = rupee_total - rupee_locked;
|
||||
document.getElementById("rupee_bal").textContent = rupee_net + "(+" + rupee_locked + ")";
|
||||
}).catch(error => {
|
||||
if(error instanceof ResponseError){
|
||||
let response = JSON.parse(error.data)
|
||||
console.log(error);
|
||||
console.log(response);
|
||||
document.getElementById('user-container').style.display = "none";
|
||||
document.getElementById("login-form").style.display = "block";
|
||||
document.forms['login-form']["sid"].value = response.sid;
|
||||
} else
|
||||
console.error(error);
|
||||
})
|
||||
}
|
||||
|
||||
document.getElementById("logout").onclick = (evt) => {
|
||||
logout().then(result => {
|
||||
console.warn(result);
|
||||
location.reload();
|
||||
}).catch(error => console.error(error));
|
||||
};
|
||||
|
||||
document.forms['login-form']['login'].onclick = evt => {
|
||||
let formInputs = document.forms['login-form'];
|
||||
let privKey = formInputs['priv-key'].value;
|
||||
let sid = formInputs['sid'].value;
|
||||
let rememberMe = formInputs['remember-me'].checked;
|
||||
login(privKey, sid, rememberMe).then(result => {
|
||||
console.log(result);
|
||||
account();
|
||||
}).catch(error => console.error(error));
|
||||
}
|
||||
|
||||
(function init() {
|
||||
account();
|
||||
refresh();
|
||||
})();
|
||||
</script>
|
||||
</body>
|
||||
|
||||
</html>
|
||||
Loading…
Reference in New Issue
Block a user