New homepage for ja

app/[locale]/components/Footer/Footer.tsx

@@ -3,6 +3,7 @@
 import Link from 'next/link'
 import styles from './Footer.module.css'
 import { useTranslations } from 'next-intl'
+import { docsRedirect } from '@/docsRedirect'
 
 const Footer = () => {
   const t = useTranslations('footer')
@@ -18,9 +19,9 @@ const Footer = () => {
     {
       title: t('development'),
       links: [
-        { href: 'https://docs.openwebgal.com/', label: t('gameDevelopDoc') },
-        { href: 'https://docs.openwebgal.com/developers', label: t('contribute') },
-        { href: 'https://docs.openwebgal.com/tech', label: t('technical') }
+        { href: docsRedirect('/'), label: t('gameDevelopDoc') },
+        { href: docsRedirect('/developers'), label: t('contribute') },
+        { href: docsRedirect('/tech'), label: t('technical') }
       ],
     },
     {
@@ -40,7 +41,7 @@ const Footer = () => {
     {
       title: t('sponsor'),
       links: [
-        { href: 'https://docs.openwebgal.com/sponsor/', label: t('sponsor') },
+        { href: docsRedirect('/sponsor'), label: t('sponsor') },
       ],
     },
   ]

app/[locale]/components/Navbar/Nav.tsx

@@ -2,6 +2,7 @@ import { RiMenuFill } from 'react-icons/ri'
 import styles from './Nav.module.css'
 import Link from 'next/link'
 import { useTranslations } from 'next-intl'
+import { docsRedirect } from '@/docsRedirect'
 
 const Nav = ({ locale, pathname }: { locale: string, pathname: string }) => {
 
@@ -11,7 +12,7 @@ const Nav = ({ locale, pathname }: { locale: string, pathname: string }) => {
     { label: t('home'), href: `/${locale}/` },
     { label: t('download'), href: `/${locale}/download/` },
     { label: t('demo'), href: 'https://demo.openwebgal.com/' },
-    { label: t('document'), href: 'https://docs.openwebgal.com/' },
+    { label: t('document'), href: docsRedirect('/') },
     { label: t('games'), href: `/${locale}/games/` }
   ]
 

app/[locale]/components/TopVisual/TopVisual.tsx

@@ -4,6 +4,7 @@ import Link from 'next/link'
 import styles from './TopVisual.module.css'
 import Image from 'next/image'
 import { useEffect, useState } from 'react'
+import { docsRedirect } from '@/docsRedirect'
 
 const TopVisual = () => {
   const t = useTranslations('home')
@@ -20,11 +21,6 @@ const TopVisual = () => {
     },
   ]
 
-  // Depending on the language type of the browser, get the URL of docs
-  const docsURL = () => {
-    return `https://docs.openwebgal.com${ locale === 'zh-cn' ? '' : `/${locale}/` }`
-  }
-
   const [topVisualImageIndex, setTopVisualImageIndex] = useState(0)
 
   useEffect(() => {
@@ -55,7 +51,7 @@ const TopVisual = () => {
               <Link href={`/${locale}/download/`} >{t('nowDownload')}</Link>
             </Button>
             <Button>
-              <Link href={docsURL()} target={'_blank'}>{t('viewDocument')}</Link>
+              <Link href={docsRedirect('/')} target={'_blank'}>{t('viewDocument')}</Link>
             </Button>
           </div>
         </div>

app/[locale]/components/WebGALGames/WebGALGames.tsx

@@ -1,6 +1,7 @@
 import Button from '@/app/components/Button/Button'
 import GameCard from '@/app/components/GameCard/GameCard'
 import { gamesData, homeGamesId } from '@/data/gamesData'
+import { docsRedirect } from '@/docsRedirect'
 import { gamesDataSort } from '@/utils'
 import { useLocale, useTranslations } from 'next-intl'
 import Link from 'next/link'
@@ -9,11 +10,6 @@ const WebGALGames = () => {
   const t = useTranslations('games')
   const locale = useLocale()
 
-  // Depending on the language type of the browser, get the URL of showcase-your-game
-  const showcaseYourGameURL = () => {
-    return `https://docs.openwebgal.com${ locale === 'zh-cn' ? '' : `/${locale}` }/guide/showcase-your-game`
-  }
-
   return (
     <div className={'flex flex-col flex-wrap justify-center item-center py-4 pb-8 gap-4 text-center bg-white'}>
       <div className={'w-full pt-2'}>
@@ -31,7 +27,7 @@ const WebGALGames = () => {
       </div>
       <div className={'grid grid-cols-2 gap-4 px-4 max-w-fit mx-auto'}>
         <Button>
-          <Link href={showcaseYourGameURL()} target={'_blank'}> {t('showCaseYourGame')}</Link>
+          <Link href={docsRedirect('/guide/showcase-your-game')} target={'_blank'}> {t('showCaseYourGame')}</Link>
         </Button>
         <Button>
           <Link href={`/${locale}/games/`}> {t('viewMoreGames')}</Link>

app/[locale]/download/components/ReadFirst.tsx

@@ -3,6 +3,7 @@
 import { useTranslations } from 'next-intl'
 import styles from '../Download.module.css'
 import Link from 'next/link'
+import { docsRedirect } from '@/docsRedirect'
 
 const ReadFirst = () => {
 
@@ -12,7 +13,7 @@ const ReadFirst = () => {
     <div className={styles.card}>
       {/* <h2 className={`${styles['card-title']} border-gray-500`}>{t('title')}</h2> */}
       <div className={'text-sm font-light space-y-1'}>
-        <p>{t('firstUse.part0')} <Link href={'https://docs.openwebgal.com/guide/'} target={'_blank'}>{t('firstUse.part1')}</Link> {t('firstUse.part2')}</p>
+        <p>{t('firstUse.part0')} <Link href={docsRedirect('/guide')} target={'_blank'}>{t('firstUse.part1')}</Link> {t('firstUse.part2')}</p>
         <p>{t('getHelp')}</p>
         <p>{t('webGALScriptBasics.part0')} <Link href={'https://marketplace.visualstudio.com/items?itemName=c6h5-no2.webgal-script-basics'} target={'_blank'}>WebGAL Script Basics</Link> {t('webGALScriptBasics.part1')}</p>
       </div>

docsRedirect.ts

@@ -0,0 +1,10 @@
+import { useLocale } from 'next-intl'
+
+export const docsRedirect = (
+  label: '/' | '/developers' | '/tech' | '/sponsor' | '/guide' | '/guide/showcase-your-game'
+) => {
+  const docsPath = 'https://docs.openwebgal.com'
+  const locale = useLocale()
+  const localePath = locale === 'zh-cn' ? docsPath : `${docsPath}/${locale}`
+  return `${localePath}${label}`
+}

locales/ja.json

@@ -60,14 +60,14 @@
       "nowDownload": "WebGAL を今すぐダウンロード"
     },
     "openSource": {
-      "title": "Open Source",
-      "line0": "WebGAL and WebGAL Terre are licensed under the MPL-2.0",
-      "line1": "Free to use for non-commercial and commercial projects"
+      "title": "オープンソース & 商業利用フリー",
+      "line0": "WebGAL および WebGAL Terre は MPL-2.0 の下でライセンスされている",
+      "line1": "商用・非商用問わず無料"
     },
     "multiplatform": {
-      "title": "Multi Platform",
-      "line0": "WebGAL Terre support Windows / macOS / Linux",
-      "line1": "Export game support Web / Windows / macOS / Linux / android"
+      "title": "マルチプラットフォームのサポート",
+      "line0": "WebGAL Terre が Windows / macOS / Linux での開発をサポート",
+      "line1": "開発したゲームは Web / Windows / macOS / Linux / Android でプレイできる"
     }
   },
   "download": {
@@ -89,34 +89,34 @@
     "systemRequirements": {
       "title": "システム要件",
       "system": "OS: Windows 10+ / macOS 10.14+ / Linux デスクトップ",
-      "browser": "Webブラウザ: Google Chrome / Mozilla Firefox / Microsoft Edge / その他"
+      "browser": "Web ブラウザ: Google Chrome / Mozilla Firefox / Microsoft Edge / その他"
     },
     "readFirst": {
-      "title": "More Info",
+      "title": "詳細情報",
       "firstUse": {
-        "part0": "If this is your first using WebGAL, please see the",
-        "part1": "WebGAL Game Development Guide",
-        "part2": "learn to develop games"
+        "part0": "WebGAL を初めて使用する場合は、",
+        "part1": "WebGAL ゲーム開発ガイド",
+        "part2": "を参照してください。"
       },
-      "getHelp": "If you encounter problems during development, please see the game development guide first, and if you can't solve them, please go to GitHub or the community to get help",
+      "getHelp": "開発中に問題が発生した場合は、まずゲーム開発ガイドを参照し、解決できない場合は GitHub またはコミュニティにアクセスしてサポートを受けてください。",
       "webGALScriptBasics": {
-        "part0": "If you are developing in Visual Studio Code, you can install the",
-        "part1": "plugin for syntax highlighting"
+        "part0": "Visual Studio Code を使用して開発する場合、構文の強調表示のために",
+        "part1": "プラグインをインストールすることをお勧めします。"
       }
     }
   },
   "license": {
-    "title": "License",
+    "title": "ライセンス",
     "line0": {
-      "part0": "WebGAL and WebGAL Terre are licensed under the",
-      "part1": ""
+      "part0": "WebGAL および WebGAL Terre は",
+      "part1": "の下でライセンスされています。"
     },
-    "line1": "Free to use for non-commercial and commercial projects",
-    "line2": "Users must also comply with the following additional terms:",
+    "line1": "商用・非商用問わず利用することができます",
+    "line2": "ユーザーは、下記の内容を守って頂く必要があります。",
     "additional": {
-      "line0": "\" this Software \" means WebGAL and WebGAL Terre",
-      "line1": "Works developed using this software must be distributed with the WebGAL copyright notice intact",
-      "line2": "The use of this software is at the user's own risk"
+      "line0": "「本ソフトウェア」とは、WebGAL および WebGAL Terre を意味します。",
+      "line1": "本ソフトウェアを使用して開発された著作物は、配布時に WebGAL に関する著作権表示を記載する必要があります。",
+      "line2": "本ソフトウェアの使用に起因するすべてのリスクは、ユーザーが負担するものとします。"
     }
   },
   "footer": {
@@ -125,7 +125,7 @@
     "community": "コミュニティ",
     "developer": "開発者",
     "sponsor": "スポンサー",
-    "gameDevelopDoc": "Game Develop Document",
+    "gameDevelopDoc": "ゲーム開発ドキュメント",
     "contribute": "コントリビューション",
     "technical": "技術紹介",
     "qqGroup": "QQ グループ",