GET LIVE BITCOIN PRICE V2

In this Version 2 tutorial we will learn how to get the Bitcoin price from the internet using the TTGO ESP32 and Visuino, we will also learn how to add a SSL certificate to the ESP32 board.

In this tutorial we are going to use Bitstamp API access, In the first original tutorial we were using a Coindesk API.
Link to the first tutorial here

Watch the Video!

Step 1: What You Will Need

• TTGO ESP32
• WiFi connection
• Visuino program: Download Visuino

Step 2: Start Visuino, and Select the Arduino TTGO T-Display ESP32 Board Type

The Visuino: https://www.visuino.eu also needs to be installed. Download Free version or register for a Free Trial.

Start Visuino as shown in the first picture Click on the “Tools” button on the Arduino component (Picture 1) in Visuino When the dialog appears, select “TTGO T-Display ESP32” as shown on Picture 2

Step 3: Get Server SSL Certificate for Your ESP

• Go to https://projects.petrucci.ch/esp32/?page=ssl and paste the https://www.bitstamp.net in the Edit box and click “Get Certificate” button (Picture1)
• Click on the “DigiCert SHA2 Extended Validation Server CA” Image (Picture2)
• (Picture 3) In the Table below “cert:” select the certificate field and copy it to the Clipboard (you will need it in the next step)

Step 4: In Visuino Set WiFi

• Select TTGO T-Display ESP32 board and in the properties window expand “Modules>WiFi>Connect To Access Points
• Click on the Connect To Access Points 3 Dots
• In the AccessPoints window drag “WiFi Access Point” to the left side
• In the properties window set SSID (name of your WiFi hotspot or router)
• In the properties window set Password (password of your WiFi hotspot or router)
• Close AccessPoints window
• Select TTGO T-Display ESP32 board and in the properties window expand “Modules>WiFi>Sockets
• Click on the Sockets 3 Dots
• In the “Sockets window” drag TCP/IP Secure Client (SSL) to the left
• In the properties window set Host to: www.bitstamp.net
• select “CACert” and click on the 3 dots button and in the “CACert window” paste the Certificate that you got in the previous step
• Close the “Sockets window”

Step 5: In Visuino Set Display

• Select TTGO T-Display ESP32 board and in the properties window expand “Modules>Display>Orientation“
• Set Orientation to:goRight

Select TTGO T-Display ESP32 board and in the properties window expand “Modules>Display>Elements” Click on the Elements 3 Dots

• In the Elements window Drag “Draw Text” to the left and in the properties window set size to 2 and text to ASK.
• In the Elements window Drag “Text Field” to the left and in the properties window set size to 3, color to “aclGold” and Y to 20.

• In the Elements window Drag another “Draw Text” to the left and in the properties window set size to 2 ,text to BID and Y to 48.
• In the Elements window Drag another “Text Field” to the left and in the properties window set size to 3, color to “aclGold” and Y to 66.
• In the Elements window Drag another “Draw Text” to the left and in the properties window set size to 2 ,text to LAST and Y to 92.
• In the Elements window Drag another “Text Field” to the left and in the properties window set size to 3, color to “aclGold” and Y to 110.

• Optionally you can add bitmap to the Display, to do that in the Elements window drag “Draw Bitmap” to the left side and in the properties window set X to 160, Y to 30
• Click on the Bitmap 3 Dots
•  In the Bitmap Editor Load the Bitcoin bitmap (picture 1) and close the Bitmap editor
• You can find other bitmaps at https://iconarchive.com/search?q=bitcoin

Step 6: In Visuino Add Components

• Add “HTTP Client” component
• Select “HTTPClient1” and in the properties window set Host to www.bitstamp.net
• Click on the Requests 3 Dots
• In the “Requests window” drag “GET” to the left side
• In the properties window set URL to: /api/v2/ticker/btcusd/
• Close the requests window
• Add “Char To Text” component
• Select “CharToText1” and in the properties window se Max Length to 2000
• Add “Clock Generator” component
• Select “ClockGenerator1” and in the properties window set frequency to 0.2, this will be the refresh time, you can adjust it if you want.
• Add “Delay” components and in the properties window set “Interval (uS)” to 2000000
• Add “Split JSON Object” component

Step 7: In Visuino Parsing JSON

• With the mouse right click on the “SplitJSON1” and in the menu click on the “Parse JSON Object..“

In the “JSON Object” window paste this sample code(avalible on https://www.bitstamp.net/api/v2/ticker/btcusd/ )

 

Or copy paste the following:

{“high”: “61517.51”, “last”: “59946.59”, “timestamp”: “1635092369”, “bid”: “59913.89”, “vwap”: “60635.81”, “volume”: “1111.78956785”, “low”: “59510.00”, “ask”: “59930.59”, “open”: “61306.64”}

 

• Close the “JSON Object” window
• “SplitJSON1” component will now create new pins

Step 8: In Visuino Connecting Components

• Connect “ClockGenerator1” pin Out to “HTTPClient1” pin Clock
• Connect “TTGO T-Display ESP32” pin [Connected] to “Delay1” pin Start
• Connect “TTGO T-Display ESP32” pin [Remote Connected] to “HTTPClient1” pin Clock
• Connect “HTTPClient1” pin Content to “CharToText1” pin In
• Connect “HTTPClient1” pin to TTGO T-Display ESP32 > WiFi>TCP Secure Client1 pin In
• Connect “Delay1” pin Out to “CharToText1” pin Clock and TTGO T-Display ESP32 > WiFi>TCP Secure Client1 pin Disconnect
• Connect “CharToText1” pin Out to “SplitJSON1” pin In
• Connect “SplitJSON1” pin [Ask] to TTGO T-Display ESP32 >Display Text Field1 pin[In]

 

• Connect “SplitJSON1” pin [Bid] to TTGO T-Display ESP32 >Display Text Field2 pin[In]
• Connect “SplitJSON1” pin [Last] to TTGO T-Display ESP32 >Display Text Field3 pin[In]
• Note: you can also play with the other pins from “SplitJSON1” component

Step 9: Generate, Compile, and Upload the Code

In Visuino, at the bottom click on the “Build” Tab, make sure the correct port is selected, then click on the “Compile/Build and Upload” button.

Step 10: Play