Invoking JS directly from WebUI

Perhaps a basic question, but I can’t find the answer easily in the docs – I’m trying to execute some JavaScript code directly from the game, in the browser. I’ve tried this, and it doesn’t work:

marketSquare: OutdoorRoom 'The Market Square' "You are standing in the market square. " noteTraversal(traveler) { "Eventually, you arrive back in town, and find yourself in the market square. "; #ifdef TADS_INCLUDE_NET WebCommandWin.write('<script>alert("You arrived in town!");</script>'); #endif } ;
Basically what I want to do is to be able to trigger some dynamic JS on certain actions. As a perverse example, I could make all the text fuzzy if a character drunk too much :slight_smile: The key is that I need to be able to execute arbitrary JS code from the game.

I’m a bit confused as to what WebWindow.write does at all, actually. The docs say it writes to the window. If I ask it to write “foobar”, though, I don’t see that come up onscreen. I was assuming it maps closely to the JavaScript [b]document.write{/b} function, but I guess not. The source code here: isn’t encouraging either…

You can look at my webscript extension for WebUI: … ?at=master

I never took it past the proof of concept stage, so I’m not sure how practical it is. I’d recommend using it to trigger JS functions that are included as resources with your game, rather than writing a lot of JS literals in your source code.

Include it in your project makefile with “-lib webscript”.

Sample code:

#charset “utf-8”
#include <adv3.h>
#include <en_us.h>

versionInfo: GameID
name = ‘Web Script Test’
byline = ‘by Ben Cressey’
version = ‘1’

gameMain: GameMainDef
initialPlayerChar = me

me: Person
vocabWords = ‘self’
location = lab

lab: Room ‘lab’ ‘lab’
"Type JS to test the script system. "


: JSAction
verbPhrase = ‘script/scripting’

// allows writing JS code inline
#define JS(STR, ARGS…) JavaScript.eval( ## #@STR ##, ##ARGS ## )

modify JSAction
execAction() {
JS(alert(“Hello, world!”));
var a = 10000, b = 1000, c = 100;
var y = function() {
var x = 1, z = 5;
if (x && z)
if (x < z)
if (z > x)
function inc(x) { return ++x; }
function add(x, y) { return x+y; }
return a + b + c + inc(add(x, z));
alert('Sending result: ’ + y);
}, callback);

callback(res) {
“[Got eval result: <>. ]<.p>”;

Wow - thanks for this and I’ve been playing with it a bit. I’ve not got it working yet but I’m still working out how to deploy it (I understand it requires that the contents of the t3ext/webui directory be put directly in the site root - I started with “-lib t3ext/webui/webscript” and didn’t get very far.

So even with that setup, I’m not having any luck… I traced output through JavaScript._xml (script tag coming out fine) but would need to spend a while carefully going through the code to go further (it’s way beyond the basic stuff I’m doing in TADS at this point). I did notice that the script iframe didn’t look right, though: the HTML contents is being dumped in, to effect, as plain text. I took a screenshot from the Chrome devtools:

Looks rather like it’s been inserted into the iframe document as text, rather than html, though I don’t know whether that

 tag would be auto-added by WebKit or some part of the TADS HTML implementation.
I’ll keep hacking on it tomorrow but if you know why this might be happening and can save me a couple of hours, great :slight_smile:

From further checking, it’s clear that webscrptres/script.htm is being sent by the TADS webserver as text/plain, while other HTML files (statwin.htm etc) are sent as text/html.

I tried moving the script.htm to other locations (in case TADS treats files differently inside and outside webuires) to no avail.
I recreated a clean file (in case this was something to do with file metadata, permissions etc) - no luck.

I’m running this on a Mac using local t3launch and frobtads, FWIW.

That pre tag wrapping looks like something Bitbucket might do when displaying HTML; I’d suggest using git to checkout the repository, or downloading a tarball and getting the files that way:

I’ve also zipped up a working copy of the demo project: …

Try compiling that with t3make and see if it works for you. I haven’t tested the extensions since the TADS 3.1.1 release; it’s possible that some compiler behavior has changed.

Thanks for the links - but I was already running it from a git clone so that is probably not the issue. I’m going to focus on understanding why TADS is serving the file as text/plain - that makes no sense to me but almost definitely the cause of the HTML wrapping.

FWIW, Ben and anyone else reading this: the HTML files being served as text/plain was confirmed as a bug in TADS and will be resolved in the next version, but a workaround is available on the reply to the bug report here:

Onward :slight_smile: