How is wiki-to-print made?: Difference between revisions

From creative crowd wiki
Jump to navigation Jump to search
No edit summary
No edit summary
Line 1: Line 1:


Technically seen, wiki-to-print is a web application made with [https://flask.palletsprojects.com/en/2.3.x/ Flask], that can be installed on the same server as where the MediaWiki is installed, or on any other server that you can access with sudo rights.  
Technically seen, wiki-to-print is a web application made in Python with [https://flask.palletsprojects.com/en/2.3.x/ Flask], that can be installed on the same server as where the MediaWiki is installed, or on any other server that you can access with sudo rights.  


In practice, it's a version of a DIY configuration and that glues different things together: it takes a wiki page and a stylesheet as input sources (using Python) and renders them into a HTML page (using Pandoc) and a PDF preview page (using Paged.js).
In practice, it's a version of a DIY configuration and that glues different things together: it takes a wiki page and a stylesheet as input sources (using Python) and renders them into a HTML page (using [https://pandoc.org/ Pandoc]) and a PDF preview page (using [https://pagedjs.org/ Paged.js]).


==Code==
==Code==


The source code can be found at: https://git.vvvvvvaria.org/varia/wiki-to-print/.  
The source code of the wiki-to-print version that is installed at [https://cc.vvvvvvaria.org CC] can be found at: https://git.vvvvvvaria.org/varia/wiki-to-print/.  


The git repository contains the following files and folders:
The git repository contains the following files and folders:
Line 20: Line 20:
  └── web-interface.py
  └── web-interface.py


* <code>static/</code>: folder for static files used by flask (eg. css and js scripts)
* <code>static/</code>: folder for static files used by Flask (eg. css and js scripts)
* <code>templates/</code>: folder for jinja templates used by flask
* <code>templates/</code>: folder for Jinja templates used by Flask
* <code>Makefile</code>: script you can use to install or run the flask application
* <code>Makefile</code>: script you can use to install or run the Flask application
* <code>api.py</code>: script with all the functions that are used by the flask application
* <code>api.py</code>: script with all the functions that are used by the Flask application
* <code>config.json</code>: config script for your wiki-to-print installation
* <code>config.json</code>: config script for your wiki-to-print installation
* <code>config.py</code>: script that binds config.json with web-interface.py
* <code>config.py</code>: script that binds <code>config.json</code> with <code>web-interface.py</code>
* <code>requirements.txt</code>: list of software dependencies for wiki-to-print
* <code>requirements.txt</code>: list of software dependencies for wiki-to-print
* <code>web-interface.py</code>: the flask application
* <code>web-interface.py</code>: the Flask application
 
Other versions and variants of this wiki workflow can be found here:
* https://gitlab.constantvzw.org/osp/work.diversions
* https://git.vvvvvvaria.org/mb/volumetric-regimes-book
* https://gitlab.constantvzw.org/titipi/wiki-to-pdf
* https://github.com/hackersanddesigners/wiki2print


==To install wiki-to-print==
==To install wiki-to-print==


* <code>make setup</code>: makes a virtual environment and installs all the requirements
# <code>make setup</code>: make a virtual environment and install all the requirements
* edit <code>config.json</code>
# edit <code>config.json</code>: to configure the Flask application
 
# run the Flask application
==To run wiki-to-print==
## on your computer: <code>make local</code>
 
## on a server: <code>make server</code> (it uses Gunicorn, as we work with a subdirectory in the wiki-to-print URL on CC, with https://cc.vvvvvvaria.org/wiki-to-print/ as the root of the Flask application)
* <code>make local</code>: runs the Flask application locally
# add a proxy_pass to your webserver configuration, to bind web requests with Gunicorn, here is an example: https://git.vvvvvvaria.org/varia/wiki-to-print/src/branch/master/wiki-to-print.nginx.example
* <code>make server</code>: runs the Flask application remotely with Gunicorn, which we used to work with a subdirectory (we use https://cc.vvvvvvaria.org/wiki-to-print/ as the root of this Flask application)
# add the following to your <code>LocalSettings.php</code> file: https://git.vvvvvvaria.org/varia/wiki-to-print/src/branch/master/wiki-to-print.LocalSettings.php.example
# add the following code to [[MediaWiki:Common.js]]: https://git.vvvvvvaria.org/varia/wiki-to-print/src/branch/master/wiki-to-print.Common.js.example
# add the following code to [[MediaWiki:Common.css]]: https://git.vvvvvvaria.org/varia/wiki-to-print/src/branch/master/wiki-to-print.Common.css.example


==Flask application==
==Flask application==
Line 60: Line 68:
==Special namespaces==
==Special namespaces==


Wiki-to-print uses the <code>Pdf</code> and <code>PdfCSS</code> namespace for these environments, which means that those wiki pages start with <code>Pdf:</code>.  
Wiki-to-print uses the <code>Pdf</code> and <code>PdfCSS</code> namespaces to customize the navigation bar.
 
This means that all wiki-to-print Unfolded pages start with <code>Pdf:</code> and all CSS pages start with <code>PdfCSS:</code>.
 
The wiki-to-print buttons are added and adjusted with Javascript, using [[MediaWiki:Common.js]]. [[MediaWiki:Common.css]] is used to style the buttons.
 
==Fonts==
 
Fonts must be hosted outside the wiki. We host [https://cc.vvvvvvaria.org/fonts fonts] at the CC server and just declare their URLs in our CSS. You can also host them in other ways, using font manager software for example.
 
It's important to use the same domainname to avoid cross-origin errors, or you need to configure your server in such a way that cross-origin links are allowed.


[[Category:Wiki-to-print]]
[[Category:Wiki-to-print]]

Revision as of 15:35, 22 August 2023

Technically seen, wiki-to-print is a web application made in Python with Flask, that can be installed on the same server as where the MediaWiki is installed, or on any other server that you can access with sudo rights.

In practice, it's a version of a DIY configuration and that glues different things together: it takes a wiki page and a stylesheet as input sources (using Python) and renders them into a HTML page (using Pandoc) and a PDF preview page (using Paged.js).

Code

The source code of the wiki-to-print version that is installed at CC can be found at: https://git.vvvvvvaria.org/varia/wiki-to-print/.

The git repository contains the following files and folders:

├── static/
├── templates/
├── Makefile
├── README.md
├── api.py
├── config.json 
├── config.py
├── requirements.txt
└── web-interface.py
  • static/: folder for static files used by Flask (eg. css and js scripts)
  • templates/: folder for Jinja templates used by Flask
  • Makefile: script you can use to install or run the Flask application
  • api.py: script with all the functions that are used by the Flask application
  • config.json: config script for your wiki-to-print installation
  • config.py: script that binds config.json with web-interface.py
  • requirements.txt: list of software dependencies for wiki-to-print
  • web-interface.py: the Flask application

Other versions and variants of this wiki workflow can be found here:

To install wiki-to-print

  1. make setup: make a virtual environment and install all the requirements
  2. edit config.json: to configure the Flask application
  3. run the Flask application
    1. on your computer: make local
    2. on a server: make server (it uses Gunicorn, as we work with a subdirectory in the wiki-to-print URL on CC, with https://cc.vvvvvvaria.org/wiki-to-print/ as the root of the Flask application)
  4. add a proxy_pass to your webserver configuration, to bind web requests with Gunicorn, here is an example: https://git.vvvvvvaria.org/varia/wiki-to-print/src/branch/master/wiki-to-print.nginx.example
  5. add the following to your LocalSettings.php file: https://git.vvvvvvaria.org/varia/wiki-to-print/src/branch/master/wiki-to-print.LocalSettings.php.example
  6. add the following code to MediaWiki:Common.js: https://git.vvvvvvaria.org/varia/wiki-to-print/src/branch/master/wiki-to-print.Common.js.example
  7. add the following code to MediaWiki:Common.css: https://git.vvvvvvaria.org/varia/wiki-to-print/src/branch/master/wiki-to-print.Common.css.example

Flask application

The Flask application is based around the following URLs/routes:

button URL/route Flask action
CSS https://cc.vvvvvvaria.org/wiki-to-print/static/Test.css renders PdfCSS:Test as CSS stylesheet
HTML https://cc.vvvvvvaria.org/wiki-to-print/html/Test renders Pdf:Test as HTML page, using PdfCSS:Test as CSS stylesheet
PDF https://cc.vvvvvvaria.org/wiki-to-print/pdf/Test renders Pdf:Test as PDF preview page (using Paged.js), using PdfCSS:Test as CSS stylesheet
Update text https://cc.vvvvvvaria.org/wiki-to-print/update/Test downloads all the text from Pdf:Test using the Mediawiki API and saves it to Test.json (in HTML)
Update Media https://cc.vvvvvvaria.org/wiki-to-print/update/Test?full=true downloads all the text + images from Pdf:Test using the Mediawiki API and saves them to ./static/images/

Special namespaces

Wiki-to-print uses the Pdf and PdfCSS namespaces to customize the navigation bar.

This means that all wiki-to-print Unfolded pages start with Pdf: and all CSS pages start with PdfCSS:.

The wiki-to-print buttons are added and adjusted with Javascript, using MediaWiki:Common.js. MediaWiki:Common.css is used to style the buttons.

Fonts

Fonts must be hosted outside the wiki. We host fonts at the CC server and just declare their URLs in our CSS. You can also host them in other ways, using font manager software for example.

It's important to use the same domainname to avoid cross-origin errors, or you need to configure your server in such a way that cross-origin links are allowed.