## SMDE Components

The SMDE is composed of a number SM32 programs designed to help SM32 programmers develope GUI aplications. The source to these programs is available so the SMDE can be easily modified/extended. The SMDE can be divided into the following components:
Console View:The program "$__BEDIT" controls keyboard input and handles the SMDE menu bar.(see Console - Need To Know and ENTITY in the Programmers Reference Manual).
Developement Utilities - "Load Html", "Create Distribution", "Menu Builder" and "Toolbar Builder".
Programmer Tools - A number tools like search, cross reference ect.
Supplied Subroutines - A number of ready to use callable SM32 Programs.

## GUI Developement Procees

The basic development flow is as follows:
1. Write a BB program as normal for example called MYMAIN.
2. When your program needs user input create an appropriate HTML document for example MYDOC.HTML
3. Run the Load Html utility creating a program called for example DISPLAY_MYDOC
4. Modify DISPLAY_MYDOC to support any required run time data.
5. Back in MYMAIN CALL "DISPLAY_MYDOC" with your run time data. DISPLAY_MYDOC returns with user input.
6. Go to 1.
7. When your application is finished run the Create Distribution utility to create a release version.

## SMDE Dependencies

The environment depends on a few things
SendDocumentDone: SendDocumentDone mode must be turned on. This is done for you in $__SETUP at startup time.
    140 DIM K![32,256]
    145 LET K!["type"]="SendDocumentDone"
    150 LET K!["State"]="On"
    155 REM "Turn On Document Complete Mode"
    160 WRITE GUI K![ALL]
POST METHOD Forms use the POST METHOD.
    <FORM ACTION="FORMIN" METHOD="POST">
Directories:
Purpose | Description
--- | ---
Programs | All programms created by the SMDE are created in Disk 0
Temporary Files Directory | ETBL("tdir") CONFIG("system","tempdir") This directory holds the HTML directory and the HTML\IMAGES directory. The distributed configuration has the "Root of Temporary Directory" on the Disk I/O page set to "tmp". This causes SM32 to Create/Use the directory tmp/T_XXXX (where XXXX is an instance of SM32) under the Start in directory. For example if the start in directory is C:\SM32\TEST then the first execution of SM32 would get: C:\SM32\TEST\tmp\T_0000 set in CONFIG("system","tempdir") The second execution of SM32 would get: C:\SM32\TEST\tmp\T_0001 set in CONFIG("system","tempdir") These directories are created if they do not exist.
Linux-Windows Shared Data | ETBL("rcalldir") CONFIG("system","rcalldir") This directory is used to hold large blobs of data for transfer between LINUX and Windows RCALL'ed programs. Since the utilities are used for both Linux and Windows even when a RCALL that is not really an RCALL (RPM is set to 2) data is still plaed in this directory. On a single user Windows or Fat Client Windows normally ETBL("tdir") = ETBL("rcalldir"). On a Linux ETBL("tdir") = ETBL("rcalldir") while the thin client Windows will be the Linux ETBL("rcalldir") with a ROUTE of <0>

UPPER Case Filenames
Filename Translation: All SMDE programs are UPPER case. So the configuration can be set to NO translation or tranlate to UPPER CASE.

## Loading HTML into the Display Program - $__EMPTY

Information on running the Load Html utility can be found by running the utility:

    You can start the utility by:
    from the keyboard     >util
    then click GO for Load HTML into Program
               OR
    from the keyboard     >util html
               OR
    Under the utility menu choose Load Html

    Then press choose Info on This Utility
    and a POP-UP help appears.

