This project is an update of the post-scrip interface, now using pagedjs

3 years ago · 87002827e3
11 changed files with 62424 additions and 25 deletions
--- a/start.py
+++ b/start.py
@ -21,10 +21,10 @@ APP = flask.Flask(__name__)
 # 	print('Do something recurrent')

 pads = [
-		'post-script.md',
-		'post-script.css'
+		'RDI.md',
+		'RDI.css'
 	]
-DIR_PATH = '/home/mb/post-script-interface'
+DIR_PATH = '/home/systers/rdi-flask-interface'

 def download(pads):
 	# using etherpump
@ -35,25 +35,34 @@ def download(pads):
 def pad():
 	return flask.render_template('pad.html')

+@APP.route('/pagedjs/', methods=['GET', 'POST'])
+def pagedjs():
+        # download the main post-script pad + stylesheet pad
+	download(pads)
+	# generate html page
+	os.system(f'pandoc -f markdown -t html -c RDI.css --toc --toc-depth=1 --template { DIR_PATH }/templates/pandoc-template-pagedjs.html --standalone { DIR_PATH }/static/RDI.md -o { DIR_PATH }/static/RDI.pagedjs.html')
+
+	return open('static/RDI.pagedjs.html', 'r').read()
+
@APP.route('/html/', methods=['GET', 'POST'])
 def html():
 	# download the main post-script pad + stylesheet pad
 	download(pads)
 	# generate html page
-	os.system(f'pandoc -f markdown -t html -c post-script.css --toc --toc-depth=1 --standalone { DIR_PATH }/static/post-script.md -o { DIR_PATH }/static/post-script.html')
+	os.system(f'pandoc -f markdown -t html -c RDI.css --toc --toc-depth=1 --standalone { DIR_PATH }/static/RDI.md -o { DIR_PATH }/static/RDI.html')

 	return flask.render_template('html.html')

-@APP.route('/pdf/', methods=['GET'])
-def pdf():
+#@APP.route('/pdf/', methods=['GET'])
+#def pdf():
 	# download the main post-script pad + stylesheet pad
-	download(pads)
+	#download(pads)
 	# generate html page
-	os.system(f'pandoc -f markdown -t html -c post-script.css --toc --toc-depth=1 --standalone { DIR_PATH }/static/post-script.md -o { DIR_PATH }/static/post-script.html')
+	#os.system(f'pandoc -f markdown -t html -c post-script.css --toc --toc-depth=1 --standalone { DIR_PATH }/static/post-script.md -o { DIR_PATH }/static/post-script.html')
 	# generate pdf
-	os.system(f'{ DIR_PATH }/venv/bin/weasyprint -s { DIR_PATH }/static/post-script.css { DIR_PATH }/static/post-script.html { DIR_PATH }/static/post-script.pdf')
+	#os.system(f'{ DIR_PATH }/venv/bin/weasyprint -s { DIR_PATH }/static/post-script.css { DIR_PATH }/static/post-script.html { DIR_PATH }/static/post-script.pdf')

-	return flask.render_template('pdf.html')
+	#return flask.render_template('pdf.html')

@APP.route('/stylesheet/', methods=['GET'])
 def stylesheet():
@ -61,4 +70,4 @@ def stylesheet():

 if __name__ == '__main__':
 	APP.debug=True
-	APP.run(port=5577)
+	APP.run(port=5588)
--- a/static/interface.css
+++ b/static/interface.css
@ -0,0 +1,180 @@
+/* CSS for Paged.js interface – v0.2 */
+
+/* Change the look */
+:root {
+    --color-background: whitesmoke;
+    --color-pageSheet: #cfcfcf;
+    --color-pageBox: violet;
+    --color-paper: white;
+    --color-marginBox: transparent;
+    --pagedjs-crop-color: black;
+    --pagedjs-crop-shadow: white;
+    --pagedjs-crop-stroke: 1px;
+}
+
+/* To define how the book look on the screen: */
+@media screen {
+    body {
+        background-color: var(--color-background);
+    }
+
+    .pagedjs_pages {
+        display: flex;
+        width: calc(var(--pagedjs-width) * 2);
+        flex: 0;
+        flex-wrap: wrap;
+        margin: 0 auto;
+    }
+
+    .pagedjs_page {
+        background-color: var(--color-paper);
+        box-shadow: 0 0 0 1px var(--color-pageSheet);
+        margin: 0;
+        flex-shrink: 0;
+        flex-grow: 0;
+        margin-top: 10mm;
+    }
+
+    .pagedjs_first_page {
+        margin-left: var(--pagedjs-width);
+    }
+
+    .pagedjs_page:last-of-type {
+        margin-bottom: 10mm;
+    }
+
+    .pagedjs_pagebox{
+        box-shadow: 0 0 0 1px var(--color-pageBox);
+    }
+
+    .pagedjs_left_page{
+        z-index: 20;
+        width: calc(var(--pagedjs-bleed-left) + var(--pagedjs-pagebox-width))!important;
+    }
+
+    .pagedjs_left_page .pagedjs_bleed-right .pagedjs_marks-crop {
+        border-color: transparent;
+    }
+    
+    .pagedjs_left_page .pagedjs_bleed-right .pagedjs_marks-middle{
+        width: 0;
+    } 
+
+    .pagedjs_right_page{
+        z-index: 10;
+        position: relative;
+        left: calc(var(--pagedjs-bleed-left)*-1);
+    }
+
+    /* show the margin-box */
+
+    .pagedjs_margin-top-left-corner-holder,
+    .pagedjs_margin-top,
+    .pagedjs_margin-top-left,
+    .pagedjs_margin-top-center,
+    .pagedjs_margin-top-right,
+    .pagedjs_margin-top-right-corner-holder,
+    .pagedjs_margin-bottom-left-corner-holder,
+    .pagedjs_margin-bottom,
+    .pagedjs_margin-bottom-left,
+    .pagedjs_margin-bottom-center,
+    .pagedjs_margin-bottom-right,
+    .pagedjs_margin-bottom-right-corner-holder,
+    .pagedjs_margin-right,
+    .pagedjs_margin-right-top,
+    .pagedjs_margin-right-middle,
+    .pagedjs_margin-right-bottom,
+    .pagedjs_margin-left,
+    .pagedjs_margin-left-top,
+    .pagedjs_margin-left-middle,
+    .pagedjs_margin-left-bottom {
+        box-shadow: 0 0 0 1px inset var(--color-marginBox);
+    }
+
+    /* uncomment this part for recto/verso book : ------------------------------------ */
+/*
+    
+    .pagedjs_pages {
+        flex-direction: column;
+        width: 100%;
+    }
+
+    .pagedjs_first_page {
+        margin-left: 0;
+    }
+
+    .pagedjs_page {
+        margin: 0 auto;
+        margin-top: 10mm;
+    } 
+
+    .pagedjs_left_page{
+        width: calc(var(--pagedjs-bleed-left) + var(--pagedjs-pagebox-width) + var(--pagedjs-bleed-left))!important;
+    }
+
+    .pagedjs_left_page .pagedjs_bleed-right .pagedjs_marks-crop{
+        border-color: var(--pagedjs-crop-color);
+    }
+
+    .pagedjs_left_page .pagedjs_bleed-right .pagedjs_marks-middle{
+        width: var(--pagedjs-cross-size)!important;
+    } 
+
+    .pagedjs_right_page{
+        left: 0; 
+    } 
+    */
+    
+    
+
+    /*--------------------------------------------------------------------------------------*/
+
+
+
+    /* uncomment this par to see the baseline : -------------------------------------------*/
+
+    /*
+     .pagedjs_pagebox {
+        --pagedjs-baseline: 22px;
+        --pagedjs-baseline-position: 5px;
+        --pagedjs-baseline-color: cyan;
+        background: linear-gradient(transparent 0%, transparent calc(var(--pagedjs-baseline) - 1px), var(--pagedjs-baseline-color) calc(var(--pagedjs-baseline) - 1px), var(--pagedjs-baseline-color) var(--pagedjs-baseline)), transparent;
+        background-size: 100% var(--pagedjs-baseline);
+        background-repeat: repeat-y;
+        background-position-y: var(--pagedjs-baseline-position);
+    }  */
+   
+
+    /*--------------------------------------------------------------------------------------*/
+}
+
+
+
+
+
+/* Marks (to delete when merge in paged.js) */
+
+.pagedjs_marks-crop{
+    z-index: 999999999999;
+  
+}
+
+.pagedjs_bleed-top .pagedjs_marks-crop, 
+.pagedjs_bleed-bottom .pagedjs_marks-crop{
+    box-shadow: 1px 0px 0px 0px var(--pagedjs-crop-shadow);
+}  
+
+.pagedjs_bleed-top .pagedjs_marks-crop:last-child,
+.pagedjs_bleed-bottom .pagedjs_marks-crop:last-child{
+    box-shadow: -1px 0px 0px 0px var(--pagedjs-crop-shadow);
+}  
+
+.pagedjs_bleed-left .pagedjs_marks-crop,
+.pagedjs_bleed-right .pagedjs_marks-crop{
+    box-shadow: 0px 1px 0px 0px var(--pagedjs-crop-shadow);
+}
+
+.pagedjs_bleed-left .pagedjs_marks-crop:last-child,
+.pagedjs_bleed-right .pagedjs_marks-crop:last-child{
+    box-shadow: 0px -1px 0px 0px var(--pagedjs-crop-shadow);
+}
--- a/static/main.css
+++ b/static/main.css
@ -0,0 +1,16 @@
+body{
+	background-color: lightgreen;
+	margin: 1vh 5vw 2vh 5vw;
+}
+div#nav{
+	position: absolute;
+	top:1em;
+	right: 1em;
+}
+iframe{
+	width: 90vw;
+	height: 88vh;
+}
+input{
+	min-width: 300px;
+}
--- a/static/paged.js
+++ b/static/paged.js
--- a/static/paged.polyfill.js
+++ b/static/paged.polyfill.js
--- a/templates/base.html
+++ b/templates/base.html
@ -2,16 +2,16 @@
 <html lang='en'>
 <head>
 	<meta charset="utf-8" />
