Adding BLING to green screens

It was my pleasure to present a talk at this year’s Process World conference in Orlando, Florida. The subject of my talk was adding “Bling” to old green screen user interfaces.
Over the next couple of weeks I will post the programs I utilized along with brief dialogue. Please feel free to contribute your own ideas.

The first set of programs show how to transform a rather dull green screen INPUT statement into a screen that looks a lot more like web based screens, that is, more BLING.

We will start off with a very simple INPUT statement.

DEFINE DATA LOCAL
1 #LAST-NAME (A20)
1 #FIRST-NAME (A20)
1 #ADDRESS-LINE1 (A50)
1 #ADDRESS-LINE2 (A50)
1 #CITY (A20)
1 #STATE (A2)
1 #ZIP (A10)
END-DEFINE
INPUT (AD=M) 3/10
‘LAST NAME ==>’ #LAST-NAME / 10T ‘FIRST-NAME==>’ #FIRST-NAME
/ / 10T ‘ADDRESS LINE 1:’ #ADDRESS-LINE1 / 10T ‘ADDRESS-LINE 2:’ #ADDRESS-LINE2
/ 10T ‘CITY==>’ #CITY 5X ‘STATE==>’ #STATE 5X ‘ZIP + 4==>’ #ZIP
END
If you run the program above you will see a typical “green screen” user interface.
In the next program we add some reverse video and color.

DEFINE DATA LOCAL
1 #LAST-NAME (A20)
1 #FIRST-NAME (A20)
1 #ADDRESS-LINE1 (A50)
1 #ADDRESS-LINE2 (A50)
1 #CITY (A20)
1 #STATE (A2)
1 #ZIP (A10)
END-DEFINE
INPUT (AD=MV CD=YE) 3/10
‘LAST NAME ==>’ #LAST-NAME / 10T ‘FIRST-NAME==>’ #FIRST-NAME
/ / 10T ‘ADDRESS LINE 1:’ #ADDRESS-LINE1 / 10T ‘ADDRESS-LINE 2:’ #ADDRESS-LINE2
/ 10T ‘CITY==>’ #CITY 5X ‘STATE==>’ #STATE 5X ‘ZIP + 4==>’ #ZIP
END

Run the program above. Better yet, let an enduser run both of the programs above. My guess is that they will prefer the second program.

Okay, time to get fancy. In the following program I have added a “background”, then used an INPUT NO ERASE statement to overlay the background.

DEFINE DATA LOCAL
1 #LAST-NAME (A20)
1 #FIRST-NAME (A20)
1 #ADDRESS-LINE1 (A50)
1 #ADDRESS-LINE2 (A50)
1 #CITY (A20)
1 #STATE (A2)
1 #ZIP (A10)
1 #BACKGROUND (A75)
END-DEFINE
**
SET CONTROL ‘N’
**
WRITE NOTITLE (AD=V CD=TU) 2/4 #BACKGROUND / 4T #BACKGROUND / 4T #BACKGROUND
/ 4T #BACKGROUND / 4T #BACKGROUND / 4T #BACKGROUND
/ 4T #BACKGROUND / 4T #BACKGROUND / 4T #BACKGROUND
INPUT NO ERASE (AD=MV CD=BL) 3/10
‘LAST NAME ==>’ #LAST-NAME / 10T ‘FIRST-NAME==>’ #FIRST-NAME
/ / 10T ‘ADDRESS LINE 1:’ #ADDRESS-LINE1 / 10T ‘ADDRESS-LINE 2:’ #ADDRESS-LINE2
/ 10T ‘CITY==>’ #CITY 2X ‘STATE==>’ #STATE 2X ‘ZIP + 4==>’ #ZIP
END

Now we are getting somewhere. Please note that the “background” does not have to be all the same color. The WRITE statement could have color specified at the field level rather than the statement level. For example:
WRITE NOTITLE (AD=V CD=TU) 2/4 #BACKGROUND / 4T #BACKGROUND / 4T #BACKGROUND /
4T #BACKGROUND / 4T #BACKGROUND (CD=GR) / 4T #BACKGROUND (CD=GR)
/ 4T #BACKGROUND / 4T #BACKGROUND (CD=RE)/ 4T #BACKGROUND

