rafaelcaricio/moviewyrm
1
0
Fork 0
forked from mirrors/bookwyrm
Code Issues 4 Pull requests Projects Releases Wiki Activity

Fixes review/comment/quote tabs in create status form

Browse source
This commit is contained in:
Mouse Reeve 2020-11-08 18:23:12 -08:00
parent 5c1ed4c9b4
commit b7f8055ede
3 changed files with 34 additions and 8 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

18
bookwyrm/static/js/shared.js
View file

@ -34,6 +34,22 @@ function rate_stars(e) {
function tabChange(e) {
var target = e.target.closest('li')
var identifier = target.getAttribute('data-id');
var parent_element = target.parentElement
var tabs = parent_element.getElementsByTagName('label');
for (i = 0; i < tabs.length; i++) {
var tab = tabs[i].parentElement;
if (tab.getAttribute('data-id') == identifier) {
tab.className += ' is-active';
} else {
tab.className = tab.className.replace('is-active', '');
}
}
}
function nestedTabChange(e) {
var target = e.target.closest('li')
var identifier = target.getAttribute('data-id');
var parent_element = target.parentElement.closest('li').parentElement;
var tabs = parent_element.getElementsByTagName('label');
@ -45,8 +61,6 @@ function tabChange(e) {
tab.className = tab.className.replace('is-active', '');
}
}
var el = document.getElementById(identifier);
}
function ajaxPost(form) {

2
bookwyrm/templates/feed.html
View file

@ -21,7 +21,7 @@
<ul>
{% for book in shelf.books %}
<li class="{% if shelf_counter == 1 and forloop.first %}is-active{% endif %}" data-id="tab-book-{{ book.id }}">
<label for="book-{{ book.id }}" onclick="tabChange(event)"><a>{% include 'snippets/book_cover.html' with book=book size="medium" %}</a></label>
<label for="book-{{ book.id }}" onclick="nestedTabChange(event)"><a>{% include 'snippets/book_cover.html' with book=book size="medium" %}</a></label>
</li>
{% endfor %}
</ul>

22
bookwyrm/templates/snippets/create_status.html
View file

@ -2,15 +2,27 @@
{% load fr_display %}
<div class="tabs is-boxed">
<ul>
<ul role="tablist">
<li class="is-active" data-id="tab-review-{{ book.id }}" data-category="tab-option-{{ book.id }}">
<label for="review-{{ book.id }}" onclick="tabChange(event)"><a>Review</a></label>
<label for="review-{{ book.id }}">
<div onclick="tabChange(event)" role="tab" aria-selected="true" tabindex="0">
<a>Review</a>
</div>
</label>
</li>
<li data-id="tab-comment-{{ book.id }}" data-category="tab-option-{{ book.id }}">
<label for="comment-{{ book.id}}" onclick="tabChange(event)"><a>Comment</a></label>
<label for="comment-{{ book.id}}">
<div onclick="tabChange(event)" role="tab" tabindex="0">
<a>Comment</a>
</div>
</label>
</li>
<li data-id="tab-quotation-{{ book.id }}" data-category="tab-option-{{ book.id }}">
<label for="quote-{{ book.id }}" onclick="tabChange(event)"><a>Quote</a></label>
<label for="quote-{{ book.id }}">
<div onclick="tabChange(event)" role="tab" tabindex="0">
<a>Quote</a>
</div>
</label>
</li>
</ul>
</div>
@ -22,7 +34,7 @@
<div>
<input class="toggle-control" type="radio" name="status-tabs-{{ book.id }}" id="comment-{{ book.id }}">
{% include 'snippets/create_status_form.html' with type="comment" placeholder="Some thougts on '"|add:book.title|add:"'" %}
{% include 'snippets/create_status_form.html' with type="comment" placeholder="Some thoughts on '"|add:book.title|add:"'" %}
</div>
<div>