such changes of state are to be expressed in an
implementation computer language (Ratcliff, 1994,
Jacky, 1997, Derrick, 2001).
In operation refinement the process of
conversions of descriptions of state changes can be
carried into executable instruction sequences.
4 CONTROL STRUCTURES
All programs can be written in terms of only three
control structures, namely the sequence structure,
the selection structure and the repetition structure.
The if structure is called a single-selection structure,
because it selects or ignores a single action. The
if/else structure is called a double-selection
structure, because it selects between two different
actions (or groups of actions) (Deitel, 2002).
5 THE CAR1 EXAMPLE
In brief, in the Car1 example, the information of 6
cars is given in an XML document car1.xml. This
information is used to display the Web site
demonstrated in Figure 2. The make, model number,
year, price and picture of each car are given. The
price of some cars is more than R200000.00 and
some are less. The user can choose either one to get
a display of the make, model number, year and price
for the relevant cars. This if selection structure in the
JavaScript program constitutes the crux of the
discussion regarding the refinement of the
specifications of the programs.
6 Z SPECIFICATIONS
Basic types, sets, data, constants, choices and
messages: Basic types (given sets):
[MAKE, MODEL, YEAR, PRICE, IMAGE, X]
Refer to figures 1. The following are these sets:
X = {01, 02, 03, 04, 05, 06} e N This represents
the record counter for the data.
MAKE = {(01, Peugeot), (02, Audi), (03, Citroën),
(04, Mazda), (05, Mercedes), (06, Mercedes)} e X
ß MAKE
MODEL = {(01, 307CC), (02, A6), (03, C5), (04,
1.6), (05, E-class), (06, SLRMcLaren)} e X ß
MODEL
YEAR = {(01, 2004), (02, 2004), (03, 2004), (04,
2004), (05, 2002), (06, 2004)} e X ß YEAR
PRICE = {(01, 250000.00), (02, 340000.00), (03,
150000.00), (04, 170000.00), (05, 540000.00), (06,
640000.00)} e X ß PRICE
IMAGE = {(01, car(01).jpg), (02, car(02).jpg), (03,
car(03).jpg), (04, car(04).jpg), (05, car(05).jpg), (06,
car(06).jpg)} e X ß IMAGE
STR::= Price| Year| Model| Over| Under; N: Natural
numbers; ∅: Empty set; maxSize: N; n: N The
number of cars. For this example n = 6.
Table 1: Car1 data file (given in car1.xml).
X
(recor
d
counte
r)
make model year img price
01 Peugeot 307CC 2004 car(01).jpg 2500
00.0
02 Audi A6 2004 car(02).jpg 3400
00.0
03 Citroën C5 2004 car(03).jpg 1500
00.0
04 Mazda 1.6 2004 car(04).jpg 1700
00.0
05 Mercedes E-class 2002 car(05).jpg 5400
00.0
06 Mercedes SLRMcLaren 2004 car(06).jpg 6400
00.0
»_Car_System
_________________
___
ƻ____________________
ÆÆcar1.html (User Interface)
ÆÆcar1.js; car1.xml; car1.xsd
Æ–____________________
–__________________________
Figure 1a: The Z Car system.
»_car1.html
__________________
___
ÆDisplay Welcome page; On click: car1.js [Detail of this
Æspecification not relevant to the discussion]
–__________________________
Figure 1b: The Car1.html file (User Interface).
»_car1.xml_____________________
Æx: P X [X is not a field in the record, it is used
Æonly in the schema as a record counter]
Æmake: Xß MAKE; model: Xß MODEL;
Æyear: Xß YEAR; img: Xß IMAGE;
Æprice: Xß PRICE; n: N; car1.xsd;
«_______________
Æ (x = dom make; dom model; dom year; dom
Æ img; dom price); n = 6
–__________________________
Figure 1c: car1.xml.
»_car1.xsd_____________________
Æ X car1.xml
Æ[Information not relevant to the discussion of this paper]
–__________________________
Figure 1d: car1.xsd.
WEBIST 2006 - INTERNET TECHNOLOGY
90