Enhancement to Quest: Compass option

The Old Brick
I am working on an interactive short story using Quest (the browser version). What a wonderful tool !!! I've noticed a few minor weaknesses, which I'll gradually post here in the forums.

My short story only has non-directional exits. Therefore, I do not want to display the Compass pane. Under game / Interface, one of the Layout options is "Show panes (Inventory, Places and Objects, Compass)". Unfortunately, it's all or nothing. I want the Inventory, Places and Objects panes; I don't want the Compass pane. There's only one check box for all three panes.

Suggestion: Please give us three check boxes, one each for Inventory, Places and Objects, Compass. Then, I could turn off Compass while retaining Inventory, Places and Objects.

=====

If there's a way to turn off the Compass pane via coding, please tell me. I would still like to see the check box change, though.

Silver
I know you can hide the command bar with:

request(Hide, "Command")


perhaps try swapping "Command" with "Compass"?

The Pixie
Silver wrote:I know you can hide the command bar with:

request(Hide, "Command")


perhaps try swapping "Command" with "Compass"?

Not according to the documentation:

http://docs.textadventures.co.uk/quest/ ... quest.html

With the off-line version, you can add a JavaScript file to do it. Put this function in it:

 function hideCompass(){ 
compassAccordion.style.display = "none";
compassLabel.style.display = "none";
}


And call with:

request (RunScript, "hideCompass")


By the way, the off-line version gas an HTML Tools button in play mode that you can use to find the name (ID) of each part of the display. That was how I found compassAccordion and compassLabel. After that, it is just a case of modifying the Javascript function with CSS.

Silver
I knew I shouldn't have answered a code question. :D

jaynabonne
Taking a page from ThePixie's answer, do this:

1) Click on "game"
2) Click on the "Script" tab.
3) Where it says "Start script:", click "Code View" (beside the "Add new script" button).
4) Paste this code into the window that pops up:

JS.eval ("compassAccordion.style.display = 'none'")
JS.eval ("compassLabel.style.display = 'none'")

(If you already have a start script, paste the two lines at the end)/
5) Click OK.

That should do it.

