jsish
Web
Not logged in

Jsi provides web services built upon the WebSockets extension.

Preprocessors

Three pre-processing facilities are provided, depending upon file extension:
Extension Type Description
.htmli HTMLEvaluate javascript between tags <? and ?>.
.cssiCSSPreprocess $defined symbols.
.jsiJavascriptTranslate typed-functions (for use within browsers)

Pre-processors are enabled via handlers:

var ws = new WebSocket({callback:ws_input});
ws.handler('.htmli', 'JsiWebpp',  null);
ws.handler('.jsi',   'JsiTypepp', null);
ws.handler('.cssi',  'JsiCsspp',  null);

The specifics are described below.


HTML Preprocessing

The HTML preprocessor is triggered by the extension .htmli.

It evaluates javascript contained in <? and ?> tags.

This code is run in a private subinterp to which two new commands have been added:

Command Prototype Description
echo echo(str:string)Output a string
include include(files:string|array, debug=false)Include and evaluate files, recusively.

Here is an example:

<!DOCTYPE html>    <!-- File: main.htmli -->
<html>
<?
    echo('<title>My App</title>');
    var files = ['head.html', 'body.html', 'dialogs.html'];
    for (var i in files)
        include(files[i]);
?>
</html>

All include-ed files are also similarly processed recursively, regardless of extension. The only exception are .js .jsi and .css, whose handling is described below.

Files with the .css/.cssi extensions are wrapped in <style> tags and .js/.jsi are wrapped in <script> tags.

When the include debug flag is true, non-html files are not included inline but rather via link/script tags. This is used to simplify debugging in the browser, eg.

<head>
    include(['main.jsi', 'main.cssi', 'common.cssi'], true);
</head>

CSS Preprocessing

The CSS preprocessor is triggered by the .cssi extension.

It provides symbolic substitution via $ defines:

$mycolor = { blue }    /* File: styles.cssi */
$mysize = { 14pt }
$mydefn = {
    color:$mycolor;
    font-size:$mysize;
}
  
#mybut1 { color:$mycolor; font-size:$mysize}
.eclass { $mydefn; margin:1px }

<?
    echo('#mylist { color: $mycolor; }\n');
    include('common.cssi');
?>

Note after $define expansion, <? and ?> evaluation is also applied.


Javascript Preprocessing

The type pre-processor is triggered by the .jsi extension.

It converts typed-function code into standard web browser javascript, ie.

function notifyUser(m:string, n:number=1) {
    alert('NOTICE: '+m+': '+n);
}

which gets converted to:

function notifyUser(m, n) { m=Jsi.ArgCheck(...); n=Jsi.ArgCheck(...);
    alert('NOTICE: '+m+': '+n);
}

This provides runtime type-checking of function calls.

To debug, we set a breakpoint on warnings which are output to the console.

The Jsi support functions are included from: /jsi/lib/jsiweb.js


Utilities

The following resources are available to include from /jsi/lib/: