_notebooks/2025-01-09-Messages-notebook-copy.ipynb

{
 "cells": [
  {
   "cell_type": "code",
   "execution_count": null,
   "metadata": {
    "vscode": {
     "languageId": "html"
    }
   },
   "outputs": [],
   "source": [
    "---\n",
    "comments: true\n",
    "layout: post\n",
    "title: Incorporating Messages/Text\n",
    "description: Ideas for different features with text to add into the game.\n",
    "permalink: /first/\n",
    "categories: Backgrounds|Theme|Messages\n",
    "---"
   ]
  },
  {
   "cell_type": "markdown",
   "metadata": {},
   "source": [
    "### Incorporating Messages/Text"
   ]
  },
  {
   "cell_type": "markdown",
   "metadata": {},
   "source": [
    "Some game ideas for how messages/text could possibly be added into a game."
   ]
  },
  {
   "cell_type": "markdown",
   "metadata": {},
   "source": [
    "This is an example of skeletal code for adding game notifications. You could add multiple for different notificiations like when a player kills an enemy or picks up a coin."
   ]
  },
  {
   "cell_type": "markdown",
   "metadata": {},
   "source": [
    "This would go into index.md. This is sets up the notification center and has the css file and game.js. It creates a div for the display of the notifications."
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "metadata": {
    "vscode": {
     "languageId": "html"
    }
   },
   "outputs": [],
   "source": [
    "<!DOCTYPE html>\n",
    "<html lang=\"en\">\n",
    "<head>\n",
    "    <meta charset=\"UTF-8\">\n",
    "    <title>Game Notifications</title>\n",
    "    <link rel=\"stylesheet\" href=\"styles.css\">\n",
    "</head>\n",
    "<body>\n",
    "    <div id=\"notificationContainer\"></div>\n",
    "    <script src=\"game.js\"></script>\n",
    "</body>\n",
    "</html>"
   ]
  },
  {
   "cell_type": "markdown",
   "metadata": {},
   "source": [
    "This is a CSS file. It has the styles for the appearence of the messages."
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "metadata": {},
   "outputs": [],
   "source": [
    "#notificationContainer {\n",
    "    position: fixed;\n",
    "    top: 20px;\n",
    "    right: 20px;\n",
    "    width: 200px;\n",
    "    padding: 10px;\n",
    "    background-color: rgba(0, 0, 0, 0.7);\n",
    "    color: white;\n",
    "    border-radius: 5px;\n",
    "    display: none;\n",
    "    z-index: 1000;\n",
    "}"
   ]
  },
  {
   "cell_type": "markdown",
   "metadata": {},
   "source": [
    "This would go into GameControl.js. This has the logic to display the notifications when the player does certain things. You would modifiy this to create the specific functions for the different things like collecting coins and killing enemies."
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "metadata": {
    "vscode": {
     "languageId": "javascript"
    }
   },
   "outputs": [],
   "source": [
    "%%js\n",
    "\n",
    "window.onload = function() {\n",
    "    const notificationContainer = document.getElementById('notificationContainer');\n",
    "\n",
    "    // Function to show a notification\n",
    "    function showNotification(message) {\n",
    "        notificationContainer.innerText = message;\n",
    "        notificationContainer.style.display = 'block';\n",
    "        setTimeout(() => {\n",
    "            notificationContainer.style.display = 'none';\n",
    "        }, 3000); // Hide after 3 seconds\n",
    "    }\n",
    "\n",
    "    // Example functions to simulate game events\n",
    "    function collectCoin() {\n",
    "        // Logic for collecting a coin\n",
    "        showNotification(\"Coin collected!\");\n",
    "    }\n",
    "\n",
    "    function killEnemy() {\n",
    "        // Logic for killing an enemy\n",
    "        showNotification(\"Enemy defeated!\");\n",
    "    }\n",
    "\n",
    "    // Simulate player actions for demonstration purposes\n",
    "    setTimeout(collectCoin, 1000); // Simulate collecting a coin after 1 second\n",
    "    setTimeout(killEnemy, 2000);  // Simulate killing an enemy after 2 seconds\n",
    "};\n"
   ]
  },
  {
   "cell_type": "markdown",
   "metadata": {},
   "source": [
    "### Game Tips\n",
    "\n",
    "Another idea is to add game tips for the player in between levels on a loading screen."
   ]
  }
 ],
 "metadata": {
  "kernelspec": {
   "display_name": "venv",
   "language": "python",
   "name": "python3"
  },
  "language_info": {
   "codemirror_mode": {
    "name": "ipython",
    "version": 3
   },
   "file_extension": ".py",
   "mimetype": "text/x-python",
   "name": "python",
   "nbconvert_exporter": "python",
   "pygments_lexer": "ipython3",
   "version": "3.12.3"
  }
 },
 "nbformat": 4,
 "nbformat_minor": 2
}