Language

Pliant UI HTTP proxy

What's that for ?

The Pliant UI HTTP proxy is bridge that will translate Pliant UI protocol to HTTP/HTML/Javascript in order to enable the application to be accessed from a standard web browser.
It's implemented in /pliant/graphic/console/http_proxy.pli
Let's say it right from the beginning: there is no miracle to expect from such a tool. If you want to do a web site full of bells and whistles, then you'd better use a lower level tool. On the other hand, if you expect to do clean user interface developments to keep you costs low on the long run, yet need to open some services to some web users, then the HTTP proxy is for you.
Moreover the code is currently quite rough.

Configuration

- to be written -

HTML CSS

There are huge differences between the way Pliant UI styling works, and the way HTML CSS works. If you do nothing special in your application, Pliant will try to map UI styling attributes to HTML, with more or less (more often less) success.
The biggest difference is that the set of available styling parameters is significantly different,
but the propagation mechanism of styling parameters alterations is also different.

Let's start with very simple example:

style_copy "" "mystyle"style_set "mystyle" "title/text/size" 50/72*25.4...style use "mystyle" title "Sample title"

The result will be incorrect when using a standard web browser because Pliant HTTP proxy in release 101 does not properly translate the text size attribute of the 'title' widget. The current result would just be:

<h1>Sample title</h1>

It will improve over next releases, but you'd better not expect miracles.

Anyway, in order to get better control on HTML styling, you can explicitly assign an HTML CSS class to each Pliant widget, and provide the corresponding CSS rules: Here is the tiny example extended with two more instructions to define how to translate Pliant UI styling rule to HTML CSS:

style_copy "" "mystyle"style_set "mystyle" "title/text/size" 50/72*25.4style_set "mystyle" "title/css" "mytitle" # assign a CSS class to Pliant title widgetcss "h1.mytitle" "font-size: 50pt;" # provide the CSS rule...style use "mystyle" title "Sample title"

The result is now an extra line in the HTML header styling section (as a result of the new 'css' instruction):

h1.mytitle { font-size: 50pt }

and the code is now be translated to (as a result of the extra 'style_set' instruction):

<h1 class="mytitle">Sample title</h1>"

Please notice that Pliant 'css' instruction can be used to overwrite any of the default CSS rules generated by the HTTP proxy.

As a summary, for one UI style (here 'mystyle') and for each widget, it is possible to decide if it will be handled automatically by Pliant HTTP proxy styling attributes translation mechanism, or will be translated using a single 'class' HTML attribute referring to explicitly provided HTML CSS rules.

Another possibility is to apply CSS at Pliant 'style' instruction level instead of at individual widget level ('title' in the tiny example). Let's twist again:

style_copy "" "mystyle"style_set "mystyle" "title/text/size" 50/72*25.4style_set "mystyle" "style/css" "mycss"css "h1.mycss" "font-size: 50pt;"...style use "mystyle" title "Sample title"

The new result in the HTML header is:

h1.mycss { font-size: 50pt }

and the new result in the HTML body is:

<span class="mycss"><h1>Sample title</h1></span>

where <span> HTML tag is the translation of 'style use' UI instruction that was previously not translated.

It is even possible (starting from Pliant release 103) to force Pliant 'style use' instruction to be translated as a <div> HTML tag instead of a <span> HTML tag:

style_copy "" "mystyle"style_set "mystyle" "title/text/size" 50/72*25.4style_set "mystyle" "style/tag" "div"style_set "mystyle" "style/css" "mycss"css "h1.mycss" "font-size: 50pt;"...style use "mystyle" title "Sample title"

The result in the HTML header is still:

h1.mycss { font-size: 50pt }

but the result in the HTML body is now:

<div class="mycss"><h1>Sample title</h1></div

Inline HTML

It is sometime necessary to put inline HTML in the middle of your UI content, because the special tag or attribute you want to use has no UI equivalent. You can do that using 'html' instruction:

html "<a href=[dq]http://hc.fullpliant.org/>Pliant hard core documentation</a>"

HTTP

The 'http' instruction can be used to force the content of the HTML <head> section.

http "title" "This is the title of my document"

will translate to:

<title>This is the title of my document</title>"

Please notice that if you don't provide a title, but your document uses UI 'title' instruction, then the HTTP proxy will silently translate it to a <title> tag in the <head> section of the HTML document.

http "keywords" "Fullpliant, Pliant, HTTP, proxy, documentation"

will be translated to:

<meta name="keywords" content="Fullpliant, Pliant, computer, language">

http "description" "Core documentation about the Pliant HTTP proxy"

will be translated to:

<meta name="description" content="Core documentation about the Pliant HTTP proxy">

http "robots" "noindex, nofollow"

will be translated to:

<meta name="robots" content="noindex, nofollow">

Then, 'http' instruction can also be used to force the way Pliant HTTP proxy will convert UI protocol to HTTP/HTML/Javascript:

http "frame" "false"

Switches from using frames to using a table to separate the various Pliant UI windows.

http "javascript" "false"

The page will be static. It will contain no Javascript code, client side caching will be allowed and no cookie will be used, so several Pliant UI instructions such as 'input', 'button', 'link' and 'hook' will just not work. The Pliant HTTP proxy will not provide session notion.

http "javascript" "embedded"

The Javascript code will be provided with the HTML content instead of as an external document. The default is to provide Javascript as an external document.

http "css" "false"

Prevents the HTTP proxy to use a CSS style sheet and CSS inline 'style' attributes. You'd better not do that.

http "css" "external"

The CSS code will be provided as an external document, unless some content has been forced using 'css' instruction. The default is to provide CSS with the HTML content.

http "compress" "false"

This can be useful to prevent Zlib compression when you use 'clipboard_file_upload' and 'clipboard_trigger' to provide the content of a file to download and you know that such a file cannot be efficiently compressed.

If you look at the HTTP proxy code in /pliant/graphic/console/http_proxy.pli, you will see that some of these options can be set through the 'Style options' field in the site declaration database. As an example, you could enter:

frame "false"

This is a bit ugly, and might be removed in future releases. On the other hand, you can use the 'ui_site' instruction introduced with Pliant release 101:

ui_site "hc.fullpliant.org" http "frame" "false" http "javascript" "false"

'ui_site' is some standard site wide UI code that is executed before executing the code defined in any 'ui_path' instruction.

Files upload and download

The following (untested) code maps /myorg/myapp/download/xxx urls to downloading some files in file:/download/ directory:

ui_path "/myorg/myapp/download/" if subpath<>"" and (file_query "file:/download/"+subpath standard)=success clipboard_file_upload s subpath (var Stream f) open "file:/download/"+subpath in+safe while not f:atend and s=success raw_copy f s 1 2^20 f close clipboard_trigger subpath "binary/*" http "compress" "false" else window main text "There is no '"+subpath+"' file."

For more informations on how to enable files upload and download with the HTTP proxy, see the clipboard section in 'High interactivity applications using Pliant UI' article.