1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
|
{% extends "wiki/base.html" %}
{% block title %}Wiki | Edit: {{ page }}{% endblock %}
{% block og_title %}Wiki | Edit: {{ page }}{% endblock %}
{% block og_description %}{% endblock %}
{% block page_classes %}uses-rst{% endblock %}
{% block content %}
<form uk-grid class="uk-grid-small" action="{{ url_for("wiki.edit", page=page) }}" method="post">
<div class="uk-width-expand">
<input name="title" id="title" placeholder="Page Title" value="{{ title }}" class="uk-input" required />
</div>
<div class="uk-width-auto">
<button class="uk-button uk-button-secondary" type="button" value="Preview" id="preview">Preview</button>
</div>
<div class="uk-width-auto">
<input class="uk-button uk-button-primary" type="submit" id="submit" value="Save" disabled />
</div>
<div class="uk-width-1-1">
<div id="editor" class="uk-textarea">{{ rst }}</div>
<input type="hidden" name="rst" id="rst" />
</div>
<input type="hidden" name="csrf_token" value="{{ csrf_token() }}"/>
</form>
<div class="uk-container uk-container-small preview-title">
<h2 id="preview-title">{{ title }}</h2>
<div id="preview-div">
{{ preview | safe }}
</div>
</div>
<script type="application/javascript">
"use strict";
let csrf_token = "{{ csrf_token() }}";
function do_preview(_) {
let oReq = new XMLHttpRequest();
oReq.addEventListener("load", function() {
let response = JSON.parse(this.responseText);
if (response.error !== undefined) {
document.getElementById("submit").disabled = true;
if (response.error_lines !== undefined) {
editor.session.setAnnotations(response.error_lines);
document.getElementById("preview-div").innerHTML ="<h3>Error - see editor margin</h3>";
} else {
console.log("Error: " + response.error);
document.getElementById("preview-div").innerHTML ="<h3>Error</h3><p>" + response.error + "<p>";
}
} else {
document.getElementById("submit").disabled = false;
document.getElementById("preview-div").innerHTML = response.data;
editor.session.setAnnotations([]);
}
});
let data = editor.getValue();
if (data.replace("\s", "").length < 1 || document.getElementById("title").value.length < 1) {
document.getElementById("submit").disabled = true;
return false;
}
oReq.open("POST", "/render");
oReq.setRequestHeader("Content-type", "application/json");
oReq.setRequestHeader("X-CSRFToken", csrf_token);
oReq.send(JSON.stringify({"data": editor.getValue()}));
return false;
}
document.getElementById("preview").onclick = do_preview;
let editor = ace.edit("editor");
let timer;
editor.session.setMode("ace/mode/rst");
editor.session.setUseWrapMode(true);
editor.setTheme("ace/theme/iplastic");
editor.setShowPrintMargin(false);
editor.on("input", function() {
document.getElementById("submit").disabled = true;
document.getElementById("rst").value = editor.getValue();
if (timer !== undefined) {
clearTimeout(timer);
}
timer = setTimeout(do_preview, 1000);
});
document.getElementById("title").oninput = function() {
if (document.getElementById("title").value.length < 1) {
document.getElementById("submit").disabled = true;
}
document.getElementById("preview-title").textContent = document.getElementById("title").value;
document.getElementById("rst").value = editor.getValue();
if (timer !== undefined) {
clearTimeout(timer);
}
timer = setTimeout(do_preview, 1000);
};
function refreshLock() {
console.log("Refreshing lock");
let xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function() {
if (this.readyState === 4 && this.status === 204) {
console.log("Lock refreshed")
} else if(this.readyState === 4 && this.status !== 204) {
console.log("Could not refresh lock")
}
};
xhttp.open("PATCH", document.location.pathname, true);
xhttp.send();
}
// Lock refreshing
setInterval(refreshLock, (60 * 4) * 1000)
</script>
{% endblock %}
|