I can't display embedded images...

I’ve spent about 6 hours trying, and I feel it is now time to ask, how do you display an embedded image?

Hi v3ngenc3, are you using Tads 2 or Tads 3?

If you are using Tads 3 there is some advice on how to access resources in the HTML Tads documentation,
http://tads.org/t3doc/doc/htmltads/res.htm

If it’s not obvious, you would write a HTML tag with the filename of the resource in a string and print it e.g.

"<IMG SRC='picture.jpg'>";

If you are using Tads2 (is your game file a .gam or a .t3?) you can find the manuals here.

Are you just trying to display an image from your hard disk (not a resource)? Some interpreters won’t load images from outside the game directory because of strict security settings. Try putting the image in the same directory as the game (remember to update the filename in the source code). Look at the preferences or read the manual of your interpreter to find out how to change the security setting.

If you give an example of the source code that you are trying to use that would make it easier for us to help you.

Reading further in the HTML-tads documentation I didn’t see much difference between accessing local images and embedded images. If you use subdirectories make sure the source code uses ‘/’ as directory separator. Check that the case of filenames in the source code matches the actual filenames.

I am using Tads 3, and I still am unable to get things to work.
Could it be because I am on Windows 8?
I add the resource file, lets say a sound file in this example, test.wav to the Resource Files folder in the project.
Then in my description I am using the following html, <SOUND SRC=“test.wav”/>, no sound will play, neither will pictures show, and when I use something like <a href=“x metal buttons”>fifteen metallic buttons the link shows, but when I click the HTML TADS 3 Interpreter will crash, only displaying an empty screen with no prompt, the only thing you can do, is close it…
I’d really like to write some IF, I have the whole thing planned out on a lot of paper already, hope I can figure why these problems are happening.
Edit: I could install Sun VM and try running this through Linux, but I won’t do this straight away, until I have some confirmation that it could be windows 8…

Are you working on a WebUI project? If so, you’re probably running into the same problem I had with my game: https://intfiction.org/t/tads-3-1-image-not-visible-with-webui/3724/1

Hey Emerald, I’m not sure, it might be related, though I can’t seem to get my images or sounds to show in any way, either through the workbench or otherwise.
I read your post before I made this one (as I did search for answers), though I did not really understand the solution, which seemed very, well, skimmed over, for lack of better words. I’ll re-read it a few times, maybe it will sink in.
EDIT: Thanks Emerald, but I’m starting to think my problem is elsewhere, as your problem seemed to be more that the images were not being able to be accessed due to permissions (I think), my ones, as shown above, are in the root directory, besides the point that I am not using WebUI, just the TADS 3 Interpreter, I don’t think they are related - I could however be wrong, as the symptoms are identical…

According to the system manual there must be a declaration in the source code for each directory which contains embedded files (images etc).

For example if your game file is in C:\games\mygame and the images are in C:\games\mygame\graphics then in the source code, you would need a declaration;

WebResourceResFile vpath = static new RexPattern('/graphics/') ;
If you have another folder of resources, C:\games\mygame\sounds you would make a declaration for that too,

WebResourceResFile vpath = static new RexPattern('/sounds/') ; WebResourceResFile vpath = static new RexPattern('/graphics/') ;

I didn’t understand from your comments where the images are can you say the exact directory? Is it a subdirectory of the source code (i.e. the directory where the game file is)? I think embedded files must be in a subdirectory of the directory which contains the game file.

Just to confirm whether or not you’re using WebUI: have a look at the Project pane in the TADS 3 Workbench, if you’re using Workbench, or at the project file otherwise. If your project is using WebUI, you’ll see a library called webui.tl and a source file called tadsnet.t. If you’re using the standard UI, it will just have the standard system.tl and adv3.tl.

easily amused posted an explanation before I got around to posting mine, but I’ll leave mine here anyway, in case it helps!

If you are using WebUI, here’s an explanation of the problem, which you’ll hopefully find a bit clearer:

For security reasons, WebUI projects can normally only use resources (images, sound files, etc.) which are saved in a folder called webuires. If you want to use a resource which is saved somewhere else, you’ll have to specifically tell TADS that it’s safe to access that file. It’s probably easiest to create a folder in the same place as your project, and put all your resources in that. Then add this to one of your source code files:

WebResourceResFile vpath = static new RexPattern('/myresourcesfolder/') ;
That will allow your game to use any file saved in “myresourcesfolder”.

1 Like

I see… Well many thanks to both of you, and I guess my project is using the Web UI. I’ll do as described, and see what happens…

Experimenting with webui I noticed another difference to HTML-Tads - to use filenames of embedded resources in HTML tags, they (including directories in the path) must be URL-encoded. That means that if there is a non-alphanumeric character, e.g. a space, (including non-UTF8 characters), excluding ‘.’ ‘-’ ‘_’, in the filename then it will not load in webui. One way to encode these characters is to replace them with a “%XX” code where XX is the hexadecimal value of the character in UTF8.

Fortunately there is a string method to do the work of encoding invalid characters: urlEncode(). Unfortunately this is designed to be used for parameters to a server so it translates spaces to pluses - probably not what you want for a simple image or sound file or a link. You can re-encode spaces (%20 is the encoded value for a space) after urlEncode() with findReplace(’+’,’%20’).

"<img src=\"<<filename.urlEncode().findReplace('+','%20')>>\">";

There is a checklist of changes you need to make to convert a tads3 project to the WebUI. Read it carefully and go through each step. Also verify that your makefile includes the network settings.

You could try starting with a simple one room project with one image and see if you can get that to work. To play sounds with Webui you can use a HTML4 tag such as EMBED.

"<embed src=\"/resource files/Nutcrack.mid\" width=0 height=0 autoplay=true controller=false loop=false>";

I know this is an old post, but just in case someone is looking for it like I was-- I was able to do sounds in HTML TADS this way:

Layer had to be in quotation marks.