New custom artwork options in 3.2.4rc1

All about creating levels and level sets, custom elements and custom artwork.

Moderators: Flumminator, Zomis

Post Reply
User avatar
Holger
Site Admin
Posts: 4081
Joined: Fri Jun 18, 2004 4:13 pm
Location: Germany
Contact:

New custom artwork options in 3.2.4rc1

Post by Holger »

The current pre-release 3.2.4rc1 contains a number of new custom artwork
configuration options that add a lot of new possibilities to create your very
own games with R'n'D -- this post will introduce the following:

- title screens, title messages and level set information
- menu and screen fading
- main menu customization
- game panel customization

As always, graphics related definitions go into the file "graphicsinfo.conf" in
the "graphics" subdirectory of your level set directory, while sounds and music
definitions belong to the files "soundsinfo.conf" and "musicinfo.conf" in the
subdirectories "sounds" and "music".


Title screens, title messages and level set information

R'n'D 3.2.2 and 3.2.3 already added limited support for title screens (which
was used by many sets in the EMC level collection and also by the level set
"Zelda", for example). R'n'D 3.2.4 will extend this in many ways.

You can define up to five title screens which are displayed when your level set
was selected or when R'n'D starts up with your level set; these are unchanged:

titlescreen_1: <graphic file>
titlescreen_2: <graphic file>
titlescreen_3: <graphic file>
titlescreen_4: <graphic file>
titlescreen_5: <graphic file>

You can also define up to five initial title screens -- these are displayed only
once on startup of R'n'D if your level set is the active set and aren't
displayed anymore afterwards. They are displayed before the normal title screens
are displayed:

titlescreen_initial_1: <graphic file>
titlescreen_initial_2: <graphic file>
titlescreen_initial_3: <graphic file>
titlescreen_initial_4: <graphic file>
titlescreen_initial_5: <graphic file>

While the title screen definitions are used to display title images, you can
also define title messages -- these are used to print text from text files to
the screen instead of images. As with title screens, you can define up to five
initial title messages only shown on program startup and up to five title
messages displayed when the set was selected (or active on program startup).
The files that contain the text to display are not specified in any config file,
but are searched for in the level set directory itself under the following
filenames:

- "titlemessage_initial_1.txt"
- "titlemessage_initial_2.txt"
- "titlemessage_initial_3.txt"
- "titlemessage_initial_4.txt"
- "titlemessage_initial_5.txt"
- "titlemessage_1.txt"
- "titlemessage_2.txt"
- "titlemessage_3.txt"
- "titlemessage_4.txt"
- "titlemessage_5.txt"

Text files with those filenames that are found in the level set directory are
displayed after the (initial or normal) title screens with default settings.
These settings can be modified in the "graphicsinfo.conf" file with the
following definitions:

[titlemessage_initial].<attribute>: <value>
[titlemessage].<attribute>: <value>

These group definitions define the used attributes for all (initial or normal)
title messages; however, you can also define different settings for each title
message:

titlemessage_initial_1.<attribute>: <value>
titlemessage_initial_2.<attribute>: <value>
titlemessage_initial_3.<attribute>: <value>
titlemessage_initial_4.<attribute>: <value>
titlemessage_initial_5.<attribute>: <value>
titlemessage_1.<attribute>: <value>
titlemessage_2.<attribute>: <value>
titlemessage_3.<attribute>: <value>
titlemessage_4.<attribute>: <value>
titlemessage_5.<attribute>: <value>

The attributes that can be used are shown with "titlemessage_1" as an example:

titlemessage_1.x: <value>
titlemessage_1.y: <value>
titlemessage_1.width: <value>
titlemessage_1.height: <value>
titlemessage_1.chars: <value>
titlemessage_1.lines: <value>
titlemessage_1.align: <value>
titlemessage_1.valign: <value>
titlemessage_1.font: <value>
titlemessage_1.autowrap: <value>
titlemessage_1.centered: <value>
titlemessage_1.parse_comments: <value>
titlemessage_1.sort_priority: <value>
titlemessage_1.fade_mode: <value>
titlemessage_1.fade_delay: <value>
titlemessage_1.post_delay: <value>
titlemessage_1.auto_delay: <value>

The "x" and "y" attributes specify the start of the text message on the screen,
as expected. The "width" and "height" attributes on the one hand and the "chars"
and "lines" attributes on the other hand are exchangeable -- you can either
define an area with "width" and "height" pixels, in which the text is wrapped
accordingly, or you can define the same area by using the number of chars per
line and the number of lines per screen, according to the specified font. Those
settings that are not explicitly defined and that should be determined
automatically must be set to "-1".

The attributes "align" and "valign" work just like in HTML and specify how the
text should be aligned at the x/y position, with the following possible values:
- align: left, center, right
- valign: top, middle, bottom

Example: To display the text message in a 640x512 pixel sized rectangle in the
middle of the screen, use "640" and "512" as "width" and "height", use the x/y
coordinates of the middle of the (672x560 pixel sized) R'n'D screen (which are
therefore "336" and "280") and use "center" and "middle" for the "align" and
"valign" attributes. These settings are exactly the default values, by the way.

To specify the font to use, use the "font" attribute with a value that specifies
a valid font name, like "font.text_1" (default). To define the font itself for
this example, use the token name "font.text_1.TITLE" for normal title messages
and "font.text_1.TITLE_INITIAL" for the initial title messages.

To control if the text should be automatically wrapped, use the "autowrap"
attribute with the value "true" or "false". However, when using "false", the
text is also wrapped when it would overlap the defined box otherwise, but not
at word boundaries, but at the character that overlaps the box. So when not
using automatic text wrapping, you should write your text file in a way that it
fits into the defined rectangle, or it will look bad.

With the "centered" attribute, you can decide if the content of the text file
should be displayed centered, line by line. This is different to a definition
"align: center", as this only centers the whole text box at the specified
screen position, while "centered: true" centers each line of text inside that
text box.

With the "sort_priority" attribute, you can define the order of title screens.
This would be useless when only applied to title messages (as you can already
define their order by their filename), but as you can also use this attribute
with title screen definitions, you can use it to display title messages before
title screens, or by displaying a mixture of images and text messages in any
order. As always, the "sort priority" would be better described as "sort order",
as low numbers are sorted in before higher numbers.

The attributes "fade_mode", "fade_delay", "post_delay" and "auto_delay" are
described in the part about menu and screen fading below.

The attribute "parse_comments" can be used to strip off comments from your
title message text file. A comment is defined as a line that starts with a "#"
character. However, there are more uses of this attribute: You can change
attribute values for this text message inside the file on the fly! To do this,
define a comment line that includes the attribute change definition, like in the
following text message file example:

Code: Select all

This is normal, left-aligned text.

# .centered: true
This line will be centered.
# .centered: false

This line will be left-aligned again.

# .autowrap: false

From here, text won't be automatically wrapped.

# .font: font.text_2
This line is displayed using a different font!
# .font: font.text_1

Previous font again!

# .parse_comments: false

# This line will now be displayed (including the "#")!
You can (only) use the following four attributes "centered", "autowrap", "font"
and "skip_comments" inside a text message file. Note that after an inline
definition "# .parse_comments: false", you cannot modify any attributes anymore
from within the text file directly, as comment lines are now displayed to the
screen instead of being parsed!

The default values for title messages are "autowrap: false", "centered: false"
and "parse_comments: false".

There is a special kind of text message that already exists in earlier versions
of R'n'D: Level set information text messages, defined as a file "readme.txt"
(or "README.txt", or "README" etc.) in the level set directory. Everything
written above regarding title messages works exactly the same for level set
information messages, but with different default values (mainly for downward
compatibility with existing level sets with level set info messages): The text
box is a bit smaller, and the attributes "autowrap" and "parse_comments" are set
to "true" by default (instead of "false" as for title messages).

Title screens and title messages can also be defined to have a background image
on which they are displayed, a background sound that is played or even a
background music; these can be defined with the following settings:

background.TITLE_INITIAL: <artwork file>
background.TITLE: <artwork file>

This defines a "global" background image, sound or music (depending into which
artwork configuration you write them) for every initial or normal title screen
or message. To be more specific, use the following more specific options:

background.titlescreen_initial_X: <artwork file>
background.titlemessage_initial_X: <artwork file>
background.titlescreen_X: <artwork file>
background.titlemessage_X: <artwork file>

Replace the 'X' by a number from '1' to '5', as always.


Menu and screen fading

When defining all those title screens and title messages, it may be desired to
not instantly show the next screen when pressing a key or button, but fading
screens in and out instead, as it is done by version 3.2.3 (hard-coded). With
3.2.4, these fading methods can be defined in a little bit more flexible way.

Do to this, there are the following definitions available:

[title_initial].fade_mode: <value>
[title_initial].fade_delay: <value>
[title_initial].post_delay: <value>
[title_initial].auto_delay: <value>
[title].fade_mode: <value>
[title].fade_delay: <value>
[title].post_delay: <value>
[title].auto_delay: <value>

Again, these group definitions define the used attributes for all (initial or
normal) title screens and messages, but you can also define different settings
for each title screen or title message (where 'X' is a number from '1' to '5'):

titlescreen_initial_X.<attribute> <value>
titlemessage_initial_X.<attribute> <value>
titlescreen_X.<attribute> <value>
titlemessage_X.<attribute> <value>

You can also use the group definitions for title messages again, of course:

[titlemessage_initial].<attribute> <value>
[titlemessage].<attribute> <value>

