├── .eslintrc
├── .gitignore
├── .prettierrc
├── LICENSE
├── README.md
├── package.json
└── tutorials
    ├── 00_getting_started
        └── README.md
    ├── 01_blog_feed
        ├── README.md
        ├── index.js
        ├── package-lock.json
        ├── package.json
        ├── public
        │   ├── app.js
        │   ├── app.scss
        │   └── index.html
        └── webpack.config.js
    ├── 02_steemconnect
        ├── README.md
        ├── images
        │   ├── steemconnect_account_create.png
        │   ├── steemconnect_dashboard.png
        │   ├── steemconnect_login.png
        │   ├── steemconnect_myapps.png
        │   ├── steemconnect_new_app.png
        │   └── steemconnect_signin.png
        ├── index.js
        ├── package-lock.json
        ├── package.json
        ├── public
        │   ├── app.js
        │   ├── index.html
        │   └── style.css
        └── webpack.config.js
    ├── 03_client_signing
        ├── README.md
        ├── images
        │   └── overview.png
        ├── index.js
        ├── package-lock.json
        ├── package.json
        ├── public
        │   ├── app.js
        │   ├── index.html
        │   └── style.scss
        └── webpack.config.js
    ├── 04_get_posts
        ├── README.md
        ├── images
        │   └── Step-01-UI.png
        ├── index.js
        ├── package-lock.json
        ├── package.json
        ├── public
        │   ├── app.js
        │   ├── index.html
        │   └── style.scss
        └── webpack.config.js
    ├── 05_get_post_details
        ├── README.md
        ├── index.js
        ├── package-lock.json
        ├── package.json
        ├── public
        │   ├── app.js
        │   ├── index.css
        │   ├── index.html
        │   └── style.scss
        └── webpack.config.js
    ├── 06_get_voters_list_on_post
        ├── README.md
        ├── index.js
        ├── package-lock.json
        ├── package.json
        ├── public
        │   ├── app.js
        │   ├── index.css
        │   ├── index.html
        │   └── style.scss
        └── webpack.config.js
    ├── 07_get_post_comments
        ├── README.md
        ├── index.js
        ├── package-lock.json
        ├── package.json
        ├── public
        │   ├── app.js
        │   ├── index.css
        │   ├── index.html
        │   └── style.scss
        └── webpack.config.js
    ├── 08_get_account_replies
        ├── README.md
        ├── index.js
        ├── package-lock.json
        ├── package.json
        ├── public
        │   ├── app.js
        │   ├── index.css
        │   ├── index.html
        │   └── style.scss
        └── webpack.config.js
    ├── 09_get_account_comments
        ├── README.md
        ├── index.js
        ├── package-lock.json
        ├── package.json
        ├── public
        │   ├── app.js
        │   ├── index.css
        │   ├── index.html
        │   └── style.scss
        └── webpack.config.js
    ├── 10_submit_post
        ├── README.md
        ├── index.js
        ├── package-lock.json
        ├── package.json
        ├── public
        │   ├── app.js
        │   ├── index.html
        │   └── style.scss
        └── webpack.config.js
    ├── 11_submit_comment_reply
        ├── README.md
        ├── images
        │   ├── comment_reply_successful_console_output.png
        │   └── comment_reply_user_input.png
        ├── index.js
        ├── package.json
        ├── public
        │   ├── app.js
        │   ├── index.html
        │   └── style.scss
        └── webpack.config.js
    ├── 12_edit_content_patching
        ├── README.md
        ├── index.js
        ├── package-lock.json
        ├── package.json
        ├── public
        │   ├── app.js
        │   ├── index.html
        │   └── style.scss
        └── webpack.config.js
    ├── 13_stream_blockchain_transactions
        ├── README.md
        ├── index.js
        ├── package-lock.json
        ├── package.json
        ├── public
        │   ├── app.js
        │   ├── index.html
        │   └── style.scss
        └── webpack.config.js
    ├── 14_reblogging_post
        ├── README.md
        ├── index.js
        ├── package.json
        ├── public
        │   ├── app.js
        │   ├── index.css
        │   ├── index.html
        │   └── style.scss
        └── webpack.config.js
    ├── 15_search_accounts
        ├── README.md
        ├── index.js
        ├── package-lock.json
        ├── package.json
        ├── public
        │   ├── app.js
        │   ├── index.css
        │   ├── index.html
        │   └── style.scss
        └── webpack.config.js
    ├── 16_search_tags
        ├── README.md
        ├── index.js
        ├── package-lock.json
        ├── package.json
        ├── public
        │   ├── app.js
        │   ├── index.css
        │   ├── index.html
        │   └── style.scss
        └── webpack.config.js
    ├── 17_vote_on_content
        ├── README.md
        ├── index.js
        ├── package.json
        ├── public
        │   ├── app.js
        │   ├── index.html
        │   └── style.scss
        └── webpack.config.js
    ├── 18_follow_a_user
        ├── README.md
        ├── index.js
        ├── package.json
        ├── public
        │   ├── app.js
        │   ├── index.html
        │   └── style.scss
        └── webpack.config.js
    ├── 19_get_follower_and_following_list
        ├── README.md
        ├── index.js
        ├── package.json
        ├── public
        │   ├── app.js
        │   ├── index.html
        │   └── style.scss
        └── webpack.config.js
    ├── 20_account_reputation
        ├── README.md
        ├── index.js
        ├── package-lock.json
        ├── package.json
        ├── public
        │   ├── app.js
        │   ├── index.css
        │   ├── index.html
        │   └── style.scss
        └── webpack.config.js
    ├── 21_transfer_steem_and_sbd
        ├── README.md
        ├── index.js
        ├── package.json
        ├── public
        │   ├── app.js
        │   ├── index.html
        │   └── style.scss
        └── webpack.config.js
    ├── 22_witness_listing_and_voting
        ├── README.md
        ├── index.js
        ├── package.json
        ├── public
        │   ├── app.js
        │   ├── index.html
        │   └── style.scss
        └── webpack.config.js
    ├── 23_claim_rewards
        ├── README.md
        ├── index.js
        ├── package-lock.json
        ├── package.json
        ├── public
        │   ├── app.js
        │   ├── index.css
        │   ├── index.html
        │   └── style.scss
        └── webpack.config.js
    ├── 24_power_up_steem
        ├── README.md
        ├── index.js
        ├── package-lock.json
        ├── package.json
        ├── public
        │   ├── app.js
        │   ├── index.css
        │   ├── index.html
        │   └── style.scss
        └── webpack.config.js
    ├── 25_power_down
        ├── README.md
        ├── index.js
        ├── package-lock.json
        ├── package.json
        ├── public
        │   ├── app.js
        │   ├── index.css
        │   ├── index.html
        │   └── style.scss
        └── webpack.config.js
    ├── 26_create_account
        ├── README.md
        ├── index.js
        ├── package-lock.json
        ├── package.json
        ├── public
        │   ├── app.js
        │   ├── index.css
        │   ├── index.html
        │   └── style.scss
        └── webpack.config.js
    ├── 27_delegate_power
        ├── README.md
        ├── index.js
        ├── package.json
        ├── public
        │   ├── app.js
        │   ├── index.css
        │   ├── index.html
        │   └── style.scss
        └── webpack.config.js
    ├── 28_set_withdraw_route
        ├── README.md
        ├── index.js
        ├── package-lock.json
        ├── package.json
        ├── public
        │   ├── app.js
        │   ├── index.css
        │   ├── index.html
        │   └── style.scss
        └── webpack.config.js
    ├── 29_get_delegations_by_user
        ├── README.md
        ├── index.js
        ├── package.json
        ├── public
        │   ├── app.js
        │   ├── index.html
        │   └── style.scss
        └── webpack.config.js
    ├── 30_grant_posting_permission
        ├── README.md
        ├── index.js
        ├── package.json
        ├── public
        │   ├── app.js
        │   ├── index.html
        │   └── style.scss
        └── webpack.config.js
    ├── 31_grant_active_permission
        ├── README.md
        ├── index.js
        ├── package.json
        ├── public
        │   ├── app.js
        │   ├── index.html
        │   └── style.scss
        └── webpack.config.js
    ├── 32_convert_sbd_to_steem
        ├── README.md
        ├── index.js
        ├── package.json
        ├── public
        │   ├── app.js
        │   ├── index.html
        │   └── style.scss
        └── webpack.config.js
    ├── 34_get_state_replacement_api
        ├── README.md
        ├── index.js
        ├── package.json
        ├── public
        │   ├── app.js
        │   ├── index.css
        │   ├── index.html
        │   └── style.scss
        └── webpack.config.js
    ├── README.md
    ├── configuration.js
    └── tutorial_structure.md


/.eslintrc:
--------------------------------------------------------------------------------
 1 | {
 2 |   "parser": "babel-eslint",
 3 |   "extends": ["eslint:recommended"],
 4 |   "env": {
 5 |     "browser": true,
 6 |     "es6": true,
 7 |     "node": true
 8 |   },
 9 |   "rules": {
10 |     "no-unused-vars": 1,
11 |     "no-redeclare": 1,
12 |     "no-console": 0
13 |   }
14 | }


--------------------------------------------------------------------------------
/.gitignore:
--------------------------------------------------------------------------------
 1 | # Logs
 2 | logs
 3 | *.log
 4 | npm-debug.log*
 5 | yarn-debug.log*
 6 | yarn-error.log*
 7 | 
 8 | # Runtime data
 9 | pids
10 | *.pid
11 | *.seed
12 | *.pid.lock
13 | 
14 | # Directory for instrumented libs generated by jscoverage/JSCover
15 | lib-cov
16 | 
17 | # Coverage directory used by tools like istanbul
18 | coverage
19 | 
20 | # nyc test coverage
21 | .nyc_output
22 | 
23 | # Grunt intermediate storage (http://gruntjs.com/creating-plugins#storing-task-files)
24 | .grunt
25 | 
26 | # Bower dependency directory (https://bower.io/)
27 | bower_components
28 | 
29 | # node-waf configuration
30 | .lock-wscript
31 | 
32 | # Compiled binary addons (https://nodejs.org/api/addons.html)
33 | build/Release
34 | 
35 | # Dependency directories
36 | node_modules/
37 | jspm_packages/
38 | 
39 | # Typescript v1 declaration files
40 | typings/
41 | 
42 | # Optional npm cache directory
43 | .npm
44 | 
45 | # Optional eslint cache
46 | .eslintcache
47 | 
48 | # Optional REPL history
49 | .node_repl_history
50 | 
51 | # Output of 'npm pack'
52 | *.tgz
53 | 
54 | # Yarn Integrity file
55 | .yarn-integrity
56 | 
57 | # dotenv environment variables file
58 | .env
59 | 
60 | # next.js build output
61 | .next
62 | 
63 | # webpack bundles
64 | bundle.js
65 | bundle.js.map
66 | 


--------------------------------------------------------------------------------
/.prettierrc:
--------------------------------------------------------------------------------
1 | {
2 |     "tabWidth": 4,
3 |     "singleQuote": true,
4 |     "trailingComma": "es5"
5 | }


--------------------------------------------------------------------------------
/LICENSE:
--------------------------------------------------------------------------------
 1 | MIT License
 2 | 
 3 | Copyright (c) 2018 
 4 | 
 5 | Permission is hereby granted, free of charge, to any person obtaining a copy
 6 | of this software and associated documentation files (the "Software"), to deal
 7 | in the Software without restriction, including without limitation the rights
 8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
 9 | copies of the Software, and to permit persons to whom the Software is
10 | furnished to do so, subject to the following conditions:
11 | 
12 | The above copyright notice and this permission notice shall be included in all
13 | copies or substantial portions of the Software.
14 | 
15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
21 | SOFTWARE.
22 | 


--------------------------------------------------------------------------------
/package.json:
--------------------------------------------------------------------------------
 1 | {
 2 |     "scripts": {
 3 |         "lint":
 4 |             "eslint -c .eslintrc —ext .js --ignore-path .gitignore --fix ./tutorials/",
 5 |         "fmt": "prettier --write ./tutorials/*/*",
 6 |         "precommit": "lint-staged"
 7 |     },
 8 |     "lint-staged": {
 9 |         "*.{png,jpeg,jpg,gif,svg}": ["imagemin-lint-staged", "git add"],
10 |         "*.{js,json,css,md,lock}": ["prettier --write", "git add"]
11 |     },
12 |     "devDependencies": {
13 |         "babel-eslint": "^8.0.3",
14 |         "babel-jest": "^21.2.0",
15 |         "babel-preset-react-native": "^4.0.0",
16 |         "eslint": "^4.12.1",
17 |         "eslint-config-airbnb-base": "^12.1.0",
18 |         "eslint-plugin-babel": "^4.1.2",
19 |         "eslint-plugin-import": "^2.10.0",
20 |         "husky": "^0.14.3",
21 |         "imagemin-lint-staged": "^0.3.0",
22 |         "lint-staged": "^7.1.0",
23 |         "prettier": "1.11.1"
24 |     }
25 | }
26 | 


