Actions

Jinja-cgi interface template: Difference between revisions

From Algolit

(Created page with "{| |- | Type: || Algoliterary tool |- | Technique: || |- | Collectively developed by: || The people behind Jinja2, cgi, html, css, Jquery & Algolit |}")
 
 
(8 intermediate revisions by one other user not shown)
Line 5: Line 5:
 
| Technique: ||  
 
| Technique: ||  
 
|-
 
|-
−
| Collectively developed by: || The people behind Jinja2, cgi, html, css, Jquery & Algolit
+
| 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===
 +
<br>
 +
<nowiki>{{ var }}</nowiki>
 +
 +
<br>
 +
<nowiki><div class="element">{{ var }}</div></nowiki>
 +
 +
<br>
 +
{% if var %}
 +
    <nowiki>{{ var }}</nowiki>
 +
{% endif %}
 +
 +
<br>
 +
{% for v in vars %}
 +
    <nowiki>{{ v }}</nowiki>
 +
{% endfor %}
 +
<br>
 +
 +
==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.
 +
 +
 +
[[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.

Retrieved from "https://www.algolit.net/index.php?title=Jinja-cgi_interface_template&oldid=9816"