The screen fading definitions can be used as follows: "fade_mode" defines which
"fading effect" to use -- possible values are "none" (instantly switch to the
next screen), "fade" (fade out last screen and fade in next screen) and
"crossfade" (directly fade from one screen to the next one, without fading to
black between the last and next screen). There's also a special fading method
called "melt" available, that was taken from a popular first person shooter.
More such special fading methods may follow.

The attribute "fade_delay" defines the duration of the fading effect, in
milliseconds. "post_delay" defines a pause between fading out and fading in
(again in ms), while "auto_delay" defines a delay after which the next screen
is automatically displayed, even if the user did not press a key or button.
(Setting "auto_delay" to "-1" disables it; this is the default setting.)

Not only title screens and messages can be faded in and out, but also menu
screens -- use the following definitions (where "<value>" is one of the four
fading definition attributes described above):

menu.enter_menu.<attribute>: <value>
menu.leave_menu.<attribute>: <value>
menu.enter_screen.<attribute>: <value>
menu.leave_screen.<attribute>: <value>

This allows for different fading definitions when entering or leaving a menu
or when entering or leaving a "screen", where a "screen" is everything that is
not a menu, but especially the game playing screen, the level editor screen, the
"Hall of Fame" (high scores) screen and the info screens. These four screens
can also have their own screen fading definitions, as follows:

menu.enter_screen.SCORES.<attribute>: <value>
menu.enter_screen.EDITOR.<attribute>: <value>
menu.enter_screen.INFO.<attribute>: <value>
menu.enter_screen.PLAYING.<attribute>: <value>
menu.leave_screen.SCORES.<attribute>: <value>
menu.leave_screen.EDITOR.<attribute>: <value>
menu.leave_screen.INFO.<attribute>: <value>
menu.leave_screen.PLAYING.<attribute>: <value>


Main menu customization

To enhance the existing menu draw offset definitions (like "menu.draw_xoffset",
"menu.draw_yoffset.INFO" or "menu.draw_xoffset.INFO[ELEMENTS]"), there was added
a variety of new definitions especially for designing the main menu screen.

You can now define the position and alignment of the menu buttons and texts on
the main screen; for the main menu buttons, there are the following definitions
available:

main.button.name.<attribute>: <value>
main.button.levels.<attribute>: <value>
main.button.scores.<attribute>: <value>
main.button.editor.<attribute>: <value>
main.button.info.<attribute>: <value>
main.button.game.<attribute>: <value>
main.button.setup.<attribute>: <value>
main.button.quit.<attribute>: <value>
main.button.prev_level.<attribute>: <value>
main.button.next_level.<attribute>: <value>

Available attributes for main menu buttons are only "x" and "y" to define the
screen position.

For main menu text position and alignment definitions, there are the following
definitions:

main.text.name.<attribute>: <value>
main.text.levels.<attribute>: <value>
main.text.scores.<attribute>: <value>
main.text.editor.<attribute>: <value>
main.text.info.<attribute>: <value>
main.text.game.<attribute>: <value>
main.text.setup.<attribute>: <value>
main.text.quit.<attribute>: <value>
main.text.first_level.<attribute>: <value>
main.text.last_level.<attribute>: <value>
main.text.level_number.<attribute>: <value>
main.text.level_info_1.<attribute>: <value>
main.text.level_info_2.<attribute>: <value>
main.text.level_name.<attribute>: <value>
main.text.level_author.<attribute>: <value>
main.text.level_year.<attribute>: <value>
main.text.level_imported_from.<attribute>: <value>
main.text.level_imported_by.<attribute>: <value>
main.text.level_tested_by.<attribute>: <value>
main.text.title_1.<attribute>: <value>
main.text.title_2.<attribute>: <value>
main.text.title_3.<attribute>: <value>

For text position and alignment definitions, the following attributes are
available (using "main.text.name" as an example):

main.text.name.x: <value>
main.text.name.y: <value>
main.text.name.width: <value>
main.text.name.height: <value>
main.text.name.align: <value>
main.text.name.valign: <value>
main.text.name.font: <value>

While "x" and "y" are obvious and "align", "valign" and "font" work just the
same as with title screens above, "width" and "height" might need some more
explanation. These attributes are only available for main menu texts that can
be directly clicked on with the mouse pointer to start the corresponding menu
entry. When they are set to "-1", they are automatically determined from the
(static) menu texts (like "Start Game"). When "width" and "height" are
explicitly set, these values are used instead of the automatically determined
values. This is useful if you disable the menu texts entirely (by setting the
corresponding menu text font to "[NONE]", therefore disabling it) and define
your own (textual or graphical) menu entries by drawing them directly on the
main menu background image (defined by the "background.MAIN" definition), while
still being able to activate these menu entries by clicking with the mouse
pointer on the menu entry (instead of the menu button left of the text).

