See where I've used the HTML editor to change the color of the text to green in the screen shot?

What do I plug into the JS.eval line below?

I've tried #pre, #body, #html, #document, #document.html.body.pre, #document.pre, and I can't figure it out.

JS.eval ("$('????').css('color', 'green')")

What I'm using this for:

Command pattern:
GetFileURL (#text#);cat #text#;print #text#

SCRIPT:

if (StartsWith(text, "\"")) {
  ts = Split(text, "\"")
  text = ListItem(ts, 1)
}
msg ("<iframe  style=\"background:black;color:green !important;font-family:monospace;border-radius:25px\" width=\"100%\" height=\"550px\"  src=\"quest://local/" + text + "\" />")

This changes the background color/colour to black, but the text color is black, no matter what I try.

NOTE:
I'm using it to view .txt files.

The script works (it prints a local file), by the way...

<command name="kv_GetFileURL">
    <pattern>GetFileURL (#text#);cat #text#;print #text#</pattern>
    <script><![CDATA[
      if (StartsWith(text, "\"")) {
        ts = Split(text, "\"")
        text = ListItem(ts, 1)
      }
      msg ("<iframe  style=\"background:khaki;color:green !important;font-family:'Droid Sans Mono';border-radius:25px\" width=\"100%\" height=\"550px\"  src=\"quest://local/" + text + "\" />")
    ]]></script>
  </command>

I can change the font and the background color, but the text color is unaffected, no matter what I try.

Shouldn't the text color be changed here, where it says "color:green"?

msg ("<iframe  style=\"background:black;color:green !important;font-family:monospace;border-radius:25px\" width=\"100%\" height=\"550px\"  src=\"quest://local/" + text + "\" />")

I'm sure that I don't know what I'm talking about though.

Dcoder,

Definitely, hence my irritatedness.

I can change the element style of pre in the HTML editor, and it makes the text green, but I can't figure out how to adjust pre (or whatever I need to adjust) from within Quest.

The problem (I think) is that it's nested.

• iframe
  • #document
    • html
      • body
        • pre

Ha!

I'm calling this one a lost cause.

This turns every bit of text on the screen EXCEPT the text within the iframe green:

JS.eval ("$('*').css('color', 'green')")

If the 'all' wildcard (*) doesn't do it, I don't think it's getting done.

I do appreciate it, though, Dcoder!

I see what you're saying, the document's built-in style settings override any changes you make in Quest, and the asterisk proves it!

I didn't know you could use a wildcard like that -- neat! Well, I learned something today, if that helps : )

Well, I learned something today, if that helps : )

👍 K.V. likes this.

> Well, I learned something today, if that helps : )

