In my last post, I declared a challenge to create an app that uses data about crypto prices by 20 Feb 2022.
Unfortunately, many things distracted me at work, and news of the war in Ukraine then followed, I was unable to focus on this task till today (5 March 2022).
End Product
The image below shows the end product, which I can use to determine the amount of profit or loss in my BTC trade based on my entry price.
Say, if I had bought $1000 worth of BTC at $30,000, based on the current price of $39,237, selling my original 0.03 BTC will yield me $307.9.
This can be a handy tool for calculating the extent of profit or loss.
HTML File
Line 15 and Line 20 are the lines responsible for the text boxes, with the respective ids defined.
Line 23 is the important code that activates the "checkFunction" function.
Line 27 to 29 are locations where the three outputs will be displayed, with the respective ids defined.
Javascript
This is probably not the most elegant way to write these codes, but I am just glad that it works for a start!
This is basically a big function called checkFunction(), starting from line 1.
Line 2 and 3 defines the variables bought_price and amount_invested through document.getElementById, accessing the values in the two text boxes.
Line 4 to 10 is the p_l_calc() function which calculates profit and loss. Specifically, line 5 calculates how many BTC are owned based on the amount invested and bought price. Line 6 calculates the current worth of the BTC owned based on the current price. Line 7 derives the profit and loss value.
Line 8 and 9 writes the Quantity and Current Price at the innerHTML of the 'qty' and 'cp' elements.
Line 11 loads the loadDoc( ) function, which is defined in the remaining lines.
The loadDoc( ) is a pretty standard function for making API calls, relying on XMLHttpRequest.
Basically, only line 16 to 20, and line 23 are customised for the present use case, the rest of the lines in this loadDoc( ) function is the generic part that facilitates the API call. i.e., these can be reused for other cases.
Line 16 uses JSON.parse to make the JSON response derived through this.responseText readable.
Line 17 extracts the current price cleanly.
Line 18 executes the p_l_calc() defined earlier.
Line 19 to 20 prints the Profit/Loss results on the 'pl' element.
Line 23 is where the API address for getting the BTC price in USD is entered, i.e. https://api.coingecko.com/api/v3/simple/price?ids=bitcoin&vs_currencies=usd.
Done
I named these files as index.html and index.js, and placed the latter in a folder called js.
Challenge Declared
For my next challenge, I shall try to see if I can make something useful based on a comparison of different crypto prices! Let 13 March 2022 be the deadline for me to complete that.
Hopefully, the situation in Ukraine improves by then.
If you like to support me, please upvote this and repost this.
I also welcome comments.