JS in the Web Editor (Continuing an old thread)

Continuing this (closed) thread by mrangel:

http://textadventures.co.uk/forum/quest/topic/e0xah5tpfu6qnzd4v9oscg/javascript-in-web-editor


THE FUNCTION:

RunJs

regEx = "//"
js = Split(SafeXML(js.description),"<br/>")
notes = NewStringList()
foreach (line, js) {
  if (StartsWith(line,"//")) {
    list add (notes, line)
  }
}
js = ListExclude(js,notes)
finaljs = NewStringList()
foreach (line, js) {
  code = line
  if (IsRegExMatch(regEx,line)) {
    list = Split(line,"//")
    code = list[0]
  }
  list add (finaljs, code)
}
js = Join(finaljs,"")
JS.eval (js)

NOTE: You can paste that right into code view online.


I made a room named js, then I put this JS in the room description:

function testFunct(){  
  alert('Does this work?'); //Test note
}
// Test note 2
testFunct();


/**
*Test note 3
*/

alert('Still working!');


It works with notes in there now!


PS

This works in the desktop version, too, if you don't like the separate JS files (for whatever reason, like being able to easily email your game to a friend).


Okay...

So can you add a tab to the game object with a new text area that appears when you tick a box on the Features tab. You could put JavaScript in there, and then have the JavaScript automatcally added at the start of your game (in InitInterface, with JS.addScript?).

Then you can call your custom functions with JS. wheneveryou want.


image

    <tab>
      <caption>Javascript</caption>
      <control>
        <controltype>richtext</controltype>
        <attribute>js_script</attribute>
        <notextprocessor/>
        <expand/>
      </control>
    </tab>

Oh yeah!

That's the bee's knees!


I didn't know about addScript().

Right now, I have it calling RunGameJs() on the very last line of StartGame().

image


As far as I can tell, the attribute doesn't exist until you enter text in that field.


If you happen to add this to the next version, this was conceived and scripted by mrangel.

I only added the bit to make it remove any notes.


Help!

If I put a <br/> in that field, Quest replaces it with an actual line break as soon as I click away from the Javascript tab!

(It does this in the desktop version or the web editor.)

image


After clicking on something else then clicking right back on the tab.

image


PS

If I put \n (like I need to in an alert), it leaves that alone.

alert("Does this \n work?");

...and it works:

image


...and, when I say, "it works," I mean the whole concept as well as the newline in the alert. (Ha-ha!)

The only problem I've come across is Quest turning the <br/> into an actual line break.


Using a room description is still the best way to do this right now.

I can't figure out why Quest removes the line breaks from this added field, the implementation notes, or the game description.

After looking through the libraries, I don't find any differences between the room description <control> elements and these, but it doesn't alter the line breaks in the room description.

Hrmm...

It's a mystery!


I thought it did replace them in room descriptions. As far as I know, all line breaks get converted to <br/> in the code, but then all <br/> in the code get displayed as line breaks.


I thought it did replace them in room descriptions. As far as I know, all line breaks get converted to <br/> in the code, but then all <br/> in the code get displayed as line breaks.

I think if you type <br/> in the description box, it should be converted to &lt;br/&gt;.
That's why when I was playing around with this originally, I had the script replace « with < and » with >; if I want to put HTML within my JS, I can just put «br/» rather than needing to worry about multiple levels of escaping and unescaping.

(I use this a lot in quest, because code view in the web version has a horrible habit of mangling HTML in string literals)


I thought it did replace them in room descriptions. As far as I know, all line breaks get converted to <br/> in the code, but then all <br/> in the code get displayed as line breaks.

This is 100% correct. (I suppose I was just being silly.)


How do you enter « and »?

(I'm usually good at finding out how to enter symbols, but I can't find that!)


I thought about using [break] when entering code in that field, but I fear anything besides <br> may confuse people.


How did you enter them in your post? lol


The ability to copy & paste is a wonderful thing!


This is what I've currently got for the function:

  <function name="RunGameJs">
        <![CDATA[
    if(HasAttribute(game,"js_script")){
      regEx = "//"
      js = Split(SafeXML(game.js_script),"&lt;br/&gt;")
      notes = NewStringList()
      foreach (line, js) {
        if (StartsWith(line,"//")) {
          list add (notes, line)
        }
      }
      js = ListExclude(js,notes)
      finaljs = NewStringList()
      foreach (line, js) {
        code = line
        if (IsRegExMatch(regEx,line)) {
          list = Split(line,"//")
          code = list[0]
        }
        list add (finaljs, code)
      }
      js = Join(finaljs,"")
      js = Replace(js, "[br]", "<br/>")
      js = Replace(js, "[br/]", "<br/>")
      js = Replace(js, "&lt;br/&gt;", "<br/>")
      js = Replace(js, "[break]", "<br/>")
      js = Replace(js, "[linebreak]", "<br/>")
      JS.eval (js)
    }
  ]]></function>

If you haven't got a compose key set up, you could use any convenient symbols; (= and =) maybe for < and >, because I don't think there's anywhere they'd be legal in javascript unless they're in a string.


Oh, I see. (NOTE TO SELF: Set up a compose key.)

I just went with a few options the user can use:

[br]
[br/]
[break]
[linebreak]

...and I added a note to the tab in the editor to let everyone (including me) know how to work it.


This topic is now closed. Topics are closed after 60 days of inactivity.

Support

Forums