Start of html chat

Aurorastation · Sep 28, 2019 · 5734869 · 5734869
1 parent bf72405
commit 5734869
Show file tree

Hide file tree

Showing 11 changed files with 213 additions and 4 deletions.
diff --git a/aurorastation.dme b/aurorastation.dme
@@ -1248,6 +1248,8 @@
 #include "code\modules\cargo\random_stock\~undefs.dm"
 #include "code\modules\cciaa\cciaa.dm"
 #include "code\modules\cciaa\cciaa_items.dm"
+#include "code\modules\chat\chat.dm"
+#include "code\modules\chat\chat_datum.dm"
 #include "code\modules\client\asset_cache.dm"
 #include "code\modules\client\client defines.dm"
 #include "code\modules\client\client procs.dm"

diff --git a/code/modules/chat/chat.dm b/code/modules/chat/chat.dm
diff --git a/code/modules/chat/chat_datum.dm b/code/modules/chat/chat_datum.dm
@@ -0,0 +1,113 @@
+/datum/chat
+	var/client/client
+	var/loaded = FALSE
+	var/broken = FALSE
+	var/list/queue
+
+
+/datum/chat/New(var/client/C)
+	client = C
+	queue = list()
+
+/datum/chat/proc/Start()
+	. = FALSE
+	if(!isclient(client))
+		return
+
+	if(!winexists(client, "browseroutput"))
+		set waitfor = FALSE
+		broken = TRUE
+		log_debug("Failed to start chat for [client] due to outdated skin file.")
+		alert(client, "Updated chat window does not exist. If you are using a custom skin file please allow the game to update.")
+		return
+
+	if(winget(client, "browseroutput", "is-visible") == "true")
+		FinilizeLoading()
+	else
+		LoadHTML()
+
+	return TRUE
+
+/datum/chat/proc/LoadHTML()
+	set waitfor = FALSE
+	if(!client)
+		return
+
+#ifdef UIDEBUG
+	client << browse_rsc(file("vueui/dist/chat.js"), "chat.js")
+	client << browse_rsc(file("vueui/dist/chat.css"), "chat.css")
+#else
+	simple_asset_ensure_is_sent(client, /datum/asset/simple/chat)
+#endif
+
+	client << browse(GenerateHTML(), "window=browseroutput")
+
+/datum/chat/proc/GenerateHTML()
+	return {"
+<!DOCTYPE html>
+<html>
+	<head>
+		<meta http-equiv="X-UA-Compatible" content="IE=edge">
+		<meta charset="UTF-8">
+		<link rel="stylesheet" type="text/css" href="chat.css">
+	</head>
+	<body class="[get_theme_class()]">
+		<div id="chattarget">
+		</div>
+		<noscript>
+			<div id='uiNoScript'>
+				<h2>JAVASCRIPT REQUIRED</h2>
+				<p>Your Internet Explorer's Javascript is disabled (or broken).<br/>
+				Enable Javascript and then reconnect.</p>
+			</div>
+		</noscript>
+	</body>
+	<script type="application/json" id="initialstate">
+		[generate_data_json()]
+	</script>
+	<script type="text/javascript" src="chat.js"></script>
+</html>
+"}
+
+/datum/chat/proc/generate_data_json()
+	. = list()
+	.["uiref"] = "\ref[src]"
+	.["state"] = list(
+		"roundid" = game_id
+	)
+	return json_encode(.)
+
+/datum/chat/proc/get_theme_class()
+	if(SStheming)
+		return SStheming.get_html_theme_class(client)
+	return ""
+
+/datum/chat/jscall(var/list/params, var/function)
+	user << output(list2params(params))),"browseroutput:[function]")
+
+/datum/chat/proc/FinilizeLoading()
+	if(loaded)
+		return
+
+	loaded = TRUE
+
+
+/datum/chat/proc/ProcessQueue()
+	jscall(list(json_encode(queue)), "")
+
+/datum/chat/proc/show()
+	winset(client, "output", "is-visible=false")
+	winset(client, "browseroutput", "is-disabled=false;is-visible=true")
+
+/datum/chat/proc/hide()
+	winset(client, "output", "is-visible=true")
+	winset(client, "browseroutput", "is-disabled=true;is-visible=false")
+
+/datum/chat/Topic(href, href_list)
+	if(usr.client != client)
+		return
+	if(href_list["ready"])
+		FinilizeLoading()
+
+	. = ..()
+
diff --git a/code/modules/client/asset_cache.dm b/code/modules/client/asset_cache.dm
@@ -206,6 +206,12 @@ var/list/asset_datums = list()
 		"vueui.css" = 'vueui/dist/app.css'
 	)
 
+/datum/asset/simple/chat
+	assets = list(
+		"chat.js" = 'vueui/dist/chat.js',
+		"chat.css" = 'vueui/dist/chat.css'
+	)
+
 /datum/asset/chem_master
 	var/list/bottle_sprites = list("bottle-1", "bottle-2", "bottle-3", "bottle-4")
 	var/max_pill_sprite = 20

