Skip to content

Commit 63bd91c

Browse files
wangshijunwangshijun
committed
initial commit
1 parent 0a9e0f1 commit 63bd91c

16 files changed

+7434
-0
lines changed

‎.editorconfig

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
root = true
2+
3+
[*]
4+
indent_style = space
5+
indent_size = 2
6+
end_of_line = lf
7+
charset = utf-8
8+
trim_trailing_whitespace = true
9+
insert_final_newline = true

‎.gitignore

Lines changed: 22 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,22 @@
1+
.DS_Store
2+
node_modules
3+
/dist
4+
template
5+
6+
# local env files
7+
.env.local
8+
.env.*.local
9+
10+
# Log files
11+
npm-debug.log*
12+
yarn-debug.log*
13+
yarn-error.log*
14+
15+
# Editor directories and files
16+
.idea
17+
.vscode
18+
*.suo
19+
*.ntvs*
20+
*.njsproj
21+
*.sln
22+
*.sw*

‎README.md

Lines changed: 21 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,21 @@
1+
# ocap-vue-starter
2+
3+
## Project setup
4+
```
5+
yarn install
6+
```
7+
8+
### Compiles and hot-reloads for development
9+
```
10+
yarn run serve
11+
```
12+
13+
### Compiles and minifies for production
14+
```
15+
yarn run build
16+
```
17+
18+
### Lints and fixes files
19+
```
20+
yarn run lint
21+
```

‎babel.config.js

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
module.exports = {
2+
presets: ['@vue/app'],
3+
};

‎generator.js

Lines changed: 37 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,37 @@
1+
module.exports = (api, options, rootOptions) => {
2+
console.log(api, options, rootOptions);
3+
4+
// modify package.json fields
5+
api.extendPackage({
6+
dependencies: {
7+
'@arcblock/ocap-js': '^0.3.8',
8+
'babel-polyfill': '^6.26.0',
9+
},
10+
devDependencies: {
11+
'@vue/cli-plugin-babel': '^3.0.1',
12+
'@vue/cli-plugin-eslint': '^3.0.1',
13+
'@vue/cli-service': '^3.0.1',
14+
'vue-template-compiler': '^2.5.17',
15+
},
16+
eslintConfig: {
17+
root: true,
18+
env: {
19+
node: true,
20+
},
21+
extends: ['plugin:vue/essential', 'eslint:recommended'],
22+
rules: {},
23+
parserOptions: {
24+
parser: 'babel-eslint',
25+
},
26+
},
27+
postcss: {
28+
plugins: {
29+
autoprefixer: {},
30+
},
31+
},
32+
browserslist: ['> 1%', 'last 2 versions', 'not ie <= 8'],
33+
});
34+
35+
// copy and render all files in ./template with ejs
36+
api.render('./template');
37+
};

‎package.json

Lines changed: 65 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,65 @@
1+
{
2+
"name": "@arcblock/ocap-vue-starter",
3+
"version": "0.1.3",
4+
"files": [
5+
"template",
6+
"generator.js"
7+
],
8+
"repository": {
9+
"type": "git",
10+
"url": "https://github.com/ArcBlock/arc-javascript-sdk"
11+
},
12+
"author": "wangshijun <shijun@arcblock.io> (https://ocap.arcblock.io)",
13+
"homepage": "https://github.com/ArcBlock/arc-javascript-sdk",
14+
"bugs": {
15+
"url": "https://github.com/ArcBlock/arc-javascript-sdk/issues",
16+
"email": "shijun@arcblock.io"
17+
},
18+
"publishConfig": {
19+
"access": "public"
20+
},
21+
"contributors": [
22+
"wangshijun <shijun@arcblock.io> (https://ocap.arcblock.io)"
23+
],
24+
"scripts": {
25+
"prepublish": "cp -r src template/ && cp -r public template/ && cp .editorconfig template/_editorconfig && cp vue.config.js template/",
26+
"serve": "vue-cli-service serve",
27+
"build": "vue-cli-service build",
28+
"lint": "vue-cli-service lint"
29+
},
30+
"dependencies": {
31+
"@arcblock/ocap-js": "^0.3.8",
32+
"babel-polyfill": "^6.26.0",
33+
"vue": "^2.5.17"
34+
},
35+
"devDependencies": {
36+
"@vue/cli-plugin-babel": "^3.0.1",
37+
"@vue/cli-plugin-eslint": "^3.0.1",
38+
"@vue/cli-service": "^3.0.1",
39+
"vue-template-compiler": "^2.5.17"
40+
},
41+
"eslintConfig": {
42+
"root": true,
43+
"env": {
44+
"node": true
45+
},
46+
"extends": [
47+
"plugin:vue/essential",
48+
"eslint:recommended"
49+
],
50+
"rules": {},
51+
"parserOptions": {
52+
"parser": "babel-eslint"
53+
}
54+
},
55+
"postcss": {
56+
"plugins": {
57+
"autoprefixer": {}
58+
}
59+
},
60+
"browserslist": [
61+
"> 1%",
62+
"last 2 versions",
63+
"not ie <= 8"
64+
]
65+
}

