Pillaged Village

An interactive fiction by Lars Thurgoodson (2007) - the Inform 7 source text

Home page

Contents
Previous
Next

Complete text		Section 2 - Laying out the sidebar

Include Simple Graphical Window by Emily Short. The graphics window pixel count is 99. The graphics window position is g-left.

[Our design here is similar to the one in City of Secrets:

There is a graphical sidebar of medium width, which contains a compass rose at the bottom and other status and illustration imagery above.

The rationale for this UI design is that it keeps the portion of the screen that the player is likely to check most often -- the exits display -- close to the prompt and new text at the bottom of the screen. This minimizes the amount that the player has to glance away.

In a complete game, I would also add images above the compass rose that might vary with the location or the chapter of the game we're currently experiencing. But that would add to the complexity of the example, so I don't do it here. Please feel free to borrow and experiment on your own, though!]

Include Status Line Removal by Emily Short. [Optional: in my opinion, this style of presentation looks better without a text status line, since the graphical sidebar is functioning in place of that status line.]

Include Graphic Links by Jeff Sheets. [This extension allows us to set the graphlinks described below.]

When play begins (this is the setting directional hyperlinks rule):
    follow the compass-drawing rule.

To establish compass graphlinks:
    let D be grid-size;
    let DD be 2 * D;
    let DDD be graphics window pixel count;
    let top-edge be current graphics window height - (D * 3);
    let upper-mid be top-edge + D;
    let lower-mid be top-edge + DD;
    let bottom-edge be current graphics window height;
    set a graphlink identified as "goNW" from 0 by top-edge to D by upper-mid as "northwest";
    set a graphlink identified as "goN" from D by top-edge to DD by upper-mid as "north";
    set a graphlink identified as "goNE" from DD by top-edge to DDD by upper-mid as "northeast";
    set a graphlink identified as "goW" from 0 by upper-mid to D by lower-mid as "west";
    set a graphlink identified as "lookHere" from D by upper-mid to DD by lower-mid as "look";
    set a graphlink identified as "goE" from DD by upper-mid to DDD by lower-mid as "east";
    set a graphlink identified as "goSW" from 0 by lower-mid to D by bottom-edge as "southwest";
    set a graphlink identified as "goS" from D by lower-mid to DD by bottom-edge as "south";
    set a graphlink identified as "goSE" from DD by lower-mid to DDD by bottom-edge as "southeast".
    
To clear compass graphlinks:
    clear the graphlink identified as "goNW";
    clear the graphlink identified as "goN";
    clear the graphlink identified as "goNE";
    clear the graphlink identified as "goW";
    clear the graphlink identified as "lookHere";
    clear the graphlink identified as "goE";
    clear the graphlink identified as "goSW";
    clear the graphlink identified as "goS";
    clear the graphlink identified as "goSE";
    
When play begins (this is the setting drawing-rule rule):
    now current graphics drawing rule is the compass-drawing rule.
    
Carry out going (this is the update compass on movement rule):
    refresh compass with current directions.
    
To decide what number is grid-size:
    let D be graphics window pixel count / 3;
    decide on D;

This is the compass-drawing rule:
    clear compass graphlinks; [1]
    establish compass graphlinks;
    determine compass coordinates;
    refresh compass with current directions.
    
[There is probably a more elegant way to do this, but looping through the directions does not go through them in clockwise order or anything like that, so it's a little hard to see an obvious way to mechanize a loop through the directions. Therefore, we do it a tedious way:]

To determine compass coordinates:
    let D be grid-size;
    let DD be 2 * D;
    let DDD be graphics window pixel count;
    let TE be current graphics window height - DDD;
    let UM be TE + D;
    let LM be TE + DD;
    let BE be current graphics window height;
    change x-coordinate of northwest to 0;
    change y-coordinate of northwest to TE;
    change x-coordinate of north to D;
    change y-coordinate of north to TE;
    change x-coordinate of northeast to DD;
    change y-coordinate of northeast to TE;
    change x-coordinate of west to 0;
    change y-coordinate of west to UM;
    change x-coordinate of east to DD;
    change y-coordinate of east to UM;
    change x-coordinate of southwest to 0;
    change y-coordinate of southwest to LM;
    change x-coordinate of south to D;
    change y-coordinate of south to LM;
    change x-coordinate of southeast to DD;
    change y-coordinate of southeast to LM.

To refresh compass with current directions:
    blank window to graphics background color;
    repeat with way running through directions
    begin;
        if the way is up or the way is down
        begin;
            do nothing;
        otherwise if the room way from the location is not nothing; [2]
            let X be the x-coordinate of way;
            let Y be the y-coordinate of way;
            if the room way from the location is visited,
                draw the visited image of the way from X by Y to grid-size by grid-size;
            otherwise draw the unvisited image of the way from X by Y to grid-size by grid-size;
        end if;
    end repeat.
    

Notes

[1]. We need to reset the graphlinks every time the player resizes the window, because if the height of the screen changes, the compass may move vertically.

[2]. In the work in progress on which this was based, I included Gavin Lambert's Exit Lister and then used the "if way is a listable exit" to determine whether exits should be listed. The extension provides slightly more flexibility of design because it allows us to explicitly not list exits that are supposed to be hidden; but here I go with a simple implementation for example's sake.