blog post for connect square game

Author: learnbyexample

README.md

@@ -6,6 +6,7 @@ I'm addicted to reading fantasy/sci-fi books, so I have a [blog](https://learnby
 
 ## Posts
 
+* [Connect Four game with a twist](https://learnbyexample.github.io/connect-four-game-with-a-twist/)
 * [Python regular expression cheatsheet and examples](https://learnbyexample.github.io/python-regex-cheatsheet/)
 * [Customizing pandoc to generate beautiful pdf and epub from markdown](https://learnbyexample.github.io/customizing-pandoc/)
 * [Everything you need to know about sed substitution](https://learnbyexample.github.io/everything-about-sed-substitution/)

atom.xml

@@ -5,8 +5,69 @@
 	<link href="https://learnbyexample.github.io/atom.xml" rel="self" type="application/atom+xml"/>
   <link href="https://learnbyexample.github.io"/>
 	<generator uri="https://www.getzola.org/">Zola</generator>
-	<updated>2025-07-10T00:00:00+00:00</updated>
+	<updated>2025-08-20T00:00:00+00:00</updated>
 	<id>https://learnbyexample.github.io/atom.xml</id>
+	<entry xml:lang="en">
+		<title>Connect Four game with a twist</title>
+		<published>2025-08-20T00:00:00+00:00</published>
+		<updated>2025-08-20T00:00:00+00:00</updated>
+		<link rel="alternate" href="https://learnbyexample.github.io/connect-four-game-with-a-twist/" type="text/html"/>
+		<id>https://learnbyexample.github.io/connect-four-game-with-a-twist/</id>
+		<content type="html">&lt;p align=&quot;center&quot;&gt;&lt;img src=&quot;https:&#x2F;&#x2F;raw.githubusercontent.com&#x2F;learnbyexample&#x2F;TUI-apps&#x2F;main&#x2F;ConnectSquare&#x2F;connect_square.png&quot; alt=&quot;Sample screenshot for Connect Square game&quot; &#x2F;&gt;&lt;&#x2F;p&gt;
+&lt;span id=&quot;continue-reading&quot;&gt;&lt;&#x2F;span&gt;&lt;br&gt;
+&lt;p&gt;From &lt;a href=&quot;https:&#x2F;&#x2F;en.wikipedia.org&#x2F;wiki&#x2F;Connect_Four&quot;&gt;wikipedia: Connect Four&lt;&#x2F;a&gt;:&lt;&#x2F;p&gt;
+&lt;blockquote&gt;
+&lt;p&gt;Connect Four is a game in which the players choose a color and then take turns dropping colored tokens into a six-row, seven-column vertically suspended grid. The pieces fall straight down, occupying the lowest available space within the column. The objective of the game is to be the first to form a horizontal, vertical, or diagonal line of four of one&#x27;s own tokens.&lt;&#x2F;p&gt;
+&lt;&#x2F;blockquote&gt;
+&lt;p&gt;As a twist, this TUI implementation also offers two more variations of the game:&lt;&#x2F;p&gt;
+&lt;ul&gt;
+&lt;li&gt;form a square, i.e. four cells forming 90 degree angles and equidistant from each other&lt;&#x2F;li&gt;
+&lt;li&gt;form a line or square&lt;&#x2F;li&gt;
+&lt;&#x2F;ul&gt;
+&lt;br&gt;
+&lt;h2 id=&quot;installation&quot;&gt;Installation&lt;a class=&quot;zola-anchor&quot; href=&quot;#installation&quot; aria-label=&quot;Anchor link for: installation&quot;&gt;🔗&lt;&#x2F;a&gt;&lt;&#x2F;h2&gt;
+&lt;p&gt;This app is available on PyPI as &lt;a href=&quot;https:&#x2F;&#x2F;pypi.org&#x2F;project&#x2F;connectsquare&#x2F;&quot;&gt;connectsquare&lt;&#x2F;a&gt;. Example installation instructions are shown below, adjust them based on your preferences and OS.&lt;&#x2F;p&gt;
+&lt;pre data-lang=&quot;bash&quot; style=&quot;background-color:#f5f5f5;color:#1f1f1f;&quot; class=&quot;language-bash &quot;&gt;&lt;code class=&quot;language-bash&quot; data-lang=&quot;bash&quot;&gt;&lt;span style=&quot;color:#7f8989;&quot;&gt;# virtual environment
+&lt;&#x2F;span&gt;&lt;span style=&quot;color:#5597d6;&quot;&gt;$&lt;&#x2F;span&gt;&lt;span&gt; python3&lt;&#x2F;span&gt;&lt;span style=&quot;color:#5597d6;&quot;&gt; -m&lt;&#x2F;span&gt;&lt;span&gt; venv textual_apps
+&lt;&#x2F;span&gt;&lt;span style=&quot;color:#5597d6;&quot;&gt;$&lt;&#x2F;span&gt;&lt;span&gt; cd textual_apps
+&lt;&#x2F;span&gt;&lt;span style=&quot;color:#5597d6;&quot;&gt;$&lt;&#x2F;span&gt;&lt;span&gt; source bin&#x2F;activate
+&lt;&#x2F;span&gt;&lt;span style=&quot;color:#5597d6;&quot;&gt;$&lt;&#x2F;span&gt;&lt;span&gt; pip install connectsquare
+&lt;&#x2F;span&gt;&lt;span&gt;
+&lt;&#x2F;span&gt;&lt;span style=&quot;color:#7f8989;&quot;&gt;# launch the app
+&lt;&#x2F;span&gt;&lt;span style=&quot;color:#5597d6;&quot;&gt;$&lt;&#x2F;span&gt;&lt;span&gt; connectsquare
+&lt;&#x2F;span&gt;&lt;&#x2F;code&gt;&lt;&#x2F;pre&gt;
+&lt;p&gt;To run the app without having to enter the virtual environment again, add this alias to &lt;code&gt;.bashrc&lt;&#x2F;code&gt; (or equivalent):&lt;&#x2F;p&gt;
+&lt;pre data-lang=&quot;bash&quot; style=&quot;background-color:#f5f5f5;color:#1f1f1f;&quot; class=&quot;language-bash &quot;&gt;&lt;code class=&quot;language-bash&quot; data-lang=&quot;bash&quot;&gt;&lt;span style=&quot;color:#7f8989;&quot;&gt;# you&amp;#39;ll have to change the path
+&lt;&#x2F;span&gt;&lt;span style=&quot;color:#b39f04;&quot;&gt;alias &lt;&#x2F;span&gt;&lt;span style=&quot;color:#c23f31;&quot;&gt;connectsquare&lt;&#x2F;span&gt;&lt;span style=&quot;color:#72ab00;&quot;&gt;=&lt;&#x2F;span&gt;&lt;span style=&quot;color:#d07711;&quot;&gt;&amp;#39;&#x2F;path&#x2F;to&#x2F;textual_apps&#x2F;bin&#x2F;connectsquare&amp;#39;
+&lt;&#x2F;span&gt;&lt;&#x2F;code&gt;&lt;&#x2F;pre&gt;
+&lt;p&gt;As an alternative to manually managing such virtual environments, you can use &lt;a href=&quot;https:&#x2F;&#x2F;github.com&#x2F;astral-sh&#x2F;uv&quot;&gt;uv&lt;&#x2F;a&gt; or &lt;a href=&quot;https:&#x2F;&#x2F;github.com&#x2F;pypa&#x2F;pipx&quot;&gt;pipx&lt;&#x2F;a&gt; instead.&lt;&#x2F;p&gt;
+&lt;p&gt;As yet another alternative, you can install &lt;code&gt;textual==0.85.2&lt;&#x2F;code&gt; (see &lt;a href=&quot;https:&#x2F;&#x2F;textual.textualize.io&#x2F;getting_started&#x2F;&quot;&gt;Textual documentation&lt;&#x2F;a&gt; for more details), clone &lt;a href=&quot;https:&#x2F;&#x2F;github.com&#x2F;learnbyexample&#x2F;TUI-apps&quot;&gt;this repository&lt;&#x2F;a&gt; and run the &lt;code&gt;connect_square.py&lt;&#x2F;code&gt; file.&lt;&#x2F;p&gt;
+&lt;br&gt;
+&lt;h2 id=&quot;screenshots&quot;&gt;Screenshots&lt;a class=&quot;zola-anchor&quot; href=&quot;#screenshots&quot; aria-label=&quot;Anchor link for: screenshots&quot;&gt;🔗&lt;&#x2F;a&gt;&lt;&#x2F;h2&gt;
+&lt;p&gt;Adjust your terminal&#x27;s dimension for the game widgets to appear properly, for example 80x30 (characters x lines). Sample screenshots are shown below:&lt;&#x2F;p&gt;
+&lt;p align=&quot;center&quot;&gt;&lt;img src=&quot;https:&#x2F;&#x2F;raw.githubusercontent.com&#x2F;learnbyexample&#x2F;TUI-apps&#x2F;main&#x2F;ConnectSquare&#x2F;connect_four.png&quot; alt=&quot;Sample screenshot for Connect Four game&quot; &#x2F;&gt;&lt;&#x2F;p&gt;
+&lt;p align=&quot;center&quot;&gt;&lt;img src=&quot;https:&#x2F;&#x2F;raw.githubusercontent.com&#x2F;learnbyexample&#x2F;TUI-apps&#x2F;main&#x2F;ConnectSquare&#x2F;connect_both.png&quot; alt=&quot;Sample screenshot for Connect Four or Square game&quot; &#x2F;&gt;&lt;&#x2F;p&gt;
+&lt;br&gt;
+&lt;h2 id=&quot;guide&quot;&gt;Guide&lt;a class=&quot;zola-anchor&quot; href=&quot;#guide&quot; aria-label=&quot;Anchor link for: guide&quot;&gt;🔗&lt;&#x2F;a&gt;&lt;&#x2F;h2&gt;
+&lt;ul&gt;
+&lt;li&gt;Press the &lt;strong&gt;n&lt;&#x2F;strong&gt; key to start a new game. Existing game, if any, will be abandoned&lt;&#x2F;li&gt;
+&lt;li&gt;You can choose between &lt;strong&gt;Connect Four&lt;&#x2F;strong&gt;, &lt;strong&gt;Connect Square&lt;&#x2F;strong&gt; (default) and &lt;strong&gt;Both&lt;&#x2F;strong&gt; types of game&lt;&#x2F;li&gt;
+&lt;li&gt;You can choose between &lt;strong&gt;Easy&lt;&#x2F;strong&gt; (default), &lt;strong&gt;Medium&lt;&#x2F;strong&gt; and &lt;strong&gt;Hard&lt;&#x2F;strong&gt; difficulty modes:
+&lt;ul&gt;
+&lt;li&gt;In the &lt;em&gt;Easy&lt;&#x2F;em&gt; mode, the AI will make a random move&lt;&#x2F;li&gt;
+&lt;li&gt;In the &lt;em&gt;Medium&lt;&#x2F;em&gt; mode, the AI will make a random move based on certain weight calculations&lt;&#x2F;li&gt;
+&lt;li&gt;In the &lt;em&gt;Hard&lt;&#x2F;em&gt; mode, the AI will make the best move based on the weight calculations (the algorithm is based only on the current board state and thus it is not impossible for the user to win)&lt;&#x2F;li&gt;
+&lt;&#x2F;ul&gt;
+&lt;&#x2F;li&gt;
+&lt;li&gt;The first move is based on the &lt;strong&gt;User first&lt;&#x2F;strong&gt; (default) and &lt;strong&gt;AI first&lt;&#x2F;strong&gt; choices&lt;&#x2F;li&gt;
+&lt;li&gt;Only the bottom most empty cell of each column will be considered as a valid move&lt;&#x2F;li&gt;
+&lt;li&gt;Press the &lt;strong&gt;t&lt;&#x2F;strong&gt; key to toggle between light and dark themes&lt;&#x2F;li&gt;
+&lt;li&gt;Press the &lt;strong&gt;q&lt;&#x2F;strong&gt; key to quit the app&lt;&#x2F;li&gt;
+&lt;&#x2F;ul&gt;
+&lt;p&gt;User moves are denoted by the ⭕️ character and AI moves are denoted by the ✖️  character.&lt;&#x2F;p&gt;
+&lt;p&gt;The text panel under the game board displays the current status of the game. If the game ends with one of the players forming a valid line or square, the cells forming the winning move will be highlighted.&lt;&#x2F;p&gt;
+</content>
+	</entry>
 	<entry xml:lang="en">
 		<title>Python regular expression cheatsheet and examples</title>
 		<published>2025-06-09T00:00:00+00:00</published>

connect-four-game-with-a-twist/index.html

@@ -0,0 +1,11 @@
+<!doctype html><html lang=en><head><meta content="IE=edge" http-equiv=X-UA-Compatible><meta content="text/html; charset=utf-8" http-equiv=content-type><meta content="width=device-width,initial-scale=1.0,maximum-scale=1" name=viewport><title>Connect Four game with a twist</title><link href=https://learnbyexample.github.io/atom.xml rel=alternate title=RSS type=application/atom+xml><script src=https://cdnjs.cloudflare.com/ajax/libs/slideout/1.0.1/slideout.min.js></script><link href=https://learnbyexample.github.io/site.css rel=stylesheet><meta content="Connect Four game with a twist" property=og:title><meta content=website property=og:type><meta content="Connect Four TUI app in Python using textual." property=og:description><meta content=https://learnbyexample.github.io/connect-four-game-with-a-twist/ property=og:url><meta content=https://raw.githubusercontent.com/learnbyexample/TUI-apps/main/ConnectSquare/connect_square.png property=og:image><meta content=1144 property=og:image:width><meta content=931 property=og:image:height><meta content=summary_large_image property=twitter:card><meta content=@learn_byexample property=twitter:site><link href=https://learnbyexample.github.io/favicon.svg rel=icon><link rel="shortcut icon" href=https://learnbyexample.github.io/favicon.png><body><div class=container><div class=mobile-navbar id=mobile-navbar><div class=mobile-header-logo><a class=logo href=/>learnbyexample</a></div><div class="mobile-navbar-icon icon-out"><span></span><span></span><span></span></div></div><nav class="mobile-menu slideout-menu slideout-menu-left" id=mobile-menu><ul class=mobile-menu-list><li class=mobile-menu-item><a href=https://learnbyexample.github.io/books> Books </a><li class=mobile-menu-item><a href=https://learnbyexample.github.io/mini> Mini </a><li class=mobile-menu-item><a href=https://learnbyexample.github.io/tips> Tips </a><li class=mobile-menu-item><a href=https://learnbyexample.github.io/tags> Tags </a><li class=mobile-menu-item><a href=https://learnbyexample.github.io/about> About </a></ul></nav><header id=header><div class=logo><a href=https://learnbyexample.github.io>learnbyexample</a></div><nav class=menu><ul><li><a href=https://learnbyexample.github.io/books> Books </a><li><a href=https://learnbyexample.github.io/mini> Mini </a><li><a href=https://learnbyexample.github.io/tips> Tips </a><li><a href=https://learnbyexample.github.io/tags> Tags </a><li><a href=https://learnbyexample.github.io/about> About </a></ul></nav></header><main><div class=content id=mobile-panel><div class=post-toc id=post-toc><h2 class=post-toc-title>Contents</h2><div class="post-toc-content always-active"><nav id=TableOfContents><ul><li><a class=toc-link href=https://learnbyexample.github.io/connect-four-game-with-a-twist/#installation>Installation</a><li><a class=toc-link href=https://learnbyexample.github.io/connect-four-game-with-a-twist/#screenshots>Screenshots</a><li><a class=toc-link href=https://learnbyexample.github.io/connect-four-game-with-a-twist/#guide>Guide</a></ul></nav></div></div><article class=post><header class=post__header><h1 class=post__title><a href=https://learnbyexample.github.io/connect-four-game-with-a-twist/>Connect Four game with a twist</a></h1><div class=post__meta><span class=post__time>2025-08-20</span></div></header><div class=post-content><p align=center><img alt="Sample screenshot for Connect Square game" src=https://raw.githubusercontent.com/learnbyexample/TUI-apps/main/ConnectSquare/connect_square.png></p><span id=continue-reading></span><br><p>From <a href=https://en.wikipedia.org/wiki/Connect_Four>wikipedia: Connect Four</a>:<blockquote><p>Connect Four is a game in which the players choose a color and then take turns dropping colored tokens into a six-row, seven-column vertically suspended grid. The pieces fall straight down, occupying the lowest available space within the column. The objective of the game is to be the first to form a horizontal, vertical, or diagonal line of four of one's own tokens.</blockquote><p>As a twist, this TUI implementation also offers two more variations of the game:<ul><li>form a square, i.e. four cells forming 90 degree angles and equidistant from each other<li>form a line or square</ul><br><h2 id=installation>Installation<a aria-label="Anchor link for: installation" class=zola-anchor href=#installation>🔗</a></h2><p>This app is available on PyPI as <a href=https://pypi.org/project/connectsquare/>connectsquare</a>. Example installation instructions are shown below, adjust them based on your preferences and OS.<pre class=language-bash data-lang=bash style=background-color:#f5f5f5;color:#1f1f1f;><code class=language-bash data-lang=bash><span style=color:#7f8989;># virtual environment
+</span><span style=color:#5597d6;>$</span><span> python3</span><span style=color:#5597d6;> -m</span><span> venv textual_apps
+</span><span style=color:#5597d6;>$</span><span> cd textual_apps
+</span><span style=color:#5597d6;>$</span><span> source bin/activate
+</span><span style=color:#5597d6;>$</span><span> pip install connectsquare
+</span><span>
+</span><span style=color:#7f8989;># launch the app
+</span><span style=color:#5597d6;>$</span><span> connectsquare
+</span></code></pre><p>To run the app without having to enter the virtual environment again, add this alias to <code>.bashrc</code> (or equivalent):<pre class=language-bash data-lang=bash style=background-color:#f5f5f5;color:#1f1f1f;><code class=language-bash data-lang=bash><span style=color:#7f8989;># you'll have to change the path
+</span><span style=color:#b39f04;>alias </span><span style=color:#c23f31;>connectsquare</span><span style=color:#72ab00;>=</span><span style=color:#d07711;>'/path/to/textual_apps/bin/connectsquare'
+</span></code></pre><p>As an alternative to manually managing such virtual environments, you can use <a href=https://github.com/astral-sh/uv>uv</a> or <a href=https://github.com/pypa/pipx>pipx</a> instead.<p>As yet another alternative, you can install <code>textual==0.85.2</code> (see <a href=https://textual.textualize.io/getting_started/>Textual documentation</a> for more details), clone <a href=https://github.com/learnbyexample/TUI-apps>this repository</a> and run the <code>connect_square.py</code> file.</p><br><h2 id=screenshots>Screenshots<a aria-label="Anchor link for: screenshots" class=zola-anchor href=#screenshots>🔗</a></h2><p>Adjust your terminal's dimension for the game widgets to appear properly, for example 80x30 (characters x lines). Sample screenshots are shown below:<p align=center><img alt="Sample screenshot for Connect Four game" src=https://raw.githubusercontent.com/learnbyexample/TUI-apps/main/ConnectSquare/connect_four.png><p align=center><img alt="Sample screenshot for Connect Four or Square game" src=https://raw.githubusercontent.com/learnbyexample/TUI-apps/main/ConnectSquare/connect_both.png></p><br><h2 id=guide>Guide<a aria-label="Anchor link for: guide" class=zola-anchor href=#guide>🔗</a></h2><ul><li>Press the <strong>n</strong> key to start a new game. Existing game, if any, will be abandoned<li>You can choose between <strong>Connect Four</strong>, <strong>Connect Square</strong> (default) and <strong>Both</strong> types of game<li>You can choose between <strong>Easy</strong> (default), <strong>Medium</strong> and <strong>Hard</strong> difficulty modes: <ul><li>In the <em>Easy</em> mode, the AI will make a random move<li>In the <em>Medium</em> mode, the AI will make a random move based on certain weight calculations<li>In the <em>Hard</em> mode, the AI will make the best move based on the weight calculations (the algorithm is based only on the current board state and thus it is not impossible for the user to win)</ul><li>The first move is based on the <strong>User first</strong> (default) and <strong>AI first</strong> choices<li>Only the bottom most empty cell of each column will be considered as a valid move<li>Press the <strong>t</strong> key to toggle between light and dark themes<li>Press the <strong>q</strong> key to quit the app</ul><p>User moves are denoted by the ⭕️ character and AI moves are denoted by the ✖️ character.<p>The text panel under the game board displays the current status of the game. If the game ends with one of the players forming a valid line or square, the cells forming the winning move will be highlighted.</div><div class=post-footer><div class=post-tags><a href=https://learnbyexample.github.io/tags/python/>#python</a><a href=https://learnbyexample.github.io/tags/tui/>#TUI</a><a href=https://learnbyexample.github.io/tags/textual/>#textual</a></div><hr color=#e6e6e6><div class=post-nav><p><a class=next href=https://learnbyexample.github.io/python-regex-cheatsheet/>Python regular expression cheatsheet and examples →</a><br></div><hr color=#e6e6e6><p>📰 Use <a href=https://learnbyexample.github.io/atom.xml>this link</a> for the Atom feed. <br> ✅ Follow me on <a href=https://twitter.com/learn_byexample>Twitter</a>, <a href=https://github.com/learnbyexample>GitHub</a> and <a href=https://www.youtube.com/c/learnbyexample42>Youtube</a> for interesting tech nuggets. <br> 📧 Subscribe to <a href=https://learnbyexample.gumroad.com/l/learnbyexample-weekly>learnbyexample weekly</a> for programming resources, tips, tools, free ebooks and more (free newsletter, delivered every Friday).<hr color=#e6e6e6></div></article></div></main></div><script src=https://learnbyexample.github.io/even.js></script>