‎preset.json

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,8 @@
1+
{
2+
"useConfigFiles": true,
3+
"cssPreprocessor": "postcss",
4+
"plugins": {
5+
"@vue/cli-plugin-babel": {},
6+
"@vue/cli-plugin-eslint": {}
7+
}
8+
}

‎public/favicon.ico

14.7 KB
Binary file not shown.

‎public/index.html

Lines changed: 17 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,17 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="utf-8">
5+
<meta http-equiv="X-UA-Compatible" content="IE=edge">
6+
<meta name="viewport" content="width=device-width,initial-scale=1.0">
7+
<link rel="icon" href="/public/favicon.ico">
8+
<title>ocap-vue-starter</title>
9+
</head>
10+
<body>
11+
<noscript>
12+
<strong>We're sorry but ocap-vue-starter doesn't work properly without JavaScript enabled. Please enable it to continue.</strong>
13+
</noscript>
14+
<div id="app"></div>
15+
<!-- built files will be auto injected -->
16+
</body>
17+
</html>

‎src/App.vue

Lines changed: 193 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,193 @@
1+
<template>
2+
<div id="app">
3+
<Header msg="Welcome to Your Vue.js App"/>
4+
5+
<div class="app-content">
6+
<h2>Welcome to OCAP Starter Project for Vue.js</h2>
7+
<p v-if="loading">
8+
Loading account summary for {{dataSource.name.toUpperCase()}} account:
9+
{{dataSource.demoAddress}}
10+
</p>
11+
<Loading v-if="!summary" />
12+
<div v-if="summary" class="app-json">
13+
<p>
14+
Account summary for {{dataSource.name.toUpperCase()}} account:
15+
{{dataSource.demoAddress}}
16+
</p>
17+
<pre>
18+
<code>{{JSON.stringify(summary, true, ' ')}}</code>
19+
</pre>
20+
</div>
21+
<p class="alert">
22+
Open BROWSER CONSOLE to view methods provided by OCAPClient.
23+
</p>
24+
</div>
25+
26+
<div class="app-content">
27+
<p>
28+
For guide and recipes on how to configure / customize this project,<br>
29+
check out the
30+
<a href="https://cli.vuejs.org" target="_blank" rel="noopener">vue-cli documentation</a>.
31+
</p>
32+
<div class="vue-sections">
33+
<div class="vue-section">
34+
<h3>Installed CLI Plugins</h3>
35+
<ul>
36+
<li><a href="https://github.com/vuejs/vue-cli/tree/dev/packages/%40vue/cli-plugin-babel" target="_blank" rel="noopener">babel</a></li>
37+
<li><a href="https://github.com/vuejs/vue-cli/tree/dev/packages/%40vue/cli-plugin-eslint" target="_blank" rel="noopener">eslint</a></li>
38+
</ul>
39+
</div>
40+
<div class="vue-section">
41+
<h3>Vue Links</h3>
42+
<ul>
43+
<li><a href="https://vuejs.org" target="_blank" rel="noopener">Core Docs</a></li>
44+
<li><a href="https://forum.vuejs.org" target="_blank" rel="noopener">Forum</a></li>
45+
<li><a href="https://chat.vuejs.org" target="_blank" rel="noopener">Community Chat</a></li>
46+
<li><a href="https://twitter.com/vuejs" target="_blank" rel="noopener">Twitter</a></li>
47+
<li><a href="https://news.vuejs.org" target="_blank" rel="noopener">News</a></li>
48+
</ul>
49+
</div>
50+
<div class="vue-section">
51+
<h3>Vue Libs</h3>
52+
<ul>
53+
<li><a href="https://router.vuejs.org" target="_blank" rel="noopener">vue-router</a></li>
54+
<li><a href="https://vuex.vuejs.org" target="_blank" rel="noopener">vuex</a></li>
55+
<li><a href="https://github.com/vuejs/vue-devtools#vue-devtools" target="_blank" rel="noopener">vue-devtools</a></li>
56+
<li><a href="https://vue-loader.vuejs.org" target="_blank" rel="noopener">vue-loader</a></li>
57+
<li><a href="https://github.com/vuejs/awesome-vue" target="_blank" rel="noopener">awesome-vue</a></li>
58+
</ul>
59+
</div>
60+
</div>
61+
</div>
62+
</div>
63+
</template>
64+
65+
<script>
66+
import Header from './components/Header.vue';
67+
import Loading from './components/Loading.vue';
68+
import OCAPClient from '@arcblock/ocap-js';
69+
70+
const dataSources = [
71+
{
72+
name: 'btc',
73+
demoAddress: '1A1zP1eP5QGefi2DMPTfTL5SLmv7DivfNa',
74+
},
75+
{
76+
name: 'eth',
77+
demoAddress: '0xe65d3128feafd14d472442608daf94bceb91e333',
78+
},
79+
];
80+
81+
// Create clients for BTC and ETH
82+
const clients = dataSources.reduce((obj, ds) => {
83+
obj[ds.name] = new OCAPClient({
84+
dataSource: ds.name,
85+
enableSubscription: true,
86+
enableMutation: false,
87+
});
88+
89+
return obj;
90+
}, {});
91+
92+
export default {
93+
name: 'app',
94+
components: {
95+
Header,
96+
Loading,
97+
},
98+
data() {
99+
return {
100+
dataSource: dataSources[0],
101+
summary: null,
102+
message: null,
103+
timestamp: null,
104+
loading: false,
105+
};
106+
},
107+
108+
async mounted() {
109+
this.loading = true;
110+
111+
const client = this.getClient();
112+
console.log(client);
113+
114+
const summary = await client.accountByAddress({
115+
address: this.dataSource.demoAddress,
116+
});
117+
118+
// Subscription
119+
// const subscription = await client.newBlockMined();
120+
// subscription.on('data', data => {
121+
// this.timestamp = new Date();
122+
// this.message = data;
123+
// });
124+
125+
this.loading = false;
126+
this.summary = summary;
127+
},
128+
129+
methods: {
130+
getClient() {
131+
return clients[this.dataSource.name];
132+
},
133+
},
134+
};
135+
</script>
136+
137+
<style>
138+
body {
139+
margin: 0;
140+
padding: 0;
141+
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen', 'Ubuntu',
142+
'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue', sans-serif;
143+
-webkit-font-smoothing: antialiased;
144+
-moz-osx-font-smoothing: grayscale;
145+
font-size: 16px;
146+
}
147+
148+
code {
149+
font-family: source-code-pro, Menlo, Monaco, Consolas, 'Courier New', monospace;
150+
}
151+
152+
ul,
153+
li {
154+
list-style: none;
155+
margin: 0;
156+
padding: 0;
157+
}
158+
159+
#app {
160+
font-family: 'Avenir', Helvetica, Arial, sans-serif;
161+
-webkit-font-smoothing: antialiased;
162+
-moz-osx-font-smoothing: grayscale;
163+
text-align: center;
164+
color: #2c3e50;
165+
}
166+
167+
.app-content {
168+
padding: 0 10%;
169+
text-align: left;
170+
margin-bottom: 90px;
171+
}
172+
173+
.app-json pre {
174+
background: #f0f0f0;
175+
padding: 10px;
176+
border: 1px solid #cccccc;
177+
border-radius: 5px;
178+
}
179+
180+
.vue-sections {
181+
display: flex;
182+
justify-content: space-between;
183+
align-items: flex-start;
184+
}
185+
186+
.vue-section {
187+
text-align: left;
188+
}
189+
190+
.alert {
191+
color: red;
192+
}
193+
</style>

‎src/assets/logo.png

118 KB
Loading

0 commit comments

Comments
 (0)