Skip to content

Commit

Permalink
added custom amount input pad and insufficient funds detection
Browse files Browse the repository at this point in the history
  • Loading branch information
@kodaxx
kodaxx committed Jun 23, 2018
1 parent 959f1a0 commit af93122
Show file tree
Hide file tree
Showing 6 changed files with 131 additions and 61 deletions.
6 changes: 3 additions & 3 deletions config.xml
View file
Original file line number Diff line number Diff line change
@@ -1,10 +1,10 @@
<?xml version='1.0' encoding='utf-8'?>
<widget id="com.kodaxx.steempayposui" version="1.0.0" xmlns="http://www.w3.org/ns/widgets" xmlns:cdv="http://cordova.apache.org/ns/1.0">
<name>SteemPayPOSui</name>
<name>SteemPOS</name>
<description>
A sample Apache Cordova application that responds to the deviceready event.
An external terminal for processing STEEM/SBD transactions in brick and mortar stores
</description>
<author email="dev@cordova.apache.org" href="http://cordova.io">
<author email="kodaxx@gmail.com" href="http://kodaxx.github.io">
Apache Cordova Team
</author>
<content src="index.html" />
Expand Down
56 changes: 54 additions & 2 deletions www/css/main.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -16,7 +16,8 @@
--background: #ededed;
--dark: #7e7e7e;
--light: #fff;
--red: #F10032;
--red: #f10032;
--green: #47cf73;
}