👍 [K.V.](http://textadventures.co.uk/user/view/3fBMqO02fkKR-emkCWXdMA/k-v) likes this.

I like neat tricks.

Here's that 'all' wildcard in common CSS format:

* {
  color: green;
}

This will exclude and paragraphs (<p>) from the color change.

:not(p) {
    color: green;
}

Try giving your pre element an id and then using that to set the CSS.

The pre element is created by the iframe (I think).

• iframe
  • #document
    • html
      • body
        • pre

If I give the iframe an id, will the pre element inherit it?

This is the default on the generated html (which I can't figure out how to manipulate from within Quest):

I can add color:green to the style for the html that's generated just below the #document that the iframe is printing during play, and it works.

Following across the bottom of the HTML editor window, (and starting from iframe), I see:

• iframe
• html
• body
• pre

So that's where CSS loses me. Wouldn't that be:

iframe.html.body.pre {
  color:green !important;
}

or is it:

iframe:html:body:pre {
  color:green !important;
}

I'm importing that #document using GetFileURL.

<command name="kv_GetFileURL">
    <pattern>GetFileURL (#text#);cat #text#;print #text#</pattern>
    <script><![CDATA[
      if (StartsWith(text, "\"")) {
        ts = Split(text, "\"")
        text = ListItem(ts, 1)
      }
      msg ("<iframe  style=\"background:khaki;color:green !important;font-family:'Droid Sans Mono';border-radius:25px\" width=\"100%\" height=\"550px\"  src=\"quest://local/" + text + "\" />")
    ]]></script>
  </command>

Maybe that's what's throwing everything off... because you can't add any style settings to #document:

AND the all wildcard changed all the text green EXCEPT the text within the iframe...

But it changes the background color of everything, including the iframe:

NOTE:
The input text field's prompt doesn't turn green, but the text the player enters is green:

The content of the iframe is another document, which makes it difficult to alter (you can change the background because that is part of the original document, the container for the iframe).

The best solution is to not use an iframe at all. Use GetFileData to insert the text into a div, like this:

msg ("<div style=\"background:yellow;color:green;font-family:serif;border-radius:25px;border:black solid 1px;padding:10px;\" width=\"100%\" height=\"550px\">" + GetFileData(text) + "</div>")

Get it, Pixie!

That did the trick!

UPDATE:

Ah... no it didn't. (Sorry!)

I mean it changed the color of the outputted text, but that's just making a GetFileData() div all pretty like it's supposed to.

I already have GetFileData set up as separate command to display a local HTML file in the proper format though.

I also have a command to view a local file as a plain text file.

If I drop an iframe in there, I still can't control the text color. Even like this:

"<style>pre, code, #iframepre {word-wrap: break word;color:white !important;background:black}</style><div style=\"background:black;color:white;font-family:monospace;border-radius:25px;border:black solid 1px;padding:14px;word-wrap: break word\" width=\"100%\" height=\"550px\"><pre><code><iframe  id=\"iframepre\" style=\"background:khaki;color:white !important;font-family:monospace;border-radius:25px\" width=\"100%\" height=\"550px\"  src=\"quest://local/" + text + "\" /></code></pre></div>"

I think the text in an iframe lives by the same law as the message displayed inside the text input field (Type here...)...

I think the only way to pull of what I'm trying to do is with JS, but I'm giving up on it for now.

It's not really important. It's just a challenge.

Why do you need it in an iframe?

The thing about iframe is that it remains as a document inside a document, instead of inserting the text into a document to make one big one. JS can easily manipulate the text in its own document, but doing it in another is much harder - partly because of possible security issues.

I'm doing crazy things, Pixie.

I'll show it to you in a few days.

You'll either think it's the best idea ever or the worst idea ever. (I haven't even decided for myself yet!)

NEXT UP:

Making Quest play the Base64 embedded mp3 string attribute I have set up. (It works for images!)

I can't get it to work with play sound though.

How does play sound work?

I can't find what it calls, even when I grep the Quest 5 directory recursively.

So I'm trying to use an HTML audio tag:

This doesn't work:

<audio  src="data:audio/mp3;base64, <BASE64CODEHERE>"  autoplay> Your browser does not support the <code>audio</code> element.
</audio>

but this does:

<audio  src="http://fake/fake/mysongsurl.mp3"  autoplay> Your browser does not support the <code>audio</code> element.
</audio>

...but this doesn't...

<audio  src="quest://local/mysound.mp3"  autoplay> Your browser does not support the <code>audio</code> element.
</audio>

Neither does this:

<audio  src="" + GetFileData("quest://local/mysound.mp3") + "  autoplay> Your browser does not support the <code>audio</code> element.
</audio>

Nor this:

<audio  src="" + GetFileURL("mysound.mp3") + "  autoplay> Your browser does not support the <code>audio</code> element.
</audio>

I really just want to add the pure Base64 code as a string attribute and play the audio from that. Using an HTML <audio> tag is fine with me, but I can't get an <audio> tag to play a local file, let alone a Base64 mp3.

Again, I have this working with images.

I have an object named base64_kv. It has about 8 attributes. Each one is a string, and each one holds the content of a text file I created from a PNG using the Base64 thingy in BASH!.

msg ("<img src=\"data:image/png;base64, " + base64_kv.rh_zv + "\" />")

This loads the image up perfectly, and I don't need a separate PNG file in the game folder at all.

I'd like to eliminate the audio files from the folder as well...

/c/Program Files (x86)/Quest 5

$ grep -r sound *

This doesn't find much.

Is Quest passing this to a JS function like it does a YouTube video?

Here's all I could find searching 'sound' ('audio' or 'mp3' yielded fewer results, but they were all included in the results for 'sound'):

CoreEditorScriptsOutput.aslx

  <editor>
    <appliesto>play sound</appliesto>
    <display>Play sound #0</display>
    <category>[EditorScriptsOutputOutput]</category>
    <create>play sound ("", false, false)</create>
    <add>[EditorScriptsOutputPlayasound]</add>

    <control>
      <controltype>label</controltype>
      <caption>[EditorScriptsOutputPlaysound]</caption>
    </control>

    <control>
      <controltype>expression</controltype>
      <attribute>0</attribute>
      <simple>filename</simple>
      <simpleeditor>file</simpleeditor>
      <source>*.wav;*.mp3</source>
      <filefiltername>Sound Files</filefiltername>
    </control>

    <control>
      <controltype>label</controltype>
      <caption>[EditorScriptsOutputWaitforsound]</caption>
      <breakbefore/>
    </control>

    <control>
      <controltype>expression</controltype>
      <attribute>1</attribute>
      <simpleeditor>boolean</simpleeditor>
    </control>

    <control>
      <controltype>label</controltype>
      <caption>[EditorScriptsOutputLoop]</caption>
      <breakbefore/>
    </control>

    <control>
      <controltype>expression</controltype>
      <attribute>2</attribute>
      <simpleeditor>boolean</simpleeditor>
    </control>

  </editor>

  <editor>
    <appliesto>stop sound</appliesto>
    <display>Stop sound</display>
    <category>[EditorScriptsOutputOutput]</category>
    <create>stop sound</create>
    <add>[EditorScriptsOutputStopsound]</add>
    <advanced/>

    <control>
      <controltype>label</controltype>
      <caption>[EditorScriptsOutputStopsound]</caption>
    </control>
  </editor>

  <editor>
    <appliesto>(function)ShowYouTube</appliesto>
    <display>Play YouTube video #0</display>
    <category>[EditorScriptsOutputOutput]</category>
    <create>ShowYouTube ("")</create>
    <add>[EditorScriptsOutputPlayYouTube]</add>

    <control>
      <controltype>label</controltype>
      <caption>[EditorScriptsOutputPlayYouTube]</caption>
    </control>

    <control>
      <controltype>expression</controltype>
      <attribute>0</attribute>
      <simple>id</simple>
    </control>
  </editor>

GamebookCore.aslx

   if (not GetBoolean(game, "continuesound")) {
      stop sound
    }
    if (HasScript( game, "roomenter")) {
      do (game, "roomenter")
    }
    on ready {
      if (GetBoolean(player.parent, "runscript") or GetBoolean(player.parent, "runscriptonly")) {
        if (HasScript(player.parent, "script")) {
          do (player.parent, "script")
        }
        else {
          msg ("No script has been created for this page.")
        }
      }
      // script may have moved the player, so finish DoPage if parent has changed
      if (parent = player.parent and not GetBoolean(player.parent, "runscriptonly")) {
        if (HasString(player.parent, "sound")) {
          if (LengthOf(player.parent.sound) > 0) {
            play sound (player.parent.sound, false, false)
            game.continuesound = GetBoolean(player.parent, "continuesound")
          }
        } 

Then, there are more templates (which seem pointless to list), and this:

Binary file ffmpegsumo.dll matches
Binary file LegacyASL.dll matches
Binary file libcef.dll matches

Hrmm...

var snd = new Audio("data:audio/mp3;base64, <URI data>");
snd.play();

Maybe I can plug this into an ASLEvent...

"<audio  src=\"data:audio/mp3;base64, LongBase64CodeHere\"  autoplay> Your browser does not support the <code>audio</code> element.<br/></audio>"

Here's the exact code (minus the two backslashes to cancel out the quotation marks) in a working HTML.

https://gist.githubusercontent.com/KVonGit/510bc4d9cbf7f99551b68de4ba46f5a1/raw/5920ced195f859766005845e395a2c722c9bd837/embedAudio.html

Maybe it's just Quest...

I found this: http://textadventures.co.uk/forum/general/topic/4632/pointers-for-where-to-start-studying-code-used-in-quest#30515

I have Jay's .aslx file AND flush.mp3 in the same directory, but it still doesn't work in the desktop player/editor. (It does work in the online example, but I think that's linking to the hosted audio file...) [NOTE: It also works if I use flush.mp3 in a normal HTML file and open it locally in Chrome.]

<audio src="https://textadventures.blob.core.windows.net/gameresources/134efeb8-a289-4c63-bc26-f0256fb78533/flush.mp3" autoplay=""></audio>

http://play2.textadventures.co.uk/Play.aspx?id=32vsueb1reiqbowkldpypw

I just confirmed it!

This works when you play online but NOT offline:

msg ("<audio  src=\"data:audio/mp3;base64, LongBase64CodeHere\"  autoplay> Your browser does not support the <code>audio</code> element.<br/></audio>")

http://textadventures.co.uk/games/view/qdba9-t-mk6g5vl2n6epuw/wikitst

http://play2.textadventures.co.uk/Play.aspx?id=qdba9-t-mk6g5vl2n6epuw

Enter the command: TYPE