Some definitions have additional attributes "digits" or "chars": Using "digits"
with "main.text.first_level", "main.text.last_level", "main.text.level_number"
or "main.text.level_year", you can format these values to a certain number of
null-padded digits (the first three mentioned values default to "3"). Using "-1"
causes the numerical values printed "as is", without any padding or limitation.
Using "chars" with "main.text.level_info_1", "main.text.level_info_2",
"main.text.level_name", "main.text.level_author",
"main.text.level_imported_from", "main.text.level_imported_by" or
"main.text.level_tested_by" can be used to limit the number of displayed text
characters to the specified value (the default "-1" means "do not limit").

"main.text.level_info_1" and "main.text.level_info_2" are a bit special as they
reference the animated text usually displayed above and below the level preview
(using the level name, level author etc.), while "main.text.level_name" etc. are
not displayed on the main menu screen using the default graphic definitions, but
can be defined to be used in addition or instead of that "animated" texts.

For all these button and text definitions, using "-1" for the "x" and "y"
attributes causes the button or text not to be displayed on the main menu
screen.

There is one additional definition for the main menu screen: "main.input.name".
It can be used to define position, alignment and font for the player or team
name on the main menu screen.

Game panel customization

This is IMHO the most interesting part of the new customization definitions
introduced by the upcoming version 3.2.4. It's main purpose is, as with the
main menu definitions, to modify the existing game panel displays and controls:
The well-known displays for the current level number, the number of gems left
to be collected, the number of items in the inventory (like dynamite), the four
main keys, the score and the time, and the three game control buttons (stop,
pause, play) and three sound/music control buttons (on/off buttons for music,
loop sounds and simple sounds).

With the new definitions, you can either place these controls at a different
location on the game panel (by just using the "x" and "y" attributes, as usual),
or totally remove one or more of them by setting the "x" and "y" attributes to
"-1". The attributes "align", "valign" do what you think they do.

For the numerical displays (all but the key displays for the default displays),
you can set a different font for each display by using the "font" attribute,
and you can specify the number of digits to be displayed by using the "digits"
attribute. Using "0" or "-1" or less for the "digits" attribute causes the
number to be displayed "naturally", that is without padding zeroes on the left.

For historical reasons, there are two special cases: "game.panel.level_number"
and "game.panel.time", when using "-1" for "digits" value, behave like they do
in the default artwork: When the level number is between "0" and "99", it is
displayed as a size of 2 digits (with padding zeroes, if needed), while it is
displayed as 3 digits when "100" or higher. For the time, it's displayed with
3 zero padded digits for values between "0" and "999", while it is displayed
with 4 digits when "1000" or higher. As this requires a different (narrower)
font, this narrow font can be specified with the "font_narrow" attribute.

But there are a lot more definitions to display various other game engine
values on the game panel, not only the few well-known definitions -- here they
are:

game.panel.level_number.<attribute>: <value> (number)
game.panel.gems.<attribute>: <value> (number)
game.panel.inventory_count.<attribute>: <value> (number)
game.panel.inventory_first_1.<attribute>: <value> (element)
game.panel.inventory_first_2.<attribute>: <value> (element)
game.panel.inventory_first_3.<attribute>: <value> (element)
game.panel.inventory_first_4.<attribute>: <value> (element)
game.panel.inventory_first_5.<attribute>: <value> (element)
game.panel.inventory_first_6.<attribute>: <value> (element)
game.panel.inventory_first_7.<attribute>: <value> (element)
game.panel.inventory_first_8.<attribute>: <value> (element)
game.panel.inventory_last_1.<attribute>: <value> (element)
game.panel.inventory_last_2.<attribute>: <value> (element)
game.panel.inventory_last_3.<attribute>: <value> (element)
game.panel.inventory_last_4.<attribute>: <value> (element)
game.panel.inventory_last_5.<attribute>: <value> (element)
game.panel.inventory_last_6.<attribute>: <value> (element)
game.panel.inventory_last_7.<attribute>: <value> (element)
game.panel.inventory_last_8.<attribute>: <value> (element)
game.panel.key_1.<attribute>: <value> (element)
game.panel.key_2.<attribute>: <value> (element)
game.panel.key_3.<attribute>: <value> (element)
game.panel.key_4.<attribute>: <value> (element)
game.panel.key_5.<attribute>: <value> (element)
game.panel.key_6.<attribute>: <value> (element)
game.panel.key_7.<attribute>: <value> (element)
game.panel.key_8.<attribute>: <value> (element)
game.panel.key_white.<attribute>: <value> (element)
game.panel.key_white_count.<attribute>: <value> (number)
game.panel.score.<attribute>: <value> (number)
game.panel.time.<attribute>: <value> (number)
game.panel.time_hh.<attribute>: <value> (number)
game.panel.time_mm.<attribute>: <value> (number)
game.panel.time_ss.<attribute>: <value> (number)
game.panel.shield_normal.<attribute>: <value> (element)
game.panel.shield_normal_time.<attribute>: <value> (number)
game.panel.shield_deadly.<attribute>: <value> (element)
game.panel.shield_deadly_time.<attribute>: <value> (number)
game.panel.exit.<attribute>: <value> (element)
game.panel.emc_magic_ball.<attribute>: <value> (element)
game.panel.emc_magic_ball_switch.<attribute>: <value> (element)
game.panel.light_switch.<attribute>: <value> (element)
game.panel.light_switch_time.<attribute>: <value> (number)
game.panel.timegate_switch.<attribute>: <value> (element)
game.panel.timegate_switch_time.<attribute>: <value> (number)
game.panel.switchgate_switch.<attribute>: <value> (element)
game.panel.emc_lenses.<attribute>: <value> (element)
game.panel.emc_lenses_time.<attribute>: <value> (number)
game.panel.emc_magnifier.<attribute>: <value> (element)
game.panel.emc_magnifier_time.<attribute>: <value> (number)
game.panel.balloon_switch.<attribute>: <value> (element)
game.panel.dynabomb_number.<attribute>: <value> (number)
game.panel.dynabomb_size.<attribute>: <value> (number)
game.panel.dynabomb_power.<attribute>: <value> (element)
game.panel.penguins.<attribute>: <value> (number)
game.panel.sokoban_objects.<attribute>: <value> (number)
game.panel.sokoban_fields.<attribute>: <value> (number)
game.panel.robot_wheel.<attribute>: <value> (element)
game.panel.conveyor_belt_1.<attribute>: <value> (element)
game.panel.conveyor_belt_1_switch.<attribute>: <value> (element)
game.panel.conveyor_belt_2.<attribute>: <value> (element)
game.panel.conveyor_belt_2_switch.<attribute>: <value> (element)
game.panel.conveyor_belt_3.<attribute>: <value> (element)
game.panel.conveyor_belt_3_switch.<attribute>: <value> (element)
game.panel.conveyor_belt_4.<attribute>: <value> (element)
game.panel.conveyor_belt_4_switch.<attribute>: <value> (element)
game.panel.magic_wall.<attribute>: <value> (element)
game.panel.magic_wall_time.<attribute>: <value> (number)
game.panel.gravity_state.<attribute>: <value> (string)
game.panel.element_1.<attribute>: <value> (element)
game.panel.element_1_count.<attribute>: <value> (number) (*)
game.panel.element_2.<attribute>: <value> (element)
game.panel.element_2_count.<attribute>: <value> (number) (*)
game.panel.element_3.<attribute>: <value> (element)
game.panel.element_3_count.<attribute>: <value> (number) (*)
game.panel.element_4.<attribute>: <value> (element)
game.panel.element_4_count.<attribute>: <value> (number) (*)
game.panel.element_5.<attribute>: <value> (element)
game.panel.element_5_count.<attribute>: <value> (number) (*)
game.panel.element_6.<attribute>: <value> (element)
game.panel.element_6_count.<attribute>: <value> (number) (*)
game.panel.element_7.<attribute>: <value> (element)
game.panel.element_7_count.<attribute>: <value> (number) (*)
game.panel.element_8.<attribute>: <value> (element)
game.panel.element_8_count.<attribute>: <value> (number) (*)
game.panel.ce_score_1.<attribute>: <value> (number)
game.panel.ce_score_1_element.<attribute>: <value> (element)
game.panel.ce_score_2.<attribute>: <value> (number)
game.panel.ce_score_2_element.<attribute>: <value> (element)
game.panel.ce_score_3.<attribute>: <value> (number)
game.panel.ce_score_3_element.<attribute>: <value> (element)
game.panel.ce_score_4.<attribute>: <value> (number)
game.panel.ce_score_4_element.<attribute>: <value> (element)
game.panel.ce_score_5.<attribute>: <value> (number)
game.panel.ce_score_5_element.<attribute>: <value> (element)
game.panel.ce_score_6.<attribute>: <value> (number)
game.panel.ce_score_6_element.<attribute>: <value> (element)
game.panel.ce_score_7.<attribute>: <value> (number)
game.panel.ce_score_7_element.<attribute>: <value> (element)
game.panel.ce_score_8.<attribute>: <value> (number)
game.panel.ce_score_8_element.<attribute>: <value> (element)
game.panel.player_name.<attribute>: <value> (string)
game.panel.level_name.<attribute>: <value> (string)
game.panel.level_author.<attribute>: <value> (string)

game.button.stop.<attribute>: <value> (button)
game.button.pause.<attribute>: <value> (button)
game.button.play.<attribute>: <value> (button)
game.button.sound_music.<attribute>: <value> (button)
game.button.sound_loops.<attribute>: <value> (button)
game.button.sound_simple.<attribute>: <value> (button)

