Compare commits
3 Commits
be467e003d
...
4d0624324e
| Author | SHA1 | Date | |
|---|---|---|---|
| 4d0624324e | |||
| 708513039a | |||
| 52b6ba01e4 |
|
|
@ -4,46 +4,29 @@
|
|||
<meta charset="utf-8">
|
||||
<title>{% block title %}{% endblock %} - Titivillus</title>
|
||||
<link rel="stylesheet" type="text/css" href="{{ static('base.css') }}">
|
||||
<script type="text/javascript" src="{{ static('base.js') }}"></script>
|
||||
<script>
|
||||
function toggleHeaderCookie(state) {
|
||||
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');
|
||||
}
|
||||
}
|
||||
const set_session_url = '{{ url("set_session:index") }}';
|
||||
const csrf_token = '{{ csrf_token }}';
|
||||
</script>
|
||||
{% block head %}{% endblock %}
|
||||
</head>
|
||||
<body>
|
||||
<ul id="header" class="header" style="{% if request.session.get("hide_header") == True %}display:none;{% else %}display:initial;{% endif %}">
|
||||
<li><a onclick="toggleHeader();" href="javascript:void(0);">⏫</a></li>
|
||||
<li><a href="{{ url('homepage:index') }}">Home</a></li>
|
||||
{% block header %}{% endblock %}
|
||||
</ul>
|
||||
<ul id="headerHidden" class="header" style="{% if request.session.get("hide_header") == True %}display:initial;{% else %}display:none;{% endif %}">
|
||||
<li><a onclick="toggleHeader();" href="javascript:void(0);">⏬</a></li>
|
||||
</ul>
|
||||
{#<br /> <!-- TODO: make this more exact. -->#}
|
||||
<div id="pageMessages">
|
||||
<ul class="pageMessages">
|
||||
<div id="globalWrapper">
|
||||
<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 href="{{ url('homepage:index') }}">Home</a></li>
|
||||
{% block header %}{% endblock %}
|
||||
</ul>
|
||||
<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>
|
||||
</ul>
|
||||
<ul id="alerts">
|
||||
{% for message in get_messages(request) %}
|
||||
<li{% if message.tags %} class="{{ message.tags }}"{% endif %}>{{ message }}</li>
|
||||
{% endfor %}
|
||||
</ul>
|
||||
<div id="content">{% block content %}{% endblock %}</div>
|
||||
</div>
|
||||
<div id="content">{% block content %}{% endblock %}</div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
|
|||
|
|
@ -2,6 +2,9 @@
|
|||
{% block title %}{{ quest.title }}{% endblock %}
|
||||
{% block head %}
|
||||
<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>
|
||||
const quest_id = {{ quest.id }};
|
||||
const page_num = {{ page_num }};
|
||||
|
|
@ -24,141 +27,138 @@
|
|||
{% endfor %}
|
||||
</select>
|
||||
</li>
|
||||
<li id="toggleChat"><a onclick="toggle_chat()" href="javascript:void(0);">{% if request.session.get("hide_chat") == True %}←{% else %}→{% endif %}</a></li>
|
||||
{% endblock %}
|
||||
{% block content %}
|
||||
<div id="questContainer">
|
||||
<div id="questPane">
|
||||
<center><h1>{{ quest.title }}</h1></center>
|
||||
<div id="questPosts">
|
||||
{% for post in posts %}
|
||||
{% if post.post_type == "text" %}
|
||||
<div class="questPost textPost">
|
||||
{% elif post.post_type == "dice" %}
|
||||
<div class="questPost dicePost{% if post.dicecall.open %} activePost{% endif %}">
|
||||
{% elif post.post_type == "poll" %}
|
||||
<div class="questPost pollPost{% if post.poll.open %} activePost{% endif %}">
|
||||
{% endif %}
|
||||
<div class="questPostMeta">
|
||||
{{ localtime(post.timestamp).strftime('%Y-%m-%d %H:%M') }}
|
||||
{% if request.user == quest.owner %}
|
||||
{% if post.post_type == "text" %}
|
||||
<br /><a href="javascript:void(0);" id="editPost-{{ post.id }}" onclick="edit_post({{ post.id }})">Edit</a>
|
||||
<a href="javascript:void(0);" id="savePost-{{ post.id }}" onclick="save_post('{{ post.id }}')" style="display:none;">Save</a>
|
||||
{% elif post.post_type == "dice" %}
|
||||
<br /><a href="javascript:void(0);" id="closePost-{{ post.id }}" onclick="close_post_send({{ post.id }})"{% if not post.dicecall.open %} style="display:none;"{% endif %}>Close</a>
|
||||
<a href="javascript:void(0);" id="openPost-{{ post.id }}" onclick="open_post_send({{ post.id }})"{% if post.dicecall.open %} style="display:none;"{% endif %}>Open</a>
|
||||
{% elif post.post_type == "poll" %}
|
||||
<br /><a href="javascript:void(0);" id="closePost-{{ post.id }}" onclick="close_post_send({{ post.id }})"{% if not post.poll.open %} style="display:none;"{% endif %}>Close</a>
|
||||
<a href="javascript:void(0);" id="openPost-{{ post.id }}" onclick="open_post_send({{ post.id }})"{% if post.poll.open %} style="display:none;"{% endif %}>Open</a>
|
||||
{% endif %}
|
||||
{% endif %}
|
||||
</div>
|
||||
<div class="questPostData" id="questPostData-{{ post.id }}">
|
||||
{% if post.post_type == "text" %}
|
||||
{% autoescape false %}
|
||||
{{ post.post_text }}
|
||||
{% endautoescape %}
|
||||
{% elif post.post_type == "dice" %}
|
||||
<h3>{{ post.post_text }} - {% if post.dicecall.open %}Open{% else %}Closed{% endif %}</h3>
|
||||
{% for dice_roll in dice_rolls.filter(dicecall=post.dicecall) %}
|
||||
<div id="questRollId-{{ dice_roll.id }}">
|
||||
<b>Rolled {{ dice_roll.results }} = {{ dice_roll.total }} ({{ dice_roll.roll }}){% if post.dicecall.dice_challenge %} - {% if dice_roll.total >= post.dicecall.dice_challenge %}Pass{% else %}Fail{% endif %}{% endif %}</b>
|
||||
</div>
|
||||
{% endfor %}
|
||||
{% elif post.post_type == "poll" %}
|
||||
<h3>{{ post.post_text }} - {% if post.poll.open %}Open{% else %}Closed{% endif %}</h3>
|
||||
<table class="poll" id="poll-{{ post.id }}">
|
||||
{% for option in poll_options.filter(poll=post.poll).order_by("id") %}
|
||||
<tr id="optionRow-{{ option.id }}">
|
||||
<td class="pollCheckBox">
|
||||
<input type="checkbox" {% if poll_votes.filter(option=option, ip_address=ip_address) %}checked="true"{% endif %} id="pollInput-{{ option.id }}" onchange="vote({{ post.id }}, {{ option.id }})"{% if not post.poll.open %} disabled{% endif %}/>
|
||||
<label for="pollInput-{{ option.id }}"></label>
|
||||
</td>
|
||||
<td class="option_text">{{ option.text }}</td>
|
||||
<td class="optionVotes">{{ poll_votes.filter(option=option).count() }}</td>
|
||||
</tr>
|
||||
{% endfor %}
|
||||
</table>
|
||||
{% if post.poll.open and post.poll.allow_writein %}
|
||||
<div id="writeinContainer-{{ post.id }}">
|
||||
Write-in: <input type="text" id="writeinInput-{{ post.id }}" placeholder="Custom choice..." maxlength="200" /><br />
|
||||
<input type="submit" id="writeinSubmit-{{ post.id }}" value="Submit" onclick="submitWritein({{ post.id }});"/>
|
||||
</div>
|
||||
{% endif %}
|
||||
{% endif %}
|
||||
</div>
|
||||
</div><br />
|
||||
{% endfor %}
|
||||
</div>
|
||||
{% if request.user == quest.owner %}
|
||||
<div id="QMPostPane">
|
||||
<div>
|
||||
<ul id="QMPostTabs">
|
||||
<li><a class="QMPostTab active" href="javascript:void(0);" onclick="openPostTab(event, 'QMPostText')">Text</a></li>
|
||||
<li><a class="QMPostTab" href="javascript:void(0);" onclick="openPostTab(event, 'QMPostDice')">Dice</a></li>
|
||||
<li><a class="QMPostTab" href="javascript:void(0);" onclick="openPostTab(event, 'QMPostPoll')">Poll</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<div id="QMPostText" class="QMPostTabContent" style="display:initial;">
|
||||
<textarea id="postTextArea"></textarea><br />
|
||||
<input type="submit" name="newPost" value="Post" onclick="makePost();"/>
|
||||
</div>
|
||||
<div id="QMPostDice" class="QMPostTabContent" style="display:none;">
|
||||
Dice for the dice god.<br />
|
||||
<form id="QMDicePostForm" action="javascript:void(0);" onsubmit="form_post('QMDicePostForm', 'dice_post');">
|
||||
Dice: <input type="number" name="diceNum" min="1" max="99" required/>
|
||||
d <input type="number" name="diceSides" min="1" max="99" required/>
|
||||
±<input type="number" name="diceMod" min="-999" max="999"/>
|
||||
<input type="checkbox" name="diceStrict"/>
|
||||
<span class="tooltip" title="Only take matching rolls.">Strict</span><br />
|
||||
<input type="checkbox" onclick="document.getElementById('diceChal').disabled=!this.checked;"/>
|
||||
<span class="tooltip" title="Dice challenge">DC:</span>
|
||||
<input type="number" name="diceChal" id="diceChal" min="1" max="999" disabled/><br />
|
||||
<input type="checkbox" onclick="document.getElementById('diceRollsTaken').disabled=!this.checked;"/>
|
||||
<span class="tooltip" title="Automatically close the dice call after this many rolls have been made.">Rolls Taken:</span>
|
||||
<input type="number" name="diceRollsTaken" id="diceRollsTaken" min="1" max="99" disabled/><br />
|
||||
<input type="submit" name="submit" value="Roll 'em"/>
|
||||
</form>
|
||||
</div>
|
||||
<div id="QMPostPoll" class="QMPostTabContent" style="display:none;">
|
||||
The polls are rigged.
|
||||
<form id="QMPollPostForm" action="javascript:void(0);" onsubmit="form_post('QMPollPostForm', 'poll_post');">
|
||||
<a href="javascript:void(0);" id="pollInsertNewOption" onclick="insertPollOption()">[+]</a>
|
||||
<a href="javascript:void(0);" onclick="removePollOption()">[-]</a>
|
||||
<div id="pollOptions">
|
||||
<div><input type="text" name="pollOption-1" class="pollOption" placeholder="Option 1" maxlength="200" /></div>
|
||||
<div><input type="text" name="pollOption-2" class="pollOption" placeholder="Option 2" maxlength="200" /></div>
|
||||
</div>
|
||||
<hr>
|
||||
<input type="checkbox" name="multi_choice" />Allow multiple choices<br />
|
||||
<input type="checkbox" name="allow_writein" />Allow user-created options<br />
|
||||
<input type="submit" name="submit" value="Submit" />
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
<div id="questPane" style="width:{% if request.session.get("hide_chat") == True %}100%{% else %}70%{% endif %};">
|
||||
<center><h1>{{ quest.title }}</h1></center>
|
||||
<div id="questPosts">
|
||||
{% for post in posts %}
|
||||
{% if post.post_type == "text" %}
|
||||
<div class="questPost textPost">
|
||||
{% elif post.post_type == "dice" %}
|
||||
<div class="questPost dicePost{% if post.dicecall.open %} activePost{% endif %}">
|
||||
{% elif post.post_type == "poll" %}
|
||||
<div class="questPost pollPost{% if post.poll.open %} activePost{% endif %}">
|
||||
{% endif %}
|
||||
</div>
|
||||
<br />
|
||||
<br />
|
||||
<div id="chatPane">
|
||||
<h1>Chat</h1>
|
||||
<div id="chatWindow">
|
||||
{% autoescape false %}
|
||||
{% for message in messages %}
|
||||
<div id="msg-{{ message.id }}" class="message">
|
||||
<div class="messageHeader">
|
||||
<span class="messageName">{{ message.user.username or 'Anonymous' }}</span>
|
||||
<span class="messageDate">{{ localtime(message.timestamp).strftime('%Y-%m-%d %H:%M:%S') }}</span>
|
||||
<span class="messageID">No.<a href="javascript:quote('{{ message.id }}')">{{ message.id }}</a></span>
|
||||
</div>
|
||||
<div class="messageContent">{{ message.message }}</div>
|
||||
<div class="questPostMeta">
|
||||
{{ localtime(post.timestamp).strftime('%Y-%m-%d %H:%M') }}
|
||||
{% if request.user == quest.owner %}
|
||||
{% if post.post_type == "text" %}
|
||||
<br /><a href="javascript:void(0);" id="editPost-{{ post.id }}" onclick="edit_post({{ post.id }})">Edit</a>
|
||||
<a href="javascript:void(0);" id="savePost-{{ post.id }}" onclick="save_post('{{ post.id }}')" style="display:none;">Save</a>
|
||||
{% elif post.post_type == "dice" %}
|
||||
<br /><a href="javascript:void(0);" id="closePost-{{ post.id }}" onclick="close_post_send({{ post.id }})"{% if not post.dicecall.open %} style="display:none;"{% endif %}>Close</a>
|
||||
<a href="javascript:void(0);" id="openPost-{{ post.id }}" onclick="open_post_send({{ post.id }})"{% if post.dicecall.open %} style="display:none;"{% endif %}>Open</a>
|
||||
{% elif post.post_type == "poll" %}
|
||||
<br /><a href="javascript:void(0);" id="closePost-{{ post.id }}" onclick="close_post_send({{ post.id }})"{% if not post.poll.open %} style="display:none;"{% endif %}>Close</a>
|
||||
<a href="javascript:void(0);" id="openPost-{{ post.id }}" onclick="open_post_send({{ post.id }})"{% if post.poll.open %} style="display:none;"{% endif %}>Open</a>
|
||||
{% endif %}
|
||||
{% endif %}
|
||||
</div>
|
||||
<hr>
|
||||
{% endfor %}
|
||||
{% endautoescape %}
|
||||
</div>
|
||||
<div id="messageTextDiv"><textarea id="messageTextArea"></textarea></div>
|
||||
<div class="questPostData" id="questPostData-{{ post.id }}">
|
||||
{% if post.post_type == "text" %}
|
||||
{% autoescape false %}
|
||||
{{ post.post_text }}
|
||||
{% endautoescape %}
|
||||
{% elif post.post_type == "dice" %}
|
||||
<h3>{{ post.post_text }} - {% if post.dicecall.open %}Open{% else %}Closed{% endif %}</h3>
|
||||
{% for dice_roll in dice_rolls.filter(dicecall=post.dicecall) %}
|
||||
<div id="questRollId-{{ dice_roll.id }}">
|
||||
<b>Rolled {{ dice_roll.results }} = {{ dice_roll.total }} ({{ dice_roll.roll }}){% if post.dicecall.dice_challenge %} - {% if dice_roll.total >= post.dicecall.dice_challenge %}Pass{% else %}Fail{% endif %}{% endif %}</b>
|
||||
</div>
|
||||
{% endfor %}
|
||||
{% elif post.post_type == "poll" %}
|
||||
<h3>{{ post.post_text }} - {% if post.poll.open %}Open{% else %}Closed{% endif %}</h3>
|
||||
<table class="poll" id="poll-{{ post.id }}">
|
||||
{% for option in poll_options.filter(poll=post.poll).order_by("id") %}
|
||||
<tr id="optionRow-{{ option.id }}">
|
||||
<td class="pollCheckBox">
|
||||
<input type="checkbox" {% if poll_votes.filter(option=option, ip_address=ip_address) %}checked="true"{% endif %} id="pollInput-{{ option.id }}" onchange="vote({{ post.id }}, {{ option.id }})"{% if not post.poll.open %} disabled{% endif %}/>
|
||||
<label for="pollInput-{{ option.id }}"></label>
|
||||
</td>
|
||||
<td class="option_text">{{ option.text }}</td>
|
||||
<td class="optionVotes">{{ poll_votes.filter(option=option).count() }}</td>
|
||||
</tr>
|
||||
{% endfor %}
|
||||
</table>
|
||||
{% if post.poll.open and post.poll.allow_writein %}
|
||||
<div id="writeinContainer-{{ post.id }}">
|
||||
Write-in: <input type="text" id="writeinInput-{{ post.id }}" placeholder="Custom choice..." maxlength="200" /><br />
|
||||
<input type="submit" id="writeinSubmit-{{ post.id }}" value="Submit" onclick="submitWritein({{ post.id }});"/>
|
||||
</div>
|
||||
{% endif %}
|
||||
{% endif %}
|
||||
</div>
|
||||
</div><br>
|
||||
{% endfor %}
|
||||
</div>
|
||||
{% if request.user == quest.owner %}
|
||||
<div id="QMPostPane">
|
||||
<div>
|
||||
<ul id="QMPostTabs">
|
||||
<li><a class="QMPostTab active" href="javascript:void(0);" onclick="openPostTab(event, 'QMPostText')">Text</a></li>
|
||||
<li><a class="QMPostTab" href="javascript:void(0);" onclick="openPostTab(event, 'QMPostDice')">Dice</a></li>
|
||||
<li><a class="QMPostTab" href="javascript:void(0);" onclick="openPostTab(event, 'QMPostPoll')">Poll</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<div id="QMPostText" class="QMPostTabContent" style="display:initial;">
|
||||
<textarea id="postTextArea"></textarea><br />
|
||||
<input type="submit" name="newPost" value="Post" onclick="makePost();"/>
|
||||
</div>
|
||||
<div id="QMPostDice" class="QMPostTabContent" style="display:none;">
|
||||
Dice for the dice god.<br />
|
||||
<form id="QMDicePostForm" action="javascript:void(0);" onsubmit="form_post('QMDicePostForm', 'dice_post');">
|
||||
Dice: <input type="number" name="diceNum" min="1" max="99" required/>
|
||||
d <input type="number" name="diceSides" min="1" max="99" required/>
|
||||
±<input type="number" name="diceMod" min="-999" max="999"/>
|
||||
<input type="checkbox" name="diceStrict"/>
|
||||
<span class="tooltip" title="Only take matching rolls.">Strict</span><br />
|
||||
<input type="checkbox" onclick="document.getElementById('diceChal').disabled=!this.checked;"/>
|
||||
<span class="tooltip" title="Dice challenge">DC:</span>
|
||||
<input type="number" name="diceChal" id="diceChal" min="1" max="999" disabled/><br />
|
||||
<input type="checkbox" onclick="document.getElementById('diceRollsTaken').disabled=!this.checked;"/>
|
||||
<span class="tooltip" title="Automatically close the dice call after this many rolls have been made.">Rolls Taken:</span>
|
||||
<input type="number" name="diceRollsTaken" id="diceRollsTaken" min="1" max="99" disabled/><br />
|
||||
<input type="submit" name="submit" value="Roll 'em"/>
|
||||
</form>
|
||||
</div>
|
||||
<div id="QMPostPoll" class="QMPostTabContent" style="display:none;">
|
||||
The polls are rigged.
|
||||
<form id="QMPollPostForm" action="javascript:void(0);" onsubmit="form_post('QMPollPostForm', 'poll_post');">
|
||||
<a href="javascript:void(0);" id="pollInsertNewOption" onclick="insertPollOption()">[+]</a>
|
||||
<a href="javascript:void(0);" onclick="removePollOption()">[-]</a>
|
||||
<div id="pollOptions">
|
||||
<div><input type="text" name="pollOption-1" class="pollOption" placeholder="Option 1" maxlength="200" /></div>
|
||||
<div><input type="text" name="pollOption-2" class="pollOption" placeholder="Option 2" maxlength="200" /></div>
|
||||
</div>
|
||||
<hr>
|
||||
<input type="checkbox" name="multi_choice" />Allow multiple choices<br />
|
||||
<input type="checkbox" name="allow_writein" />Allow user-created options<br />
|
||||
<input type="submit" name="submit" value="Submit" />
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
<div id="chatPane" style="display:{% if request.session.get("hide_chat") == True %}none{% else %}flex{% endif %};">
|
||||
<h1>Chat</h1>
|
||||
<div id="chatWindow">
|
||||
{% autoescape false %}
|
||||
{% for message in messages %}
|
||||
<div id="msg-{{ message.id }}" class="message">
|
||||
<div class="messageHeader">
|
||||
<span class="messageName">{{ message.user.username or 'Anonymous' }}</span>
|
||||
<span class="messageDate">{{ localtime(message.timestamp).strftime('%Y-%m-%d %H:%M:%S') }}</span>
|
||||
<span class="messageID">No.<a href="javascript:quote('{{ message.id }}')">{{ message.id }}</a></span>
|
||||
</div>
|
||||
<div class="messageContent">{{ message.message }}</div>
|
||||
</div>
|
||||
<hr>
|
||||
{% endfor %}
|
||||
{% endautoescape %}
|
||||
</div>
|
||||
<div id="messageTextDiv"><textarea id="messageTextArea"></textarea></div>
|
||||
</div>
|
||||
<div id="preview" style="display:none;"></div>
|
||||
{% endblock %}
|
||||
|
|
|
|||
|
|
@ -8,14 +8,12 @@ h3 {
|
|||
margin-bottom: 0.5em;
|
||||
}
|
||||
|
||||
#questContainer {
|
||||
display: flex;
|
||||
overflow: auto;
|
||||
}
|
||||
|
||||
#questPane {
|
||||
float: left;
|
||||
box-sizing: border-box;
|
||||
padding-left: 5%;
|
||||
width: 65%;
|
||||
padding-right: 5%;
|
||||
width: 70%;
|
||||
}
|
||||
|
||||
.questPost {
|
||||
|
|
@ -33,60 +31,6 @@ h3 {
|
|||
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 {
|
||||
width: 100%;
|
||||
margin: 0.1em;
|
||||
|
|
@ -153,7 +97,7 @@ h3 {
|
|||
}
|
||||
|
||||
#chatPane {
|
||||
height: 100%;
|
||||
height: calc(100% - var(--header-height));
|
||||
width: 30%;
|
||||
right: 0;
|
||||
position: fixed;
|
||||
|
|
@ -165,7 +109,7 @@ h3 {
|
|||
border: 1px solid #ccc;
|
||||
padding: 0.25em;
|
||||
overflow: auto;
|
||||
flex: 1;
|
||||
flex: auto;
|
||||
}
|
||||
|
||||
.messageContent {
|
||||
|
|
@ -184,16 +128,15 @@ h3 {
|
|||
}
|
||||
|
||||
#messageTextDiv {
|
||||
padding-bottom: 1em;
|
||||
width: 100%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
padding-bottom: 0.25em;
|
||||
}
|
||||
|
||||
#messageTextArea {
|
||||
resize: none;
|
||||
box-sizing: border-box;
|
||||
height: 5em;
|
||||
width: 100%;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
#preview {
|
||||
|
|
|
|||
|
|
@ -247,3 +247,17 @@ 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');
|
||||
}
|
||||
}
|
||||
|
|
|
|||
53
quest/static/questQM.css
Normal file
53
quest/static/questQM.css
Normal file
|
|
@ -0,0 +1,53 @@
|
|||
#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,8 +8,12 @@ def index(request):
|
|||
"""
|
||||
A simple API endpoint for setting certain values in the users session.
|
||||
"""
|
||||
if request.POST.get('hide_header') == 'on':
|
||||
request.session['hide_header'] = True
|
||||
elif request.POST.get('hide_header') == 'off':
|
||||
request.session['hide_header'] = False
|
||||
for key, value in request.POST.items():
|
||||
if key not in ['hide_header', 'hide_chat']:
|
||||
continue
|
||||
if value == 'on':
|
||||
request.session[key] = True
|
||||
elif value == 'off':
|
||||
request.session[key] = False
|
||||
|
||||
return HttpResponse('true')
|
||||
|
|
|
|||
|
|
@ -1,11 +1,25 @@
|
|||
:root {
|
||||
--header-height: 1.25em;
|
||||
}
|
||||
|
||||
body {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
#globalWrapper {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.header {
|
||||
position: fixed;
|
||||
position: sticky;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
list-style-type: none;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
width: 100%;
|
||||
height: var(--header-height);
|
||||
list-style-type: none;
|
||||
background-color: #dddddd;
|
||||
}
|
||||
|
||||
|
|
@ -18,5 +32,14 @@
|
|||
}
|
||||
|
||||
#headerHidden {
|
||||
width: auto;
|
||||
width: 1em;
|
||||
}
|
||||
|
||||
#alerts {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
#content {
|
||||
flex: auto;
|
||||
overflow: auto;
|
||||
}
|
||||
|
|
|
|||
19
static/base.js
Normal file
19
static/base.js
Normal file
|
|
@ -0,0 +1,19 @@
|
|||
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,14 +19,9 @@ Improvements:
|
|||
More options for text posts (lists and so on)
|
||||
More rigorous input checking in events.py
|
||||
New post displays chat message
|
||||
Record email on signup
|
||||
Change urls
|
||||
Poll vote highlights entire option
|
||||
Poll vote doesn't disappear checkbox
|
||||
Total voters per poll
|
||||
Chat archives
|
||||
Only last 100 (50?) chat messages are loaded on page load
|
||||
Adjust quote preview postioning
|
||||
|
||||
Port from old code:
|
||||
Images
|
||||
|
|
|
|||
Loading…
Reference in New Issue
Block a user