User Interface via FCGI Server
------------------------------

The UI (apart from the console only "ciyam_client") is provided by the FCGI server "ciyam_interface" which is
suitable for any web server that supports FCGI. For a development environment only use an FCGI implementation
that will launch the FCGI server "on demand" (such as "mod_fcgid" for Apache).

Static Content
--------------

A basic tenet of the technical design itself is that all content that is "seen" is loaded via what is usually
referred to as an AJAX request (although the request itself is not performed asynchronously and all data that
is requested in this manner is returned in the form of HTML rather than JSON).

So at any point a "View Source" will display something very similar to the following:

<!DOCTYPE html>
<html lang="en">
 
<head>
<title>Sample Beta</title>
 
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
<meta name="author" content="Copyright 2012-2019 CIYAM Open Developers"/>
 
<meta http-equiv="Expires" content="0"/>
<meta http-equiv="Pragma" content="no-cache"/>
<meta http-equiv="Cache-Control" content="no-cache"/>
<meta http-equiv="Cache-Control" content="no-store"/>
 
<script type="text/javascript" src="sha1.js"></script>
<script type="text/javascript" src="sha2.js"></script>
<script type="text/javascript" src="base64.js"></script>
 
<script type="text/javascript">var module = 'module=Sample';</script>
 
<link rel="stylesheet" href="ciyam_interface.css" type="text/css"/>
<link rel="stylesheet" href="css/pikaday.css" type="text/css"/>
<script type="text/javascript" src="ciyam_interface.js"></script>
<script type="text/javascript" src="pikaday.js">
</script>
<script type="text/javascript" src="scripts/wysiwyg.js"></script>
<script type="text/javascript" src="scripts/wysiwyg-settings.js"></script>
</head>
 
<body onload="load( )">
<noscript>
   <div class="noscript">
       <p><strong>JavaScript seem to be disabled in your browser.</strong></p>
       <p>You must have JavaScript enabled in your browser in order to use this website.</p>
   </div>
</noscript>
 
<div id="content">
</div>
 
<div id="auto_progress" class="invisible"><img src="auto_progress.gif" alt="auto_progress"/></div>
<div id="load_progress" class="invisible"><img src="load_progress.gif" alt="load_progress"/></div>
 
<iframe src="javascript:false;"
 name="hidden_frame" frameborder="0" width="1" height="1" marginheight="0" marginwidth="0">
</iframe>
 
</body>
</html>

So the page includes various .js files and style sheets but the "content" is always an empty "div" which will
only be expanded after the call to "load". Another couple of "divs" are used for displaying "progress" images
(animated .gif files) and a "hidden frame" that is used for file uploading (which are actually performed with
a separate "upload" FCGI server).

Dynamic Content
---------------

As using "View Source" will never show anything other that the "static content" shown above a special "debug"
variable exists in "ciyam_interface.js" (called "debugDynamicContent") which, when set to true, allows one to
view the injected HTML "source code" at the bottom of the page.

The basic skeleton of injected HTML comes from the file "ciyam_interface.htms" and is as follows:

<div id="extra_content" class="@@direction">
<!-- @@extra_content -->
</div>

with the "@@extra_content" comment line being replaced with the content generated by the FCGI interface. What
that content will be depends entirely upon the current state of the session and the URL query string. With no
query string the "home" page will be displayed the appearance of which depends upon whether an application is
allowing anonymous access. The "@@direction" comment is replaced with "horizontal" or "vertical" according to
the menu preference selected in the Application "display settings" tab.

Home Page
---------

Assuming that primary application model does not permit anonymous access then the "extra content" should look
similar to the following:

-------------------------------------------------------------------------------------------------------------

<div id="normal_content">

<div id="header"><div id="appname"><a href="?cmd=home">Meta</a></div>
   <div id="navband">
   </div>
</div>
<h3 class="center">Sign In Using Credentials</h3>
<div align="center">
...
</div>

</div>

<div id="footer"><p>© 2012-2018 CIYAM Open Developers</p></div>

</div>

<input type="hidden" value="document.cookie = 'session=,keep=,dtmoff=,gmtoff=;
 Expires=Thu, 01-Jan-1970 00:00:01 UTC; path=/'; serverId = 'f32e0805a4ea54774208';
 uniqueId = '7a71f32377a795b3dc5a3a3763050d11cd7fa0481b8b304e2e90b1218898a58e';" id="extra_content_func"/>

-------------------------------------------------------------------------------------------------------------

The "centered" div would contain the actual login form HTML (omitted above for brevity). The "normal_content"
div is standard for all injected HTML except for "print" versions where applicable (which use "print_content"
instead).