Wow, that's a lot of stuff! But it's relatively easy to explain what these
definitions are good for, and we'll start with the easy ones!

(Note: The definitions marked with "(*)" are not yet available in the current
pre-release 3.2.4-1, but will be added with the next pre-release version.)

Important: The last value in the above lines (in parentheses, after the usual
"<value>" placeholder) is only for documentary purpose and may not be added to
the artwork config file! It's just there to make it easier to see what these
definitions will display on the game panel when used: A numerical value
(number), a game element graphic (element), a text string (string) or a control
gadget (button).

To start with the last entries from the list: The "game.button.*" definitions
just have the "x" and "y" attributes, so you can only relocate or remove them
from the game panel.

The "string" type definitions just display the name of the current level, the
name of the author of the current level, the name of the player and the current
gravity state as a string "on" or "off" for active or inactive gravity for the
local player. In addition to the position, alignment and font attributes, they
have a "chars" attribute where the "number" style definitions have their
"digits" attribute, and it behaves nearly the same (but does not pad a string
shorter than "chars" characters with spaces).

The "number" style definitions display the numerical value of various internal
game engine values, like these (in addition to the "standard" ones):

key_white_count - the number of collected white keys
time_hh - the two-digits, zero padded hours of level time
time_mm - the two-digits, zero padded minutes of level time
time_ss - the two-digits, zero padded seconds of level time
shield_normal_time - time left for the normal shield, when active
shield_deadly_time - time left for the deadly shield, when active
light_switch_time - time left for the light switch, when active
timegate_switch_time - time left for the time gate switch, when active
emc_lenses_time - time left for the lenses, when active
emc_magnifier_time - time left for the magnifier, when active
dynabomb_number - number of dyna bombs that can be placed at a time
dynabomb_size - explosion size of dyna bomb explosions
penguins - number of penguins that must be guided to the exit
sokoban_objects - number of Sokoban objects not yet placed on a field
sokoban_fields - number of Sokoban fields still to be filled
magic_wall_time - time left for the magic wall, when active

These are quite easy. But you can not only display game engine values as
numbers, but also as elements! For example, if you have a light switch somewhere
on the playfield, it can be either active or inactive. As it might be out of
sight when playing a large level, you can display it on the game panel, too!
Just use the "game.panel.light_switch" definition to place it somewhere on the
game panel, and it will show the current state just like it does in the game.

As you might want to use a different graphic for an element on the game panel,
you can use a special definition with a ".PANEL" suffix, just like the ".EDITOR"
suffix to define graphics used in the level editor. For example, to display a
different light switch on the game panel than in the game itself, just use the
"light_switch.PANEL" (not "game.panel.light_switch.PANEL"!) definition to add a
game panel specific graphic to the normal "light_switch" graphic definition.

Note that these "PANEL" element definitions can be animated as well!

You can use the following "element" style game panel definitions:

key_1 - display key 1, when collected (as usual)
key_2 - display key 2, when collected (as usual)
key_3 - display key 3, when collected (as usual)
key_4 - display key 4, when collected (as usual)
key_5 - display key 5, which is normally not displayed
key_6 - display key 6, which is normally not displayed
key_7 - display key 7, which is normally not displayed
key_8 - display key 8, which is normally not displayed
key_white - display the white key, if key_white_count is > 0
shield_normal - display the normal shield, when active
shield_deadly - display the deadly shield, when active
exit - display the current state of the exit (open or closed)
emc_magic_ball - display the current state of the magic ball
emc_magic_ball_switch - display the current state of the magic ball switch
light_switch - display the current state of the light switch
timegate_switch - display the current state of the time gate switch
switchgate_switch - display the current state of the switch gate switch
emc_lenses - display the lenses, when active
emc_magnifier - display the magnifier, when active
balloon_switch - display the current state of the balloon switch
dynabomb_power - display the special dyna bomb power-up, if collected
robot_wheel - display the current state of the robot wheel
conveyor_belt_1 - display the current state of conveyor belt 1
conveyor_belt_1_switch - display the current state of conveyor belt switch 1
conveyor_belt_2 - display the current state of conveyor belt 2
conveyor_belt_2_switch - display the current state of conveyor belt switch 2
conveyor_belt_3 - display the current state of conveyor belt 3
conveyor_belt_3_switch - display the current state of conveyor belt switch 3
conveyor_belt_4 - display the current state of conveyor belt 4
conveyor_belt_4_switch - display the current state of conveyor belt switch 4
magic_wall - display the current state of the magic wall

Just trying out what happens if you place one or more of the above definitions
on the game panel is probably even easier to explain it!