The process of loading the HTML is quite simple. The dirty work can be seen in program $__HTML_TO_PROG. It is important you choose a prefix rather than force the program name. This allows you to use the Load All feature. From the above example names: MYDOC.HTML,DISPLAY_ as prefix:
The first time you Load Html for MYDOC.HTML the program $__EMPTY is used as the template. Its line 10 is changed to:
10 REM "DISPLAY_MYDOC"
Lines 80000->8xxxx are used to store you html.
The 2nd and subsequent times you Load Html for MYDOC.HTML only the lines 80000->8xxxx of DISPLAY_MYDOC are changed. Note: You can add something to $__EMPTY and it will appear in all your generated display programs.
The rest of this section explains what the user needs to know about the programs based on $__EMPTY. The line #'s may not be exact as features are added to $__EMPTY.

    130 ENTER P![ALL]
    Add variable(s) to pass in run time data

    150 CALL GET_HTML,A$
    155 LET A$=DCMP(A$)
    The above 2 lines place what was your complete html file into A$.
    165 GOSUB 4000

    4000 REM 4000,5
    4005 REM "A$ - contains the complete HTML file that is about to be displayed"
    4010 REM "SO you could do something like:"
    4015 REM "P=POS("????-1")"
    4020 REM "a$=a$(1,p-1)+RD$+a$(p+6)"
    4025 REM " where RD$ is some Run Time Data that got passed in the ENTER"
    4490 REM 4490,5
    4495 RETURN
    Modify subroutine 4000 with your Run Time Data see D_DEMO2

    315 LET TEMP$=DIR(-1)+"HTML\TEMP.HTML"
    320 ERASE TEMP$,ERR=.+1
    325 STRING TEMP$,-1
    330 LET U=UNT
    335 OPEN (U,ISZ=LEN(A$))TEMP$
    340 WRITE RECORD(U)A$
    345 CLOSE (U)
    350 LET A$=""
    A$ is copied to HTML\TEMP.HTML

    415 DIM K![32,256]
    420 LET K!["type"]="Navigate2"
    425 LET K!["url"]=TEMP$
    435 WRITE GUI K![ALL]
    440 READ GUI(0)K![ALL]
    445 IF K!["type"]<>"before navigate" THEN ESCAPE
    450 DIM K![32,256]
    455 LET K!["type"]="Go"
    465 WRITE GUI K![ALL]
    470 DIM K![32,256]
    480 READ GUI(0)K![ALL]
    485 IF K!["type"]<>"DocumentComplete" THEN ESCAPE
    Your document is now displayed.

    490 GOSUB 5000
    5000 REM 5000,5
    5005 REM "It is now safe to change HTML elements"
    5010 REM "So you can call SET_ID_HTML with run time data"
    5490 REM 5490,5
    5495 RETURN
    If you didn't use 4000
    Modify subroutine 5000 with your Run Time Data see D_DEMO3

    510 WAIT_INPUT:
    515 DIM K![32,256]
    520 READ GUI(0,END=.+1)K![ALL];GOTO 0545
    Wait for user input

    600 GOSUB 6000;REM "Add non posted data to P!"
    6000 REM 6000,5
    6005 REM "If the HTML is not a form you can still return data "
    6010 REM "by call GET_ID_HTML and pulling the data out"
    6490 REM 6490,5
    6495 RETURN
    Add Return Data to P!

## Getting Control Back

User input that would normally cause Internet Explorer to display a new page will instead return control to your calling program. This is because under SM32 before Internet Explorer displays any page it asks permission to do so. Once your page is loaded, the Load HTML program (based on $__EMPTY) will disallow any request to go to a new page. The data that would normally go to the server (and more) is available to your program. Since you never actually go to a new page the name that would be the url can be your own cryptic value. Such as:

    <a HREF="DO_XYZ">Click Here to do XYZ</a>
    <BUTTON onclick="location.replace('HANDLE_BUTTON1')">Button 1</button>
    <FORM ACTION="FORMIN" METHOD="POST">

On return P! contains
P!["url"]= | Description
--- | ---
"Menu Selected" | This occurs when your Web View has a Menu and a Menu Item has been Selected P!["Menu Item"]=STR(A) Where A is the Menu Item #
"Dialog Cancelled" | This occurs when your Document is in a Dialog Box and the user has hit the close (X in upper right)
A url destination. This could be the ACTION= from a FORM. Or the HREF= from an Anchor tag. | This is the normal case. P! will also contain any POSTED form data