--------------------------------------------------------------------------------
/tutorials/00_getting_started/README.md:
--------------------------------------------------------------------------------
 1 | # Getting Started
 2 | 
 3 | Prepare your development environment to use Javascript with the Steem blockchain.
 4 | 
 5 | For Javascript tutorials, we will use the opensource library [dsteem](https://github.com/steemit/dsteem).
 6 | 
 7 | ### Node.js
 8 | 
 9 | To get the most out of these tutorials, you should be familiar with [Node.js](https://nodejs.org/en/), [ES6](https://babeljs.io/learn-es2015/) aka [es2015](http://www.ecma-international.org/ecma-262/6.0/), the DOM, and modern Javascript programming practices.
10 | You can still learn a lot of these if they aren't in your base skill-set; it'll be much easier if they are.
11 | 
12 | ### Your Dev Environment
13 | 
14 | These tutorials require [Node.js 8.7+](https://nodejs.org/en/download/). [Yarn](https://yarnpkg.com/en/) is nice, but not required. Runnable versions of the tutorials are located [in this github repo](https://github.com/steemit/devportal-tutorials-js).
15 | If you haven't chosen an editor, you can use [Atom](https://atom.io/), [Sublime](https://www.sublimetext.com/), [Intellij](https://www.jetbrains.com/idea/), [Vi](https://en.wikipedia.org/wiki/Vi), etc.
16 | 
17 | If you want to keep multiple versions of Node on your system try [Node Version Manager](https://github.com/creationix/nvm).
18 | 
19 | ### Running a typical Tutorial
20 | 
21 | Let's say you wanted to run the very [first tutorial](../01_blog_feed), `01_blog_feed`. Here's how you'd do it:
22 | 
23 | 1.  From Bash:
24 | 
25 |     ```bash
26 |     git clone https://github.com/steemit/devportal-tutorials-js.git
27 | 
28 |     cd devportal-tutorials-js/tutorials/01_blog_feed
29 |     npm i
30 |     npm run dev-server
31 |     ```
32 | 
33 | 1.  open http://localhost:3000/ in your web browser
34 | 
35 | ```
36 | ### Github
37 | 
38 | If you'd rather clone projects in a windowed environment rather than the terminal, consider [Github Desktop](https://desktop.github.com/).
39 | ```
40 | 


--------------------------------------------------------------------------------
/tutorials/01_blog_feed/index.js:
--------------------------------------------------------------------------------
1 | const Koa = require('koa');
2 | const app = new Koa();
3 | const serve = require('koa-static');
4 | app.use(serve('./public'));
5 | 
6 | app.listen(3000);
7 | 
8 | console.log('listening on port 3000');
9 | 


--------------------------------------------------------------------------------
/tutorials/01_blog_feed/package.json:
--------------------------------------------------------------------------------
 1 | {
 2 |     "name": "01_blog_feed",
 3 |     "version": "0.0.1",
 4 |     "description": "Pull the list of a user's posts from steem",
 5 |     "main": "server.js",
 6 |     "scripts": {
 7 |         "start": "webpack && node ./index.js",
 8 |         "test": "echo \"Error: no test specified\" && exit 1",
 9 |         "dev-server":
10 |             "./node_modules/.bin/webpack-dev-server --mode development --content-base ./public --port 3000"
11 |     },
12 |     "author": "",
13 |     "license": "ISC",
14 |     "dependencies": {
15 |         "bootstrap": "^4.1.3",
16 |         "dsteem": "^0.10.1",
17 |         "koa": "^2.5.3",
18 |         "koa-static": "^5.0.0",
19 |         "webpack-serve": "^2.0.2"
20 |     },
21 |     "devDependencies": {
22 |         "css-loader": "^1.0.0",
23 |         "extract-text-webpack-plugin": "^3.0.2",
24 |         "node-sass": "^4.9.3",
25 |         "sass-loader": "^7.1.0",
26 |         "style-loader": "^0.23.1",
27 |         "webpack": "^4.20.2",
28 |         "webpack-cli": "^3.1.2",
29 |         "webpack-dev-server": "^3.1.9"
30 |     }
31 | }
32 | 


--------------------------------------------------------------------------------
/tutorials/01_blog_feed/public/app.js:
--------------------------------------------------------------------------------
 1 | import { Client } from 'dsteem';
 2 | 
 3 | const client = new Client('https://api.steemit.com');
 4 | 
 5 | function fetchBlog() {
 6 |     const query = {
 7 |         tag: 'steemitblog',
 8 |         limit: 5,
 9 |     };
10 |     client.database
11 |         .getDiscussions('blog', query)
12 |         .then(result => {
13 |             var posts = [];
14 |             result.forEach(post => {
15 |                 const json = JSON.parse(post.json_metadata);
16 |                 const image = json.image ? json.image[0] : '';
17 |                 const title = post.title;
18 |                 const author = post.author;
19 |                 const created = new Date(post.created).toDateString();
20 |                 posts.push(
21 |                     `<div class="list-group-item"><h4 class="list-group-item-heading">${title}</h4><p>by ${author}</p><center><img src="${image}" class="img-responsive center-block" style="max-width: 450px"/></center><p class="list-group-item-text text-right text-nowrap">${created}</p></div>`
22 |                 );
23 |             });
24 | 
25 |             document.getElementById('postList').innerHTML = posts.join('');
26 |         })
27 |         .catch(err => {
28 |             alert('Error occured' + err);
29 |         });
30 | }
31 | 
32 | window.onload = fetchBlog();
33 | 


--------------------------------------------------------------------------------
/tutorials/01_blog_feed/public/app.scss:
--------------------------------------------------------------------------------
1 | @import "~bootstrap/dist/css/bootstrap";
2 | 


--------------------------------------------------------------------------------
/tutorials/01_blog_feed/public/index.html:
--------------------------------------------------------------------------------
 1 | <html>
 2 | <head><title>User blog</title>
 3 |     <script src="bundle.js"></script>
 4 | </head>
 5 | <body>
 6 | <div class="container">
 7 |     <h2>Welcome to my blog!</h2>
 8 |     <div class="list-group" id="postList"></div>
 9 | </body>
10 | </html>


--------------------------------------------------------------------------------
/tutorials/01_blog_feed/webpack.config.js:
--------------------------------------------------------------------------------
 1 | var path = require('path');
 2 | module.exports = {
 3 |     entry: ['./public/app.js', './public/app.scss'],
 4 |     output: {
 5 |         path: path.resolve(__dirname, 'public'),
 6 |         filename: 'bundle.js',
 7 |     },
 8 |     devtool: 'source-map',
 9 |     module: {
10 |         rules: [
11 |             {
12 |                 test: /\.scss$/,
13 |                 use: [
14 |                     {
15 |                         loader: 'style-loader', // creates style nodes from JS strings
16 |                     },
17 |                     {
18 |                         loader: 'css-loader', // translates CSS into CommonJS
19 |                     },
20 |                     {
21 |                         loader: 'sass-loader', // compiles Sass to CSS
22 |                     },
23 |                 ],
24 |             },
25 |         ],
26 |     },
27 | };
28 | 


--------------------------------------------------------------------------------
/tutorials/02_steemconnect/images/steemconnect_account_create.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/steemit/devportal-tutorials-js/f20dcc475775def4488daf5b66b5f1bd35bdb8c5/tutorials/02_steemconnect/images/steemconnect_account_create.png


--------------------------------------------------------------------------------
/tutorials/02_steemconnect/images/steemconnect_dashboard.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/steemit/devportal-tutorials-js/f20dcc475775def4488daf5b66b5f1bd35bdb8c5/tutorials/02_steemconnect/images/steemconnect_dashboard.png


--------------------------------------------------------------------------------
/tutorials/02_steemconnect/images/steemconnect_login.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/steemit/devportal-tutorials-js/f20dcc475775def4488daf5b66b5f1bd35bdb8c5/tutorials/02_steemconnect/images/steemconnect_login.png


--------------------------------------------------------------------------------
/tutorials/02_steemconnect/images/steemconnect_myapps.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/steemit/devportal-tutorials-js/f20dcc475775def4488daf5b66b5f1bd35bdb8c5/tutorials/02_steemconnect/images/steemconnect_myapps.png


--------------------------------------------------------------------------------
/tutorials/02_steemconnect/images/steemconnect_new_app.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/steemit/devportal-tutorials-js/f20dcc475775def4488daf5b66b5f1bd35bdb8c5/tutorials/02_steemconnect/images/steemconnect_new_app.png


--------------------------------------------------------------------------------
/tutorials/02_steemconnect/images/steemconnect_signin.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/steemit/devportal-tutorials-js/f20dcc475775def4488daf5b66b5f1bd35bdb8c5/tutorials/02_steemconnect/images/steemconnect_signin.png


--------------------------------------------------------------------------------
/tutorials/02_steemconnect/index.js:
--------------------------------------------------------------------------------
1 | const Koa = require('koa');
2 | const app = new Koa();
3 | const serve = require('koa-static');
4 | app.use(serve('./public'));
5 | 
6 | app.listen(3000);
7 | 
8 | console.log('listening on port 3000');
9 | 


--------------------------------------------------------------------------------
/tutorials/02_steemconnect/package.json:
--------------------------------------------------------------------------------
 1 | {
 2 |     "name": "02_steemconnect",
 3 |     "version": "1.0.0",
 4 |     "description": "Getting started with Steemconnect",
 5 |     "main": "index.js",
 6 |     "scripts": {
 7 |         "start": "webpack && node ./index.js",
 8 |         "test": "echo \"Error: no test specified\" && exit 1",
 9 |         "dev-server":
10 |             "./node_modules/.bin/webpack-dev-server --mode development --content-base ./public --port 3000"
11 |     },
12 |     "author": "",
13 |     "license": "ISC",
14 |     "dependencies": {
15 |         "koa": "^2.5.3",
16 |         "koa-static": "^5.0.0",
17 |         "sc2-sdk": "^2.0.1"
18 |     },
19 |     "devDependencies": {
20 |         "webpack": "^4.20.2",
21 |         "webpack-cli": "^3.1.2",
22 |         "webpack-dev-server": "^3.1.9"
23 |     }
24 | }
25 | 


--------------------------------------------------------------------------------
/tutorials/02_steemconnect/public/app.js:
--------------------------------------------------------------------------------
 1 | const sc2 = require('sc2-sdk');
 2 | 
 3 | // init steemconnect
 4 | let api = sc2.Initialize({
 5 |     app: 'demo-app',
 6 |     callbackURL: 'http://localhost:3000',
 7 |     accessToken: 'access_token',
 8 |     scope: ['vote', 'comment'],
 9 | });
10 | // get login URL
11 | let link = api.getLoginURL();
12 | 
13 | // acquire access_token and username after authorization
14 | let access_token = new URLSearchParams(document.location.search).get(
15 |     'access_token'
16 | );
17 | let username = new URLSearchParams(document.location.search).get('username');
18 | 
19 | let lt = '',
20 |     ut = '',
21 |     lo = '',
22 |     jt = '',
23 |     t = '';
24 | if (access_token) {
25 |     // set access token after login
26 |     api.setAccessToken(access_token);
27 | 
28 |     // Logout button
29 |     lt = `<a href="#" onclick='logOut()'>Log Out</a>`;
30 |     // User name after successfull login
31 |     ut = `<p>User: <b>${username}</b></p>`;
32 |     // Get user details button
33 |     lo = `<a href="#" onclick='getUserDetails()'>Get User details</a>`;
34 |     // User details JSON output
35 |     jt = `<pre id="userDetailsJSON"></pre>`;
36 | 
37 |     t = lt + ut + lo + jt;
38 | } else {
39 |     // Login button
40 |     t = `<a href=${link}>Log In</a>`;
41 | }
42 | 
43 | // set template
44 | document.getElementById('content').innerHTML = t;
45 | 
46 | // Logout function, revoke access token
47 | window.logOut = () => {
48 |     api.revokeToken(function(err, res) {
49 |         if (res && res.success) {
50 |             access_token = null;
51 |             document.location.href = '/';
52 |         }
53 |     });
54 |     return false;
55 | };
56 | 
57 | // Get User details function, returns user data via Steemconnect API
58 | window.getUserDetails = () => {
59 |     api.me(function(err, res) {
60 |         if (res) {
61 |             const user = JSON.stringify(res, undefined, 2);
62 |             document.getElementById('userDetailsJSON').innerHTML = user;
63 |         }
64 |     });
65 | };
66 | 


--------------------------------------------------------------------------------
/tutorials/02_steemconnect/public/index.html:
--------------------------------------------------------------------------------
 1 | <html>
 2 |     <head>
 3 |         <title>Getting started with Steemconnect</title>
 4 |     </head>
 5 |     <body>
 6 |         <h1>Steemconnect</h1>
 7 |         <div id="content"></div>
 8 |         <script src="bundle.js"></script>
 9 |         <link rel="stylesheet" type="text/css" href="style.css">
10 |     </body>
11 | </html>


--------------------------------------------------------------------------------
/tutorials/02_steemconnect/public/style.css:
--------------------------------------------------------------------------------
 1 | a:link, a:visited {
 2 |     background-color: gray;
 3 |     color: white;
 4 |     padding: 7px 12px;
 5 |     text-align: center;
 6 |     text-decoration: none;
 7 |     display: inline-block;
 8 | }
 9 | a:hover, a:active {
10 |     background-color: blue;
11 | }


--------------------------------------------------------------------------------
/tutorials/02_steemconnect/webpack.config.js:
--------------------------------------------------------------------------------
1 | var path = require('path');
2 | module.exports = {
3 |     entry: './public/app.js',
4 |     output: {
5 |         path: path.resolve(__dirname, 'public'),
6 |         filename: 'bundle.js',
7 |     },
8 | };
9 | 


--------------------------------------------------------------------------------
/tutorials/03_client_signing/images/overview.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/steemit/devportal-tutorials-js/f20dcc475775def4488daf5b66b5f1bd35bdb8c5/tutorials/03_client_signing/images/overview.png


--------------------------------------------------------------------------------
/tutorials/03_client_signing/index.js:
--------------------------------------------------------------------------------
1 | const Koa = require('koa');
2 | const app = new Koa();
3 | const serve = require('koa-static');
4 | app.use(serve('./public'));
5 | 
6 | app.listen(3000);
7 | 
8 | console.log('listening on port 3000');
9 | 


--------------------------------------------------------------------------------
/tutorials/03_client_signing/package.json:
--------------------------------------------------------------------------------
 1 | {
 2 |     "name": "03_client_signing",
 3 |     "version": "1.0.0",
 4 |     "description": "Client signing on Steem",
 5 |     "main": "index.js",
 6 |     "scripts": {
 7 |         "start": "webpack && node ./index.js",
 8 |         "test": "echo \"Error: no test specified\" && exit 1",
 9 |         "dev-server":
10 |             "./node_modules/.bin/webpack-dev-server --mode development --content-base ./public --port 3000"
11 |     },
12 |     "author": "",
13 |     "license": "ISC",
14 |     "dependencies": {
15 |         "bootstrap": "^4.1.3",
16 |         "dsteem": "^0.10.1",
17 |         "koa": "^2.5.3",
18 |         "koa-static": "^5.0.0"
19 |     },
20 |     "devDependencies": {
21 |         "css-loader": "^1.0.0",
22 |         "node-sass": "^4.9.3",
23 |         "postcss-loader": "^3.0.0",
24 |         "precss": "^3.1.2",
25 |         "sass-loader": "^7.1.0",
26 |         "style-loader": "^0.23.1",
27 |         "webpack": "^4.20.2",
28 |         "webpack-cli": "^3.1.2",
29 |         "webpack-dev-server": "^3.1.9"
30 |     }
31 | }
32 | 


--------------------------------------------------------------------------------
/tutorials/03_client_signing/public/index.html:
--------------------------------------------------------------------------------
 1 | <html>
 2 |     <head>
 3 |         <title>Client-side transaction signing</title>
 4 |         <script src="bundle.js"></script>
 5 |     </head>
 6 |     <body>
 7 |     	<div class="container" id="content">
 8 | 			<div class="p-3">
 9 | 				<div class="alert alert-primary" id="ui-message">
10 | 				</div>
11 | 			</div>
12 | 			<div class="p-3">
13 | 				<div class="pt-3">
14 | 					<!--List of accounts with their posting privateKey on Testnet-->
15 | 					<select class="custom-select" id="account" onchange="accountChange()">
16 | 					  <option selected>Select account to operate with</option>
17 | 					</select>		
18 | 				</div>
19 | 				<div class="pt-3">
20 | 					<!--List of operations-->
21 | 					<select class="custom-select" id="optype" onchange="opChange()">
22 | 					  <option selected>Select operation type</option>
23 | 					  <option value="vote">Vote</option>
24 | 					  <option value="follow">Follow</option>
25 | 					  <option value="reblog">Reblog</option>
26 | 					</select>		
27 | 				</div>
28 | 				<div class="input-group pt-3">
29 | 				  <div class="input-group-prepend">
30 | 				    <span class="input-group-text">Operation</span>
31 | 				  </div>
32 | 				</div>
33 | 					<pre id="OpInput" aria-label="OpInput"></pre>
34 | 				<div class="input-group pt-3">
35 | 				  <div class="input-group-prepend">
36 | 				    <span class="input-group-text">Transaction</span>
37 | 				  </div>
38 | 
39 | 				</div>
40 | 				<pre id="TxOutput" aria-label="TxOutput"></pre>
41 | 				<div class="input-group pt-3">
42 | 				  <div class="input-group-prepend">
43 | 				    <span class="input-group-text">Result</span>
44 | 				  </div>
45 | 				  <pre class="form-control" aria-label="ResOutput" style="display: inline-block;" id="ResOutput"></pre>
46 | 				</div>
47 | 				<div class="pt-3">
48 | 					<button type="button" class="btn btn-primary" onclick="generateTx()">Generate Transaction</button>
49 | 					<button type="button" class="btn btn-secondary" onclick="signTx()">Sign Transaction</button>
50 | 					<button type="button" class="btn btn-info" onclick="verifyTx()" id="verifyBtn">Verify Signature</button>
51 | 					<button type="button" class="btn btn-success" onclick="broadcastTx()">Broadcast Transaction</button>
52 | 				</div>
53 | 			</div>
54 |     	</div>
55 |     </body>
56 | </html>


--------------------------------------------------------------------------------
/tutorials/03_client_signing/public/style.scss:
--------------------------------------------------------------------------------
1 | import 'bootstrap/dist/css/bootstrap.min.css'


--------------------------------------------------------------------------------
/tutorials/03_client_signing/webpack.config.js:
--------------------------------------------------------------------------------
 1 | var path = require('path');
 2 | module.exports = {
 3 |     entry: ['./public/app.js', './public/style.scss'],
 4 |     output: {
 5 |         path: path.resolve(__dirname, 'public'),
 6 |         filename: 'bundle.js',
 7 |     },
 8 |     devtool: 'source-map',
 9 |     module: {
10 |         rules: [
11 |             {
12 |                 test: /\.css$/,
13 |                 use: ['style-loader', 'css-loader'],
14 |             },
15 |         ],
16 |     },
17 |     performance: {
18 |         hints: process.env.NODE_ENV === 'production' ? 'warning' : false,
19 |     },
20 | };
21 | 


--------------------------------------------------------------------------------
/tutorials/04_get_posts/images/Step-01-UI.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/steemit/devportal-tutorials-js/f20dcc475775def4488daf5b66b5f1bd35bdb8c5/tutorials/04_get_posts/images/Step-01-UI.png


--------------------------------------------------------------------------------
/tutorials/04_get_posts/index.js:
--------------------------------------------------------------------------------
1 | const Koa = require('koa');
2 | const app = new Koa();
3 | const serve = require('koa-static');
4 | app.use(serve('./public'));
5 | 
6 | app.listen(3000);
7 | 
8 | console.log('listening on port 3000');
9 | 


--------------------------------------------------------------------------------
/tutorials/04_get_posts/package.json:
--------------------------------------------------------------------------------
 1 | {
 2 |     "name": "04_get_posts",
 3 |     "version": "1.0.0",
 4 |     "description": "",
 5 |     "main": "index.js",
 6 |     "scripts": {
 7 |         "start": "webpack --config webpack.config.js && node ./index.js",
 8 |         "test": "echo \"Error: no test specified\" && exit 1",
 9 |         "dev-server":
10 |             "./node_modules/.bin/webpack-dev-server --mode development --content-base ./public --port 3000"
11 |     },
12 |     "author": "",
13 |     "license": "ISC",
14 |     "dependencies": {
15 |         "bootstrap": "^4.1.3",
16 |         "dsteem": "^0.10.1",
17 |         "koa": "^2.5.3",
18 |         "koa-static": "^5.0.0"
19 |     },
20 |     "devDependencies": {
21 |         "css-loader": "^1.0.0",
22 |         "style-loader": "^0.23.1",
23 |         "webpack": "^4.20.2",
24 |         "webpack-cli": "^3.1.2",
25 |         "webpack-dev-server": "^3.1.9"
26 |     }
27 | }
28 | 


--------------------------------------------------------------------------------
/tutorials/04_get_posts/public/app.js:
--------------------------------------------------------------------------------
 1 | const dsteem = require('dsteem');
 2 | 
 3 | let opts = {};
 4 | 
 5 | //connect to production server
 6 | opts.addressPrefix = 'STM';
 7 | opts.chainId =
 8 |     '0000000000000000000000000000000000000000000000000000000000000000';
 9 | 
10 | //connect to server which is connected to the network/production
11 | const client = new dsteem.Client('https://api.steemit.com');
12 | 
13 | //filter change selection function
14 | window.getPosts = async () => {
15 |     const filter = document.getElementById('filters').value;
16 |     const query = {
17 |         tag: document.getElementById('tag').value,
18 |         limit: 5,
19 |     };
20 | 
21 |     console.log('Post assembled.\nFilter:', filter, '\nQuery:', query);
22 | 
23 |     client.database
24 |         .getDiscussions(filter, query)
25 |         .then(result => {
26 |             console.log('Response received:', result);
27 |             if (result) {
28 |                 var posts = [];
29 |                 result.forEach(post => {
30 |                     const json = JSON.parse(post.json_metadata);
31 |                     const image = json.image ? json.image[0] : '';
32 |                     const title = post.title;
33 |                     const author = post.author;
34 |                     const created = new Date(post.created).toDateString();
35 |                     posts.push(
36 |                         `<div class="list-group-item"><h4 class="list-group-item-heading">${title}</h4><p>by ${author}</p><center><img src="${image}" class="img-responsive center-block" style="max-width: 450px"/></center><p class="list-group-item-text text-right text-nowrap">${created}</p></div>`
37 |                     );
38 |                 });
39 | 
40 |                 document.getElementById('postList').innerHTML = posts.join('');
41 |             } else {
42 |                 document.getElementById('postList').innerHTML = 'No result.';
43 |             }
44 |         })
45 |         .catch(err => {
46 |             console.log(err);
47 |             alert(`Error:${err}, try again`);
48 |         });
49 | };
50 | 


--------------------------------------------------------------------------------
/tutorials/04_get_posts/public/index.html:
--------------------------------------------------------------------------------
 1 | <html>
 2 |     <head>
 3 |         <title>Get posts using filters & tags</title>
 4 |         <script src="bundle.js"></script>
 5 |     </head>
 6 |     <body>
 7 |     	<div class="container" id="content">
 8 | 			<div class="row">
 9 | 				<div class="col-md-4">
10 | 					<label for="filters">Filters</label>
11 | 					<!--List of filters-->
12 | 					<select id="filters" class="form-control" >
13 | 					  <option selected>Select filter</option>
14 | 					  <option value="trending">Trending</option>
15 | 					  <option value="hot">Hot</option>
16 | 					  <option value="created">New</option>
17 | 					  <option value="promoted">Promoted</option>
18 | 					</select>
19 | 				</div>
20 | 			</div>
21 | 			<div class="row">
22 | 				<div class="col-md-4">
23 | 					<label for="tag">Tag</label>
24 | 					<!-- tag input. Only one tag at a time can be searched -->
25 | 					<input id="tag" class="form-control"/>
26 | 				</div>
27 | 			</div>
28 | 			<div class="row">
29 | 				<div class="col-md-4 mt-3">
30 | 					<button class="btn btn-primary" onclick="getPosts()">Get Posts</button>
31 | 				</div>
32 | 			</div>
33 | 			<div class="row">
34 | 				<div class="col-sm list-group mt-3" id="postList"></div>
35 | 			</div>
36 |     	</div>
37 |     </body>
38 | </html>


--------------------------------------------------------------------------------
/tutorials/04_get_posts/public/style.scss:
--------------------------------------------------------------------------------
1 | import 'bootstrap/dist/css/bootstrap.min.css'
2 | 


--------------------------------------------------------------------------------
/tutorials/04_get_posts/webpack.config.js:
--------------------------------------------------------------------------------
 1 | var path = require('path');
 2 | module.exports = {
 3 |     entry: ['./public/app.js', './public/style.scss'],
 4 |     output: {
 5 |         path: path.resolve(__dirname, 'public'),
 6 |         filename: 'bundle.js',
 7 |     },
 8 |     devtool: 'source-map',
 9 |     module: {
10 |         rules: [
11 |             {
12 |                 test: /\.css$/,
13 |                 use: ['style-loader', 'css-loader'],
14 |             },
15 |         ],
16 |     },
17 |     performance: {
18 |         hints: process.env.NODE_ENV === 'production' ? 'warning' : false,
19 |     },
20 | };
21 | 


--------------------------------------------------------------------------------
/tutorials/05_get_post_details/index.js:
--------------------------------------------------------------------------------
1 | const Koa = require('koa');
2 | const app = new Koa();
3 | const serve = require('koa-static');
4 | app.use(serve('./public'));
5 | 
6 | app.listen(3000);
7 | 
8 | console.log('listening on port 3000');
9 | 


--------------------------------------------------------------------------------
/tutorials/05_get_post_details/package.json:
--------------------------------------------------------------------------------
 1 | {
 2 |     "name": "05_get_post_details",
 3 |     "version": "1.0.0",
 4 |     "description": "",
 5 |     "main": "index.js",
 6 |     "scripts": {
 7 |         "start": "webpack && node ./index.js",
 8 |         "test": "echo \"Error: no test specified\" && exit 1",
 9 |         "dev-server":
10 |             "./node_modules/.bin/webpack-dev-server --mode development --content-base ./public --port 3000"
11 |     },
12 |     "author": "",
13 |     "license": "ISC",
14 |     "dependencies": {
15 |         "bootstrap": "^4.1.3",
16 |         "dsteem": "^0.10.1",
17 |         "koa": "^2.5.3",
18 |         "koa-static": "^5.0.0",
19 |         "remarkable": "^1.7.1"
20 |     },
21 |     "devDependencies": {
22 |         "css-loader": "^1.0.0",
23 |         "style-loader": "^0.23.1",
24 |         "webpack": "^4.20.2",
25 |         "webpack-cli": "^3.1.2",
26 |         "webpack-dev-server": "^3.1.9"
27 |     }
28 | }
29 | 


--------------------------------------------------------------------------------
/tutorials/05_get_post_details/public/app.js:
--------------------------------------------------------------------------------
 1 | const dsteem = require('dsteem');
 2 | const Remarkable = require('remarkable');
 3 | 
 4 | let opts = {};
 5 | 
 6 | //connect to production server
 7 | opts.addressPrefix = 'STM';
 8 | opts.chainId =
 9 |     '0000000000000000000000000000000000000000000000000000000000000000';
10 | //connect to server which is connected to the network/production
11 | const client = new dsteem.Client('https://api.steemit.com');
12 | 
13 | //fetch list of trending posts
14 | async function main() {
15 |     const query = {
16 |         tag: '',
17 |         limit: 5,
18 |         truncate_body: 1,
19 |     };
20 |     client.database
21 |         .getDiscussions('trending', query)
22 |         .then(result => {
23 |             var posts = [];
24 |             result.forEach(post => {
25 |                 console.log(post);
26 |                 const json = JSON.parse(post.json_metadata);
27 |                 const image = json.image ? json.image[0] : '';
28 |                 const title = post.title;
29 |                 const author = post.author;
30 |                 const permlink = post.permlink;
31 |                 const created = new Date(post.created).toDateString();
32 |                 posts.push(
33 |                     `<div class="list-group-item" onclick=openPost("${author}","${permlink}")><h4 class="list-group-item-heading">${title}</h4><p>by ${author}</p><center><img src="${image}" class="img-responsive center-block" style="max-width: 450px"/></center><p class="list-group-item-text text-right text-nowrap">${created}</p></div>`
34 |                 );
35 |             });
36 |             document.getElementById('postList').style.display = 'block';
37 |             document.getElementById('postList').innerHTML = posts.join('');
38 |         })
39 |         .catch(err => {
40 |             console.log(err);
41 |             alert('Error occured, please reload the page');
42 |         });
43 | }
44 | //catch error messages
45 | main().catch(console.error);
46 | 
47 | //get_content of the post
48 | window.openPost = async (author, permlink) => {
49 |     client.database.call('get_content', [author, permlink]).then(result => {
50 |         const md = new Remarkable({ html: true, linkify: true });
51 |         const body = md.render(result.body);
52 |         const content = `<div class='pull-right'><button onclick=goback()>Close</button></div><br><h2>${
53 |             result.title
54 |         }</h2><br>${body}<br>`;
55 | 
56 |         document.getElementById('postList').style.display = 'none';
57 |         document.getElementById('postBody').style.display = 'block';
58 |         document.getElementById('postBody').innerHTML = content;
59 |     });
60 | };
61 | //go back from post view to list
62 | window.goback = async () => {
63 |     document.getElementById('postList').style.display = 'block';
64 |     document.getElementById('postBody').style.display = 'none';
65 | };
66 | 


--------------------------------------------------------------------------------
/tutorials/05_get_post_details/public/index.css:
--------------------------------------------------------------------------------
1 | #postBody img, #postBody iframe {
2 | 	max-width: 100%;
3 | }
4 | #postBody .pull-right {
5 |   float: right !important;
6 | }
7 | 


--------------------------------------------------------------------------------
/tutorials/05_get_post_details/public/index.html:
--------------------------------------------------------------------------------
 1 | <html>
 2 |     <head>
 3 |         <title>Get post details</title>
 4 |         <script src="bundle.js"></script>
 5 |     </head>
 6 |     <body>
 7 |     	<div class="container" id="content">
 8 |     		<h4>To get post details select any post</h4>
 9 |     		<p>
10 |     			<div id="postList" style="display: none;"> 
11 | 	    		</div>
12 | 	    		<div id="postBody" style="display: none;">
13 | 	    		</div>	
14 |     		</p>
15 |     		
16 | 		</div>
17 |     </body>
18 | </html>


--------------------------------------------------------------------------------
/tutorials/05_get_post_details/public/style.scss:
--------------------------------------------------------------------------------
1 | import 'bootstrap/dist/css/bootstrap.min.css'
2 | import './index.css'


--------------------------------------------------------------------------------
/tutorials/05_get_post_details/webpack.config.js:
--------------------------------------------------------------------------------
 1 | var path = require('path');
 2 | module.exports = {
 3 |     entry: ['./public/app.js', './public/style.scss'],
 4 |     output: {
 5 |         path: path.resolve(__dirname, 'public'),
 6 |         filename: 'bundle.js',
 7 |     },
 8 |     devtool: 'source-map',
 9 |     module: {
10 |         rules: [
11 |             {
12 |                 test: /\.css$/,
13 |                 use: ['style-loader', 'css-loader'],
14 |             },
15 |         ],
16 |     },
17 |     performance: {
18 |         hints: process.env.NODE_ENV === 'production' ? 'warning' : false,
19 |     },
20 | };
21 | 


--------------------------------------------------------------------------------
/tutorials/06_get_voters_list_on_post/index.js:
--------------------------------------------------------------------------------
1 | const Koa = require('koa');
2 | const app = new Koa();
3 | const serve = require('koa-static');
4 | app.use(serve('./public'));
5 | 
6 | app.listen(3000);
7 | 
8 | console.log('listening on port 3000');
9 | 


--------------------------------------------------------------------------------
/tutorials/06_get_voters_list_on_post/package.json:
--------------------------------------------------------------------------------
 1 | {
 2 |     "name": "06_get_post_details",
 3 |     "version": "1.0.0",
 4 |     "description": "",
 5 |     "main": "index.js",
 6 |     "scripts": {
 7 |         "start": "webpack && node ./index.js",
 8 |         "test": "echo \"Error: no test specified\" && exit 1",
 9 |         "dev-server":
10 |             "./node_modules/.bin/webpack-dev-server --mode development --content-base ./public --port 3000"
11 |     },
12 |     "author": "",
13 |     "license": "ISC",
14 |     "dependencies": {
15 |         "bootstrap": "^4.1.3",
16 |         "dsteem": "^0.10.1",
17 |         "koa": "^2.5.3",
18 |         "koa-static": "^5.0.0",
19 |         "remarkable": "^1.7.1"
20 |     },
21 |     "devDependencies": {
22 |         "css-loader": "^1.0.0",
23 |         "style-loader": "^0.23.1",
24 |         "webpack": "^4.20.2",
25 |         "webpack-cli": "^3.1.2",
26 |         "webpack-dev-server": "^3.1.9"
27 |     }
28 | }
29 | 


--------------------------------------------------------------------------------
/tutorials/06_get_voters_list_on_post/public/app.js:
--------------------------------------------------------------------------------
 1 | const dsteem = require('dsteem');
 2 | 
 3 | let opts = {};
 4 | 
 5 | //connect to production server
 6 | opts.addressPrefix = 'STM';
 7 | opts.chainId =
 8 |     '0000000000000000000000000000000000000000000000000000000000000000';
 9 | //connect to server which is connected to the network/production
10 | const client = new dsteem.Client('https://api.steemit.com');
11 | 
12 | //fetch list of trending posts
13 | async function main() {
14 |     const query = {
15 |         tag: '',
16 |         limit: 5,
17 |         truncate_body: 1,
18 |     };
19 |     client.database
20 |         .getDiscussions('trending', query)
21 |         .then(result => {
22 |             var posts = [];
23 |             result.forEach(post => {
24 |                 console.log('post', post);
25 |                 const json = JSON.parse(post.json_metadata);
26 |                 const image = json.image ? json.image[0] : '';
27 |                 const title = post.title;
28 |                 const author = post.author;
29 |                 const permlink = post.permlink;
30 |                 const created = new Date(post.created).toDateString();
31 |                 posts.push(
32 |                     `<div class="list-group-item" onclick=openPost("${author}","${permlink}")><h4 class="list-group-item-heading">${title}</h4><p>by ${author}</p><center><img src="${image}" class="img-responsive center-block" style="max-width: 450px"/></center><p class="list-group-item-text text-right text-nowrap">${created}</p></div>`
33 |                 );
34 |             });
35 |             document.getElementById('postList').style.display = 'block';
36 |             document.getElementById('postList').innerHTML = posts.join('');
37 |         })
38 |         .catch(err => {
39 |             console.log(err);
40 |             alert('Error occured, please reload the page');
41 |         });
42 | }
43 | //catch error messages
44 | main().catch(console.error);
45 | 
46 | //get_content of the post
47 | window.openPost = async (author, permlink) => {
48 |     client.database
49 |         .call('get_active_votes', [author, permlink])
50 |         .then(result => {
51 |             console.log('votes', result, JSON.stringify(result));
52 | 
53 |             var voters = [];
54 |             voters.push(
55 |                 `<div class='pull-right'><button onclick=goback()>Close</button></div><br>`
56 |             );
57 |             result.forEach(voter => {
58 |                 const name = voter.voter;
59 |                 const time = new Date(voter.time).toDateString();
60 |                 voters.push(`${name} (${time})`);
61 |             });
62 | 
63 |             document.getElementById('postList').style.display = 'none';
64 |             document.getElementById('postBody').style.display = 'block';
65 |             document.getElementById('postBody').innerHTML = voters.join('<li>');
66 |         });
67 | };
68 | //go back from post view to list
69 | window.goback = async () => {
70 |     document.getElementById('postList').style.display = 'block';
71 |     document.getElementById('postBody').style.display = 'none';
72 | };
73 | 


--------------------------------------------------------------------------------
/tutorials/06_get_voters_list_on_post/public/index.css:
--------------------------------------------------------------------------------
1 | #postBody img, #postBody iframe {
2 | 	max-width: 100%;
3 | }
4 | #postBody .pull-right {
5 |   float: right !important;
6 | }
7 | 


--------------------------------------------------------------------------------
/tutorials/06_get_voters_list_on_post/public/index.html:
--------------------------------------------------------------------------------
 1 | <html>
 2 |     <head>
 3 |         <title>Get post details</title>
 4 |         <script src="bundle.js"></script>
 5 |     </head>
 6 |     <body>
 7 |     	<div class="container" id="content">
 8 |     		<h4>To get voters list on post, select any post</h4>
 9 |     		<p>
10 |     			<div id="postList" style="display: none;"> 
11 | 	    		</div>
12 | 	    		<div id="postBody" style="display: none;">
13 | 	    		</div>	
14 |     		</p>
15 |     		
16 | 		</div>
17 |     </body>
18 | </html>


--------------------------------------------------------------------------------
/tutorials/06_get_voters_list_on_post/public/style.scss:
--------------------------------------------------------------------------------
1 | import 'bootstrap/dist/css/bootstrap.min.css'
2 | import './index.css'


--------------------------------------------------------------------------------
/tutorials/06_get_voters_list_on_post/webpack.config.js:
--------------------------------------------------------------------------------
 1 | var path = require('path');
 2 | module.exports = {
 3 |     entry: ['./public/app.js', './public/style.scss'],
 4 |     output: {
 5 |         path: path.resolve(__dirname, 'public'),
 6 |         filename: 'bundle.js',
 7 |     },
 8 |     devtool: 'source-map',
 9 |     module: {
10 |         rules: [
11 |             {
12 |                 test: /\.css$/,
13 |                 use: ['style-loader', 'css-loader'],
14 |             },
15 |         ],
16 |     },
17 |     performance: {
18 |         hints: process.env.NODE_ENV === 'production' ? 'warning' : false,
19 |     },
20 | };
21 | 


--------------------------------------------------------------------------------
/tutorials/07_get_post_comments/index.js:
--------------------------------------------------------------------------------
1 | const Koa = require('koa');
2 | const app = new Koa();
3 | const serve = require('koa-static');
4 | app.use(serve('./public'));
5 | 
6 | app.listen(3000);
7 | 
8 | console.log('listening on port 3000');
9 | 


--------------------------------------------------------------------------------
/tutorials/07_get_post_comments/package.json:
--------------------------------------------------------------------------------
 1 | {
 2 |     "name": "07_get_post_comments",
 3 |     "version": "1.0.0",
 4 |     "description": "",
 5 |     "main": "index.js",
 6 |     "scripts": {
 7 |         "start": "webpack && node ./index.js",
 8 |         "test": "echo \"Error: no test specified\" && exit 1",
 9 |         "dev-server":
10 |             "./node_modules/.bin/webpack-dev-server --mode development --content-base ./public --port 3000"
11 |     },
12 |     "author": "",
13 |     "license": "ISC",
14 |     "dependencies": {
15 |         "bootstrap": "^4.1.3",
16 |         "dsteem": "^0.10.1",
17 |         "koa": "^2.5.3",
18 |         "koa-static": "^5.0.0",
19 |         "remarkable": "^1.7.1"
20 |     },
21 |     "devDependencies": {
22 |         "css-loader": "^1.0.0",
23 |         "style-loader": "^0.23.1",
24 |         "webpack": "^4.20.2",
25 |         "webpack-cli": "^3.1.2",
26 |         "webpack-dev-server": "^3.1.9"
27 |     }
28 | }
29 | 


--------------------------------------------------------------------------------
/tutorials/07_get_post_comments/public/app.js:
--------------------------------------------------------------------------------
 1 | const dsteem = require('dsteem');
 2 | const Remarkable = require('remarkable');
 3 | 
 4 | let opts = {};
 5 | 
 6 | //connect to production server
 7 | opts.addressPrefix = 'STM';
 8 | opts.chainId =
 9 |     '0000000000000000000000000000000000000000000000000000000000000000';
10 | //connect to server which is connected to the network/production
11 | const client = new dsteem.Client('https://api.steemit.com');
12 | 
13 | //fetch list of trending posts
14 | async function main() {
15 |     const query = {
16 |         tag: '',
17 |         limit: 5,
18 |         truncate_body: 1,
19 |     };
20 |     client.database
21 |         .getDiscussions('trending', query)
22 |         .then(result => {
23 |             var posts = [];
24 |             result.forEach(post => {
25 |                 const json = JSON.parse(post.json_metadata);
26 |                 const image = json.image ? json.image[0] : '';
27 |                 const title = post.title;
28 |                 const author = post.author;
29 |                 const permlink = post.permlink;
30 |                 const created = new Date(post.created).toDateString();
31 |                 posts.push(
32 |                     `<div class="list-group-item" onclick=openPost("${author}","${permlink}")><h4 class="list-group-item-heading">${title}</h4><p>by ${author}</p><center><img src="${image}" class="img-responsive center-block" style="max-width: 450px"/></center><p class="list-group-item-text text-right text-nowrap">${created}</p></div>`
33 |                 );
34 |             });
35 |             document.getElementById('postList').style.display = 'block';
36 |             document.getElementById('postList').innerHTML = posts.join('');
37 |         })
38 |         .catch(err => {
39 |             console.log(err);
40 |             alert('Error occured, please reload the page');
41 |         });
42 | }
43 | //catch error messages
44 | main().catch(console.error);
45 | 
46 | //get_content of the post and get_content_replies
47 | window.openPost = async (author, permlink) => {
48 |     client.database.call('get_content', [author, permlink]).then(result => {
49 |         const md = new Remarkable({ html: true, linkify: true });
50 |         const body = md.render(result.body);
51 |         const content = `<div class='pull-right'><button onclick=goback()>Close</button></div><br><h2>${
52 |             result.title
53 |         }</h2><br>${body}<br>`;
54 | 
55 |         document.getElementById('postList').style.display = 'none';
56 |         document.getElementById('postBody').style.display = 'block';
57 |         document.getElementById('postBody').innerHTML = content;
58 | 
59 |         //get_content_replies of the selected post
60 |         client.database
61 |             .call('get_content_replies', [author, permlink])
62 |             .then(result => {
63 |                 const comments = [];
64 |                 for (var i = 0; i < result.length; i++) {
65 |                     comments.push(
66 |                         `<div class="list-group-item list-group-item-action flex-column align-items-start">\
67 |                     <div class="d-flex w-100 justify-content-between">\
68 |                       <h5 class="mb-1">@${result[i].author}</h5>\
69 |                       <small class="text-muted">${new Date(
70 |                           result[i].created
71 |                       ).toString()}</small>\
72 |                     </div>\
73 |                     <p class="mb-1">${md.render(result[i].body)}</p>\
74 |                     <small class="text-muted">&#9650; ${
75 |                         result[i].net_votes
76 |                     }</small>\
77 |                   </div>`
78 |                     );
79 |                 }
80 |                 document.getElementById('postComments').style.display = 'block';
81 |                 document.getElementById(
82 |                     'postComments'
83 |                 ).innerHTML = comments.join('');
84 |             });
85 |     });
86 | };
87 | //go back from post view to list
88 | window.goback = async () => {
89 |     document.getElementById('postList').style.display = 'block';
90 |     document.getElementById('postBody').style.display = 'none';
91 |     document.getElementById('postComments').style.display = 'none';
92 | };
93 | 


--------------------------------------------------------------------------------
/tutorials/07_get_post_comments/public/index.css:
--------------------------------------------------------------------------------
 1 | #postBody img,
 2 | #postBody iframe {
 3 |     max-width: 100%;
 4 | }
 5 | #postBody .pull-right {
 6 |     float: right !important;
 7 | }
 8 | 
 9 | .list-group-item-heading {
10 |     cursor:pointer;
11 | }


--------------------------------------------------------------------------------
/tutorials/07_get_post_comments/public/index.html:
--------------------------------------------------------------------------------
 1 | <html>
 2 |     <head>
 3 |         <title>Get post comments</title>
 4 |         <script src="bundle.js"></script>
 5 |     </head>
 6 |     <body>
 7 |     	<div class="container" id="content">
 8 |     		<h4>To get post comments select any post</h4>
 9 |     		<p>
10 |     			<div id="postList" style="display: none;"> 
11 | 	    		</div>
12 | 	    		<div id="postBody" style="display: none;">
13 | 	    		</div>
14 |                 <div id="postComments" style="display: none;" class="list-group">
15 |                 </div>
16 |     		</p>
17 | 		</div>
18 |     </body>
19 | </html>


--------------------------------------------------------------------------------
/tutorials/07_get_post_comments/public/style.scss:
--------------------------------------------------------------------------------
1 | import 'bootstrap/dist/css/bootstrap.min.css'
2 | import './index.css'


--------------------------------------------------------------------------------
/tutorials/07_get_post_comments/webpack.config.js:
--------------------------------------------------------------------------------
 1 | var path = require('path');
 2 | module.exports = {
 3 |     entry: ['./public/app.js', './public/style.scss'],
 4 |     output: {
 5 |         path: path.resolve(__dirname, 'public'),
 6 |         filename: 'bundle.js',
 7 |     },
 8 |     devtool: 'source-map',
 9 |     module: {
10 |         rules: [
11 |             {
12 |                 test: /\.css$/,
13 |                 use: ['style-loader', 'css-loader'],
14 |             },
15 |         ],
16 |     },
17 |     performance: {
18 |         hints: process.env.NODE_ENV === 'production' ? 'warning' : false,
19 |     },
20 | };
21 | 


