diff --git a/src/App.vue b/src/App.vue
index 6ad1bca..fd29db4 100755
--- a/src/App.vue
+++ b/src/App.vue
@@ -7,7 +7,7 @@
@@ -21,32 +21,45 @@
+
+ Error: {{ loginInfo }}
+
-
-
+
+
+
-
Zhao Zuohong
-
Earth is the third planet from the Sun and the only astronomical
- object known to harbor life.
-
-
-
-
-
-
Zhao Zuohong
-
It is the densest planet in the Solar System and the largest and
- most massive of the four rocky planets.
+ {{ msg.nickname }}
+
+
{{ msg.message }}
-
-
- Button
+
+
+ Button
@@ -56,14 +69,23 @@
import { Component, Vue } from "vue-property-decorator";
import { ipcRenderer } from "electron";
+interface Message {
+ avatar: string;
+ nickname: string;
+ message: string;
+}
+
@Component
export default class App extends Vue {
- private nickname = "";
- private loggedIn = false;
- private error = true;
- get avatarAbbr(): string {
+ private nickname = "Zhao Zuohong";
+ private loggedIn = true;
+ private error = false;
+ private loginInfo = "";
+ private message = "";
+ private messages: Array = [];
+ public avatarAbbr(nickname: string): string {
const chineseChar = new RegExp("[\u4E00-\u9FA5]");
- let firstChar = this.nickname.charAt(0);
+ let firstChar = nickname[0];
if (chineseChar.test(firstChar)) {
return firstChar;
} else {
@@ -71,13 +93,38 @@ export default class App extends Vue {
}
}
public login(): void {
- console.log(this.nickname);
ipcRenderer.send("login", this.nickname);
- ipcRenderer.on("loginStatus", (_, success) => {
+ ipcRenderer.once("loginStatus", (_, success, message) => {
if (success) {
this.loggedIn = true;
+ } else {
+ this.error = true;
+ this.loginInfo = message;
}
});
}
+ public sendMessage(): void {
+ ipcRenderer.send("message", this.message);
+ }
+ mounted(): void {
+ this.messages.push({
+ avatar: "EE",
+ nickname: "EE0000",
+ message:
+ "The Old Spanish Trail half dollar was a commemorative coin struck by the United States Bureau of the Mint in 1935.",
+ });
+ this.messages.push({
+ avatar: "66",
+ nickname: "66CCFF",
+ message:
+ "It was designed by L. W. Hoffecker, a coin dealer who had been the moving force behind the effort for a Gadsden Purchase half dollar, vetoed by President Herbert Hoover in 1930, and he sought another commemorative coin that he could control if authorizing legislation was passed.",
+ });
+ this.messages.push({
+ avatar: "ZH",
+ nickname: "Zhao Zuohong",
+ message:
+ "He chose the travels of Spanish officer Álvar Núñez Cabeza de Vaca in the early 16th century.",
+ });
+ }
}
diff --git a/src/background.ts b/src/background.ts
index 3617a4f..cd5ca00 100755
--- a/src/background.ts
+++ b/src/background.ts
@@ -3,6 +3,9 @@
import { app, protocol, BrowserWindow, ipcMain } from "electron";
import { createProtocol } from "vue-cli-plugin-electron-builder/lib";
import installExtension, { VUEJS_DEVTOOLS } from "electron-devtools-installer";
+
+import net from "net";
+
const isDevelopment = process.env.NODE_ENV !== "production";
// Scheme must be registered before the app is ready
@@ -79,7 +82,24 @@ if (isDevelopment) {
}
}
+let client: net.Socket;
+
ipcMain.on("login", (event, nickname) => {
- event.reply("loginStatus", true);
- console.log(nickname);
+ if (nickname.length <= 3) {
+ event.reply("loginStatus", false, "Nickname too short!");
+ } else {
+ event.reply("loginStatus", true, "");
+ client = net.createConnection({ port: 8000 }, () => {
+ console.log("connected to server.");
+ client.write(`login: ${nickname}\n`);
+ });
+
+ client.on("data", (data) => {
+ console.log(data.toString());
+ });
+ }
+});
+
+ipcMain.on("message", (_, message) => {
+ client.write(message);
});