DEV Community

Cover image for Integrate Godot and Moralis for NFT Games
hideckies
hideckies

Posted on • Originally published at blog.hdks.org

Integrate Godot and Moralis for NFT Games

Recently, I found the ChainSafe Gaming SDK for Unity.

It's amazing for creating Dapps or NFT games.

However, I personally like Godot not Unity - I think that there are pros and cons, but at least for 2D games, my personal preference - so I decided to integrate Godot and Moralis (an awesome platform for Dapps or NFT Games).

This article is for HTML5 Games Only by the way.

And a detailed explanation of Godot and Moralis is differenct from the main point of here so I'll omit it. If you're curious, please see the official website.

0. Requirements

1. Create a new project on Godot

Open the Godot, create a new project. For HTML5 game, recommended the OpenGL ES 2.0.

screenshot_1

Next, create a new scene and add a new Button and Label, then save it.

In addition, enter "Login" to the text field in the Button and "Sample text." to the Label.

screenshot_2

Then, Assign a new script to the Scene and add pressed() signal in the Button.

screenshot_3

2. Import the Moralis SDK on Godot

In Godot, go to the Project -> Export... -> Add... -> HTML5.

Add the following code to the "Head Include".

<script src="https://cdn.jsdelivr.net/npm/web3@latest/dist/web3.min.js"></script>
<script src="https://unpkg.com/moralis/dist/moralis.js"></script>
Enter fullscreen mode Exit fullscreen mode

screenshot_4

3. Implement the Moralis Auth in script

Assign a new script file to the Scene and write code.

The whole code is below.

Sample.gd

extends Node2D

# Moralis Server settings
export (String) var server_url = ""
export (String) var app_id = ""

# Signals emitting logged-in and logged-out for the Moralis
signal logged_in(user)
signal logged_out

# Moralis object
var moralis = JavaScript.get_interface("Moralis")
# Authenticated User
var current_user = null

# Callbacks
var _callback_login = JavaScript.create_callback(self, "_on_logged_in")
var _callback_logout = JavaScript.create_callback(self, "_on_logged_out")


func _ready():
    if OS.has_feature("JavaScript") and !current_user:
        # Initialize the Moralis SDK
        var options = JavaScript.create_object("Object")
        options.serverUrl = server_url
        options.appId = app_id

        moralis.start(options)


func login():
    # Check if user already logged in
    current_user = moralis.User.current()

    if !current_user:
        moralis.authenticate().then(_callback_login)


func logout():
    moralis.User.logOut().then(_callback_logout)


func _on_logged_in(args):
    current_user = args[0]

    $Button.text = "Logout"
    $Label.text = "Logged in!\nETH Address: " + args[0].get("ethAddress")


func _on_logged_out(args):
    current_user = null

    $Button.text = "Login"
    $Label.text = "Logged out."


func _on_Button_pressed():
    if current_user:
        logout()
    else:
        login()
Enter fullscreen mode Exit fullscreen mode

**The above code uses JavaScript, so it will not work in an environment where JavaScript cannot be used (e.g. iOS, Android, etc).*

After that, set the values of the Server Url and App Id of your Moralis Server in the Scene.

screenshot_5

You can see the above values in the Moralis Server Details. If you can't see, you need to create the Moralis account and server.

screenshot_6

4. Export

Click the Project -> Export... -> Export Project.

Create a new folder named "html5" in the project folder. And the file name should be "index.html".

Then uncheck "Export With Debug".

screenshot_7

By the way, set the current scene to the main scene in the project settings as follows:

screenshot_8

5. Debug

Finally, we can run this awesome game which only authenticate the Moralis.
Open the terminal and enter the followings:

cd <GODOT-PROJECT-FOLDER>/html5

python -m http.server 8000
Enter fullscreen mode Exit fullscreen mode

On your favirote browser, enter "localhost:8000" in the URL bar.

Then you should see the login screen.

screenshot_9

When you click the "Login" button, the MetaMask popup will open to login.
If you logged in successfully, the sample text will change to your eth address. And the button's text will change to "Logout".

6. Conclusion

This time, I explained about the Moralis authentication only.

If possible, I would like to make a Godot Moralis Addon.

But before that, the intelligent Moralis Team may make it.

Top comments (5)

Collapse
 
iogamesus profile image
IOGamesUS

Hey, this is an awesome tutorial and I appreciate it! Have you gotten other functions to work? I'm not sure how to work with other functions such as "moralis.Web3API.account.getNativeBalance()" in Godot using the JavaScript go between and would love another tutorial on more functions. Thanks again!

Collapse
 
hideckies profile image
hideckies

Hi, thanks!

If you want to get balance using getNativeBalance, you can write as follows:

var _callback_executed = JavaScript.create_callback(self, "_on_executed")

func getNativeBalance():
    moralis.Web3API.account.getNativeBalance().then(_callback_executed)

func _on_executed(args):
    print(args[0].balance)
Enter fullscreen mode Exit fullscreen mode

Implementing async-await with Godot can be quite hassle, but we should probably be able to implement most of Moralis functions.

By the way, currently I'm developing Godot Moralis Plugin. When it's done, I'm going to add the repo in this article.

Collapse
 
iogamesus profile image
IOGamesUS

Awesome, thank you. I'm making everything work through the browser since I assumed you had to in order to connect your Metamask, so I got it to work printing in the console using:

var obj = JavaScript.get_interface("Object")
$Panel/CenterContainer/HBoxContainer/Balance.text = "Current balance: " + obj.values(args[0])[0]
Enter fullscreen mode Exit fullscreen mode

...but I probably could've done args[0].balance like your code and been a little cleaner.

Perhaps you've tested the getNFTs function before as well? I can't seem to get anything in the response, despite having NFTs on the address I'm checking.

Looking forward to seeing that Plugin. Please do update when you're ready for other eyes on it! I'd love to help.

Thread Thread
 
hideckies profile image
hideckies

I've not tested getNFTs yet, so I don't know but I'll try it sometime.

Yeah it may take some time, but I will do it;>

Thread Thread
 
wterich4 profile image
Wüterich

Hey, did u get it to work?