Text Adventure Game Engine with MERN Stack

const express = require('express');
const mongoose = require('mongoose');
const cors = require('cors');

const app = express();
const PORT = process.env.PORT || 5000;

// Connect to MongoDB using Mongoose
mongoose.connect('mongodb+srv://shreya:[email protected]/game',
    { useNewUrlParser: true, useUnifiedTopology: true })
    .then(() => console.log('Connected to MongoDB'))
    .catch(err => console.error('Failed to connect to MongoDB', err));

// Define Mongoose schema for game options
const optionSchema = new mongoose.Schema({
    text: String,
    requiredState: {
        type: Object,
        default: null
    },
    setState: {
        type: Object,
        default: null
    },
    nextText: Number
});

// Define Mongoose schema for game text nodes
const textNodeSchema = new mongoose.Schema({
    id: {
        type: Number,
        required: true,
        unique: true
    },
    text: {
        type: String,
        required: true
    },
    options: {
        type: [optionSchema],
        required: true
    }
});

// Create a Mongoose model for text nodes
const TextNode = mongoose.model('TextNode', textNodeSchema);

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

const textNodesData = [
    {
        "id": 1,
        "text": `You wake up in a strange place and 
      you see a jar of blue rice near you.`,
        "options": [
            {
                "text": "Take the rice",
                "setState": { "blueRice": true },
                "nextText": 2
            },
            {
                "text": "Leave the rice",
                "nextText": 2
            }
        ]
    },
    {
        "id": 2,
        "text": `You venture forth in search of answers to
       where you are when you come across a merchant.`,
        "options": [
            {
                "text": "Trade the rice for a sword",
                "requiredState": "(currentState) => currentState.blueRice",
                "setState": { "blueRice": false, "sword": true },
                "nextText": 3
            },
            {
                "text": "Trade the rice for a shield",
                "requiredState": "(currentState) => currentState.blueRice",
                "setState": { "blueRice": false, "shield": true },
                "nextText": 3
            },
            {
                "text": "Ignore the merchant",
                "nextText": 3
            }
        ]
    },
    {
        "id": 3,
        "text": `After leaving the merchant you start to feel 
      tired and stumble upon a small town next to a
       dangerous looking castle.`,
        "options": [
            {
                "text": "Explore the castle",
                "nextText": 4
            },
            {
                "text": "Find a room to sleep at in the town",
                "nextText": 5
            },
            {
                "text": "Find some hay in a stable to sleep in",
                "nextText": 6
            }
        ]
    },
    {
        "id": 4,
        "text": `You are so tired that you fall asleep while 
      exploring the castle and are killed by some terrible
       monster in your sleep.`,
        "options": [
            {
                "text": "Restart",
                "nextText": -1
            }
        ]
    },
    {
        "id": 5,
        "text": `Without any money to buy a room you break
       into the nearest inn and fall asleep. After a few
        hours of sleep the owner of the inn finds you and
         has the town guard lock you in a cell.`,
        "options": [
            {
                "text": "Restart",
                "nextText": -1
            }
        ]
    },
    {
        "id": 6,
        "text": `You wake up well rested and full of 
      energy ready to explore the nearby castle.`,
        "options": [
            {
                "text": "Explore the castle",
                "nextText": 7
            }
        ]
    },
    {
        "id": 7,
        "text": `While exploring the castle you come
       across a horrible monster in your path.`,
        "options": [
            {
                "text": "Try to run",
                "nextText": 8
            },
            {
                "text": "Attack it with your sword",
                "requiredState": "(currentState) => currentState.sword",
                "nextText": 9
            },
            {
                "text": "Hide behind your shield",
                "requiredState": "(currentState) => currentState.shield",
                "nextText": 10
            },
            {
                "text": "Throw the blue rice at it",
                "requiredState": "(currentState) => currentState.blueRice",
                "nextText": 11
            }
        ]
    },
    {
        "id": 8,
        "text": "Your attempts to run are in vain and the monster easily catches.",
        "options": [
            {
                "text": "Restart",
                "nextText": -1
            }
        ]
    },
    {
        "id": 9,
        "text": `You foolishly thought this monster 
        could be slain with a single sword.`,
        "options": [
            {
                "text": "Restart",
                "nextText": -1
            }
        ]
    },
    {
        "id": 10,
        "text": "The monster laughed as you hid behind your shield and ate you.",
        "options": [
            {
                "text": "Restart",
                "nextText": -1
            }
        ]
    },
    {
        "id": 11,
        "text": `You threw your jar of rice at the monster and it exploded.
       After the dust settled you saw the monster was destroyed.
        Seeing your victory you decide to claim this castle as
         your and live out the rest of your days there.`,
        "options": [
            {
                "text": "Congratulations. Play Again.",
                "nextText": -1
            }
        ]
    }
]
    ;