Okay, that is getting pretty garish. But realize that it might be quite useful to have logically distinct groups of fields presented with unique color backgrounds.
The point is that it is quite trivial to add Bling to old green screens and create screens that look more up to date (more like web type screens).

Spreadsheet vs Barchart

If there is anything that typifies “green screen output” it is spreadsheet printouts such as created in the program below:

DEFINE DATA LOCAL
1 #PARTS (A8/1:5) INIT <‘NUTS’,‘BOLTS’,‘SCREWS’,‘NAILS’,‘TACKS’>
1 #YEARLY-SALES (N6/1:5,1:5) INIT
(1,V) <4234,6920,7712,5812,8204>
(2,V) <5112,5376,5538,5812,6173>
(3,V) <4800,5555,4906,5034,5217>
(4,V) <6825,6944,7712,7387,8114>
(5,V) <7812,7532,7162,6439,5826>
1 #PART-SUB (I2)
1 #YEAR-SUB (I2)
1 #YEAR-START (N4/1:5) INIT <2004>
END-DEFINE
**
FOR #YEAR-SUB = 2 TO 5
COMPUTE #YEAR-START (#YEAR-SUB) = 1 + #YEAR-START (#YEAR-SUB - 1)
END-FOR
**
WRITE 13X #YEAR-START (1) 3X #YEAR-START (2) 3X #YEAR-START (3) 3X #YEAR-START (4) 3X #YEAR-START (5)
/ 14X ‘----’ 4X ‘----’ 4X ‘----’ 4X ‘----’ 4X ‘----’
FOR #PART-SUB = 1 TO 5
WRITE 3T #PARTS (#PART-SUB) #YEARLY-SALES (#PART-SUB,1:5)
END-FOR
END
A couple of notes. Yes, I could have INIT’ed the array #YEAR-START. I was cut and pasting from another program. As noted above, I view the output of this program as typical “green screen”.

Now take a look at the following program and then run it.

