Conway Game of Life

Conwayova hra života

5. 1. 2025 Ing. Róbert Polák Mathematics Matematika

Conway's Game of Life

Snmka obrazovky 2025-01-04 154323png

Enhancing Conway's Game of Life: A Modern Web-Based Implementation

Discover the Fascinating World of Conway's Game of Life! 

The Game of Life, created by mathematician John Horton Conway in 1970, is a mesmerizing cellular automaton that simulates the birth, survival, and death of cells based on simple rules. Originally implemented using Python's Pygame and Tkinter libraries, our project has evolved into a sleek, web-based application built with HTML, CSS, and JavaScript. Dive into an enhanced experience with a rich set of features and an intuitive graphical user interface!

New Features

Configurable Grid Size and Speed
Adjust the number of rows and columns, as well as the simulation speed (FPS), to tailor the grid to your preferences.

Symmetric Patterns
Generate stunning symmetric patterns by specifying the size of a square. The application mirrors the pattern across both the x and y axes, creating four symmetrical squares centered on the canvas.

Variety of Pre-defined Patterns
Choose from a wide range of predefined patterns, including:

  • Blinker
  • Glider
  • Block
  • Toad
  • Beacon
  • Pulsar
  • Pentadecathlon
  • LWSS (Lightweight Spaceship)

Customizable Colors and Blur Effect
Personalize the visual experience by selecting colors for the background, live cells, and grid lines. Enjoy a sophisticated blurred background adorned with mathematical equations for an elegant touch.

Random Cell Colors
Enable random coloring for live cells to add dynamic and vibrant visuals to your simulations.

Creative Mode
Manually toggle the state of individual cells by clicking on them within the grid, allowing for bespoke configurations beyond predefined patterns.

Resizable Canvas and Fullscreen Mode
Adjust the canvas dimensions to fit your screen or switch to fullscreen for an immersive experience.

Save and Load Configurations
Preserve your favorite grid setups by saving them as JSON files and reload them anytime for continued exploration.

How to Get Started

1. Access the Game

Simply visit our web-based application:  https://www.poling.sk/python/Conway_game.html 

2. Configure Game Settings

  • Click "Configure" to open the settings panel.
  • Set Grid Parameters:
    • Number of Rows: Define the grid's vertical size.
    • Number of Columns: Define the grid's horizontal size.
    • Speed (FPS): Control the simulation's speed.
  • Choose Patterns:
    • Randomized Grid: Start with a random distribution of live cells.
    • Pre-defined Patterns: Select from various classic patterns.
    • Symmetric Patterns: Enable and set the square size to generate mirrored patterns.
  • Customize Appearance:
    • Background Color: Pick your preferred background shade.
    • Cell Color: Choose a color for live cells or enable random coloring.
    • Grid Color: Select the color of the grid lines.
    • Canvas Size: Adjust the canvas width and height to your liking.
  • Enable Modes:
    • Creative Mode: Allow manual toggling of cell states.
    • Fullscreen Mode: Switch between windowed and fullscreen views.

3. Setup and Run the Simulation

  • Click "Setup Grid" to initialize the grid based on your configurations.
  • Start Simulation: Press the "Start Simulation" button to watch the evolution unfold.
  • Pause/Resume: Use the "Pause" button to halt or continue the simulation at any time.
  • Reset Grid: Click "Reset Grid" to clear the current grid and start anew.
  • Save/Load Configurations: Utilize the "Save Map" and "Load Map" buttons to manage your grid setups.

4. Interactive Exploration

  • Creative Mode: If activated, simply click on cells within the grid to toggle their states, crafting unique patterns and observing their interactions.

Controls

  • Start Simulation: Begin the evolution of the grid.
  • Pause: Temporarily stop the simulation.
  • Reset Grid: Clear all cells and reset the grid.
  • Save Map: Download the current grid configuration as a JSON file.
  • Load Map: Upload a saved JSON file to restore a grid configuration.
  • Configure: Open or close the settings panel to adjust game parameters.

Examples

Symmetric Patterns

Enable Symmetric Patterns and specify a Square Size to generate a mirrored layout of live cells across both axes, resulting in a harmonious and balanced grid.

Random Cell Colors

Activate Random Cell Colors to add a splash of vibrancy, with each live cell displaying a unique, randomly generated color.

Contributing

Contributions are highly appreciated! Whether it's reporting bugs, suggesting new features, or submitting pull requests, your input helps improve the project. Visit our GitHub repository to contribute.