// Insert each text node into the database
TextNode.insertMany(textNodesData)
    .then(() => {
        console.log('Text nodes inserted successfully');
    })
    .catch((error) => {
        console.error('Error inserting text nodes:', error);
    });

// Routes
app.get('/', (req, res) => {
    res.send('Welcome to the text adventure game API');
});

// Example route to fetch all text nodes
app.get('/api/textNodes', async (req, res) => {
    try {
        const textNodes = await TextNode.find();
        res.json(textNodes);
    } catch (err) {
        console.error('Error fetching text nodes:', err);
        res.status(500).json({ message: 'Internal Server Error' });
    }
});

// Start server
app.listen(PORT, () => {
    console.log(`Server running on port ${PORT}`);
});

//App.js
import React, { useState, useEffect } from 'react';
import axios from 'axios';
import Navbar from './Navbar.js';
import './App.css';
function App() {
    const [currentTextNode, setCurrentTextNode] = useState(null);
    const [state, setState] = useState({});
    const [textNodes, setTextNodes] = useState([]);

    useEffect(() => {
        axios.get('http://localhost:5000/api/textNodes')
            .then(response => {
                const textNodesData = response.data;
                setTextNodes(textNodesData);
                startGame(textNodesData);
            })
            .catch(error => {
                console.error('Error fetching text nodes:', error);
            });
    }, []);

    const startGame = (textNodes) => {
        const initialTextNode = textNodes.find(node => node.id === 1);
        setCurrentTextNode(initialTextNode);
        setState({});
    };

    const selectOption = (option) => {
        const nextTextNodeId = option.nextText;
        if (nextTextNodeId === -1) {
            startGame(textNodes); // Restart the game
        } else {
            const nextTextNode = textNodes.find(node => node.id === nextTextNodeId);
            if (nextTextNode) {
                setCurrentTextNode(nextTextNode);
                setState({ ...state, ...option.setState });
            } else {
                console.error('Next text node not found:', nextTextNodeId);
            }
        }
    };

    if (!currentTextNode) {
        return <div>Loading...</div>;
    }

    return (
        <div className="container">
            <Navbar />
            <div id="text">{currentTextNode.text}</div>
            <div id="option-buttons" className="btn-grid">
                {currentTextNode.options.map(option => (
                    <button
                        key={option.text}
                        className="btn"
                        onClick={() => selectOption(option)}
                    >
                        {option.text}
                    </button>
                ))}
            </div>
        </div>
    );
}

export default App;

//index.js
import React from 'react';
import ReactDOM from 'react-dom/client';
import App from './App';


const root = ReactDOM.createRoot(document.getElementById('root'));
root.render(
    <React.StrictMode>
        <App />
    </React.StrictMode>
);

// Navbar.js
import React from 'react';

function Navbar() {
    return (
        <nav className="navbar">
            <div className="container">
                <img src="https://media.geeksforgeeks.org/gfg-gg-logo.svg"
                    alt="GeeksforGeeks Logo" className="logo" />
                <h1>Text Adventure</h1>
            </div>
        </nav>
    );
}

export default Navbar;