Create a ServiceObject for a socket

runtime/bin/vmservice/client/deployed/web/index.html

Index: runtime/bin/vmservice/client/deployed/web/index.html
diff --git a/runtime/bin/vmservice/client/deployed/web/index.html b/runtime/bin/vmservice/client/deployed/web/index.html
index f2eb2b51d3cde9c9f8c3895820834234c91dec81..45640c8f58099b70d8066b5bed587fc3c4e2fdbe 100644
--- a/runtime/bin/vmservice/client/deployed/web/index.html
+++ b/runtime/bin/vmservice/client/deployed/web/index.html
@@ -7973,30 +7973,86 @@ hr {
     </nav-bar>
 
     <div class="content">
-      <h1>Socket</h1>
-
-      <br>
-
-      <div class="memberList">
-        <template if="{{ socket['owner'] != null }}">
+      <!-- Pipe Socket -->
+      <template if="{{ socket.isPipe }}">
+        <h1>Pipe Socket</h1>
+        <div class="memberList">
+          <template if="{{ socket.socketOwner != null }}">
+            <div class="memberItem">
+              <div class="memberName">Owner</div>
+              <div class="memberValue"><io-ref ref="{{ socket.socketOwner }}"></io-ref></div>
+            </div>
+          </template>
           <div class="memberItem">
-            <div class="memberName">Owner</div>
-            <div class="memberValue"><io-ref ref="{{ socket['owner'] }}"></io-ref></div>
+            <div class="memberName">File descriptor</div>
+            <div class="memberValue">{{ socket.fd }}</div>
+          </div>
+          <div class="memberItem">
+            <div class="memberName">Read Closed</div>
+            <div class="memberValue">{{ socket.readClosed }}</div>
+          </div>
+          <div class="memberItem">
+            <div class="memberName">Write Closed</div>
+            <div class="memberValue">{{ socket.writeClosed }}</div>
+          </div>
+          <div class="memberItem">
+            <div class="memberName">Closing</div>
+            <div class="memberValue">{{ socket.closing }}</div>
           </div>
-        </template>
-        <div class="memberItem">
-          <div class="memberName">Address</div>
-          <div class="memberValue">{{ socket['address'] }}</div>
-        </div>
-        <div class="memberItem">
-          <div class="memberName">Port</div>
-          <div class="memberValue">{{ socket['port'] }}</div>
         </div>
-        <div class="memberItem">
-          <div class="memberName">File descriptor</div>
-          <div class="memberValue">{{ socket['fd'] }}</div>
+      </template>
+      <!-- Network Socket -->
+      <template if="{{ !socket.isPipe }}">
+        <h1>Network Socket</h1>
+        <div class="memberList">
+          <template if="{{ socket.socketOwner != null }}">
+            <div class="memberItem">
+              <div class="memberName">Owner</div>
+              <div class="memberValue"><io-ref ref="{{ socket.socketOwner }}"></io-ref></div>
+            </div>
+          </template>
+          <div class="memberItem">
+            <div class="memberName">Local Address</div>
+            <div class="memberValue">{{ socket.localAddress }}</div>
+          </div>
+          <div class="memberItem">
+            <div class="memberName">Local Port</div>
+            <div class="memberValue">{{ socket.localPort }}</div>
+          </div>
+          <div class="memberItem">
+            <div class="memberName">Remote Address</div>
+            <div class="memberValue">{{ socket.remoteAddress }}</div>
+          </div>
+          <div class="memberItem">
+            <div class="memberName">Remote Port</div>
+            <div class="memberValue">{{ socket.remotePort }}</div>
+          </div>
+          <div class="memberItem">
+            <div class="memberName">File descriptor</div>
+            <div class="memberValue">{{ socket.fd }}</div>
+          </div>
+          <div class="memberItem">
+            <div class="memberName">Read Closed</div>
+            <div class="memberValue">{{ socket.readClosed }}</div>
+          </div>
+          <div class="memberItem">
+            <div class="memberName">Write Closed</div>
+            <div class="memberValue">{{ socket.writeClosed }}</div>
+          </div>
+          <div class="memberItem">
+            <div class="memberName">Closing</div>
+            <div class="memberValue">{{ socket.closing }}</div>
+          </div>
+          <div class="memberItem">
+            <div class="memberName">Listening</div>
+            <div class="memberValue">{{ socket.listening }}</div>
+          </div>
+          <div class="memberItem">
+            <div class="memberName">Protocol</div>
+            <div class="memberValue">{{ socket.protocol }}</div>
+          </div>
         </div>
-      </div>
+      </template>
     </div>
     <br>
     <hr>