Refactor codes

This commit is contained in:
elegant651
2020-04-04 12:28:37 +09:00
parent dd3033be9c
commit 6c51a302b9
20 changed files with 59 additions and 97 deletions

View File

@@ -1,4 +1,4 @@
# frontend-nftdapp
# frontend-nftbapp
## Project setup
```

View File

@@ -1,5 +1,5 @@
{
"name": "frontend-nftdapp",
"name": "frontend-nftbapp",
"version": "0.1.0",
"private": true,
"scripts": {

View File

@@ -13,7 +13,7 @@
</head>
<body>
<noscript>
<strong>We're sorry but frontend-nftdapp doesn't work properly without JavaScript enabled. Please enable it to continue.</strong>
<strong>We're sorry but frontend-nftbapp doesn't work properly without JavaScript enabled. Please enable it to continue.</strong>
</noscript>
<div id="app"></div>
<!-- built files will be auto injected -->

View File

@@ -1,7 +1,7 @@
<template>
<v-app>
<v-app-bar app clipped-left dense>
<v-toolbar-title>NFT APP</v-toolbar-title>
<v-toolbar-title>NFT BAPP</v-toolbar-title>
<v-spacer></v-spacer>
<div class="nav">
@@ -26,13 +26,13 @@ import KlaytnService from './klaytn/klaytnService'
export default {
name: 'app',
async mounted () {
async created () {
await this.connect()
},
methods: {
...mapMutations('wallet', [
'setKlaytn',
'setKlaytn',
'setMyAddress'
]),
async connect () {

View File

@@ -38,10 +38,10 @@ import PostAuction from '@/components/PostAuction.vue'
export default {
data() {
return {
file: null,
tokenId: null,
isRegistered: false,
dataURI: null
file: null,
tokenId: null,
isRegistered: false,
dataURI: null
}
},
@@ -80,7 +80,7 @@ export default {
if(!this.file){
alert("Please put the file on input.")
return
}
}
const formData = new FormData()
formData.append('file', this.file)
@@ -104,14 +104,14 @@ export default {
this.klaytn.registerUniqueToken(this.tokenId, this.dataURI, (receipt) => {
alert(`Token registered...! (#${receipt.blockNumber} ,${receipt.transactionHash})`)
this.isRegistered = true
})
})
},
transferToCA() {
transferToCA() {
this.klaytn.transferFrom(this.tokenId, (receipt) => {
alert(`Token transfered to CA...! (#${receipt.blockNumber} ,${receipt.transactionHash})`)
})
}
})
}
}
}

View File

@@ -22,8 +22,8 @@
<v-btn outlined class="btnSubmit" @click="this.handleAddWallet">CONNECT WALLET</v-btn>
</template>
</v-card>
</v-card>
<h2>Transfer</h2>
<v-select v-model="selectedAuction" :items="auctionIds" label="Asset" @change="getAuctionById"></v-select>
<div v-show="selectedAuction">
@@ -75,14 +75,14 @@ import KlaytnService from '@/klaytn/klaytnService'
snackbar: false,
snackbarMsg: '',
klaytn: null,
privateKey: null,
}
},
computed: {
...mapGetters('wallet', [
...mapGetters('wallet', [
'klaytn',
'isConnectWallet',
'myaddress',
'balance'
@@ -90,15 +90,19 @@ import KlaytnService from '@/klaytn/klaytnService'
},
async mounted() {
this.klaytn = new KlaytnService()
await this.klaytn.init()
const klaytn = new KlaytnService()
this.setKlaytn(klaytn)
const address = await klaytn.init()
await this.getWalletInfo()
await this.getMyAuctions()
},
if (address) {
await this.getWalletInfo()
await this.getMyAuctions()
}
},
methods: {
...mapMutations('wallet', [
...mapMutations('wallet', [
'setKlaytn',
'setIsConnectWallet',
'setMyAddress',
'setBalance'
@@ -108,7 +112,7 @@ import KlaytnService from '@/klaytn/klaytnService'
if(this.privateKey) {
await this.klaytn.integrateWallet(this.privateKey)
this.getWalletInfo()
}
}
} catch (e) {
this.snackbarMsg = `private key doesn't match.`
this.snackbar = true
@@ -146,7 +150,7 @@ import KlaytnService from '@/klaytn/klaytnService'
alert(`Auction finalized...! (#${receipt.blockNumber} ,${receipt.transactionHash})`)
}, (error) => {
console.error(error)
})
})
}
}

View File

@@ -44,10 +44,6 @@ export default {
])
},
async mounted() {
},
methods: {
async createAuction() {
if(!this.tokenid) {

View File

@@ -1,8 +1,3 @@
/**
* caver-js library helps making connection with klaytn node.
* You can connect to specific klaytn node by setting 'rpcURL' value.
* default rpcURL is 'https://api.baobab.klaytn.net:8651'.
*/
import Caver from 'caver-js'
const AuctionsABI = require('@/contracts/Auctions.json').abi

View File

@@ -1,4 +1,4 @@
# bet-dapp
# numbergame-bapp
## Project setup
```

View File

@@ -36,9 +36,6 @@ export default {
...mapGetters('wallet', [
'klaytn'
])
},
mounted () {
},
methods: {

View File

@@ -50,10 +50,10 @@ export default {
this.setIsConnectWallet(false)
}
},
async getBalance () {
if (this.myaddress) {
const balance = await this.klaytn.getBalance(this.myaddress)
console.log(this.myaddress, balance)
const balance = await this.klaytn.getBalance(this.myaddress)
this.setBalance(balance)
}
},

View File

@@ -46,8 +46,7 @@
import { mapGetters, mapMutations } from 'vuex'
export default {
data: () => ({
// accessType: 'keystore',
data: () => ({
keystore: null,
password: '',
privateKey: null,
@@ -72,8 +71,7 @@ export default {
const fileReader = new FileReader()
fileReader.onload = (e) => {
try {
if (!this.checkValidKeystore(e.target.result)) {
// If key store file is invalid, show message "Invalid keystore file."
if (!this.checkValidKeystore(e.target.result)) {
alert('Invalid keystore file.')
return
}
@@ -90,11 +88,9 @@ export default {
async handleAddWallet () {
try {
// Access type2: access thorugh private key
if(this.privateKey) {
await this.klaytn.integrateWallet(this.privateKey)
} else {
// Access type1: access through keystore + password
await this.klaytn.loginWithKeystore(this.keystore, this.password)
}
this.getWalletInfo()

View File

@@ -1,8 +1,4 @@
/**
* caver-js library helps making connection with klaytn node.
* You can connect to specific klaytn node by setting 'rpcURL' value.
* default rpcURL is 'https://api.baobab.klaytn.net:8651'.
*/
import Caver from 'caver-js'
const deployedABI = require('./deployedABI.json')

View File

@@ -6,17 +6,14 @@ export default class KlaytnService {
async init () {
const walletFromSession = sessionStorage.getItem('walletInstance')
// If 'walletInstance' value exists, add it to caver's wallet
if (walletFromSession) {
try {
const address = JSON.parse(walletFromSession).address
cav.klay.accounts.wallet.add(JSON.parse(walletFromSession))
return address
} catch (e) {
// If value in sessionStorage is invalid wallet instance,
// remove it from sessionStorage.
} catch (e) {
sessionStorage.removeItem('walletInstance')
return false
}

View File

@@ -8,13 +8,13 @@ contract TodoFeed {
mapping(uint256 => TodoData) public todoMap;
struct TodoData {
uint256 todoId; // Unique token id
uint256 todoId;
address owner;
string title;
bytes photo; // Image source encoded in uint 8 array format
uint256 timestamp; // Uploaded time
bool isVerified; // check if is verified, default false.
address verifier; // verifier address
bytes photo;
uint256 timestamp;
bool isVerified;
address verifier;
}
function writeTodo(string title, bytes photo) public {
@@ -54,7 +54,7 @@ contract TodoFeed {
todoMap[todoId].todoId,
todoMap[todoId].owner,
todoMap[todoId].title,
todoMap[todoId].photo,
todoMap[todoId].photo,
todoMap[todoId].timestamp,
todoMap[todoId].isVerified,
todoMap[todoId].verifier);

View File

@@ -97,7 +97,7 @@ export default {
async mounted () {
await this.connect()
await this.getFeeds()
this.getFeeds()
},
methods: {
@@ -144,8 +144,7 @@ export default {
this.snackbarMsg = msg
this.snackbar = true
this.getFeeds()
this.getBalance()
this.getFeeds()
this.showWriteBox = false
},
@@ -155,8 +154,7 @@ export default {
this.snackbarMsg = `Complete.. blocknumber: #${receipt.blockNumber} , ${receipt.transactionHash}`
this.snackbar = true
this.getFeeds()
this.getBalance()
this.getFeeds()
})
},
@@ -164,6 +162,8 @@ export default {
this.klaytn.getFeeds((feed) => {
this.setTodos(feed)
})
this.getBalance()
}
}
}

