mirror of
https://github.com/Aurorastation/Aurora.3.git
synced 2026-01-06 15:32:25 +00:00
VueUI Titlebars, Resizing, and Scrolling (#10528)
TL;DR: Goodbye gross white BYOND titlebar ruining my immersion, hello beautiful theme-matched titlebars of the future. Screenshots below.
Removes the BYOND titlebar (and thus resizing / dragging features) and replaces them with Vue/JS replacements, which may be styled as needed.
Added a debug button that appears when UIDEBUG is defined if the user has developer permissions, thereby allowing UI developers to toggle debug mode on/off at will in-game
A few minor styling tweaks (like adding a parameter to have buttons be an icon only so they don't have an extra margin-right sticking out)
Pretty much all of the JS heavy lifting here was ported from /tg/ and then butchered by yours truly, to get it working with our Vue system rather than their React-based system. There are no doubt more than a few JS warcrimes in here, so I'd appreciate a thorough, but gentle, review of things, as well as a decent bit of testing.
This commit is contained in:
@@ -153,6 +153,8 @@
|
||||
else
|
||||
VUEUI_SET_CHECK(data["apclinkicon"], "", ., data)
|
||||
|
||||
data["flashlight"] = flashlight?.enabled ? TRUE : FALSE
|
||||
|
||||
switch(get_ntnet_status())
|
||||
if(0)
|
||||
VUEUI_SET_CHECK(data["ntneticon"], "sig_none.gif", ., data)
|
||||
@@ -175,4 +177,4 @@
|
||||
continue
|
||||
VUEUI_SET_CHECK(data["programheaders"][P.filename], P.ui_header, ., data)
|
||||
|
||||
VUEUI_SET_CHECK(data["showexitprogram"], !!active_program, ., data) // Hides "Exit Program" button on mainscreen
|
||||
VUEUI_SET_CHECK(data["showexitprogram"], !!active_program, ., data) // Hides "Exit Program" button on mainscreen
|
||||
|
||||
@@ -86,7 +86,7 @@ main ui datum.
|
||||
|
||||
SSvueui.ui_opened(src) // this starts processing and adds the UI to the mob and whatnot
|
||||
|
||||
var/params = "window=[windowid];file=[windowid];"
|
||||
var/params = "window=[windowid];file=[windowid];titlebar=0;can_resize=0;"
|
||||
if(width && height)
|
||||
params += "size=[width]x[height];"
|
||||
send_resources_and_assets(user.client, load_asset)
|
||||
@@ -127,23 +127,23 @@ main ui datum.
|
||||
* @return html code - text
|
||||
*/
|
||||
/datum/vueui/proc/generate_html(var/css_tag)
|
||||
#ifdef UIDEBUG
|
||||
var/debugtxt = "<div id=\"dapp\"></div>"
|
||||
#else
|
||||
var/debugtxt = ""
|
||||
#endif
|
||||
if(user && check_rights(R_DEV, FALSE, user=user))
|
||||
debugtxt = "<div id=\"dapp\"></div>"
|
||||
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="vueui.css">
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge"/>
|
||||
<meta charset="UTF-8"/>
|
||||
<meta id="vueui:windowId" content="[windowid]"/>
|
||||
<link rel="stylesheet" type="text/css" href="vueui.css"/>
|
||||
[css_tag]
|
||||
</head>
|
||||
<body class="[get_theme_class()]">
|
||||
<div id="header">
|
||||
<header-[header]></header-[header]>
|
||||
<header-handles></header-handles>
|
||||
</div>
|
||||
<div id="app">
|
||||
Javascript file has failed to load. <a href="?src=\ref[src]&vueuiforceresource=1">Click here to force load resources</a>
|
||||
@@ -160,6 +160,9 @@ main ui datum.
|
||||
<script type="application/json" id="initialstate">
|
||||
[generate_data_json()]
|
||||
</script>
|
||||
<script type="text/javascript">
|
||||
window.__windowId__ = document.getElementById('vueui:windowId').getAttribute('content');
|
||||
</script>
|
||||
<script type="text/javascript" src="vueui.js"></script>
|
||||
</html>
|
||||
"}
|
||||
@@ -178,6 +181,7 @@ main ui datum.
|
||||
sdata["status"] = status
|
||||
sdata["title"] = title
|
||||
sdata["wtime"] = world.time
|
||||
sdata["debug"] = user && check_rights(R_DEV, FALSE, user=user)
|
||||
sdata["roundstart_hour"] = roundstart_hour
|
||||
for(var/asset_name in assets)
|
||||
var/asset = assets[asset_name]
|
||||
@@ -247,6 +251,9 @@ main ui datum.
|
||||
*/
|
||||
/datum/vueui/Topic(href, href_list)
|
||||
. = update_status(FALSE)
|
||||
if(href_list["vueuiclose"])
|
||||
close()
|
||||
return
|
||||
if(status < STATUS_INTERACTIVE || user != usr)
|
||||
return
|
||||
if(href_list["vueuiforceresource"])
|
||||
|
||||
Reference in New Issue
Block a user