-	<title>post-script</title>
+	<title>RDI</title>
 	<link rel="stylesheet" type="text/css" href="{{ url_for('static', filename='main.css')}}">
 </head>
 <body>
-	<h1>post-script</h1>
+	<h1>RDI documentation</h1>
 	<div id="nav">
-		<a href="/">pad</a>: <input type="text" name="pad" value="https://pad.vvvvvvaria.org/post-script.md">,
+		<a href="/">pad</a>: <input type="text" name="pad" value="https://pad.vvvvvvaria.org/RDI.md">,
 		<a href="/html/">html</a>,
-		<a href="/pdf/">pdf</a>,
-		<a href="/stylesheet/">stylesheet</a>: <input type="text" name="pad" value="https://pad.vvvvvvaria.org/post-script.css">,
+		<a href="/pagedjs/">pagedjs</a>,
+		<a href="/stylesheet/">stylesheet</a>: <input type="text" name="pad" value="https://pad.vvvvvvaria.org/RDI.css">,
 	</div>
 	<div id="wrapper">
 		{% block content %}
--- a/templates/html.html
+++ b/templates/html.html
@ -1,5 +1,5 @@
 {% extends "base.html" %} 

 {% block content %}
-<iframe src="{{ url_for('static', filename='post-script.html')}}"></iframe>
+<iframe src="{{ url_for('static', filename='RDI.html')}}"></iframe>
 {% endblock %}
--- a/templates/pad.html
+++ b/templates/pad.html
@ -1,5 +1,5 @@
 {% extends "base.html" %} 

 {% block content %}
-<iframe src="https://pad.vvvvvvaria.org/post-script.md"></iframe>
+<iframe src="https://pad.vvvvvvaria.org/RDI.md"></iframe>
 {% endblock %}
--- a/templates/pandoc-template-pagedjs.html
+++ b/templates/pandoc-template-pagedjs.html
@ -0,0 +1,32 @@
+<!doctype html>
+<html lang="$language$">
+
+<head>
+    <meta charset="utf-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <link href="/static/RDI.css" rel="stylesheet" type="text/css">
+    <script src="/static/paged.js" type="text/javascript"></script>
+    <script src="/static/paged.polyfill.js" type="text/javascript"></script>
+    <link href="/static/interface.css" rel="stylesheet" type="text/css">
+    <title>$title$</title>
+</head>
+
+<body>
+
+<section class="cover">
+<h1 class="title">$title$</h1>
+</section>
+
+$if(toc)$
+<section id="TOC" role="doc-toc">
+$if(toc-title)$
+<h2 id="$idprefix$toc-title">$toc-title$</h2>
+$endif$
+$table-of-contents$
+</section>
+$endif$
+
+$body$
+
+</body>
+</html>
--- a/templates/pdf.html
+++ b/templates/pdf.html
@ -1,6 +0,0 @@
-{% extends "base.html" %} 
-
-{% block content %}
-<iframe src="{{ url_for('static', filename='post-script.pdf')}}"></iframe>
-{% endblock %}
-
--- a/templates/stylesheet.html
+++ b/templates/stylesheet.html
@ -1,6 +1,6 @@
 {% extends "base.html" %} 

 {% block content %}
-<iframe src="https://pad.vvvvvvaria.org/post-script.css"></iframe>
+<iframe src="https://pad.vvvvvvaria.org/RDI.css"></iframe>
 {% endblock %}