View File

@@ -8,7 +8,7 @@
<v-col cols="16">
<h2>Integrated</h2>
<div class="address">{{walletInstance.address}}</div>
<v-btn outlined class="btnSubmit mt-3" @click="this.handleRemoveWallet">REMOVE WALLEt</v-btn>
<v-btn outlined class="btnSubmit mt-3" @click="this.handleRemoveWallet">REMOVE WALLET</v-btn>
</v-col>
</v-row>
</v-container>
@@ -64,8 +64,7 @@ export default {
data: () => ({
snackbar: false,
errorTxt: '',
// accessType: 'keystore',
keystore: null,
password: '',
privateKey: null,
@@ -81,11 +80,7 @@ export default {
'setIsConnectWallet',
'setMyAddress',
'setBalance'
]),
validate () {
},
]),
handleImport (e) {
const keystore = e.target.files[0]
@@ -93,8 +88,7 @@ export default {
const fileReader = new FileReader()
fileReader.onload = (e) => {
try {
if (!this.checkValidKeystore(e.target.result)) {
// If key store file is invalid, show message "Invalid keystore file."
if (!this.checkValidKeystore(e.target.result)) {
this.errorTxt = 'Invalid keystore file.'
this.snackbar = true
return
@@ -112,12 +106,10 @@ export default {
},
async handleAddWallet () {
try {
// Access type2: access thorugh private key
try {
if(this.privateKey) {
await this.klaytn.integrateWallet(this.privateKey)
} else {
// Access type1: access through keystore + password
} else {
await this.klaytn.loginWithKeystore(this.keystore, this.password)
}
this.getWalletInfo()

View File

@@ -85,8 +85,6 @@ export default {
try {
this.isLoading = true
await this.klaytn.writeTodo(this.title, this.imgFile, (receipt) => {
console.log(receipt)
const snackbarMsg = `Complete.. blocknumber: #${receipt.blockNumber} , ${receipt.transactionHash}`
this.$emit('success-write', snackbarMsg)
@@ -99,7 +97,6 @@ export default {
})
} catch (e) {
console.error(e)
this.isLoading = false
}
}

View File

@@ -1,8 +1,3 @@
/**
* caver-js library helps making connection with klaytn node.
* You can connect to specific klaytn node by setting 'rpcURL' value.
* default rpcURL is 'https://api.baobab.klaytn.net:8651'.
*/
import Caver from 'caver-js'
const deployedABI = require('./deployedABI.json')

View File

@@ -6,17 +6,14 @@ export default class KlaytnService {
async init () {
const walletFromSession = sessionStorage.getItem('walletInstance')
// If 'walletInstance' value exists, add it to caver's wallet
if (walletFromSession) {
try {
const address = JSON.parse(walletFromSession).address
cav.klay.accounts.wallet.add(JSON.parse(walletFromSession))
return address
} catch (e) {
// If value in sessionStorage is invalid wallet instance,
// remove it from sessionStorage.
} catch (e) {
sessionStorage.removeItem('walletInstance')
return false
}