playerlist fixes

public/client.html

@@ -39,6 +39,7 @@
 	<link rel="stylesheet" type="text/css" href="styles/default.css?v=1.0.1" id="client_theme">
 	<link rel="stylesheet" type="text/css" href="styles/chatbox/aa.css?v=1.0.1" id="chatbox_theme">
 	<link rel="stylesheet" type="text/css" href="styles/nameplates.css" id="nameplate_setting">
+	<link rel="stylesheet" type="text/css" href="styles/nomod.css" id="mod_ui">
 	<link rel="stylesheet" type="text/css" href="" id="effect_css">
 	<link type="text/css" rel="stylesheet" href="golden/css/goldenlayout.css" />
 	<link type="text/css" rel="stylesheet"

webAO/dom/banPlayer.ts

@@ -1,14 +1,27 @@
 import { client } from '../client'
+
 /**
  * Tries to ban a player from the playerlist
  * @param {Number} id the players id
  */
 export function banPlayer(id: number) {
     let reason;
     let length;
-    reason = prompt("Please enter the ban reason", "Being annoying");
+    reason = prompt("Please enter the reason", "Being annoying");
     length = Number(prompt("Please enter the ban length in minutes", "60"));
 
     client.sender.sendMA(id, length, reason);
 }
-window.banPlayer = banPlayer;
+window.banPlayer = banPlayer;
+
+/**
+ * Tries to kick a player from the playerlist
+ * @param {Number} id the players id
+ */
+export function kickPlayer(id: number) {
+    let reason;
+    reason = prompt("Please enter the reason", "Being annoying");
+
+    client.sender.sendMA(id, 0, reason);
+}
+window.kickPlayer = kickPlayer;

webAO/dom/window.ts

@@ -52,6 +52,7 @@ declare global {
         onEnter: (event: any) => void;
         onReplayGo: (_event: any) => void;
         onOOCEnter: (_event: any) => void;
+        kickPlayer: (id: number) => void;
         banPlayer: (id: number) => void;
         hcallback: (_event: any) => void;
     }

webAO/packets/handlers/handleAUTH.ts

@@ -0,0 +1,9 @@
+/** 
+* i am mod now
+* @param {Array} args packet arguments
+*/
+export const handleAUTH = (args: string[]) => {
+    (<HTMLAnchorElement>(
+        document.getElementById("mod_ui")
+    )).href = `styles/mod.css`;
+}

webAO/packets/handlers/handlePR.ts

@@ -1,5 +1,5 @@
 import { client } from "../../client";
-import { banPlayer } from '../../dom/banPlayer'
+import { kickPlayer, banPlayer } from '../../dom/banPlayer'
 
 function addPlayer(playerID: number) {
     const list = <HTMLTableElement>document.getElementById("client_playerlist");
@@ -19,7 +19,13 @@ function addPlayer(playerID: number) {
     const oocNameCell = playerRow.insertCell(3);
     oocNameCell.appendChild(name);
 
-    const banCell = playerRow.insertCell(4);
+    const kickCell = playerRow.insertCell(4);
+    const kick = <HTMLButtonElement>document.createElement("button");
+    kick.innerText = "Kick";
+    kick.onclick = () => { window.kickPlayer(playerID) }
+    kickCell.appendChild(kick);
+
+    const banCell = playerRow.insertCell(5);
     const ban = <HTMLButtonElement>document.createElement("button");
     ban.innerText = "Ban";
     ban.onclick = () => { window.banPlayer(playerID) }

webAO/packets/packets.ts

@@ -27,6 +27,7 @@ import { handleID } from './handlers/handleID'
 import { handlePN } from './handlers/handlePN'
 import { handleSI } from './handlers/handleSI'
 import { handleARUP } from './handlers/handleARUP'
+import { handleAUTH } from './handlers/handleAUTH'
 import { handleaskchaa } from './handlers/handleaskchaa'
 import { handleCC } from './handlers/handleCC'
 import { handleRC } from './handlers/handleRC'
@@ -71,6 +72,7 @@ export const packets = {
     "PN": handlePN,
     "SI": handleSI,
     "ARUP": handleARUP,
+    "AUTH": handleAUTH,
     "askchaa": handleaskchaa,
     "CC": handleCC,
     "RC": handleRC,

webAO/styles/client.css

@@ -563,6 +563,10 @@
 	color: #fff;
 }
 
+#client_playerlist {
+	overflow-y: scroll;
+}
+
 #client_menu {
 	overflow-y: auto;
 	height: 100%;

webAO/styles/mod.css

@@ -0,0 +1,3 @@
+table#client_playerlist td:nth-child(5), td:nth-child(6) {
+  display: inherit;
+}

webAO/styles/nomod.css

@@ -0,0 +1,3 @@
+table#client_playerlist td:nth-child(5), td:nth-child(6) {
+  display: none;
+}