Actions

Jinja-cgi interface template: Difference between revisions

From Algolit

(interface.html)
 
(4 intermediate revisions by one other user not shown)
Line 5: Line 5:
 
| Technique: ||  
 
| Technique: ||  
 
|-
 
|-
| Collectively developed by: || The people behind Python, Jinja2, cgi, html, css, Jquery & Algolit
+
| Collectively developed by: || The people behind Python, Jinja2, cgi, html, css, Jquery & Michael Murtaugh, Algolit
 
|}
 
|}
  
Line 28: Line 28:
  
 
==interface.cgi==
 
==interface.cgi==
This is the place where the python code goes.
+
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==
 
==interface.html==
This is the place where the variables from the .cgi script can be used. Jinja2 is used to include the variables in the html framework.
+
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===
  
Examples:
+
<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===
 
<br>
 
<br>
 
  <nowiki>{{ var }}</nowiki>
 
  <nowiki>{{ var }}</nowiki>
Line 55: Line 70:
  
 
The stylesheet export.css is applied to the exported documents.
 
The stylesheet export.css is applied to the exported documents.
 +
 +
 +
[[Category:Algoliterary-Encounters]]

Latest revision as of 13:59, 25 October 2017

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.