Back to the start of the program. On entry P!["FLAG"] can contain a flag . Currently there are 2 flags.
P!["FLAG"]="NoDisplay"
Leave document on screen as is and wait for another input.
See DEMO1 - uses this to ignore the enter key from a text box.
P!["FLAG"]="JustDisplay"
The program does not wait for user input. It exits as soon as the Document is displayed. And returns:
P!["url"]="JustDisplay"
See DEMO10 - Just displays and prints the document.

## Creating a Release Version

Information on running the Create Distribution utility can be found by running the utility:

    You can start the utility by:
    from the keyboard     >util
    then click GO for Create Distribution Files
               OR
    from the keyboard     >util distrib
               OR
    Under the utility menu choose Create Distribution
    Then press choose Info on This Utility
    and a POP-UP help appears.

The pop up explains most of what you need to know. In the Configuration file a flag is added that can be used if your code needs to know if it is running the release version.

    165 LET K![ALL]=CONFIG
    170 IF K!["system  release"]="1" THEN do something

## Supplied Subroutines

Program $__EMPTY provides the following subroutines:
CALL GET_ID_HTML,ID$,A$
Return the HTML code segment associated with ID$ in A$.
CALL SET_ID_HTML,ID$,A$
Replaces the HTML code segment associated with ID$ with the HTML in A$
CALL GET_POSTED_DATA,P$,P![ALL]
Extracts posted data from P$ into P![ALL]
Program $__DIALOG
CALL "$__DIALOG",-1,-1,600,400,"My Dialog"
Creates a Modal Dialog box 600 * 400 pixels centered over the current window and titled "My Dialog". Subsequent READ/WRITE GUI commands are directed to the dialog box.

CALL "$__DIALOG",X,Y,W,H,T$
X | Position in pixels from the left side of the screen
Y | Position in pixels from the top of the screen
W | Width in pixels
H | Height in pixels
T$ | Dialog Window Title

If X and Y = -1 the dialog box is centered.
NOTE:
Since dialog boxes are of fixed size you will probably want to force your HTML content to have a fixed size also, Using HTML syntax such as:

    STYLE="font-size: 12px"

Program $__IFRAME_DIALOG
CALL "$__IFRAME_DIALOG",-1,-1,600,400,"My Iframe Dialog"
The parameters are the same as $__DIALOG. Creates a floating frame that fills the dialog box. Its width is W-25 and its height is H-55. The frame name is "IF" which must be specified in your display program. You may just want to use $__IFRAME_DIALOG as a template for your own program. See Demo 6.
Program $__ENDDIALOG
CALL "$__ENDDIALOG",""
Closes the current Dialog Box.
Program $__BROWSE
CALL "$__BROWSE",TITLE$,BUTTON$,FILTER$,D$,F$,FLAG$

TITLE$ = | The dialog box title
BUTTON$ = | The name to appear on the action button (SAVE,LOAD,OPEN)
FILTER$ = | A user supplied File Name Filter or "" for no Filter $__BROWSE does a CALL FILTER$,F$ if F$="" on return that name is excluded.
D$ = | The Directory to start browsing in
F$ = | A default filename for the user to select
FLAG$ = | "D" a directory can be selected

$__BROWSE uses the following icons
| Directory
| Program Library
| Program
| Indexed File
| Sort File
| Direct File
| Serial File
| Mkeyed File
| Link File
| Pipe File
| SM32 Configuration File
| String or other non SM32 File
| File is Locked (type unknown)

Program $__MESSAGEBOX
CALL "$__MESSAGEBOX",TITLE$,MESSAGE$,O$,R,C$

