Added prompt functionality to webclient using the msg 'prompt' keyword functionality

src/server/portal/websocket_client.py

@@ -122,6 +122,8 @@ class WebSocketClient(Protocol, Session):
             oobstruct = self.sessionhandler.oobstruct_parser(kwargs.pop("oob"))
             #print "oob data_out:", "OOB" + json.dumps(oobstruct)
             self.sendLine("OOB" + json.dumps(oobstruct))
+        if "prompt" in kwargs:
+            self.sendLine("PROMPT" + kwargs["prompt"])
         raw = kwargs.get("raw", False)
         nomarkup = kwargs.get("nomarkup", False)
         if raw:

src/web/webclient/static/webclient/css/webclient.css

@@ -45,6 +45,9 @@ div {margin:0px;}
 /* Error messages (red) */
 .err { color: #f00 }
 
+/* Prompt base (white) */
+.prompt {color: #fff }
+
 /* Style specific classes corresponding to formatted, narative text. */
 .red { color: red; }
 .maroon { color: maroon; }
@@ -107,7 +110,6 @@ div {margin:0px;}
   float: left;
   width: 87%;}
 
-
 #inputfield:focus {
   outline: 0 }
 
@@ -126,6 +128,10 @@ div {margin:0px;}
   font-size: 1.1em;
   font-family: 'DejaVu Sans Mono', Consolas, Inconsolata, 'Lucida Console', monospace }
 
+/* prompt area above input field */
+#prompt {
+  margin-top: .8em;}
+
 /* No javascript warning */
 #connecting {
   padding: .5em .9em }

src/web/webclient/static/webclient/js/evennia_websocket_webclient.js

@@ -75,7 +75,7 @@ function onOpen(evt) {
     doShow("sys", "Using websockets - connected to " + wsurl + ".")
 
     setTimeout(function () {
-        $("#playercount").fadeOut('slow', doSetSizes);
+        $("#numplayers").fadeOut('slow', doSetSizes);
     }, 10000);
 }
 
@@ -106,6 +106,11 @@ function onMessage(evt) {
             }
         }
     }
+    else if (inmsg.length >= 6 && inmsg.substr(0, 6) == "PROMPT") {
+        // handle prompt
+        var game_prompt = inmsg.slice(6);
+        doPrompt("prompt", game_prompt);
+    }
     else {
         // normal message
         doShow('out', inmsg); }
@@ -172,6 +177,11 @@ function doShow(type, msg){
     $('#messagewindow').animate({scrollTop: $('#messagewindow')[0].scrollHeight});
 }
 
+function doPrompt(type, msg){
+    // Display prompt
+    $('#prompt').replaceWith(
+            "<div id='prompt' class='msg "+ type +"'>" + msg + "</div>");
+}
 
 function doSetSizes() {
     // Sets the size of the message window
@@ -179,7 +189,6 @@ function doSetSizes() {
     //var win_w = $('#wrapper').width();
     var inp_h = $('#inputform').outerHeight(true);
     //var inp_w = $('#inputsend').outerWidth(true);
-
     $("#messagewindow").css({'height': win_h - inp_h - 1});
     //$("#inputfield").css({'width': win_w - inp_w - 20});
 }

src/web/webclient/templates/webclient.html

@@ -16,6 +16,10 @@
     <!--for offline testing, download the jquery library from jquery.com-->
     <!--script src="/media/javascript/jquery-1.11.1.js" type="text/javascript" charset="utf-8"></script-->
 
+    <script type="text/javascript" charset="utf-8">
+        if(!window.jQuery){document.write("<div class='err'>jQuery library not found or the online version could not be reached.</div>");}
+    </script>
+
     {% if websocket_enabled %}
         <script language="javascript" type="text/javascript">
             if ("WebSocket" in window) {
@@ -51,7 +55,8 @@
         </div>
       </div>
       <form id="inputform" action="javascript:void(0);">
-        <div id="playercount">Logged in Players: {{num_players_connected}}</div>
+        <div id="prompt"></div>
+        <div id="numplayers">Logged in Players: {{num_players_connected}}</div>
         <div id="inputcontrol"><input type="text" id="inputfield" autocomplete="off"><input id="inputsend" type="button" value="send" onClick="doSend()"/></div>
       </form>
     </div>