--------------------------------------------------------------------------------
/tutorials/08_get_account_replies/index.js:
--------------------------------------------------------------------------------
1 | const Koa = require('koa');
2 | const app = new Koa();
3 | const serve = require('koa-static');
4 | app.use(serve('./public'));
5 | 
6 | app.listen(3000);
7 | 
8 | console.log('listening on port 3000');
9 | 


--------------------------------------------------------------------------------
/tutorials/08_get_account_replies/package.json:
--------------------------------------------------------------------------------
 1 | {
 2 |     "name": "08_get_account_replies",
 3 |     "version": "1.0.0",
 4 |     "description": "",
 5 |     "main": "index.js",
 6 |     "scripts": {
 7 |         "start": "webpack && node ./index.js",
 8 |         "test": "echo \"Error: no test specified\" && exit 1",
 9 |         "dev-server":
10 |             "./node_modules/.bin/webpack-dev-server --mode development --content-base ./public --port 3000"
11 |     },
12 |     "author": "",
13 |     "license": "ISC",
14 |     "dependencies": {
15 |         "bootstrap": "^4.1.3",
16 |         "dsteem": "^0.10.1",
17 |         "koa": "^2.5.3",
18 |         "koa-static": "^5.0.0",
19 |         "remarkable": "^1.7.1"
20 |     },
21 |     "devDependencies": {
22 |         "css-loader": "^1.0.0",
23 |         "style-loader": "^0.23.1",
24 |         "webpack": "^4.20.2",
25 |         "webpack-cli": "^3.1.2",
26 |         "webpack-dev-server": "^3.1.9"
27 |     }
28 | }
29 | 


--------------------------------------------------------------------------------
/tutorials/08_get_account_replies/public/app.js:
--------------------------------------------------------------------------------
 1 | const dsteem = require('dsteem');
 2 | let opts = {};
 3 | //connect to production server
 4 | opts.addressPrefix = 'STM';
 5 | opts.chainId =
 6 |     '0000000000000000000000000000000000000000000000000000000000000000';
 7 | //connect to server which is connected to the network/production
 8 | const client = new dsteem.Client('https://api.steemit.com');
 9 | 
10 | const Remarkable = require('remarkable');
11 | const md = new Remarkable({html: true, linkify: true});        
12 | 
13 | 
14 | //fetch list of replies for certain account
15 | async function main() {
16 |     const query = '/@steemitblog/recent-replies';
17 |     client.database
18 |         .call('get_state', [query])
19 |         .then(result => {
20 |             if (!(Object.keys(result.content).length === 0 && result.content.constructor === Object)) {
21 |                 var replies = [];
22 |                 Object.keys(result.content).forEach(key => {
23 |                     const reply = result.content[key];
24 |                     const author = reply.author;
25 |                     const created = new Date(reply.created).toDateString();
26 |                     const body = md.render(reply.body);
27 |                     const netvotes = reply.net_votes;
28 |                     replies.push(
29 |                         `<div class="list-group-item list-group-item-action flex-column align-items-start">\
30 |                         <div class="d-flex w-100 justify-content-between">\
31 |                           <h5 class="mb-1">@${author}</h5>\
32 |                           <small class="text-muted">${created}</small>\
33 |                         </div>\
34 |                         <p class="mb-1">${body}</p>\
35 |                         <small class="text-muted">&#9650; ${netvotes}</small>\
36 |                       </div>`
37 |                     );
38 |                 });
39 |                 document.getElementById('replies').style.display = 'block';
40 |                 document.getElementById('replies').innerHTML = replies.join('');
41 |             }
42 |         })
43 |         .catch(err => {
44 |             console.log(err);
45 |             alert('Error occured, please reload the page');
46 |         });
47 | }
48 | //catch error messages
49 | main().catch(console.error);
50 | 


--------------------------------------------------------------------------------
/tutorials/08_get_account_replies/public/index.css:
--------------------------------------------------------------------------------
1 | #replies img,
2 | #replies iframe {
3 |     max-width: 100%;
4 | }
5 | 


--------------------------------------------------------------------------------
/tutorials/08_get_account_replies/public/index.html:
--------------------------------------------------------------------------------
 1 | <html>
 2 |     <head>
 3 |         <title>Get account replies</title>
 4 |         <script src="bundle.js"></script>
 5 |     </head>
 6 |     <body>
 7 |     	<div class="container" id="content"><br/>
 8 |     		<h4>Recent replies on @steemitblog's content</h4>
 9 |     		<p>
10 |                 <div id="replies" style="display: none;" class="list-group">
11 |                 </div>
12 |     		</p>
13 | 		</div>
14 |     </body>
15 | </html>


--------------------------------------------------------------------------------
/tutorials/08_get_account_replies/public/style.scss:
--------------------------------------------------------------------------------
1 | import 'bootstrap/dist/css/bootstrap.min.css'
2 | import './index.css'


--------------------------------------------------------------------------------
/tutorials/08_get_account_replies/webpack.config.js:
--------------------------------------------------------------------------------
 1 | var path = require('path');
 2 | module.exports = {
 3 |     entry: ['./public/app.js', './public/style.scss'],
 4 |     output: {
 5 |         path: path.resolve(__dirname, 'public'),
 6 |         filename: 'bundle.js',
 7 |     },
 8 |     devtool: 'source-map',
 9 |     module: {
10 |         rules: [
11 |             {
12 |                 test: /\.css$/,
13 |                 use: ['style-loader', 'css-loader'],
14 |             },
15 |         ],
16 |     },
17 |     performance: {
18 |         hints: process.env.NODE_ENV === 'production' ? 'warning' : false,
19 |     },
20 | };
21 | 


--------------------------------------------------------------------------------
/tutorials/09_get_account_comments/index.js:
--------------------------------------------------------------------------------
1 | const Koa = require('koa');
2 | const app = new Koa();
3 | const serve = require('koa-static');
4 | app.use(serve('./public'));
5 | 
6 | app.listen(3000);
7 | 
8 | console.log('listening on port 3000');
9 | 


--------------------------------------------------------------------------------
/tutorials/09_get_account_comments/package.json:
--------------------------------------------------------------------------------
 1 | {
 2 |     "name": "09_get_account_comments",
 3 |     "version": "1.0.0",
 4 |     "description": "",
 5 |     "main": "index.js",
 6 |     "scripts": {
 7 |         "start": "webpack && node ./index.js",
 8 |         "test": "echo \"Error: no test specified\" && exit 1",
 9 |         "dev-server":
10 |             "./node_modules/.bin/webpack-dev-server --mode development --content-base ./public --port 3000"
11 |     },
12 |     "author": "",
13 |     "license": "ISC",
14 |     "dependencies": {
15 |         "bootstrap": "^4.1.3",
16 |         "dsteem": "^0.10.1",
17 |         "koa": "^2.5.3",
18 |         "koa-static": "^5.0.0",
19 |         "remarkable": "^1.7.1"
20 |     },
21 |     "devDependencies": {
22 |         "css-loader": "^1.0.0",
23 |         "style-loader": "^0.23.1",
24 |         "webpack": "^4.20.2",
25 |         "webpack-cli": "^3.1.2",
26 |         "webpack-dev-server": "^3.1.9"
27 |     }
28 | }
29 | 


--------------------------------------------------------------------------------
/tutorials/09_get_account_comments/public/app.js:
--------------------------------------------------------------------------------
 1 | const dsteem = require('dsteem');
 2 | let opts = {};
 3 | //connect to production server
 4 | opts.addressPrefix = 'STM';
 5 | opts.chainId =
 6 |     '0000000000000000000000000000000000000000000000000000000000000000';
 7 | //connect to server which is connected to the network/production
 8 | const client = new dsteem.Client('https://api.steemit.com');
 9 | 
10 | const Remarkable = require('remarkable');
11 | const md = new Remarkable({ html: true, linkify: true });
12 | 
13 | //fetch list of comments for certain account
14 | async function main() {
15 |     const query = '/@steemitblog/comments';
16 |     client.database
17 |         .call('get_state', [query])
18 |         .then(result => {
19 |             console.log(result);
20 |             if (
21 |                 !(
22 |                     Object.keys(result.content).length === 0 &&
23 |                     result.content.constructor === Object
24 |                 )
25 |             ) {
26 |                 var comments = [];
27 |                 Object.keys(result.content).forEach(key => {
28 |                     const comment = result.content[key];
29 |                     const parent_author = comment.parent_author;
30 |                     const parent_permlink = comment.parent_permlink;
31 |                     const created = new Date(comment.created).toDateString();
32 |                     const body = md.render(comment.body);
33 |                     const netvotes = comment.net_votes;
34 |                     comments.push(
35 |                         `<div class="list-group-item list-group-item-action flex-column align-items-start">\
36 |                         <div class="d-flex w-100 justify-content-between">\
37 |                           <h6 class="mb-1">@${comment.author}</h6>\
38 |                           <small class="text-muted">${created}</small>\
39 |                         </div>\
40 |                         <p class="mb-1">${body}</p>\
41 |                         <small class="text-muted">&#9650; ${netvotes}, Replied to: @${parent_author}/${parent_permlink}</small>\
42 |                       </div>`
43 |                     );
44 |                 });
45 |                 document.getElementById('comments').style.display = 'block';
46 |                 document.getElementById('comments').innerHTML = comments.join(
47 |                     ''
48 |                 );
49 |             }
50 |         })
51 |         .catch(err => {
52 |             console.log(err);
53 |             alert('Error occured, please reload the page');
54 |         });
55 | }
56 | //catch error messages
57 | main().catch(console.error);
58 | 


--------------------------------------------------------------------------------
/tutorials/09_get_account_comments/public/index.css:
--------------------------------------------------------------------------------
1 | #comments img,
2 | #comments iframe {
3 |     max-width: 100%;
4 | }
5 | 


--------------------------------------------------------------------------------
/tutorials/09_get_account_comments/public/index.html:
--------------------------------------------------------------------------------
 1 | <html>
 2 |     <head>
 3 |         <title>Get account comments</title>
 4 |         <script src="bundle.js"></script>
 5 |     </head>
 6 |     <body>
 7 |     	<div class="container" id="content"><br/>
 8 |     		<h4>Comments by @steemitblog</h4>
 9 |     		<p>
10 |                 <div id="comments" style="display: none;" class="list-group">
11 |                 </div>
12 |     		</p>
13 | 		</div>
14 |     </body>
15 | </html>


--------------------------------------------------------------------------------
/tutorials/09_get_account_comments/public/style.scss:
--------------------------------------------------------------------------------
1 | import 'bootstrap/dist/css/bootstrap.min.css'
2 | import './index.css'


--------------------------------------------------------------------------------
/tutorials/09_get_account_comments/webpack.config.js:
--------------------------------------------------------------------------------
 1 | var path = require('path');
 2 | module.exports = {
 3 |     entry: ['./public/app.js', './public/style.scss'],
 4 |     output: {
 5 |         path: path.resolve(__dirname, 'public'),
 6 |         filename: 'bundle.js',
 7 |     },
 8 |     devtool: 'source-map',
 9 |     module: {
10 |         rules: [
11 |             {
12 |                 test: /\.css$/,
13 |                 use: ['style-loader', 'css-loader'],
14 |             },
15 |         ],
16 |     },
17 |     performance: {
18 |         hints: process.env.NODE_ENV === 'production' ? 'warning' : false,
19 |     },
20 | };
21 | 


--------------------------------------------------------------------------------
/tutorials/10_submit_post/index.js:
--------------------------------------------------------------------------------
1 | const Koa = require('koa');
2 | const app = new Koa();
3 | const serve = require('koa-static');
4 | app.use(serve('./public'));
5 | 
6 | app.listen(3000);
7 | 
8 | console.log('listening on port 3000');
9 | 


--------------------------------------------------------------------------------
/tutorials/10_submit_post/package.json:
--------------------------------------------------------------------------------
 1 | {
 2 |     "name": "10_submit_post",
 3 |     "version": "1.0.0",
 4 |     "description": "",
 5 |     "main": "index.js",
 6 |     "scripts": {
 7 |         "start": "webpack && node ./index.js",
 8 |         "test": "echo \"Error: no test specified\" && exit 1",
 9 |         "dev-server":
10 |             "./node_modules/.bin/webpack-dev-server --mode development --content-base ./public --port 3000"
11 |     },
12 |     "author": "",
13 |     "license": "ISC",
14 |     "dependencies": {
15 |         "bootstrap": "^4.1.3",
16 |         "dsteem": "^0.10.1",
17 |         "koa": "^2.5.3",
18 |         "koa-static": "^5.0.0",
19 |         "remarkable": "^1.7.1"
20 |     },
21 |     "devDependencies": {
22 |         "css-loader": "^1.0.0",
23 |         "style-loader": "^0.23.1",
24 |         "webpack": "^4.20.2",
25 |         "webpack-cli": "^3.1.2",
26 |         "webpack-dev-server": "^3.1.9"
27 |     }
28 | }
29 | 


--------------------------------------------------------------------------------
/tutorials/10_submit_post/public/app.js:
--------------------------------------------------------------------------------
 1 | import { Client, PrivateKey } from 'dsteem';
 2 | import { Testnet as NetConfig } from '../../configuration'; //A Steem Testnet. Replace 'Testnet' with 'Mainnet' to connect to the main Steem blockchain.
 3 | 
 4 | let opts = { ...NetConfig.net };
 5 | 
 6 | //connect to server which is connected to the network/testnet
 7 | const client = new Client(NetConfig.url, opts);
 8 | 
 9 | //submit post function
10 | window.submitPost = async () => {
11 |     //get private key
12 |     const privateKey = PrivateKey.fromString(
13 |         document.getElementById('postingKey').value
14 |     );
15 |     //get account name
16 |     const account = document.getElementById('username').value;
17 |     //get title
18 |     const title = document.getElementById('title').value;
19 |     //get body
20 |     const body = document.getElementById('body').value;
21 |     //get tags and convert to array list
22 |     const tags = document.getElementById('tags').value;
23 |     const taglist = tags.split(' ');
24 |     //make simple json metadata including only tags
25 |     const json_metadata = JSON.stringify({ tags: taglist });
26 |     //generate random permanent link for post
27 |     const permlink = Math.random()
28 |         .toString(36)
29 |         .substring(2);
30 | 
31 |     const payload = {
32 |         author: account,
33 |         body: body,
34 |         json_metadata: json_metadata,
35 |         parent_author: '',
36 |         parent_permlink: taglist[0],
37 |         permlink: permlink,
38 |         title: title,
39 |     };
40 |     console.log('client.broadcast.comment:', payload);
41 |     client.broadcast.comment(payload, privateKey).then(
42 |         function(result) {
43 |             console.log('response:', result);
44 |             document.getElementById('title').value = '';
45 |             document.getElementById('body').value = '';
46 |             document.getElementById('tags').value = '';
47 |             document.getElementById('postLink').style.display = 'block';
48 |             document.getElementById(
49 |                 'postLink'
50 |             ).innerHTML = `<br/><p>Included in block: ${
51 |                 result.block_num
52 |             }</p><br/><br/><a href="http://condenser.steem.vc/${
53 |                 taglist[0]
54 |             }/@${account}/${permlink}">Check post here</a>`;
55 |         },
56 |         function(error) {
57 |             console.error(error);
58 |         }
59 |     );
60 | };
61 | 
62 | window.onload = () => {
63 |     const account = NetConfig.accounts[0];
64 |     document.getElementById('username').value = account.address;
65 |     document.getElementById('postingKey').value = account.privPosting;
66 | };
67 | 


--------------------------------------------------------------------------------
/tutorials/10_submit_post/public/index.html:
--------------------------------------------------------------------------------
 1 | <html>
 2 |     <head>
 3 |         <title>Submit post</title>
 4 |         <script src="bundle.js"></script>
 5 |     </head>
 6 |     <body>
 7 |     	<div class="container" id="content"><br/>
 8 |     		<h4>Submit a post to the Steem blockchain</h4>
 9 |             Username: <input id="username" type="text" size="65" class="form-control"><br/>
10 |             Posting private key: <input id="postingKey" type="password" size="65" class="form-control"><br/>
11 |             Title of post: <input id="title" type="text" size="65" class="form-control" value="Here goes title"><br/>
12 |             Post body:<br/>
13 |             <textarea id="body" class="form-control" rows="3">Content of the post</textarea><br/>
14 |             Tags: <input id="tags" type="text" size="65" class="form-control" value="tag1 tag2 tag3"><br/>
15 |             <input id="submitPostBtn" type="button" value="Submit post!" onclick="submitPost()" class="btn btn-primary">
16 |             <div id="postLink" style="display: none;">
17 |             </div>
18 | 		</div>
19 |     </body>
20 | </html>


--------------------------------------------------------------------------------
/tutorials/10_submit_post/public/style.scss:
--------------------------------------------------------------------------------
1 | import 'bootstrap/dist/css/bootstrap.min.css'


--------------------------------------------------------------------------------
/tutorials/10_submit_post/webpack.config.js:
--------------------------------------------------------------------------------
 1 | var path = require('path');
 2 | module.exports = {
 3 |     entry: ['./public/app.js', './public/style.scss'],
 4 |     output: {
 5 |         path: path.resolve(__dirname, 'public'),
 6 |         filename: 'bundle.js',
 7 |     },
 8 |     devtool: 'source-map',
 9 |     module: {
10 |         rules: [
11 |             {
12 |                 test: /\.css$/,
13 |                 use: ['style-loader', 'css-loader'],
14 |             },
15 |         ],
16 |     },
17 |     performance: {
18 |         hints: process.env.NODE_ENV === 'production' ? 'warning' : false,
19 |     },
20 | };
21 | 


--------------------------------------------------------------------------------
/tutorials/11_submit_comment_reply/images/comment_reply_successful_console_output.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/steemit/devportal-tutorials-js/f20dcc475775def4488daf5b66b5f1bd35bdb8c5/tutorials/11_submit_comment_reply/images/comment_reply_successful_console_output.png


--------------------------------------------------------------------------------
/tutorials/11_submit_comment_reply/images/comment_reply_user_input.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/steemit/devportal-tutorials-js/f20dcc475775def4488daf5b66b5f1bd35bdb8c5/tutorials/11_submit_comment_reply/images/comment_reply_user_input.png


--------------------------------------------------------------------------------
/tutorials/11_submit_comment_reply/index.js:
--------------------------------------------------------------------------------
1 | const Koa = require('koa');
2 | const app = new Koa();
3 | const serve = require('koa-static');
4 | app.use(serve('./public'));
5 | 
6 | app.listen(3000);
7 | 
8 | console.log('listening on port 3000');
9 | 


--------------------------------------------------------------------------------
/tutorials/11_submit_comment_reply/package.json:
--------------------------------------------------------------------------------
 1 | {
 2 |     "name": "11_submit_comment_reply",
 3 |     "version": "1.0.0",
 4 |     "description": "",
 5 |     "main": "index.js",
 6 |     "scripts": {
 7 |         "start": "webpack && node ./index.js",
 8 |         "test": "echo \"Error: no test specified\" && exit 1",
 9 |         "dev-server": "./node_modules/.bin/webpack-dev-server --mode development --content-base ./public --port 3000"
10 |     },
11 |     "author": "",
12 |     "license": "ISC",
13 |     "dependencies": {
14 |         "bootstrap": "^4.1.3",
15 |         "dsteem": "^0.10.1",
16 |         "koa": "^2.5.3",
17 |         "koa-static": "^5.0.0",
18 |         "remarkable": "^1.7.1"
19 |     },
20 |     "devDependencies": {
21 |         "css-loader": "^1.0.0",
22 |         "style-loader": "^0.23.1",
23 |         "webpack": "^4.20.2",
24 |         "webpack-cli": "^3.1.2",
25 |         "webpack-dev-server": "^3.1.9"
26 |     }
27 | }
28 | 


--------------------------------------------------------------------------------
/tutorials/11_submit_comment_reply/public/app.js:
--------------------------------------------------------------------------------
 1 | //Step 1.
 2 | import { Client, PrivateKey } from 'dsteem';
 3 | import { Testnet as NetConfig } from '../../configuration'; //A Steem Testnet. Replace 'Testnet' with 'Mainnet' to connect to the main Steem blockchain.
 4 | 
 5 | let opts = { ...NetConfig.net };
 6 | 
 7 | //connect to server which is connected to the network/testnet
 8 | const client = new Client(NetConfig.url, opts);
 9 | 
10 | //Step 2. user fills in the values for 'parent_author' and 'parent_permlink'
11 | //Step 3. user adds content for the comment in the 'body' textarea
12 | 
13 | //submit post function
14 | window.submitComment = async () => {
15 |     //Step 4. get all values from the UI
16 | 
17 |     //get private key
18 |     const privateKey = PrivateKey.fromString(
19 |         document.getElementById('postingKey').value
20 |     );
21 |     //get account name
22 |     const account = document.getElementById('username').value;
23 |     //get body
24 |     const body = document.getElementById('body').value;
25 |     //get parent author permalink
26 |     const parent_author = document.getElementById('parent_author').value;
27 |     //get parent author permalink
28 |     const parent_permlink = document.getElementById('parent_permlink').value;
29 | 
30 |     //generate random permanent link for post
31 |     const permlink = Math.random()
32 |         .toString(36)
33 |         .substring(2);
34 | 
35 |     const payload = {
36 |         author: account,
37 |         title: '',
38 |         body: body,
39 |         parent_author: parent_author,
40 |         parent_permlink: parent_permlink,
41 |         permlink: permlink,
42 |         json_metadata: '',
43 |     };
44 | 
45 |     console.log('client.broadcast.comment payload:', payload);
46 |     client.broadcast.comment(payload, privateKey).then(
47 |         function(result) {
48 |             console.log('client.broadcast.comment response', result);
49 |             document.getElementById('postLink').style.display = 'block';
50 |             document.getElementById(
51 |                 'postLink'
52 |             ).innerHTML = `<br/><p>Included in block: ${
53 |                 result.block_num
54 |             }</p><br/><br/><a href="http://condenser.steem.vc/@${parent_author}/${parent_permlink}">Check post here</a>`;
55 |         },
56 |         function(error) {
57 |             console.error(error);
58 |         }
59 |     );
60 | };
61 | 
62 | window.clearFields = function() {
63 |     document.getElementById('body').value = '';
64 |     document.getElementById('parent_author').value = '';
65 |     document.getElementById('parent_permlink').value = '';
66 | };
67 | 
68 | window.onload = () => {
69 |     const account = NetConfig.accounts[0];
70 |     document.getElementById('username').value = account.address;
71 |     document.getElementById('postingKey').value = account.privPosting;
72 | };
73 | 


--------------------------------------------------------------------------------
/tutorials/11_submit_comment_reply/public/index.html:
--------------------------------------------------------------------------------
 1 | <html>
 2 |     <head>
 3 |         <title>Submit post</title>
 4 |         <script src="bundle.js"></script>
 5 |     </head>
 6 |     <body>
 7 |     	<div class="container" id="content"><br/>
 8 |     		<h4>Submit a post to the Steem blockchain</h4>
 9 |             Username: <input id="username" type="text" size="65" class="form-control"><br/>
10 |             Posting private key: <input id="postingKey" type="password" size="65" class="form-control"><br/>
11 |             Parent Author: <input id="parent_author" type="text" size="20" /><br/>
12 |             Parent Post Permalink: <input id="parent_permlink" type="text" size="20" /><br/>
13 |             Comment body:<br/>
14 |             <textarea id="body" class="form-control" rows="3">Content of the comment</textarea><br/>
15 |             <input id="submitPostBtn" type="button" value="Submit comment!" onclick="submitComment()" class="btn btn-primary">
16 |             <input id="clearFieldsBtn" type="button" value="Clear Fields" onclick="clearFields()" class="btn btn-primary">
17 |             <div id="postLink">
18 |             </div>
19 | 		</div>
20 |     </body>
21 | </html>


--------------------------------------------------------------------------------
/tutorials/11_submit_comment_reply/public/style.scss:
--------------------------------------------------------------------------------
1 | import 'bootstrap/dist/css/bootstrap.min.css'


--------------------------------------------------------------------------------
/tutorials/11_submit_comment_reply/webpack.config.js:
--------------------------------------------------------------------------------
 1 | var path = require('path');
 2 | module.exports = {
 3 |     entry: ['./public/app.js', './public/style.scss'],
 4 |     output: {
 5 |         path: path.resolve(__dirname, 'public'),
 6 |         filename: 'bundle.js',
 7 |     },
 8 |     devtool: 'source-map',
 9 |     module: {
10 |         rules: [
11 |             {
12 |                 test: /\.css$/,
13 |                 use: ['style-loader', 'css-loader'],
14 |             },
15 |         ],
16 |     },
17 |     performance: {
18 |         hints: process.env.NODE_ENV === 'production' ? 'warning' : false,
19 |     },
20 | };
21 | 


--------------------------------------------------------------------------------
/tutorials/12_edit_content_patching/index.js:
--------------------------------------------------------------------------------
1 | const Koa = require('koa');
2 | const app = new Koa();
3 | const serve = require('koa-static');
4 | app.use(serve('./public'));
5 | 
6 | app.listen(3000);
7 | 
8 | console.log('listening on port 3000');
9 | 


--------------------------------------------------------------------------------
/tutorials/12_edit_content_patching/package.json:
--------------------------------------------------------------------------------
 1 | {
 2 |     "name": "12_edit_content_patching",
 3 |     "version": "1.0.0",
 4 |     "description": "",
 5 |     "main": "index.js",
 6 |     "scripts": {
 7 |         "start": "webpack && node ./index.js",
 8 |         "test": "echo \"Error: no test specified\" && exit 1",
 9 |         "dev-server":
10 |             "./node_modules/.bin/webpack-dev-server --mode development --content-base ./public --port 3000"
11 |     },
12 |     "author": "",
13 |     "license": "ISC",
14 |     "dependencies": {
15 |         "bootstrap": "^4.1.3",
16 |         "diff-match-patch": "^1.0.4",
17 |         "dsteem": "^0.10.1",
18 |         "koa": "^2.5.3",
19 |         "koa-static": "^5.0.0",
20 |         "remarkable": "^1.7.1"
21 |     },
22 |     "devDependencies": {
23 |         "css-loader": "^1.0.0",
24 |         "style-loader": "^0.23.1",
25 |         "webpack": "^4.20.2",
26 |         "webpack-cli": "^3.1.2",
27 |         "webpack-dev-server": "^3.1.9"
28 |     }
29 | }
30 | 


--------------------------------------------------------------------------------
/tutorials/12_edit_content_patching/public/index.html:
--------------------------------------------------------------------------------
 1 | <html>
 2 |     <head>
 3 |         <title>Submit edited post</title>
 4 |         <script src="bundle.js"></script>
 5 |     </head>
 6 |     <body>
 7 |     	<div class="container" id="content"><br/>
 8 |     		<h4>Submit edited post to the Steem blockchain</h4>
 9 |             <p>We will fetch latest post of @<span id="usernameInText"></span> and fill the form below for editing</p>
10 |             Username: <input id="username" type="text" size="65" class="form-control"><br/>
11 |             Posting private key: <input id="postingKey" type="password" size="65" class="form-control"><br/>
12 |             <input type="button" value="Refetch latest post" onclick="getLatestPost()" class="btn btn-primary"><br/><br/>
13 |             Title of post: <input id="title" type="text" size="65" class="form-control" value=""><br/>
14 |             Post body:<br/>
15 |             <textarea id="body" class="form-control" rows="3"></textarea><br/>
16 |             Tags: <input id="tags" type="text" size="65" class="form-control" value=""><br/>
17 |             <input id="submitPostBtn" type="button" value="Submit post!" onclick="submitPost()" class="btn btn-primary">
18 |             <div id="postLink" style="display: none;">
19 |             </div>
20 | 		</div>
21 |     </body>
22 | </html>


--------------------------------------------------------------------------------
/tutorials/12_edit_content_patching/public/style.scss:
--------------------------------------------------------------------------------
1 | import 'bootstrap/dist/css/bootstrap.min.css'


--------------------------------------------------------------------------------
/tutorials/12_edit_content_patching/webpack.config.js:
--------------------------------------------------------------------------------
 1 | var path = require('path');
 2 | module.exports = {
 3 |     entry: ['./public/app.js', './public/style.scss'],
 4 |     output: {
 5 |         path: path.resolve(__dirname, 'public'),
 6 |         filename: 'bundle.js',
 7 |     },
 8 |     devtool: 'source-map',
 9 |     module: {
10 |         rules: [
11 |             {
12 |                 test: /\.css$/,
13 |                 use: ['style-loader', 'css-loader'],
14 |             },
15 |         ],
16 |     },
17 |     performance: {
18 |         hints: process.env.NODE_ENV === 'production' ? 'warning' : false,
19 |     },
20 | };
21 | 


--------------------------------------------------------------------------------
/tutorials/13_stream_blockchain_transactions/index.js:
--------------------------------------------------------------------------------
1 | const Koa = require('koa');
2 | const app = new Koa();
3 | const serve = require('koa-static');
4 | app.use(serve('./public'));
5 | 
6 | app.listen(3000);
7 | 
8 | console.log('listening on port 3000');
9 | 


