Using i18n for native `ja` translation::under construction

8 files changed, 187 insertions, 13 deletions

diff --git a/locale/en/LC_MESSAGES/django.po b/locale/en/LC_MESSAGES/django.po
new file mode 100644
index 00000000..2e14adfc
--- /dev/null
+++ b/locale/en/LC_MESSAGES/django.po
@@ -0,0 +1,54 @@
+# SOME DESCRIPTIVE TITLE.
+# Copyright (C) YEAR THE PACKAGE'S COPYRIGHT HOLDER
+# This file is distributed under the same license as the PACKAGE package.
+# FIRST AUTHOR <EMAIL@ADDRESS>, YEAR.
+#
+#, fuzzy
+msgid ""
+msgstr ""
+"Project-Id-Version: PACKAGE VERSION\n"
+"Report-Msgid-Bugs-To: \n"
+"POT-Creation-Date: 2024-08-12 16:28+0000\n"
+"PO-Revision-Date: YEAR-MO-DA HO:MI+ZONE\n"
+"Last-Translator: FULL NAME <EMAIL@ADDRESS>\n"
+"Language-Team: LANGUAGE <[email protected]>\n"
+"Language: \n"
+"MIME-Version: 1.0\n"
+"Content-Type: text/plain; charset=UTF-8\n"
+"Content-Transfer-Encoding: 8bit\n"
+"Plural-Forms: nplurals=2; plural=(n != 1);\n"
+#: templates/blog/home.html:8
+#, python-format
+msgid ""
+"\n"
+"  <p>\n"
+"    Welcome to the home of <b>Shifoo</b> (previously <i>That Computer "
+"Scientist</i>). My name is <a href=\"%(bobby_profile_url)s\">@bobby</a>, and "
+"this is my personal\n"
+"    website. I aim to build a retro looking personal website, where I share "
+"my thoughts, ideas, and experiences through articles, and will showcase some "
+"cool nostalgic features and tools.\n"
+"  </p>\n"
+"  <p>\n"
+"  Please note that I am continuously working on this site, and it is still "
+"under construction. So, not all features are available yet, and some "
+"features may not work as intended.\n"
+"  </p>\n"
+"  <p>\n"
+"    There's also a some of <a href=\"#fun-stuff\">fun stuff</a> you can find "
+"in the sidebar, that you can play around with. I will be adding more in the "
+"not so distant future.\n"
+"    Also, To participate around various sections of the site, you will need "
+"to <a href=\"%(register_url)s\">register</a> for an account. I hope you "
+"enjoy your stay here.\n"
+"  </p>\n"
+"  "
+msgstr ""
+
+#: thatcomputerscientist/settings.py:232
+msgid "English"
+msgstr ""
+
+#: thatcomputerscientist/settings.py:233
+msgid "Japanese"
+msgstr ""
diff --git a/locale/ja/LC_MESSAGES/django.po b/locale/ja/LC_MESSAGES/django.po
new file mode 100644
index 00000000..d370817e
--- /dev/null
+++ b/locale/ja/LC_MESSAGES/django.po
@@ -0,0 +1,74 @@
+# SOME DESCRIPTIVE TITLE.
+# Copyright (C) YEAR THE PACKAGE'S COPYRIGHT HOLDER
+# This file is distributed under the same license as the PACKAGE package.
+# FIRST AUTHOR <EMAIL@ADDRESS>, YEAR.
+#
+#, fuzzy
+msgid ""
+msgstr ""
+"Project-Id-Version: PACKAGE VERSION\n"
+"Report-Msgid-Bugs-To: \n"
+"POT-Creation-Date: 2024-08-12 16:28+0000\n"
+"PO-Revision-Date: YEAR-MO-DA HO:MI+ZONE\n"
+"Last-Translator: FULL NAME <EMAIL@ADDRESS>\n"
+"Language-Team: LANGUAGE <[email protected]>\n"
+"Language: \n"
+"MIME-Version: 1.0\n"
+"Content-Type: text/plain; charset=UTF-8\n"
+"Content-Transfer-Encoding: 8bit\n"
+"Plural-Forms: nplurals=1; plural=0;\n"
+#: templates/blog/home.html:8
+#, python-format
+msgid ""
+"\n"
+"  <p>\n"
+"    Welcome to the home of <b>Shifoo</b> (previously <i>That Computer "
+"Scientist</i>). My name is <a href=\"%(bobby_profile_url)s\">@bobby</a>, and "
+"this is my personal\n"
+"    website. I aim to build a retro looking personal website, where I share "
+"my thoughts, ideas, and experiences through articles, and will showcase some "
+"cool nostalgic features and tools.\n"
+"  </p>\n"
+"  <p>\n"
+"  Please note that I am continuously working on this site, and it is still "
+"under construction. So, not all features are available yet, and some "
+"features may not work as intended.\n"
+"  </p>\n"
+"  <p>\n"
+"    There's also a some of <a href=\"#fun-stuff\">fun stuff</a> you can find "
+"in the sidebar, that you can play around with. I will be adding more in the "
+"not so distant future.\n"
+"    Also, To participate around various sections of the site, you will need "
+"to <a href=\"%(register_url)s\">register</a> for an account. I hope you "
+"enjoy your stay here.\n"
+"  </p>\n"
+"  "
+msgstr ""
+"\n"
+"  <p>\n"
+"    Shifooのホームへようこそ（以前は<i>That Computer Scientist</i>）。私の名"
+"前は<a href=\"%(bobby_profile_url)s\">@bobby</a>で、これは私の個人的な\n"
+"    ウェブサイトです。レトロな個人ウェブサイトを作成し、記事を通じて私の考"
+"え、アイデア、経験を共有し、いくつかのクールで懐かしい機能とツールを展示する"
+"ことを目指しています。\n"
+"  </p>\n"
+"  <p>\n"
+"  このサイトは継続的に作業中で、まだ建設中ですので、すべての機能が利用可能で"
+"はなく、一部の機能が意図した通りに動作しない場合があります。\n"
+"  </p>\n"
+"  <p>\n"
+"    サイドバーには<a href=\"#fun-stuff\">楽しいもの</a>もあり、それを試してみ"
+"ることができます。近い将来、さらに多くのものを追加する予定です。\n"
+"    また、サイトのさまざまなセクションに参加するには、<a "
+"href=\"%(register_url)s\">登録</a>する必要があります。ここでの滞在を楽しんで"
+"ください。\n"
+"  </p>\n"
+"  "
+
+#: thatcomputerscientist/settings.py:232
+msgid "English"
+msgstr ""
+
+#: thatcomputerscientist/settings.py:233
+msgid "Japanese"
+msgstr ""
diff --git a/middleware/i18nmiddleware.py b/middleware/i18nmiddleware.py
new file mode 100644
index 00000000..4014ca46
--- /dev/null
+++ b/middleware/i18nmiddleware.py
@@ -0,0 +1,17 @@
+from django.utils.translation import activate
+from django.utils.deprecation import MiddlewareMixin
+
+
+class I18NMiddleware(MiddlewareMixin):
+    def process_request(self, request):
+        language = request.COOKIES.get("site_language")
+        if language:
+            activate(language)
+        else:
+            activate("en")
+        request.LANGUAGE_CODE = language
+
+    def process_response(self, request, response):
+        if not request.COOKIES.get("site_language"):
+            response.set_cookie("site_language", "en")
+        return response
diff --git a/static/js/globals.js b/static/js/globals.js
index c10d9016..9ac8ee7d 100644
--- a/static/js/globals.js
+++ b/static/js/globals.js
@@ -7,13 +7,21 @@ gtag("js", new Date());
 gtag("config", "G-72XTC500FR");
 
 function changeLang(lang) {
-  if (lang === "ja") {
-    translateJapanese();
-  } else {
-    restoreLang();
-  }
+  var date = new Date();
+  date.setTime(date.getTime() + (30 * 24 * 60 * 60 * 1000)); // 30 days
+  var expires = "expires=" + date.toUTCString();
+
+  // Set the cookie
+  document.cookie = "site_language=" + lang + ";" + expires + ";path=/";
+
+  // Debugging: Print cookie value
+  console.log("Cookie set: site_language=" + lang);
+
+  // Reload the page to apply the new language
+  location.reload();
 }
 
