Compare commits
No commits in common. "4d0624324e1b5d1dea1bb214cb6882692634b19b" and "be467e003df6c9c24205128a9b0e03cf3ec32b00" have entirely different histories.
4d0624324e
...
be467e003d
|
@ -4,29 +4,46 @@
|
||||||
<meta charset="utf-8">
|
<meta charset="utf-8">
|
||||||
<title>{% block title %}{% endblock %} - Titivillus</title>
|
<title>{% block title %}{% endblock %} - Titivillus</title>
|
||||||
<link rel="stylesheet" type="text/css" href="{{ static('base.css') }}">
|
<link rel="stylesheet" type="text/css" href="{{ static('base.css') }}">
|
||||||
<script type="text/javascript" src="{{ static('base.js') }}"></script>
|
|
||||||
<script>
|
<script>
|
||||||
const set_session_url = '{{ url("set_session:index") }}';
|
function toggleHeaderCookie(state) {
|
||||||
const csrf_token = '{{ csrf_token }}';
|
let xhr = new XMLHttpRequest();
|
||||||
|
xhr.open('POST', '{{ url("set_session:index") }}', true);
|
||||||
|
xhr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
|
||||||
|
xhr.setRequestHeader('X-CSRFToken', '{{ csrf_token }}');
|
||||||
|
xhr.send('hide_header=' + state);
|
||||||
|
}
|
||||||
|
function toggleHeader() {
|
||||||
|
if (document.getElementById('header').style.display == 'initial') {
|
||||||
|
document.getElementById('header').style.display = 'none';
|
||||||
|
document.getElementById('headerHidden').style.display = 'initial';
|
||||||
|
toggleHeaderCookie('on');
|
||||||
|
}
|
||||||
|
else {
|
||||||
|
document.getElementById('header').style.display = 'initial';
|
||||||
|
document.getElementById('headerHidden').style.display = 'none';
|
||||||
|
toggleHeaderCookie('off');
|
||||||
|
}
|
||||||
|
}
|
||||||
</script>
|
</script>
|
||||||
{% block head %}{% endblock %}
|
{% block head %}{% endblock %}
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
<div id="globalWrapper">
|
|
||||||
<ul id="header" class="header" style="{% if request.session.get("hide_header") == True %}display:none;{% else %}display:initial;{% endif %}">
|
<ul id="header" class="header" style="{% if request.session.get("hide_header") == True %}display:none;{% else %}display:initial;{% endif %}">
|
||||||
<li><a onclick="toggle_header();" href="javascript:void(0);">↑</a></li>
|
<li><a onclick="toggleHeader();" href="javascript:void(0);">⏫</a></li>
|
||||||
<li><a href="{{ url('homepage:index') }}">Home</a></li>
|
<li><a href="{{ url('homepage:index') }}">Home</a></li>
|
||||||
{% block header %}{% endblock %}
|
{% block header %}{% endblock %}
|
||||||
</ul>
|
</ul>
|
||||||
<ul id="headerHidden" class="header" style="{% if request.session.get("hide_header") == True %}display:initial;{% else %}display:none;{% endif %}">
|
<ul id="headerHidden" class="header" style="{% if request.session.get("hide_header") == True %}display:initial;{% else %}display:none;{% endif %}">
|
||||||
<li><a onclick="toggle_header();" href="javascript:void(0);">↓</a></li>
|
<li><a onclick="toggleHeader();" href="javascript:void(0);">⏬</a></li>
|
||||||
</ul>
|
</ul>
|
||||||
<ul id="alerts">
|
{#<br /> <!-- TODO: make this more exact. -->#}
|
||||||
|
<div id="pageMessages">
|
||||||
|
<ul class="pageMessages">
|
||||||
{% for message in get_messages(request) %}
|
{% for message in get_messages(request) %}
|
||||||
<li{% if message.tags %} class="{{ message.tags }}"{% endif %}>{{ message }}</li>
|
<li{% if message.tags %} class="{{ message.tags }}"{% endif %}>{{ message }}</li>
|
||||||
{% endfor %}
|
{% endfor %}
|
||||||
</ul>
|
</ul>
|
||||||
<div id="content">{% block content %}{% endblock %}</div>
|
|
||||||
</div>
|
</div>
|
||||||
|
<div id="content">{% block content %}{% endblock %}</div>
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
|
|
|
@ -2,9 +2,6 @@
|
||||||
{% block title %}{{ quest.title }}{% endblock %}
|
{% block title %}{{ quest.title }}{% endblock %}
|
||||||
{% block head %}
|
{% block head %}
|
||||||
<link rel="stylesheet" type="text/css" href="{{ static('quest.css') }}">
|
<link rel="stylesheet" type="text/css" href="{{ static('quest.css') }}">
|
||||||
{% if request.user == quest.owner %}
|
|
||||||
<link rel="stylesheet" type="text/css" href="{{ static('questQM.css') }}">
|
|
||||||
{% endif %}
|
|
||||||
<script>
|
<script>
|
||||||
const quest_id = {{ quest.id }};
|
const quest_id = {{ quest.id }};
|
||||||
const page_num = {{ page_num }};
|
const page_num = {{ page_num }};
|
||||||
|
@ -27,10 +24,10 @@
|
||||||
{% endfor %}
|
{% endfor %}
|
||||||
</select>
|
</select>
|
||||||
</li>
|
</li>
|
||||||
<li id="toggleChat"><a onclick="toggle_chat()" href="javascript:void(0);">{% if request.session.get("hide_chat") == True %}←{% else %}→{% endif %}</a></li>
|
|
||||||
{% endblock %}
|
{% endblock %}
|
||||||
{% block content %}
|
{% block content %}
|
||||||
<div id="questPane" style="width:{% if request.session.get("hide_chat") == True %}100%{% else %}70%{% endif %};">
|
<div id="questContainer">
|
||||||
|
<div id="questPane">
|
||||||
<center><h1>{{ quest.title }}</h1></center>
|
<center><h1>{{ quest.title }}</h1></center>
|
||||||
<div id="questPosts">
|
<div id="questPosts">
|
||||||
{% for post in posts %}
|
{% for post in posts %}
|
||||||
|
@ -90,7 +87,7 @@
|
||||||
{% endif %}
|
{% endif %}
|
||||||
{% endif %}
|
{% endif %}
|
||||||
</div>
|
</div>
|
||||||
</div><br>
|
</div><br />
|
||||||
{% endfor %}
|
{% endfor %}
|
||||||
</div>
|
</div>
|
||||||
{% if request.user == quest.owner %}
|
{% if request.user == quest.owner %}
|
||||||
|
@ -141,7 +138,9 @@
|
||||||
</div>
|
</div>
|
||||||
{% endif %}
|
{% endif %}
|
||||||
</div>
|
</div>
|
||||||
<div id="chatPane" style="display:{% if request.session.get("hide_chat") == True %}none{% else %}flex{% endif %};">
|
<br />
|
||||||
|
<br />
|
||||||
|
<div id="chatPane">
|
||||||
<h1>Chat</h1>
|
<h1>Chat</h1>
|
||||||
<div id="chatWindow">
|
<div id="chatWindow">
|
||||||
{% autoescape false %}
|
{% autoescape false %}
|
||||||
|
@ -160,5 +159,6 @@
|
||||||
</div>
|
</div>
|
||||||
<div id="messageTextDiv"><textarea id="messageTextArea"></textarea></div>
|
<div id="messageTextDiv"><textarea id="messageTextArea"></textarea></div>
|
||||||
</div>
|
</div>
|
||||||
|
</div>
|
||||||
<div id="preview" style="display:none;"></div>
|
<div id="preview" style="display:none;"></div>
|
||||||
{% endblock %}
|
{% endblock %}
|
||||||
|
|
|
@ -8,12 +8,14 @@ h3 {
|
||||||
margin-bottom: 0.5em;
|
margin-bottom: 0.5em;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
#questContainer {
|
||||||
|
display: flex;
|
||||||
|
overflow: auto;
|
||||||
|
}
|
||||||
|
|
||||||
#questPane {
|
#questPane {
|
||||||
float: left;
|
|
||||||
box-sizing: border-box;
|
|
||||||
padding-left: 5%;
|
padding-left: 5%;
|
||||||
padding-right: 5%;
|
width: 65%;
|
||||||
width: 70%;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.questPost {
|
.questPost {
|
||||||
|
@ -31,6 +33,60 @@ h3 {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
#QMPostPane {
|
||||||
|
display: flex;
|
||||||
|
}
|
||||||
|
|
||||||
|
.editPostText {
|
||||||
|
width: 100%;
|
||||||
|
box-sizing: border-box;
|
||||||
|
}
|
||||||
|
|
||||||
|
#QMPostTabs {
|
||||||
|
display: inline-block;
|
||||||
|
list-style-type: none;
|
||||||
|
padding: 0;
|
||||||
|
margin: 0;
|
||||||
|
background-color: #f1f1f1;
|
||||||
|
height: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.QMPostTab {
|
||||||
|
display: block;
|
||||||
|
padding: 8px 16px;
|
||||||
|
text-decoration: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.QMPostTab:hover {
|
||||||
|
background-color: #555;
|
||||||
|
color: white;
|
||||||
|
}
|
||||||
|
|
||||||
|
.QMPostTab.active {
|
||||||
|
background-color: #555;
|
||||||
|
color: white;
|
||||||
|
}
|
||||||
|
|
||||||
|
.QMPostTabContent {
|
||||||
|
flex: auto;
|
||||||
|
padding: 0px 12px;
|
||||||
|
border: 1px solid #ccc;
|
||||||
|
border-left: none;
|
||||||
|
width: 100px;
|
||||||
|
}
|
||||||
|
|
||||||
|
#postTextArea {
|
||||||
|
max-width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tooltip {
|
||||||
|
border-bottom: 1px dotted black;
|
||||||
|
}
|
||||||
|
|
||||||
|
#QMPollPostForm a {
|
||||||
|
text-decoration: none;
|
||||||
|
}
|
||||||
|
|
||||||
.pollOption {
|
.pollOption {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
margin: 0.1em;
|
margin: 0.1em;
|
||||||
|
@ -97,7 +153,7 @@ h3 {
|
||||||
}
|
}
|
||||||
|
|
||||||
#chatPane {
|
#chatPane {
|
||||||
height: calc(100% - var(--header-height));
|
height: 100%;
|
||||||
width: 30%;
|
width: 30%;
|
||||||
right: 0;
|
right: 0;
|
||||||
position: fixed;
|
position: fixed;
|
||||||
|
@ -109,7 +165,7 @@ h3 {
|
||||||
border: 1px solid #ccc;
|
border: 1px solid #ccc;
|
||||||
padding: 0.25em;
|
padding: 0.25em;
|
||||||
overflow: auto;
|
overflow: auto;
|
||||||
flex: auto;
|
flex: 1;
|
||||||
}
|
}
|
||||||
|
|
||||||
.messageContent {
|
.messageContent {
|
||||||
|
@ -128,15 +184,16 @@ h3 {
|
||||||
}
|
}
|
||||||
|
|
||||||
#messageTextDiv {
|
#messageTextDiv {
|
||||||
padding-bottom: 0.25em;
|
padding-bottom: 1em;
|
||||||
|
width: 100%;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
}
|
}
|
||||||
|
|
||||||
#messageTextArea {
|
#messageTextArea {
|
||||||
resize: none;
|
resize: none;
|
||||||
box-sizing: border-box;
|
box-sizing: border-box;
|
||||||
height: 5em;
|
height: 5em;
|
||||||
width: 100%;
|
|
||||||
padding: 0;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
#preview {
|
#preview {
|
||||||
|
|
|
@ -247,17 +247,3 @@ function open_post(post_id) {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
function toggle_chat() {
|
|
||||||
if (document.getElementById('chatPane').style.display == 'flex') {
|
|
||||||
document.getElementById('chatPane').style.display = 'none';
|
|
||||||
document.getElementById('questPane').style.width = '100%';
|
|
||||||
document.getElementById('toggleChat').firstChild.innerText = '←';
|
|
||||||
toggle_cookie('hide_chat', 'on');
|
|
||||||
}
|
|
||||||
else {
|
|
||||||
document.getElementById('chatPane').style.display = 'flex';
|
|
||||||
document.getElementById('questPane').style.width = '70%';
|
|
||||||
document.getElementById('toggleChat').firstChild.innerText = '→';
|
|
||||||
toggle_cookie('hide_chat', 'off');
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
|
@ -1,53 +0,0 @@
|
||||||
#QMPostPane {
|
|
||||||
display: flex;
|
|
||||||
}
|
|
||||||
|
|
||||||
.editPostText {
|
|
||||||
width: 100%;
|
|
||||||
box-sizing: border-box;
|
|
||||||
}
|
|
||||||
|
|
||||||
#QMPostTabs {
|
|
||||||
display: inline-block;
|
|
||||||
list-style-type: none;
|
|
||||||
padding: 0;
|
|
||||||
margin: 0;
|
|
||||||
background-color: #f1f1f1;
|
|
||||||
height: 100%;
|
|
||||||
}
|
|
||||||
|
|
||||||
.QMPostTab {
|
|
||||||
display: block;
|
|
||||||
padding: 8px 16px;
|
|
||||||
text-decoration: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
.QMPostTab:hover {
|
|
||||||
background-color: #555;
|
|
||||||
color: white;
|
|
||||||
}
|
|
||||||
|
|
||||||
.QMPostTab.active {
|
|
||||||
background-color: #555;
|
|
||||||
color: white;
|
|
||||||
}
|
|
||||||
|
|
||||||
.QMPostTabContent {
|
|
||||||
flex: auto;
|
|
||||||
padding: 0px 12px;
|
|
||||||
border: 1px solid #ccc;
|
|
||||||
border-left: none;
|
|
||||||
width: 100px;
|
|
||||||
}
|
|
||||||
|
|
||||||
#postTextArea {
|
|
||||||
max-width: 100%;
|
|
||||||
}
|
|
||||||
|
|
||||||
.tooltip {
|
|
||||||
border-bottom: 1px dotted black;
|
|
||||||
}
|
|
||||||
|
|
||||||
#QMPollPostForm a {
|
|
||||||
text-decoration: none;
|
|
||||||
}
|
|
|
@ -8,12 +8,8 @@ def index(request):
|
||||||
"""
|
"""
|
||||||
A simple API endpoint for setting certain values in the users session.
|
A simple API endpoint for setting certain values in the users session.
|
||||||
"""
|
"""
|
||||||
for key, value in request.POST.items():
|
if request.POST.get('hide_header') == 'on':
|
||||||
if key not in ['hide_header', 'hide_chat']:
|
request.session['hide_header'] = True
|
||||||
continue
|
elif request.POST.get('hide_header') == 'off':
|
||||||
if value == 'on':
|
request.session['hide_header'] = False
|
||||||
request.session[key] = True
|
|
||||||
elif value == 'off':
|
|
||||||
request.session[key] = False
|
|
||||||
|
|
||||||
return HttpResponse('true')
|
return HttpResponse('true')
|
||||||
|
|
|
@ -1,25 +1,11 @@
|
||||||
:root {
|
|
||||||
--header-height: 1.25em;
|
|
||||||
}
|
|
||||||
|
|
||||||
body {
|
|
||||||
margin: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
#globalWrapper {
|
|
||||||
display: flex;
|
|
||||||
flex-direction: column;
|
|
||||||
height: 100%;
|
|
||||||
}
|
|
||||||
|
|
||||||
.header {
|
.header {
|
||||||
position: sticky;
|
position: fixed;
|
||||||
top: 0;
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
width: 100%;
|
||||||
|
list-style-type: none;
|
||||||
margin: 0;
|
margin: 0;
|
||||||
padding: 0;
|
padding: 0;
|
||||||
width: 100%;
|
|
||||||
height: var(--header-height);
|
|
||||||
list-style-type: none;
|
|
||||||
background-color: #dddddd;
|
background-color: #dddddd;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -32,14 +18,5 @@ body {
|
||||||
}
|
}
|
||||||
|
|
||||||
#headerHidden {
|
#headerHidden {
|
||||||
width: 1em;
|
width: auto;
|
||||||
}
|
|
||||||
|
|
||||||
#alerts {
|
|
||||||
margin: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
#content {
|
|
||||||
flex: auto;
|
|
||||||
overflow: auto;
|
|
||||||
}
|
}
|
||||||
|
|
|
@ -1,19 +0,0 @@
|
||||||
function toggle_cookie(cookie, state) {
|
|
||||||
let xhr = new XMLHttpRequest();
|
|
||||||
xhr.open('POST', set_session_url, true);
|
|
||||||
xhr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
|
|
||||||
xhr.setRequestHeader('X-CSRFToken', csrf_token);
|
|
||||||
xhr.send(cookie + '=' + state);
|
|
||||||
}
|
|
||||||
function toggle_header() {
|
|
||||||
if (document.getElementById('header').style.display == 'initial') {
|
|
||||||
document.getElementById('header').style.display = 'none';
|
|
||||||
document.getElementById('headerHidden').style.display = 'initial';
|
|
||||||
toggle_cookie('hide_header', 'on');
|
|
||||||
}
|
|
||||||
else {
|
|
||||||
document.getElementById('header').style.display = 'initial';
|
|
||||||
document.getElementById('headerHidden').style.display = 'none';
|
|
||||||
toggle_cookie('hide_header', 'off');
|
|
||||||
}
|
|
||||||
}
|
|
5
todo
5
todo
|
@ -19,9 +19,14 @@ Improvements:
|
||||||
More options for text posts (lists and so on)
|
More options for text posts (lists and so on)
|
||||||
More rigorous input checking in events.py
|
More rigorous input checking in events.py
|
||||||
New post displays chat message
|
New post displays chat message
|
||||||
|
Record email on signup
|
||||||
|
Change urls
|
||||||
Poll vote highlights entire option
|
Poll vote highlights entire option
|
||||||
Poll vote doesn't disappear checkbox
|
Poll vote doesn't disappear checkbox
|
||||||
Total voters per poll
|
Total voters per poll
|
||||||
Chat archives
|
Chat archives
|
||||||
Only last 100 (50?) chat messages are loaded on page load
|
Only last 100 (50?) chat messages are loaded on page load
|
||||||
Adjust quote preview postioning
|
Adjust quote preview postioning
|
||||||
|
|
||||||
|
Port from old code:
|
||||||
|
Images
|
||||||
|
|
Loading…
Reference in New Issue
Block a user