All "element" style game panel displays have an additional "tile_size"
attribute that works just the same as the "preview.tile_size" definition:
You can specify the size of the displayed element graphic with it. The default
is "16", so if you don't modify it, all element style game panel graphics are
displayed in 16x16 size, just like in the level editor. If you set it to "32",
they are displayed as 32x32 size, just as in the game itself. You can also set
it to a smaller value like "8", "4", "2" or "1", but all values are rounded to
a power of two.

There are a few more game panel definitions that I skipped above, because they
need some more explanation -- let's start with these ones:

inventory_first_1
inventory_first_2
inventory_first_3
inventory_first_4
inventory_first_5
inventory_first_6
inventory_first_7
inventory_first_8
inventory_last_1
inventory_last_2
inventory_last_3
inventory_last_4
inventory_last_5
inventory_last_6
inventory_last_7
inventory_last_8

These definitions just show elements from your inventory (but only those that
you can drop again, like the dynamite or dyna bomb, but not the keys, for
example). That is, if you have collected a piece of dynamite, it can be
displayed using "inventory_first_1", but also by "inventory_last_1" (because
it is the first element you have collected, but at the same time the last
element that you have collected). If you collect a dyna bomb now, it will
replace the dynamite from "inventory_last_1", which is now at
"inventory_last_2", and will also be put to "inventory_first_2". So this means
that "inventory_first_x" works as a list that displays the first 8 entries that
the player has collected, while "inventory_last_x" works as a stack that
displays the last 8 elements that the player has collected. If the player drops
an element, the list and the stack are updated accordingly. This could be nice
if you create a puzzle level where you have to collect various elements and
then have to place them at somewhere in the level again, and if you want to give
the player a little help what's in the inventory.

There are some more definitions:

element_1
element_2
element_3
element_4
element_5
element_6
element_7
element_8

These definitions do nothing more than just displaying up to eight arbitrary
elements (with or without animation, just as defined in the normal element
graphic definition or in the special "PANEL" element graphic definition).
To specify which element to display in the game panel, there is an attribute
"element" for each definition. The default is "empty_space", so nothing is
displayed by default if you place any of them on the game panel, but using a
definition like "game.panel.element_1.element: yamyam" will display a yam yam
on the game panel (which is completely independent of the game engine, so there
is no need to place an element into the level playfield to display it on the
game panel).

What is this good for, you might ask! Good question! As it is not connected to
the game engine in any way, you can freely use it for pure decoration purpose.

An interesting aspect here is that you are not limited to a 32x32 size of the
special "PANEL" graphic definition. That's right, you can use any graphic size
(or animation size) you want. Just use a definition like this for the example
above:

yamyam.PANEL: <graphic file>
yamyam.PANEL.width: 100
yamyam.PANEL.height: 280

Now you have a graphic or animation of the size of the whole game panel, which
you could place at the top left position, so that it covers the whole panel:

game.panel.element_1.element: yamyam
game.panel.element_1.x: 0
game.panel.element_1.y: 0

To prevent the graphic from being scaled down to half size, as the default of
"16" for the "tile_size" attribute would do, just use "original graphic size":

game.panel.element_1.tile_size: 32

Now you have a full-size graphic or animation on the game panel. Unfortunately,
you may not see anything else of the game panel now! To prevent this, there are
two ways to make your normal game panel displays visible again. The first one
is to simply make your graphic or animation transparent (at those pixels which
are totally black) by using the following new attribute in the definition:

game.panel.element_1.draw_masked: true

Now the graphic is transparent at all black pixels, as usual with all R'n'D
graphics. This boolean "draw_masked" attribute exists for all "number",
"string" and "element" style game panel definitions. The default for "number"
and "string" style displays is "true", so they are drawn transparent on the game
panel background by default (which can be changed to "false", if desired),
while the "element" style panel displays are drawn opaque by default (but can
be changed to transparent by using "draw_masked: true").

There is another way to make your other display items visible even when using
a graphic of the size of the whole game panel: Explicitly specify the order in
which all game panel displays are drawn to the game panel. You can think of
this as some sort of additional "z axis" which allows for stacking the displays
vertically, so that you cover lower displays with higher ones. This is done by
using the attribute "draw_order", which is "0" for all displays by default.
To put your full-size panel graphic to the background, just use a "draw_order"
value that is lower than all other game panel displays, like this:

game.panel.element_1.draw_order: -100

"-1" would have been sufficient if all other displays still have their default
value "0", of course. If you have defined your full-size panel graphic as
transparent, and always want it to be in the very foreground, just use a
corresponding "draw_order" that is higher than all others, like this:

game.panel.element_1.draw_order: 100

Again, "1" would have been enough here if all others are set to "0".

Note: The game buttons (like "game.button.stop") currently do not have a
"draw_order" attribute, but are always drawn directly on the background graphic.
(This might change in a future version.)

