Merge pull request #1 from rishabkumar7/english-translation

English translation

README.md

@@ -1,23 +1,24 @@
 # uptime-status
 
-一个基于 UptimeRobot API 的在线状态面板
+A Status page based UptimeRobot API.
+This project is fork of the [yb/uptime-status](https://github.com/yb/uptime-status) for translation to English.
 
 <img width="1152" alt="image" src="https://user-images.githubusercontent.com/25887822/178935137-6d23521d-5894-4fb8-922d-3575be4f7abc.png">
 
-## 事先准备
+## Prerequisites
 
-- 您需要先到 [UptimeRobot](https://uptimerobot.com/ "UptimeRobot") 添加站点监控，并在 My Settings 页面获取 API Key
-- 您需要拥有一个网站空间，常见的 Nginx / PHP 等空间即可，甚至是阿里云的 OSS 等纯静态空间也行
+- You need to add site monitoring on [UptimeRobot](https://uptimerobot.com/ "UptimeRobot") and get the API Key from the My Settings page.
+- You need to have a hosting provider, even static web-page hosting works.
 
-## 如何部署：
+## How to deploy:
 
-- 下载并解压缩：[uptime-status.zip](https://github.com/yb/uptime-status/releases/latest/download/uptime-status.zip "uptime-status.zip") 
-- 修改 `config.js` 文件：
-   - `SiteName`: 要显示的网站名称
-   - `ApiKeys`: 从 UptimeRobot 获取的 API Key，支持 Monitor-Specific API Keys 和 Read-Only API Key
-   - `CountDays`: 要显示的日志天数，建议 60 或 90，显示效果比较好
-   - `ShowLink`: 是否显示站点链接
-   - `Navi`: 导航栏的菜单列表
-- 将所有文件上传到网站空间
+- Download and unzip: [uptime-status.zip](https://github.com/yb/uptime-status/releases/latest/download/uptime-status.zip "uptime-status.zip") 
+- Modify the `config.js` file:
+   - `SiteName`: The name of the website to display
+   - `ApiKeys`: The API Key obtained from UptimeRobot, supports Monitor-Specific API Keys and Read-Only API Key
+   - `CountDays`: The number of log days to display, 60 or 90 are recommended for better display
+   - `ShowLink`: Whether to display site links
+   - `Navi`: The menu list of the navigation bar
+- Upload all files to the hosting service.
 
-⚠️ 如果没有修改代码的需求，您不需要 git clone 本项目，只需要下载 Release 的文件包即可。
+⚠️ If you do not need to modify the code, you do not need to git clone this project, you only need to download the Release file package.

public/config.js

@@ -1,36 +1,36 @@
 window.Config = {
 
-  // 显示标题
-  SiteName: 'Public Status',
+  // Site Title
+  SiteName: 'Uptime Status',
 
-  // UptimeRobot Api Keys
-  // 支持 Monitor-Specific 和 Read-Only
+  // UptimeRobot API Keys
+  // Support Monitor-Specific Read-Only Keys
   ApiKeys: [
     'm784488775-dd1ad84b209c05f8e185c33e',
     'm784490063-7b5da437e7f1e0d67613714d',
     'm784497419-de55aa09902ccb3ab22d548a',
     'm784496436-71a4bf7b1e3bdf7756be131b',
   ],
 
-  // 日志天数
+  // Days
   CountDays: 90,
 
-  // 是否显示检测站点的链接
+  // Display link to sites
   ShowLink: true,
 
-  // 导航栏菜单
+  // Navigation
   Navi: [
     {
       text: 'Homepage',
       url: 'https://status.org.cn/'
     },
     {
       text: 'GitHub',
-      url: 'https://github.com/yb/uptime-status'
+      url: 'https://github.com/rishabkumar7/uptime-status'
     },
     {
       text: 'Blog',
-      url: 'https://abo.xyz/'
+      url: 'https://blog.rishabkumar.com/'
     },
   ],
 };

src/common/helper.js

@@ -14,8 +14,8 @@ export function formatDuration(seconds) {
       m = parseInt(m % 60);
     }
   }
-  let text = `${s} 秒`;
-  if (m > 0) text = `${m} 分 ${text}`;
-  if (h > 0) text = `${h} 小时 ${text}`;
+  let text = `${s} sec`;
+  if (m > 0) text = `${m} min ${text}`;
+  if (h > 0) text = `${h} hr ${text}`;
   return text;
 }

src/components/app.js

@@ -23,8 +23,8 @@ function App() {
           ))}
         </div>
         <div id='footer'>
-          <p>基于 <Link to='https://uptimerobot.com/' text='UptimeRobot' /> 接口制作，检测频率 5 分钟</p>
-          <p>&copy; 2020 <Link to='https://status.org.cn/' text='STATUS.ORG.CN' />, Version {Package.version}</p>
+          <p>Based on <Link to='https://uptimerobot.com/' text='UptimeRobot' /> detection interval 5 minute.</p>
+          <p>&copy; 2024 <Link to ='https://rishabkumar.com' text='Rishab Kumar' /> fork of <Link to='https://status.org.cn/' text='STATUS.ORG.CN' />, Version {Package.version}</p>
         </div>
       </div>
     </>

src/components/uptimerobot.js

@@ -7,9 +7,9 @@ import Link from './link';
 function UptimeRobot({ apikey }) {
 
   const status = {
-    ok: '正常',
-    down: '无法访问',
-    unknow: '未知'
+    ok: 'Normal',
+    down: 'Down',
+    unknow: 'Unknown'
   };
 
   const { CountDays, ShowLink } = window.Config;
@@ -33,25 +33,25 @@ function UptimeRobot({ apikey }) {
           let text = data.date.format('YYYY-MM-DD ');
           if (data.uptime >= 100) {
             status = 'ok';
-            text += `可用率 ${formatNumber(data.uptime)}%`;
+            text += `Availability ${formatNumber(data.uptime)}%`;
           }
           else if (data.uptime <= 0 && data.down.times === 0) {
             status = 'none';
-            text += '无数据';
+            text += 'No data';
           }
           else {
             status = 'down';
-            text += `故障 ${data.down.times} 次，累计 ${formatDuration(data.down.duration)}，可用率 ${formatNumber(data.uptime)}%`;
+            text += `Failure ${data.down.times} times, total ${formatDuration(data.down.duration)}, availability ${formatNumber(data.uptime)}%`;
           }
           return (<i key={index} className={status} data-tip={text} />)
         })}
       </div>
       <div className='summary'>
-        <span>今天</span>
+        <span>Today</span>
         <span>
-          {site.total.times
-            ? `最近 ${CountDays} 天故障 ${site.total.times} 次，累计 ${formatDuration(site.total.duration)}，平均可用率 ${site.average}%`
-            : `最近 ${CountDays} 天可用率 ${site.average}%`}
+        {site.total.times
+            ? `Last ${CountDays} days, failure ${site.total.times} times, total ${formatDuration(site.total.duration)}, average availability ${site.average}%`
+            : `Last ${CountDays} days, availability ${site.average}%`}
         </span>
         <span>{site.daily[site.daily.length - 1].date.format('YYYY-MM-DD')}</span>
       </div>