| Contents | Up | Previous | Next | Web Site | Home Page |
~ Arctan Computer Ventures' WordPuzzle Pro ~
Tell me about... WebScripts
| Sections |
|
In order to take information from your puzzle, and to place it into a file in order that a web browser may understand it, that information must be turned into a HTML web page. Prior versions of WordPuzzle Pro performed this by writing the code for producing a document in a fixed way, coded into the application itself. This was fine for a 'rough and ready' first-attempt, but did not produce a particularly polished product.
The latest versions of WordPuzzle Pro take an intermediate step, and make use of files kept on disk called WebScripts. These are HTML documents that have commands embedded at strategic places to represent information that is to be placed by the program according to the information in the puzzle.
This is performed by creating a number of variables, which are named placeholders for storing information temporarily. Each variable has two names - one is fixed, and is used by WordPuzzle Pro to provide the information from the puzzles. One is defined in each WebScript template, and refers to the fixed name as a cross-reference. This means that the same (fixed) variable can be used under different names in different scripts according to the purpose, and can even be used more than once in a script under different names!
Some variables are known as loop variables, and these are used to define sections of script that will be repeated a number of times. A number of related variables will also be changed with each iteration of the loop, so that (for example) clues can be listed in the same way using a repeated loop, without having to think about how to get the next bit of information in the loop, or how many clues there are etc. All that is taken care of for you by WordPuzzle Pro.
Sections can be conditional too, so that you can conditionally include or exclude certain sections according to whether a variable has been defined, or set to True or False.
Using this methodology, quite sophisticated scripts can be created, based on existing web pages if you like, without too much recoding. For insightl, look at the two scripts supplied. The JavaScript version does not even use loops as described above, but rather has arrays predefined. The straight HTML version makes ample use of loops in order to produce tables of information in a fixed way.
The three sections below give further information - the embedded commands show the extra commands that are placed in scripts in order to place information into the script from your puzzles, and the next sections shows a good sample of variables / parameters that are used with the JavaScript and static HTML WebScript templates.
|
Command form |
Purpose |
Sample |
|
<<SUBST varname>> |
Substitute dynamic variable generated by program into document at this point |
<<SUBST copyright>> might give COPYRIGHT 2001-4 Arctan Computer Ventures Ltd. All Rights Reserved. |
|
<<SUBSTCR varname>> |
Substitute dynamic variable generated by program into document at this point. Any carriage returns are replaced with \n to ensure multi-line text is kept on one physical line in the script. |
var GridExplanations = new Array(<<SUBSTCR gridexpl>>); |
|
<<IFDEF varname>> … <</IFDEF>> |
If varname is non-blank, include all data until the next <</IFDEF>> command, otherwise omit data. |
<<IFDEF set2>>var AltClues = new Array(<<SUBST altclues>>); <</IFDEF>> |
|
<<IFNDEF varname>> … <</IFNDEF>> |
If varname is blank, include all data until the next <</IFDEF>> command, otherwise omit data. |
<<IFNDEF noframes>>Your browser does not support frames. Unfortunately, this puzzle requires frames. Please upgrade your browser.<</IFNDEF>> |
|
<<IFTRUE varname>> … <</IFTRUE>> |
If varname is set to true, t, 1, +, y, or yes (in any capitalisation), include all data until the next <</IFTRUE>>, otherwise omit data. |
<<IFTRUE showhints>>var GridHints = new Array(<<SUBST gridhints>>);<</IFTRUE>> |
|
<<IFFALSE varname>> … <</IFFALSE>> |
If varname is set to false, f, 0, -, n, or no (in any capitalisation) or is blank, include all data until the next <</IFFALSE>>, otherwise omit data. |
<<IFFALSE showhints>>Sorry. No hints available.<</IFFALSE>> |
|
<<NAME scriptname>> |
Name for JavaScript. Picked up by host generator application for identification purposes. This is not included in the generated script. |
<<NAME JavaScript Crossword Template with Frames>> |
|
<<COPYRIGHT string>> |
Copyright information about script. This is not included in the generated script. |
<<COPYRIGHT 15/08/2000 Arctan Computer Ventures Ltd>> |
|
<<VERSION verno>> |
Version number of script. This is not included in the generated script. |
<<VERSION 1.0 build 6>> |
|
<<GENERATOR appname>> |
Application that is to parse script and produce generated version. This is not included in the generated script. |
<<GENERATOR WordPuzzle Pro>> |
|
<<MINVER verno>> |
Minimum version of above application that can parse this script. This is not included in the generated script. |
<<MINVER 1.3>> |
|
<<OUTTYPE scriptype>> |
Type of script that will be generated. This is not included in the generated script. |
<<OUTTYPE HTML/JavaScript>> |
|
<<EQUIV>> equivs <</EQUIV> where equivs is a list of items, 1 per line:- substname{=intname | ;defval}, category, vartype [,Comment] |
List of substitution variable definitions used in the script, one definition per line. substname is the name used in the script, intname the name used in the generator. If omitted, defval must be defined as it will not be generated. vartype can be text, integer, date, image, color or boolean. |
defshowmain:True,clues,boolean, Show main set of clues (rather than alternate set) as default? hovercolor:#FF0000,misc,color, Colour to show when hover cursor over a link (optional)gridbgimage=grbgi,grid,image,Grid frame background image (optional) |
|
<<NOBREAK>> |
Joins the current line to the following line. Used to make the source file easier to read. |
<<NAME Std HTML Template>><<NOBREAK>> <<COPYRIGHT 07/09/2000 Arctan Computer Ventures Ltd>><<NOBREAK>> |
|
<<SECTION varname>> … <</SECTION> |
Defines an unconditional section within a document. Used with loop variables (varname) for repeated sections, where the section is duplicated with different data for the contained SUBST commands with each iteration. Commands such as IFDEF and IFTRUE are also sections, but are conditional, and are often not repeating. |
<<SECTION loopgridcol>> <td class="<<IFDEF loopgridchr>>gridsq<</IFDEF>>... <<IFTRUE showletters>><<SUBST loopgridchr>><</IFTRUE>></td> <</SECTION>> |
Commands can be nested up to 10 levels deep. Note that closing <</cmd>> can use either a forward of backslash.
Sample Substitution Parameters
Standard SUBST variables used in the JavaScript template...
Items marked (*intname) are system equivalents where intname is the keyword – i.e. hard-coded internal keywords that link to functionality within the WordPuzzle Pro application. Other keywords are defined for the individual report, and will have a report default.
|
Subst Name |
Purpose |
Sample |
|
copyright (*authr) |
Copyright Information |
COPYRIGHT 2000 Arctan Computer Ventures Ltd. All Rights Reserved. |
|
metadesc (*notes) |
Metaname Description (used by WWW search engines) |
Sample interactive JavaScript 1.2 enhanced crossword for web deployment of crosswords designed with the WordPuzzle Pro puzzle creation and design tool. |
|
metakey |
Metaname keywords (used by WWW search engines) |
wordpuzzlepro, word, puzzle, pro, wordpuzzle, word puzzle, arctan, arctan computer ventures, arctan computer ventures ltd, crossword, cross word, cross-word, xword, javascript, jscript, education, educational, entertainment, interactive, grid, designer, design, tool, dtp, desktop publishing, desk top publishing, anagrams, vocabularly, word list, lexicon, graphics, html, jpeg, jpg, bitmap, bmp, quiz, test, generator, builder, creator, constructor, compiler, constructor, compilation |
|
title (*title) |
Document Title (appears in Window Frame) |
WordPuzzle Pro Sample Crossword |
| saveload (*savld) | Allow user to save semi-completed puzzle to go back to later using Save and Recall buttons. Leave blank to disallow, else give a name for the cookie - default is the title with underlines. | wordpuzzle_pro_sample_crossword |
|
height (*grdht) |
Number of vertical grid cells in the crossword grid |
4 |
|
width (*grdwd) |
Number of horizontal grid cells in the crossword grid |
4 |
|
numwidth (*numwd) |
Maximum string width of clue numbers that appear in squares |
1 |
|
blanksq (*blksq) |
Text with which to fill blank squares with / pad cells |
|
|
cluenumwidth (*cnmwd) |
Maximum string width of clue index (total # of clues – 1) |
1 |
|
gridanswers (*grdan) |
Array of strings that represent the letters on the completed grid – letters of answers, with #s to represent black squares (outs) |
"HELP","A#A#","SIT#","P#EN" |
|
gridnums (*grdno) |
Array of strings representing clue number to be included on each square in the grid. A space indicates that no number should be displayed. The width of each number is indicated by the numwidth variable. |
"1, ,2, "," , , , ","3, , , "," , ,4, " |
|
inclbars (*ibar) |
Include bars and their associated processing in this puzzle? |
True |
|
bardown (*bard) |
Colours for each cell for each vertical bar on the grid. Each value is an 8-byte hex RGB value, or a seq of six Xs to represent no bar. |
"XXXXXX","FF0000","XXXXXX", "XXXXXX" |
|
baracross (*bara) |
Colours for each cell for each horizontal bar on the grid. Each value is an 8-byte hex RGB value, or a seq of six Xs to represent no bar. |
"XXXXXX","FF0000","XXXXXX", "XXXXXX" |
|
gridclues_across (*grcla) |
Array of strings representing the clue index number (of the Clues, AltClues, GridHints and GridExplanations arrays) for each square on the grid, for clues directed across the grid. A space indicates that the square does not incorporate an across clue. |
"0,0,0,0"," , , , ","1,1,1, "," , ,2,2" |
|
gridclues_down (*grcld) |
Array of strings representing the clue index number for each square on the grid, for clues directed down the grid. A space indicates that the square does not incorporate a downclue. |
"3, ,4, ","3, ,4, ","3, ,4, ","3, ,4, " |
|
cluesfirst (*clsfs) |
Array of index numbers to show which clue is the first in the list for a multi-word clue |
0,1,2,3,4 |
|
cluesnext (*clsnx) |
Array of index numbers to show which clue is next in the list for a multi-word clue, thus creating a linked list of words for each clue. If the next clue = the current clue, then this is the last part of the multi-part clue |
0,1,2,3,4 Note in this example, there are NO multi-part clues. |
|
clues (*clues) |
Array of strings that list the clues in the order they appear on the grid, across first, then down |
"Beatles' plea?","'tis seated backwards","Printer measures back north-east", "Say 'no to Potash' for security","Jumbled tale of the night" |
|
altclues (*aclue) |
Array of strings that list the alternate set of clues in the same order as the clues array |
"Give aid","Use seat","Print unit","Part of lock","Not on time" |
|
gridhints (*ghint) |
Array of strings that list the hints referring to the corresponding clues in the clues array |
"Beatles song","Reverse TIS","NE backwards","anagram: POTASH minus NO", "anagram: TALE. Night is this." |
|
gridexpl (*gexpl) |
Array of strings that list the explanations referring to the corresponding clues in the clues array |
"Beatles had record called HELP. Help is a plea.", "TIS backwards is SIT, which you do to get seated.", "NE backwards is EN, a measure of print", "remove NO from POTASH and rearrange to give HASP, part of a security lock mechanism", "TALE rearranged gives LATE, which is what night is." |
|
cluevert (*cvert) |
Array of values giving the vertical offset from the top of the first square for the clue represented by the given array value (e.g. 1st item refers to 1st clue, = 0 and is thus on top row). |
0,2,3,0,0 |
|
cluehoriz (*chorz) |
Array of values giving the horizontal offset from the left of the first square for the clue represented by the given array value (e.g. 1st item refers to 1st clue, = 0 and is thus in left column). |
0,0,2,0,2 |
|
firstdown (*fstdn) |
Array index no of the first clue that is directed ‘Down’. |
3 |
|
defshowerr (*sherr) |
Show user entry error as default? |
true |
|
defshowmain |
Show main set of clues rather than alternate set as default? |
true |
|
hovercolor |
Default colour to use when cursor hovers over a hyperlink |
red |
|
gridbgimage |
URL of image for grid frame background. Optional. |
ltblue.gif |
|
gridbgcolor |
Colour for grid frame background. Optional. |
lightskyblue |
|
outbgimage (*otbgi) |
URL of image for out background. Optional. |
ltblue.gif |
|
outbgcolor (*otbgc) |
Default background colour for unused squares (outs) on the grid. Optional. |
BLACK |
|
selcolor (*selcl) |
Colour to highlight cells when a clue is selected on the grid. |
LIME |
|
sqbgcolor (*sqbgc) |
Default background colour for a square that can contain a letter. |
lemonchiffon |
|
sqbgimage (*sqbgi) |
Default background image for a square that can contain a letter |
ltblue.gif |
|
rightcolor (*rtclr) |
Letter colour when correct |
BLUE |
| rightbold (*rtbld) | Is letter bold when correct? | True |
|
wrongcolor (*wrclr) |
Letter colour when incorrect |
RED |
| wrongbold (*wrbold) | Is letter bold when incorrect? | False |
|
cluebgimage |
URL of image for clues frame background. Optional. |
ltblue.gif |
|
cluebgcolor |
Colour for clues frame background. Optional. |
lightskyblue |
|
heading (*title) |
Heading to show in the top frame |
Sample Script |
|
subhead (*authr) |
Sub-heading to show in the top frame. Optional. |
Written by S.Huggins of Arctan Computer Ventures Ltd |
|
backref |
URL Reference to go back to previous page |
contents.htm |
|
homeref |
URL Reference to go to home page. |
http://www.simonhuggins.com/wppro/index.htm |
|
set1 (*set1) |
Text name for first set of clues |
Cryptic |
|
set2 (*set2) |
Text name for alternate set of clues. Optional. If omitted, the button will not be shown. Ensure that defshowmain reflect this. |
Straight |
|
showerrs (*sherr) |
Include show errors button? Can be true or false. |
true |
|
showhints (*shhnt) |
Include show hints button? Can be true or false |
true |
|
showexpl (*shexp) |
Include show explanations button? Can be true or false. |
true |
|
showclear |
Include clear grid button? Can be true or false. |
true |
|
topperc |
Top frame (title) % use of screen height |
20 |
|
botperc |
Bottom frame (entry) % use of screen height |
20 |
|
midperc |
Middle frame (split into grid and clues) % use of screen height |
60 |
|
leftperc |
Left frame (grid) % use of screen width |
70 |
|
rightperc |
Right frame (clues) % use of screen width |
30 |
|
noframes |
Message to display to user if browser is not frames-enabled. If left blank, a default message as shown in the example is used. |
Your browser does not support frames. Unfortunately, this puzzle requires frames. Please upgrade your browser. |
|
browserversn |
Minimum browser version that script requires to operate correctly |
4 |
Standard SUBST variables used in the HTML template...
Items marked (*intname) are system equivalents where intname is the keyword – i.e. hard-coded internal keywords that link to functionality within the WordPuzzle Pro application. Other keywords are defined for the individual report, and will have a report default.
|
Subst Name |
Purpose |
Sample |
|
copyright (*authr) |
Copyright Information |
COPYRIGHT 2001-4 Arctan Computer Ventures Ltd. All Rights Reserved. |
|
metadesc (*notes) |
Metaname Description (used by WWW search engines) |
Sample static HTML crossword for web deployment of crosswords designed with the WordPuzzle Pro puzzle creation and design tool. |
|
metakey |
Metaname keywords (used by WWW search engines) |
wordpuzzlepro, word, puzzle, pro, wordpuzzle, word puzzle, arctan, arctan computer ventures, arctan computer ventures ltd, crossword, cross word, cross-word, xword, education, educational, entertainment, interactive, grid, designer, design, tool, dtp, desktop publishing, desk top publishing, anagrams, vocabularly, word list, lexicon, graphics, html, jpeg, jpg, bitmap, bmp, quiz, test, generator, builder, creator, constructor, compiler, constructor, compilation |
|
title (*title) |
Document Title (appears in Window Frame) |
WordPuzzle Pro Sample Crossword |
|
blanksq (*blksq) |
Text with which to fill blank squares with / pad cells |
|
|
inclbars (*ibar) |
Include bars and their associated processing in this puzzle? |
True |
|
hovercolor |
Default colour to use when cursor hovers over a hyperlink |
red |
|
outbgimage (*otbgi) |
URL of image for out background. Optional. |
ltblue.gif |
|
outbgcolor (*otbgc) |
Default background colour for unused squares (outs) on the grid. Optional. |
BLACK |
|
sqbgimage (*sqbgi) |
Default background image for a square that can contain a letter |
ltblue.gif |
|
sqbgcolor (*sqbgc) |
Default background colour for a square that can contain a letter. |
lemonchiffon |
|
numcolor (*numcl) |
Colour of clue numbers | blue |
|
rightcolor (*rtclr) |
Letter colour on answers grid |
BLUE |
|
heading (*title) |
Heading to show at top of page. |
Sample Script |
|
subhead (*authr) |
Sub-heading to show at top of page. Optional. |
Written by S.Huggins of Arctan Computer Ventures Ltd |
|
backref |
URL Reference to go back to previous page |
contents.htm |
|
homeref |
URL Reference to go to home page. |
http://www.simonhuggins.com/wppro/index.htm |
|
set1 (*set1) |
Text name for first set of clues |
Cryptic |
|
set2 (*set2) |
Text name for alternate set of clues. Optional. |
Straight |
| showgrid | Show crossword grid? | True |
| showansgrid | Show second grid with answers in? | True |
| showletters | Show letters in first grid (answers)? | False |
| loopgridrow (*lpgdr) | Loop section for generating grid rows (<TR> tag) - will loop code within this section until all grid rows parsed | <<SECTION loopgridrow>> ...
<</SECTION>> |
| loopgridcol (*lpgdc) | Loop section for generating grid columns (sub loop of loopgridrows - <TD> tag) | <<SECTION loopgridcol>>
...
<</SECTION>> |
| loopgridchr (*lpgdh) | Character for loop grid square - i.e. for each of the loopgridcol sections, the value of this will change to show each letter on the grid | <<IFTRUE showletters>><<SUBST loopgridchr>><</IFTRUE>> |
| loopgridnum (*lpgdn) | Character for loop grid square - i.e. for each of the loopgridcol sections, the value of this will change to show the clue number for the given grid square, if applicable. | <<IFDEF loopgridnum>><sup><<IFDEF numcolor>><FONT COLOR=<<SUBST numcolor>>><<SUBST loopgridnum>></FONT><</IFDEF>></sup><</IFDEF>> |
| loopgridbardown (*lpgbd) | Bar at the bottom of the grid square in the given grid cell given by the current iteration of the loopgridrow/loopgridcol section combination? | <<IFDEF inclbars>><<IFTRUE loopgridbardown>> style='border-bottom: 4 solid <<SUBST barcolor>>;'<</IFTRUE>> <</IFDEF>> |
| loopgridbaracross (*lpgba) | Bar at the right of the grid square in the given grid cell given by the current iteration of the loopgridrow/loopgridcol section combination? | <<IFDEF inclbars>><<IFTRUE loopgridbaracross>> style='border-right: 4 solid <<SUBST barcolor>>;;'<</IFTRUE>> <</IFDEF>> |
| loopclueacross (*lpcla) | Loop section for generating across clues - Hold the actual clue, which changes for each iteration loop around the section | <<SECTION loopclueacross>> <tr> <td><<SUBST loopcluenumacross>></td> <td><<SUBST loopclueacross>></td> <td><<SUBST loopcluesizeacross>></td> </tr><</SECTION>> |
| loopcluedown (*lpcld) | Loop section for generating down clues - Hold the actual clue, which changes for each iteration loop around the section | <<SECTION loopcluedown>>
<tr> <td><<SUBST loopcluenumdown>></td> <td><<SUBST loopcluedown>></td> <td><<SUBST loopcluesizedown>></td> </tr><</SECTION>> |
| loopcluenumacross (*lpcna) | Loop variable for across clue number - changes with each iteration of loopclueacross SECTION | <td><<SUBST loopcluenumacross>></td> |
| loopcluenumdown (*lpcnd) | Loop variable for down clue number - changes with each iteration of loopcluedown SECTION | <td><<SUBST loopcluenumdown>></td> |
| loopcluesizeacross (*lpcsa) | Loop variable for across clue size - changes with each iteration of loopclueacross SECTION | <td><<SUBST loopcluesizeacross>></td> |
| loopcluesizedown (*lpcsd) | Loop variable for down clue size - changes with each iteration of loopcluedown SECTION | <td><<SUBST loopcluesizedown>></td> |
| loopcluehintacross (*lpcha) | Loop variable for across hint text - changes with each iteration of loopclueacross SECTION | <<SECTION loopclueacross>> <tr> <td><<SUBST loopcluenumacross>></td> <td><<SUBST loopcluehintacross>></td> </tr><</SECTION>> |
| loopcluehintdown (*lpchd) | Loop variable for down hint text - changes with each iteration of loopcluedown SECTION | <<SECTION loopcluedown>> <tr> <td><<SUBST loopcluenumdown>></td> <td><<SUBST loopcluehintdown>></td> </tr><</SECTION>> |
| loopclueexplacross (*lpcxa) | Loop variable for across explanation text - changes with each iteration of loopclueacross SECTION | <<SECTION loopclueacross>> <tr> <td><<SUBST loopcluenumacross>></td> <td><<SUBST loopclueexplacross>></td> </tr><</SECTION>> |
| loopclueexpldown (*lpcxd) | Loop variable for down explanation text - changes with each iteration of loopcluedown SECTION | <<SECTION loopcluedown>> <tr> <td><<SUBST loopcluenumdown>></td> <td><<SUBST loopclueexpldown>></td> </tr><</SECTION>> |
| loopaltclueacross (*lpala) | Loop variable for alternate across clue text - changes with each iteration of loopclueacross SECTION | <<SECTION
loopaltclueacross>> <tr> <td><<SUBST loopcluenumacross>></td> <td><<SUBST loopaltclueacross>></td> <td><<SUBST loopcluesizeacross>></td> </tr><</SECTION>> |
| loopaltcluedown (*lpald) | Loop variable for alternate down clue text - changes with each iteration of loopcluedown SECTION | <<SECTION loopaltcluedown>> <tr> <td><<SUBST loopcluenumdown>></td> <td><<SUBST loopaltcluedown>></td> <td><<SUBST loopcluesizedown>></td> </tr><</SECTION>> |
| barcolor (*barcl) | Colour of any bars in the grid | <<IFTRUE loopgridbaracross>> style='border-right: 4 solid <<SUBST barcolor>>; border-bottom: 4 solid <<SUBST barcolor>>;'<</IFTRUE>> |
| showhints (*shhnt) | Show hints section? | <<IFTRUE showhints>> ... <</IFTRUE>> |
| showexpl (*shexp) | Show explanations section? | <<IFTRUE showexpl>> ... <</IFTRUE>> |
|
pagebgimage |
URL of image for general background. Optional. |
ltblue.gif |
|
pagebgcolor |
Colour for general background. Optional. |
#B5B5FF |
|
set1bgimage |
URL of background image for first set of clues |
ltblue.gif |
|
set1bgcolor |
Background colour for first set of clues |
#C6FFC6 |
|
set2bgimage |
URL of background image for second set of clues |
ltblue.gif |
|
set2bgcolor |
Background colour for second set of clues |
#C6FFC6 |
|
hintbgimage |
URL of background image for hints table |
ltblue.gif |
|
hintbgcolor |
Background colour for hints table |
#C6FFC6 |
|
explbgimage |
URL of background image for explanations table |
ltblue.gif |
|
explbgcolor |
Background colour for explanations table |
#C6FFC6 |
These lists are not exhaustive, but aim to give a general idea of how a WebScript is structured.
(c) Copyright 2000-1
Arctan Computer Ventures
Ltd. All Rights Reserved.
If you have any issues regarding this on-line help, please contact the
author by clicking here.
This Page was last updated: 29 January 2004 13:08