Jinja-cgi interface template

Type:	Algoliterary tool
Technique:
Collectively developed by:	The people behind Python, Jinja2, cgi, html, css, Jquery & Michael Murtaugh, Algolit

The file structure is the following:

cgi-bin/
   export.cgi
   interface.cgi
css/
   export.css
   fonts/
   stylesheet.css
img/
   loading.gif
interface.html
js/
   jquery-2.1.3.js
output/
   html/
   pdf/
README.md

interface.cgi

This is the place where the python code goes. There are 3 important stages here:

• getting the values from the submitted form in interface.html
• processing these values
• turning the values into jinja templating variables

interface.html

This is the place where the variables from the .cgi script can be get from and send back to.

A html <form> with <input> fields is used to get values from the input of the user. Jinja2 is used to send the variables back into the html framework.

Examples of a html form

<form action="" method="post">
   <textarea name="input_text" rows="20">
   <input type="text" name="author" value="" required>

   <input type="submit" value="submit">
</form>

Examples of jinja syntax

{{ var }}

<div class="element">{{ var }}</div>

{% if var %}
   {{ var }}
{% endif %}

{% for v in vars %}
   {{ v }}
{% endfor %}

export.cgi

This script is called when hitting 'submit' in the export section of the interface. Jquery uses an ajax call to run the script. It creates a .html and a .pdf document in the output/ folder.

The stylesheet export.css is applied to the exported documents.