👾Game Dev

Technology Stack

Frontend:

• Technology Framework: Developed using Cocos to create the game interface and logic.

• Compatibility: Ensures compatibility with high-performance web-based games and the Telegram Mini App.

Backend:

• Technology Stack: Utilizes Node.js to provide RESTful APIs and WebSocket support.

• Blockchain Infrastructure: Integrates Alchemy as the blockchain node service provider, enhancing backend interactions with the blockchain through reliable and efficient connectivity.

Smart Contracts:

• Programming Languages: Solidity and FunC.

• Management Tools: Leverages Alchemy's tools for monitoring and managing smart contracts, ensuring their reliability and performance.

Database:

• Database Choices: Employs MongoDB or PostgreSQL for storing user and game data.

• Data Management: Ensures data security and consistency, supporting efficient data queries and operations.

Communication:

• User Authentication & Data Management:

  • Method: Handled via frontend REST APIs.

• Real-Time Communication:

  • Technology: Implemented through WebSocket (e.g., Socket.io) to support real-time interactions within the game.

• Smart Contract Interaction:

  • Tools: Managed using Web3.js in conjunction with Alchemy's APIs for interacting with smart contracts and querying blockchain data.

The code here only shows the architecture design, the actual code will be refined and optimized.

Cocos Creator Integration with Backend

Ⅰ. Design Backend Architecture

Use Node.js to set up the backend service, providing RESTful APIs and WebSocket support. Below is a backend architecture design:

• User Management: Wallet Registration, login, authentication.

• Game Data Management: Save and retrieve player scores, GEMS, etc.

• PVP Mode Management: Create rooms, join rooms, place PUMP bets, and distribute prize pools.

• Smart Contract Interaction: Handle player bets and prize pool distribution.

Ⅱ. Establish Node.js Backend

Node.js backend using Express and Socket.io:

Install Dependencies:

npm init -y
npm install express socket.io mongoose jsonwebtoken bcryptjs cors

Backend (server.js):

Code Example 01

const express = require('express');
const http = require('http');
const socketIo = require('socket.io');
const mongoose = require('mongoose');
const jwt = require('jsonwebtoken');
const bcrypt = require('bcryptjs');
const cors = require('cors');

// Initialize Express
const app = express();
const server = http.createServer(app);
const io = socketIo(server, {
  cors: {
    origin: "*",
    methods: ["GET", "POST"]
  }
});

// Middleware
app.use(express.json());
app.use(cors());

// Connect to MongoDB
mongoose.connect('mongodb://localhost:27017/ufo_pump', { useNewUrlParser: true, useUnifiedTopology: true })
  .then(() => console.log('MongoDB connected'))
  .catch(err => console.log(err));

// Define User Model
const UserSchema = new mongoose.Schema({
  username: String,
  password: String,
  gems: { type: Number, default: 0 }
});

const User = mongoose.model('User', UserSchema);

// User Registration Endpoint
app.post('/register', async (req, res) => {
  const { username, password } = req.body;
  const hashedPassword = await bcrypt.hash(password, 10);
  const user = new User({ username, password: hashedPassword });
  await user.save();
  res.json({ message: 'User registered' });
});

// User Login Endpoint
app.post('/login', async (req, res) => {
  const { username, password } = req.body;
  const user = await User.findOne({ username });
  if (!user) return res.status(400).json({ message: 'User not found' });
  const isMatch = await bcrypt.compare(password, user.password);
  if (!isMatch) return res.status(400).json({ message: 'Invalid credentials' });
  const token = jwt.sign({ id: user._id }, 'secretkey');
  res.json({ token });
});

// PVP Room Management
let rooms = {};

io.on('connection', (socket) => {
  console.log('New client connected');

  socket.on('createRoom', (data) => {
    const roomId = `room_${Date.now()}`;
    rooms[roomId] = {
      host: socket.id,
      players: [],
      startTime: Date.now(),
      prizePool: 0
    };
    socket.join(roomId);
    socket.emit('roomCreated', { roomId });
  });

  socket.on('joinRoom', (data) => {
    const { roomId, userId, betAmount } = data;
    if (rooms[roomId]) {
      rooms[roomId].players.push({ socketId: socket.id, userId, betAmount });
      rooms[roomId].prizePool += betAmount;
      socket.join(roomId);
      io.to(roomId).emit('playerJoined', { userId, betAmount });
      // Start game logic here (e.g., setTimeout for 5 minutes)
    }
  });

  socket.on('disconnect', () => {
    console.log('Client disconnected');
    // Handle player leaving rooms
  });
});

const PORT = process.env.PORT || 5000;
server.listen(PORT, () => console.log(`Server running on port ${PORT}`));

Ⅲ. Frontend Cocos Creator Integration

Use JavaScript in Cocos Creator to call backend APIs and handle WebSocket communication.

Code Example 02

// Ensure the Socket.io client library is added to the Cocos Creator project
// For example, place socket.io.js in the assets/scripts directory and import it in your script

import io from 'socket.io-client';