--------------------------------------------------------------------------------
/tutorials/13_stream_blockchain_transactions/package.json:
--------------------------------------------------------------------------------
 1 | {
 2 |     "name": "13_stream_blockchain_transactions",
 3 |     "version": "1.0.0",
 4 |     "description": "",
 5 |     "main": "index.js",
 6 |     "scripts": {
 7 |         "start": "webpack && node ./index.js",
 8 |         "test": "echo \"Error: no test specified\" && exit 1",
 9 |         "dev-server":
10 |             "./node_modules/.bin/webpack-dev-server --mode development --content-base ./public --port 3000"
11 |     },
12 |     "author": "",
13 |     "license": "ISC",
14 |     "dependencies": {
15 |         "bootstrap": "^4.1.3",
16 |         "diff-match-patch": "^1.0.4",
17 |         "dsteem": "^0.10.1",
18 |         "koa": "^2.5.3",
19 |         "koa-static": "^5.0.0",
20 |         "remarkable": "^1.7.1"
21 |     },
22 |     "devDependencies": {
23 |         "css-loader": "^1.0.0",
24 |         "style-loader": "^0.23.1",
25 |         "webpack": "^4.20.2",
26 |         "webpack-cli": "^3.1.2",
27 |         "webpack-dev-server": "^3.1.9"
28 |     }
29 | }
30 | 


--------------------------------------------------------------------------------
/tutorials/13_stream_blockchain_transactions/public/app.js:
--------------------------------------------------------------------------------
 1 | const dsteem = require('dsteem');
 2 | 
 3 | let opts = {};
 4 | 
 5 | //connect to production server
 6 | opts.addressPrefix = 'STM';
 7 | opts.chainId =
 8 |     '0000000000000000000000000000000000000000000000000000000000000000';
 9 | 
10 | //connect to server which is connected to the network/production
11 | const client = new dsteem.Client('https://api.steemit.com');
12 | 
13 | let stream;
14 | let state;
15 | let blocks = [];
16 | //start stream
17 | async function main() {
18 |     stream = client.blockchain.getBlockStream();
19 |     stream
20 |         .on('data', function(block) {
21 |             //console.log(block);
22 |             blocks.unshift(
23 |                 `<div class="list-group-item"><h5 class="list-group-item-heading">Block id: ${
24 |                     block.block_id
25 |                 }</h5><p>Transactions in this block: ${
26 |                     block.transactions.length
27 |                 } <br>Witness: ${
28 |                     block.witness
29 |                 }</p><p class="list-group-item-text text-right text-nowrap">Timestamp: ${
30 |                     block.timestamp
31 |                 }</p></div>`
32 |             );
33 |             document.getElementById('blockList').innerHTML = blocks.join('');
34 |         })
35 |         .on('end', function() {
36 |             // done
37 |             console.log('END');
38 |         });
39 | }
40 | //catch error messages
41 | main().catch(console.error);
42 | 
43 | //pause stream
44 | window.pauseStream = async () => {
45 |     state = stream.pause();
46 | };
47 | 
48 | //resume stream
49 | window.resumeStream = async () => {
50 |     state = state.resume();
51 | };
52 | 


--------------------------------------------------------------------------------
/tutorials/13_stream_blockchain_transactions/public/index.html:
--------------------------------------------------------------------------------
 1 | <html>
 2 |     <head>
 3 |         <title>Stream Steem blockchain</title>
 4 |         <script src="bundle.js"></script>
 5 |     </head>
 6 |     <body>
 7 |     	<div class="container" id="content"><br/>
 8 |     		<h4>Stream Steem blocks and transactions</h4>
 9 |             <br/>
10 |             <input id="submitPauseBtn" type="button" value="Pause Stream" onclick="pauseStream()" class="btn btn-primary">
11 |             <input id="submitResumeBtn" type="button" value="Resume Stream" onclick="resumeStream()" class="btn btn-secondary">
12 |             <br/><br/>
13 |             <div class="list-group" id="blockList"></div>
14 | 		</div>
15 |     </body>
16 | </html>


--------------------------------------------------------------------------------
/tutorials/13_stream_blockchain_transactions/public/style.scss:
--------------------------------------------------------------------------------
1 | import 'bootstrap/dist/css/bootstrap.min.css'


--------------------------------------------------------------------------------
/tutorials/13_stream_blockchain_transactions/webpack.config.js:
--------------------------------------------------------------------------------
 1 | var path = require('path');
 2 | module.exports = {
 3 |     entry: ['./public/app.js', './public/style.scss'],
 4 |     output: {
 5 |         path: path.resolve(__dirname, 'public'),
 6 |         filename: 'bundle.js',
 7 |     },
 8 |     devtool: 'source-map',
 9 |     module: {
10 |         rules: [
11 |             {
12 |                 test: /\.css$/,
13 |                 use: ['style-loader', 'css-loader'],
14 |             },
15 |         ],
16 |     },
17 |     performance: {
18 |         hints: process.env.NODE_ENV === 'production' ? 'warning' : false,
19 |     },
20 | };
21 | 


--------------------------------------------------------------------------------
/tutorials/14_reblogging_post/index.js:
--------------------------------------------------------------------------------
1 | const Koa = require('koa');
2 | const app = new Koa();
3 | const serve = require('koa-static');
4 | app.use(serve('./public'));
5 | 
6 | app.listen(3000);
7 | 
8 | console.log('listening on port 3000');
9 | 


--------------------------------------------------------------------------------
/tutorials/14_reblogging_post/package.json:
--------------------------------------------------------------------------------
 1 | {
 2 |     "name": "14_reblogging_post",
 3 |     "version": "1.0.0",
 4 |     "description": "",
 5 |     "main": "index.js",
 6 |     "scripts": {
 7 |         "start": "webpack && node ./index.js",
 8 |         "test": "echo \"Error: no test specified\" && exit 1",
 9 |         "dev-server":
10 |             "./node_modules/.bin/webpack-dev-server --mode development --content-base ./public --port 3000"
11 |     },
12 |     "author": "",
13 |     "license": "ISC",
14 |     "dependencies": {
15 |         "bootstrap": "^4.1.3",
16 |         "dsteem": "^0.10.1",
17 |         "koa": "^2.5.3",
18 |         "koa-static": "^5.0.0",
19 |         "remarkable": "^1.7.1"
20 |     },
21 |     "devDependencies": {
22 |         "css-loader": "^1.0.0",
23 |         "style-loader": "^0.23.1",
24 |         "webpack": "^4.20.2",
25 |         "webpack-cli": "^3.1.2",
26 |         "webpack-dev-server": "^3.1.9"
27 |     }
28 | }
29 | 


--------------------------------------------------------------------------------
/tutorials/14_reblogging_post/public/app.js:
--------------------------------------------------------------------------------
  1 | import { Client, PrivateKey } from 'dsteem';
  2 | 
  3 | //define network parameters
  4 | let opts = {};
  5 | opts.addressPrefix = 'STM';
  6 | opts.chainId =
  7 |     '0000000000000000000000000000000000000000000000000000000000000000';
  8 | //connect to a Steem node. This is currently setup on production, but we recommend using a testnet like https://testnet.steem.vc
  9 | const client = new Client('https://api.steemit.com', opts);
 10 | window.client = client;
 11 | 
 12 | //This is a convenience function for the UI.
 13 | window.autofillAuthorAndPermlink = function(el) {
 14 |     document.getElementById('theAuthor').value = el.dataset.author;
 15 |     document.getElementById('thePermLink').value = el.dataset.permlink;
 16 | };
 17 | 
 18 | function fetchBlog() {
 19 |     const query = {
 20 |         tag: 'steemitblog',
 21 |         limit: 5,
 22 |     };
 23 | 
 24 |     client.database
 25 |         .getDiscussions('blog', query) //get a list of posts for easy resteeming.
 26 |         .then(result => {
 27 |             //when the response comes back ...
 28 |             const postList = [];
 29 |             console.log('Listing blog posts by ' + query.tag);
 30 |             result.forEach(post => {
 31 |                 //... loop through the posts ...
 32 |                 const author = post.author;
 33 |                 const permlink = post.permlink;
 34 |                 console.log(author, permlink, post);
 35 |                 postList.push(
 36 |                     // and render the table rows
 37 |                     `<tr><td><button class="btn-sm btn-success" data-author="${author}" data-permlink="${permlink}" onclick="autofillAuthorAndPermlink(this)">Autofill</button></td><td>${author}</td><td>${permlink}</td></tr>`
 38 |                 );
 39 |             });
 40 | 
 41 |             document.getElementById('postList').innerHTML = postList.join('');
 42 |         })
 43 |         .catch(err => {
 44 |             console.error(err);
 45 |             alert('Error occured' + err);
 46 |         });
 47 | }
 48 | 
 49 | //this function will execute when the "Resteem!" button is clicked
 50 | window.submitPost = async () => {
 51 |     resteemOutput('preparing to submit');
 52 |     //get private key
 53 |     try {
 54 |         const privateKey = PrivateKey.from(
 55 |             document.getElementById('postingKey').value
 56 |         );
 57 | 
 58 |         //get account name
 59 |         const myAccount = document.getElementById('username').value;
 60 |         //get blog author
 61 |         const theAuthor = document.getElementById('theAuthor').value;
 62 |         //get blog permLink
 63 |         const thePermLink = document.getElementById('thePermLink').value;
 64 | 
 65 |         const jsonOp = JSON.stringify([
 66 |             'reblog',
 67 |             {
 68 |                 account: myAccount,
 69 |                 author: theAuthor,
 70 |                 permlink: thePermLink,
 71 |             },
 72 |         ]);
 73 | 
 74 |         const data = {
 75 |             id: 'follow',
 76 |             json: jsonOp,
 77 |             required_auths: [],
 78 |             required_posting_auths: [myAccount],
 79 |         };
 80 |         resteemOutput('resteeming:\n', JSON.stringify(data, 2));
 81 |         console.log('resteeming:', data);
 82 |         client.broadcast.json(data, privateKey).then(
 83 |             function(result) {
 84 |                 resteemOutput(result);
 85 |                 console.log('resteem result: ', result);
 86 |             },
 87 |             function(error) {
 88 |                 console.error(error);
 89 |             }
 90 |         );
 91 |     } catch (e) {
 92 |         resteemOutput(e.message);
 93 |         console.log(e);
 94 |     }
 95 | };
 96 | 
 97 | function resteemOutput(output) {
 98 |     document.getElementById('results').innerText = output;
 99 | }
100 | 
101 | window.onload = async () => {
102 |     fetchBlog();
103 | };
104 | 


--------------------------------------------------------------------------------
/tutorials/14_reblogging_post/public/index.css:
--------------------------------------------------------------------------------
1 | td {
2 | }
3 | table {
4 | }
5 | 


--------------------------------------------------------------------------------
/tutorials/14_reblogging_post/public/index.html:
--------------------------------------------------------------------------------
 1 | <html>
 2 |     <head>
 3 |         <title>Re-blog post</title>
 4 |         <script src="bundle.js"></script>
 5 |     </head>
 6 |     <body>
 7 |         <div class="container" id="content"><br/>
 8 |             <h1>Re-blog post</h1>
 9 |             <p>
10 |                 This tutorial encourages experimentation. You can choose from one of the <i>Trending posts</i> that appear below,
11 |                 or you can type in your own author and permlink to re-steem. Please note that by default this tutorial
12 |                 is configured to run on the main network; any re-steems go onto the chain forever! If you want to play
13 |                 with this tutorial in a safer environment, we suggest using a testnet ex:https://testnet.steem.vc.
14 |             </p>
15 |             <h4>Trending posts</h4>
16 |             <table class="table">
17 |                 <thead>
18 |                     <tr>
19 |                         <th>
20 |                             Resteem
21 |                         </th>
22 |                         <th>
23 |                             Author
24 |                         </th>
25 |                         <th>
26 |                             Permlink
27 |                         </th>
28 |                     </tr>
29 |                 </thead>
30 |                 <tbody id="postList">
31 |                     <tr>
32 |                         <td colspan="99">
33 |                             <b>Loading...</b>
34 |                         </td>
35 |                     </tr>
36 |                 </tbody>
37 |             </table>
38 |             <h4>Data required to resteem a post</h4>
39 |             <p>(You have to provide the account that will do the resteeming)</p>
40 |             Account username that will resteem: <input id="username" type="text" size="65" value="" class="form-control"><br/>
41 |             Posting private key: <input id="postingKey" type="text" size="65" value="" class="form-control"><br/>
42 |             The author to resteem: <input id="theAuthor" type="text" size="65" value="" class="form-control"><br/>
43 |             The Post to resteem: <input id="thePermLink" type="text" size="65" value="" class="form-control"><br/>
44 |             <input id="submitPostBtn" type="button" value="Resteem!" onclick="submitPost()" class="btn btn-primary">
45 |             <div id="postLink" style="display: none;">
46 |             </div>
47 |             <h4>Resteem Results</h4>
48 |             (see console log for actual object)
49 |             <pre id="results">
50 | 
51 |             </pre>
52 |         </div>
53 |     </body>
54 | </html>


--------------------------------------------------------------------------------
/tutorials/14_reblogging_post/public/style.scss:
--------------------------------------------------------------------------------
1 | import 'bootstrap/dist/css/bootstrap.min.css'
2 | import './index.css'


--------------------------------------------------------------------------------
/tutorials/14_reblogging_post/webpack.config.js:
--------------------------------------------------------------------------------
 1 | var path = require('path');
 2 | module.exports = {
 3 |     entry: ['./public/app.js', './public/style.scss'],
 4 |     output: {
 5 |         path: path.resolve(__dirname, 'public'),
 6 |         filename: 'bundle.js',
 7 |     },
 8 |     devtool: 'source-map',
 9 |     module: {
10 |         rules: [
11 |             {
12 |                 test: /\.css$/,
13 |                 use: ['style-loader', 'css-loader'],
14 |             },
15 |         ],
16 |     },
17 |     performance: {
18 |         hints: process.env.NODE_ENV === 'production' ? 'warning' : false,
19 |     },
20 | };
21 | 


--------------------------------------------------------------------------------
/tutorials/15_search_accounts/README.md:
--------------------------------------------------------------------------------
 1 | # Search Account Names
 2 | 
 3 | _By the end of this tutorial you should know how to call a list of user names from the steem blockchain_
 4 | 
 5 | This tutorial will show the method of capturing a queried user name, matching that to the steem database and then displaying the matching names. This tutorial will be run on the `production server`.
 6 | 
 7 | ## Intro
 8 | 
 9 | We are using the `call` function provided by the `dsteem` library to pull user names from the steem blockchain. The information being pulled is dependent on two variables:
10 | 
11 | 1.  The max number of user names that needs to be displayed by the search
12 | 2.  The string representing the first characters of the user name you are searching for
13 | 
14 | A simple HTML interface is used to both capture the string query as well as display the completed search. The layout can be found in the "index.html" file.
15 | 
16 | ## Steps
17 | 
18 | 1. [**Configure connection**](#configure_connection) Configuration of `dsteem` to use the proper connection and network.
19 | 2. [**Collecting input variables**](#collecting_input_variables) Assigning and collecting the necessary variables
20 | 3. [**Blockchain query**](#blockchain_query) Finding the data on the blockchain based on the inputs
21 | 4. [**Output**](#output) Displaying query results
22 | 
23 | 
24 | #### 1. **Configure connection**<a name="configure_connection"></a>
25 | 
26 | Below we have `dsteem` pointing to the production network with the proper chainId, addressPrefix, and endpoint. There is a `public/app.js` file which holds the Javascript segment of this tutorial. In the first few lines we define the configured library and packages:
27 | 
28 | ```javascript
29 | const dsteem = require('dsteem');
30 | let opts = {};
31 | //connect to production server
32 | opts.addressPrefix = 'STM';
33 | opts.chainId =
34 | 	'0000000000000000000000000000000000000000000000000000000000000000';
35 | //connect to server which is connected to the network/production
36 | const client = new dsteem.Client('https://api.steemit.com');
37 | ```
38 | 
39 | #### 2.  **Collecting input variables**<a name="collecting_input_variables"></a>
40 | 
41 | Next we assign the max number of lines that will be returned by the query. We also use `getElementById` to retrieve the requested user name for searching from the HTML interface. The `max` value can very easily also be attained from the HTML side simply by adding another input line in `index.html` and a second `getElementById` line.
42 | 
43 | ```javascript
44 | const max = 10;
45 | window.submitAcc = async () => {
46 |     const accSearch = document.getElementById("username").value;
47 | ```
48 | 
49 | #### 3.  **Blockchain query**<a name="blockchain_query"></a>
50 | 
51 | The next step is to pull the user names from the blockchain that matches the "username" variable that was retrieved. This is done using the `database.call` function and assigning the result to an array.
52 | 
53 | ```javascript
54 | const _accounts = await client.database.call('lookup_accounts',[accSearch, max]);
55 |     console.log(`_accounts:`, _accounts);
56 | ```
57 | 
58 | #### 4.  **Output**<a name="output"></a>
59 | 
60 | Finally we create a list from the "_accounts" array generated in step 3.
61 | 
62 | ```javascript
63 | document.getElementById('accList').innerHTML = _accounts.join('<br>');
64 | }
65 | ```
66 | 
67 | ## To run this tutorial
68 | 
69 | 1.  clone this repo
70 | 2.  `cd tutorials/15_search_accounts`
71 | 3.  `npm i`
72 | 4.  `npm run dev-server` or `npm run start`
73 | 5.  After a few moments, the server should be running at [http://localhost:3000/](http://localhost:3000/)
74 | 


--------------------------------------------------------------------------------
/tutorials/15_search_accounts/index.js:
--------------------------------------------------------------------------------
1 | const Koa = require('koa');
2 | const app = new Koa();
3 | const serve = require('koa-static');
4 | app.use(serve('./public'));
5 | 
6 | app.listen(3000);
7 | 
8 | console.log('listening on port 3000');
9 | 


--------------------------------------------------------------------------------
/tutorials/15_search_accounts/package.json:
--------------------------------------------------------------------------------
 1 | {
 2 |     "name": "15_search_accounts",
 3 |     "version": "1.0.0",
 4 |     "description": "",
 5 |     "main": "index.js",
 6 |     "scripts": {
 7 |         "start": "webpack && node ./index.js",
 8 |         "test": "echo \"Error: no test specified\" && exit 1",
 9 |         "dev-server": "./node_modules/.bin/webpack-dev-server --mode development --content-base ./public --port 3000"
10 |     },
11 |     "author": "",
12 |     "license": "ISC",
13 |     "dependencies": {
14 |         "bootstrap": "^4.1.3",
15 |         "dsteem": "^0.10.1",
16 |         "koa": "^2.5.3",
17 |         "koa-static": "^5.0.0",
18 |         "remarkable": "^1.7.1"
19 |     },
20 |     "devDependencies": {
21 |         "css-loader": "^1.0.0",
22 |         "style-loader": "^0.23.1",
23 |         "webpack": "^4.20.2",
24 |         "webpack-cli": "^3.1.2",
25 |         "webpack-dev-server": "^3.1.9"
26 |     }
27 | }
28 | 


--------------------------------------------------------------------------------
/tutorials/15_search_accounts/public/app.js:
--------------------------------------------------------------------------------
 1 | const dsteem = require('dsteem');
 2 | let opts = {};
 3 | //connect to production server
 4 | opts.addressPrefix = 'STM';
 5 | opts.chainId =
 6 |     '0000000000000000000000000000000000000000000000000000000000000000';
 7 | //connect to server which is connected to the network/production
 8 | const client = new dsteem.Client('https://api.steemit.com');
 9 | 
10 | 
11 | 
12 | //submitAcc function from html input
13 | const max = 10;
14 | window.submitAcc = async () => {
15 |     const accSearch = document.getElementById("username").value;
16 |     
17 |     const _accounts = await client.database.call('lookup_accounts',[accSearch, max]);
18 |     console.log(`_accounts:`, _accounts);
19 | 
20 | //disply list of account names with line breaks
21 |     document.getElementById('accList').innerHTML = _accounts.join('<br>');
22 | }


--------------------------------------------------------------------------------
/tutorials/15_search_accounts/public/index.css:
--------------------------------------------------------------------------------
1 | #replies img,
2 | #replies iframe {
3 |     max-width: 100%;    
4 | }
5 | 


--------------------------------------------------------------------------------
/tutorials/15_search_accounts/public/index.html:
--------------------------------------------------------------------------------
 1 | <html>
 2 |     <head>
 3 |         <title>Find Account</title>
 4 |         <script src="bundle.js"></script>
 5 |     </head>
 6 |     <body>
 7 |     	<div class="container" id="content"><br/>
 8 |     		<h4>Enter Account Name to search</h4>
 9 |             <input id="username" type="text" size="65" placeholder="Search for account names..." class="form-control">
10 |             <input id="submitAccBtn" type="button" value="Start search!" onclick="submitAcc()" class="btn btn-primary"><br/>
11 |             <h4>Matching Account Names:</h4><br/>
12 |             <div class="list-group" id="accList"></div>
13 |             </div>
14 | 		</div>
15 |     </body>
16 | </html>


--------------------------------------------------------------------------------
/tutorials/15_search_accounts/public/style.scss:
--------------------------------------------------------------------------------
1 | import 'bootstrap/dist/css/bootstrap.min.css'
2 | import './index.css'


--------------------------------------------------------------------------------
/tutorials/15_search_accounts/webpack.config.js:
--------------------------------------------------------------------------------
 1 | var path = require('path');
 2 | module.exports = {
 3 |     entry: ['./public/app.js', './public/style.scss'],
 4 |     output: {
 5 |         path: path.resolve(__dirname, 'public'),
 6 |         filename: 'bundle.js',
 7 |     },
 8 |     devtool: 'source-map',
 9 |     module: {
10 |         rules: [
11 |             {
12 |                 test: /\.css$/,
13 |                 use: ['style-loader', 'css-loader'],
14 |             },
15 |         ],
16 |     },
17 |     performance: {
18 |         hints: process.env.NODE_ENV === 'production' ? 'warning' : false,
19 |     },
20 | };
21 | 


--------------------------------------------------------------------------------
/tutorials/16_search_tags/README.md:
--------------------------------------------------------------------------------
 1 | # Search for Tags
 2 | 
 3 | _By the end of this tutorial you should know how to run a search for trending tags_
 4 | 
 5 | This tutorial runs on the main Steem blockchain.
 6 | 
 7 | ## Intro
 8 | 
 9 | This tutorial will show the method of capturing a queried tag name and matching it to the steem database. We are using the `call` function provided by the `dsteem` library to pull tags from the steem blockchain. A simple HTML interface is used to both capture the string query as well as display the completed search.
10 | 
11 | ## steps
12 | 
13 | 1.  [**Configure connection**](#configure-conn) Configuration of `dsteem` to use the proper connection and network.
14 | 2.  [**Search input**](#search-input) Collecting the relevant search criteria
15 | 3.  [**Run Search**](#run-search) Running the search on the blockchain
16 | 4.  [**Output**](#output) Displaying the results of the search query
17 | 
18 | #### 1. Configure connection <a name="configure-conn"></a>
19 | 
20 | Below we have `dsteem` pointing to the production network with the proper chainId, addressPrefix, and endpoint. There is a `public/app.js` file which holds the Javascript segment of this tutorial. In the first few lines we define the configured library and packages:
21 | 
22 | ```javascript
23 | const dsteem = require('dsteem');
24 | let opts = {};
25 | //connect to production server
26 | opts.addressPrefix = 'STM';
27 | opts.chainId =
28 |     '0000000000000000000000000000000000000000000000000000000000000000';
29 | //connect to server which is connected to the network/production
30 | const client = new dsteem.Client('https://api.steemit.com');
31 | ```
32 | 
33 | #### 2. Search input <a name="search-input"></a>
34 | 
35 | Collecting of the search criteria happens via an HTML input. The form can be found in the `index.html` file. The values are pulled from that screen with the below:
36 | 
37 | ```javascript
38 | const max = 10;
39 | window.submitTag = async () => {
40 |     const tagSearch = document.getElementById("tagName").value;
41 | ```
42 | 
43 | #### 3. Run Search <a name="run-search"></a>
44 | 
45 | In order to access the blockchain to run the search a `call` function is used with the `search field` and `maximum` list items as parameters.
46 | 
47 | ```javascript
48 | const _tags = await client.database.call('get_trending_tags',[tagSearch, max]);
49 | ```
50 | 
51 | The result of the search is an array of tags along with their respective vital data like `comments`, `payouts`, etc.
52 | 
53 | #### 4. Output <a name="output"></a>
54 | 
55 | Due to the output from the `call` function being an array, we can't use a simple `post` function to display the tags. The specific fields within the array needs to be selected and then displayed.
56 | 
57 | ```javascript
58 | console.log('tags: ', _tags);
59 | var posts = [];
60 | _tags.forEach(post => {
61 |     posts.push(
62 |         `<div class="list-group-item"><h5 class="list-group-item-heading">${
63 |             post.name
64 |         }</h5></div>`
65 |     );
66 | });
67 | //disply list of tags with line breaks
68 | document.getElementById('tagList').innerHTML = posts.join('<br>');
69 | ```
70 | 
71 | ### To run this tutorial
72 | 
73 | 1.  clone this repo
74 | 1.  `cd tutorials/16_search_tags`
75 | 1.  `npm i`
76 | 1.  `npm run dev-server` or `npm run start`
77 | 1.  After a few moments, the server should be running at http://localhost:3000/
78 | 


--------------------------------------------------------------------------------
/tutorials/16_search_tags/index.js:
--------------------------------------------------------------------------------
1 | const Koa = require('koa');
2 | const app = new Koa();
3 | const serve = require('koa-static');
4 | app.use(serve('./public'));
5 | 
6 | app.listen(3000);
7 | 
8 | console.log('listening on port 3000');
9 | 


--------------------------------------------------------------------------------
/tutorials/16_search_tags/package.json:
--------------------------------------------------------------------------------
 1 | {
 2 |     "name": "16_search_tags",
 3 |     "version": "1.0.0",
 4 |     "description": "",
 5 |     "main": "index.js",
 6 |     "scripts": {
 7 |         "start": "webpack && node ./index.js",
 8 |         "test": "echo \"Error: no test specified\" && exit 1",
 9 |         "dev-server":
10 |             "./node_modules/.bin/webpack-dev-server --mode development --content-base ./public --port 3000"
11 |     },
12 |     "author": "",
13 |     "license": "ISC",
14 |     "dependencies": {
15 |         "bootstrap": "^4.1.3",
16 |         "dsteem": "^0.10.1",
17 |         "koa": "^2.5.3",
18 |         "koa-static": "^5.0.0",
19 |         "remarkable": "^1.7.1"
20 |     },
21 |     "devDependencies": {
22 |         "css-loader": "^1.0.0",
23 |         "style-loader": "^0.23.1",
24 |         "webpack": "^4.20.2",
25 |         "webpack-cli": "^3.1.2",
26 |         "webpack-dev-server": "^3.1.9"
27 |     }
28 | }
29 | 


--------------------------------------------------------------------------------
/tutorials/16_search_tags/public/app.js:
--------------------------------------------------------------------------------
 1 | const dsteem = require('dsteem');
 2 | let opts = {};
 3 | //connect to production server
 4 | opts.addressPrefix = 'STM';
 5 | opts.chainId =
 6 |     '0000000000000000000000000000000000000000000000000000000000000000';
 7 | //connect to server which is connected to the network/production
 8 | const client = new dsteem.Client('https://api.steemit.com');
 9 | 
10 | //submitTab function from html input
11 | const max = 10;
12 | window.submitTag = async () => {
13 |     const tagSearch = document.getElementById('tagName').value;
14 | 
15 |     //get list of tags from blockchain
16 |     const _tags = await client.database.call('get_trending_tags', [
17 |         tagSearch,
18 |         max,
19 |     ]);
20 | 
21 |     console.log('tags: ', _tags);
22 |     var posts = [];
23 |     _tags.forEach(post => {
24 |         posts.push(
25 |             `<div class="list-group-item"><h5 class="list-group-item-heading">${
26 |                 post.name
27 |             }</h5></div>`
28 |         );
29 |     });
30 |     //disply list of tags with line breaks
31 |     document.getElementById('tagList').innerHTML = posts.join('<br>');
32 | };
33 | 


--------------------------------------------------------------------------------
/tutorials/16_search_tags/public/index.css:
--------------------------------------------------------------------------------
1 | #replies img,
2 | #replies iframe {
3 |     max-width: 100%;
4 | }
5 | 


--------------------------------------------------------------------------------
/tutorials/16_search_tags/public/index.html:
--------------------------------------------------------------------------------
 1 | <html>
 2 |     <head>
 3 |         <title>Search Tags</title>
 4 |         <script src="bundle.js"></script>
 5 |     </head>
 6 |     <body>
 7 |     	<div class="container" id="content"><br/>
 8 |     		<h4>Enter Tag to search</h4>
 9 |             <input id="tagName" type="text" size="65" placeholder="Search tags..." class="form-control">
10 |             <input id="submitTagBtn" type="button" value="Start search!" onclick="submitTag()" class="btn btn-primary"><br/>
11 |             <h4>Matching Tags:</h4><br/>
12 |             <div class="list-group" id="tagList"></div>
13 |             </div>
14 | 		</div>
15 |     </body>
16 | </html>


--------------------------------------------------------------------------------
/tutorials/16_search_tags/public/style.scss:
--------------------------------------------------------------------------------
1 | import 'bootstrap/dist/css/bootstrap.min.css'
2 | import './index.css'


--------------------------------------------------------------------------------
/tutorials/16_search_tags/webpack.config.js:
--------------------------------------------------------------------------------
 1 | var path = require('path');
 2 | module.exports = {
 3 |     entry: ['./public/app.js', './public/style.scss'],
 4 |     output: {
 5 |         path: path.resolve(__dirname, 'public'),
 6 |         filename: 'bundle.js',
 7 |     },
 8 |     devtool: 'source-map',
 9 |     module: {
10 |         rules: [
11 |             {
12 |                 test: /\.css$/,
13 |                 use: ['style-loader', 'css-loader'],
14 |             },
15 |         ],
16 |     },
17 |     performance: {
18 |         hints: process.env.NODE_ENV === 'production' ? 'warning' : false,
19 |     },
20 | };
21 | 


--------------------------------------------------------------------------------
/tutorials/17_vote_on_content/index.js:
--------------------------------------------------------------------------------
1 | const Koa = require('koa');
2 | const app = new Koa();
3 | const serve = require('koa-static');
4 | app.use(serve('./public'));
5 | 
6 | app.listen(3000);
7 | 
8 | console.log('listening on port 3000');
9 | 


--------------------------------------------------------------------------------
/tutorials/17_vote_on_content/package.json:
--------------------------------------------------------------------------------
 1 | {
 2 |     "name": "17_vote_on_content",
 3 |     "version": "1.0.0",
 4 |     "description": "",
 5 |     "main": "index.js",
 6 |     "scripts": {
 7 |         "start": "webpack && node ./index.js",
 8 |         "test": "echo \"Error: no test specified\" && exit 1",
 9 |         "dev-server": "./node_modules/.bin/webpack-dev-server --mode development --content-base ./public --port 3000"
10 |     },
11 |     "author": "",
12 |     "license": "ISC",
13 |     "dependencies": {
14 |         "bootstrap": "^4.1.3",
15 |         "dsteem": "^0.10.1",
16 |         "koa": "^2.5.3",
17 |         "koa-static": "^5.0.0",
18 |         "remarkable": "^1.7.1"
19 |     },
20 |     "devDependencies": {
21 |         "css-loader": "^1.0.0",
22 |         "style-loader": "^0.23.1",
23 |         "webpack": "^4.20.2",
24 |         "webpack-cli": "^3.1.2",
25 |         "webpack-dev-server": "^3.1.9"
26 |     }
27 | }
28 | 


--------------------------------------------------------------------------------
/tutorials/17_vote_on_content/public/style.scss:
--------------------------------------------------------------------------------
1 | import 'bootstrap/dist/css/bootstrap.min.css'


--------------------------------------------------------------------------------
/tutorials/17_vote_on_content/webpack.config.js:
--------------------------------------------------------------------------------
 1 | var path = require('path');
 2 | module.exports = {
 3 |     entry: ['./public/app.js', './public/style.scss'],
 4 |     output: {
 5 |         path: path.resolve(__dirname, 'public'),
 6 |         filename: 'bundle.js',
 7 |     },
 8 |     devtool: 'source-map',
 9 |     module: {
10 |         rules: [
11 |             {
12 |                 test: /\.css$/,
13 |                 use: ['style-loader', 'css-loader'],
14 |             },
15 |         ],
16 |     },
17 |     performance: {
18 |         hints: process.env.NODE_ENV === 'production' ? 'warning' : false,
19 |     },
20 | };
21 | 


--------------------------------------------------------------------------------
/tutorials/18_follow_a_user/index.js:
--------------------------------------------------------------------------------
1 | const Koa = require('koa');
2 | const app = new Koa();
3 | const serve = require('koa-static');
4 | app.use(serve('./public'));
5 | 
6 | app.listen(3000);
7 | 
8 | console.log('listening on port 3000');
9 | 


--------------------------------------------------------------------------------
/tutorials/18_follow_a_user/package.json:
--------------------------------------------------------------------------------
 1 | {
 2 |     "name": "18_follow_user",
 3 |     "version": "1.0.0",
 4 |     "description": "",
 5 |     "main": "index.js",
 6 |     "scripts": {
 7 |         "start": "webpack && node ./index.js",
 8 |         "test": "echo \"Error: no test specified\" && exit 1",
 9 |         "dev-server":
10 |             "./node_modules/.bin/webpack-dev-server --mode development --content-base ./public --port 3000"
11 |     },
12 |     "author": "",
13 |     "license": "ISC",
14 |     "dependencies": {
15 |         "bootstrap": "^4.1.3",
16 |         "dsteem": "^0.10.1",
17 |         "koa": "^2.5.3",
18 |         "koa-static": "^5.0.0",
19 |         "remarkable": "^1.7.1"
20 |     },
21 |     "devDependencies": {
22 |         "css-loader": "^1.0.0",
23 |         "style-loader": "^0.23.1",
24 |         "webpack": "^4.20.2",
25 |         "webpack-cli": "^3.1.2",
26 |         "webpack-dev-server": "^3.1.9"
27 |     }
28 | }
29 | 


--------------------------------------------------------------------------------
/tutorials/18_follow_a_user/public/app.js:
--------------------------------------------------------------------------------
 1 | //Step 1.
 2 | import { Client, PrivateKey } from 'dsteem';
 3 | import { Mainnet as NetConfig } from '../../configuration'; //A Steem Testnet. Replace 'Testnet' with 'Mainnet' to connect to the main Steem blockchain.
 4 | 
 5 | let opts = { ...NetConfig.net };
 6 | 
 7 | //connect to a steem node, testnet in this case
 8 | const client = new Client(NetConfig.url, opts);
 9 | 
10 | //Follow function
11 | window.submitFollow = async () => {
12 |     //get private key
13 |     const privateKey = PrivateKey.fromString(
14 |         document.getElementById('postingKey').value
15 |     );
16 |     //get account name
17 |     const follower = document.getElementById('username').value;
18 |     //get author permalink
19 |     const following = document.getElementById('author').value;
20 | 
21 |     //Step 3. checking whether author is already followed
22 |     //for full explanation of the process refer to tutorial 19_get_follower_and_following_list
23 | 
24 |     let status = await client.call('follow_api', 'get_following', [
25 |         follower,
26 |         following,
27 |         'blog',
28 |         1,
29 |     ]);
30 | 
31 |     console.log({ status: status });
32 | 
33 |     if (status.length > 0 && status[0].following == following) {
34 |         var type = '';
35 |     } else {
36 |         var type = 'blog';
37 |     }
38 | 
39 |     //Step 4. follow and unfollow is executed by the same operation with a change in only one of the parameters
40 |     
41 |     const json = JSON.stringify([
42 |         'follow',
43 |         {
44 |             follower: follower,
45 |             following: following,
46 |             what: [type], //null value for unfollow, 'blog' for follow
47 |         },
48 |     ]);
49 | 
50 |     const data = {
51 |         id: 'follow',
52 |         json: json,
53 |         required_auths: [],
54 |         required_posting_auths: [follower],
55 |     };
56 | 
57 |     //with variables assigned we can broadcast the operation
58 | 
59 |     client.broadcast.json(data, privateKey).then(
60 |         function(result) {
61 |             console.log('user follow result: ', result);
62 |             document.getElementById('followResultContainer').style.display =
63 |                 'flex';
64 |             document.getElementById('followResult').className =
65 |                 'form-control-plaintext alert alert-success';
66 |             if (type == 'blog') {
67 |                 document.getElementById('followResult').innerHTML =
68 |                     'Author followed';
69 |             } else {
70 |                 document.getElementById('followResult').innerHTML =
71 |                     'Author unfollowed';
72 |             }
73 |         },
74 |         function(error) {
75 |             console.error(error);
76 |             document.getElementById('followResultContainer').style.display =
77 |                 'flex';
78 |             document.getElementById('followResult').className =
79 |                 'form-control-plaintext alert alert-danger';
80 |             document.getElementById('followResult').innerHTML =
81 |                 error.jse_shortmsg;
82 |         }
83 |     );
84 | };
85 | 
86 | window.onload = async () => {
87 |     const account = NetConfig.accounts[0];
88 |     const accountI = NetConfig.accounts[1];
89 |     document.getElementById('username').value = account.address;
90 |     document.getElementById('postingKey').value = account.privPosting;
91 |     document.getElementById('author').value = accountI.address;
92 | };
93 | 


--------------------------------------------------------------------------------
/tutorials/18_follow_a_user/public/index.html:
--------------------------------------------------------------------------------
 1 | <html>
 2 |     <head>
 3 |         <title>Follow User</title>
 4 |         <script src="bundle.js"></script>
 5 |     </head>
 6 |     <body>
 7 |     	<div class="container" id="content"><br/>
 8 |             <h4>Follow / Unfollow an author</h4>
 9 |             <form>
10 |                 <div class="form-group row">
11 |                     <label for="username" class="col-sm-2 col-form-label">
12 |                         Username
13 |                     </label>
14 |                     <div class="col-sm-10">
15 |                         <input
16 |                             id="username"
17 |                             type="text"
18 |                             class="form-control"
19 |                             value=""
20 |                         />
21 |                     </div>
22 |                 </div>
23 |                 <div class="form-group row">
24 |                     <label for="postingKey" class="col-sm-2 col-form-label">
25 |                         Posting private key
26 |                     </label>
27 |                     <div class="col-sm-10">
28 |                         <input
29 |                             type="password"
30 |                             class="form-control"
31 |                             id="postingKey"
32 |                             value=""
33 |                         />
34 |                     </div>
35 |                 </div>
36 |                 <div class="form-group row">
37 |                     <label for="author" class="col-sm-2 col-form-label">
38 |                         Author to follow/unfollow
39 |                     </label>
40 |                     <div class="col-sm-10">
41 |                         <input
42 |                             type="text"
43 |                             class="form-control"
44 |                             id="author"
45 |                             value="@steemitblog"
46 |                         />
47 |                     </div>
48 |                 </div>
49 |                 <div class="form-group row">
50 |                     <div class="offset-sm-2 col-sm-10">
51 |                         <input
52 |                             id="followBtn"
53 |                             type="button"
54 |                             value="Follow / Unfollow"
55 |                             onclick="submitFollow()"
56 |                             class="btn btn-primary"
57 |                             onclick="document.getElementById('followResult').value=''"
58 |                         />
59 |                     </div>
60 |                 </div>
61 |                 <div
62 |                     class="form-group row"
63 |                     id="followResultContainer"
64 |                     style="display: none;"
65 |                 >
66 |                     <label for="voteResult" class="col-sm-2 col-form-label">
67 |                         Author follow status 
68 |                     </label>
69 |                     <div class="col-sm-10">
70 |                         <div id="followResult" class="form-control-plaintext" />
71 |                     </div>
72 |                 </div>
73 |             </form>
74 | 		</div>
75 |     </body>
76 | </html>


--------------------------------------------------------------------------------
/tutorials/18_follow_a_user/public/style.scss:
--------------------------------------------------------------------------------
1 | import 'bootstrap/dist/css/bootstrap.min.css'


--------------------------------------------------------------------------------
/tutorials/18_follow_a_user/webpack.config.js:
--------------------------------------------------------------------------------
 1 | var path = require('path');
 2 | module.exports = {
 3 |     entry: ['./public/app.js', './public/style.scss'],
 4 |     output: {
 5 |         path: path.resolve(__dirname, 'public'),
 6 |         filename: 'bundle.js',
 7 |     },
 8 |     devtool: 'source-map',
 9 |     module: {
10 |         rules: [
11 |             {
12 |                 test: /\.css$/,
13 |                 use: ['style-loader', 'css-loader'],
14 |             },
15 |         ],
16 |     },
17 |     performance: {
18 |         hints: process.env.NODE_ENV === 'production' ? 'warning' : false,
19 |     },
20 | };
21 | 


--------------------------------------------------------------------------------
/tutorials/19_get_follower_and_following_list/index.js:
--------------------------------------------------------------------------------
1 | const Koa = require('koa');
2 | const app = new Koa();
3 | const serve = require('koa-static');
4 | app.use(serve('./public'));
5 | 
6 | app.listen(3000);
7 | 
8 | console.log('listening on port 3000');
9 | 


--------------------------------------------------------------------------------
/tutorials/19_get_follower_and_following_list/package.json:
--------------------------------------------------------------------------------
 1 | {
 2 |     "name": "19_get_follower_and_following_list",
 3 |     "version": "1.0.0",
 4 |     "description": "",
 5 |     "main": "index.js",
 6 |     "scripts": {
 7 |         "start": "webpack && node ./index.js",
 8 |         "test": "echo \"Error: no test specified\" && exit 1",
 9 |         "dev-server": "./node_modules/.bin/webpack-dev-server --mode development --content-base ./public --port 3000"
10 |     },
11 |     "author": "",
12 |     "license": "ISC",
13 |     "dependencies": {
14 |         "bootstrap": "^4.1.3",
15 |         "dsteem": "^0.10.1",
16 |         "koa": "^2.5.3",
17 |         "koa-static": "^5.0.0",
18 |         "remarkable": "^1.7.1"
19 |     },
20 |     "devDependencies": {
21 |         "css-loader": "^1.0.0",
22 |         "style-loader": "^0.23.1",
23 |         "webpack": "^4.20.2",
24 |         "webpack-cli": "^3.1.2",
25 |         "webpack-dev-server": "^3.1.9"
26 |     }
27 | }
28 | 


--------------------------------------------------------------------------------
/tutorials/19_get_follower_and_following_list/public/app.js:
--------------------------------------------------------------------------------
 1 | //Step 1.
 2 | 
 3 | // const dsteem = require('dsteem');
 4 | // //define network parameters
 5 | // let opts = {};
 6 | // opts.addressPrefix = 'STX';
 7 | // opts.chainId = '79276aea5d4877d9a25892eaa01b0adf019d3e5cb12a97478df3298ccdd01673';
 8 | // //connect to a steem node, testnet in this case
 9 | // const client = new dsteem.Client('https://testnet.steem.vc', opts);
10 | 
11 | const dsteem = require('dsteem');
12 | let opts = {};
13 | //define network parameters
14 | opts.addressPrefix = 'STM';
15 | opts.chainId =
16 |     '0000000000000000000000000000000000000000000000000000000000000000';
17 | //connect to a steem node, production in this case
18 | const client = new dsteem.Client('https://api.steemit.com');
19 | 
20 | 
21 | //Step 2. user fills in the values on the UI
22 | 
23 | //Followers function
24 | window.submitFollower = async () => {
25 |     //clear list
26 |     document.getElementById('followList').innerHTML = '';
27 |     
28 |     //get user name
29 |     const username = document.getElementById('username').value;
30 |     //get starting letters / word
31 |     const startFollow = document.getElementById('startFollow').value;
32 |     //get limit
33 |     var limit = document.getElementById('limit').value;
34 | 
35 | //Step 3. Call followers list
36 | 
37 |     //get list of followers
38 |     //getFollowers(following, startFollower, followType, limit)
39 |     let followlist = await client.call('follow_api', 'get_followers', [
40 |         username,
41 |         startFollow,
42 |         'blog',
43 |         limit,
44 |     ]);
45 | 
46 |     document.getElementById('followResultContainer').style.display = 'flex';
47 |     document.getElementById('followResult').className = 'form-control-plaintext alert alert-success';
48 |     document.getElementById('followResult').innerHTML = 'Followers';
49 | 
50 | //Step 4. Display results on console for control check and on UI
51 |     
52 |     followlist.forEach((newObj) => {
53 |         name = newObj.follower;
54 |         document.getElementById('followList').innerHTML += name + '<br>';
55 |         console.log(name);
56 |     });
57 | 
58 | };
59 | 
60 | //Step 2. user fills in the values on the UI
61 | 
62 | //Following function
63 | window.submitFollowing = async () => {
64 |     //clear list
65 |     document.getElementById('followList').innerHTML = '';
66 |     
67 |     //get user name
68 |     const username = document.getElementById('username').value;
69 |     //get starting letters / word
70 |     const startFollow = document.getElementById('startFollow').value;
71 |     //get limit
72 |     var limit = document.getElementById('limit').value;
73 | 
74 | //Step 3. Call following list
75 | 
76 |     //get list of authors you are following
77 |     //getFollowing(follower, startFollowing, followType, limit)
78 |     let followlist = await client.call('follow_api', 'get_following', [
79 |         username,
80 |         startFollow,
81 |         'blog',
82 |         limit,
83 |     ]);
84 | 
85 |     document.getElementById('followResultContainer').style.display = 'flex';
86 |     document.getElementById('followResult').className = 'form-control-plaintext alert alert-success';
87 |     document.getElementById('followResult').innerHTML = 'Following';
88 | 
89 | //Step 4. Display results on console for control check and on UI
90 | 
91 |     followlist.forEach((newObj) => {
92 |         name = newObj.following;
93 |         document.getElementById('followList').innerHTML += name + '<br>';
94 |         console.log(name);
95 |     });
96 | };


--------------------------------------------------------------------------------
/tutorials/19_get_follower_and_following_list/public/index.html:
--------------------------------------------------------------------------------
 1 | <html>
 2 |     <head>
 3 |         <title>Get Follower and Following List</title>
 4 |         <script src="bundle.js"></script>
 5 |     </head>
 6 |     <body>
 7 |     	<div class="container" id="content"><br/>
 8 |             <h4>Get list of Followers and Following for User</h4>
 9 |             <form>
10 |                 <div class="form-group row">
11 |                     <label for="username" class="col-sm-2 col-form-label">
12 |                         Username
13 |                     </label>
14 |                     <div class="col-sm-10">
15 |                         <input
16 |                             id="username"
17 |                             type="text"
18 |                             class="form-control"
19 |                             value="steemitblog"
20 |                         />
21 |                     </div>
22 |                 </div>
23 |                 <div class="form-group row">
24 |                     <label for="startFollow" class="col-sm-2 col-form-label">
25 |                         Starting letter(s)
26 |                     </label>
27 |                     <div class="col-sm-10">
28 |                         <input
29 |                             id="startFollow"
30 |                             type="text"
31 |                             class="form-control"
32 |                             value="a"
33 |                         />
34 |                     </div>
35 |                 </div>
36 |                 <div class="form-group row">
37 |                     <label for="limit" class="col-sm-2 col-form-label">
38 |                         Max length of list to display
39 |                     </label>
40 |                     <div class="col-sm-10">
41 |                         <input
42 |                             type="number"
43 |                             class="form-control"
44 |                             id="limit"
45 |                             value="10"
46 |                         />
47 |                     </div>
48 |                 </div>
49 |                 <div class="form-group row">
50 |                     <div class="offset-sm-2 col-sm-10">
51 |                         <input
52 |                             id="followerBtn"
53 |                             type="button"
54 |                             value="Get Followers"
55 |                             onclick="submitFollower()"
56 |                             class="btn btn-primary"
57 |                         />
58 |                     </div>
59 |                 </div>
60 |                 <div class="form-group row">
61 |                     <div class="offset-sm-2 col-sm-10">
62 |                         <input
63 |                             id="followingBtn"
64 |                             type="button"
65 |                             value="Get Following"
66 |                             onclick="submitFollowing()"
67 |                             class="btn btn-primary"
68 |                         />
69 |                     </div>
70 |                 </div>
71 |                 <div
72 |                     class="form-group row"
73 |                     id="followResultContainer"
74 |                     style="display: none;"
75 |                 >
76 |                     <label for="followResult" class="col-sm-2 col-form-label">
77 |                         List of
78 |                     </label>
79 |                     <div class="col-sm-10">
80 |                         <div id="followResult" class="form-control-plaintext" />
81 |                     </div>
82 |                 </div>
83 |             </form>
84 |             <div class="offset-sm-2 col-sm-10">
85 |                 <div class="list-group" id="followList"></div>
86 |             </div>
87 | 		</div>
88 |     </body>
89 | </html>


--------------------------------------------------------------------------------
/tutorials/19_get_follower_and_following_list/public/style.scss:
--------------------------------------------------------------------------------
1 | import 'bootstrap/dist/css/bootstrap.min.css'


--------------------------------------------------------------------------------
/tutorials/19_get_follower_and_following_list/webpack.config.js:
--------------------------------------------------------------------------------
 1 | var path = require('path');
 2 | module.exports = {
 3 |     entry: ['./public/app.js', './public/style.scss'],
 4 |     output: {
 5 |         path: path.resolve(__dirname, 'public'),
 6 |         filename: 'bundle.js',
 7 |     },
 8 |     devtool: 'source-map',
 9 |     module: {
10 |         rules: [
11 |             {
12 |                 test: /\.css$/,
13 |                 use: ['style-loader', 'css-loader'],
14 |             },
15 |         ],
16 |     },
17 |     performance: {
18 |         hints: process.env.NODE_ENV === 'production' ? 'warning' : false,
19 |     },
20 | };
21 | 


--------------------------------------------------------------------------------
/tutorials/20_account_reputation/index.js:
--------------------------------------------------------------------------------
1 | const Koa = require('koa');
2 | const app = new Koa();
3 | const serve = require('koa-static');
4 | app.use(serve('./public'));
5 | 
6 | app.listen(3000);
7 | 
8 | console.log('listening on port 3000');
9 | 


--------------------------------------------------------------------------------
/tutorials/20_account_reputation/package.json:
--------------------------------------------------------------------------------
 1 | {
 2 |     "name": "20_account_reputation",
 3 |     "version": "1.0.0",
 4 |     "description": "",
 5 |     "main": "index.js",
 6 |     "scripts": {
 7 |         "start": "webpack && node ./index.js",
 8 |         "test": "echo \"Error: no test specified\" && exit 1",
 9 |         "dev-server":
10 |             "./node_modules/.bin/webpack-dev-server --mode development --content-base ./public --port 3000"
11 |     },
12 |     "author": "",
13 |     "license": "ISC",
14 |     "dependencies": {
15 |         "bootstrap": "^4.1.3",
16 |         "dsteem": "^0.10.1",
17 |         "koa": "^2.5.3",
18 |         "koa-static": "^5.0.0",
19 |         "remarkable": "^1.7.1"
20 |     },
21 |     "devDependencies": {
22 |         "css-loader": "^1.0.0",
23 |         "style-loader": "^0.23.1",
24 |         "webpack": "^4.20.2",
25 |         "webpack-cli": "^3.1.2",
26 |         "webpack-dev-server": "^3.1.9"
27 |     }
28 | }
29 | 


--------------------------------------------------------------------------------
/tutorials/20_account_reputation/public/app.js:
--------------------------------------------------------------------------------
 1 | const dsteem = require('dsteem');
 2 | let opts = {};
 3 | //connect to production server
 4 | opts.addressPrefix = 'STM';
 5 | opts.chainId =
 6 |     '0000000000000000000000000000000000000000000000000000000000000000';
 7 | //connect to server which is connected to the network/production
 8 | const client = new dsteem.Client('https://api.steemit.com');
 9 | 
10 | /**
11 |     This is a rough approximation of log10 that works with huge digit-strings.
12 |     Warning: Math.log10(0) === NaN
13 |     The 0.00000001 offset fixes cases of Math.log(1000)/Math.LN10 = 2.99999999~
14 | */
15 | function log10(str) {
16 |     const leadingDigits = parseInt(str.substring(0, 4));
17 |     const log = Math.log(leadingDigits) / Math.LN10 + 0.00000001;
18 |     const n = str.length - 1;
19 |     return n + (log - parseInt(log));
20 | }
21 | 
22 | export const repLog10 = rep2 => {
23 |     if (rep2 == null) return rep2;
24 |     let rep = String(rep2);
25 |     const neg = rep.charAt(0) === '-';
26 |     rep = neg ? rep.substring(1) : rep;
27 | 
28 |     let out = log10(rep);
29 |     if (isNaN(out)) out = 0;
30 |     out = Math.max(out - 9, 0); // @ -9, $0.50 earned is approx magnitude 1
31 |     out = (neg ? -1 : 1) * out;
32 |     out = out * 9 + 25; // 9 points per magnitude. center at 25
33 |     // base-line 0 to darken and < 0 to auto hide (grep rephide)
34 |     out = parseInt(out);
35 |     return out;
36 | };
37 | 
38 | //submitAcc function from html input
39 | const max = 5;
40 | window.submitAcc = async () => {
41 |     const accSearch = document.getElementById('username').value;
42 | 
43 |     const _accounts = await client.database.call('lookup_accounts', [
44 |         accSearch,
45 |         max,
46 |     ]);
47 |     console.log(`_accounts:`, _accounts);
48 | 
49 |     const acc = await client.database.call('get_accounts', [_accounts]);
50 | 
51 |     //disply list of account names and reputation with line breaks
52 |     for (var i = 0; i < _accounts.length; i++) {
53 |         _accounts[i] = `${_accounts[i]} - ${repLog10(acc[i].reputation)}`;
54 |     }
55 |     document.getElementById('accList').innerHTML = _accounts.join('<br/>');
56 | };
57 | 


--------------------------------------------------------------------------------
/tutorials/20_account_reputation/public/index.css:
--------------------------------------------------------------------------------
1 | .account {
2 |     font-weight: bold;
3 | }
4 | 


--------------------------------------------------------------------------------
/tutorials/20_account_reputation/public/index.html:
--------------------------------------------------------------------------------
 1 | <html>
 2 |     <head>
 3 |         <title>Account Reputation</title>
 4 |         <script src="bundle.js"></script>
 5 |     </head>
 6 |     <body>
 7 |         <div class="container" id="content"><br/>
 8 |             <h4>Enter Account name to search</h4>
 9 |             <input id="username" type="text" size="65" placeholder="Search for account names..." class="form-control"><br>
10 |             <input id="submitAccBtn" type="button" value="Search!" onclick="submitAcc()" class="btn btn-primary"><br/>
11 |             <h4>Matching Account names with reputation interpreted:</h4><br/>
12 |             <div class="list-group" id="accList"></div>
13 |             </div>
14 |         </div>
15 |     </body>
16 | </html>


--------------------------------------------------------------------------------
/tutorials/20_account_reputation/public/style.scss:
--------------------------------------------------------------------------------
1 | import 'bootstrap/dist/css/bootstrap.min.css'
2 | import './index.css'


--------------------------------------------------------------------------------
/tutorials/20_account_reputation/webpack.config.js:
--------------------------------------------------------------------------------
 1 | var path = require('path');
 2 | module.exports = {
 3 |     entry: ['./public/app.js', './public/style.scss'],
 4 |     output: {
 5 |         path: path.resolve(__dirname, 'public'),
 6 |         filename: 'bundle.js',
 7 |     },
 8 |     devtool: 'source-map',
 9 |     module: {
10 |         rules: [
11 |             {
12 |                 test: /\.css$/,
13 |                 use: ['style-loader', 'css-loader'],
14 |             },
15 |         ],
16 |     },
17 |     performance: {
18 |         hints: process.env.NODE_ENV === 'production' ? 'warning' : false,
19 |     },
20 | };
21 | 


--------------------------------------------------------------------------------
/tutorials/21_transfer_steem_and_sbd/index.js:
--------------------------------------------------------------------------------
1 | const Koa = require('koa');
2 | const app = new Koa();
3 | const serve = require('koa-static');
4 | app.use(serve('./public'));
5 | 
6 | app.listen(3000);
7 | 
8 | console.log('listening on port 3000');
9 | 


--------------------------------------------------------------------------------
/tutorials/21_transfer_steem_and_sbd/package.json:
--------------------------------------------------------------------------------
 1 | {
 2 |     "name": "21_transfer_steem_and_sbd",
 3 |     "version": "1.0.0",
 4 |     "description": "",
 5 |     "main": "index.js",
 6 |     "scripts": {
 7 |         "start": "webpack && node ./index.js",
 8 |         "test": "echo \"Error: no test specified\" && exit 1",
 9 |         "dev-server":
10 |             "./node_modules/.bin/webpack-dev-server --mode development --content-base ./public --port 3000"
11 |     },
12 |     "author": "",
13 |     "license": "ISC",
14 |     "dependencies": {
15 |         "bootstrap": "^4.1.3",
16 |         "dsteem": "^0.10.1",
17 |         "koa": "^2.5.3",
18 |         "koa-static": "^5.0.0",
19 |         "remarkable": "^1.7.1"
20 |     },
21 |     "devDependencies": {
22 |         "css-loader": "^1.0.0",
23 |         "style-loader": "^0.23.1",
24 |         "webpack": "^4.20.2",
25 |         "webpack-cli": "^3.1.2",
26 |         "webpack-dev-server": "^3.1.9"
27 |     }
28 | }
29 | 


--------------------------------------------------------------------------------
/tutorials/21_transfer_steem_and_sbd/public/app.js:
--------------------------------------------------------------------------------
 1 | import { Client, PrivateKey } from 'dsteem';
 2 | import { Testnet as NetConfig } from '../../configuration'; //A Steem Testnet. Replace 'Testnet' with 'Mainnet' to connect to the main Steem blockchain.
 3 | 
 4 | let opts = { ...NetConfig.net };
 5 | 
 6 | // //connect to a steem node, tesetnet in this case
 7 | const client = new Client(NetConfig.url, opts);
 8 | 
 9 | //submit transfer function executes when you click "Transfer" button
10 | window.submitTransfer = async () => {
11 |     //get all values from the UI
12 |     //get account name of sender
13 |     const username = document.getElementById('username').value;
14 |     //get private active key
15 |     const privateKey = PrivateKey.fromString(
16 |         document.getElementById('privateKey').value
17 |     );
18 |     //get recipient
19 |     const recipient = document.getElementById('recipient').value;
20 |     //get comments
21 |     const comments = document.getElementById('comments').value;
22 |     //get transfer amount
23 |     const quantity = document.getElementById('quantity').value;
24 |     //get transfer type
25 |     const type = document.getElementById('type').value;
26 | 
27 |     const transfer = quantity.concat(' ', type);
28 | 
29 |     //create transfer object
30 |     const transf = new Object();
31 |     transf.from = username;
32 |     transf.to = recipient;
33 |     transf.amount = transfer;
34 |     transf.memo = comments;
35 | 
36 |     //broadcast the transfer
37 | 
38 |     client.broadcast.transfer(transf, privateKey).then(
39 |         function(result) {
40 |             console.log(
41 |                 'included in block: ' + result.block_num,
42 |                 'expired: ' + result.expired
43 |             );
44 |             document.getElementById('transferResultContainer').style.display =
45 |                 'flex';
46 |             document.getElementById('transferResult').className =
47 |                 'form-control-plaintext alert alert-success';
48 |             document.getElementById('transferResult').innerHTML = 'Success';
49 |         },
50 |         function(error) {
51 |             console.error(error);
52 |             document.getElementById('transferResultContainer').style.display =
53 |                 'flex';
54 |             document.getElementById('transferResult').className =
55 |                 'form-control-plaintext alert alert-danger';
56 |             document.getElementById('transferResult').innerHTML =
57 |                 error.jse_shortmsg;
58 |         }
59 |     );
60 | };
61 | 
62 | window.onload = async () => {
63 |     const account = NetConfig.accounts[0];
64 |     const accountI = NetConfig.accounts[1];
65 |     document.getElementById('username').value = account.address;
66 |     document.getElementById('privateKey').value = account.privActive;
67 |     document.getElementById('recipient').value = accountI.address;
68 | };
69 | 


--------------------------------------------------------------------------------
/tutorials/21_transfer_steem_and_sbd/public/style.scss:
--------------------------------------------------------------------------------
1 | import 'bootstrap/dist/css/bootstrap.min.css'


--------------------------------------------------------------------------------
/tutorials/21_transfer_steem_and_sbd/webpack.config.js:
--------------------------------------------------------------------------------
 1 | var path = require('path');
 2 | module.exports = {
 3 |     entry: ['./public/app.js', './public/style.scss'],
 4 |     output: {
 5 |         path: path.resolve(__dirname, 'public'),
 6 |         filename: 'bundle.js',
 7 |     },
 8 |     devtool: 'source-map',
 9 |     module: {
10 |         rules: [
11 |             {
12 |                 test: /\.css$/,
13 |                 use: ['style-loader', 'css-loader'],
14 |             },
15 |         ],
16 |     },
17 |     performance: {
18 |         hints: process.env.NODE_ENV === 'production' ? 'warning' : false,
19 |     },
20 | };
21 | 


--------------------------------------------------------------------------------
/tutorials/22_witness_listing_and_voting/index.js:
--------------------------------------------------------------------------------
1 | const Koa = require('koa');
2 | const app = new Koa();
3 | const serve = require('koa-static');
4 | app.use(serve('./public'));
5 | 
6 | app.listen(3000);
7 | 
8 | console.log('listening on port 3000');
9 | 


--------------------------------------------------------------------------------
/tutorials/22_witness_listing_and_voting/package.json:
--------------------------------------------------------------------------------
 1 | {
 2 |     "name": "22_witness_listing_and_voting",
 3 |     "version": "1.0.0",
 4 |     "description": "",
 5 |     "main": "index.js",
 6 |     "scripts": {
 7 |         "start": "webpack && node ./index.js",
 8 |         "test": "echo \"Error: no test specified\" && exit 1",
 9 |         "dev-server":
10 |             "./node_modules/.bin/webpack-dev-server --mode development --content-base ./public --port 3000"
11 |     },
12 |     "author": "",
13 |     "license": "ISC",
14 |     "dependencies": {
15 |         "bootstrap": "^4.1.3",
16 |         "dsteem": "^0.10.1",
17 |         "koa": "^2.5.3",
18 |         "koa-static": "^5.0.0",
19 |         "remarkable": "^1.7.1"
20 |     },
21 |     "devDependencies": {
22 |         "css-loader": "^1.0.0",
23 |         "style-loader": "^0.23.1",
24 |         "webpack": "^4.20.2",
25 |         "webpack-cli": "^3.1.2",
26 |         "webpack-dev-server": "^3.1.9"
27 |     }
28 | }
29 | 


--------------------------------------------------------------------------------
/tutorials/22_witness_listing_and_voting/public/style.scss:
--------------------------------------------------------------------------------
1 | import 'bootstrap/dist/css/bootstrap.min.css'


--------------------------------------------------------------------------------
/tutorials/22_witness_listing_and_voting/webpack.config.js:
--------------------------------------------------------------------------------
 1 | var path = require('path');
 2 | module.exports = {
 3 |     entry: ['./public/app.js', './public/style.scss'],
 4 |     output: {
 5 |         path: path.resolve(__dirname, 'public'),
 6 |         filename: 'bundle.js',
 7 |     },
 8 |     devtool: 'source-map',
 9 |     module: {
10 |         rules: [
11 |             {
12 |                 test: /\.css$/,
13 |                 use: ['style-loader', 'css-loader'],
14 |             },
15 |         ],
16 |     },
17 |     performance: {
18 |         hints: process.env.NODE_ENV === 'production' ? 'warning' : false,
19 |     },
20 | };
21 | 


--------------------------------------------------------------------------------
/tutorials/23_claim_rewards/index.js:
--------------------------------------------------------------------------------
1 | const Koa = require('koa');
2 | const app = new Koa();
3 | const serve = require('koa-static');
4 | app.use(serve('./public'));
5 | 
6 | app.listen(3000);
7 | 
8 | console.log('listening on port 3000');
9 | 


--------------------------------------------------------------------------------
/tutorials/23_claim_rewards/package.json:
--------------------------------------------------------------------------------
 1 | {
 2 |     "name": "23_claim_rewards",
 3 |     "version": "1.0.0",
 4 |     "description": "",
 5 |     "main": "index.js",
 6 |     "scripts": {
 7 |         "start": "webpack && node ./index.js",
 8 |         "test": "echo \"Error: no test specified\" && exit 1",
 9 |         "dev-server":
10 |             "./node_modules/.bin/webpack-dev-server --mode development --content-base ./public --port 3000"
11 |     },
12 |     "author": "",
13 |     "license": "ISC",
14 |     "dependencies": {
15 |         "bootstrap": "^4.1.3",
16 |         "dsteem": "^0.10.1",
17 |         "koa": "^2.5.3",
18 |         "koa-static": "^5.0.0",
19 |         "sc2-sdk": "^2.0.1"
20 |     },
21 |     "devDependencies": {
22 |         "css-loader": "^1.0.0",
23 |         "style-loader": "^0.23.1",
24 |         "webpack": "^4.20.2",
25 |         "webpack-cli": "^3.1.2",
26 |         "webpack-dev-server": "^3.1.9"
27 |     }
28 | }
29 | 


--------------------------------------------------------------------------------
/tutorials/23_claim_rewards/public/app.js:
--------------------------------------------------------------------------------
 1 | const dsteem = require('dsteem');
 2 | let opts = {};
 3 | //connect to production server
 4 | opts.addressPrefix = 'STM';
 5 | opts.chainId =
 6 |     '0000000000000000000000000000000000000000000000000000000000000000';
 7 | //connect to server which is connected to the network/production
 8 | const client = new dsteem.Client('https://api.steemit.com');
 9 | 
10 | //submitAcc function from html input
11 | const max = 5;
12 | window.submitAcc = async () => {
13 |     const accSearch = document.getElementById('username').value;
14 | 
15 |     const _accounts = await client.database.call('get_accounts', [[accSearch]]);
16 |     console.log(`_accounts:`, _accounts);
17 |     const name = _accounts[0].name;
18 |     const reward_steem = _accounts[0].reward_steem_balance.split(' ')[0];
19 |     const reward_sbd = _accounts[0].reward_sbd_balance.split(' ')[0];
20 |     const reward_sp = _accounts[0].reward_vesting_steem.split(' ')[0];
21 |     const reward_vests = _accounts[0].reward_vesting_balance.split(' ')[0];
22 |     const unclaimed_balance = `Unclaimed balance for ${name}: ${reward_steem} STEEM, ${reward_sbd} SBD, ${reward_sp} SP = ${reward_vests} VESTS<br/>`;
23 |     document.getElementById('accList').innerHTML = unclaimed_balance;
24 |     document.getElementById('steem').value = reward_steem;
25 |     document.getElementById('sbd').value = reward_sbd;
26 |     document.getElementById('sp').value = reward_vests;
27 | 
28 |     document.getElementById('sc').style.display = 'block';
29 |     const link = `https://steemconnect.com/sign/claim-reward-balance?account=${name}&reward_steem=${reward_steem}&reward_sbd=${reward_sbd}&reward_vests=${reward_vests}`;
30 |     document.getElementById(
31 |         'sc'
32 |     ).innerHTML = `<br/><a href=${link} target="_blank">Steemconnect signing</a>`;
33 | };
34 | 
35 | window.submitTx = async () => {
36 |     const privateKey = PrivateKey.fromString(
37 |         document.getElementById('wif').value
38 |     );
39 |     const op = [
40 |         'claim_reward_balance',
41 |         {
42 |             account: document.getElementById('username').value,
43 |             reward_steem: document.getElementById('steem').value + ' STEEM',
44 |             reward_sbd: document.getElementById('sbd').value + ' SBD',
45 |             reward_vests: document.getElementById('sp').value + ' VESTS',
46 |         },
47 |     ];
48 |     client.broadcast.sendOperations([op], privateKey).then(
49 |         function(result) {
50 |             document.getElementById('result').style.display = 'block';
51 |             document.getElementById(
52 |                 'result'
53 |             ).innerHTML = `<br/><p>Included in block: ${
54 |                 result.block_num
55 |             }</p><br/><br/>`;
56 |         },
57 |         function(error) {
58 |             console.error(error);
59 |         }
60 |     );
61 | };
62 | 


--------------------------------------------------------------------------------
/tutorials/23_claim_rewards/public/index.css:
--------------------------------------------------------------------------------
 1 | .account {
 2 |     font-weight: bold;
 3 | }
 4 | table {
 5 |     font-family: arial, sans-serif;
 6 |     border-collapse: collapse;
 7 |     width: 100%;
 8 | }
 9 | 
10 | td,
11 | th {
12 |     border: 1px solid #dddddd;
13 |     text-align: left;
14 |     padding: 8px;
15 |     width: 50% !important;
16 | }
17 | 
18 | tr:nth-child(even) {
19 |     background-color: #dddddd;
20 | }
21 | 


--------------------------------------------------------------------------------
/tutorials/23_claim_rewards/public/index.html:
--------------------------------------------------------------------------------
 1 | <html>
 2 |     <head>
 3 |         <title>Claim Rewards</title>
 4 |         <script src="bundle.js"></script>
 5 |     </head>
 6 |     <body>
 7 |         <div class="container" id="content"><br/>
 8 |             <h4>Account</h4>
 9 |             <input id="username" type="text" size="65" placeholder="Enter account name" class="form-control"><br><input id="submitSearch" type="button" value="Search" onclick="submitAcc()" class="btn btn-primary"><br>
10 |             <div class="list-group account" id="accList"></div>
11 |             <h5>Reward Steem:</h5>
12 |             <input id="steem" type="text" size="65" placeholder="steem" class="form-control"><br>
13 |             <h5>Reward SBD:</h5>
14 |             <input id="sbd" type="text" size="65" placeholder="sbd" class="form-control"><br>
15 |             <h5>Reward VESTS:</h5>
16 |             <input id="sp" type="text" size="65" placeholder="vests" class="form-control"><br>
17 |             <h5>How would you like to claim rewards?</h5>
18 |             <table>
19 |               <tr>
20 |                 <th>Steemconnect</th>
21 |                 <th>Client-side</th>
22 |               </tr>
23 |               <tr>
24 |                 <td>
25 |                     <div id="sc"></div>
26 |                 </td>
27 |                 <td>
28 |                     <div id="client">
29 |                         <h5>Posting Private key:</h5>
30 |                         <input id="wif" type="text" size="65" placeholder="wif" class="form-control"><br>
31 |                         <input id="submitTx" type="button" value="Submit" onclick="submitTx()" class="btn btn-primary"><br/>
32 |                     </div> 
33 |                 </td>
34 |               </tr>
35 |             </table>
36 |              
37 |             <div id="result" style="display: none;"></div>
38 |         </div>
39 |     </body>
40 | </html>


--------------------------------------------------------------------------------
/tutorials/23_claim_rewards/public/style.scss:
--------------------------------------------------------------------------------
1 | import 'bootstrap/dist/css/bootstrap.min.css'
2 | import './index.css'


--------------------------------------------------------------------------------
/tutorials/23_claim_rewards/webpack.config.js:
--------------------------------------------------------------------------------
 1 | var path = require('path');
 2 | module.exports = {
 3 |     entry: ['./public/app.js', './public/style.scss'],
 4 |     output: {
 5 |         path: path.resolve(__dirname, 'public'),
 6 |         filename: 'bundle.js',
 7 |     },
 8 |     devtool: 'source-map',
 9 |     module: {
10 |         rules: [
11 |             {
12 |                 test: /\.css$/,
13 |                 use: ['style-loader', 'css-loader'],
14 |             },
15 |         ],
16 |     },
17 |     performance: {
18 |         hints: process.env.NODE_ENV === 'production' ? 'warning' : false,
19 |     },
20 | };
21 | 


--------------------------------------------------------------------------------
/tutorials/24_power_up_steem/index.js:
--------------------------------------------------------------------------------
1 | const Koa = require('koa');
2 | const app = new Koa();
3 | const serve = require('koa-static');
4 | app.use(serve('./public'));
5 | 
6 | app.listen(3000);
7 | 
8 | console.log('listening on port 3000');
9 | 


--------------------------------------------------------------------------------
/tutorials/24_power_up_steem/package.json:
--------------------------------------------------------------------------------
 1 | {
 2 |     "name": "24_power_up_steem",
 3 |     "version": "1.0.0",
 4 |     "description": "",
 5 |     "main": "index.js",
 6 |     "scripts": {
 7 |         "start": "webpack && node ./index.js",
 8 |         "test": "echo \"Error: no test specified\" && exit 1",
 9 |         "dev-server":
10 |             "./node_modules/.bin/webpack-dev-server --mode development --content-base ./public --port 3000"
11 |     },
12 |     "author": "",
13 |     "license": "ISC",
14 |     "dependencies": {
15 |         "bootstrap": "^4.1.3",
16 |         "dsteem": "^0.10.1",
17 |         "koa": "^2.5.3",
18 |         "koa-static": "^5.0.0"
19 |     },
20 |     "devDependencies": {
21 |         "css-loader": "^1.0.0",
22 |         "style-loader": "^0.23.1",
23 |         "webpack": "^4.20.2",
24 |         "webpack-cli": "^3.1.2",
25 |         "webpack-dev-server": "^3.1.9"
26 |     }
27 | }
28 | 


--------------------------------------------------------------------------------
/tutorials/24_power_up_steem/public/app.js:
--------------------------------------------------------------------------------
 1 | import { Client, PrivateKey } from 'dsteem';
 2 | import { Mainnet as NetConfig } from '../../configuration'; //A Steem Testnet. Replace 'Testnet' with 'Mainnet' to connect to the main Steem blockchain.
 3 | 
 4 | let opts = { ...NetConfig.net };
 5 | //connect to a steem node, testnet in this case
 6 | const client = new Client(NetConfig.url, opts);
 7 | 
 8 | //submitAcc function from html input
 9 | const max = 5;
10 | window.submitAcc = async () => {
11 |     const accSearch = document.getElementById('username').value;
12 | 
13 |     const _account = await client.database.call('get_accounts', [[accSearch]]);
14 |     console.log(`_account:`, _account);
15 |     const name = _account[0].name;
16 |     const steem_balance = _account[0].balance;
17 |     const balance = `Available Steem balance for ${name}: ${steem_balance}<br/>`;
18 |     document.getElementById('accBalance').innerHTML = balance;
19 |     document.getElementById('steem').value = steem_balance;
20 |     const receiver = document.getElementById('receiver').value;
21 | 
22 |     document.getElementById('sc').style.display = 'block';
23 |     const link = `https://steemconnect.com/sign/transfer-to-vesting?from=${name}&to=${receiver}&amount=${steem_balance}`;
24 |     document.getElementById('sc').innerHTML = `<br/><a href=${encodeURI(
25 |         link
26 |     )} target="_blank">Steemconnect signing</a>`;
27 | };
28 | 
29 | window.submitTx = async () => {
30 |     const privateKey = PrivateKey.fromString(
31 |         document.getElementById('wif').value
32 |     );
33 |     const op = [
34 |         'transfer_to_vesting',
35 |         {
36 |             from: document.getElementById('username').value,
37 |             to: document.getElementById('receiver').value,
38 |             amount: document.getElementById('steem').value,
39 |         },
40 |     ];
41 |     client.broadcast.sendOperations([op], privateKey).then(
42 |         function(result) {
43 |             document.getElementById('result').style.display = 'block';
44 |             document.getElementById(
45 |                 'result'
46 |             ).innerHTML = `<br/><p>Included in block: ${
47 |                 result.block_num
48 |             }</p><br/><br/>`;
49 |         },
50 |         function(error) {
51 |             console.error(error);
52 |         }
53 |     );
54 | };
55 | 


--------------------------------------------------------------------------------
/tutorials/24_power_up_steem/public/index.css:
--------------------------------------------------------------------------------
 1 | .account {
 2 |     font-weight: bold;
 3 | }
 4 | table {
 5 |     font-family: arial, sans-serif;
 6 |     border-collapse: collapse;
 7 |     width: 100%;
 8 | }
 9 | 
10 | td,
11 | th {
12 |     border: 1px solid #dddddd;
13 |     text-align: left;
14 |     padding: 8px;
15 |     width: 50% !important;
16 | }
17 | 
18 | tr:nth-child(even) {
19 |     background-color: #dddddd;
20 | }
21 | 


--------------------------------------------------------------------------------
/tutorials/24_power_up_steem/public/index.html:
--------------------------------------------------------------------------------
 1 | <html>
 2 |     <head>
 3 |         <title>Power up</title>
 4 |         <script src="bundle.js"></script>
 5 |     </head>
 6 |     <body>
 7 |         <div class="container" id="content"><br/>
 8 |             <h4>Account</h4>
 9 |             <input id="username" type="text" size="65" placeholder="enter account name" class="form-control"><br><input id="submitSearch" type="button" value="Search" onclick="submitAcc()" class="btn btn-primary"><br>
10 |             <div class="list-group account" id="accBalance"></div>
11 |             <h5>Steem to Power up:</h5>
12 |             <input id="steem" type="text" size="65" placeholder="steem" class="form-control"><br>
13 |             <h5>To account:</h5>
14 |             <input id="receiver" type="text" size="65" placeholder="steem power receiver, can be self" class="form-control"><br>
15 |             <h5>How would you like to power up?</h5>
16 |             <table>
17 |               <tr>
18 |                 <th>Steemconnect</th>
19 |                 <th>Client-side</th>
20 |               </tr>
21 |               <tr>
22 |                 <td>
23 |                     <div id="sc"></div>
24 |                 </td>
25 |                 <td>
26 |                     <div id="client">
27 |                         <h5>Active Private key:</h5>
28 |                         <input id="wif" type="text" size="65" placeholder="wif" class="form-control"><br>
29 |                         <input id="submitTx" type="button" value="Submit" onclick="submitTx()" class="btn btn-primary"><br/>
30 |                     </div> 
31 |                 </td>
32 |               </tr>
33 |             </table>
34 |             <div id="result" style="display: none;"></div>
35 |         </div>
36 |     </body>
37 | </html>


--------------------------------------------------------------------------------
/tutorials/24_power_up_steem/public/style.scss:
--------------------------------------------------------------------------------
1 | import 'bootstrap/dist/css/bootstrap.min.css'
2 | import './index.css'


--------------------------------------------------------------------------------
/tutorials/24_power_up_steem/webpack.config.js:
--------------------------------------------------------------------------------
 1 | var path = require('path');
 2 | module.exports = {
 3 |     entry: ['./public/app.js', './public/style.scss'],
 4 |     output: {
 5 |         path: path.resolve(__dirname, 'public'),
 6 |         filename: 'bundle.js',
 7 |     },
 8 |     devtool: 'source-map',
 9 |     module: {
10 |         rules: [
11 |             {
12 |                 test: /\.css$/,
13 |                 use: ['style-loader', 'css-loader'],
14 |             },
15 |         ],
16 |     },
17 |     performance: {
18 |         hints: process.env.NODE_ENV === 'production' ? 'warning' : false,
19 |     },
20 | };
21 | 


--------------------------------------------------------------------------------
/tutorials/25_power_down/index.js:
--------------------------------------------------------------------------------
1 | const Koa = require('koa');
2 | const app = new Koa();
3 | const serve = require('koa-static');
4 | app.use(serve('./public'));
5 | 
6 | app.listen(3000);
7 | 
8 | console.log('listening on port 3000');
9 | 


--------------------------------------------------------------------------------
/tutorials/25_power_down/package.json:
--------------------------------------------------------------------------------
 1 | {
 2 |     "name": "25_power_down",
 3 |     "version": "1.0.0",
 4 |     "description": "",
 5 |     "main": "index.js",
 6 |     "scripts": {
 7 |         "start": "webpack && node ./index.js",
 8 |         "test": "echo \"Error: no test specified\" && exit 1",
 9 |         "dev-server":
10 |             "./node_modules/.bin/webpack-dev-server --mode development --content-base ./public --port 3000"
11 |     },
12 |     "author": "",
13 |     "license": "ISC",
14 |     "dependencies": {
15 |         "bootstrap": "^4.1.3",
16 |         "dsteem": "^0.10.1",
17 |         "koa": "^2.5.3",
18 |         "koa-static": "^5.0.0"
19 |     },
20 |     "devDependencies": {
21 |         "css-loader": "^1.0.0",
22 |         "style-loader": "^0.23.1",
23 |         "webpack": "^4.20.2",
24 |         "webpack-cli": "^3.1.2",
25 |         "webpack-dev-server": "^3.1.9"
26 |     }
27 | }
28 | 


--------------------------------------------------------------------------------
/tutorials/25_power_down/public/app.js:
--------------------------------------------------------------------------------
 1 | import { Client, PrivateKey } from 'dsteem';
 2 | import { Mainnet as NetConfig } from '../../configuration'; //A Steem Testnet. Replace 'Testnet' with 'Mainnet' to connect to the main Steem blockchain.
 3 | 
 4 | let opts = { ...NetConfig.net };
 5 | //connect to a steem node, testnet in this case
 6 | const client = new Client(NetConfig.url, opts);
 7 | 
 8 | //submitAcc function from html input
 9 | const max = 5;
10 | window.submitAcc = async () => {
11 |     const accSearch = document.getElementById('username').value;
12 | 
13 |     const _account = await client.database.call('get_accounts', [[accSearch]]);
14 |     console.log(`_account:`, _account);
15 | 
16 |     const name = _account[0].name;
17 |     const avail =
18 |         parseFloat(_account[0].vesting_shares) -
19 |         (parseFloat(_account[0].to_withdraw) -
20 |             parseFloat(_account[0].withdrawn)) /
21 |             1e6 -
22 |         parseFloat(_account[0].delegated_vesting_shares);
23 | 
24 |     const props = await client.database.getDynamicGlobalProperties();
25 |     const vestSteem = parseFloat(
26 |         parseFloat(props.total_vesting_fund_steem) *
27 |             (parseFloat(avail) / parseFloat(props.total_vesting_shares)),
28 |         6
29 |     );
30 | 
31 |     const balance = `Available Vests for ${name}: ${avail} VESTS ~ ${vestSteem} STEEM POWER<br/><br/>`;
32 |     document.getElementById('accBalance').innerHTML = balance;
33 |     document.getElementById('steem').value = avail + ' VESTS';
34 | 
35 |     document.getElementById('sc').style.display = 'block';
36 |     const link = `https://steemconnect.com/sign/withdraw-vesting?account=${name}&vesting_shares=${
37 |         document.getElementById('steem').value
38 |     }`;
39 |     document.getElementById('sc').innerHTML = `<br/><a href=${encodeURI(
40 |         link
41 |     )} target="_blank">Steemconnect signing</a>`;
42 | };
43 | 
44 | window.submitTx = async () => {
45 |     const privateKey = PrivateKey.fromString(
46 |         document.getElementById('wif').value
47 |     );
48 |     const op = [
49 |         'withdraw_vesting',
50 |         {
51 |             account: document.getElementById('username').value,
52 |             vesting_shares: document.getElementById('steem').value,
53 |         },
54 |     ];
55 |     client.broadcast.sendOperations([op], privateKey).then(
56 |         function(result) {
57 |             document.getElementById('result').style.display = 'block';
58 |             document.getElementById(
59 |                 'result'
60 |             ).innerHTML = `<br/><p>Included in block: ${
61 |                 result.block_num
62 |             }</p><br/><br/>`;
63 |         },
64 |         function(error) {
65 |             console.error(error);
66 |         }
67 |     );
68 | };
69 | 


--------------------------------------------------------------------------------
/tutorials/25_power_down/public/index.css:
--------------------------------------------------------------------------------
 1 | .account {
 2 |     font-weight: bold;
 3 | }
 4 | table {
 5 |     font-family: arial, sans-serif;
 6 |     border-collapse: collapse;
 7 |     width: 100%;
 8 | }
 9 | 
10 | td,
11 | th {
12 |     border: 1px solid #dddddd;
13 |     text-align: left;
14 |     padding: 8px;
15 |     width: 50% !important;
16 | }
17 | 
18 | tr:nth-child(even) {
19 |     background-color: #dddddd;
20 | }
21 | 


--------------------------------------------------------------------------------
/tutorials/25_power_down/public/index.html:
--------------------------------------------------------------------------------
 1 | <html>
 2 |     <head>
 3 |         <title>Power down</title>
 4 |         <script src="bundle.js"></script>
 5 |     </head>
 6 |     <body>
 7 |         <div class="container" id="content"><br/>
 8 |             <h4>Account</h4>
 9 |             <input id="username" type="text" size="65" placeholder="enter account name" class="form-control"><br><input id="submitSearch" type="button" value="Search" onclick="submitAcc()" class="btn btn-primary"><br>
10 |             <div class="list-group account" id="accBalance"></div>
11 |             <h5>Vests to Power down:</h5>
12 |             <input id="steem" type="text" size="65" placeholder="steem" class="form-control"><br>
13 |             <h5>How would you like to power down?</h5>
14 |             <table>
15 |               <tr>
16 |                 <th>Steemconnect</th>
17 |                 <th>Client-side</th>
18 |               </tr>
19 |               <tr>
20 |                 <td>
21 |                     <div id="sc"></div>
22 |                 </td>
23 |                 <td>
24 |                     <div id="client">
25 |                         <h5>Active Private key:</h5>
26 |                         <input id="wif" type="text" size="65" placeholder="wif" class="form-control"><br>
27 |                         <input id="submitTx" type="button" value="Submit" onclick="submitTx()" class="btn btn-primary"><br/>
28 |                     </div> 
29 |                 </td>
30 |               </tr>
31 |           </table>
32 |             <div id="result" style="display: none;"></div>
33 |         </div>
34 |     </body>
35 | </html>


--------------------------------------------------------------------------------
/tutorials/25_power_down/public/style.scss:
--------------------------------------------------------------------------------
1 | import 'bootstrap/dist/css/bootstrap.min.css'
2 | import './index.css'


--------------------------------------------------------------------------------
/tutorials/25_power_down/webpack.config.js:
--------------------------------------------------------------------------------
 1 | var path = require('path');
 2 | module.exports = {
 3 |     entry: ['./public/app.js', './public/style.scss'],
 4 |     output: {
 5 |         path: path.resolve(__dirname, 'public'),
 6 |         filename: 'bundle.js',
 7 |     },
 8 |     devtool: 'source-map',
 9 |     module: {
10 |         rules: [
11 |             {
12 |                 test: /\.css$/,
13 |                 use: ['style-loader', 'css-loader'],
14 |             },
15 |         ],
16 |     },
17 |     performance: {
18 |         hints: process.env.NODE_ENV === 'production' ? 'warning' : false,
19 |     },
20 | };
21 | 


--------------------------------------------------------------------------------
/tutorials/26_create_account/index.js:
--------------------------------------------------------------------------------
1 | const Koa = require('koa');
2 | const app = new Koa();
3 | const serve = require('koa-static');
4 | app.use(serve('./public'));
5 | 
6 | app.listen(3000);
7 | 
8 | console.log('listening on port 3000');
9 | 


--------------------------------------------------------------------------------
/tutorials/26_create_account/package.json:
--------------------------------------------------------------------------------
 1 | {
 2 |     "name": "26_create_account",
 3 |     "version": "1.0.0",
 4 |     "description": "",
 5 |     "main": "index.js",
 6 |     "scripts": {
 7 |         "start": "webpack && node ./index.js",
 8 |         "test": "echo \"Error: no test specified\" && exit 1",
 9 |         "dev-server":
10 |             "./node_modules/.bin/webpack-dev-server --mode development --content-base ./public --port 3000"
11 |     },
12 |     "author": "",
13 |     "license": "ISC",
14 |     "dependencies": {
15 |         "bootstrap": "^4.1.3",
16 |         "dsteem": "^0.10.1",
17 |         "koa": "^2.5.3",
18 |         "koa-static": "^5.0.0"
19 |     },
20 |     "devDependencies": {
21 |         "css-loader": "^1.0.0",
22 |         "style-loader": "^0.23.1",
23 |         "webpack": "^4.20.2",
24 |         "webpack-cli": "^3.1.2",
25 |         "webpack-dev-server": "^3.1.9"
26 |     }
27 | }
28 | 


--------------------------------------------------------------------------------
/tutorials/26_create_account/public/index.css:
--------------------------------------------------------------------------------
 1 | .account {
 2 |     font-weight: bold;
 3 | }
 4 | .info {
 5 |     color: #999;
 6 |     font-style: italic;
 7 | }
 8 | table {
 9 |     font-family: arial, sans-serif;
10 |     border-collapse: collapse;
11 |     width: 100%;
12 | }
13 | 
14 | td,
15 | th {
16 |     border: 1px solid #dddddd;
17 |     text-align: left;
18 |     padding: 8px;
19 |     width: 50% !important;
20 | }
21 | 
22 | tr:nth-child(even) {
23 |     background-color: #dddddd;
24 | }
25 | 


--------------------------------------------------------------------------------
/tutorials/26_create_account/public/index.html:
--------------------------------------------------------------------------------
 1 | <html>
 2 |     <head>
 3 |         <title>Create an account</title>
 4 |         <script src="bundle.js"></script>
 5 |     </head>
 6 |     <body>
 7 |         <div class="container" id="content"><br/>
 8 |             <h4>New account</h4>
 9 |             <input id="username" type="text" size="65" placeholder="enter account name" class="form-control"><br><input id="submitSearch" type="button" value="Search" onclick="searchAcc()" class="btn btn-primary">
10 |             <div class="list-group account" id="accInfo"></div><br>
11 |             <h5>Password:</h5>
12 |             <input id="password" type="text" size="65" placeholder="password" class="form-control"><span class="info">Write down your password and keep it somewhere very safe and secure.</span><br>
13 |             <h5>STEEM:</h5>
14 |             <input id="steem" type="text" size="65" value="3.000 STEEM" class="form-control"><span class="info">Use the format '0.000 STEEM', the 3 decimals and unit are important.</span><br>
15 |             <br/><br/>
16 |             <h5>How would you like to create an account?</h5>
17 |             <table>
18 |               <tr>
19 |                 <th>Steemconnect</th>
20 |                 <th>Client-side</th>
21 |               </tr>
22 |               <tr>
23 |                 <td>
24 |                     <div id="sc"><a href='https://steemconnect.com/accounts/create' target="_blank">Steemconnect account creation page</a></div>
25 |                 </td>
26 |                 <td>
27 |                     <div id="client">
28 |                         <h5>Creator account:</h5>
29 |                         <input id="account" type="text" size="65" placeholder="username" class="form-control"><br>
30 |                         <h5>Active Private key:</h5>
31 |                         <input id="wif" type="text" size="65" placeholder="wif" class="form-control"><br>
32 |                         <input id="submitTx" type="button" value="Create Account with STEEM" onclick="submitTx()" class="btn btn-primary"><br/>
33 |                         <input id="submitDisc" type="button" value="Create Account with RC" onclick="submitDisc()" class="btn btn-primary"><br/>
34 |                     </div>
35 |                 </td>
36 |               </tr>
37 |           </table>
38 |             
39 |             
40 |             <div id="result" style="display: none;"></div>
41 |         </div>
42 |     </body>
43 | </html>


--------------------------------------------------------------------------------
/tutorials/26_create_account/public/style.scss:
--------------------------------------------------------------------------------
1 | import 'bootstrap/dist/css/bootstrap.min.css'
2 | import './index.css'


--------------------------------------------------------------------------------
/tutorials/26_create_account/webpack.config.js:
--------------------------------------------------------------------------------
 1 | var path = require('path');
 2 | module.exports = {
 3 |     entry: ['./public/app.js', './public/style.scss'],
 4 |     output: {
 5 |         path: path.resolve(__dirname, 'public'),
 6 |         filename: 'bundle.js',
 7 |     },
 8 |     devtool: 'source-map',
 9 |     module: {
10 |         rules: [
11 |             {
12 |                 test: /\.css$/,
13 |                 use: ['style-loader', 'css-loader'],
14 |             },
15 |         ],
16 |     },
17 |     performance: {
18 |         hints: process.env.NODE_ENV === 'production' ? 'warning' : false,
19 |     },
20 | };
21 | 


--------------------------------------------------------------------------------
/tutorials/27_delegate_power/index.js:
--------------------------------------------------------------------------------
1 | const Koa = require('koa');
2 | const app = new Koa();
3 | const serve = require('koa-static');
4 | app.use(serve('./public'));
5 | 
6 | app.listen(3000);
7 | 
8 | console.log('listening on port 3000');
9 | 


--------------------------------------------------------------------------------
/tutorials/27_delegate_power/package.json:
--------------------------------------------------------------------------------
 1 | {
 2 |     "name": "27_delegate_power",
 3 |     "version": "1.0.0",
 4 |     "description": "",
 5 |     "main": "index.js",
 6 |     "scripts": {
 7 |         "start": "webpack && node ./index.js",
 8 |         "test": "echo \"Error: no test specified\" && exit 1",
 9 |         "dev-server":
10 |             "./node_modules/.bin/webpack-dev-server --mode development --content-base ./public --port 3000"
11 |     },
12 |     "author": "",
13 |     "license": "ISC",
14 |     "dependencies": {
15 |         "bootstrap": "^4.1.3",
16 |         "dsteem": "^0.10.1",
17 |         "koa": "^2.5.3",
18 |         "koa-static": "^5.0.0"
19 |     },
20 |     "devDependencies": {
21 |         "css-loader": "^1.0.0",
22 |         "style-loader": "^0.23.1",
23 |         "webpack": "^4.20.2",
24 |         "webpack-cli": "^3.1.2",
25 |         "webpack-dev-server": "^3.1.9"
26 |     }
27 | }
28 | 


--------------------------------------------------------------------------------
/tutorials/27_delegate_power/public/app.js:
--------------------------------------------------------------------------------
 1 | import { Client, PrivateKey } from 'dsteem';
 2 | import { Mainnet as NetConfig } from '../../configuration'; //A Steem Testnet. Replace 'Testnet' with 'Mainnet' to connect to the main Steem blockchain.
 3 | 
 4 | let opts = { ...NetConfig.net };
 5 | //connect to a steem node, testnet in this case
 6 | const client = new Client(NetConfig.url, opts);
 7 | 
 8 | //submitAcc function from html input
 9 | const max = 5;
10 | window.submitAcc = async () => {
11 |     const accSearch = document.getElementById('username').value;
12 | 
13 |     const _account = await client.database.call('get_accounts', [[accSearch]]);
14 |     console.log(`_account:`, _account);
15 | 
16 |     const name = _account[0].name;
17 |     const avail =
18 |         parseFloat(_account[0].vesting_shares) -
19 |         (parseFloat(_account[0].to_withdraw) -
20 |             parseFloat(_account[0].withdrawn)) /
21 |             1e6 -
22 |         parseFloat(_account[0].delegated_vesting_shares);
23 | 
24 |     const props = await client.database.getDynamicGlobalProperties();
25 |     const vestSteem = parseFloat(
26 |         parseFloat(props.total_vesting_fund_steem) *
27 |             (parseFloat(avail) / parseFloat(props.total_vesting_shares)),
28 |         6
29 |     );
30 | 
31 |     const balance = `Available Vests for ${name}: ${avail} VESTS ~ ${vestSteem} STEEM POWER<br/><br/>`;
32 |     document.getElementById('accBalance').innerHTML = balance;
33 |     document.getElementById('steem').value =
34 |         Number(avail).toFixed(6) + ' VESTS';
35 | };
36 | window.openSC = async () => {
37 |     const link = `https://steemconnect.com/sign/delegate-vesting-shares?delegator=${
38 |         document.getElementById('username').value
39 |     }&vesting_shares=${document.getElementById('steem').value}&delegatee=${
40 |         document.getElementById('account').value
41 |     }`;
42 |     window.open(link);
43 | };
44 | window.submitTx = async () => {
45 |     const privateKey = PrivateKey.fromString(
46 |         document.getElementById('wif').value
47 |     );
48 |     const op = [
49 |         'delegate_vesting_shares',
50 |         {
51 |             delegator: document.getElementById('username').value,
52 |             delegatee: document.getElementById('account').value,
53 |             vesting_shares: document.getElementById('steem').value,
54 |         },
55 |     ];
56 |     client.broadcast.sendOperations([op], privateKey).then(
57 |         function(result) {
58 |             document.getElementById('result').style.display = 'block';
59 |             document.getElementById(
60 |                 'result'
61 |             ).innerHTML = `<br/><p>Included in block: ${
62 |                 result.block_num
63 |             }</p><br/><br/>`;
64 |         },
65 |         function(error) {
66 |             console.error(error);
67 |         }
68 |     );
69 | };
70 | 


--------------------------------------------------------------------------------
/tutorials/27_delegate_power/public/index.css:
--------------------------------------------------------------------------------
 1 | .account {
 2 |     font-weight: bold;
 3 | }
 4 | table {
 5 |     font-family: arial, sans-serif;
 6 |     border-collapse: collapse;
 7 |     width: 100%;
 8 | }
 9 | 
10 | td,
11 | th {
12 |     border: 1px solid #dddddd;
13 |     text-align: left;
14 |     padding: 8px;
15 |     width: 50% !important;
16 | }
17 | 
18 | tr:nth-child(even) {
19 |     background-color: #dddddd;
20 | }
21 | 


--------------------------------------------------------------------------------
/tutorials/27_delegate_power/public/index.html:
--------------------------------------------------------------------------------
 1 | <html>
 2 |     <head>
 3 |         <title>Delegate Power</title>
 4 |         <script src="bundle.js"></script>
 5 |     </head>
 6 |     <body>
 7 |         <div class="container" id="content"><br/>
 8 |             <h4>Account</h4>
 9 |             <input id="username" type="text" size="65" placeholder="enter account name" class="form-control"><br><input id="submitSearch" type="button" value="Search" onclick="submitAcc()" class="btn btn-primary"><br>
10 |             <div class="list-group account" id="accBalance"></div>
11 |             <h5>VESTS to delegate:</h5>
12 |             <input id="steem" type="text" size="65" placeholder="0.000000 VESTS" class="form-control"><br>
13 |             <h5>To account:</h5>
14 |             <input id="account" type="text" size="65" placeholder="username of delegatee" class="form-control"><br>
15 |             <h5>How would you like to delegate STEEM POWER/VESTS?</h5>
16 |             <table>
17 |               <tr>
18 |                 <th>Steemconnect</th>
19 |                 <th>Client-side</th>
20 |               </tr>
21 |               <tr>
22 |                 <td>
23 |                     <input id="openSC" type="button" value="Steemconnect" onclick="openSC()" class="btn btn-primary">
24 |                 </td>
25 |                 <td>
26 |                     <div id="client">
27 |                         <h5>Active Private key:</h5>
28 |                         <input id="wif" type="text" size="65" placeholder="wif" class="form-control"><br>
29 |                         <input id="submitTx" type="button" value="Submit" onclick="submitTx()" class="btn btn-primary"><br/>
30 |                     </div> 
31 |                 </td>
32 |               </tr>
33 |           </table>
34 |             <div id="result" style="display: none;"></div>
35 |         </div>
36 |     </body>
37 | </html>


--------------------------------------------------------------------------------
/tutorials/27_delegate_power/public/style.scss:
--------------------------------------------------------------------------------
1 | import 'bootstrap/dist/css/bootstrap.min.css'
2 | import './index.css'


--------------------------------------------------------------------------------
/tutorials/27_delegate_power/webpack.config.js:
--------------------------------------------------------------------------------
 1 | var path = require('path');
 2 | module.exports = {
 3 |     entry: ['./public/app.js', './public/style.scss'],
 4 |     output: {
 5 |         path: path.resolve(__dirname, 'public'),
 6 |         filename: 'bundle.js',
 7 |     },
 8 |     devtool: 'source-map',
 9 |     module: {
10 |         rules: [
11 |             {
12 |                 test: /\.css$/,
13 |                 use: ['style-loader', 'css-loader'],
14 |             },
15 |         ],
16 |     },
17 |     performance: {
18 |         hints: process.env.NODE_ENV === 'production' ? 'warning' : false,
19 |     },
20 | };
21 | 


--------------------------------------------------------------------------------
/tutorials/28_set_withdraw_route/index.js:
--------------------------------------------------------------------------------
1 | const Koa = require('koa');
2 | const app = new Koa();
3 | const serve = require('koa-static');
4 | app.use(serve('./public'));
5 | 
6 | app.listen(3000);
7 | 
8 | console.log('listening on port 3000');
9 | 


--------------------------------------------------------------------------------
/tutorials/28_set_withdraw_route/package.json:
--------------------------------------------------------------------------------
 1 | {
 2 |     "name": "28_set_withdraw_route",
 3 |     "version": "1.0.0",
 4 |     "description": "",
 5 |     "main": "index.js",
 6 |     "scripts": {
 7 |         "start": "webpack && node ./index.js",
 8 |         "test": "echo \"Error: no test specified\" && exit 1",
 9 |         "dev-server":
10 |             "./node_modules/.bin/webpack-dev-server --mode development --content-base ./public --port 3000"
11 |     },
12 |     "author": "",
13 |     "license": "ISC",
14 |     "dependencies": {
15 |         "bootstrap": "^4.1.3",
16 |         "dsteem": "^0.10.1",
17 |         "koa": "^2.5.3",
18 |         "koa-static": "^5.0.0"
19 |     },
20 |     "devDependencies": {
21 |         "css-loader": "^1.0.0",
22 |         "style-loader": "^0.23.1",
23 |         "webpack": "^4.20.2",
24 |         "webpack-cli": "^3.1.2",
25 |         "webpack-dev-server": "^3.1.9"
26 |     }
27 | }
28 | 


--------------------------------------------------------------------------------
/tutorials/28_set_withdraw_route/public/app.js:
--------------------------------------------------------------------------------
 1 | const dsteem = require('dsteem');
 2 | let opts = {};
 3 | //connect to production server
 4 | opts.addressPrefix = 'STM';
 5 | opts.chainId =
 6 |     '0000000000000000000000000000000000000000000000000000000000000000';
 7 | //connect to server which is connected to the network/production
 8 | const client = new dsteem.Client('https://api.steemit.com');
 9 | 
10 | //submitAcc function from html input
11 | const max = 5;
12 | window.submitAcc = async () => {
13 |     const accSearch = document.getElementById('username').value;
14 | 
15 |     const _account = await client.database.call('get_withdraw_routes', [
16 |         accSearch,
17 |     ]);
18 |     console.log(`_account:`, _account);
19 |     let info = '';
20 |     let sum = 0;
21 |     if (_account.length > 0) {
22 |         for (var i = 0; i < _account.length; i++) {
23 |             info += `${_account[i].to_account} - ${_account[i].percent /
24 |                 100}%<br>`;
25 |             sum += _account[i].percent / 100;
26 |         }
27 |     } else {
28 |         info += `No route is available!<br>`;
29 |     }
30 |     info += `You can set ${100 - sum}% remaining part to other accounts!`;
31 |     document.getElementById('accInfo').innerHTML = info;
32 | };
33 | window.openSC = async () => {
34 |     const link = `https://steemconnect.com/sign/set-withdraw-vesting-route?from_account=${
35 |         document.getElementById('username').value
36 |     }&percent=${document.getElementById('steem').value * 100}&to_account=${
37 |         document.getElementById('account').value
38 |     }&auto_vest=${document.getElementById('percent').checked}`;
39 |     window.open(link);
40 | };
41 | window.submitTx = async () => {
42 |     const privateKey = dsteem.PrivateKey.fromString(
43 |         document.getElementById('wif').value
44 |     );
45 |     const op = [
46 |         'set_withdraw_vesting_route',
47 |         {
48 |             from_account: document.getElementById('username').value,
49 |             to_account: document.getElementById('account').value,
50 |             percent: document.getElementById('steem').value * 100,
51 |             auto_vest: document.getElementById('percent').checked,
52 |         },
53 |     ];
54 |     client.broadcast.sendOperations([op], privateKey).then(
55 |         function(result) {
56 |             document.getElementById('result').style.display = 'block';
57 |             document.getElementById(
58 |                 'result'
59 |             ).innerHTML = `<br/><p>Included in block: ${
60 |                 result.block_num
61 |             }</p><br/><br/>`;
62 |         },
63 |         function(error) {
64 |             console.error(error);
65 |         }
66 |     );
67 | };
68 | 


--------------------------------------------------------------------------------
/tutorials/28_set_withdraw_route/public/index.css:
--------------------------------------------------------------------------------
 1 | .account {
 2 |     font-weight: bold;
 3 | }
 4 | table {
 5 |     font-family: arial, sans-serif;
 6 |     border-collapse: collapse;
 7 |     width: 100%;
 8 | }
 9 | 
10 | td,
11 | th {
12 |     border: 1px solid #dddddd;
13 |     text-align: left;
14 |     padding: 8px;
15 |     width: 50% !important;
16 | }
17 | 
18 | tr:nth-child(even) {
19 |     background-color: #dddddd;
20 | }
21 | 


--------------------------------------------------------------------------------
/tutorials/28_set_withdraw_route/public/index.html:
--------------------------------------------------------------------------------
 1 | <html>
 2 |     <head>
 3 |         <title>Set withdraw route</title>
 4 |         <script src="bundle.js"></script>
 5 |     </head>
 6 |     <body>
 7 |         <div class="container" id="content"><br/>
 8 |             <h4>Account</h4>
 9 |             <input id="username" type="text" size="65" placeholder="enter account name" class="form-control"><br><input id="submitSearch" type="button" value="Get withdraw routes" onclick="submitAcc()" class="btn btn-primary"><br>
10 |             <div class="list-group account" id="accInfo"></div><br>
11 |             <h5>Percent:</h5>
12 |             <input id="steem" type="text" size="65" placeholder="0" class="form-control"><br>
13 |             <h5>To account:</h5>
14 |             <input id="account" type="text" size="65" placeholder="username of receiver" class="form-control"><br>
15 |             <h5>AutoVest</h5>
16 |             <input id="percent" type="checkbox" class="form-control"><br>
17 |             <h5>How would you like to set withdraw/powerdown route?</h5>
18 |             <table>
19 |               <tr>
20 |                 <th>Steemconnect</th>
21 |                 <th>Client-side</th>
22 |               </tr>
23 |               <tr>
24 |                 <td>
25 |                     <input id="openSC" type="button" value="Steemconnect" onclick="openSC()" class="btn btn-primary">
26 |                 </td>
27 |                 <td>
28 |                     <div id="client">
29 |                         <h5>Active Private key:</h5>
30 |                         <input id="wif" type="text" size="65" placeholder="wif" class="form-control"><br>
31 |                         <input id="submitTx" type="button" value="Submit" onclick="submitTx()" class="btn btn-primary"><br/>
32 |                     </div> 
33 |                 </td>
34 |               </tr>
35 |           </table>
36 |             <div id="result" style="display: none;"></div>
37 |         </div>
38 |     </body>
39 | </html>


--------------------------------------------------------------------------------
/tutorials/28_set_withdraw_route/public/style.scss:
--------------------------------------------------------------------------------
1 | import 'bootstrap/dist/css/bootstrap.min.css'
2 | import './index.css'


--------------------------------------------------------------------------------
/tutorials/28_set_withdraw_route/webpack.config.js:
--------------------------------------------------------------------------------
 1 | var path = require('path');
 2 | module.exports = {
 3 |     entry: ['./public/app.js', './public/style.scss'],
 4 |     output: {
 5 |         path: path.resolve(__dirname, 'public'),
 6 |         filename: 'bundle.js',
 7 |     },
 8 |     devtool: 'source-map',
 9 |     module: {
10 |         rules: [
11 |             {
12 |                 test: /\.css$/,
13 |                 use: ['style-loader', 'css-loader'],
14 |             },
15 |         ],
16 |     },
17 |     performance: {
18 |         hints: process.env.NODE_ENV === 'production' ? 'warning' : false,
19 |     },
20 | };
21 | 


--------------------------------------------------------------------------------
/tutorials/29_get_delegations_by_user/index.js:
--------------------------------------------------------------------------------
1 | const Koa = require('koa');
2 | const app = new Koa();
3 | const serve = require('koa-static');
4 | app.use(serve('./public'));
5 | 
6 | app.listen(3000);
7 | 
8 | console.log('listening on port 3000');
9 | 


--------------------------------------------------------------------------------
/tutorials/29_get_delegations_by_user/package.json:
--------------------------------------------------------------------------------
 1 | {
 2 |     "name": "29_get_delegations_by_user",
 3 |     "version": "1.0.0",
 4 |     "description": "",
 5 |     "main": "index.js",
 6 |     "scripts": {
 7 |         "start": "webpack && node ./index.js",
 8 |         "test": "echo \"Error: no test specified\" && exit 1",
 9 |         "dev-server":
10 |             "./node_modules/.bin/webpack-dev-server --mode development --content-base ./public --port 3000"
11 |     },
12 |     "author": "",
13 |     "license": "ISC",
14 |     "dependencies": {
15 |         "bootstrap": "^4.1.3",
16 |         "dsteem": "^0.10.1",
17 |         "koa": "^2.5.3",
18 |         "koa-static": "^5.0.0",
19 |         "remarkable": "^1.7.1"
20 |     },
21 |     "devDependencies": {
22 |         "css-loader": "^1.0.0",
23 |         "style-loader": "^0.23.1",
24 |         "webpack": "^4.20.2",
25 |         "webpack-cli": "^3.1.2",
26 |         "webpack-dev-server": "^3.1.9"
27 |     }
28 | }
29 | 


--------------------------------------------------------------------------------
/tutorials/29_get_delegations_by_user/public/app.js:
--------------------------------------------------------------------------------
 1 | // const dsteem = require('dsteem');
 2 | // //define network parameters
 3 | // let opts = {};
 4 | // opts.addressPrefix = 'STX';
 5 | // opts.chainId =
 6 | //     '79276aea5d4877d9a25892eaa01b0adf019d3e5cb12a97478df3298ccdd01673';
 7 | // //connect to a steem node, testnet in this case
 8 | // const client = new dsteem.Client('https://testnet.steem.vc', opts);
 9 | 
10 | const dsteem = require('dsteem');
11 | let opts = {};
12 | //define network parameters
13 | opts.addressPrefix = 'STM';
14 | opts.chainId =
15 |     '0000000000000000000000000000000000000000000000000000000000000000';
16 | //connect to a steem node, production in this case
17 | const client = new dsteem.Client('https://api.steemit.com');
18 | 
19 | //active delegations function
20 | window.createList = async () => {
21 |     //clear list
22 |     document.getElementById('delegationList').innerHTML = '';
23 | 
24 |     //get username
25 |     const delegator = document.getElementById('username').value;
26 | 
27 |     //account, from, limit
28 |     delegationdata = await client.database.getVestingDelegations(
29 |         delegator,
30 |         '',
31 |         100
32 |     );
33 |     console.log(JSON.stringify(delegationdata));
34 | 
35 |     if (delegationdata[0] == null) {
36 |         console.log('No delegation information');
37 |         document.getElementById('searchResultContainer').style.display = 'flex';
38 |         document.getElementById('searchResult').className =
39 |             'form-control-plaintext alert alert-danger';
40 |         document.getElementById('searchResult').innerHTML =
41 |             'No delegation information';
42 |     } else {
43 |         document.getElementById('searchResultContainer').style.display = 'flex';
44 |         document.getElementById('searchResult').className =
45 |             'form-control-plaintext alert alert-success';
46 |         document.getElementById('searchResult').innerHTML =
47 |             'Active Delegations';
48 |     }
49 | 
50 |     //delegator, delegatee, vesting_shares, min_delegation_time
51 |     delegationdata.forEach(newObj => {
52 |         name = newObj.delegatee;
53 |         shares = newObj.vesting_shares;
54 |         document.getElementById('delegationList').innerHTML +=
55 |             delegator + ' delegated ' + shares + ' to ' + name + '<br>';
56 |     });
57 | };
58 | 
59 | //expiring delegations function
60 | window.displayExpire = async () => {
61 |     //clear list
62 |     document.getElementById('delegationList').innerHTML = '';
63 | 
64 |     //get username
65 |     const delegator = document.getElementById('username').value;
66 | 
67 |     //user, from time, limit
68 |     const delegationdata = await client.database.call(
69 |         'get_expiring_vesting_delegations',
70 |         [delegator, '2018-01-01T00:00:00', 100]
71 |     );
72 |     console.log(delegationdata);
73 | 
74 |     if (delegationdata[0] == null) {
75 |         console.log('No delegation information');
76 |         document.getElementById('searchResultContainer').style.display = 'flex';
77 |         document.getElementById('searchResult').className =
78 |             'form-control-plaintext alert alert-danger';
79 |         document.getElementById('searchResult').innerHTML =
80 |             'No delegation information';
81 |     } else {
82 |         document.getElementById('searchResultContainer').style.display = 'flex';
83 |         document.getElementById('searchResult').className =
84 |             'form-control-plaintext alert alert-success';
85 |         document.getElementById('searchResult').innerHTML =
86 |             'Expiring Delegations';
87 |     }
88 | 
89 |     //vesting_shares, expiration
90 |     delegationdata.forEach(newObj => {
91 |         shares = newObj.vesting_shares;
92 |         date = expiration;
93 |         document.getElementById('delegationList').innerHTML +=
94 |             shares + ' will be released at ' + date + '<br>';
95 |     });
96 | };
97 | 


--------------------------------------------------------------------------------
/tutorials/29_get_delegations_by_user/public/index.html:
--------------------------------------------------------------------------------
 1 | <html>
 2 |     <head>
 3 |         <title>Get delegations by user</title>
 4 |         <script src="bundle.js"></script>
 5 |     </head>
 6 |     <body>
 7 |         <div class="container" id="content">
 8 |             <form>
 9 |                 <h4>Create a list of active or expiring delegations</h4>
10 |                 <div class="form-group row">
11 |                     <label for="username" class="col-sm-4 col-form-label">
12 |                         Username
13 |                     </label>
14 |                     <div class="col-sm-8">
15 |                         <input
16 |                         id="username"
17 |                         type="text"
18 |                         class="form-control"
19 |                         value="cutemachine"
20 |                         />
21 |                     </div>
22 |                 </div>
23 |                 <div class="form-group row">
24 |                     <div class="offset-sm-4 col-sm-8">
25 |                         <input
26 |                             id="createListBtn"
27 |                             type="button"
28 |                             value="Display active delegations"
29 |                             onclick="createList()"
30 |                             class="btn btn-primary"
31 |                         />
32 |                     </div>
33 |                 </div>
34 |             </form>
35 |             <form>
36 |                 <div class="form-group row">
37 |                     <div class="offset-sm-4 col-sm-8">
38 |                         <input
39 |                             id="expireBtn"
40 |                             type="button"
41 |                             value="Display expiring delegations"
42 |                             onclick="displayExpire()"
43 |                             class="btn btn-primary"
44 |                         />
45 |                     </div>
46 |                 </div>
47 |                 <div
48 |                     class="form-group row"
49 |                     id="searchResultContainer"
50 |                     style="display: none;"
51 |                 >
52 |                     <label for="searchResult" class="col-sm-4 col-form-label">
53 |                         Search result
54 |                     </label>
55 |                     <div class="col-sm-8">
56 |                         <div id="searchResult" class="form-control-plaintext"></div>
57 |                     </div>
58 |                 </div>
59 |                 
60 |             </form>
61 |             <div class="offset-sm-4 col-sm-8">
62 |                 <div class="list-group" id="delegationList"></div>
63 |             </div>
64 |         </div>
65 |     </body>
66 | </html>
67 | 


--------------------------------------------------------------------------------
/tutorials/29_get_delegations_by_user/public/style.scss:
--------------------------------------------------------------------------------
1 | import 'bootstrap/dist/css/bootstrap.min.css'


--------------------------------------------------------------------------------
/tutorials/29_get_delegations_by_user/webpack.config.js:
--------------------------------------------------------------------------------
 1 | var path = require('path');
 2 | module.exports = {
 3 |     entry: ['./public/app.js', './public/style.scss'],
 4 |     output: {
 5 |         path: path.resolve(__dirname, 'public'),
 6 |         filename: 'bundle.js',
 7 |     },
 8 |     devtool: 'source-map',
 9 |     module: {
10 |         rules: [
11 |             {
12 |                 test: /\.css$/,
13 |                 use: ['style-loader', 'css-loader'],
14 |             },
15 |         ],
16 |     },
17 |     performance: {
18 |         hints: process.env.NODE_ENV === 'production' ? 'warning' : false,
19 |     },
20 | };
21 | 


--------------------------------------------------------------------------------
/tutorials/30_grant_posting_permission/index.js:
--------------------------------------------------------------------------------
1 | const Koa = require('koa');
2 | const app = new Koa();
3 | const serve = require('koa-static');
4 | app.use(serve('./public'));
5 | 
6 | app.listen(3000);
7 | 
8 | console.log('listening on port 3000');
9 | 


--------------------------------------------------------------------------------
/tutorials/30_grant_posting_permission/package.json:
--------------------------------------------------------------------------------
 1 | {
 2 |     "name": "30_grant_posting_permission",
 3 |     "version": "1.0.0",
 4 |     "description": "",
 5 |     "main": "index.js",
 6 |     "scripts": {
 7 |         "start": "webpack && node ./index.js",
 8 |         "test": "echo \"Error: no test specified\" && exit 1",
 9 |         "dev-server":
10 |             "./node_modules/.bin/webpack-dev-server --mode development --content-base ./public --port 3000"
11 |     },
12 |     "author": "",
13 |     "license": "ISC",
14 |     "dependencies": {
15 |         "bootstrap": "^4.1.3",
16 |         "dsteem": "^0.10.1",
17 |         "koa": "^2.5.3",
18 |         "koa-static": "^5.0.0",
19 |         "remarkable": "^1.7.1"
20 |     },
21 |     "devDependencies": {
22 |         "css-loader": "^1.0.0",
23 |         "style-loader": "^0.23.1",
24 |         "webpack": "^4.20.2",
25 |         "webpack-cli": "^3.1.2",
26 |         "webpack-dev-server": "^3.1.9"
27 |     }
28 | }
29 | 


--------------------------------------------------------------------------------
/tutorials/30_grant_posting_permission/public/index.html:
--------------------------------------------------------------------------------
 1 | <html>
 2 |     <head>
 3 |         <title>Grant posting permission</title>
 4 |         <script src="bundle.js"></script>
 5 |     </head>
 6 |     <body>
 7 |         <div class="container" id="content">
 8 |             <h4>Grant posting permission to another account</h4>
 9 |             <form>
10 |                 <div class="form-group row">
11 |                     <label for="username" class="col-sm-2 col-form-label">
12 |                         Username
13 |                     </label>
14 |                     <div class="col-sm-10">
15 |                         <input
16 |                             id="username"
17 |                             type="text"
18 |                             class="form-control"
19 |                         />
20 |                     </div>
21 |                 </div>
22 |                 <div class="form-group row">
23 |                     <label for="privateKey" class="col-sm-2 col-form-label">
24 |                         Private active key
25 |                     </label>
26 |                     <div class="col-sm-10">
27 |                         <input
28 |                             type="password"
29 |                             class="form-control"
30 |                             id="privateKey"
31 |                         />
32 |                     </div>
33 |                 </div>
34 |                 <div class="form-group row">
35 |                     <label for="recipient" class="col-sm-2 col-form-label">
36 |                         User to be given posting permission
37 |                     </label>
38 |                     <div class="col-sm-10">
39 |                         <input
40 |                             type="text"
41 |                             class="form-control"
42 |                             id="newAccount"
43 |                         />
44 |                     </div>
45 |                 </div>
46 |                 <div
47 |                     class="form-group row"
48 |                     id="permCheckContainer"
49 |                     style="display: none;"
50 |                 >
51 |                     <label for="permCheck" class="col-sm-4 col-form-label">
52 |                         Permission check
53 |                     </label>
54 |                     <div class="offset-sm-2 col-sm-8">
55 |                         <div id="permCheck" class="form-control-plaintext"></div>
56 |                     </div>
57 |                 </div>
58 |                 <div class="form-group row">
59 |                     <div class="offset-sm-2 col-sm-8">
60 |                         <input
61 |                             id="submitCheckBtn"
62 |                             type="button"
63 |                             value="Check permission status"
64 |                             onclick="submitCheck()"
65 |                             class="btn btn-primary"
66 |                         />
67 |                         <input
68 |                             id="submitPermBtn"
69 |                             type="button"
70 |                             value="Provide permission approval"
71 |                             onclick="submitPermission()"
72 |                             class="btn btn-primary"
73 |                         />
74 |                         <input
75 |                             id="submitRevokeBtn"
76 |                             type="button"
77 |                             value="Revoke permission approval"
78 |                             onclick="submitRevoke()"
79 |                             class="btn btn-primary"
80 |                         />
81 |                     </div>
82 |                 </div>
83 |             </form>
84 |         </div>
85 |     </body>
86 | </html>
87 | 


--------------------------------------------------------------------------------
/tutorials/30_grant_posting_permission/public/style.scss:
--------------------------------------------------------------------------------
1 | import 'bootstrap/dist/css/bootstrap.min.css'


--------------------------------------------------------------------------------
/tutorials/30_grant_posting_permission/webpack.config.js:
--------------------------------------------------------------------------------
 1 | var path = require('path');
 2 | module.exports = {
 3 |     entry: ['./public/app.js', './public/style.scss'],
 4 |     output: {
 5 |         path: path.resolve(__dirname, 'public'),
 6 |         filename: 'bundle.js',
 7 |     },
 8 |     devtool: 'source-map',
 9 |     module: {
10 |         rules: [
11 |             {
12 |                 test: /\.css$/,
13 |                 use: ['style-loader', 'css-loader'],
14 |             },
15 |         ],
16 |     },
17 |     performance: {
18 |         hints: process.env.NODE_ENV === 'production' ? 'warning' : false,
19 |     },
20 | };
21 | 


--------------------------------------------------------------------------------
/tutorials/31_grant_active_permission/index.js:
--------------------------------------------------------------------------------
1 | const Koa = require('koa');
2 | const app = new Koa();
3 | const serve = require('koa-static');
4 | app.use(serve('./public'));
5 | 
6 | app.listen(3000);
7 | 
8 | console.log('listening on port 3000');
9 | 


--------------------------------------------------------------------------------
/tutorials/31_grant_active_permission/package.json:
--------------------------------------------------------------------------------
 1 | {
 2 |     "name": "31_grant_active_permission",
 3 |     "version": "1.0.0",
 4 |     "description": "",
 5 |     "main": "index.js",
 6 |     "scripts": {
 7 |         "start": "webpack && node ./index.js",
 8 |         "test": "echo \"Error: no test specified\" && exit 1",
 9 |         "dev-server": "./node_modules/.bin/webpack-dev-server --mode development --content-base ./public --port 3000"
10 |     },
11 |     "author": "",
12 |     "license": "ISC",
13 |     "dependencies": {
14 |         "bootstrap": "^4.1.3",
15 |         "dsteem": "^0.10.1",
16 |         "koa": "^2.5.3",
17 |         "koa-static": "^5.0.0",
18 |         "remarkable": "^1.7.1"
19 |     },
20 |     "devDependencies": {
21 |         "css-loader": "^1.0.0",
22 |         "style-loader": "^0.23.1",
23 |         "webpack": "^4.20.2",
24 |         "webpack-cli": "^3.1.2",
25 |         "webpack-dev-server": "^3.1.9"
26 |     }
27 | }
28 | 


--------------------------------------------------------------------------------
/tutorials/31_grant_active_permission/public/index.html:
--------------------------------------------------------------------------------
 1 | <html>
 2 |     <head>
 3 |         <title>Grant active permission</title>
 4 |         <script src="bundle.js"></script>
 5 |     </head>
 6 |     <body>
 7 |         <div class="container" id="content">
 8 |             <h4>Grant active permission to another account</h4>
 9 |             <form>
10 |                 <div class="form-group row">
11 |                     <label for="username" class="col-sm-2 col-form-label">
12 |                         Username
13 |                     </label>
14 |                     <div class="col-sm-10">
15 |                         <input
16 |                             id="username"
17 |                             type="text"
18 |                             class="form-control"
19 |                         />
20 |                     </div>
21 |                 </div>
22 |                 <div class="form-group row">
23 |                     <label for="privateKey" class="col-sm-2 col-form-label">
24 |                         Private active key
25 |                     </label>
26 |                     <div class="col-sm-10">
27 |                         <input
28 |                             type="password"
29 |                             class="form-control"
30 |                             id="privateKey"
31 |                         />
32 |                     </div>
33 |                 </div>
34 |                 <div class="form-group row">
35 |                     <label for="recipient" class="col-sm-2 col-form-label">
36 |                         User to be given active permission
37 |                     </label>
38 |                     <div class="col-sm-10">
39 |                         <input
40 |                             type="text"
41 |                             class="form-control"
42 |                             id="newAccount"
43 |                         />
44 |                     </div>
45 |                 </div>
46 |                 <div
47 |                     class="form-group row"
48 |                     id="permCheckContainer"
49 |                     style="display: none;"
50 |                 >
51 |                     <label for="permCheck" class="col-sm-4 col-form-label">
52 |                         Permission check
53 |                     </label>
54 |                     <div class="offset-sm-2 col-sm-8">
55 |                         <div id="permCheck" class="form-control-plaintext"></div>
56 |                     </div>
57 |                 </div>
58 |                 <div class="form-group row">
59 |                     <div class="offset-sm-2 col-sm-8">
60 |                         <input
61 |                             id="submitCheckBtn"
62 |                             type="button"
63 |                             value="Check permission status"
64 |                             onclick="submitCheck()"
65 |                             class="btn btn-primary"
66 |                         />
67 |                         <input
68 |                             id="submitPermBtn"
69 |                             type="button"
70 |                             value="Provide active permission"
71 |                             onclick="submitPermission()"
72 |                             class="btn btn-primary"
73 |                         />
74 |                         <input
75 |                             id="submitRevokeBtn"
76 |                             type="button"
77 |                             value="Revoke active permission"
78 |                             onclick="submitRevoke()"
79 |                             class="btn btn-primary"
80 |                         />
81 |                     </div>
82 |                 </div>
83 |             </form>
84 |         </div>
85 |     </body>
86 | </html>
87 | 


--------------------------------------------------------------------------------
/tutorials/31_grant_active_permission/public/style.scss:
--------------------------------------------------------------------------------
1 | import 'bootstrap/dist/css/bootstrap.min.css'


--------------------------------------------------------------------------------
/tutorials/31_grant_active_permission/webpack.config.js:
--------------------------------------------------------------------------------
 1 | var path = require('path');
 2 | module.exports = {
 3 |     entry: ['./public/app.js', './public/style.scss'],
 4 |     output: {
 5 |         path: path.resolve(__dirname, 'public'),
 6 |         filename: 'bundle.js',
 7 |     },
 8 |     devtool: 'source-map',
 9 |     module: {
10 |         rules: [
11 |             {
12 |                 test: /\.css$/,
13 |                 use: ['style-loader', 'css-loader'],
14 |             },
15 |         ],
16 |     },
17 |     performance: {
18 |         hints: process.env.NODE_ENV === 'production' ? 'warning' : false,
19 |     },
20 | };


--------------------------------------------------------------------------------
/tutorials/32_convert_sbd_to_steem/index.js:
--------------------------------------------------------------------------------
1 | const Koa = require('koa');
2 | const app = new Koa();
3 | const serve = require('koa-static');
4 | app.use(serve('./public'));
5 | 
6 | app.listen(3000);
7 | 
8 | console.log('listening on port 3000');
9 | 


--------------------------------------------------------------------------------
/tutorials/32_convert_sbd_to_steem/package.json:
--------------------------------------------------------------------------------
 1 | {
 2 |     "name": "32_convert_sbd_to_steem",
 3 |     "version": "1.0.0",
 4 |     "description": "",
 5 |     "main": "index.js",
 6 |     "scripts": {
 7 |         "start": "webpack && node ./index.js",
 8 |         "test": "echo \"Error: no test specified\" && exit 1",
 9 |         "dev-server": "./node_modules/.bin/webpack-dev-server --mode development --content-base ./public --port 3000"
10 |     },
11 |     "author": "",
12 |     "license": "ISC",
13 |     "dependencies": {
14 |         "bootstrap": "^4.1.3",
15 |         "dsteem": "^0.10.1",
16 |         "koa": "^2.5.3",
17 |         "koa-static": "^5.0.0"
18 |     },
19 |     "devDependencies": {
20 |         "css-loader": "^1.0.0",
21 |         "style-loader": "^0.23.1",
22 |         "webpack": "^4.20.2",
23 |         "webpack-cli": "^3.1.2",
24 |         "webpack-dev-server": "^3.1.9"
25 |     }
26 | }
27 | 


--------------------------------------------------------------------------------
/tutorials/32_convert_sbd_to_steem/public/app.js:
--------------------------------------------------------------------------------
 1 | import { Client, PrivateKey } from 'dsteem';
 2 | import { Testnet as NetConfig } from '../../configuration'; //A Steem Testnet. Replace 'Testnet' with 'Mainnet' to connect to the main Steem blockchain.
 3 | 
 4 | let opts = { ...NetConfig.net };
 5 | 
 6 | //connect to a steem node, tesetnet in this case
 7 | const client = new Client(NetConfig.url, opts);
 8 | 
 9 | window.submitAcc = async () => {
10 |     const accSearch = document.getElementById('username').value;
11 | 
12 |     const _account = await client.database.call('get_accounts', [[accSearch]]);
13 |     console.log(`_account:`, _account);
14 | 
15 |     const availSBD = _account[0].sbd_balance 
16 |     const availSTEEM = _account[0].balance
17 | 
18 |     const balance = `Available balance: ${availSBD} and ${availSTEEM} <br/>`;
19 |     document.getElementById('accBalance').innerHTML = balance;
20 | 
21 |     //create random number for requestid paramter
22 |     var x = Math.floor(Math.random() * 10000000);
23 |     document.getElementById("requestID").value = x
24 | }
25 | 
26 | //submit convert function executes when you click "Convert" button
27 | window.submitConvert = async () => {
28 |     //get all values from the UI
29 |     //get account name
30 |     const username = document.getElementById('username').value;
31 |     //get private active key
32 |     const privateKey = PrivateKey.fromString(
33 |         document.getElementById('privateKey').value
34 |     );
35 |     //get convert amount
36 |     const quantity = document.getElementById('quantity').value;
37 |     //create correct format
38 |     const convert = quantity.concat(' SBD');
39 |     //assign integer value of ID
40 |     const requestid = parseInt(document.getElementById('requestID').value);
41 | 
42 |     //create convert operation
43 |     const op = [
44 |         'convert',
45 |         { owner: username, amount: convert, requestid: requestid },
46 |     ];
47 |     
48 |     //broadcast the conversion
49 |     client.broadcast.sendOperations([op], privateKey).then(
50 |         function(result) {
51 |             console.log(
52 |                 'included in block: ' + result.block_num,
53 |                 'expired: ' + result.expired
54 |             );
55 |             document.getElementById('convertResultContainer').style.display =
56 |                 'flex';
57 |             document.getElementById('convertResult').className =
58 |                 'form-control-plaintext alert alert-success';
59 |             document.getElementById('convertResult').innerHTML = 'Success';
60 |         },
61 |         function(error) {
62 |             console.error(error);
63 |             document.getElementById('convertResultContainer').style.display =
64 |                 'flex';
65 |             document.getElementById('convertResult').className =
66 |                 'form-control-plaintext alert alert-danger';
67 |             document.getElementById('convertResult').innerHTML =
68 |                 error.jse_shortmsg;
69 |         }
70 |     );
71 | };
72 | 
73 | window.onload = async () => {
74 |     const account = NetConfig.accounts[0];
75 |     document.getElementById('username').value = account.address;
76 |     document.getElementById('privateKey').value = account.privActive;
77 | };
78 | 


--------------------------------------------------------------------------------
/tutorials/32_convert_sbd_to_steem/public/index.html:
--------------------------------------------------------------------------------
 1 | <html>
 2 |     <head>
 3 |         <title>Convert SBD to STEEM</title>
 4 |         <script src="bundle.js"></script>
 5 |     </head>
 6 |     <body>
 7 |         <div class="container" id="content">
 8 |             <h4>Convert SBD to STEEM</h4>
 9 |             <form>
10 |                 <div class="form-group row">
11 |                     <label for="username" class="col-sm-2 col-form-label">
12 |                         Username
13 |                     </label>
14 |                     <div class="col-sm-10">
15 |                         <input
16 |                             id="username"
17 |                             type="text"
18 |                             class="form-control"
19 |                         />
20 |                         <br><input
21 |                             id="submitSearch"
22 |                             type="button"
23 |                             value="Search"
24 |                             onclick="submitAcc()"
25 |                             class="btn btn-primary"
26 |                         /><br>
27 |                         <div class="col-form-label" id="accBalance"></div>
28 |                     </div>
29 |                 </div>
30 |                 
31 |                 <div class="form-group row">
32 |                     <label for="privateKey" class="col-sm-2 col-form-label">
33 |                         Private active key
34 |                     </label>
35 |                     <div class="col-sm-10">
36 |                         <input
37 |                             type="password"
38 |                             class="form-control"
39 |                             id="privateKey"
40 |                         />
41 |                     </div>
42 |                 </div>
43 |                 <div class="form-group row">
44 |                     <label for="quantity" class="col-sm-2 col-form-label">
45 |                         Convert amount (3 decimals)
46 |                     </label>
47 |                     <div class="col-sm-10">
48 |                         <input
49 |                             type="text"
50 |                             class="form-control"
51 |                             id="quantity"
52 |                         />
53 |                     </div>
54 |                 </div>
55 |                 <div class="form-group row">
56 |                     <label for="requestID" class="col-sm-2 col-form-label">
57 |                         Request ID
58 |                     </label>
59 |                     <div class="col-sm-10">
60 |                         <input
61 |                             type="text"
62 |                             class="form-control"
63 |                             id="requestID"
64 |                         />
65 |                     </div>
66 |                 </div>
67 |                 <div class="form-group row">
68 |                     <div class="offset-sm-2 col-sm-10">
69 |                         <input
70 |                             id="transferBtn"
71 |                             type="button"
72 |                             value="Convert"
73 |                             onclick="submitConvert()"
74 |                             class="btn btn-primary"
75 |                         />
76 |                     </div>
77 |                 </div>
78 |                 <div
79 |                     class="form-group row"
80 |                     id="convertResultContainer"
81 |                     style="display: none;"
82 |                 >
83 |                     <label for="convertResult" class="col-sm-2 col-form-label">
84 |                         Transfer result
85 |                     </label>
86 |                     <div class="col-sm-10">
87 |                         <div id="convertResult" class="form-control-plaintext" />
88 |                     </div>
89 |                 </div>
90 |             </form>
91 |         </div>
92 |     </body>
93 | </html>
94 | 


--------------------------------------------------------------------------------
/tutorials/32_convert_sbd_to_steem/public/style.scss:
--------------------------------------------------------------------------------
1 | import 'bootstrap/dist/css/bootstrap.min.css'


--------------------------------------------------------------------------------
/tutorials/32_convert_sbd_to_steem/webpack.config.js:
--------------------------------------------------------------------------------
 1 | var path = require('path');
 2 | module.exports = {
 3 |     entry: ['./public/app.js', './public/style.scss'],
 4 |     output: {
 5 |         path: path.resolve(__dirname, 'public'),
 6 |         filename: 'bundle.js',
 7 |     },
 8 |     devtool: 'source-map',
 9 |     module: {
10 |         rules: [
11 |             {
12 |                 test: /\.css$/,
13 |                 use: ['style-loader', 'css-loader'],
14 |             },
15 |         ],
16 |     },
17 |     performance: {
18 |         hints: process.env.NODE_ENV === 'production' ? 'warning' : false,
19 |     },
20 | };


--------------------------------------------------------------------------------
/tutorials/34_get_state_replacement_api/index.js:
--------------------------------------------------------------------------------
1 | const Koa = require('koa');
2 | const app = new Koa();
3 | const serve = require('koa-static');
4 | app.use(serve('./public'));
5 | 
6 | app.listen(3000);
7 | 
8 | console.log('listening on port 3000');
9 | 


--------------------------------------------------------------------------------
/tutorials/34_get_state_replacement_api/package.json:
--------------------------------------------------------------------------------
 1 | {
 2 |     "name": "34_get_state_replacement_api",
 3 |     "version": "1.0.0",
 4 |     "description": "",
 5 |     "main": "index.js",
 6 |     "scripts": {
 7 |         "start": "webpack && node ./index.js",
 8 |         "test": "echo \"Error: no test specified\" && exit 1",
 9 |         "dev-server": "./node_modules/.bin/webpack-dev-server --mode development --content-base ./public --port 3000"
10 |     },
11 |     "author": "",
12 |     "license": "ISC",
13 |     "dependencies": {
14 |         "bootstrap": "^4.1.0",
15 |         "dsteem": "^0.8.7",
16 |         "koa": "^2.5.0",
17 |         "koa-static": "^4.0.2",
18 |         "remarkable": "^1.7.1"
19 |     },
20 |     "devDependencies": {
21 |         "css-loader": "^0.28.11",
22 |         "style-loader": "^0.21.0",
23 |         "webpack": "^4.3.0",
24 |         "webpack-cli": "^2.0.13",
25 |         "webpack-dev-server": "^3.1.3"
26 |     }
27 | }
28 | 


--------------------------------------------------------------------------------
/tutorials/34_get_state_replacement_api/public/app.js:
--------------------------------------------------------------------------------
 1 | const dsteem = require('dsteem');
 2 | 
 3 | let opts = {};
 4 | 
 5 | //connect to production server
 6 | opts.addressPrefix = 'STM';
 7 | opts.chainId =
 8 |     '0000000000000000000000000000000000000000000000000000000000000000';
 9 | 
10 | //connect to server which is connected to the network/production
11 | const client = new dsteem.Client('https://api.steemit.com');
12 | 
13 | 
14 | window.showAccount = async () => {
15 |     console.log('account : ');
16 |     var _info = new Array
17 |     _info = await client.database.getAccounts(['steemitblog']);
18 |     console.log(_info[0]);
19 | 
20 | }
21 | 
22 | window.showContent = async () => {
23 |     console.log('content : ');
24 | 
25 |     const filter = 'trending';
26 |     const query = {
27 |         limit: 20,
28 |     };
29 |     var _info = new Array
30 |     _info = await client.database.getDiscussions(filter, query)
31 |     console.log(_info)
32 | 
33 | }
34 | 
35 | window.showPrice = async () => {
36 |     console.log('feed_price : ');
37 | 
38 |     _info = await client.database.getCurrentMedianHistoryPrice()
39 |     console.log(_info)
40 | 
41 | }
42 | 
43 | window.showProps = async () => {
44 |     console.log('props : ');
45 | 
46 |     _info = await client.database.getDynamicGlobalProperties()
47 |     console.log(_info)
48 | 
49 | }
50 | 
51 | window.showTags = async () => {
52 |     console.log('tags : ');
53 | 
54 |     _info = await client.database.call('get_trending_tags',['', 10])
55 |     console.log(_info)
56 | 
57 | }
58 | 
59 | window.showTagidx = async () => {
60 |     console.log('tag_idx : ');
61 | 
62 |     _info = await client.database.call('get_trending_tags',['', 10])
63 |     _info.forEach(post => {
64 |         console.log(post.name)
65 |     });
66 | 
67 | }
68 | 
69 | window.showSchedule = async () => {
70 |     console.log('witness schedule : ');
71 | 
72 |     _info = await client.database.call('get_witness_schedule',[]);
73 |     console.log(_info);
74 | 
75 | }
76 | 
77 | window.showWitness = async () => {
78 |     console.log('witnesses : ');
79 | 
80 |     var _info = await client.database.call('get_witnesses_by_vote',['',10])
81 |     console.log(_info)
82 | 
83 | }


--------------------------------------------------------------------------------
/tutorials/34_get_state_replacement_api/public/index.css:
--------------------------------------------------------------------------------
1 | #replies img,
2 | #replies iframe {
3 |     max-width: 100%;    
4 | }
5 | 


--------------------------------------------------------------------------------
/tutorials/34_get_state_replacement_api/public/style.scss:
--------------------------------------------------------------------------------
1 | import 'bootstrap/dist/css/bootstrap.min.css'
2 | import './index.css'


--------------------------------------------------------------------------------
/tutorials/34_get_state_replacement_api/webpack.config.js:
--------------------------------------------------------------------------------
 1 | var path = require('path');
 2 | module.exports = {
 3 |     entry: ['./public/app.js', './public/style.scss'],
 4 |     output: {
 5 |         path: path.resolve(__dirname, 'public'),
 6 |         filename: 'bundle.js',
 7 |     },
 8 |     devtool: 'source-map',
 9 |     module: {
10 |         rules: [
11 |             {
12 |                 test: /\.css$/,
13 |                 use: ['style-loader', 'css-loader'],
14 |             },
15 |         ],
16 |     },
17 |     performance: {
18 |         hints: process.env.NODE_ENV === 'production' ? 'warning' : false,
19 |     },
20 | };
21 | 


--------------------------------------------------------------------------------
/tutorials/README.md:
--------------------------------------------------------------------------------
1 | this page intentionally left blank


--------------------------------------------------------------------------------
/tutorials/configuration.js:
--------------------------------------------------------------------------------
 1 | /**
 2 |  * This is the main configuration file for the Steem developer Javascript tutorials
 3 |  *
 4 |  * In this configuration file we use 'address' to refer to what in many other contexts are called
 5 |  * user,
 6 |  * author,
 7 |  * account,
 8 |  * account name
 9 |  *
10 |  * Address is a fairly accurate term, and hasn't been overloaded, it also has at-least exactly the properties of addresses on other blockchains.
11 |  *
12 |  */
13 | 
14 | export const TestnetSteemit = {
15 |     accounts: [
16 |         {
17 |             address: 'demo',
18 |             privActive: '5Jtbfge4Pk5RyhgzvmZhGE5GeorC1hbaHdwiM7pb5Z5CZz2YKUC',
19 |         },
20 |         {
21 |             address: 'demo1',
22 |             privActive: '5Ju3fhTY25Tsseyk4c1PUpH2bTLC8eLbdFRjytmnvU9ZLEQBmsf',
23 |         },
24 |         {
25 |             address: 'demo2',
26 |             privActive: '5JZDEAXjANq9isYa66g9tYbeuo4wWXhwXPfujwt9s4DaK4b38R9',
27 |         },
28 |         {
29 |             address: 'demo3',
30 |             privActive: '5J6bzy9TM3kBRibXmFi7ZvThrWGMN3epg7aCXLKazTLsJnmw6Mq',
31 |         },
32 |         {
33 |             address: 'demo4',
34 |             privActive: '5KQQKVHJBpygcBrqKF6TLQSBX5zHbPRgNEAuojb6fK2C94NX3kJ',
35 |         },
36 |         {
37 |             address: 'demo5',
38 |             privActive: '5K7QWGuAAX27yvQRPBMBDA4BbXVpdtmALxoM8CoRdZAsPew5hJd',
39 |         },
40 |     ],
41 |     url: 'https://testnet.steemitdev.com',
42 |     net: {
43 |         addressPrefix: 'TST',
44 |         chainId:
45 |             '46d82ab7d8db682eb1959aed0ada039a6d49afa1602491f93dde9cac3e8e6c32',
46 |     },
47 | };
48 | 
49 | export const TestnetVC = {
50 |     accounts: [
51 |         {
52 |             address: 'demo01',
53 |             privPosting: '5KNckabfv4i793ymx4NWrTLDQZMjhgQTJbPSTroeBY4Bh5Eg6Tm',
54 |             privActive: '5HxTntgeoLm4trnTz94YBsY6MpAap1qRVXEKsU5n1v2du1gAgVH',
55 |         },
56 |         {
57 |             address: 'demo02',
58 |             privPosting: '5KHUais1mfUn7A3M6pLZw1WF1v6WetFGCB1YDNctcPizLyCT1vW',
59 |             privActive: '5KgMKfnTQTzrmZP3RxrQs3CEckHTPXxFzJWHV3cJjetmXwLUWZj',
60 |         },
61 |     ],
62 |     url: 'https://testnet.steem.vc',
63 |     net: {
64 |         addressPrefix: 'STX',
65 |         chainId:
66 |             '79276aea5d4877d9a25892eaa01b0adf019d3e5cb12a97478df3298ccdd01673',
67 |     },
68 | };
69 | 
70 | export const Testnet = TestnetVC;
71 | 
72 | export const Mainnet = {
73 |     accounts: [],
74 |     url: 'https://api.steemit.com',
75 |     net: {
76 |         addressPrefix: 'STM',
77 |         chainId:
78 |             '0000000000000000000000000000000000000000000000000000000000000000',
79 |     },
80 | };
81 | 
82 | export default {};
83 | 


--------------------------------------------------------------------------------