Repository
https://github.com/firedreamgames/steemit_followers
About Steemit Followers
I was asked by @moeknows in the discord if there is a tool to see the users followers in detail.
There are tools to show followers, to see dead followers but there was no tool to show users active followers status in detail.
Followers are a very important part of Steemit. I remember @SirCork told me once in his open-mic:
It is not important what you write, but it is more important who you know for success in Steemit.
Steemit followers is a single web page tool where you can list and sort all your followers according to their
- Steem Power
- Creation date
- Last post time
- Last vote time
Operating Manual
- Go to the url : https://fdsteemtools.neocities.org/steemit_followers.html
- Enter your Steemit user-name in the text area and press START button
- You will initially see your followers in alphabetical order, as Steemit shows.
- You can sort the list according to given parameters.
The button with "^ " sorts the list in ascending order ( smaller first ) and the button with arrow "v" sorts the list in descending order ( biggest first )
For example pushing the "v" indicated button near user SP will sort the list with the followers with highest SP first.
- The same kind of sorting can be performed on other parameters to see the activity status of your followers.
Technology
Steemit Followers uses JavaScript, HTML , CSS and JQuery with SteemJS API
Inside the JavaScript Code
The full code can be forked from GitHub
Most important functions are:
- Getting global values from Steem
steem.api.getDynamicGlobalProperties(function(err, result) { // Get global data from Steem
console.log(err, result);
vesting_steem = parseFloat(result.total_vesting_fund_steem); // get vesting fund steem
vesting_shares = parseFloat(result.total_vesting_shares); // get vesting shares
spr = vesting_steem / vesting_shares; // calculate steem per vest to calculate SP of user
});
This function calculates the SPR value which will be used to calculate the Steem Power of the follower.
- Calculating the quantity of followers
function search(the_user) {
steem.api.getFollowCount(the_user, function(err, result) { //get the quantity of followers from Steem
var qty = result.follower_count;
get_followers(qty); //send the qunatity to GET_FOLLOWERS function
});
}
- Get the first 1000 followers list
function get_followers(qty) {
steem.api.getFollowers(the_user,
'',
'blog',
1000,
function(err, result) {
console.log(result);
followers = followers.concat(result); //get the first 1000 followers and assign it followers array
if (qty > 1000) {
get_rest(followers, qty); // if follower quantity is greater than 1000, send resuly to GET_REST function to calculate more
} else {
get_follower_data(followers); // if less than 1000 send result to GET_FOLLOWER_DATA function to get data
}
});
}
- Get the rest of the followers if follower quantity >1000 followers
function get_rest(followers, qty) {
var i = parseInt(qty / 1000); // calculate 1000's lot of followers
var start_follower = followers[count * 1000 - 1].follower; // get the start of search for rest of followers
steem.api.getFollowers(the_user,
start_follower,
'blog',
1000,
function(err, result) {
//console.log(result);
followers = followers.concat(result); //get the rest of followers
//console.log(followers);
if (count < i) {
count++;
get_rest(followers, qty);
} else {
console.log(followers);
get_follower_data(followers);
}
});
//console.log(followers);
}
function get_follower_data(followers) {
var follow = [];
for (let i = 0; i < followers.length; i++) {
follow.push(followers[i].follower);
}
steem.api.lookupAccountNames(follow, function(err, result) { // steemjs API to find the data for each individual follower
follower_array(result); // put the result to follower array
});
}
- Form the array of objects wit all the data of followers. This array is formed with the necessary parameters for ease of sort function.
function follower_array(result) {
var user_data = [];
for (let i = 0; i < result.length; i++) {
var steem = (parseFloat(result[i].vesting_shares) + parseFloat(result[i].received_vesting_shares) - parseFloat(result[i].delegated_vesting_shares)) * spr;
// form array of objects to be used in soering function
user_data[i] = {
"name": result[i].name,
"shares": steem.toFixed(0),
"post_time": result[i].last_post,
"vote_time": result[i].last_vote_time,
"created": result[i].created
};
}
write_div(user_data); //send the calculated data to WRITE_DIV for DOM display.
}
- Function to display all the calculated results. Here JQuery is used because append() function performs much better than "innerHTML+=" function.
Especially for users above 5000 followers, innerHTML DOM manipulation crashes.
function write_div(user_data) {
var key;
// Clear screen
document.getElementById("user").innerHTML = "";
document.getElementById("sp").innerHTML = "";
document.getElementById("created").innerHTML = "";
document.getElementById("post").innerHTML = "";
document.getElementById("voted").innerHTML = "";
var timenow = utc_Now(); //calculate current time as UTC
for (let i = 0; i < user_data.length; i++) {
var str = "https://steemit.com/@" + user_data[i].name;
var lin = user_data[i].name;
$("#user").append(lin.link(str) + "<br />"); // write usernames
$("#sp").append(user_data[i].shares + " Steem" + "<br />"); //write user SP
var crea_time = Date.parse(user_data[i].created);
var diff = timenow - crea_time;
var diffdate = parseFloat(diff / (24 * 3600 * 1000));
$("#created").append(diffdate.toFixed(0) + " Days Old" + "<br />"); // write account creation date
var pst_time = Date.parse(user_data[i].post_time);
var difpost = timenow - pst_time;
var difhour = parseFloat(difpost / (3600 * 1000));
if (difhour > 40000) {
$("#post").append("User never posted!" + "<br />"); //write last post time
} else {
$("#post").append(difhour.toFixed(2) + " Hours Ago" + "<br />");
}
var vt_time = Date.parse(user_data[i].vote_time);
var difvt = timenow - vt_time;
var difvthour = parseFloat(difvt / (3600 * 1000));
if (difvthour > 40000) {
$("#voted").append("User never voted!" + "<br />"); //write last vote time
} else {
$("#voted").append(difvthour.toFixed(2) + " Hours Ago" + "<br />");
}
}
// EVENT LISTENERS FOR SORTING
document.getElementById("buttondowndiv_1").addEventListener("click", function() {
key = 1;
sort_data(user_data, key);
write_div(user_data);
});
document.getElementById("buttonupdiv_1").addEventListener("click", function() {
key = 2;
sort_data(user_data, key);
write_div(user_data);
});
document.getElementById("buttondowndiv_2").addEventListener("click", function() {
key = 3;
sort_data(user_data, key);
write_div(user_data);
});
document.getElementById("buttonupdiv_2").addEventListener("click", function() {
key = 4;
sort_data(user_data, key);
write_div(user_data);
});
document.getElementById("buttondowndiv_3").addEventListener("click", function() {
key = 5;
sort_data(user_data, key);
write_div(user_data);
});
document.getElementById("buttonupdiv_3").addEventListener("click", function() {
key = 6;
sort_data(user_data, key);
write_div(user_data);
});
document.getElementById("buttondowndiv_4").addEventListener("click", function() {
key = 7;
sort_data(user_data, key);
write_div(user_data);
});
document.getElementById("buttonupdiv_4").addEventListener("click", function() {
key = 8;
sort_data(user_data, key);
write_div(user_data);
});
document.getElementById('spinner').style.display = "none";
}
- Side function for calculating current time in UTC. This is important to find the exact age of the posts, comments and user age since the time received from Steem is in UTC.
function utc_Now() { // Function for calculating current timestamp in UTC
var now = new Date;
var utc_now = now.getTime() + now.getTimezoneOffset() * 60000; //convert now to UTC since post date is in UTC
return (utc_now)
}
- Sorting function according to the selected buttons. It can be ascending or descending. The keys are sent from the event listener.
function sort_data(user_data, key) { //Sorting function
user_data.sort(function(a, b) {
if (key == 1) {
return parseFloat(b.shares) - parseFloat(a.shares);
}
if (key == 2) {
return parseFloat(a.shares) - parseFloat(b.shares);
}
if (key == 3) {
return Date.parse(a.created) - Date.parse(b.created);
}
if (key == 4) {
return Date.parse(b.created) - Date.parse(a.created);
}
if (key == 5) {
return Date.parse(a.post_time) - Date.parse(b.post_time);
}
if (key == 6) {
return Date.parse(b.post_time) - Date.parse(a.post_time);
}
if (key == 7) {
return Date.parse(a.vote_time) - Date.parse(b.vote_time);
}
if (key == 8) {
return Date.parse(b.vote_time) - Date.parse(a.vote_time);
}
});
}
Connect
@FireDream - Steemit
@firedream#3528 - Discord
Links
Steemit Followers Tool
GitHub for Steemit Followers
Proof of Work
I love the simplicity in your coding. Perfect for newbie!
Thank you Vish, I try to keep it as self-explaining as possible.
FD.
Thanks for the contribution!
It's a cool little site, albeit not very unique, but still pretty useful. Do you have any plans to add features?
Some feedback for future contributions:
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? Write a ticket on https://support.utopian.io/.
Chat with us on Discord.
[utopian-moderator]
@amosbastian, thank you for your comments.
This tiny website is a collection of my FDSteemTools page where I collect all my tiny homemade gadgets for Steemit.
So, as I make more of them I will ad them to the index.
I know, I suck at Git...I will improve it. Can you address me a good example to benchmark?
This is noted.
As an amateur, I made my first sorting with for loop...It took me some time to learn to sort the arrays this simple way. I thought this could help someone. But I agree, it is not a tutorial.
Thank you again for your time and valuable feed-back.
FD.
Hey @firedream
Thanks for contributing on Utopian.
We’re already looking forward to your next contribution!
Contributing on Utopian
Learn how to contribute on our website or by watching this tutorial on Youtube.
Want to chat? Join us on Discord https://discord.gg/h52nFrV.
Vote for Utopian Witness!
Thank you @utopian-io.
@firedream
Really good knowledge about steemit and also good coding power show in it....i appreacite by u dear good man.