TITLE$ = | The dialog box title
MESSAGE$ = | The message that appears in the Box
O$ = |
O$(1,1)
"0" - The message box contains three push buttons: Abort, Retry, and Ignore
"1" - The message box contains one push button: OK. This is the default if 0$=""
"2" - The message box contains two push buttons: OK and Cancel
"3" - The message box contains two push buttons: Retry and Cancel
"4" - The message box contains two push buttons: Yes and No
"5" - The message box contains three push buttons: Yes, No, and Cancel.
O$(2,1)
" " or LEN(O$) < 2 - No icon symbol appears in box.
"0" - An exclamation-point icon appears in the message box.
"1" - An icon consisting of a lowercase letter i in a circle appears in the message box
"2" - A question-mark icon appears in the message box.
"3" - A stop-sign icon appears in the message box.
O$(3,1)
" " or LEN(O$) < 3 - The first button is the default button.
"0" - The first button is the default button.
"1" - The second button is the default button.
"2" - The third button is the default button.
R = |
Return Value
0 - Abort button was selected.
1 - Cancel button was selected.
2 - Ignore button was selected.
3 - No button was selected.
4 - OK button was selected.
5 - Retry button was selected.
6 - Yes button was selected.
C$ = |
12 Byte RGB Background/Foreground Color String
"" is equivalent to "buttonface000000" (black on Grey)
if len(C$)=6 "FFFFFF" (white on something) is added

$__MESSAGEBOX is a replacement for:
PRINT 'EE','MESSAGEBOX'(TITLE$,MESSAGE$,O$),R,'BE',
with the addition of changing the background color and the text color.
Depending on the contents of the of MESSAGE$ (perhaps it contains some HTML tags) the Dialog Box size calculation can fail. You can over ride the size calcution by calling "$__MBOX" in stead of "$__MESSAGEBOX".
CALL "$__MBOX" X,Y,W,H,TITLE$,MESSAGE$,O$,R,C$
Where X,Y,W,H,TITLE$ are the parameters to "$__DIALOG"
Program $__QBOX
CALL "$__QBOX",S$[ALL],S
The Question Box Program creates a Form with number of text input boxes to be completed by the user. S is the number of text input boxes required.
S$[ALL] is a string array of size S. (DIM S$[S])
On Input
S$[0] can contain 4 sub strings:The Dialog Title,A User Message, Text Color and Background Color.
If there is no Text Color it defaults to BLACK and if there is no Background Color it defaults to buttonface (gray). The sub strings are $00$ separated.
S$[1] -> S$[S] each contain 4 "," separated substrings: The Name of the text input box, the iniatial contents of the text input box, the size of the text input box and the maximum len of the input.
On Output
S$[0] contains "OK" or "CANCEL"
if S$[0] contains "OK" then: S$[1] -> S$[S] contain text input box value.
The following program:

    10 BEGIN
    20 DIM S$[3]
    30 LET S$[0]="Dialog Title"+$00$+"Message to User"+$00$+"WHITE"+$00$+"787878"
    40 LET S$[1]="Question 1:,Value 1,10,30"
    50 LET S$[2]="Question 2:,Value 2,20,20"
    60 LET S$[3]="Question 3:,Value 3,40,100"
    70 CALL "$__QBOX",S$[ALL],3
    80 IF S$[0]<>"OK" THEN GOTO 0120
    90 FOR I=0 TO 3
    100 PRINT S$[I]
    110 NEXT I
    120 END

Will Produce the following Dialog Box:
The following program:

    10 BEGIN
    20 DIM S$[2]
    30 LET S$[0]="Name Input"+$00$+"Please Enter your Full Name"
    40 LET S$[1]="First Name:,,20,50"
    50 LET S$[2]="Last Name:,,20,50"
    60 CALL "$__QBOX",S$[ALL],2
    70 IF S$[0]<>"OK" THEN GOTO 0090
    80 PRINT S$[1]," ",S$[2]
    90 END

Will Produce the following Dialog Box:
Program $__GETFONTS
CALL "$__GETFONTS",A$,A
Returns the available fonts for use with the RTF Printer. A is the channel to an open RTF Printer or if A=0 "LP" is used. The fonts are returned in A$, separated by ";"'s