SCI Wiki - User contributions [en]

Custom Slider Controls

2023-06-01T08:47:57Z

Rob Craig: /* The Slider View */

=Chapter 9 - Creating Custom Slider Controls=

<div align="right">''<nowiki>*</nowiki> Requires SCI Studio 2.12 or higher''</div>

By default, the slider control is drawn with a simple DText control. It draws character 6 for the filled in area, and character 7 for the white area. However, with some creative coding, they can be easily customized. This tutorial continues the "[[Custom Buttons|Creating Custom Windows]]" chapter and will teach you how to create gauges with views!

===Load The Game===

First you need to open your game in SCI Studio, loading the Resource Explorer.

===The Slider View===

First the gauge will need a view so there's something to draw. I've set up one up to save you time, but it can be easily customized to create your own custom theme.

The cels are 8x16 pixels. This is a perfect size. If they were any wider, the window would fill the screen.

To save time, [http://sierrahelp.com/Files/SCI/view.902 click here] and download it for Studio Script. For Sierra Script please use:

Add the view to the game. I chose to number it view.902, but it can be numbered anything you like.

===Scripting The Custom Slider Control===

Basically, all you need to do is remove the DText txtGauge from the script, adjust the positioning of the DButton btnHigher, and create a custom draw handler. However, since there is a lot that needs to be changed, [http://sierrahelp.com/Files/SCI/gauge.sc click here] to download the script.

Overwrite the existing gauge.sc script in your /src directory, open in in the script editor and then compile it. When done, you will have a custom gauge! You can modify the view to your liking.

 

<p align="center">Run the game all you'll see your brand new custom slider control!<br />[[Image:Controls-Slider.png|Custom Control Slider]]</p>

That sums it up!

 

<span style="float: left">[[Custom Windows|< Previous: Chapter 8 - Creating Custom Windows]]</span><span style="float: right">[[Advanced_SCI_Tutorials|Next: Phil Fortier's Advanced SCI Tutorials >]]</span>

 

[[Category:Controls]]
[[Category:Tutorials]]

Custom Buttons

2023-06-01T08:46:23Z

Rob Craig: /* Scripting The Button */

=Chapter 7 - Creating Custom Buttons=

By default, the interpreter draws all the windows and controls for the game's GUI. However, with some creative coding, they can be easily customized. This tutorial will teach you how to create custom buttons with views.

===Load The Game===

First you need to open your game in SCI Studio, loading the Resource Explorer.

===The Button View===

First the buttons will need a view so there's something to draw. I've set up the view so that cels 0-3 are for the button's edges, and 4-7 are for the left, top, right and bottom borders. It can be easily customized to create your own custom button.

The cels are 8x8 pixels. Though they really would only need to be 4x4, they should be no less than 8x8. If they are too small, it will take too long to draw the buttons.

To save time, [http://sierrahelp.com/Files/SCI/view.900 click here] and download it.

Add the view to the game. I chose to number it view.900, but it can be numbered anything you like.

===Scripting The Button===

In the resource explorer, select '''Script''' from the left resource tree. This will bring up the list of scripts in your game on the right. Double click on the "'''Controls.sc'''" script. It will load it up in the script editor.

Though customizing a button is generally simple, there are many extra steps which must be taken to give it optimum performance and prevent interference.

{| width="100%"
| width="216" | [[Image:Controls-DButton.png|DButton class]]
| width="100%" valign="top" | First, scroll down controls.sc to the DButton class.
|-
| width="216" | [[Image:Controls-SetSize.png|setSize() method]]
| width="100%" valign="top" | Next, scroll down to the setSize() method.
|}

<blockquote>
(Studio Script).
Change:
<div class="CodeBlockHeader">Code:</div>
<syntaxhighlight lang="sci" class="cs">= nsBottom (+ nsTop rect[rtBOTTOM])</syntaxhighlight>
(Studio Script) to:
<div class="CodeBlockHeader">Code:</div>
<syntaxhighlight lang="sci" class="cs">= nsBottom (+ nsTop(| (& rect[rtBOTTOM] $FFFC) 7))</syntaxhighlight>

(Sierra Script)
Change:
<div class="CodeBlockHeader">Code:</div>
<syntaxhighlight lang="sci" class="cs">(= nsBottom (+ nsTop [rect rtBOTTOM]))</syntaxhighlight>

(Sierra Script)
To:
<div class="CodeBlockHeader">Code:</div>
<syntaxhighlight lang="sci" class="cs">(= nsBottom (+ nsTop (| (& [rect rtBOTTOM] $FFFC) 7)))</syntaxhighlight>

(Studio Script)
Change:
<div class="CodeBlockHeader">Code:</div>
<syntaxhighlight lang="sci" class="cs">(= nsBottom (+ nsTop (| (& [rect rtBOTTOM] $FFFC) 7)))</syntaxhighlight>
(Studio Script) to:
<div class="CodeBlockHeader">Code:</div>
<syntaxhighlight lang="sci" class="cs">= nsRight (+ (| (& rect[rtRIGHT] $FFFC) 7) nsLeft)</syntaxhighlight>

(Sierra Script)
Change:
<div class="CodeBlockHeader">Code:</div>
<syntaxhighlight lang="sci" class="cs">(= nsRight (+ [rect rtRIGHT] nsLeft))</syntaxhighlight>

(Sierra Script)
To:
<div class="CodeBlockHeader">Code:</div>
<syntaxhighlight lang="sci" class="cs">(= nsRight (+ (| (& [rect rtRIGHT] $FFFC) 7) nsLeft))</syntaxhighlight>

This makes the control always in dimensions divisible by eight (i.e. 8,16,24,32,etc.). This is needed because we are using 8x8 cels.
</blockquote>

Next, we'll need to add a draw method to the DButton class to override the default one.

<blockquote>
(Studio Script) Add the following code to the DButton class.
<div class="CodeBlockHeader">Code:</div>
<syntaxhighlight lang="sci" class="cs"> (method (draw)
(var x, y, x2, y2, w, h, rect[4])

// Calculate the areas
= x2 (- nsRight 8)
= y2 (- nsBottom 8)
= w (- nsRight nsLeft)
= h (- nsBottom nsTop)
TextSize(@rect text font)

// Draw the side borders
(for(= y(+ nsTop 8)) (< y y2) (= y + y 8)
DrawCel(900 0 4 nsLeft y -1)
DrawCel(900 0 6 x2 y -1)
)
// Draw the top and bottom borders
(for(= x(+ nsLeft 8)) (< x x2) (= x + x 8)
DrawCel(900 0 5 x nsTop -1)
DrawCel(900 0 7 x y2 -1)
)
// Draw the corners
DrawCel(900 0 0 nsLeft nsTop -1)
DrawCel(900 0 1 x2 nsTop -1)
DrawCel(900 0 2 nsLeft y2 -1)
DrawCel(900 0 3 x2 y2 -1)
// Draw the text
Display(text
dsCOORD
+ nsLeft (>> (- w rect[rtRIGHT]) 1)
+ (+ nsTop (>> (- h rect[rtBOTTOM]) 1) 1)
dsCOLOR
gWndColor
dsBACKGROUND
clTRANSPARENT
dsFONT
font
dsWIDTH
rect[rtRIGHT]
)
)</syntaxhighlight>

(Sierra Script) Add a draw method to the DButton class to override the default one. (Please note this code needs to be added before the method (method (setSize &tmp [rect 4]).
<div class="CodeBlockHeader">Code:</div>
<syntaxhighlight lang="sci" class="cs"> (method (draw &tmp x y x2 y2 w h [rect 4])
; Calculate the areas
(= x2 (- nsRight 8))
(= y2 (- nsBottom 8))
(= w (- nsRight nsLeft))
(= h (- nsBottom nsTop))
(TextSize @rect text font)
; Draw the side borders
(for ( (= y (+ nsTop 8))) (< y y2) ( (= y (+ y 8))) (DrawCel 902 0 4 nsLeft y -1) (DrawCel 902 0 6 x2 y -1))
; Draw the top and bottom borders
(for ( (= x (+ nsLeft 8))) (< x x2) ( (= x (+ x 8))) (DrawCel 902 0 5 x nsTop -1) (DrawCel 902 0 7 x y2 -1))
; Draw the corners
(DrawCel 902 0 0 nsLeft nsTop -1)
(DrawCel 902 0 1 x2 nsTop -1)
(DrawCel 902 0 2 nsLeft y2 -1)
(DrawCel 902 0 3 x2 y2 -1)
; Draw the text
(Display
text
dsCOORD
(+ nsLeft (>> (- w [rect rtRIGHT]) 1))
(+ (+ nsTop (>> (- h [rect rtBOTTOM]) 1)) 1)
dsCOLOR gWndColor
dsBACKGROUND clTRANSPARENT
dsFONT font
dsWIDTH [rect rtRIGHT]
)
)</syntaxhighlight>

Needless to say, that code draws the button. It draws the border and edges, then centers and draws the text. It doesn't bother drawing the inside of the button and just leaves it transparent for speed. It would be a lot slower if it filled in the button with cels.
</blockquote>

{| width="100%"
| width="113" | [[Image:Script-Main.png|Main Script]]
| width="100%" | Chances are, you'll want to customize the window colors to go with the button, right? If that's the case, open up the "'''Main.sc'''" script.
|}

{| width="100%"
| width="216" | [[Image:Script-GameInstance.png|Game Instance]]
| width="100%" | Next, scroll down main.sc to the Game instance.

At the very top of the init() method, you will see the window color initialization.
|}

* The gWndColor is the color for the text and borders of of the non-custom controls.
* The gWndBack is the color of the actual window.

Studio/Sierra Script:
<blockquote>
To go with the default custom button, we'll make the window silver. Change:
<div class="CodeBlockHeader">Code:</div>
<syntaxhighlight lang="sci" class="cs">= gWndBack clWHITE</syntaxhighlight>
Studio/Sierra Script:
To:
To go with the default custom button, we'll make the window silver. Change:
<div class="CodeBlockHeader">Code:</div>
<syntaxhighlight lang="sci" class="cs">= gWndBack clSILVER</syntaxhighlight>
</blockquote>

<p align="center">Run the game all you'll see your brand new custom buttons!<br />[[Image:Controls-QuitDialog.png|Quit Button]]</p>

That sums it up! Be sure to check out how to make custom windows and gauges!

 

<span style="float: left">[[Checking a Door's State|< Previous: Chapter 6 - Checking a Door's State]]</span>
<span style="float: right">[[Custom Windows|Chapter 8 - Creating Custom Windows >]]</span>

 

[[Category:Controls]]
[[Category:Tutorials]]

Custom Buttons

2023-06-01T08:44:18Z

Rob Craig: /* Scripting The Button */

=Chapter 7 - Creating Custom Buttons=

By default, the interpreter draws all the windows and controls for the game's GUI. However, with some creative coding, they can be easily customized. This tutorial will teach you how to create custom buttons with views.

===Load The Game===

First you need to open your game in SCI Studio, loading the Resource Explorer.

===The Button View===

First the buttons will need a view so there's something to draw. I've set up the view so that cels 0-3 are for the button's edges, and 4-7 are for the left, top, right and bottom borders. It can be easily customized to create your own custom button.

The cels are 8x8 pixels. Though they really would only need to be 4x4, they should be no less than 8x8. If they are too small, it will take too long to draw the buttons.

To save time, [http://sierrahelp.com/Files/SCI/view.900 click here] and download it.

Add the view to the game. I chose to number it view.900, but it can be numbered anything you like.

===Scripting The Button===

In the resource explorer, select '''Script''' from the left resource tree. This will bring up the list of scripts in your game on the right. Double click on the "'''Controls.sc'''" script. It will load it up in the script editor.

Though customizing a button is generally simple, there are many extra steps which must be taken to give it optimum performance and prevent interference.

{| width="100%"
| width="216" | [[Image:Controls-DButton.png|DButton class]]
| width="100%" valign="top" | First, scroll down controls.sc to the DButton class.
|-
| width="216" | [[Image:Controls-SetSize.png|setSize() method]]
| width="100%" valign="top" | Next, scroll down to the setSize() method.
|}

<blockquote>
(Studio Script).
Change:
<div class="CodeBlockHeader">Code:</div>
<syntaxhighlight lang="sci" class="cs">= nsBottom (+ nsTop rect[rtBOTTOM])</syntaxhighlight>
(Studio Script) to:
<div class="CodeBlockHeader">Code:</div>
<syntaxhighlight lang="sci" class="cs">= nsBottom (+ nsTop(| (& rect[rtBOTTOM] $FFFC) 7))</syntaxhighlight>

(Sierra Script)
Change:
<div class="CodeBlockHeader">Code:</div>
<syntaxhighlight lang="sci" class="cs">(= nsBottom (+ nsTop [rect rtBOTTOM]))</syntaxhighlight>

(Sierra Script)
To:
<div class="CodeBlockHeader">Code:</div>
<syntaxhighlight lang="sci" class="cs">(= nsBottom (+ nsTop (| (& [rect rtBOTTOM] $FFFC) 7)))</syntaxhighlight>

(Studio Script)
Change:
<div class="CodeBlockHeader">Code:</div>
<syntaxhighlight lang="sci" class="cs">(= nsBottom (+ nsTop (| (& [rect rtBOTTOM] $FFFC) 7)))</syntaxhighlight>
(Studio Script) to:
<div class="CodeBlockHeader">Code:</div>
<syntaxhighlight lang="sci" class="cs">= nsRight (+ (| (& rect[rtRIGHT] $FFFC) 7) nsLeft)</syntaxhighlight>

(Sierra Script)
Change:
<div class="CodeBlockHeader">Code:</div>
<syntaxhighlight lang="sci" class="cs">(= nsRight (+ [rect rtRIGHT] nsLeft))</syntaxhighlight>

(Sierra Script)
To:
<div class="CodeBlockHeader">Code:</div>
<syntaxhighlight lang="sci" class="cs">(= nsRight (+ (| (& [rect rtRIGHT] $FFFC) 7) nsLeft))</syntaxhighlight>

This makes the control always in dimensions divisible by eight (i.e. 8,16,24,32,etc.). This is needed because we are using 8x8 cels.
</blockquote>

Next, we'll need to add a draw method to the DButton class to override the default one.
(Studio Script)

<blockquote>
Add the following code to the DButton class.
<div class="CodeBlockHeader">Code:</div>
<syntaxhighlight lang="sci" class="cs"> (method (draw)
(var x, y, x2, y2, w, h, rect[4])

// Calculate the areas
= x2 (- nsRight 8)
= y2 (- nsBottom 8)
= w (- nsRight nsLeft)
= h (- nsBottom nsTop)
TextSize(@rect text font)

// Draw the side borders
(for(= y(+ nsTop 8)) (< y y2) (= y + y 8)
DrawCel(900 0 4 nsLeft y -1)
DrawCel(900 0 6 x2 y -1)
)
// Draw the top and bottom borders
(for(= x(+ nsLeft 8)) (< x x2) (= x + x 8)
DrawCel(900 0 5 x nsTop -1)
DrawCel(900 0 7 x y2 -1)
)
// Draw the corners
DrawCel(900 0 0 nsLeft nsTop -1)
DrawCel(900 0 1 x2 nsTop -1)
DrawCel(900 0 2 nsLeft y2 -1)
DrawCel(900 0 3 x2 y2 -1)
// Draw the text
Display(text
dsCOORD
+ nsLeft (>> (- w rect[rtRIGHT]) 1)
+ (+ nsTop (>> (- h rect[rtBOTTOM]) 1) 1)
dsCOLOR
gWndColor
dsBACKGROUND
clTRANSPARENT
dsFONT
font
dsWIDTH
rect[rtRIGHT]
)
)</syntaxhighlight>

(Sierra Script) Add a draw method to the DButton class to override the default one. (Please note this code needs to be added before the method (method (setSize &tmp [rect 4]).
<div class="CodeBlockHeader">Code:</div>
<syntaxhighlight lang="sci" class="cs"> (method (draw &tmp x y x2 y2 w h [rect 4])
; Calculate the areas
(= x2 (- nsRight 8))
(= y2 (- nsBottom 8))
(= w (- nsRight nsLeft))
(= h (- nsBottom nsTop))
(TextSize @rect text font)
; Draw the side borders
(for ( (= y (+ nsTop 8))) (< y y2) ( (= y (+ y 8))) (DrawCel 902 0 4 nsLeft y -1) (DrawCel 902 0 6 x2 y -1))
; Draw the top and bottom borders
(for ( (= x (+ nsLeft 8))) (< x x2) ( (= x (+ x 8))) (DrawCel 902 0 5 x nsTop -1) (DrawCel 902 0 7 x y2 -1))
; Draw the corners
(DrawCel 902 0 0 nsLeft nsTop -1)
(DrawCel 902 0 1 x2 nsTop -1)
(DrawCel 902 0 2 nsLeft y2 -1)
(DrawCel 902 0 3 x2 y2 -1)
; Draw the text
(Display
text
dsCOORD
(+ nsLeft (>> (- w [rect rtRIGHT]) 1))
(+ (+ nsTop (>> (- h [rect rtBOTTOM]) 1)) 1)
dsCOLOR gWndColor
dsBACKGROUND clTRANSPARENT
dsFONT font
dsWIDTH [rect rtRIGHT]
)
)</syntaxhighlight>

Needless to say, that code draws the button. It draws the border and edges, then centers and draws the text. It doesn't bother drawing the inside of the button and just leaves it transparent for speed. It would be a lot slower if it filled in the button with cels.
</blockquote>

{| width="100%"
| width="113" | [[Image:Script-Main.png|Main Script]]
| width="100%" | Chances are, you'll want to customize the window colors to go with the button, right? If that's the case, open up the "'''Main.sc'''" script.
|}

{| width="100%"
| width="216" | [[Image:Script-GameInstance.png|Game Instance]]
| width="100%" | Next, scroll down main.sc to the Game instance.

At the very top of the init() method, you will see the window color initialization.
|}

* The gWndColor is the color for the text and borders of of the non-custom controls.
* The gWndBack is the color of the actual window.

<blockquote>
To go with the default custom button, we'll make the window silver. Change:
<div class="CodeBlockHeader">Code:</div>
<syntaxhighlight lang="sci" class="cs">= gWndBack clWHITE</syntaxhighlight>
To:
To go with the default custom button, we'll make the window silver. Change:
<div class="CodeBlockHeader">Code:</div>
<syntaxhighlight lang="sci" class="cs">= gWndBack clSILVER</syntaxhighlight>
</blockquote>

<p align="center">Run the game all you'll see your brand new custom buttons!<br />[[Image:Controls-QuitDialog.png|Quit Button]]</p>

That sums it up! Be sure to check out how to make custom windows and gauges!

 

<span style="float: left">[[Checking a Door's State|< Previous: Chapter 6 - Checking a Door's State]]</span>
<span style="float: right">[[Custom Windows|Chapter 8 - Creating Custom Windows >]]</span>

 

[[Category:Controls]]
[[Category:Tutorials]]

Custom Buttons

2023-06-01T08:39:44Z

Rob Craig: /* Scripting The Button */

=Chapter 7 - Creating Custom Buttons=

By default, the interpreter draws all the windows and controls for the game's GUI. However, with some creative coding, they can be easily customized. This tutorial will teach you how to create custom buttons with views.

===Load The Game===

First you need to open your game in SCI Studio, loading the Resource Explorer.

===The Button View===

First the buttons will need a view so there's something to draw. I've set up the view so that cels 0-3 are for the button's edges, and 4-7 are for the left, top, right and bottom borders. It can be easily customized to create your own custom button.

The cels are 8x8 pixels. Though they really would only need to be 4x4, they should be no less than 8x8. If they are too small, it will take too long to draw the buttons.

To save time, [http://sierrahelp.com/Files/SCI/view.900 click here] and download it.

Add the view to the game. I chose to number it view.900, but it can be numbered anything you like.

===Scripting The Button===

In the resource explorer, select '''Script''' from the left resource tree. This will bring up the list of scripts in your game on the right. Double click on the "'''Controls.sc'''" script. It will load it up in the script editor.

Though customizing a button is generally simple, there are many extra steps which must be taken to give it optimum performance and prevent interference.

{| width="100%"
| width="216" | [[Image:Controls-DButton.png|DButton class]]
| width="100%" valign="top" | First, scroll down controls.sc to the DButton class.
|-
| width="216" | [[Image:Controls-SetSize.png|setSize() method]]
| width="100%" valign="top" | Next, scroll down to the setSize() method.
|}

<blockquote>
(Studio Script).
Change:
<div class="CodeBlockHeader">Code:</div>
<syntaxhighlight lang="sci" class="cs">= nsBottom (+ nsTop rect[rtBOTTOM])</syntaxhighlight>
(Studio Script) to:
<div class="CodeBlockHeader">Code:</div>
<syntaxhighlight lang="sci" class="cs">= nsBottom (+ nsTop(| (& rect[rtBOTTOM] $FFFC) 7))</syntaxhighlight>

(Sierra Script)
Change:
<div class="CodeBlockHeader">Code:</div>
<syntaxhighlight lang="sci" class="cs">(= nsBottom (+ nsTop [rect rtBOTTOM]))</syntaxhighlight>

(Sierra Script)
To:
<div class="CodeBlockHeader">Code:</div>
<syntaxhighlight lang="sci" class="cs">(= nsBottom (+ nsTop (| (& [rect rtBOTTOM] $FFFC) 7)))</syntaxhighlight>

(Studio Script)
Change:
<div class="CodeBlockHeader">Code:</div>
<syntaxhighlight lang="sci" class="cs">(= nsBottom (+ nsTop (| (& [rect rtBOTTOM] $FFFC) 7)))</syntaxhighlight>
(Studio Script) to:
<div class="CodeBlockHeader">Code:</div>
<syntaxhighlight lang="sci" class="cs">= nsRight (+ (| (& rect[rtRIGHT] $FFFC) 7) nsLeft)</syntaxhighlight>

(Sierra Script)
Change:
<div class="CodeBlockHeader">Code:</div>
<syntaxhighlight lang="sci" class="cs">(= nsRight (+ [rect rtRIGHT] nsLeft))</syntaxhighlight>

(Sierra Script)
To:
<div class="CodeBlockHeader">Code:</div>
<syntaxhighlight lang="sci" class="cs">(= nsRight (+ (| (& [rect rtRIGHT] $FFFC) 7) nsLeft))</syntaxhighlight>

This makes the control always in dimensions divisible by eight (i.e. 8,16,24,32,etc.). This is needed because we are using 8x8 cels.
</blockquote>

Next, we'll need to add a draw method to the DButton class to override the default one.

<blockquote>
Add the following code to the DButton class.
<div class="CodeBlockHeader">Code:</div>
<syntaxhighlight lang="sci" class="cs"> (method (draw)
(var x, y, x2, y2, w, h, rect[4])

// Calculate the areas
= x2 (- nsRight 8)
= y2 (- nsBottom 8)
= w (- nsRight nsLeft)
= h (- nsBottom nsTop)
TextSize(@rect text font)

// Draw the side borders
(for(= y(+ nsTop 8)) (< y y2) (= y + y 8)
DrawCel(900 0 4 nsLeft y -1)
DrawCel(900 0 6 x2 y -1)
)
// Draw the top and bottom borders
(for(= x(+ nsLeft 8)) (< x x2) (= x + x 8)
DrawCel(900 0 5 x nsTop -1)
DrawCel(900 0 7 x y2 -1)
)
// Draw the corners
DrawCel(900 0 0 nsLeft nsTop -1)
DrawCel(900 0 1 x2 nsTop -1)
DrawCel(900 0 2 nsLeft y2 -1)
DrawCel(900 0 3 x2 y2 -1)
// Draw the text
Display(text
dsCOORD
+ nsLeft (>> (- w rect[rtRIGHT]) 1)
+ (+ nsTop (>> (- h rect[rtBOTTOM]) 1) 1)
dsCOLOR
gWndColor
dsBACKGROUND
clTRANSPARENT
dsFONT
font
dsWIDTH
rect[rtRIGHT]
)
)</syntaxhighlight>

SCI code for SCI Companion.
<div class="CodeBlockHeader">Code:</div>
<syntaxhighlight lang="sci" class="cs"> (method (draw &tmp x y x2 y2 w h [rect 4])
; Calculate the areas
(= x2 (- nsRight 8))
(= y2 (- nsBottom 8))
(= w (- nsRight nsLeft))
(= h (- nsBottom nsTop))
(TextSize @rect text font)
; Draw the side borders
(for ( (= y (+ nsTop 8))) (< y y2) ( (= y (+ y 8))) (DrawCel 902 0 4 nsLeft y -1) (DrawCel 902 0 6 x2 y -1))
; Draw the top and bottom borders
(for ( (= x (+ nsLeft 8))) (< x x2) ( (= x (+ x 8))) (DrawCel 902 0 5 x nsTop -1) (DrawCel 902 0 7 x y2 -1))
; Draw the corners
(DrawCel 902 0 0 nsLeft nsTop -1)
(DrawCel 902 0 1 x2 nsTop -1)
(DrawCel 902 0 2 nsLeft y2 -1)
(DrawCel 902 0 3 x2 y2 -1)
; Draw the text
(Display
text
dsCOORD
(+ nsLeft (>> (- w [rect rtRIGHT]) 1))
(+ (+ nsTop (>> (- h [rect rtBOTTOM]) 1)) 1)
dsCOLOR gWndColor
dsBACKGROUND clTRANSPARENT
dsFONT font
dsWIDTH [rect rtRIGHT]
)
)</syntaxhighlight>

Needless to say, that code draws the button. It draws the border and edges, then centers and draws the text. It doesn't bother drawing the inside of the button and just leaves it transparent for speed. It would be a lot slower if it filled in the button with cels.
</blockquote>

{| width="100%"
| width="113" | [[Image:Script-Main.png|Main Script]]
| width="100%" | Chances are, you'll want to customize the window colors to go with the button, right? If that's the case, open up the "'''Main.sc'''" script.
|}

{| width="100%"
| width="216" | [[Image:Script-GameInstance.png|Game Instance]]
| width="100%" | Next, scroll down main.sc to the Game instance.

At the very top of the init() method, you will see the window color initialization.
|}

* The gWndColor is the color for the text and borders of of the non-custom controls.
* The gWndBack is the color of the actual window.

<blockquote>
To go with the default custom button, we'll make the window silver. Change:
<div class="CodeBlockHeader">Code:</div>
<syntaxhighlight lang="sci" class="cs">= gWndBack clWHITE</syntaxhighlight>
To:
To go with the default custom button, we'll make the window silver. Change:
<div class="CodeBlockHeader">Code:</div>
<syntaxhighlight lang="sci" class="cs">= gWndBack clSILVER</syntaxhighlight>
</blockquote>

<p align="center">Run the game all you'll see your brand new custom buttons!<br />[[Image:Controls-QuitDialog.png|Quit Button]]</p>

That sums it up! Be sure to check out how to make custom windows and gauges!

 

<span style="float: left">[[Checking a Door's State|< Previous: Chapter 6 - Checking a Door's State]]</span>
<span style="float: right">[[Custom Windows|Chapter 8 - Creating Custom Windows >]]</span>

 

[[Category:Controls]]
[[Category:Tutorials]]

Custom Buttons

2023-06-01T08:36:58Z

Rob Craig: /* Scripting The Button */

=Chapter 7 - Creating Custom Buttons=

By default, the interpreter draws all the windows and controls for the game's GUI. However, with some creative coding, they can be easily customized. This tutorial will teach you how to create custom buttons with views.

===Load The Game===

First you need to open your game in SCI Studio, loading the Resource Explorer.

===The Button View===

First the buttons will need a view so there's something to draw. I've set up the view so that cels 0-3 are for the button's edges, and 4-7 are for the left, top, right and bottom borders. It can be easily customized to create your own custom button.

The cels are 8x8 pixels. Though they really would only need to be 4x4, they should be no less than 8x8. If they are too small, it will take too long to draw the buttons.

To save time, [http://sierrahelp.com/Files/SCI/view.900 click here] and download it.

Add the view to the game. I chose to number it view.900, but it can be numbered anything you like.

===Scripting The Button===

In the resource explorer, select '''Script''' from the left resource tree. This will bring up the list of scripts in your game on the right. Double click on the "'''Controls.sc'''" script. It will load it up in the script editor.

Though customizing a button is generally simple, there are many extra steps which must be taken to give it optimum performance and prevent interference.

{| width="100%"
| width="216" | [[Image:Controls-DButton.png|DButton class]]
| width="100%" valign="top" | First, scroll down controls.sc to the DButton class.
|-
| width="216" | [[Image:Controls-SetSize.png|setSize() method]]
| width="100%" valign="top" | Next, scroll down to the setSize() method.
|}

<blockquote>
(Studio Script).
Change:
<div class="CodeBlockHeader">Code:</div>
<syntaxhighlight lang="sci" class="cs">= nsBottom (+ nsTop rect[rtBOTTOM])</syntaxhighlight>
(Studio Script) to:
<div class="CodeBlockHeader">Code:</div>
<syntaxhighlight lang="sci" class="cs">= nsBottom (+ nsTop(| (& rect[rtBOTTOM] $FFFC) 7))</syntaxhighlight>

(Sierra Script)
Change:
<div class="CodeBlockHeader">Code:</div>
<syntaxhighlight lang="sci" class="cs">(= nsBottom (+ nsTop [rect rtBOTTOM]))</syntaxhighlight>

(Sierra Script)
To:
<div class="CodeBlockHeader">Code:</div>
<syntaxhighlight lang="sci" class="cs">(= nsBottom (+ nsTop (| (& [rect rtBOTTOM] $FFFC) 7)))</syntaxhighlight>

(Studio Script)
Change:
<div class="CodeBlockHeader">Code:</div>
<syntaxhighlight lang="sci" class="cs">(= nsBottom (+ nsTop (| (& [rect rtBOTTOM] $FFFC) 7)))</syntaxhighlight>
(Studio Script) to:
<div class="CodeBlockHeader">Code:</div>
<syntaxhighlight lang="sci" class="cs">= nsRight (+ (| (& rect[rtRIGHT] $FFFC) 7) nsLeft)</syntaxhighlight>

(Sierra Script)
To:
<div class="CodeBlockHeader">Code:</div>
<syntaxhighlight lang="sci" class="cs">(= nsRight (+ (| (& [rect rtRIGHT] $FFFC) 7) nsLeft))</syntaxhighlight>

This makes the control always in dimensions divisible by eight (i.e. 8,16,24,32,etc.). This is needed because we are using 8x8 cels.
</blockquote>

Next, we'll need to add a draw method to the DButton class to override the default one.

<blockquote>
Add the following code to the DButton class.
<div class="CodeBlockHeader">Code:</div>
<syntaxhighlight lang="sci" class="cs"> (method (draw)
(var x, y, x2, y2, w, h, rect[4])

// Calculate the areas
= x2 (- nsRight 8)
= y2 (- nsBottom 8)
= w (- nsRight nsLeft)
= h (- nsBottom nsTop)
TextSize(@rect text font)

// Draw the side borders
(for(= y(+ nsTop 8)) (< y y2) (= y + y 8)
DrawCel(900 0 4 nsLeft y -1)
DrawCel(900 0 6 x2 y -1)
)
// Draw the top and bottom borders
(for(= x(+ nsLeft 8)) (< x x2) (= x + x 8)
DrawCel(900 0 5 x nsTop -1)
DrawCel(900 0 7 x y2 -1)
)
// Draw the corners
DrawCel(900 0 0 nsLeft nsTop -1)
DrawCel(900 0 1 x2 nsTop -1)
DrawCel(900 0 2 nsLeft y2 -1)
DrawCel(900 0 3 x2 y2 -1)
// Draw the text
Display(text
dsCOORD
+ nsLeft (>> (- w rect[rtRIGHT]) 1)
+ (+ nsTop (>> (- h rect[rtBOTTOM]) 1) 1)
dsCOLOR
gWndColor
dsBACKGROUND
clTRANSPARENT
dsFONT
font
dsWIDTH
rect[rtRIGHT]
)
)</syntaxhighlight>

SCI code for SCI Companion.
<div class="CodeBlockHeader">Code:</div>
<syntaxhighlight lang="sci" class="cs"> (method (draw &tmp x y x2 y2 w h [rect 4])
; Calculate the areas
(= x2 (- nsRight 8))
(= y2 (- nsBottom 8))
(= w (- nsRight nsLeft))
(= h (- nsBottom nsTop))
(TextSize @rect text font)
; Draw the side borders
(for ( (= y (+ nsTop 8))) (< y y2) ( (= y (+ y 8))) (DrawCel 902 0 4 nsLeft y -1) (DrawCel 902 0 6 x2 y -1))
; Draw the top and bottom borders
(for ( (= x (+ nsLeft 8))) (< x x2) ( (= x (+ x 8))) (DrawCel 902 0 5 x nsTop -1) (DrawCel 902 0 7 x y2 -1))
; Draw the corners
(DrawCel 902 0 0 nsLeft nsTop -1)
(DrawCel 902 0 1 x2 nsTop -1)
(DrawCel 902 0 2 nsLeft y2 -1)
(DrawCel 902 0 3 x2 y2 -1)
; Draw the text
(Display
text
dsCOORD
(+ nsLeft (>> (- w [rect rtRIGHT]) 1))
(+ (+ nsTop (>> (- h [rect rtBOTTOM]) 1)) 1)
dsCOLOR gWndColor
dsBACKGROUND clTRANSPARENT
dsFONT font
dsWIDTH [rect rtRIGHT]
)
)</syntaxhighlight>

Needless to say, that code draws the button. It draws the border and edges, then centers and draws the text. It doesn't bother drawing the inside of the button and just leaves it transparent for speed. It would be a lot slower if it filled in the button with cels.
</blockquote>

{| width="100%"
| width="113" | [[Image:Script-Main.png|Main Script]]
| width="100%" | Chances are, you'll want to customize the window colors to go with the button, right? If that's the case, open up the "'''Main.sc'''" script.
|}

{| width="100%"
| width="216" | [[Image:Script-GameInstance.png|Game Instance]]
| width="100%" | Next, scroll down main.sc to the Game instance.

At the very top of the init() method, you will see the window color initialization.
|}

* The gWndColor is the color for the text and borders of of the non-custom controls.
* The gWndBack is the color of the actual window.

<blockquote>
To go with the default custom button, we'll make the window silver. Change:
<div class="CodeBlockHeader">Code:</div>
<syntaxhighlight lang="sci" class="cs">= gWndBack clWHITE</syntaxhighlight>
To:
To go with the default custom button, we'll make the window silver. Change:
<div class="CodeBlockHeader">Code:</div>
<syntaxhighlight lang="sci" class="cs">= gWndBack clSILVER</syntaxhighlight>
</blockquote>

<p align="center">Run the game all you'll see your brand new custom buttons!<br />[[Image:Controls-QuitDialog.png|Quit Button]]</p>

That sums it up! Be sure to check out how to make custom windows and gauges!

 

<span style="float: left">[[Checking a Door's State|< Previous: Chapter 6 - Checking a Door's State]]</span>
<span style="float: right">[[Custom Windows|Chapter 8 - Creating Custom Windows >]]</span>

 

[[Category:Controls]]
[[Category:Tutorials]]

Custom Buttons

2023-06-01T08:36:34Z

Rob Craig: /* Scripting The Button */

=Chapter 7 - Creating Custom Buttons=

By default, the interpreter draws all the windows and controls for the game's GUI. However, with some creative coding, they can be easily customized. This tutorial will teach you how to create custom buttons with views.

===Load The Game===

First you need to open your game in SCI Studio, loading the Resource Explorer.

===The Button View===

First the buttons will need a view so there's something to draw. I've set up the view so that cels 0-3 are for the button's edges, and 4-7 are for the left, top, right and bottom borders. It can be easily customized to create your own custom button.

The cels are 8x8 pixels. Though they really would only need to be 4x4, they should be no less than 8x8. If they are too small, it will take too long to draw the buttons.

To save time, [http://sierrahelp.com/Files/SCI/view.900 click here] and download it.

Add the view to the game. I chose to number it view.900, but it can be numbered anything you like.

===Scripting The Button===

In the resource explorer, select '''Script''' from the left resource tree. This will bring up the list of scripts in your game on the right. Double click on the "'''Controls.sc'''" script. It will load it up in the script editor.

Though customizing a button is generally simple, there are many extra steps which must be taken to give it optimum performance and prevent interference.

{| width="100%"
| width="216" | [[Image:Controls-DButton.png|DButton class]]
| width="100%" valign="top" | First, scroll down controls.sc to the DButton class.
|-
| width="216" | [[Image:Controls-SetSize.png|setSize() method]]
| width="100%" valign="top" | Next, scroll down to the setSize() method.
|}

<blockquote>
(Studio Script).
Change:
<div class="CodeBlockHeader">Code:</div>
<syntaxhighlight lang="sci" class="cs">= nsBottom (+ nsTop rect[rtBOTTOM])</syntaxhighlight>
(Studio Script example) to:
<div class="CodeBlockHeader">Code:</div>
<syntaxhighlight lang="sci" class="cs">= nsBottom (+ nsTop(| (& rect[rtBOTTOM] $FFFC) 7))</syntaxhighlight>

(Sierra Script)
Change:
<div class="CodeBlockHeader">Code:</div>
<syntaxhighlight lang="sci" class="cs">(= nsBottom (+ nsTop [rect rtBOTTOM]))</syntaxhighlight>

(Sierra Script)
To:
<div class="CodeBlockHeader">Code:</div>
<syntaxhighlight lang="sci" class="cs">(= nsBottom (+ nsTop (| (& [rect rtBOTTOM] $FFFC) 7)))</syntaxhighlight>

(Studio Script)
Change:
<div class="CodeBlockHeader">Code:</div>
<syntaxhighlight lang="sci" class="cs">(= nsBottom (+ nsTop (| (& [rect rtBOTTOM] $FFFC) 7)))</syntaxhighlight>
(Studio Script) to:
<div class="CodeBlockHeader">Code:</div>
<syntaxhighlight lang="sci" class="cs">= nsRight (+ (| (& rect[rtRIGHT] $FFFC) 7) nsLeft)</syntaxhighlight>

(Sierra Script)
To:
<div class="CodeBlockHeader">Code:</div>
<syntaxhighlight lang="sci" class="cs">(= nsRight (+ (| (& [rect rtRIGHT] $FFFC) 7) nsLeft))</syntaxhighlight>

This makes the control always in dimensions divisible by eight (i.e. 8,16,24,32,etc.). This is needed because we are using 8x8 cels.
</blockquote>

Next, we'll need to add a draw method to the DButton class to override the default one.

<blockquote>
Add the following code to the DButton class.
<div class="CodeBlockHeader">Code:</div>
<syntaxhighlight lang="sci" class="cs"> (method (draw)
(var x, y, x2, y2, w, h, rect[4])

// Calculate the areas
= x2 (- nsRight 8)
= y2 (- nsBottom 8)
= w (- nsRight nsLeft)
= h (- nsBottom nsTop)
TextSize(@rect text font)

// Draw the side borders
(for(= y(+ nsTop 8)) (< y y2) (= y + y 8)
DrawCel(900 0 4 nsLeft y -1)
DrawCel(900 0 6 x2 y -1)
)
// Draw the top and bottom borders
(for(= x(+ nsLeft 8)) (< x x2) (= x + x 8)
DrawCel(900 0 5 x nsTop -1)
DrawCel(900 0 7 x y2 -1)
)
// Draw the corners
DrawCel(900 0 0 nsLeft nsTop -1)
DrawCel(900 0 1 x2 nsTop -1)
DrawCel(900 0 2 nsLeft y2 -1)
DrawCel(900 0 3 x2 y2 -1)
// Draw the text
Display(text
dsCOORD
+ nsLeft (>> (- w rect[rtRIGHT]) 1)
+ (+ nsTop (>> (- h rect[rtBOTTOM]) 1) 1)
dsCOLOR
gWndColor
dsBACKGROUND
clTRANSPARENT
dsFONT
font
dsWIDTH
rect[rtRIGHT]
)
)</syntaxhighlight>

SCI code for SCI Companion.
<div class="CodeBlockHeader">Code:</div>
<syntaxhighlight lang="sci" class="cs"> (method (draw &tmp x y x2 y2 w h [rect 4])
; Calculate the areas
(= x2 (- nsRight 8))
(= y2 (- nsBottom 8))
(= w (- nsRight nsLeft))
(= h (- nsBottom nsTop))
(TextSize @rect text font)
; Draw the side borders
(for ( (= y (+ nsTop 8))) (< y y2) ( (= y (+ y 8))) (DrawCel 902 0 4 nsLeft y -1) (DrawCel 902 0 6 x2 y -1))
; Draw the top and bottom borders
(for ( (= x (+ nsLeft 8))) (< x x2) ( (= x (+ x 8))) (DrawCel 902 0 5 x nsTop -1) (DrawCel 902 0 7 x y2 -1))
; Draw the corners
(DrawCel 902 0 0 nsLeft nsTop -1)
(DrawCel 902 0 1 x2 nsTop -1)
(DrawCel 902 0 2 nsLeft y2 -1)
(DrawCel 902 0 3 x2 y2 -1)
; Draw the text
(Display
text
dsCOORD
(+ nsLeft (>> (- w [rect rtRIGHT]) 1))
(+ (+ nsTop (>> (- h [rect rtBOTTOM]) 1)) 1)
dsCOLOR gWndColor
dsBACKGROUND clTRANSPARENT
dsFONT font
dsWIDTH [rect rtRIGHT]
)
)</syntaxhighlight>

Needless to say, that code draws the button. It draws the border and edges, then centers and draws the text. It doesn't bother drawing the inside of the button and just leaves it transparent for speed. It would be a lot slower if it filled in the button with cels.
</blockquote>

{| width="100%"
| width="113" | [[Image:Script-Main.png|Main Script]]
| width="100%" | Chances are, you'll want to customize the window colors to go with the button, right? If that's the case, open up the "'''Main.sc'''" script.
|}

{| width="100%"
| width="216" | [[Image:Script-GameInstance.png|Game Instance]]
| width="100%" | Next, scroll down main.sc to the Game instance.

At the very top of the init() method, you will see the window color initialization.
|}

* The gWndColor is the color for the text and borders of of the non-custom controls.
* The gWndBack is the color of the actual window.

<blockquote>
To go with the default custom button, we'll make the window silver. Change:
<div class="CodeBlockHeader">Code:</div>
<syntaxhighlight lang="sci" class="cs">= gWndBack clWHITE</syntaxhighlight>
To:
To go with the default custom button, we'll make the window silver. Change:
<div class="CodeBlockHeader">Code:</div>
<syntaxhighlight lang="sci" class="cs">= gWndBack clSILVER</syntaxhighlight>
</blockquote>

<p align="center">Run the game all you'll see your brand new custom buttons!<br />[[Image:Controls-QuitDialog.png|Quit Button]]</p>

That sums it up! Be sure to check out how to make custom windows and gauges!

 

<span style="float: left">[[Checking a Door's State|< Previous: Chapter 6 - Checking a Door's State]]</span>
<span style="float: right">[[Custom Windows|Chapter 8 - Creating Custom Windows >]]</span>

 

[[Category:Controls]]
[[Category:Tutorials]]

Custom Buttons

2023-06-01T08:36:03Z

Rob Craig: /* Scripting The Button */

=Chapter 7 - Creating Custom Buttons=

By default, the interpreter draws all the windows and controls for the game's GUI. However, with some creative coding, they can be easily customized. This tutorial will teach you how to create custom buttons with views.

===Load The Game===

First you need to open your game in SCI Studio, loading the Resource Explorer.

===The Button View===

First the buttons will need a view so there's something to draw. I've set up the view so that cels 0-3 are for the button's edges, and 4-7 are for the left, top, right and bottom borders. It can be easily customized to create your own custom button.

The cels are 8x8 pixels. Though they really would only need to be 4x4, they should be no less than 8x8. If they are too small, it will take too long to draw the buttons.

To save time, [http://sierrahelp.com/Files/SCI/view.900 click here] and download it.

Add the view to the game. I chose to number it view.900, but it can be numbered anything you like.

===Scripting The Button===

In the resource explorer, select '''Script''' from the left resource tree. This will bring up the list of scripts in your game on the right. Double click on the "'''Controls.sc'''" script. It will load it up in the script editor.

Though customizing a button is generally simple, there are many extra steps which must be taken to give it optimum performance and prevent interference.

{| width="100%"
| width="216" | [[Image:Controls-DButton.png|DButton class]]
| width="100%" valign="top" | First, scroll down controls.sc to the DButton class.
|-
| width="216" | [[Image:Controls-SetSize.png|setSize() method]]
| width="100%" valign="top" | Next, scroll down to the setSize() method.
|}

<blockquote>
(Studio Script).
Change:
<div class="CodeBlockHeader">Code:</div>
<syntaxhighlight lang="sci" class="cs">= nsBottom (+ nsTop rect[rtBOTTOM])</syntaxhighlight>
(Studio Script example) to:
<div class="CodeBlockHeader">Code:</div>
<syntaxhighlight lang="sci" class="cs">= nsBottom (+ nsTop(| (& rect[rtBOTTOM] $FFFC) 7))</syntaxhighlight>

(Sierra Script)
Change:
<div class="CodeBlockHeader">Code:</div>
<syntaxhighlight lang="sci" class="cs">(= nsBottom (+ nsTop (| (& [rect rtBOTTOM] $FFFC) 7)))</syntaxhighlight>

(Sierra Script)
To:
<div class="CodeBlockHeader">Code:</div>
<syntaxhighlight lang="sci" class="cs">(= nsBottom (+ nsTop (| (& [rect rtBOTTOM] $FFFC) 7)))</syntaxhighlight>

(Studio Script)
Change:
<div class="CodeBlockHeader">Code:</div>
<syntaxhighlight lang="sci" class="cs">(= nsBottom (+ nsTop (| (& [rect rtBOTTOM] $FFFC) 7)))</syntaxhighlight>
(Studio Script) to:
<div class="CodeBlockHeader">Code:</div>
<syntaxhighlight lang="sci" class="cs">= nsRight (+ (| (& rect[rtRIGHT] $FFFC) 7) nsLeft)</syntaxhighlight>

(Sierra Script)
To:
<div class="CodeBlockHeader">Code:</div>
<syntaxhighlight lang="sci" class="cs">(= nsRight (+ (| (& [rect rtRIGHT] $FFFC) 7) nsLeft))</syntaxhighlight>

This makes the control always in dimensions divisible by eight (i.e. 8,16,24,32,etc.). This is needed because we are using 8x8 cels.
</blockquote>

Next, we'll need to add a draw method to the DButton class to override the default one.

<blockquote>
Add the following code to the DButton class.
<div class="CodeBlockHeader">Code:</div>
<syntaxhighlight lang="sci" class="cs"> (method (draw)
(var x, y, x2, y2, w, h, rect[4])

// Calculate the areas
= x2 (- nsRight 8)
= y2 (- nsBottom 8)
= w (- nsRight nsLeft)
= h (- nsBottom nsTop)
TextSize(@rect text font)

// Draw the side borders
(for(= y(+ nsTop 8)) (< y y2) (= y + y 8)
DrawCel(900 0 4 nsLeft y -1)
DrawCel(900 0 6 x2 y -1)
)
// Draw the top and bottom borders
(for(= x(+ nsLeft 8)) (< x x2) (= x + x 8)
DrawCel(900 0 5 x nsTop -1)
DrawCel(900 0 7 x y2 -1)
)
// Draw the corners
DrawCel(900 0 0 nsLeft nsTop -1)
DrawCel(900 0 1 x2 nsTop -1)
DrawCel(900 0 2 nsLeft y2 -1)
DrawCel(900 0 3 x2 y2 -1)
// Draw the text
Display(text
dsCOORD
+ nsLeft (>> (- w rect[rtRIGHT]) 1)
+ (+ nsTop (>> (- h rect[rtBOTTOM]) 1) 1)
dsCOLOR
gWndColor
dsBACKGROUND
clTRANSPARENT
dsFONT
font
dsWIDTH
rect[rtRIGHT]
)
)</syntaxhighlight>

SCI code for SCI Companion.
<div class="CodeBlockHeader">Code:</div>
<syntaxhighlight lang="sci" class="cs"> (method (draw &tmp x y x2 y2 w h [rect 4])
; Calculate the areas
(= x2 (- nsRight 8))
(= y2 (- nsBottom 8))
(= w (- nsRight nsLeft))
(= h (- nsBottom nsTop))
(TextSize @rect text font)
; Draw the side borders
(for ( (= y (+ nsTop 8))) (< y y2) ( (= y (+ y 8))) (DrawCel 902 0 4 nsLeft y -1) (DrawCel 902 0 6 x2 y -1))
; Draw the top and bottom borders
(for ( (= x (+ nsLeft 8))) (< x x2) ( (= x (+ x 8))) (DrawCel 902 0 5 x nsTop -1) (DrawCel 902 0 7 x y2 -1))
; Draw the corners
(DrawCel 902 0 0 nsLeft nsTop -1)
(DrawCel 902 0 1 x2 nsTop -1)
(DrawCel 902 0 2 nsLeft y2 -1)
(DrawCel 902 0 3 x2 y2 -1)
; Draw the text
(Display
text
dsCOORD
(+ nsLeft (>> (- w [rect rtRIGHT]) 1))
(+ (+ nsTop (>> (- h [rect rtBOTTOM]) 1)) 1)
dsCOLOR gWndColor
dsBACKGROUND clTRANSPARENT
dsFONT font
dsWIDTH [rect rtRIGHT]
)
)</syntaxhighlight>

Needless to say, that code draws the button. It draws the border and edges, then centers and draws the text. It doesn't bother drawing the inside of the button and just leaves it transparent for speed. It would be a lot slower if it filled in the button with cels.
</blockquote>

{| width="100%"
| width="113" | [[Image:Script-Main.png|Main Script]]
| width="100%" | Chances are, you'll want to customize the window colors to go with the button, right? If that's the case, open up the "'''Main.sc'''" script.
|}

{| width="100%"
| width="216" | [[Image:Script-GameInstance.png|Game Instance]]
| width="100%" | Next, scroll down main.sc to the Game instance.

At the very top of the init() method, you will see the window color initialization.
|}

* The gWndColor is the color for the text and borders of of the non-custom controls.
* The gWndBack is the color of the actual window.

<blockquote>
To go with the default custom button, we'll make the window silver. Change:
<div class="CodeBlockHeader">Code:</div>
<syntaxhighlight lang="sci" class="cs">= gWndBack clWHITE</syntaxhighlight>
To:
To go with the default custom button, we'll make the window silver. Change:
<div class="CodeBlockHeader">Code:</div>
<syntaxhighlight lang="sci" class="cs">= gWndBack clSILVER</syntaxhighlight>
</blockquote>

<p align="center">Run the game all you'll see your brand new custom buttons!<br />[[Image:Controls-QuitDialog.png|Quit Button]]</p>

That sums it up! Be sure to check out how to make custom windows and gauges!

 

<span style="float: left">[[Checking a Door's State|< Previous: Chapter 6 - Checking a Door's State]]</span>
<span style="float: right">[[Custom Windows|Chapter 8 - Creating Custom Windows >]]</span>

 

[[Category:Controls]]
[[Category:Tutorials]]

Custom Buttons

2023-06-01T08:29:34Z

Rob Craig: /* Scripting The Button */

=Chapter 7 - Creating Custom Buttons=

By default, the interpreter draws all the windows and controls for the game's GUI. However, with some creative coding, they can be easily customized. This tutorial will teach you how to create custom buttons with views.

===Load The Game===

First you need to open your game in SCI Studio, loading the Resource Explorer.

===The Button View===

First the buttons will need a view so there's something to draw. I've set up the view so that cels 0-3 are for the button's edges, and 4-7 are for the left, top, right and bottom borders. It can be easily customized to create your own custom button.

The cels are 8x8 pixels. Though they really would only need to be 4x4, they should be no less than 8x8. If they are too small, it will take too long to draw the buttons.

To save time, [http://sierrahelp.com/Files/SCI/view.900 click here] and download it.

Add the view to the game. I chose to number it view.900, but it can be numbered anything you like.

===Scripting The Button===

In the resource explorer, select '''Script''' from the left resource tree. This will bring up the list of scripts in your game on the right. Double click on the "'''Controls.sc'''" script. It will load it up in the script editor.

Though customizing a button is generally simple, there are many extra steps which must be taken to give it optimum performance and prevent interference.

{| width="100%"
| width="216" | [[Image:Controls-DButton.png|DButton class]]
| width="100%" valign="top" | First, scroll down controls.sc to the DButton class.
|-
| width="216" | [[Image:Controls-SetSize.png|setSize() method]]
| width="100%" valign="top" | Next, scroll down to the setSize() method.
|}

<blockquote>
(Studio Script).
Change:
<div class="CodeBlockHeader">Code:</div>
<syntaxhighlight lang="sci" class="cs">= nsBottom (+ nsTop rect[rtBOTTOM])</syntaxhighlight>
(Studio Script example) to:
<div class="CodeBlockHeader">Code:</div>
<syntaxhighlight lang="sci" class="cs">= nsBottom (+ nsTop(| (& rect[rtBOTTOM] $FFFC) 7))</syntaxhighlight>

(Sierra Script)
To:
<div class="CodeBlockHeader">Code:</div>
<syntaxhighlight lang="sci" class="cs">(= nsBottom (+ nsTop (| (& [rect rtBOTTOM] $FFFC) 7)))</syntaxhighlight>

(Studio Script)
Change:
<div class="CodeBlockHeader">Code:</div>
<syntaxhighlight lang="sci" class="cs">(= nsBottom (+ nsTop (| (& [rect rtBOTTOM] $FFFC) 7)))</syntaxhighlight>
(Studio Script) to:
<div class="CodeBlockHeader">Code:</div>
<syntaxhighlight lang="sci" class="cs">= nsRight (+ (| (& rect[rtRIGHT] $FFFC) 7) nsLeft)</syntaxhighlight>

(Sierra Script)
To:
<div class="CodeBlockHeader">Code:</div>
<syntaxhighlight lang="sci" class="cs">(= nsRight (+ (| (& [rect rtRIGHT] $FFFC) 7) nsLeft))</syntaxhighlight>

This makes the control always in dimensions divisible by eight (i.e. 8,16,24,32,etc.). This is needed because we are using 8x8 cels.
</blockquote>

Next, we'll need to add a draw method to the DButton class to override the default one.

<blockquote>
Add the following code to the DButton class.
<div class="CodeBlockHeader">Code:</div>
<syntaxhighlight lang="sci" class="cs"> (method (draw)
(var x, y, x2, y2, w, h, rect[4])

// Calculate the areas
= x2 (- nsRight 8)
= y2 (- nsBottom 8)
= w (- nsRight nsLeft)
= h (- nsBottom nsTop)
TextSize(@rect text font)

// Draw the side borders
(for(= y(+ nsTop 8)) (< y y2) (= y + y 8)
DrawCel(900 0 4 nsLeft y -1)
DrawCel(900 0 6 x2 y -1)
)
// Draw the top and bottom borders
(for(= x(+ nsLeft 8)) (< x x2) (= x + x 8)
DrawCel(900 0 5 x nsTop -1)
DrawCel(900 0 7 x y2 -1)
)
// Draw the corners
DrawCel(900 0 0 nsLeft nsTop -1)
DrawCel(900 0 1 x2 nsTop -1)
DrawCel(900 0 2 nsLeft y2 -1)
DrawCel(900 0 3 x2 y2 -1)
// Draw the text
Display(text
dsCOORD
+ nsLeft (>> (- w rect[rtRIGHT]) 1)
+ (+ nsTop (>> (- h rect[rtBOTTOM]) 1) 1)
dsCOLOR
gWndColor
dsBACKGROUND
clTRANSPARENT
dsFONT
font
dsWIDTH
rect[rtRIGHT]
)
)</syntaxhighlight>

SCI code for SCI Companion.
<div class="CodeBlockHeader">Code:</div>
<syntaxhighlight lang="sci" class="cs"> (method (draw &tmp x y x2 y2 w h [rect 4])
; Calculate the areas
(= x2 (- nsRight 8))
(= y2 (- nsBottom 8))
(= w (- nsRight nsLeft))
(= h (- nsBottom nsTop))
(TextSize @rect text font)
; Draw the side borders
(for ( (= y (+ nsTop 8))) (< y y2) ( (= y (+ y 8))) (DrawCel 902 0 4 nsLeft y -1) (DrawCel 902 0 6 x2 y -1))
; Draw the top and bottom borders
(for ( (= x (+ nsLeft 8))) (< x x2) ( (= x (+ x 8))) (DrawCel 902 0 5 x nsTop -1) (DrawCel 902 0 7 x y2 -1))
; Draw the corners
(DrawCel 902 0 0 nsLeft nsTop -1)
(DrawCel 902 0 1 x2 nsTop -1)
(DrawCel 902 0 2 nsLeft y2 -1)
(DrawCel 902 0 3 x2 y2 -1)
; Draw the text
(Display
text
dsCOORD
(+ nsLeft (>> (- w [rect rtRIGHT]) 1))
(+ (+ nsTop (>> (- h [rect rtBOTTOM]) 1)) 1)
dsCOLOR gWndColor
dsBACKGROUND clTRANSPARENT
dsFONT font
dsWIDTH [rect rtRIGHT]
)
)</syntaxhighlight>

Needless to say, that code draws the button. It draws the border and edges, then centers and draws the text. It doesn't bother drawing the inside of the button and just leaves it transparent for speed. It would be a lot slower if it filled in the button with cels.
</blockquote>

{| width="100%"
| width="113" | [[Image:Script-Main.png|Main Script]]
| width="100%" | Chances are, you'll want to customize the window colors to go with the button, right? If that's the case, open up the "'''Main.sc'''" script.
|}

{| width="100%"
| width="216" | [[Image:Script-GameInstance.png|Game Instance]]
| width="100%" | Next, scroll down main.sc to the Game instance.

At the very top of the init() method, you will see the window color initialization.
|}

* The gWndColor is the color for the text and borders of of the non-custom controls.
* The gWndBack is the color of the actual window.

<blockquote>
To go with the default custom button, we'll make the window silver. Change:
<div class="CodeBlockHeader">Code:</div>
<syntaxhighlight lang="sci" class="cs">= gWndBack clWHITE</syntaxhighlight>
To:
To go with the default custom button, we'll make the window silver. Change:
<div class="CodeBlockHeader">Code:</div>
<syntaxhighlight lang="sci" class="cs">= gWndBack clSILVER</syntaxhighlight>
</blockquote>

<p align="center">Run the game all you'll see your brand new custom buttons!<br />[[Image:Controls-QuitDialog.png|Quit Button]]</p>

That sums it up! Be sure to check out how to make custom windows and gauges!

 

<span style="float: left">[[Checking a Door's State|< Previous: Chapter 6 - Checking a Door's State]]</span>
<span style="float: right">[[Custom Windows|Chapter 8 - Creating Custom Windows >]]</span>

 

[[Category:Controls]]
[[Category:Tutorials]]

Custom Buttons

2023-06-01T08:27:13Z

Rob Craig: /* Scripting The Button */

=Chapter 7 - Creating Custom Buttons=

By default, the interpreter draws all the windows and controls for the game's GUI. However, with some creative coding, they can be easily customized. This tutorial will teach you how to create custom buttons with views.

===Load The Game===

First you need to open your game in SCI Studio, loading the Resource Explorer.

===The Button View===

First the buttons will need a view so there's something to draw. I've set up the view so that cels 0-3 are for the button's edges, and 4-7 are for the left, top, right and bottom borders. It can be easily customized to create your own custom button.

The cels are 8x8 pixels. Though they really would only need to be 4x4, they should be no less than 8x8. If they are too small, it will take too long to draw the buttons.

To save time, [http://sierrahelp.com/Files/SCI/view.900 click here] and download it.

Add the view to the game. I chose to number it view.900, but it can be numbered anything you like.

===Scripting The Button===

In the resource explorer, select '''Script''' from the left resource tree. This will bring up the list of scripts in your game on the right. Double click on the "'''Controls.sc'''" script. It will load it up in the script editor.

Though customizing a button is generally simple, there are many extra steps which must be taken to give it optimum performance and prevent interference.

{| width="100%"
| width="216" | [[Image:Controls-DButton.png|DButton class]]
| width="100%" valign="top" | First, scroll down controls.sc to the DButton class.
|-
| width="216" | [[Image:Controls-SetSize.png|setSize() method]]
| width="100%" valign="top" | Next, scroll down to the setSize() method.
|}

<blockquote>
Studio Script example.
Change:
<div class="CodeBlockHeader">Code:</div>
<syntaxhighlight lang="sci" class="cs">= nsBottom (+ nsTop rect[rtBOTTOM])</syntaxhighlight>
to:
<div class="CodeBlockHeader">Code:</div>
<syntaxhighlight lang="sci" class="cs">= nsBottom (+ nsTop(| (& rect[rtBOTTOM] $FFFC) 7))</syntaxhighlight>

Sierra Script example.
Change:
<div class="CodeBlockHeader">Code:</div>
<syntaxhighlight lang="sci" class="cs">(= nsBottom (+ nsTop (| (& [rect rtBOTTOM] $FFFC) 7)))</syntaxhighlight>

Studio Script example
Change:
<div class="CodeBlockHeader">Code:</div>
<syntaxhighlight lang="sci" class="cs">(= nsBottom (+ nsTop (| (& [rect rtBOTTOM] $FFFC) 7)))</syntaxhighlight>
to:
<div class="CodeBlockHeader">Code:</div>
<syntaxhighlight lang="sci" class="cs">= nsRight (+ (| (& rect[rtRIGHT] $FFFC) 7) nsLeft)</syntaxhighlight>

Sierra Script example.
Change:
<div class="CodeBlockHeader">Code:</div>
<syntaxhighlight lang="sci" class="cs">(= nsRight (+ (| (& [rect rtRIGHT] $FFFC) 7) nsLeft))</syntaxhighlight>

This makes the control always in dimensions divisible by eight (i.e. 8,16,24,32,etc.). This is needed because we are using 8x8 cels.
</blockquote>

Next, we'll need to add a draw method to the DButton class to override the default one.

<blockquote>
Add the following code to the DButton class.
<div class="CodeBlockHeader">Code:</div>
<syntaxhighlight lang="sci" class="cs"> (method (draw)
(var x, y, x2, y2, w, h, rect[4])

// Calculate the areas
= x2 (- nsRight 8)
= y2 (- nsBottom 8)
= w (- nsRight nsLeft)
= h (- nsBottom nsTop)
TextSize(@rect text font)

// Draw the side borders
(for(= y(+ nsTop 8)) (< y y2) (= y + y 8)
DrawCel(900 0 4 nsLeft y -1)
DrawCel(900 0 6 x2 y -1)
)
// Draw the top and bottom borders
(for(= x(+ nsLeft 8)) (< x x2) (= x + x 8)
DrawCel(900 0 5 x nsTop -1)
DrawCel(900 0 7 x y2 -1)
)
// Draw the corners
DrawCel(900 0 0 nsLeft nsTop -1)
DrawCel(900 0 1 x2 nsTop -1)
DrawCel(900 0 2 nsLeft y2 -1)
DrawCel(900 0 3 x2 y2 -1)
// Draw the text
Display(text
dsCOORD
+ nsLeft (>> (- w rect[rtRIGHT]) 1)
+ (+ nsTop (>> (- h rect[rtBOTTOM]) 1) 1)
dsCOLOR
gWndColor
dsBACKGROUND
clTRANSPARENT
dsFONT
font
dsWIDTH
rect[rtRIGHT]
)
)</syntaxhighlight>

SCI code for SCI Companion.
<div class="CodeBlockHeader">Code:</div>
<syntaxhighlight lang="sci" class="cs"> (method (draw &tmp x y x2 y2 w h [rect 4])
; Calculate the areas
(= x2 (- nsRight 8))
(= y2 (- nsBottom 8))
(= w (- nsRight nsLeft))
(= h (- nsBottom nsTop))
(TextSize @rect text font)
; Draw the side borders
(for ( (= y (+ nsTop 8))) (< y y2) ( (= y (+ y 8))) (DrawCel 902 0 4 nsLeft y -1) (DrawCel 902 0 6 x2 y -1))
; Draw the top and bottom borders
(for ( (= x (+ nsLeft 8))) (< x x2) ( (= x (+ x 8))) (DrawCel 902 0 5 x nsTop -1) (DrawCel 902 0 7 x y2 -1))
; Draw the corners
(DrawCel 902 0 0 nsLeft nsTop -1)
(DrawCel 902 0 1 x2 nsTop -1)
(DrawCel 902 0 2 nsLeft y2 -1)
(DrawCel 902 0 3 x2 y2 -1)
; Draw the text
(Display
text
dsCOORD
(+ nsLeft (>> (- w [rect rtRIGHT]) 1))
(+ (+ nsTop (>> (- h [rect rtBOTTOM]) 1)) 1)
dsCOLOR gWndColor
dsBACKGROUND clTRANSPARENT
dsFONT font
dsWIDTH [rect rtRIGHT]
)
)</syntaxhighlight>

Needless to say, that code draws the button. It draws the border and edges, then centers and draws the text. It doesn't bother drawing the inside of the button and just leaves it transparent for speed. It would be a lot slower if it filled in the button with cels.
</blockquote>

{| width="100%"
| width="113" | [[Image:Script-Main.png|Main Script]]
| width="100%" | Chances are, you'll want to customize the window colors to go with the button, right? If that's the case, open up the "'''Main.sc'''" script.
|}

{| width="100%"
| width="216" | [[Image:Script-GameInstance.png|Game Instance]]
| width="100%" | Next, scroll down main.sc to the Game instance.

At the very top of the init() method, you will see the window color initialization.
|}

* The gWndColor is the color for the text and borders of of the non-custom controls.
* The gWndBack is the color of the actual window.

<blockquote>
To go with the default custom button, we'll make the window silver. Change:
<div class="CodeBlockHeader">Code:</div>
<syntaxhighlight lang="sci" class="cs">= gWndBack clWHITE</syntaxhighlight>
To:
To go with the default custom button, we'll make the window silver. Change:
<div class="CodeBlockHeader">Code:</div>
<syntaxhighlight lang="sci" class="cs">= gWndBack clSILVER</syntaxhighlight>
</blockquote>

<p align="center">Run the game all you'll see your brand new custom buttons!<br />[[Image:Controls-QuitDialog.png|Quit Button]]</p>

That sums it up! Be sure to check out how to make custom windows and gauges!

 

<span style="float: left">[[Checking a Door's State|< Previous: Chapter 6 - Checking a Door's State]]</span>
<span style="float: right">[[Custom Windows|Chapter 8 - Creating Custom Windows >]]</span>

 

[[Category:Controls]]
[[Category:Tutorials]]

WordFail, syntaxFail and pragmaFail

2023-06-01T08:24:10Z

Rob Craig: /* Adding Response Handlers */

=Chapter 2 - Oh, yeah? Well, "%s" this!=

In order to make your game fun and enjoyable, you'll want it to be more intelligent to the player. By default, if the player enters a word not in the vocabulary, or a sentence that doesn't make sense, it will just display a message like "I don't understand "that word"." or "That sentence doesn't make sense.". This can be easily changed.

In Sierra's games, you'll notice that it displays different responses when you enter invalid phrases. If you enter a word not in the game's vocabulary, it will display "Oh, yeah? Well, "the word" this!" or "You don't need to type the word "the word" to complete this game!", or "Don't you ever say the word "the word" again!".

Implementing an intelligent response system is very easy. There are three types of phrase catchers: '''wordFail''', '''syntaxFail''' and '''pragmaFail'''.

* '''wordFail''', is executed when the player enters a word in the phrase that is not in the game's vocabulary.
* '''syntaxFail''' is executed when the player enters an improper sentence.
* '''pragmaFail''' is executed when the player enters an valid sentence that is not handled by any said statements.<br />

== Adding Response Handlers ==

The toolbar gives quick access to opening, closing and running games, the resource editors, and the help file. To add the response handlers, you simply need to add the methods by name to your game's instance.

[[Image:Script-Main.png|Main Script]] First, open up your game's "main.sc" script.

{| width="100%"
| width="274" | [[Image:Script-GameInstance.png|New Game Dialog]]
| valign="top" | Scroll down to the game's instance.
|}

Scroll to the end of it and add the methods to handle the responses. You can add any or all in any order.

You'll naturally want multiple responses, and want them randomly said. To do this, we'll use a combination of a switch statement and Rand() kernel call.

We'll start with the '''wordFail''' method. Here's an example in SCI Studio Script:

<blockquote>
<div class="CodeBlockHeader">Code:</div>
<syntaxhighlight lang="sci" class="cs">(method (wordFail theString)
(switch(Random(0 4))
(case 0
FormatPrint("Oh, yeah? Well, \"%s\" this!" theString)
)
(case 1
FormatPrint("You may know the word \"%s\" but it's beyond 's vocabulary!" theString)
)
(case 2
FormatPrint("Oh, yeah? Well, I've got your \"%s\" right here!" theString)
)
(case 3
FormatPrint("You don't need to type the word \"%s\" to complete this game!" theString)
)
(default
FormatPrint("Don't you ever say the word \"%s\" again!" theString)
)
)
)</syntaxhighlight>
</blockquote>

The '''wordFail''' method in Sierra Script:

<blockquote>
<div class="CodeBlockHeader">Code:</div>
<syntaxhighlight lang="sci" class="cs"> (method (wordFail theString)
(switch (Random 0 4)
(0
(FormatPrint {Oh, yeah? Well, "%s" this!} theString)
)
(1
(FormatPrint
{You may know the word "%s" but it's beyond 's vocabulary!}
theString
)
)
(2
(FormatPrint
{Oh, yeah? Well, I've got your "%s" right here!}
theString
)
)
(3
(FormatPrint
{You don't need to type the word "%s" to complete this game!}
theString
)
)
(else
(FormatPrint
{Don't you ever say the word "%s" again!}
theString
)
)
)
)
</syntaxhighlight>
</blockquote>

This generates a random number from 0 to 4 (five possible numbers), and displays a response depending on which is generated.

The syntaxFail and pragmaFail operate identical to wordFail, but I'll give examples of them as well.
Here's an example in SCI Studio Script:

<blockquote>
<div class="CodeBlockHeader">Code:</div>
<syntaxhighlight lang="sci" class="cs">

(method (syntaxFail theString)
(switch(Random(0 2))
(case 0
Print("That doesn't appear to be a proper sentence.")
)
(case 1
Print("What in the heck are you talking about?")
)
(default
Print("That's probably something you could do, but this game won't!")
)
)
)</syntaxhighlight>
</blockquote>
 
Example in Sierra Script:

<blockquote>
<div class="CodeBlockHeader">Code:</div>
<syntaxhighlight lang="sci" class="cs">
(method (syntaxFail theString)
(switch (Random 0 2)
(0
(Print {That doesn't appear to be a proper sentence.})
)
(1
(Print {What in the hell are you talking about?})
)
(else
(Print {That's probably something you could do, but this game won't!})
)
)
)</syntaxhighlight>
</blockquote>
Here's an example in SCI Studio Script:
<blockquote>
<div class="CodeBlockHeader">Code:</div>
<syntaxhighlight lang="sci" class="cs">(method (pragmaFail theString)
(switch(Random(0 2))
(case 0
Print("The heck you say?")
)
(case 1
Print("You're too smart for this game!")
)
(default
Print("Congratulations! You have dumbfounded this game!")
)
)
)</syntaxhighlight>
</blockquote>

An example for pragmaFail in Sierra Script:

<blockquote>
<div class="CodeBlockHeader">Code:</div>
<syntaxhighlight lang="sci" class="cs">(method (pragmaFail theString)
(method (pragmaFail theString)
(switch (Random 0 2)
(0
(Print {The hell you say?})
)
(1
(Print {You're too smart for this game!})
)
(else
(Print {Congratulations! You have dumbfounded this game!})
)
)
)</syntaxhighlight>
</blockquote>

 

The methods all take the string as a parameter. Whether you choose to use it or not is up to you.

You can have as many or as few responses as you like. Just change the random amount and cases.

That sums up global response handlers! Now your game can have attitude!

 

<span style="float: left">[[Global Said() Statements|< Previous: Chapter 1 - Global Said() Statements]]</span>
<span style="float: right">[[Actor Paths|Next: Chapter 3 - Making Actors Move Along Paths >]]</span>

 

[[Category:Said() Strings]]
[[Category:The SCI Parser]]
[[Category:Tutorials]]

Custom Buttons

2023-05-31T12:53:58Z

Rob Craig: /* Scripting The Button */

=Chapter 7 - Creating Custom Buttons=

By default, the interpreter draws all the windows and controls for the game's GUI. However, with some creative coding, they can be easily customized. This tutorial will teach you how to create custom buttons with views.

===Load The Game===

First you need to open your game in SCI Studio, loading the Resource Explorer.

===The Button View===

First the buttons will need a view so there's something to draw. I've set up the view so that cels 0-3 are for the button's edges, and 4-7 are for the left, top, right and bottom borders. It can be easily customized to create your own custom button.

The cels are 8x8 pixels. Though they really would only need to be 4x4, they should be no less than 8x8. If they are too small, it will take too long to draw the buttons.

To save time, [http://sierrahelp.com/Files/SCI/view.900 click here] and download it.

Add the view to the game. I chose to number it view.900, but it can be numbered anything you like.

===Scripting The Button===

In the resource explorer, select '''Script''' from the left resource tree. This will bring up the list of scripts in your game on the right. Double click on the "'''Controls.sc'''" script. It will load it up in the script editor.

Though customizing a button is generally simple, there are many extra steps which must be taken to give it optimum performance and prevent interference.

{| width="100%"
| width="216" | [[Image:Controls-DButton.png|DButton class]]
| width="100%" valign="top" | First, scroll down controls.sc to the DButton class.
|-
| width="216" | [[Image:Controls-SetSize.png|setSize() method]]
| width="100%" valign="top" | Next, scroll down to the setSize() method.
|}

<blockquote>
Change:
<div class="CodeBlockHeader">Code:</div>
<syntaxhighlight lang="sci" class="cs">= nsBottom (+ nsTop rect[rtBOTTOM])</syntaxhighlight>
to:
<div class="CodeBlockHeader">Code:</div>
<syntaxhighlight lang="sci" class="cs">= nsBottom (+ nsTop(| (& rect[rtBOTTOM] $FFFC) 7))</syntaxhighlight>

SCI code for SCI Companion:
<div class="CodeBlockHeader">Code:</div>
<syntaxhighlight lang="sci" class="cs">(= nsBottom (+ nsTop (| (& [rect rtBOTTOM] $FFFC) 7)))</syntaxhighlight>

and Change:
<div class="CodeBlockHeader">Code:</div>
<syntaxhighlight lang="sci" class="cs">(= nsBottom (+ nsTop (| (& [rect rtBOTTOM] $FFFC) 7)))</syntaxhighlight>
to:
<div class="CodeBlockHeader">Code:</div>
<syntaxhighlight lang="sci" class="cs">= nsRight (+ (| (& rect[rtRIGHT] $FFFC) 7) nsLeft)</syntaxhighlight>

SCI code for SCI Companion:
<div class="CodeBlockHeader">Code:</div>
<syntaxhighlight lang="sci" class="cs">(= nsRight (+ (| (& [rect rtRIGHT] $FFFC) 7) nsLeft))</syntaxhighlight>

This makes the control always in dimensions divisible by eight (i.e. 8,16,24,32,etc.). This is needed because we are using 8x8 cels.
</blockquote>

Next, we'll need to add a draw method to the DButton class to override the default one.

<blockquote>
Add the following code to the DButton class.
<div class="CodeBlockHeader">Code:</div>
<syntaxhighlight lang="sci" class="cs"> (method (draw)
(var x, y, x2, y2, w, h, rect[4])

// Calculate the areas
= x2 (- nsRight 8)
= y2 (- nsBottom 8)
= w (- nsRight nsLeft)
= h (- nsBottom nsTop)
TextSize(@rect text font)

// Draw the side borders
(for(= y(+ nsTop 8)) (< y y2) (= y + y 8)
DrawCel(900 0 4 nsLeft y -1)
DrawCel(900 0 6 x2 y -1)
)
// Draw the top and bottom borders
(for(= x(+ nsLeft 8)) (< x x2) (= x + x 8)
DrawCel(900 0 5 x nsTop -1)
DrawCel(900 0 7 x y2 -1)
)
// Draw the corners
DrawCel(900 0 0 nsLeft nsTop -1)
DrawCel(900 0 1 x2 nsTop -1)
DrawCel(900 0 2 nsLeft y2 -1)
DrawCel(900 0 3 x2 y2 -1)
// Draw the text
Display(text
dsCOORD
+ nsLeft (>> (- w rect[rtRIGHT]) 1)
+ (+ nsTop (>> (- h rect[rtBOTTOM]) 1) 1)
dsCOLOR
gWndColor
dsBACKGROUND
clTRANSPARENT
dsFONT
font
dsWIDTH
rect[rtRIGHT]
)
)</syntaxhighlight>

SCI code for SCI Companion.
<div class="CodeBlockHeader">Code:</div>
<syntaxhighlight lang="sci" class="cs"> (method (draw &tmp x y x2 y2 w h [rect 4])
; Calculate the areas
(= x2 (- nsRight 8))
(= y2 (- nsBottom 8))
(= w (- nsRight nsLeft))
(= h (- nsBottom nsTop))
(TextSize @rect text font)
; Draw the side borders
(for ( (= y (+ nsTop 8))) (< y y2) ( (= y (+ y 8))) (DrawCel 902 0 4 nsLeft y -1) (DrawCel 902 0 6 x2 y -1))
; Draw the top and bottom borders
(for ( (= x (+ nsLeft 8))) (< x x2) ( (= x (+ x 8))) (DrawCel 902 0 5 x nsTop -1) (DrawCel 902 0 7 x y2 -1))
; Draw the corners
(DrawCel 902 0 0 nsLeft nsTop -1)
(DrawCel 902 0 1 x2 nsTop -1)
(DrawCel 902 0 2 nsLeft y2 -1)
(DrawCel 902 0 3 x2 y2 -1)
; Draw the text
(Display
text
dsCOORD
(+ nsLeft (>> (- w [rect rtRIGHT]) 1))
(+ (+ nsTop (>> (- h [rect rtBOTTOM]) 1)) 1)
dsCOLOR gWndColor
dsBACKGROUND clTRANSPARENT
dsFONT font
dsWIDTH [rect rtRIGHT]
)
)</syntaxhighlight>

Needless to say, that code draws the button. It draws the border and edges, then centers and draws the text. It doesn't bother drawing the inside of the button and just leaves it transparent for speed. It would be a lot slower if it filled in the button with cels.
</blockquote>

{| width="100%"
| width="113" | [[Image:Script-Main.png|Main Script]]
| width="100%" | Chances are, you'll want to customize the window colors to go with the button, right? If that's the case, open up the "'''Main.sc'''" script.
|}

{| width="100%"
| width="216" | [[Image:Script-GameInstance.png|Game Instance]]
| width="100%" | Next, scroll down main.sc to the Game instance.

At the very top of the init() method, you will see the window color initialization.
|}

* The gWndColor is the color for the text and borders of of the non-custom controls.
* The gWndBack is the color of the actual window.

<blockquote>
To go with the default custom button, we'll make the window silver. Change:
<div class="CodeBlockHeader">Code:</div>
<syntaxhighlight lang="sci" class="cs">= gWndBack clWHITE</syntaxhighlight>
To:
To go with the default custom button, we'll make the window silver. Change:
<div class="CodeBlockHeader">Code:</div>
<syntaxhighlight lang="sci" class="cs">= gWndBack clSILVER</syntaxhighlight>
</blockquote>

<p align="center">Run the game all you'll see your brand new custom buttons!<br />[[Image:Controls-QuitDialog.png|Quit Button]]</p>

That sums it up! Be sure to check out how to make custom windows and gauges!

 

<span style="float: left">[[Checking a Door's State|< Previous: Chapter 6 - Checking a Door's State]]</span>
<span style="float: right">[[Custom Windows|Chapter 8 - Creating Custom Windows >]]</span>

 

[[Category:Controls]]
[[Category:Tutorials]]

Custom Buttons

2023-05-31T12:52:37Z

Rob Craig: /* Scripting The Button */

=Chapter 7 - Creating Custom Buttons=

By default, the interpreter draws all the windows and controls for the game's GUI. However, with some creative coding, they can be easily customized. This tutorial will teach you how to create custom buttons with views.

===Load The Game===

First you need to open your game in SCI Studio, loading the Resource Explorer.

===The Button View===

First the buttons will need a view so there's something to draw. I've set up the view so that cels 0-3 are for the button's edges, and 4-7 are for the left, top, right and bottom borders. It can be easily customized to create your own custom button.

The cels are 8x8 pixels. Though they really would only need to be 4x4, they should be no less than 8x8. If they are too small, it will take too long to draw the buttons.

To save time, [http://sierrahelp.com/Files/SCI/view.900 click here] and download it.

Add the view to the game. I chose to number it view.900, but it can be numbered anything you like.

===Scripting The Button===

In the resource explorer, select '''Script''' from the left resource tree. This will bring up the list of scripts in your game on the right. Double click on the "'''Controls.sc'''" script. It will load it up in the script editor.

Though customizing a button is generally simple, there are many extra steps which must be taken to give it optimum performance and prevent interference.

{| width="100%"
| width="216" | [[Image:Controls-DButton.png|DButton class]]
| width="100%" valign="top" | First, scroll down controls.sc to the DButton class.
|-
| width="216" | [[Image:Controls-SetSize.png|setSize() method]]
| width="100%" valign="top" | Next, scroll down to the setSize() method.
|}

<blockquote>
Change:
<div class="CodeBlockHeader">Code:</div>
<syntaxhighlight lang="sci" class="cs">= nsBottom (+ nsTop rect[rtBOTTOM])</syntaxhighlight>
to:
<div class="CodeBlockHeader">Code:</div>
<syntaxhighlight lang="sci" class="cs">= nsBottom (+ nsTop(| (& rect[rtBOTTOM] $FFFC) 7))</syntaxhighlight>

SCI code for SCI Companion:
<div class="CodeBlockHeader">Code:</div>
<syntaxhighlight lang="sci" class="cs">(= nsBottom (+ nsTop (| (& [rect rtBOTTOM] $FFFC) 7)))</syntaxhighlight>

and Change:
<div class="CodeBlockHeader">Code:</div>
<syntaxhighlight lang="sci" class="cs">(= nsBottom (+ nsTop (| (& [rect rtBOTTOM] $FFFC) 7)))</syntaxhighlight>
to:
<div class="CodeBlockHeader">Code:</div>
<syntaxhighlight lang="sci" class="cs">= nsRight (+ (| (& rect[rtRIGHT] $FFFC) 7) nsLeft)</syntaxhighlight>

SCI code for SCI Companion:
<div class="CodeBlockHeader">Code:</div>
<syntaxhighlight lang="sci" class="cs">(= nsRight (+ (| (& [rect rtRIGHT] $FFFC) 7) nsLeft))</syntaxhighlight>

This makes the control always in dimensions divisible by eight (i.e. 8,16,24,32,etc.). This is needed because we are using 8x8 cels.
</blockquote>

Next, we'll need to add a draw method to the DButton class to override the default one.

<blockquote>
Add the following code to the DButton class.
<div class="CodeBlockHeader">Code:</div>
<syntaxhighlight lang="sci" class="cs"> (method (draw)
(var x, y, x2, y2, w, h, rect[4])

// Calculate the areas
= x2 (- nsRight 8)
= y2 (- nsBottom 8)
= w (- nsRight nsLeft)
= h (- nsBottom nsTop)
TextSize(@rect text font)

// Draw the side borders
(for(= y(+ nsTop 8)) (< y y2) (= y + y 8)
DrawCel(900 0 4 nsLeft y -1)
DrawCel(900 0 6 x2 y -1)
)
// Draw the top and bottom borders
(for(= x(+ nsLeft 8)) (< x x2) (= x + x 8)
DrawCel(900 0 5 x nsTop -1)
DrawCel(900 0 7 x y2 -1)
)
// Draw the corners
DrawCel(900 0 0 nsLeft nsTop -1)
DrawCel(900 0 1 x2 nsTop -1)
DrawCel(900 0 2 nsLeft y2 -1)
DrawCel(900 0 3 x2 y2 -1)
// Draw the text
Display(text
dsCOORD
+ nsLeft (>> (- w rect[rtRIGHT]) 1)
+ (+ nsTop (>> (- h rect[rtBOTTOM]) 1) 1)
dsCOLOR
gWndColor
dsBACKGROUND
clTRANSPARENT
dsFONT
font
dsWIDTH
rect[rtRIGHT]
)
)</syntaxhighlight>

Needless to say, that code draws the button. It draws the border and edges, then centers and draws the text. It doesn't bother drawing the inside of the button and just leaves it transparent for speed. It would be a lot slower if it filled in the button with cels.
</blockquote>

{| width="100%"
| width="113" | [[Image:Script-Main.png|Main Script]]
| width="100%" | Chances are, you'll want to customize the window colors to go with the button, right? If that's the case, open up the "'''Main.sc'''" script.
|}

{| width="100%"
| width="216" | [[Image:Script-GameInstance.png|Game Instance]]
| width="100%" | Next, scroll down main.sc to the Game instance.

At the very top of the init() method, you will see the window color initialization.
|}

* The gWndColor is the color for the text and borders of of the non-custom controls.
* The gWndBack is the color of the actual window.

<blockquote>
To go with the default custom button, we'll make the window silver. Change:
<div class="CodeBlockHeader">Code:</div>
<syntaxhighlight lang="sci" class="cs">= gWndBack clWHITE</syntaxhighlight>
To:
To go with the default custom button, we'll make the window silver. Change:
<div class="CodeBlockHeader">Code:</div>
<syntaxhighlight lang="sci" class="cs">= gWndBack clSILVER</syntaxhighlight>
</blockquote>

<p align="center">Run the game all you'll see your brand new custom buttons!<br />[[Image:Controls-QuitDialog.png|Quit Button]]</p>

That sums it up! Be sure to check out how to make custom windows and gauges!

 

<span style="float: left">[[Checking a Door's State|< Previous: Chapter 6 - Checking a Door's State]]</span>
<span style="float: right">[[Custom Windows|Chapter 8 - Creating Custom Windows >]]</span>

 

[[Category:Controls]]
[[Category:Tutorials]]

Custom Buttons

2023-05-31T12:49:42Z

Rob Craig: /* Scripting The Button */

=Chapter 7 - Creating Custom Buttons=

By default, the interpreter draws all the windows and controls for the game's GUI. However, with some creative coding, they can be easily customized. This tutorial will teach you how to create custom buttons with views.

===Load The Game===

First you need to open your game in SCI Studio, loading the Resource Explorer.

===The Button View===

First the buttons will need a view so there's something to draw. I've set up the view so that cels 0-3 are for the button's edges, and 4-7 are for the left, top, right and bottom borders. It can be easily customized to create your own custom button.

The cels are 8x8 pixels. Though they really would only need to be 4x4, they should be no less than 8x8. If they are too small, it will take too long to draw the buttons.

To save time, [http://sierrahelp.com/Files/SCI/view.900 click here] and download it.

Add the view to the game. I chose to number it view.900, but it can be numbered anything you like.

===Scripting The Button===

In the resource explorer, select '''Script''' from the left resource tree. This will bring up the list of scripts in your game on the right. Double click on the "'''Controls.sc'''" script. It will load it up in the script editor.

Though customizing a button is generally simple, there are many extra steps which must be taken to give it optimum performance and prevent interference.

{| width="100%"
| width="216" | [[Image:Controls-DButton.png|DButton class]]
| width="100%" valign="top" | First, scroll down controls.sc to the DButton class.
|-
| width="216" | [[Image:Controls-SetSize.png|setSize() method]]
| width="100%" valign="top" | Next, scroll down to the setSize() method.
|}

<blockquote>
Change:
<div class="CodeBlockHeader">Code:</div>
<syntaxhighlight lang="sci" class="cs">= nsBottom (+ nsTop rect[rtBOTTOM])</syntaxhighlight>
to:
<div class="CodeBlockHeader">Code:</div>
<syntaxhighlight lang="sci" class="cs">= nsBottom (+ nsTop(| (& rect[rtBOTTOM] $FFFC) 7))</syntaxhighlight>

<div class="CodeBlockHeader">Code:</div>
<syntaxhighlight lang="sci" class="cs">= nsBottom (+ nsTop(| (& rect[rtBOTTOM] $FFFC) 7))</syntaxhighlight>

and Change:
<div class="CodeBlockHeader">Code:</div>
<syntaxhighlight lang="sci" class="cs">(= nsBottom (+ nsTop (| (& [rect rtBOTTOM] $FFFC) 7)))</syntaxhighlight>
to:
<div class="CodeBlockHeader">Code:</div>
<syntaxhighlight lang="sci" class="cs">= nsRight (+ (| (& rect[rtRIGHT] $FFFC) 7) nsLeft)</syntaxhighlight>

This makes the control always in dimensions divisible by eight (i.e. 8,16,24,32,etc.). This is needed because we are using 8x8 cels.
</blockquote>

Next, we'll need to add a draw method to the DButton class to override the default one.

<blockquote>
Add the following code to the DButton class.
<div class="CodeBlockHeader">Code:</div>
<syntaxhighlight lang="sci" class="cs"> (method (draw)
(var x, y, x2, y2, w, h, rect[4])

// Calculate the areas
= x2 (- nsRight 8)
= y2 (- nsBottom 8)
= w (- nsRight nsLeft)
= h (- nsBottom nsTop)
TextSize(@rect text font)

// Draw the side borders
(for(= y(+ nsTop 8)) (< y y2) (= y + y 8)
DrawCel(900 0 4 nsLeft y -1)
DrawCel(900 0 6 x2 y -1)
)
// Draw the top and bottom borders
(for(= x(+ nsLeft 8)) (< x x2) (= x + x 8)
DrawCel(900 0 5 x nsTop -1)
DrawCel(900 0 7 x y2 -1)
)
// Draw the corners
DrawCel(900 0 0 nsLeft nsTop -1)
DrawCel(900 0 1 x2 nsTop -1)
DrawCel(900 0 2 nsLeft y2 -1)
DrawCel(900 0 3 x2 y2 -1)
// Draw the text
Display(text
dsCOORD
+ nsLeft (>> (- w rect[rtRIGHT]) 1)
+ (+ nsTop (>> (- h rect[rtBOTTOM]) 1) 1)
dsCOLOR
gWndColor
dsBACKGROUND
clTRANSPARENT
dsFONT
font
dsWIDTH
rect[rtRIGHT]
)
)</syntaxhighlight>

Needless to say, that code draws the button. It draws the border and edges, then centers and draws the text. It doesn't bother drawing the inside of the button and just leaves it transparent for speed. It would be a lot slower if it filled in the button with cels.
</blockquote>

{| width="100%"
| width="113" | [[Image:Script-Main.png|Main Script]]
| width="100%" | Chances are, you'll want to customize the window colors to go with the button, right? If that's the case, open up the "'''Main.sc'''" script.
|}

{| width="100%"
| width="216" | [[Image:Script-GameInstance.png|Game Instance]]
| width="100%" | Next, scroll down main.sc to the Game instance.

At the very top of the init() method, you will see the window color initialization.
|}

* The gWndColor is the color for the text and borders of of the non-custom controls.
* The gWndBack is the color of the actual window.

<blockquote>
To go with the default custom button, we'll make the window silver. Change:
<div class="CodeBlockHeader">Code:</div>
<syntaxhighlight lang="sci" class="cs">= gWndBack clWHITE</syntaxhighlight>
To:
To go with the default custom button, we'll make the window silver. Change:
<div class="CodeBlockHeader">Code:</div>
<syntaxhighlight lang="sci" class="cs">= gWndBack clSILVER</syntaxhighlight>
</blockquote>

<p align="center">Run the game all you'll see your brand new custom buttons!<br />[[Image:Controls-QuitDialog.png|Quit Button]]</p>

That sums it up! Be sure to check out how to make custom windows and gauges!

 

<span style="float: left">[[Checking a Door's State|< Previous: Chapter 6 - Checking a Door's State]]</span>
<span style="float: right">[[Custom Windows|Chapter 8 - Creating Custom Windows >]]</span>

 

[[Category:Controls]]
[[Category:Tutorials]]

WordFail, syntaxFail and pragmaFail

2023-05-31T12:46:12Z

Rob Craig: /* Adding Response Handlers */

=Chapter 2 - Oh, yeah? Well, "%s" this!=

In order to make your game fun and enjoyable, you'll want it to be more intelligent to the player. By default, if the player enters a word not in the vocabulary, or a sentence that doesn't make sense, it will just display a message like "I don't understand "that word"." or "That sentence doesn't make sense.". This can be easily changed.

In Sierra's games, you'll notice that it displays different responses when you enter invalid phrases. If you enter a word not in the game's vocabulary, it will display "Oh, yeah? Well, "the word" this!" or "You don't need to type the word "the word" to complete this game!", or "Don't you ever say the word "the word" again!".

Implementing an intelligent response system is very easy. There are three types of phrase catchers: '''wordFail''', '''syntaxFail''' and '''pragmaFail'''.

* '''wordFail''', is executed when the player enters a word in the phrase that is not in the game's vocabulary.
* '''syntaxFail''' is executed when the player enters an improper sentence.
* '''pragmaFail''' is executed when the player enters an valid sentence that is not handled by any said statements.<br />

== Adding Response Handlers ==

The toolbar gives quick access to opening, closing and running games, the resource editors, and the help file. To add the response handlers, you simply need to add the methods by name to your game's instance.

[[Image:Script-Main.png|Main Script]] First, open up your game's "main.sc" script.

{| width="100%"
| width="274" | [[Image:Script-GameInstance.png|New Game Dialog]]
| valign="top" | Scroll down to the game's instance.
|}

Scroll to the end of it and add the methods to handle the responses. You can add any or all in any order.

You'll naturally want multiple responses, and want them randomly said. To do this, we'll use a combination of a switch statement and Rand() kernel call.

We'll start with the '''wordFail''' method. Here's an example:

<blockquote>
<div class="CodeBlockHeader">Code:</div>
<syntaxhighlight lang="sci" class="cs">(method (wordFail theString)
(switch(Random(0 4))
(case 0
FormatPrint("Oh, yeah? Well, \"%s\" this!" theString)
)
(case 1
FormatPrint("You may know the word \"%s\" but it's beyond 's vocabulary!" theString)
)
(case 2
FormatPrint("Oh, yeah? Well, I've got your \"%s\" right here!" theString)
)
(case 3
FormatPrint("You don't need to type the word \"%s\" to complete this game!" theString)
)
(default
FormatPrint("Don't you ever say the word \"%s\" again!" theString)
)
)
)</syntaxhighlight>
</blockquote>

SCI code for wordFail compatible with SCI Companion.

<blockquote>
<div class="CodeBlockHeader">Code:</div>
<syntaxhighlight lang="sci" class="cs">(method (wordFail theString)
(method (wordFail theString)
(switch (Random 0 4)
(0
(FormatPrint {Oh, yeah? Well, %s this!} theString)
)
(1
(FormatPrint {You may know the word %s but it's beyond the game's vocabulary!} theString)
)
(2
(FormatPrint {Oh, yeah? Well, I've got your %s right here!} theString)
)
(3
(FormatPrint {You don't need to type the word %s to complete this game!} theString)
)
(else
(FormatPrint {Don't you ever say the word %s again!} theString)
)
)
)
</syntaxhighlight>
</blockquote>

This generates a random number from 0 to 4 (five possible numbers), and displays a response depending on which is generated.

The syntaxFail and pragmaFail operate identical to wordFail, but I'll give examples of them as well:

<blockquote>
<div class="CodeBlockHeader">Code:</div>
<syntaxhighlight lang="sci" class="cs">

(method (syntaxFail theString)
(switch(Random(0 2))
(case 0
Print("That doesn't appear to be a proper sentence.")
)
(case 1
Print("What in the heck are you talking about?")
)
(default
Print("That's probably something you could do, but this game won't!")
)
)
)</syntaxhighlight>
</blockquote>
 
SCI code for syntaxFail compatible with SCI Companion.

<blockquote>
<div class="CodeBlockHeader">Code:</div>
<syntaxhighlight lang="sci" class="cs">
(method (syntaxFail theString)
(switch (Random 0 2)
(0
(Print {That doesn't appear to be a proper sentence.})
)
(1
(Print {What in the hell are you talking about?})
)
(else
(Print {That's probably something you could do, but this game won't!})
)
)
)</syntaxhighlight>
</blockquote>

<blockquote>
<div class="CodeBlockHeader">Code:</div>
<syntaxhighlight lang="sci" class="cs">(method (pragmaFail theString)
(switch(Random(0 2))
(case 0
Print("The heck you say?")
)
(case 1
Print("You're too smart for this game!")
)
(default
Print("Congratulations! You have dumbfounded this game!")
)
)
)</syntaxhighlight>
</blockquote>

SCI code for pragmaFail compatible with SCI Companion.

<blockquote>
<div class="CodeBlockHeader">Code:</div>
<syntaxhighlight lang="sci" class="cs">(method (pragmaFail theString)
(method (pragmaFail theString)
(switch (Random 0 2)
(0
(Print {The hell you say?})
)
(1
(Print {You're too smart for this game!})
)
(else
(Print {Congratulations! You have dumbfounded this game!})
)
)
)</syntaxhighlight>
</blockquote>

 

The methods all take the string as a parameter. Whether you choose to use it or not is up to you.

You can have as many or as few responses as you like. Just change the random amount and cases.

That sums up global response handlers! Now your game can have attitude!

 

<span style="float: left">[[Global Said() Statements|< Previous: Chapter 1 - Global Said() Statements]]</span>
<span style="float: right">[[Actor Paths|Next: Chapter 3 - Making Actors Move Along Paths >]]</span>

 

[[Category:Said() Strings]]
[[Category:The SCI Parser]]
[[Category:Tutorials]]

WordFail, syntaxFail and pragmaFail

2023-05-31T12:45:09Z

Rob Craig: /* Adding Response Handlers */

=Chapter 2 - Oh, yeah? Well, "%s" this!=

In order to make your game fun and enjoyable, you'll want it to be more intelligent to the player. By default, if the player enters a word not in the vocabulary, or a sentence that doesn't make sense, it will just display a message like "I don't understand "that word"." or "That sentence doesn't make sense.". This can be easily changed.

In Sierra's games, you'll notice that it displays different responses when you enter invalid phrases. If you enter a word not in the game's vocabulary, it will display "Oh, yeah? Well, "the word" this!" or "You don't need to type the word "the word" to complete this game!", or "Don't you ever say the word "the word" again!".

Implementing an intelligent response system is very easy. There are three types of phrase catchers: '''wordFail''', '''syntaxFail''' and '''pragmaFail'''.

* '''wordFail''', is executed when the player enters a word in the phrase that is not in the game's vocabulary.
* '''syntaxFail''' is executed when the player enters an improper sentence.
* '''pragmaFail''' is executed when the player enters an valid sentence that is not handled by any said statements.<br />

== Adding Response Handlers ==

The toolbar gives quick access to opening, closing and running games, the resource editors, and the help file. To add the response handlers, you simply need to add the methods by name to your game's instance.

[[Image:Script-Main.png|Main Script]] First, open up your game's "main.sc" script.

{| width="100%"
| width="274" | [[Image:Script-GameInstance.png|New Game Dialog]]
| valign="top" | Scroll down to the game's instance.
|}

Scroll to the end of it and add the methods to handle the responses. You can add any or all in any order.

You'll naturally want multiple responses, and want them randomly said. To do this, we'll use a combination of a switch statement and Rand() kernel call.

We'll start with the '''wordFail''' method. Here's an example:

<blockquote>
<div class="CodeBlockHeader">Code:</div>
<syntaxhighlight lang="sci" class="cs">(method (wordFail theString)
(switch(Random(0 4))
(case 0
FormatPrint("Oh, yeah? Well, \"%s\" this!" theString)
)
(case 1
FormatPrint("You may know the word \"%s\" but it's beyond 's vocabulary!" theString)
)
(case 2
FormatPrint("Oh, yeah? Well, I've got your \"%s\" right here!" theString)
)
(case 3
FormatPrint("You don't need to type the word \"%s\" to complete this game!" theString)
)
(default
FormatPrint("Don't you ever say the word \"%s\" again!" theString)
)
)
)</syntaxhighlight>
</blockquote>

SCI code for wordFail compatible with SCI Companion.

<blockquote>
<div class="CodeBlockHeader">Code:</div>
<syntaxhighlight lang="sci" class="cs">(method (wordFail theString)
(method (wordFail theString)
(switch (Random 0 4)
(0
(FormatPrint {Oh, yeah? Well, %s this!} theString)
)
(1
(FormatPrint {You may know the word %s but it's beyond the game's vocabulary!} theString)
)
(2
(FormatPrint {Oh, yeah? Well, I've got your %s right here!} theString)
)
(3
(FormatPrint {You don't need to type the word %s to complete this game!} theString)
)
(else
(FormatPrint {Don't you ever say the word %s again!} theString)
)
)
)
</syntaxhighlight>
</blockquote>

This generates a random number from 0 to 4 (five possible numbers), and displays a response depending on which is generated.

The syntaxFail and pragmaFail operate identical to wordFail, but I'll give examples of them as well:

<blockquote>
<div class="CodeBlockHeader">Code:</div>
<syntaxhighlight lang="sci" class="cs">

(method (syntaxFail theString)
(switch(Random(0 2))
(case 0
Print("That doesn't appear to be a proper sentence.")
)
(case 1
Print("What in the heck are you talking about?")
)
(default
Print("That's probably something you could do, but this game won't!")
)
)
)</syntaxhighlight>
</blockquote>
 
SCI code for syntaxFail compatible with SCI Companion.

<blockquote>
<div class="CodeBlockHeader">Code:</div>
<syntaxhighlight lang="sci" class="cs">(method (pragmaFail theString)
(method (syntaxFail theString)
(switch (Random 0 2)
(0
(Print {That doesn't appear to be a proper sentence.})
)
(1
(Print {What in the hell are you talking about?})
)
(else
(Print {That's probably something you could do, but this game won't!})
)
)
)</syntaxhighlight>
</blockquote>

<blockquote>
<div class="CodeBlockHeader">Code:</div>
<syntaxhighlight lang="sci" class="cs">(method (pragmaFail theString)
(switch(Random(0 2))
(case 0
Print("The heck you say?")
)
(case 1
Print("You're too smart for this game!")
)
(default
Print("Congratulations! You have dumbfounded this game!")
)
)
)</syntaxhighlight>
</blockquote>

SCI code for pragmaFail compatible with SCI Companion.

<blockquote>
<div class="CodeBlockHeader">Code:</div>
<syntaxhighlight lang="sci" class="cs">(method (pragmaFail theString)
(method (pragmaFail theString)
(switch (Random 0 2)
(0
(Print {The hell you say?})
)
(1
(Print {You're too smart for this game!})
)
(else
(Print {Congratulations! You have dumbfounded this game!})
)
)
)</syntaxhighlight>
</blockquote>

 

The methods all take the string as a parameter. Whether you choose to use it or not is up to you.

You can have as many or as few responses as you like. Just change the random amount and cases.

That sums up global response handlers! Now your game can have attitude!

 

<span style="float: left">[[Global Said() Statements|< Previous: Chapter 1 - Global Said() Statements]]</span>
<span style="float: right">[[Actor Paths|Next: Chapter 3 - Making Actors Move Along Paths >]]</span>

 

[[Category:Said() Strings]]
[[Category:The SCI Parser]]
[[Category:Tutorials]]

WordFail, syntaxFail and pragmaFail

2023-05-31T12:40:39Z

Rob Craig: /* Adding Response Handlers */

=Chapter 2 - Oh, yeah? Well, "%s" this!=

In order to make your game fun and enjoyable, you'll want it to be more intelligent to the player. By default, if the player enters a word not in the vocabulary, or a sentence that doesn't make sense, it will just display a message like "I don't understand "that word"." or "That sentence doesn't make sense.". This can be easily changed.

In Sierra's games, you'll notice that it displays different responses when you enter invalid phrases. If you enter a word not in the game's vocabulary, it will display "Oh, yeah? Well, "the word" this!" or "You don't need to type the word "the word" to complete this game!", or "Don't you ever say the word "the word" again!".

Implementing an intelligent response system is very easy. There are three types of phrase catchers: '''wordFail''', '''syntaxFail''' and '''pragmaFail'''.

* '''wordFail''', is executed when the player enters a word in the phrase that is not in the game's vocabulary.
* '''syntaxFail''' is executed when the player enters an improper sentence.
* '''pragmaFail''' is executed when the player enters an valid sentence that is not handled by any said statements.<br />

== Adding Response Handlers ==

The toolbar gives quick access to opening, closing and running games, the resource editors, and the help file. To add the response handlers, you simply need to add the methods by name to your game's instance.

[[Image:Script-Main.png|Main Script]] First, open up your game's "main.sc" script.

{| width="100%"
| width="274" | [[Image:Script-GameInstance.png|New Game Dialog]]
| valign="top" | Scroll down to the game's instance.
|}

Scroll to the end of it and add the methods to handle the responses. You can add any or all in any order.

You'll naturally want multiple responses, and want them randomly said. To do this, we'll use a combination of a switch statement and Rand() kernel call.

We'll start with the '''wordFail''' method. Here's an example:

<blockquote>
<div class="CodeBlockHeader">Code:</div>
<syntaxhighlight lang="sci" class="cs">(method (wordFail theString)
(switch(Random(0 4))
(case 0
FormatPrint("Oh, yeah? Well, \"%s\" this!" theString)
)
(case 1
FormatPrint("You may know the word \"%s\" but it's beyond 's vocabulary!" theString)
)
(case 2
FormatPrint("Oh, yeah? Well, I've got your \"%s\" right here!" theString)
)
(case 3
FormatPrint("You don't need to type the word \"%s\" to complete this game!" theString)
)
(default
FormatPrint("Don't you ever say the word \"%s\" again!" theString)
)
)
)</syntaxhighlight>
</blockquote>

SCI code compatible with SCI Companion.

<blockquote>
<div class="CodeBlockHeader">Code:</div>
<syntaxhighlight lang="sci" class="cs">(method (wordFail theString)
(method (wordFail theString)
(switch (Random 0 4)
(0
(FormatPrint {Oh, yeah? Well, %s this!} theString)
)
(1
(FormatPrint {You may know the word %s but it's beyond the game's vocabulary!} theString)
)
(2
(FormatPrint {Oh, yeah? Well, I've got your %s right here!} theString)
)
(3
(FormatPrint {You don't need to type the word %s to complete this game!} theString)
)
(else
(FormatPrint {Don't you ever say the word %s again!} theString)
)
)
)
</syntaxhighlight>
</blockquote>

This generates a random number from 0 to 4 (five possible numbers), and displays a response depending on which is generated.

The syntaxFail and pragmaFail operate identical to wordFail, but I'll give examples of them as well:

<blockquote>
<div class="CodeBlockHeader">Code:</div>
<syntaxhighlight lang="sci" class="cs">

(method (syntaxFail theString)
(switch(Random(0 2))
(case 0
Print("That doesn't appear to be a proper sentence.")
)
(case 1
Print("What in the heck are you talking about?")
)
(default
Print("That's probably something you could do, but this game won't!")
)
)
)</syntaxhighlight>
</blockquote>
 
SCI code compatible with SCI Companion.

<blockquote>
<div class="CodeBlockHeader">Code:</div>
<syntaxhighlight lang="sci" class="cs">(method (pragmaFail theString)
(method (syntaxFail theString)
(switch (Random 0 2)
(0
(Print {That doesn't appear to be a proper sentence.})
)
(1
(Print {What in the hell are you talking about?})
)
(else
(Print {That's probably something you could do, but this game won't!})
)
)
)</syntaxhighlight>
</blockquote>

<blockquote>
<div class="CodeBlockHeader">Code:</div>
<syntaxhighlight lang="sci" class="cs">(method (pragmaFail theString)
(switch(Random(0 2))
(case 0
Print("The heck you say?")
)
(case 1
Print("You're too smart for this game!")
)
(default
Print("Congratulations! You have dumbfounded this game!")
)
)
)</syntaxhighlight>
</blockquote>

<blockquote>
<div class="CodeBlockHeader">Code:</div>
<syntaxhighlight lang="sci" class="cs">

(method (syntaxFail theString)
(switch(Random(0 2))
(case 0
Print("That doesn't appear to be a proper sentence.")
)
(case 1
Print("What in the heck are you talking about?")
)
(default
Print("That's probably something you could do, but this game won't!")
)
)
)</syntaxhighlight>
</blockquote>
 

The methods all take the string as a parameter. Whether you choose to use it or not is up to you.

You can have as many or as few responses as you like. Just change the random amount and cases.

That sums up global response handlers! Now your game can have attitude!

 

<span style="float: left">[[Global Said() Statements|< Previous: Chapter 1 - Global Said() Statements]]</span>
<span style="float: right">[[Actor Paths|Next: Chapter 3 - Making Actors Move Along Paths >]]</span>

 

[[Category:Said() Strings]]
[[Category:The SCI Parser]]
[[Category:Tutorials]]

WordFail, syntaxFail and pragmaFail

2023-05-31T12:34:43Z

Rob Craig: /* Adding Response Handlers */

=Chapter 2 - Oh, yeah? Well, "%s" this!=

In order to make your game fun and enjoyable, you'll want it to be more intelligent to the player. By default, if the player enters a word not in the vocabulary, or a sentence that doesn't make sense, it will just display a message like "I don't understand "that word"." or "That sentence doesn't make sense.". This can be easily changed.

In Sierra's games, you'll notice that it displays different responses when you enter invalid phrases. If you enter a word not in the game's vocabulary, it will display "Oh, yeah? Well, "the word" this!" or "You don't need to type the word "the word" to complete this game!", or "Don't you ever say the word "the word" again!".

Implementing an intelligent response system is very easy. There are three types of phrase catchers: '''wordFail''', '''syntaxFail''' and '''pragmaFail'''.

* '''wordFail''', is executed when the player enters a word in the phrase that is not in the game's vocabulary.
* '''syntaxFail''' is executed when the player enters an improper sentence.
* '''pragmaFail''' is executed when the player enters an valid sentence that is not handled by any said statements.<br />

== Adding Response Handlers ==

The toolbar gives quick access to opening, closing and running games, the resource editors, and the help file. To add the response handlers, you simply need to add the methods by name to your game's instance.

[[Image:Script-Main.png|Main Script]] First, open up your game's "main.sc" script.

{| width="100%"
| width="274" | [[Image:Script-GameInstance.png|New Game Dialog]]
| valign="top" | Scroll down to the game's instance.
|}

Scroll to the end of it and add the methods to handle the responses. You can add any or all in any order.

You'll naturally want multiple responses, and want them randomly said. To do this, we'll use a combination of a switch statement and Rand() kernel call.

We'll start with the '''wordFail''' method. Here's an example:

<blockquote>
<div class="CodeBlockHeader">Code:</div>
<syntaxhighlight lang="sci" class="cs">(method (wordFail theString)
(switch(Random(0 4))
(case 0
FormatPrint("Oh, yeah? Well, \"%s\" this!" theString)
)
(case 1
FormatPrint("You may know the word \"%s\" but it's beyond 's vocabulary!" theString)
)
(case 2
FormatPrint("Oh, yeah? Well, I've got your \"%s\" right here!" theString)
)
(case 3
FormatPrint("You don't need to type the word \"%s\" to complete this game!" theString)
)
(default
FormatPrint("Don't you ever say the word \"%s\" again!" theString)
)
)
)</syntaxhighlight>
</blockquote>

SCI code compatible with SCI Companion.

<blockquote>
<div class="CodeBlockHeader">Code:</div>
<syntaxhighlight lang="sci" class="cs">(method (wordFail theString)
(method (wordFail theString)
(switch (Random 0 4)
(0
(FormatPrint {Oh, yeah? Well, %s this!} theString)
)
(1
(FormatPrint {You may know the word %s but it's beyond the game's vocabulary!} theString)
)
(2
(FormatPrint {Oh, yeah? Well, I've got your %s right here!} theString)
)
(3
(FormatPrint {You don't need to type the word %s to complete this game!} theString)
)
(else
(FormatPrint {Don't you ever say the word %s again!} theString)
)
)
)
</syntaxhighlight>
</blockquote>

This generates a random number from 0 to 4 (five possible numbers), and displays a response depending on which is generated.

The syntaxFail and pragmaFail operate identical to wordFail, but I'll give examples of them as well:

<blockquote>
<div class="CodeBlockHeader">Code:</div>
<syntaxhighlight lang="sci" class="cs">

(method (syntaxFail theString)
(switch(Random(0 2))
(case 0
Print("That doesn't appear to be a proper sentence.")
)
(case 1
Print("What in the heck are you talking about?")
)
(default
Print("That's probably something you could do, but this game won't!")
)
)
)</syntaxhighlight>
</blockquote>
 
<blockquote>
<div class="CodeBlockHeader">Code:</div>
<syntaxhighlight lang="sci" class="cs">(method (pragmaFail theString)
(switch(Random(0 2))
(case 0
Print("The heck you say?")
)
(case 1
Print("You're too smart for this game!")
)
(default
Print("Congratulations! You have dumbfounded this game!")
)
)
)</syntaxhighlight>
</blockquote>

<blockquote>
<div class="CodeBlockHeader">Code:</div>
<syntaxhighlight lang="sci" class="cs">

(method (syntaxFail theString)
(switch(Random(0 2))
(case 0
Print("That doesn't appear to be a proper sentence.")
)
(case 1
Print("What in the heck are you talking about?")
)
(default
Print("That's probably something you could do, but this game won't!")
)
)
)</syntaxhighlight>
</blockquote>
 

SCI code compatible with SCI Companion.

<blockquote>
<div class="CodeBlockHeader">Code:</div>
<syntaxhighlight lang="sci" class="cs">(method (pragmaFail theString)
(method (syntaxFail theString)
(switch (Random 0 2)
(0
(Print {That doesn't appear to be a proper sentence.})
)
(1
(Print {What in the hell are you talking about?})
)
(else
(Print {That's probably something you could do, but this game won't!})
)
)
)</syntaxhighlight>
</blockquote>

The methods all take the string as a parameter. Whether you choose to use it or not is up to you.

You can have as many or as few responses as you like. Just change the random amount and cases.

That sums up global response handlers! Now your game can have attitude!

 

<span style="float: left">[[Global Said() Statements|< Previous: Chapter 1 - Global Said() Statements]]</span>
<span style="float: right">[[Actor Paths|Next: Chapter 3 - Making Actors Move Along Paths >]]</span>

 

[[Category:Said() Strings]]
[[Category:The SCI Parser]]
[[Category:Tutorials]]

WordFail, syntaxFail and pragmaFail

2023-05-31T12:32:54Z

Rob Craig: /* Adding Response Handlers */

=Chapter 2 - Oh, yeah? Well, "%s" this!=

In order to make your game fun and enjoyable, you'll want it to be more intelligent to the player. By default, if the player enters a word not in the vocabulary, or a sentence that doesn't make sense, it will just display a message like "I don't understand "that word"." or "That sentence doesn't make sense.". This can be easily changed.

In Sierra's games, you'll notice that it displays different responses when you enter invalid phrases. If you enter a word not in the game's vocabulary, it will display "Oh, yeah? Well, "the word" this!" or "You don't need to type the word "the word" to complete this game!", or "Don't you ever say the word "the word" again!".

Implementing an intelligent response system is very easy. There are three types of phrase catchers: '''wordFail''', '''syntaxFail''' and '''pragmaFail'''.

* '''wordFail''', is executed when the player enters a word in the phrase that is not in the game's vocabulary.
* '''syntaxFail''' is executed when the player enters an improper sentence.
* '''pragmaFail''' is executed when the player enters an valid sentence that is not handled by any said statements.<br />

== Adding Response Handlers ==

The toolbar gives quick access to opening, closing and running games, the resource editors, and the help file. To add the response handlers, you simply need to add the methods by name to your game's instance.

[[Image:Script-Main.png|Main Script]] First, open up your game's "main.sc" script.

{| width="100%"
| width="274" | [[Image:Script-GameInstance.png|New Game Dialog]]
| valign="top" | Scroll down to the game's instance.
|}

Scroll to the end of it and add the methods to handle the responses. You can add any or all in any order.

You'll naturally want multiple responses, and want them randomly said. To do this, we'll use a combination of a switch statement and Rand() kernel call.

We'll start with the '''wordFail''' method. Here's an example:

<blockquote>
<div class="CodeBlockHeader">Code:</div>
<syntaxhighlight lang="sci" class="cs">(method (wordFail theString)
(switch(Random(0 4))
(case 0
FormatPrint("Oh, yeah? Well, \"%s\" this!" theString)
)
(case 1
FormatPrint("You may know the word \"%s\" but it's beyond 's vocabulary!" theString)
)
(case 2
FormatPrint("Oh, yeah? Well, I've got your \"%s\" right here!" theString)
)
(case 3
FormatPrint("You don't need to type the word \"%s\" to complete this game!" theString)
)
(default
FormatPrint("Don't you ever say the word \"%s\" again!" theString)
)
)
)</syntaxhighlight>
</blockquote>

SCI Code compatible with SCI Companion.

<blockquote>
<div class="CodeBlockHeader">Code:</div>
<syntaxhighlight lang="sci" class="cs">(method (wordFail theString)
(method (wordFail theString)
(switch (Random 0 4)
(0
(FormatPrint {Oh, yeah? Well, %s this!} theString)
)
(1
(FormatPrint {You may know the word %s but it's beyond the game's vocabulary!} theString)
)
(2
(FormatPrint {Oh, yeah? Well, I've got your %s right here!} theString)
)
(3
(FormatPrint {You don't need to type the word %s to complete this game!} theString)
)
(else
(FormatPrint {Don't you ever say the word %s again!} theString)
)
)
)
</syntaxhighlight>
</blockquote>

This generates a random number from 0 to 4 (five possible numbers), and displays a response depending on which is generated.

The syntaxFail and pragmaFail operate identical to wordFail, but I'll give examples of them as well:

<blockquote>
<div class="CodeBlockHeader">Code:</div>
<syntaxhighlight lang="sci" class="cs">

(method (syntaxFail theString)
(switch(Random(0 2))
(case 0
Print("That doesn't appear to be a proper sentence.")
)
(case 1
Print("What in the heck are you talking about?")
)
(default
Print("That's probably something you could do, but this game won't!")
)
)
)</syntaxhighlight>
</blockquote>
 
<blockquote>
<div class="CodeBlockHeader">Code:</div>
<syntaxhighlight lang="sci" class="cs">(method (pragmaFail theString)
(switch(Random(0 2))
(case 0
Print("The heck you say?")
)
(case 1
Print("You're too smart for this game!")
)
(default
Print("Congratulations! You have dumbfounded this game!")
)
)
)</syntaxhighlight>
</blockquote>

The methods all take the string as a parameter. Whether you choose to use it or not is up to you.

You can have as many or as few responses as you like. Just change the random amount and cases.

That sums up global response handlers! Now your game can have attitude!

 

<span style="float: left">[[Global Said() Statements|< Previous: Chapter 1 - Global Said() Statements]]</span>
<span style="float: right">[[Actor Paths|Next: Chapter 3 - Making Actors Move Along Paths >]]</span>

 

[[Category:Said() Strings]]
[[Category:The SCI Parser]]
[[Category:Tutorials]]