How to build your first game on TomoChain with Cocos Creator?

In this guide we will be covering:

• What is TomoChain and Cocos Creator?
• Build your first game using Cocos Creator.
• Write and migrate your smart contract to TomoChain Network.
• Interact between Cocos Creator game and smart contract using web3.js
• Testing your game on browsers with MetaMask.

TomoChain is an innovative solution to the scalability problem with the Ethereum blockchain, and other blockchain platforms. TomoChain POSV masternode architecture offers near-zero transaction fee and instant transaction confirmation. Security, stability and chain finality are guaranteed via novel techniques such as double validation and uniform randomization.

TomoChain supports all EVM-compatible smart-contracts, protocols, and atomic cross-chain token transfers. Scaling techniques such as sharding, EVM parallelisation, private-chain generation, hardware integration will be continuously researched and integrated into TomoChain which will become an ideal scalable smart-contract public blockchain for decentralized apps, token issuance and token integration for small and big businesses.

Cocos Creator is a complete package of game development tools and workflow, including a game engine (based on Cocos2d-x), resource management, scene editing, game preview, debug and publish one project to multiple platforms.

For the first time we introduced entity-component structure and data-driven workflow to the Cocos2d-x family. With JavaScript, you can scripting your component in no time. The editor and engine extension is also made with JavaScript so you can make games and refine your tool in a single programming language.

Cocos Creator provides an innovative, easy to use toolset such as the UI system and Animation editor. The toolset will be expanding continuously and quickly, thanks to the open editor extension system.

Homepage: https://cocos2d-x.org/creator
Docs:
https://docs.cocos2d-x.org/creator/manual/en/

• Install some programs:
  1. Cocos Creator v2.1.1 (
  Download)
  2. Visual Studio Code (
  Download)
• Thinking about your game play and design it on Photoshop
  For this tutorial, we will make a simple game called “
  Tomo Lucky Box”
  In this game, we will have 3 boxes to chose, if you choose lucky box you will get your prize.

I made a quick design for example game for this tutorial. ?

You will need a wallet address and some tokens. We will show you how to do it on both TomoChain Testnet and Mainnet.

1. Create a TOMO wallet and save your Mnemonic

You can create a new TOMO wallet using TomoWallet mobile app for Android or iOS. Under Settings go to Advanced Settings, here you can Choose network and select TomoChain TestNet or TomoChain [mainnet].

Go to Settings menu, select Backup wallet and then Continue. Here you can see your wallet’s private key and the 12-word recovery phrase. Write down the 12-word recovery phrase.

You can also create a new TomoChain wallet with MetaMask, MyEtherWallet or TrustWallet. For instance, for mainnet you can go to MyEtherWallet and select TOMO (tomochain.com) on the top right corner. Enter a password and then Create a new wallet. Write down your recovery phrase.

For this tutorial, my wallet address (testnet) is:

0xc9b694877acd4e2e100e095788a591249c38b9c5

My recovery phrase (12-word mnemonic) is:

myth ahead spin horn minute tag spirit please gospel infant clog camera

Write them down. This will be needed later. Notice that your wallet address (public key) and your recovery phrase will be different than mine.

Important! Always keep your private key and recovery phrase secret!

2. Get some TOMO funds

Tokens are required for different matters, like smart contract deployment or to use in DApps.

Testnet: Receive 15 free testnet TOMO tokens using TomoChain’s Faucet.

Mainnet: You need real TOMO tokens from exchanges.

Go to faucet and collect 30 TOMO. Now your wallet has enough balance to do everything in this tutorial so… let’s go ahead!

3. The Block Explorer

To check the balance of a wallet address, you can use TomoScan.

Testnet: https://scan.testnet.tomochain.com/

Mainnet: https://scan.tomochain.com/

• Create truffle project
  Open your Terminal. Then write some commands below:

mkdir tomoluckybox-smartcontract
cd tomoluckybox-smartcontract
truffle init

• Config networks for truffle project
  Open file truffle-config.js, and replace with below code to config TomoChain Mainnet and TomoChain Testnet.

"use strict";
var HDWalletProvider = require("truffle-hdwallet-provider");
var mnemonic = "
<PUT YOUR WALLET 12-WORD RECOVERY PHRASE HERE>";
module.exports = ,
tomotestnet: ,
tomomainnet: 
},
compilers: 
}
}
};

1. Create a new file named TomoLuckyBox.sol in the contracts/ directory.
2. Copy the following code:

pragma solidity ^0.5.0;contract TomoLuckyBox 
else 
}
//WARNING: THIS RANDOM FUNCTION IS NOT SECURITY, DON'T USE IT IN PRODUCTION MODE
//YOU CAN IMPLEMENT SECURE RANDOM  USE RANDAO OR COMMIT-REVEAL SCHEMA
function random() internal returns (uint) 
function sendPayment(address payable _receiverAddress, uint _amount) private 
}

• Compile your smart contract

truffle compile

• Migrate your smart contract to TomoChain Testnet

truffle migrate --network tomotestnet

web3.js is a collection of libraries which allow you to interact with a local or remote Ethereum node, using an HTTP, WebSocket or IPC connection.

The following documentation will guide you through installing and running web3.js, as well as providing a API reference documentation with examples.

For more details about web3.js, I recommended to read their documents.(Link)

• Add web3.js to project
  1. Download
  web3.js.min (Link)
  2. Drag & drop
  web3.js.min to folder assets/libs in our project (if have a dialog ask to add as plugin, remember click No)
• Add TomoLuckyBox.json to project
  Drag & drop TomoLuckyBox.json in truffle project folder build/(to folder assets in our project)