Initial Bedrock support! :D

.gitignore

@@ -1,3 +1,4 @@
 node_modules/
+node_modules_windows/
 start.bat
-out/
+out/

html/js/jsonTree.js

@@ -4,7 +4,7 @@
  *
  * Copyright 2017 Vera Lobacheva (http://iamvera.com)
  * Released under the MIT license (LICENSE.txt)
- * Modied for Pakkit because the original seems to be abandoned and doesn't escape HTML properly
+ * Modified for Pakkit because the original seems to be abandoned and doesn't escape HTML properly
  */
 
 const escapeHtml = require('escape-html');
@@ -226,9 +226,9 @@ var jsonTree = (function() {
             template = function(label, val) {
                 var str = '\
                     <span class="jsontree_label-wrapper">\
-                        <span class="jsontree_label">"' +
-                            escapeHtml(label) +
-                        '"</span> : \
+                        <span class="jsontree_label">' +
+                            escapeHtml(JSON.stringify(label)) +
+                        '</span> : \
                     </span>\
                     <span class="jsontree_value-wrapper">\
                         <span class="jsontree_value jsontree_value_' + self.type + '">' +

html/mainPage/index.html

@@ -43,7 +43,7 @@
       <div class="whenPacketSelected">
         <div style="padding: 8px 0;">Quick actions</div>
         <button style="width: 200px;" onclick="hideAll(currentPacket)">Hide all packets of this type</button>
-        <button style="width: 200px;" onclick="editAndResend(currentPacket)">Edit and resend</button>
+        <button id="editAndResend" style="width: 200px;" onclick="editAndResend(currentPacket)">Edit and resend</button>
       </div>
     </div>
 

html/mainPage/script.js

@@ -2,9 +2,21 @@ const { ipcRenderer } = require('electron');
 const Clusterize = require('clusterize.js');
 // const escapeHtml = require('escape-html'); Already defined in my customised version of jsonTree (I just added HTML escaping)
 
+const proxyCapabilities = JSON.parse(ipcRenderer.sendSync('proxyCapabilities', ''));
+
+if (!proxyCapabilities.modifyPackets) {
+  document.getElementById("editAndResend").style.display = "none";
+}
+
 var currentPacket = undefined;
 var currentPacketType = undefined;
-var hiddenPackets = []; // ["update_time", "position", "position", "keep_alive", "keep_alive", "rel_entity_move", "position_look", "look", "position_look", "map_chunk", "update_light", "entity_action", "entity_update_attributes", "unload_chunk", "unload_chunk", "update_view_position", "entity_metadata"];
+var hiddenPackets = [
+  // TODO: Do this properly
+  // JE
+  "update_time", "position", "position", "keep_alive", "keep_alive", "rel_entity_move", "position_look", "look", "position_look", "map_chunk", "update_light", "entity_action", "entity_update_attributes", "unload_chunk", "unload_chunk", "update_view_position", "entity_metadata",
+  // BE
+  "network_stack_latency_packet", "level_chunk_packet", "move_player_packet", "player_auth_input_packet", "network_chunk_publisher_update_packet", "client_cache_blob_status_packet", "client_cache_miss_response_packet", "move_entity_delta_packet", "set_entity_data_packet", "set_time_packet", "set_entity_data_packet", "set_entity_motion_packet", "add_entity_packet", "level_event_packet", "level_sound_event2_packet", "update_attributes_packet", "entity_event_packet", "remove_entity_packet", "mob_armor_equipment_packet", "mob_equipment_packet", "update_block_packet", "player_action_packet"
+];
 var dialogOpen = false;
 
 var allPackets = [];
@@ -62,6 +74,7 @@ function refreshPackets() {
       packetsAdded++;
     }
   } */
+  var allPacketsHTML = [];
   allPackets.forEach(function(packet) {
     // noUpdate is true as we want to manually update at the end
     addPacketToDOM(packet, true);
@@ -86,12 +99,12 @@ function addPacketToDOM(packet, noUpdate) {
       <span class="name">${escapeHtml(packet.meta.name)}</span>
       <span class="data">${escapeHtml(trimData(packet.data))}</span>
     </li>`]);
-  if (!noUpdate) {
+  /* if (!noUpdate) {
     clusterize.append(allPacketsHTML.slice(-1)[0]);
     if (wasScrolledToBottom) {
       packetlist.parentElement.scrollTop = packetlist.parentElement.scrollHeight;
     }
-  }
+  } */
   packetsUpdated = true;
     // packetlist.style.paddingTop =  offScreenCount * 30 + "px"; // TODO: Make it so you can view these packets
   /* if (offScreenCount % 2 == 0) {
@@ -152,6 +165,11 @@ function resendEdited(id, newValue) {
 }
 
 function editAndResend(id) {
+  if (!proxyCapabilities.modifyPackets) {
+    alert("Edit and Resend is unavailable");
+    return;
+  }
+
   dialogOpen = true;
   document.getElementById("dialog-overlay").className = "dialog-overlay active";
   document.getElementById("dialog").innerHTML =

html/mainPage/style.css

@@ -135,7 +135,15 @@ div.dialog {
   text-decoration: none;
 }
 
-
+#tabcontent {
+  box-sizing: border-box;
+  position: fixed;
+  height: calc(100% - 48px);
+  width: calc(100% - 16px);
+  z-index: 1;
+  display: block;
+  background: rgb(36, 36, 36);
+}
 
 
 

html/startPage/index.html

@@ -11,19 +11,19 @@
   </head>
   <body>
     <h1 class='title'>pakkit</h1>
-    pakkit is an advanced packet monitor proxy for Minecraft: Java Edition <s>and Minecraft: Bedrock Edition</s> based on node-minecraft-protocol<s> and ProxyPass</s>. <b>Bedrock support coming soon (hopefully)</b>
+    pakkit is an advanced packet monitor proxy for Minecraft: Java Edition nd Minecraft: Bedrock Edition based on node-minecraft-protocol and ProxyPass.
     <br><br>
     <form onsubmit="startProxy(event)">
       <p>
         <label for="platform">Platform:</label>
-        <select id="platform" disabled style="width: 191px;">
+        <select id="platform" style="width: 191px;">
           <option value="java">Java Edition</option>
-          <option value="bedrock">Bedrock Edition</option>
+          <option value="bedrock">Bedrock Edition (beta)</option>
         </select>
       </p>
       <br>
       <p>
-        <label for="version">Version:</label>
+        <label for="version">Version (Java Edition only):</label>
         <select id="version" style="width: 191px;">
           <option value="1.15.2">1.15.2 (latest)</option>
           <option value="1.14.4">1.14.4</option>

html/startPage/script.js

@@ -4,13 +4,19 @@ const { ipcRenderer } = require('electron')
 new customTitlebar.Titlebar({
     backgroundColor: customTitlebar.Color.fromHex('#FFF')
 }); */
+var isLoading = false;
 
 function startProxy(event) {
+  if (isLoading) {
+    return;
+  }
+  isLoading = true;
   event.preventDefault();
   ipcRenderer.send('startProxy', JSON.stringify({
     connectAddress: document.getElementById("connect-address").value,
     connectPort: document.getElementById("connect-port").value,
     listenPort: document.getElementById("listen-port").value,
-    version: document.getElementById("version").value
+    platform: document.getElementById("platform").value,
+    version: document.getElementById("version").value,
   }))
 }