diff --git a/code/modules/vueui/ui.dm b/code/modules/vueui/ui.dm
@@ -265,7 +265,7 @@ main ui datum.
 /datum/vueui/proc/push_change(var/list/ndata)
 	if(ndata && status > STATUS_DISABLED)
 		src.data = ndata
-	to_chat(user, output(list2params(list(generate_data_json())),"[windowid].browser:receiveUIState"))
+	user << output(list2params(list(generate_data_json())),"[windowid].browser:receiveUIState")
 
 /**
   * Check for change and push that change of data

diff --git a/interface/dark.dmf b/interface/dark.dmf
@@ -1122,6 +1122,16 @@ window "outputwindow"
 		can-minimize = false
 		can-resize = false
 		is-pane = true
+	elem "browseroutput"
+		type = BROWSER
+		pos = 0,0
+		size = 640x480
+		anchor1 = 0,0
+		anchor2 = 100,100
+		is-visible = false
+		is-disabled = true
+		saved-params = ""
+		auto-format = false
 	elem "output"
 		type = OUTPUT
 		pos = 0,0

diff --git a/interface/skin.dmf b/interface/skin.dmf
@@ -1119,6 +1119,16 @@ window "outputwindow"
 		can-minimize = false
 		can-resize = false
 		is-pane = true
+	elem "browseroutput"
+		type = BROWSER
+		pos = 0,0
+		size = 640x480
+		anchor1 = 0,0
+		anchor2 = 100,100
+		is-visible = false
+		is-disabled = true
+		saved-params = ""
+		auto-format = false
 	elem "output"
 		type = OUTPUT
 		pos = 0,0

diff --git a/vueui/dist/app.js.map b/vueui/dist/app.js.map
diff --git a/vueui/src/chat.js b/vueui/src/chat.js
@@ -3,4 +3,30 @@
  * Made for Aurora, by Karolis K.
  */
 import './assets/chat.scss'
+import Utils from './utils.js'
+import Store from './chatStore.js'
 
+global.receiveQueue = function (encoded) {
+  let decoded = JSON.parse(encoded)
+  Store.AddMessages(decoded)
+  addMessages(decoded)
+}
+
+function addMessages(messages) {
+  messages.forEach(message => {
+    let div = document.createElement('div')
+    div.innerHTML = message
+    div.className = "message"
+    global.messageTarget.appendChild(div)
+  })
+}
+
+Utils.onReady(() => {
+  global.messageTarget = document.getElementById('chattarget')
+  Store.loadInitialState(document.getElementById('initialstate').innerHTML)
+  addMessages(Store.state.messages)
+  Utils.sendToTopicRaw({
+    src: Store.state.ref,
+    ready: 1
+  })
+})
diff --git a/vueui/src/chatStore.js b/vueui/src/chatStore.js
@@ -0,0 +1,30 @@
+export default {
+  state: {
+    ref: "",
+    roundId: "",
+    messages: []
+  },
+  loadInitialState(encodedData) {
+    var newState = JSON.parse(encodedData)
+    this.state.ref = newState.ref
+    this.state.roundId = newState.roundid
+    if (window.localStorage) {
+      var rid = window.localStorage.getItem("roundID")
+      if(rid != this.state.roundId) {
+        window.localStorage.clear()
+        window.localStorage.setItem("roundID", this.state.roundId)
+      }
+      var messages = window.localStorage.getItem("messages")
+      messages = JSON.parse(messages)
+      if(typeof messages == Array) {
+        this.state.messages = messages
+      }
+    }
+  },
+  AddMessages(messages) {
+    this.state.messages = this.state.messages.concat(messages)
+    if (window.localStorage) {
+      window.localStorage.setItem("messages", JSON.stringify(this.state.messages))
+    }
+  }
+}
diff --git a/vueui/src/utils.js b/vueui/src/utils.js
@@ -1,5 +1,4 @@
 import Store from './store.js'
-import store from './store.js';
 export default {
   sendToTopicRaw(data) {
     var sendparams = []
@@ -17,11 +16,24 @@ export default {
       vueuihrefjson: JSON.stringify(data)
     }
     if(pushState) {
-      pushData["vueuistateupdate"] = store.getStatePushDataString()
+      pushData.vueuistateupdate = Store.getStatePushDataString()
     }
     this.sendToTopicRaw(pushData)
   },
   dotNotationRead(object, key) {
     return key.split('.').reduce((a, b) => a[b], object);
+  },
+  onReady(callback) {
+    if (document.readyState != 'loading'){
+      callback()
+    } else if (document.addEventListener) {
+      document.addEventListener('DOMContentLoaded', callback)
+    } else {
+      document.attachEvent('onreadystatechange', function() {
+        if (document.readyState != 'loading') {
+          callback()
+        }
+      });
+    }
   }
 }