* {
Expand Down Expand Up @@ -59,7 +60,7 @@ button:active {
-webkit-transform: scale3d(0.9, 0.9, 1);
}

.bottomNav {
.center {
margin: 0 auto;
text-align: center;
}
Expand Down Expand Up @@ -150,3 +151,54 @@ img.nfc {
opacity: 0;
transform: translateX(10px);
}

/* NUMBER PAD */
#form input:focus,
#form select:focus,
#form textarea:focus,
#form button:focus {
outline: none;
}
.box {
background: var(--background);
margin: 1.5%;
width: 80%;
font-size: 3em;
text-align: center;
border: 1px solid #d5d5d5;
}
.number {
box-shadow: var(--secondary) 0 0 1px 1px;
font-size: 3em;
}
.clear {
font-size: 1.5em;
box-shadow: var(--red) 0 0 1px 1px;
}
.enter {
font-size: 1.5em;
box-shadow: var(--green) 0 0 1px 1px;
}
.button {
background: var(--background);
color: var(--dark);
border: none;
border-radius: 50%;
text-align: center;
width: 24vw;
height: 24vw;
margin: 1vw 1vw;
padding: 0;
}
.button:active {
background: var(--secondary);
color: #fff;
}
.clear:active {
background: var(--red);
color: #fff;
}
.enter:active {
background: var(--green);
color: #fff;
}
38 changes: 34 additions & 4 deletions www/index.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -32,12 +32,12 @@ <h1 class='dark'>Please check internet</h1>
<!-- HOME SCREEN -->
<transition name="fade">
<div id="home" v-show="route === 'home'">
<div class="bottomNav">
<div class="center">
<br>
<br>
<br>
<br>
<button @click="purchase">new sale</button>
<button @click="route = 'sale'">new sale</button>
<br>
<br>
<button @click="soon">recent sales</button>
Expand All @@ -49,7 +49,37 @@ <h1 class='dark'>Please check internet</h1>
</transition>
<!-- SALE PAGE -->
<transition name="fade">
<div id="sale" v-show="route === 'nfc'">
<div id="sale" v-show="route === 'sale'">
<div class="center">
<form action='' method='' id='form' autocomplete='off'>
<input v-model='usd' type='text' class='box' value='' disabled>
<br>
<input @click="add('1')" type='button' class='button number' value='1'>
<input @click="add('2')" type='button' class='button number' value='2'>
<input @click="add('3')" type='button' class='button number' value='3'>
<br>
<input @click="add('4')" type='button' class='button number' value='4'>
<input @click="add('5')" type='button' class='button number' value='5'>
<input @click="add('6')" type='button' class='button number' value='6'>
<br>
<input @click="add('7')" type='button' class='button number' value='7'>
<input @click="add('8')" type='button' class='button number' value='8'>
<input @click="add('9')" type='button' class='button number' value='9'>
<br>
<input @click="add('.')" type='button' class='button number' value='.'>
<input @click="add('0')" type='button' class='button number' value='0'>
<input @click="add('00')" type='button' class='button number' value='00'>
<br>
<input @click="cancel" type='button' class='button clear' value='cancel'>
<input @click="clear" type='button' class='button clear' value='clear'>
<input @click="purchase" type='button' class='button enter' value='enter'>
</form>
</div>
</div>
</transition>
<!-- PURCHASE PAGE -->
<transition name="fade">
<div id="purchase" v-show="route === 'nfc'">
<div class="primary maintext info"><span class='price'>{{ price }}</span></div>
<img class="nfc" src='img/nfc.png'>
<p class="dark maintext confirm">tap card to purchase</p>
Expand All @@ -58,7 +88,7 @@ <h1 class='dark'>Please check internet</h1>
<code class='primary memo'>{{ memo }}</code>
</p>
<br>
<div class='bottomNav'>
<div class='center'>
<button @click="cancel">cancel</button>
</div>
</div>
Expand Down
80 changes: 31 additions & 49 deletions www/js/app.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,46 +2,60 @@
/*global $, steempay, config, navigation, window, document*/

//if device goes offline, show connection page
window.addEventListener('offline', function () {
app.$data.route = 'connection';
window.addEventListener('offline', function() {
app.$data.route = 'connection';
});
//if device comes online, show connection page
window.addEventListener('online', function () {
app.$data.route = 'home';
window.addEventListener('online', function() {
app.$data.route = 'home';
});
//add listener for NFC
document.addEventListener("deviceready", function () {
steempay.nfc.checkNfc();
document.addEventListener("deviceready", function() {
steempay.nfc.checkNfc();
});

var app = new Vue({
el: '#app',
data: {
route: 'home',
account: `@${config.account}`,
price: config.price,
price: "0",
usd: "",
memo: 'memo'
},
methods: {
purchase: function() {
clear: function() {
this.usd = '';
this.price = '';
this.memo = '';
},
add: function(num) {
this.usd = `${this.usd}${num}`;
},
purchase: async function() {
//generate random memo
let memo = steempay.utils.randomMemo();
this.memo = memo;
//get current price
console.log("usd: " + parseFloat(this.usd));
console.log("rate: " + parseFloat(await steempay.utils.getExchangeRate('steem')));
this.price = `${(parseFloat(this.usd) / parseFloat(await steempay.utils.getExchangeRate('steem'))).toFixed(3)} STEEM`;
console.log("price: " + this.price);
//start listening for NFC
steempay.nfc.startListening(function() {
steempay.transaction.isWatching = true;
let memo = app.$data.memo;
//$(".memo").text(memo);
//start looking for transaction
console.log("account: " + config.account);
console.log("price: " + config.price);
console.log("price: " + this.price);
console.log("memo: " + app.$data.memo);
steempay.transaction.watch(config.account, config.price, memo, function() {
//on success, show confirm page
steempay.transaction.watch(config.account, app.$data.price, memo, function() {
//on success, show confirm page and clear form
app.$data.route = 'confirmed';
app.clear();
//after 10 seconds, show home page
setTimeout(function () {
app.$data.route = 'home';
setTimeout(function() {
app.$data.route = 'home';
}, 10000);
});
console.log("you can now scan a tag");
Expand All @@ -53,6 +67,7 @@ var app = new Vue({
//stop looking for transaction
steempay.nfc.stopListening();
steempay.transaction.watchStop();
this.clear();
this.route = 'home';
},
soon: function() {
Expand All @@ -63,41 +78,8 @@ var app = new Vue({
created() {
//if device is offline, show connection page
if (!navigator.onLine) {
this.route = 'connection';
this.route = 'connection';
}
document.getElementById("status").innerHTML = 'processing payment...';
}
})

//attach functions to buttons
// $(document).ready(function () {
// $('#purchase').click(function () {
// //start listening for NFC
// steempay.nfc.startListening(function() {
// steempay.transaction.isWatching = true;
// //generate random memo
// let memo = steempay.utils.randomMemo();
// localStorage.setItem("memo", memo);
// //show user the memo
// $(".memo").text(memo);
// //start looking for transaction
// steempay.transaction.watch(config.account, config.price, memo, function() {
// //on success, show confirm page
// navigation.showPage("#confirm");
// //after 10 seconds, show home page
// setTimeout(function () {
// navigation.showPage("#home");
// }, 10000);
// });
//
// navigation.showPage('#sale');
// console.log("you can now scan a tag");
// });
// });
//
// $('#cancel').click(function () {
// //stop looking for transaction
// steempay.transaction.watchStop();
// navigation.showPage("#home");
// });
// });
});
3 changes: 2 additions & 1 deletion www/js/lib/steempay.api.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -157,7 +157,7 @@ var steempay = {
if (steempay.transaction.isWatching) {
window.setTimeout(async function() {
var log = await steempay.account.getUserHistory(account);

console.log('watching');
log.forEach(function(element) {
if (parseFloat(element.details.amount) >= parseFloat(amount) && element.details.memo === memo) {
steempay.transaction.watchStop();
Expand All @@ -172,6 +172,7 @@ var steempay = {
},

watchStop: function() {
console.log('stop watching');
steempay.transaction.isWatching = false;
}

Expand Down
9 changes: 7 additions & 2 deletions www/js/lib/steempay.nfc.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -49,7 +49,7 @@ steempay.nfc = {
if (!steempay.nfc.isListening) {
console.log("wasn't listening");
} else {
steempay.isListening = false;
steempay.nfc.isListening = false;
nfc.removeNdefListener(
steempay.nfc.nfcHandler,
function() { // success callback
Expand All @@ -74,8 +74,13 @@ steempay.nfc = {
//verify that decrypted key converted to pub matches public key
if (await verify(acc, key)) {
app.$data.route = 'loader';; //todo: put this specific code somewhere else
steem.broadcast.transfer(key, acc, config.account, config.price, memo, function(err, result) {
steem.broadcast.transfer(key, acc, config.account, app.$data.price, memo, function(err, result) {
console.log(err, result);
if (err) {
var message = err.message.split(": ")[1];
swal("Error!", message, "error");
app.cancel();
}
});
steempay.nfc.stopListening();
//wrong pin or invalid account
Expand Down

0 comments on commit af93122

Please sign in to comment.