The Pixie
JS.eval has inspired this test game, which lets the player type in javaScript (with a # at the start), to see what happens. That is probably a very bad idea for an on-line game, as the player might be able to do all sorts of dubious things, but may be useful for creators to see what they can do and what works.

<!--Saved by Quest 5.5.5328.26617-->
<asl version="550">
<include ref="English.aslx" />
<include ref="Core.aslx" />
<game name="display">
<gameid>952c1471-a281-4d82-8e1b-5fafd4959ee6</gameid>
<version>1.0</version>
<firstpublished>2014</firstpublished>
<start type="script"><![CDATA[
msg ("Type Javascript commands by adding a hash (#) to the start of the command. For example:")
msg ("#compassAccordion.style.display = 'none'")
msg (" ")
msg ("The <i>compassAccordion</i> part is the ID for the XML element on screen. You can find these by clicking the \"HTML Tools\" button. In the dialogue box, hover over XML definitions and see what highlights in the game. You may need to expand a definition to dig deeper.")
msg ("The <i>style</i> part just tells javaScript we are changing the style.")
msg ("The <i>display</i> part is the CSS property. If this name is hyphenated (eg background-image), it must be converted to camel-case (eg backgroundImage).")
msg ("The <i>none</i> part, in single quotes, is the value to set. There are plenty of resources on the internet about CSS.")
msg (" ")
]]></start>
</game>
<object name="room">
<inherit name="editor_room" />
<object name="player">
<inherit name="editor_object" />
<inherit name="editor_player" />
</object>
</object>
<function name="HandleCommand" parameters="command, metadata"><![CDATA[
handled = false
if (game.menucallback <> null) {
if (HandleMenuTextResponse(command)) {
handled = true
}
else {
if (game.menuallowcancel) {
ClearMenu
}
else {
handled = true
}
}
}
if (not handled) {
StartTurnOutputSection
if (StartsWith (command, "*")) {
msg ("")
msg (SafeXML (command))
}
else if (StartsWith (command, "#")) {
msg ("")
msg ("JavaScript: " + SafeXML (Mid(command, 2)))
JS.eval (Mid(command, 2))
}
else {
shownlink = false
if (game.echocommand) {
if (metadata <> null and game.enablehyperlinks and game.echohyperlinks) {
foreach (key, metadata) {
if (EndsWith(command, key)) {
objectname = StringDictionaryItem(metadata, key)
object = GetObject(objectname)
if (object <> null) {
msg ("")
msg ("&gt; " + Left(command, LengthOf(command) - LengthOf(key)) + "{object:" + object.name + "}")
shownlink = true
}
}
}
}
if (not shownlink) {
msg ("")
OutputTextRaw ("&gt; " + SafeXML(command))
}
}
if (game.command_newline) {
msg ("")
}
commands = Split(command, ".")
game.pov.commandmetadata = metadata
if (ListCount(commands) = 1) {
game.pov.commandqueue = null
HandleSingleCommand (Trim(command))
}
else {
game.pov.commandqueue = commands
HandleNextCommandQueueItem
}
}
}
]]></function>
</asl>

The Old Brick
Thanks for the suggestions. Yes, I was able to remove the Compass pane. Here's how...

1. jaynabonne, I tried your approach first because it seems like the second best alternative compared to enhancing the game / Interface Layout check boxes (i.e. your approach is basically through the menus). By the way, thanks for the excellent instructions !!!

Unfortunately, Quest didn't cooperate. I tried various gyrations, but every time, Quest responded with "Sorry, an internal error has occurred". :(

Note: I do already have a start script--a single print message.

2. Then, I decided to download and install the Windows version of Quest. Glad I did. SIGNIFICANTLY more powerful than the browser version.

3. Finally, I tried The Pixie's approach (a JavaScript hideCompass function). (Not a fault of The Pixie, but it's the least desirable alternative compared to a simple check box because it's the most complex to implement)

Worked the first time. Compass pane gone.

The Pixie
Kind of related, how do you change the style of the status bar across the top?

I have put this in a start script. The gameBorder goes red, but the status bar is unchanged. Am I missing something here?

JS.eval("status.style.backgroundColor = 'yellow'")
JS.eval("location.style.backgroundColor = 'black'")
JS.eval("gameBorder.style.backgroundColor = 'red'")

jaynabonne
To tell you the truth, I don't even know why that one worked. :) There must be a variable named "gameBorder" somewhere. But try this instead:

JS.eval("$('#status').css('backgroundColor', 'yellow')")
JS.eval("$('#location').css('backgroundColor', 'black')")
JS.eval("$('#gameBorder').css('backgroundColor', 'red')")

The Pixie
Thanks. I will stick to the JQuery format in future. A lot will work like that, so it is all the more confusing when one does not.

The Pixie
Okay, so why does the first line here not work, but the second does?

JS.eval("$('#txtCommand').css('backgroundColor', 'yellow')")
JS.eval("$('#txtCommandDiv').css('backgroundColor', 'yellow')")


txtCommand is an input element, but I am pretty sure that supports the backgroundColor property.

jaynabonne
Because Quest is forcing the input prompt style to be the same as the last output text. You can see it in this function:

  <function name="OutputTextRaw" parameters="text">
<![CDATA[
format = GetCurrentTextFormat("")
JS.addText("<span style=\"" + format + "\">" + text + "</span><br/>")
if (GetString(game, "commandbarformat") <> format) {
format = format + ";background:" + game.defaultbackground
game.commandbarformat = format
JS.setCommandBarStyle(format)
}
request (Speak, text)
]]>
</function>

It has actually been mentioned a couple of times (once by me) that this behavior is not necessarily desirable. The recommended workaround is to use HTML styles for transient style changes rather than using the main Quest text color ones.

Also, the code as it above has a flaw - the value it's comparing the "commandbarformat" attribute to isn't the same value that is later set, so it will never be match and will always cause JS.setCommandBarStyle to be called. That has no visible effect, but it's not coded properly as is, based on what the intention seems to be. (A fix would be to move the line that modifies format so it occurs after commandbarformat has been set.)

If you bring this function into your game and remove the line starting with "format = format + ..." where it appends the background color, then your background color will stick.

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

Support

Forums