There is another definition that looks a bit similar, but that does something
different than "game.panel.element_x":

element_1_count
element_2_count
element_3_count
element_4_count
element_5_count
element_6_count
element_7_count
element_8_count

This displays the number of elements on the current game playfield that was
specified with the "element" attribute. For example, to display all emeralds
on the playfield at every time during the game, use something like this:

game.panel.element_1_count.element: emerald

If you want to count complex elements built up by several custom elements,
this approach would not work well. There is a solution: Just use group elements!
You have to define a group element in the level editor that contains all base
custom elements that make up your complex element (for example, two or three
custom elements that change into each others while changing the state of the
more complex element built by those custom elements). Then just use it in the
game panel element definition, like this:

game.panel.element_1_count.element: group_1

(*) Note: This "element_x_count" definition just described is not yet available
in pre-release 3.2.4-1, but will be in the next pre-release version.

To do even more tricky (and powerful) things, there are game panel definitions
available to display the "CE score" of specified custom elements, either in a
numerical way or interpreted as a game element:

ce_score_1
ce_score_2
ce_score_3
ce_score_4
ce_score_5
ce_score_6
ce_score_7
ce_score_8
ce_score_1_element
ce_score_2_element
ce_score_3_element
ce_score_4_element
ce_score_5_element
ce_score_6_element
ce_score_7_element
ce_score_8_element

While the "ce_score_x" definitions just display the CE score as a number, the
"ce_score_x_element" definitions display the exact same CE score, but as a game
element. (Remember that you can not only define a CE score to be a numerical
value in a custom element's change page, but also assign an element to it by
using the "target" or "trigger" action parameters, or as a raw element value if
you know what you do.)

So, if you have a custom element that counts some value using its CE score, you
can display it in the game panel with a definition like this:

game.panel.ce_score_1.element: custom_42

And if you want that CE score interpreted as a R'n'D element instead, use:

game.panel.ce_score_1_element.element: custom_42

While writing about CE score: You can also use a more simple "element_x"
definition to display a custom element, and then use the animation type
"cs_score" for it, like this:

game.panel.element_1.element: custom_42

and then either

custom_42.anim_mode: ce_score

or

custom_42.PANEL.anim_mode: ce_score

to define that custom element animation (or only the "PANEL" definition of that
custom element animation) to use the CE score of that custom element to select
the actual animation frame. So you can use such a definition to control a
graphic or animation on the game panel that is directly connected to a custom
element in the game.

Using these game panel customization definitions should make it possible to
create a game panel that has nothing to do anymore with the "classic" game
panel.

If you have some ideas that might be useful or things that are missing to
control the game panel, please let me know!
Last edited by Holger on Fri Apr 13, 2007 8:08 pm, edited 2 times in total.
User avatar
RAP
Posts: 317
Joined: Sat Jun 19, 2004 6:44 pm

Post by RAP »

Woah; making a new custom artwork is awsome. Gets me kinda
confusing later on...
User avatar
Alan
Posts: 661
Joined: Fri Jun 18, 2004 7:48 pm

Post by Alan »

Great work Holger!
Game panel customization

(Yet to be written!)
Can't wait! (the panel is what I want to play with the most)
User avatar
Holger
Site Admin
Posts: 4081
Joined: Fri Jun 18, 2004 4:13 pm
Location: Germany
Contact:

Post by Holger »

> Can't wait! (the panel is what I want to play with the most)

Yes, I also think that it's the most interesting part! :-)

I've just added that part of the documentation for the game panel -- please see above in the original post!
User avatar
Holger
Site Admin
Posts: 4081
Joined: Fri Jun 18, 2004 4:13 pm
Location: Germany
Contact:

Post by Holger »

Updated the part on title screen backgrounds -- of course you can also define background sounds and background music. Please see above! (It's the last paragraph before the "Menu and screen fading" chapter).
User avatar
RAP
Posts: 317
Joined: Sat Jun 19, 2004 6:44 pm

Post by RAP »

These game panel ideas are great! Hmmm... If you install that in the
offical version, it could actually fix the problems when playing EMC levels
that has 4 new keys or DC2 levels! :D WoW!

The possiblities are nearly endless!! You'll install that after I find the rest
of the bugs in this big bad problem!!

Oh yeah, where do I change the panels?
User avatar
Alan
Posts: 661
Joined: Fri Jun 18, 2004 7:48 pm

Post by Alan »

Amazing! :shock:

This really fits into to what I'm doing at the moment!
".PANEL" suffix, just like the ".EDITOR"
Wow, another great idea! :)

Before I got to this sentence I was wondering......Say I have an element that is collectable\dropable, but it changes into something else when dropped? I want to see the "something else" in the panel and not the collectable element........it seems like you've covered all the bases 8)

Right, I'm off to play with my panel :-)
Post Reply