cc.Class({
    extends: cc.Component,

    properties: {
        usernameInput: cc.EditBox,
        passwordInput: cc.EditBox,
        loginButton: cc.Button,
        createRoomButton: cc.Button,
        joinRoomButton: cc.Button,
        // Other UI elements
    },

    onLoad () {
        this.socket = io('http://localhost:5000'); // Adjust based on backend address
        this.socket.on('connect', () => {
            console.log('Connected to server');
        });
        this.socket.on('roomCreated', (data) => {
            console.log('Room created:', data.roomId);
            // Update UI to display Room ID
        });
        this.socket.on('playerJoined', (data) => {
            console.log('Player joined:', data.userId, data.betAmount);
            // Update room information
        });
    },

    onLogin () {
        const username = this.usernameInput.string;
        const password = this.passwordInput.string;

        fetch('http://localhost:5000/login', {
            method: 'POST',
            headers: { 'Content-Type': 'application/json' },
            body: JSON.stringify({ username, password })
        })
        .then(res => res.json())
        .then(data => {
            if (data.token) {
                this.token = data.token;
                console.log('Logged in successfully');
            } else {
                console.log('Login failed');
            }
        });
    },

    onCreateRoom () {
        this.socket.emit('createRoom', {});
    },

    onJoinRoom () {
        const roomId = 'room_123456'; // Get Room ID from UI
        const userId = 'user_1'; // Get from login information
        const betAmount = 100; // Get from user input
        this.socket.emit('joinRoom', { roomId, userId, betAmount });
    },

    // Other methods
});

Ⅳ. Smart Contract Integration

Smart Contract Development:

Develop a smart contract using Solidity to handle betting and prize pool distribution:

Code Example 03 / Solidity

// SPDX-License-Identifier: MIT
pragma solidity ^0.8.0;

contract UFOPump {
    struct Room {
        address host;
        uint256 prizePool;
        uint256 startTime;
        bool isActive;
    }

    mapping(uint256 => Room) public rooms;
    uint256 public roomCount;

    event RoomCreated(uint256 roomId, address host);
    event BetPlaced(uint256 roomId, address player, uint256 amount);
    event PrizeDistributed(uint256 roomId, address winner, uint256 amount);

    function createRoom() public {
        roomCount++;
        rooms[roomCount] = Room({
            host: msg.sender,
            prizePool: 0,
            startTime: block.timestamp,
            isActive: true
        });
        emit RoomCreated(roomCount, msg.sender);
    }

    function placeBet(uint256 roomId) public payable {
        require(rooms[roomId].isActive, "Room is not active");
        require(msg.value > 0, "Bet amount must be greater than 0");
        rooms[roomId].prizePool += msg.value;
        emit BetPlaced(roomId, msg.sender, msg.value);
    }

    function distributePrize(uint256 roomId, address winner) public {
        require(rooms[roomId].isActive, "Room is not active");
        require(msg.sender == rooms[roomId].host, "Only host can distribute prize");
        uint256 prize = rooms[roomId].prizePool;
        rooms[roomId].isActive = false;
        payable(winner).transfer(prize);
        emit PrizeDistributed(roomId, winner, prize);
    }
}

Ⅴ.Deploy the Contract:

Use Hardhat to deploy the smart contract to the blockchain (e.g., Ethereum).

Deployment with Hardhat:

1. Initialize Hardhat Project:

   npx hardhat

2. Configure hardhat.config.js:

   require("@nomiclabs/hardhat-waffle");
   
   module.exports = {
     solidity: "0.8.0",
     networks: {
       rinkeby: {
         url: "https://rinkeby.infura.io/v3/YOUR_INFURA_PROJECT_ID",
         accounts: [`0x${YOUR_PRIVATE_KEY}`]
       }
     }
   };

3. Deployment Script (scripts/deploy.js):

   async function main() {
     const UFOPump = await ethers.getContractFactory("UFOPump");
     const ufoPump = await UFOPump.deploy();
     await ufoPump.deployed();
     console.log("UFOPump deployed to:", ufoPump.address);
   }
   
   main()
     .then(() => process.exit(0))
     .catch(error => {
       console.error(error);
       process.exit(1);
     });

4. Deploy the Contract:

   npx hardhat run scripts/deploy.js --network rinkeby

Ⅵ.Frontend Integration:

Use Web3.js in Cocos Creator to interact with the smart contract.

Install Web3.js:

npm install web3

Integration:

Code Example 04

import Web3 from 'web3';

cc.Class({
    extends: cc.Component,

    properties: {
        // UI elements
    },

    onLoad () {
        // Initialize Web3
        if (window.ethereum) {
            this.web3 = new Web3(window.ethereum);
            window.ethereum.enable().catch(error => {
                console.error("User denied account access");
            });
        } else {
            console.log('Non-Ethereum browser detected. You should consider trying MetaMask!');
        }

        // Contract address and ABI
        this.contractAddress = '0xYourContractAddress';
        this.contractABI = [ /* ABI JSON */ ];

        // Initialize contract
        this.contract = new this.web3.eth.Contract(this.contractABI, this.contractAddress);
    },

    createRoom () {
        const account = this.web3.currentProvider.selectedAddress;
        this.contract.methods.createRoom().send({ from: account })
            .on('receipt', (receipt) => {
                console.log('Room created:', receipt.events.RoomCreated.returnValues.roomId);
            })
            .on('error', (error) => {
                console.error(error);
            });
    },

    placeBet (roomId, amount) {
        const account = this.web3.currentProvider.selectedAddress;
        this.contract.methods.placeBet(roomId).send({ from: account, value: this.web3.utils.toWei(amount, 'ether') })
            .on('receipt', (receipt) => {
                console.log('Bet placed:', receipt.events.BetPlaced.returnValues);
            })
            .on('error', (error) => {
                console.error(error);
            });
    },

    distributePrize (roomId, winnerAddress) {
        const account = this.web3.currentProvider.selectedAddress;
        this.contract.methods.distributePrize(roomId, winnerAddress).send({ from: account })
            .on('receipt', (receipt) => {
                console.log('Prize distributed:', receipt.events.PrizeDistributed.returnValues);
            })
            .on('error', (error) => {
                console.error(error);
            });
    },
});