#! /usr/local/bin/gforth include cgi.f \ canvas: /floral.png \ canvas: /fossil.png \ canvas: /gnome.jpg \ canvas: /green_weave.png \ canvas: /ice.png \ canvas: /manila_paper.png \ canvas: /moss_ridge.png \ canvas: /numbers.png \ canvas: /ocean_stripes.png \ canvas: /purple_marble.png \ canvas: /ridged_paper.png \ canvas: /rough_paper.png \ canvas: /sky_ridge.png \ canvas: /snow_ridge.png \ canvas: /stucco.jpg \ canvas: /countertop.png \ canvas: /brushed_metal.png \ canvas: /burlap.jpg \ canvas: /countertop.png \ canvas: /dark-gnome.jpg \ canvas: /dots.png \ canvas: /fibers.png \ canvas: /purple_marble.png \ canvas: /chalk.jpg \ canvas: /fleur_de_lis.png \ canvas: /rough_paper.png \ canvas: /wavy_white.png \ canvas: /camouflage.png --- optional global settings: colors --- blue 80 % green 20 % mix foreground ! white ( green 20 % mix ) background ! skyblue background ! \ white foreground ! \ black background ! --- optional global settings: canvas (background) \ canvas: /countertop.png \ canvas: /numbers.png --- required page header title: forth generated html --- large letter header, last word in italics (kursiv) H1 *** Forth CGI demonstration *** \ ------- mouse-over button animation ------- javascript mouseimage hi1 /soaring.gif mouseimage hi2 /soaring.gif mouseimage hi3 /soaring.gif mouseimage hi4 /soaring.gif mouseimage norm1 /fibers.png mouseimage norm2 /fibers.png mouseimage norm3 /fibers.png mouseimage norm4 /fibers.png imagechanger ( defines the javascript function used by "mouseover" which changes images ) background @ 0 0 0 table ( color cellspacing cellpadding border ) td valign="top" \ width height seq link img2 img1 imgnorm alttext 50 30 0 mouseover http://www.gimp.org hi1 norm1 /fibers.png alt text 1 50 30 1 mouseover http://www.google.com hi2 norm2 /fibers.png alt text 2 50 30 2 mouseover http://www.heise.de hi3 norm3 /fibers.png alt text 3 50 30 3 mouseover http://www.linux.org hi4 norm4 /fibers.png alt text 4 newline 50 30 7 mouseover http://www.linux.org hi1 norm1 /fibers.png alt text 1 50 30 6 mouseover http://www.gimp.org hi2 norm2 /fibers.png alt text 2 50 30 5 mouseover http://www.google.com hi3 norm3 /fibers.png alt text 3 50 30 4 mouseover http://www.heise.de hi4 norm4 /fibers.png alt text 4 newline 50 30 12 rnd mouseover http://www.linux.org hi1 norm1 /fibers.png alt text 1 50 30 12 rnd mouseover http://www.gimp.org hi2 norm2 /fibers.png alt text 2 50 30 12 rnd mouseover http://www.google.com hi3 norm3 /fibers.png alt text 3 50 30 12 rnd mouseover http://www.heise.de hi4 norm4 /fibers.png alt text 4 newline /td td 5 0 [do] nbsp [loop] /td td valign="top" h3 grafischer unfug links h3 umgekehrter unfug h3 durcheinanderder unfug /td /table _____ H1 dialog and sending data formto http://forthfreak.net/misc/forthcgi skyblue 0 5 0 table ( color cellspacing cellpadding border ) 20 ( width ) 128 ( max ) dialog email 25 ( cols ) 4 ( rows ) dialogarea include 25 ( cols ) 4 ( rows ) dialogarea exclude dialogbuttons Absenden Verwerfen /table /form newline formto http://forthfreak.net/misc/forthcgi yellow 10 10 5 table ( color cellspacing cellpadding border ) 20 ( width ) 128 ( max ) dialog email 25 ( cols ) 4 ( rows ) dialogarea include 25 ( cols ) 4 ( rows ) dialogarea exclude dialogbuttons Absenden Verwerfen /table /form _____ 150 128 2constant imagesize 10 constant bordersize : demo1 ( -- ) imagesize bordersize s" /gnome.jpg" putimage ; : demo2 ( -- ) imagesize bordersize s" /dark-gnome.jpg" putimage ; : demo3 ( -- ) imagesize bordersize s" /stucco.jpg" putimage ; : demo4 ( -- ) imagesize bordersize s" /blue_gray_rough.png" putimage ; : demo5 ( -- ) imagesize bordersize s" /soaring.gif" putimage ; --- show a picture in different sizes. third picture is special. \ xsize ysize bordersize command image file name 100 85 0 sizedimage /soaring.gif 120 102 5 sizedimage /soaring.gif commandline demo5 180 153 15 sizedimage /soaring.gif newline newline P drueck mich 120 120 0 imagelink http://forthfreak.net/misc/forthcgi?demo1 /gnome.jpg 120 120 0 imagelink http://forthfreak.net/misc/forthcgi?demo2 /dark-gnome.jpg 120 120 0 imagelink http://forthfreak.net/misc/forthcgi?demo3 /stucco.jpg 120 120 0 imagelink http://forthfreak.net/misc/forthcgi?demo4 /blue_gray_rough.png 120 120 0 imagelink http://forthfreak.net/misc/forthcgi?demo5 /soaring.gif newline newline P einige hintergrundmuster (canvasses): 112 112 4 sizedimage /blue_type.png 110 110 5 sizedimage /brushed_metal.png 108 108 6 sizedimage /burlap.jpg 106 106 7 sizedimage /camouflage.png --- we could continue to list all images as shown above, but instead, --- we define a shortcut to calculate image- and border sizes : bild ( xsize1 ysize1 bordersize1 -- xsize2 ysize2 bordersize2 ) 3dup sizedimage rot 2- rot 2- rot 1+ ; --- using this definition: 104 104 8 ( next image- and border sizes ) bild /chalk.jpg bild /cork.png bild /countertop.png bild /dark-gnome.jpg --- still tedious ... another definition: : bilder ( xsize1 ysize1 bordersize1 n -- xsize2 ysize2 bordersize2 ) 0 do bild loop ; 5 bilder /dots.png /fibers.png /fleur_de_lis.png /floral.png /fossil.png 5 bilder /green_weave.png /ice.png /manila_paper.png /moss_ridge.png /numbers.png 5 bilder /gnome.jpg /ocean_stripes.png /purple_marble.png /reset.png /ridged_paper.png 4 bilder /rough_paper.png /sky_ridge.png /snow_ridge.png /stucco.jpg 2drop drop --- insert a seperator line _____ --- show used colors newline ." foreground color = " foreground @ .color newline ." background color = " background @ .color _____ --- setting fonts for paragraph text (with pre-defined font names) helv32red P linksbuendiger text helv32green Pright rechtsbuendiger text arial18blue Pcenter zentrierter text --- setting font for paragraph text, (HTML spec, not defined earlier) font: font-family:Helvetica; font-size:24px; color: magenta P linksbuendiger text _____ --- headers, different sizes H1 muchos grandos (ganzos grossos) H2 halbstark H3 viertelstarker text\ welcher im quellcode\ ueber mehrere zeilen\ verteilt ist H4 kleinere groesse H5 noch groessere kleine H6 kleingedrucktes _____ P these examples show how to embed native HTML into the forth source | list example | | oooooooooo nicht proportional
| iiiiiiiiii nicht proportional
| iiiiiiiiii proportional
| 
|    preformatierter text
|    browser     sollte       formatierung
|    nicht                      veraendern
|
| reverse text : gedreht _____ --- ------------------------------------------------------------------- --- this is a messy paragraph --- ------------------------------------------------------------------- P this demonstrates how to mix native HTML,\ forth cgi and forth source, but you'll\ have to look at the source code to see\ this rather strange mix. | (texts, italic and bold attributes, are | embedded HTML, header, links, empty lines | and seperators are generated by forth cgi. | the code of the forth definition for \ we can define a forth word in the middle of the HTML text : newlines ( n -- ) 0 ?do newline loop ; | multiple empty lines is part of this paragraph, | as well as the forth definition which is used | to create the forth definition which causes | the multiple delimiters...)
newline | hier gehts link http://www.heise.de \ zur \ heise\ seite | , oder alternativ zu link http://www.logilan.com logilan 2 newlines : mal ( xt n -- ) 0 ?do dup execute loop drop ; \ this definition, when called, creates a new definition. : mehrfach: ( xt -- ) create , does> @ swap mal ; \ this definition, when called, creates a new definition. : durch: create , does> @ emit ; \ beispiele zum gebrauch der obigen definitionen '* durch: stern ' stern mehrfach: sterne '- durch: strich ' strich mehrfach: striche strich stern 10 striche 10 sterne 10 striche stern strich ' newline mehrfach: newlines ' _____ mehrfach: seperators 2 newlines 5 seperators 3 newlines --- -------------------------------------------------------------------------------- --- end of the messy paragraph --- -------------------------------------------------------------------------------- \ Pcenter inclusion of another document \ the following was the original apache index.html.\ \ this also demonstrates how multi-line paragraphs \ \ are entered into the source code \ \ include /var/www/index.fcgi \ Pcenter end of inclusion of another document \ -- required end of document end