Please forgive my obtuseness. I thought I’d have a go at adding just a tiny bit of HTML to a TADS 3.1 game, and I’m having no luck at all getting it to work.
Let’s suppose I want to have a particular phrase display in an unusual color or font – never mind why. So I go over to the webuires folder and edit main.htm, adding this to the head:
<style>
.zowie {
color: #c00000;
font-size: 3em;
}
</style>
Windows cleverly won’t let me save main.htm back to the default TADS program directory, because it’s inside of Program Files (x86), but never mind that – I save my edited file to the desktop and then drag it by hand back into webuires.
I then edit the room description of the starter game as follows:
"This large, formal entryway is slightly intimidating:
the walls are lined with <span class=\"zowie\">somber portraits</span> of gray-haired
men from decades past; a medieval suit of armor<<describeAxe>>
towers over a single straight-backed wooden chair. The
front door leads back outside to the south. A hallway leads
north. "
This compiles, but the span tag does nothing. Now, quite possibly I’m making a dumb CSS error, but maybe not. The problem may be, instead, that I have to escape the quotation marks around the class= bit in order to get the game to compile, and that causes the web page not to recognize the class.
I’m pretty sure HTML tags can be used in game text, because if I substitute strong or em tags for the span tags, the result is displayed in the game. So the first question is, how do I get game text to recognize the class of a span tag?
The second question is, is there a way to create a stylesheet inside of the game code and post it to the main window (using Javascript, for instance), or do I have to edit the main.htm file directly?
I haven’t tested this, but I think you need to add your custom style to cmdwin.css - cmdwin.htm is the IFRAME where the main blocks of text are printed.
I recommend keeping your custom styles in a separate .css file that gets added as a resource in the .t3 file, and pulled in by the cmdwin.htm header. (Ditto with custom JS.) The reason is that if you need to tweak / fix those files post-release, you can do it without changing the VM image; otherwise you have to recompile the game and will break any save files.
If the styles need to be generated at runtime, I suggest just outputting style tags directly. You can make this more palatable with a T3 function:
Thanks! Adding the style to cmdwin.css works perfectly. I was also able to add an onclick handler for the span, and it works.
At this stage, what I’m accomplishing is quite trivial, but ya gotta start with baby steps.
I also uninstalled Workbench and reinstalled it to the root of the C: drive. This lets me edit the .css and .js files directly in Workbench and save them again, without Windows getting all weird and refusing to save.
Jim, sorry to resurrect this old thread, but I’ve been trying to do much the same thing, specifically to create a new CSS/JS file as a t3 file resource (as part of my game’s source code) and then include it in the Web deployment.
I’d rather not modify anything from webuires, since it will then apply to everything I compile obviously - I’d rather keep modifications neatly encapsulated in the t3 file.
There doesn’t seem to be much documentation about doing this that I can find. I can continue to hack on this but if you have an example of how to do it, I’d appreciate it.
Well, I have a “webuires” folder created in my game folder beside source code files and makefile. In this folder I have modified copies of those original webuires files I needed to modify and in the makefile I just have line saying “resource: webuires”. I think that important is, that this line is in the makefile after “-lib webui”. And it overshadows those original files with my customized version just for this project.