License

This project is licensed under the MIT License. See the LICENSE file for details.

Acknowledgements

  • Web Technologies: HTML, CSS, JavaScript
  • Inspirations: John Horton Conway's original Game of Life
  • Icons and Images: [Provide sources or attributions if applicable]

Explore the intricate patterns and endless possibilities with Conway's Game of Life! Whether you're a mathematics enthusiast, a programming aficionado, or simply curious about cellular automata, our web-based application offers an engaging platform to experiment and visualize the dynamics of Life.

Feel free to share your experiences, patterns, and any feedback in the comments below or through our GitHub issues.


#ConwaysGameOfLife #CellularAutomaton #WebApp #JavaScript #HTML #CSS #Programming #Mathematics #Simulation #Technology #SymmetricPatterns #CreativeMode #BlurEffect


Additional Tips for the Blog Post:

  • Visuals: Incorporate screenshots or GIFs of the Game of Life in action to provide readers with a visual understanding of the features.

  • Interactive Demos: Consider embedding an interactive demo directly within the blog post using an <iframe> pointing to your web application, allowing readers to try it out without leaving the page.

  • User Testimonials: Share feedback or stories from users who have enjoyed using the enhanced Game of Life, highlighting its educational and entertainment value.

  • Future Enhancements: Outline potential future updates or features you're planning to implement, inviting readers to stay tuned or contribute ideas.


Feel free to customize this template further to better match your personal style or to include any additional information relevant to your project. If you have specific sections you'd like to add or modify, let me know, and I'd be happy to assist!

Conwayova hra života

Conwayova hra života

Snímka obrazovky aplikácie

Vylepšenie Conwayovej hry života: Moderná webová implementácia

Objavte fascinujúci svet Conwayovej hry života!

Hra života, ktorú vytvoril matematik John Horton Conway v roku 1970, je ohromujúci bunkový automat, ktorý simulúje narodenie, prežitie a smrť buniek na základe jednoduchých pravidiel. Pôvodne implementácia používala Python Pygame a Tkinter knižnice, náš projekt sa vyvinul na elegantnú webovú aplikáciu postavenú na HTML, CSS a JavaScripte. Ponorte sa do vylepšenej skúsenosti s bohato vybavenymi funkciami a intuítivnym grafickým rozhraním!

Nové funkcie

Konfigurovateľná veľkosť mriežky a rýchlosť
Nastavte počet riadkov a stĺpcov, ako aj rýchlosť simulácie (FPS), podľa vašich preferencii.

Symetrické vzory
Generujte nádherné symetrické vzory zadaním veľkosti štvorca. Aplikácia zrkadlí vzor cez os x aj y, vytvárajúc štyri symetrické štvorce vycentrované na plátne.

Rozličnosť preddefinovaných vzorov
Vyberte si z širokého spektra preddefinovaných vzorov vratané:

  • Blinker (Blikáč)
  • Glider (Klúzak)
  • Block (Blok)
  • Toad (Žaba)
  • Beacon (Maják)
  • Pulsar (Pulzar)
  • Pentadecathlon
  • LWSS (Lightweight Spaceship - ĺahká vesmírna loď)

Prispôsobiteľné farby a efekt rozmazania
Personalizujte vizuálny zážitok výberom farieb pre pozadie, živé bunky a čiary mriežky. Užite si sofistikované rozmazané pozadie zdobené matematickými rovnicami pre elegantný dotykov.

Náhodné farby buniek
Zapnite náhodné farbenie živých buniek pre dynamické a živé vizuály vo vašich simuláciách.

Kreatívny režim
Manuálne prepínajte stav jednotlivých buniek kliknutím na ne v mriežke, čo umožňuje jedinečné konfigurácie nad rámec preddefinovaných vzorov.

Zmena veľkosti plátna a celoobrazovkový režim
Nastavte rozmery plátna podľa vašej obrazovky alebo prepnite na celoobrazovkový režim pre pohľdavajúci zážitok.

Uloženie a načítanie konfigurácií
Zachovajte vaše obľúbené nastavenia mriežky uložením ako JSON súbory a načítajte ich kedykoľvek pre pokračovanie v objavovaní.

Ako začať

1. Prístup k hre

Jednoducho navštívte našu webovú aplikáciu: https://www.poling.sk/python/Conway_game.html

2. Konfigurácia nastavenia hry

  • Kliknite "Configure" pre otvorenie panela nastavenia.
  • Nastavte parametre mriežky:
    • Počet riadkov: Definuje vertikálnu veľkosť mriežky.
    • Počet stĺpcov: Definuje horizontálnu veľkosť mriežky.
    • Rýchlosť (FPS): Kontroluje rýchlosť simulácie.
  • Vyberte vzory:
    • Náhodná mriežka: Začnite s náhodnou distribuüiu živých buniek.
    • Preddefinované vzory: Vyberte z rôznych klasických vzorov.
    • Symetrické vzory: Zapnite a nastavte veľkosť štvorca pre generovanie zrkadlených vzorov.
  • Prispôsobte vzhľad:
    • Farba pozadia: Vyberte vašu preferovanú farbu pozadia.
    • Farba buniek: Zvoľte farbu pre živé bunky alebo zapnite náhodné farbenie.
    • Farba mriežky: Vyberte farbu čiar mriežky.
    • Veľkosť plátna: Nastavte šírku a výšku plátna podľa vašich preferencii.
  • Zapnite režimy:
    • Kreatívny režim: Umožňuje manuálne prepínanie stavov buniek.
    • Celoobrazovkový režim: Prepínanie medzi oknom a celoobrazovkovým zobrazovaním.

3. Nastavenie a spustenie simulácie

  • Kliknite "Setup Grid" pre inicializáciu mriežky podľa vašich konfigurácií.
  • Spustenie simulácie: Stlačte tlačidlo "Start Simulation" pre sledovanie vývoja.
  • Pauza/Pokračovanie: Použite tlačidlo "Pause" pre zastavenie alebo pokračovanie simulácie kedykoľvek.
  • Reset mriežky: Kliknite "Reset Grid" pre vyčistenie aktuálnej mriežky a nový začiatok.
  • Uloženie/Načítanie konfigurácií: Využite tlačidlá "Save Map" a "Load Map" pre správu vašich nastavenie mriežky.

4. Interaktívne objavovanie

  • Kreatívny režim: Ak je aktivovaný, jednoducho kliknite na bunky v mriežke pre prepínanie ich stavov, vytváranie jedinečných vzorov a sledovanie ich interakcií.

Ovládanie

  • Start Simulation: Začne vývoj mriežky.
  • Pause: Dočasne zastaví simuláciu.
  • Reset Grid: Vyčistí všetky bunky a resetuje mriežku.
  • Save Map: Stiahne aktuálnu konfiguráciu mriežky ako JSON súbor.
  • Load Map: Nahrá uložený JSON súbor pre obnovenie konfigurácie mriežky.
  • Configure: Otvorí alebo zatvorí panel nastavenia pre úpravu parametrov hry.

Príklady

Symetrické vzory

Zapnite Symetrické vzory a špecifikujte Veľkosť štvorca pre generovanie zrkadleného rozloženia živých buniek cez obe osi, čo má za následok harmónickou a vyváženú mriežku.

Náhodné farby buniek

Aktivujte Náhodné farby buniek pre pridanie živosti, kde každá živá bunka zobrazuje jedinečnú, náhodne generovanú farbu.

Príspevky

Príspevky sú veľmi vîtané! Či už ide o hlásenie chýb, navrhovanie nových funkcií, alebo predľoženie pull requestov, vaš príspevok pomáha vylepšovať projekt. Navštívte náš GitHub repository pre príspevky.

Licencia

Tento projekt je licencovaný pod MIT licenciou. Pre detaily si pozrite súbor LICENSE.

Poďakovanie

  • Webové technológie: HTML, CSS, JavaScript
  • Inspirácie: Pôvodná Hra života od John Horton Conway
  • Ikony a obrázky: [Uvedťe zdroje alebo priznanie ak je to vhodné]

Objavte zložité vzory a nekonečné možnosti s Conwayovou hrou života! Či už ste matematik, programovací nadšenec, alebo jednoducho zvedaví na bunkové automaty, naša webová aplikácia pонúka zaujímavú platform pre experimentovanie a vizualizáciu dynamiky Života.

Neohábajte sa deliť o vaše skúsenosti, vzory a akúľvek spätnú väzbu v komentároch nižšie alebo cez naše GitHub issues.


#ConwayovaHraŽivota #BunkovýAutomat #WebApp #JavaScript #HTML #CSS #Programovanie #Matematika #Simulácia #Technológia #SymetrickéVzory #KreatívnyRežim #EfektRozmazania