SteemJS - Create Delegation Tool (Basic)
한국어: Click - Translated Version
中文: Click - Translated Version
Repository:
https://github.com/steemit/steem-js
What Will I Learn?
- You will learn how to use steemjs on clean Javascript file and without Node.JS as how we use to do it before
- You will learn how to delegate SP to others using SteemJS
- You will learn how to convert SP to Vests
Requirements
- SteemJS CDN [
https://cdn.steemjs.com/lib/latest/steem.min.js]
Difficulty
- Basic
Curriculum
The Tutorial
Hello guys, welcome back to my steemjs tutorials, hope you're having a wonderful day.
At this tutorial, you will need nothing, just the CDN of steem and nothing apart from that.
you can find the CDN up at the Requirements
First, create an HTML 5 file.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Delegation</title>
</head>
<body>
</body>
</html>
this is a basic skeleton of HTML 5 file.
now import the CDN of steemjs and JQuery so it will be easier to interact with inputs.
go to the bottom of the body and enter the CDNs
<script
src="https://code.jquery.com/jquery-3.3.1.slim.min.js"
integrity="sha256-3edrmyuQ0w65f8gfBsqowzjJe2iM6n0nKciPUp8y+7E="
crossorigin="anonymous"></script>
<script src="https://cdn.steemjs.com/lib/latest/steem.min.js"></script>
And create a new script tag with jquery working
<script>
$(document).ready(function(){
});
</script>
Great, now we need to create 4 inputs and 1 Button
so, first will be the delegator name
the second will be the delegatee (the account gets the delegation) name
the Active WIF Key
the SP Amount
<h3>STEEM Delegation Tool</h3>
<span class="message"></span><br>
<input type="text" placeholder="Account Name..." id="accname" /><br>
<input type="text" placeholder="Delegate To..." id="delegatee" /><br>
<input type="password" placeholder="Active WIF Key..." id="wifkey" /><br>
<input type="number" min="0.1" max="100000" value="1000.00" id="sp" /><br>
<button id="sendDelegation" id="sendDelegation">Send Delegation</button>
Great we all set with the HTML, you don't need anything else.
the span is to update the message and say that the delegation sent so we don't use the console to check it!
now go back to JQuery and create 4 vars for the inputs
var account = $("#accname").val();
var delegatee = $("#delegatee").val();
var wif = $("#wifkey").val();
var sp = $("#sp").val();
.val()- this function gets the value of the input.
so we have now the information, we can check if the user clicked on the button and send the delegation.
$("#sendDelegation").click(function(){
$(".message").html("");
});
so if we click firstly we will clear the message span so if the user already sent a delegation and wanted to send again it will not be stuck.
now we need to get the global properties to calculate how much SP = Vests because we can only delegate Vests and not directly SP.
SP is a number we can read and know how much is worth and Vests is the "hidden number" that we don't know how much is worth.
steem.api.getDynamicGlobalProperties(function(err, result){
const totalSteem = Number(result.total_vesting_fund_steem.split(' ')[0]);
const totalVests = Number(result.total_vesting_shares.split(' ')[0]);
const delegated_SP = sp;
var delegated_vest = delegated_SP * totalVests / totalSteem;
delegated_vest=delegated_vest.toFixed(6);
delegated_vest=delegated_vest.toString()+' VESTS';
});
great now we transfer the value of SP to vests!
the calculation is kinda hard so I don't really can explain to you what we're doing because the calculation is made with properties of the steem blockchain.
now all we need to do is to run the delegate function
steem.broadcast.delegateVestingShares(wif, account, delegatee, delegated_vest, function(err, result) {
console.log(err, result);
$(".message").html("Delegation made succesfully!");
});
so pretty easy, we're using the delegateVestingShares function to delegate the SP,
wif is the Active Key,
the account is the delegator,
delegatee is the account gets the delegation,
delegated_vest is the VESTS converted from SP (the amount)
and then we're sending console comment with the error/result
and update the message span.
And here we did, you have a working delegation tool!
just notice you're using correct numbers and names so you don't get errors!
full code - https://github.com/upmeboost-utopian/utopian-io-tutorials/tree/master/Steem%20Bots
Proof of Work Done
https://github.com/upmeboost-utopian
Thank you for your contribution @lonelywolf.
After reviewing your tutorial we suggest the following points listed below:
Your tutorial is quite short for a good tutorial. We recommend you aim for capturing at least 2-3 concepts.
In the next tutorial, be more careful with writing and improve the structure of the contribution.
It would be interesting to write the tutorial in more detail so that the reader can perfectly understand what he is teaching.
Looking forward to your upcoming tutorials.
Your contribution has been evaluated according to Utopian policies and guidelines, as well as a predefined set of questions pertaining to the category.
To view those questions and the relevant answers related to your post, click here.
Need help? Chat with us on Discord.
[utopian-moderator]
Thank you for your review, @portugalcoin! Keep up the good work!
Hey, @lonelywolf!
Thanks for contributing on Utopian.
We’re already looking forward to your next contribution!
Get higher incentives and support Utopian.io!
Simply set @utopian.pay as a 5% (or higher) payout beneficiary on your contribution post (via SteemPlus or Steeditor).
Want to chat? Join us on Discord https://discord.gg/h52nFrV.
Vote for Utopian Witness!