+
 function copyToClipboard(text) {
   $("body").append(
     '<input type="text" value="' + text + '" id="copyToClipboard">'
diff --git a/templates/blog/home.html b/templates/blog/home.html
index fd7de6b7..739c5227 100644
--- a/templates/blog/home.html
+++ b/templates/blog/home.html
@@ -1,9 +1,13 @@
 {% extends 'blog/partials/base.html' %} {% block content %}
 {% load static %}
+{% load i18n %}
 <link rel="stylesheet" href="{% static 'css/home.css' %}">
 <div id="welcome" class="mtctitem">
+  {% url 'blog:user_activity' 'bobby' as bobby_profile_url %}
+  {% url 'blog:register' as register_url %}
+  {% blocktrans %}
   <p>
-    Welcome to the home of <b>Shifoo</b> (previously <i>That Computer Scientist</i>). My name is <a href="{% url 'blog:user_activity' 'bobby' %}">@bobby</a>, and this is my personal
+    Welcome to the home of <b>Shifoo</b> (previously <i>That Computer Scientist</i>). My name is <a href="{{ bobby_profile_url }}">@bobby</a>, and this is my personal
     website. I aim to build a retro looking personal website, where I share my thoughts, ideas, and experiences through articles, and will showcase some cool nostalgic features and tools.
   </p>
   <p>
@@ -11,8 +15,9 @@
   </p>
   <p>
     There's also a some of <a href="#fun-stuff">fun stuff</a> you can find in the sidebar, that you can play around with. I will be adding more in the not so distant future.
-    Also, To participate around various sections of the site, you will need to <a href="{% url 'blog:register' %}">register</a> for an account. I hope you enjoy your stay here.
+    Also, To participate around various sections of the site, you will need to <a href="{{ register_url }}">register</a> for an account. I hope you enjoy your stay here.
   </p>
+  {% endblocktrans %}
   <div id="chatbox">
     <div id="messages"></div>
     <textarea id="chatbox-input" placeholder="Type your message here... (⏎ to send)"></textarea>
diff --git a/templates/blog/partials/base.html b/templates/blog/partials/base.html
index 06fd4787..ea517166 100644
--- a/templates/blog/partials/base.html
+++ b/templates/blog/partials/base.html
@@ -159,11 +159,11 @@
   {% comment %}
   <script src="{% static 'js/db.js' %}"></script>
   {% endcomment %}
-  <script
+  {% comment %} <script
     type="text/javascript"
     src="//translate.google.com/translate_a/element.js?cb=googleTranslateElementInit"
-  ></script>
-  <script src="{% static 'js/tl.js' %}"></script>
+  ></script> {% endcomment %}
+  {% comment %} <script src="{% static 'js/tl.js' %}"></script> {% endcomment %}
   {% if request.COOKIES.summonOneko == 'true' %}
   <script src="{% static 'js/oneko.js' %}"></script>
   {% endif %} {% block scripts %} {% endblock %}
diff --git a/templates/blog/partials/sidebar.html b/templates/blog/partials/sidebar.html
index dc32eb35..458ddbee 100644
--- a/templates/blog/partials/sidebar.html
+++ b/templates/blog/partials/sidebar.html
@@ -134,8 +134,13 @@
                 <img src="{% static 'images/site/icons/translate.png' %}" alt="Translate" border="0" style="padding: 2px 0px; height: 20px; width: auto;">
             </span>
             <span>
-                <a href="javascript:changeLang('en');" id="tl_ja" style="display: none;" class="notranslate en">English</a>
-                <a href="javascript:changeLang('ja');" id="tl_en" style="display: none;" class="notranslate ja">日本語</a>
+                {% if request.COOKIES.site_language == 'ja' %}
+                    <a href="javascript:changeLang('en');" class="notranslate en">English</a>
+                {% endif %}
+
+                {% if request.COOKIES.site_language == 'en' or not request.COOKIES.site_language %}
+                    <a href="javascript:changeLang('ja');" class="notranslate ja">日本語</a>
+                {% endif %}
             </span>
         </li>
     </ul>
diff --git a/thatcomputerscientist/settings.py b/thatcomputerscientist/settings.py
index 124b142c..b92136ce 100644
--- a/thatcomputerscientist/settings.py
+++ b/thatcomputerscientist/settings.py
@@ -12,6 +12,7 @@ https://docs.djangoproject.com/en/4.0/ref/settings/
 
 import os
 from pathlib import Path
+from django.utils.translation import gettext_lazy as _
 
 from dotenv import load_dotenv
 
@@ -103,6 +104,7 @@ MIDDLEWARE = [
     "django_hosts.middleware.HostsRequestMiddleware",
     "django.middleware.security.SecurityMiddleware",
     "django.contrib.sessions.middleware.SessionMiddleware",
+    "django.middleware.locale.LocaleMiddleware",
     "django.middleware.common.CommonMiddleware",
     "django.middleware.csrf.CsrfViewMiddleware",
     "django.contrib.auth.middleware.AuthenticationMiddleware",
@@ -113,9 +115,14 @@ MIDDLEWARE = [
     "middleware.globalmetamiddleware.GlobalMetaMiddleware",
     "middleware.ignismiddleware.IgnisMiddleware",
     "middleware.uuidmiddleware.UserUUIDMiddleware",
+    "middleware.i18nmiddleware.I18NMiddleware",
     "django_hosts.middleware.HostsResponseMiddleware",
 ]
 
+LOCALE_PATHS = [
+    os.path.join(BASE_DIR, "locale"),
+]
+
 CONFIGURED_SUBDOMAINS = {
     "": "thatcomputerscientist",
     "*": "userpages",
@@ -213,7 +220,7 @@ SESSION_ENGINE = "django.contrib.sessions.backends.cache"
 # Internationalization
 # https://docs.djangoproject.com/en/4.0/topics/i18n/
 
-LANGUAGE_CODE = "en-us"
+LANGUAGE_CODE = "en"
 
 TIME_ZONE = "UTC"
 
@@ -221,6 +228,10 @@ USE_I18N = True
 
 USE_TZ = True
 
+LANGUAGES = (
+    ("en", _("English")),
+    ("ja", _("Japanese"))
+)
 
 # Static files (CSS, JavaScript, Images)
 # https://docs.djangoproject.com/en/4.0/howto/static-files/