DEFINE DATA LOCAL
1 #PARTS (A6/1:5) INIT <‘NUTS’,‘BOLTS’,‘SCREWS’,‘NAILS’,‘TACKS’>
1 #YEARLY-SALES (N4/1:5,1:5) INIT
(1,V) <4234,6920,7712,5812,8204>
(2,V) <5112,5376,5538,5812,6173>
(3,V) <4800,5555,4906,5034,5217>
(4,V) <6825,6944,7712,7387,8114>
(5,V) <7812,7532,7162,6439,5826>
1 #PART-SUB (I2)
1 #YEAR-SUB (I2)
1 #YEAR-START (N4/1:5) INIT <2004>
1 #TOTAL-PARTS (N6/1:5)
1 #YEAR-BAR (N3/1:5)
1 #YEAR1 (N2)
1 #BAR-OUT (A60)
1 REDEFINE #BAR-OUT
2 #YEAR-BAR-SUB (A1/1:60)
1 #BAR-OUT2 (A60)
1 REDEFINE #BAR-OUT2
2 #YEAR-BAR-SUB2 (A1/1:60)
END-DEFINE
**
** LOOP BELOW JUST INITIALIZES THE YEAR HEADERS. YES, I COULD HAVE INIT’ED IT.
** HOWEVER, THE START YEAR MIGHT BE A PARAMETER PASSED WITH A CALLNAT.
**
FOR #YEAR-SUB = 2 TO 5
COMPUTE #YEAR-START (#YEAR-SUB) = 1 + #YEAR-START (#YEAR-SUB - 1)
END-FOR
**
FOR #PART-SUB = 1 TO 5
ADD #YEARLY-SALES (#PART-SUB,) TO #TOTAL-PARTS (#PART-SUB)
/
FOR EACH PART, GET THE 5 YEAR TOTAL
COMPUTE #YEAR-BAR (1) = (#YEARLY-SALES (#PART-SUB,1) * 60) / #TOTAL-PARTS (#PART-SUB)
/* WIDTH OF BAR
FOR #YEAR-SUB = 2 TO 5
COMPUTE #YEAR-BAR (#YEAR-SUB) = #YEAR-BAR (#YEAR-SUB - 1) +
(#YEARLY-SALES (#PART-SUB,#YEAR-SUB) * 60) / #TOTAL-PARTS (#PART-SUB)
END-FOR
**
MOVE #YEAR-BAR (1) TO #YEAR1
MOVE #YEAR-START (1) TO SUBSTRING (#BAR-OUT,1,4)
MOVE #YEARLY-SALES (#PART-SUB,1) TO SUBSTRING (#BAR-OUT2,1,4)
MOVE ‘@’ TO #YEAR-BAR-SUB (#YEAR1)
MOVE ‘@’ TO #YEAR-BAR-SUB2 (#YEAR1)
**
ADD 1 TO #YEAR1
MOVE #YEAR-START (2) TO SUBSTRING (#BAR-OUT,#YEAR1,4)
ADD 1 TO #YEAR-BAR (1)
MOVE #YEARLY-SALES (#PART-SUB,2) TO SUBSTRING (#BAR-OUT2,#YEAR-BAR (1),4)
MOVE #YEAR-BAR (2) TO #YEAR1
MOVE ‘#’ TO #YEAR-BAR-SUB (#YEAR1)
MOVE ‘#’ TO #YEAR-BAR-SUB2 (#YEAR1)
**
ADD 1 TO #YEAR1
ADD 1 TO #YEAR-BAR (2)
MOVE #YEAR-START (3) TO SUBSTRING (#BAR-OUT,#YEAR1,4)
MOVE #YEAR-BAR (3) TO #YEAR1
MOVE #YEARLY-SALES (#PART-SUB,3) TO SUBSTRING (#BAR-OUT2,#YEAR-BAR (2),4)
MOVE ‘$’ TO #YEAR-BAR-SUB (#YEAR1)
MOVE ‘$’ TO #YEAR-BAR-SUB2 (#YEAR1)
**
ADD 1 TO #YEAR1
ADD 1 TO #YEAR-BAR (3)
MOVE #YEAR-START (4) TO SUBSTRING (#BAR-OUT,#YEAR1,4)
MOVE #YEAR-BAR (4) TO #YEAR1
MOVE #YEARLY-SALES (#PART-SUB,4) TO SUBSTRING (#BAR-OUT2,#YEAR-BAR (3),4)
MOVE ‘%’ TO #YEAR-BAR-SUB (#YEAR1)
MOVE ‘%’ TO #YEAR-BAR-SUB2 (#YEAR1)
**
ADD 1 TO #YEAR1
ADD 1 TO #YEAR-BAR (4)
MOVE #YEAR-START (5) TO SUBSTRING (#BAR-OUT,#YEAR1,4)
MOVE #YEARLY-SALES (#PART-SUB,5) TO SUBSTRING (#BAR-OUT2,#YEAR-BAR (4),4)
MOVE #YEAR-BAR (5) TO #YEAR1
MOVE ‘&’ TO #YEAR-BAR-SUB (#YEAR1)
MOVE ‘&’ TO #YEAR-BAR-SUB2 (#YEAR1)
**
WRITE NOTITLE 5X #PARTS (#PART-SUB) 2X #BAR-OUT (AD=V CD=BL
DY=@VGR#VPI$VRE%VNE&NBL*) ‘YEAR’ /
WRITE 14T #BAR-OUT2 (AD=V CD=BL DY=@VGR#VPI$VRE%VNE&NBL*) ‘SALES’ //
RESET #BAR-OUT #BAR-OUT2
END-FOR
END

Some comments. Yes, I could have done this with implicit rather than explicit subscripts. The code would have been shorter, but not as readable.
There are many, many variations on this code that might be more appropriate for a given scenario. Some are “cosmetic”. For example, you might put SALES above YEAR. Then, you might have YEAR centered rather than left justified, the same for SALES. Having YEAR not reverse video is perhaps easier to read, but this is quite subjective.
I do not have code to deal with small widths. That is, suppose one product, for a given year, has SALES such that the width of the bar would be less than four. What happens to YEAR? Of course I could have a two digit year. But what if the width would be one? Do I make two the minimum width? There are lots of possibilities. They are not hard to code.
Should the “scale factor” from product to product be the same or different? Again, this would be dependent on the use of the chart. Will it be used to “track” the change in a given product’s sales, or to compare sales inter product? Once again, the endusers should provide the input to dictate design.

As with the last program set (background for INPUT screens) please contribute your code for similar functionality.