234 lines
7.8 KiB
HTML
234 lines
7.8 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
|
|
<head>
|
|
{% block title %}<title>Local Library</title>{% endblock %}
|
|
|
|
<meta charset="utf-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
|
|
|
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
|
|
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
|
|
<!-- Compiled and minified CSS -->
|
|
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/materialize/1.0.0-beta/css/materialize.min.css">
|
|
<!-- Compiled and minified JavaScript -->
|
|
<script src="https://cdnjs.cloudflare.com/ajax/libs/materialize/1.0.0-beta/js/materialize.min.js"></script>
|
|
<style>
|
|
p.count {
|
|
color: #FFFFFF;
|
|
background-color: #515151;
|
|
border: 1px #303030;
|
|
border-radius: 0.5rem;
|
|
padding: .2rem .25rem;
|
|
margin: 0.1rem 0.1rem .1rem;
|
|
|
|
}
|
|
|
|
table {
|
|
width: 100%;
|
|
table-layout: fixed;
|
|
}
|
|
|
|
th {
|
|
text-align: center;
|
|
}
|
|
|
|
.title {
|
|
width: 30%;
|
|
}
|
|
|
|
.author {
|
|
width: 20%;
|
|
}
|
|
|
|
.rating {
|
|
width: 5%;
|
|
}
|
|
|
|
.tags {
|
|
width: 25%;
|
|
}
|
|
|
|
.added {
|
|
width: 10%;
|
|
}
|
|
|
|
.published {
|
|
width: 10%;
|
|
}
|
|
</style>
|
|
</head>
|
|
|
|
<body>
|
|
|
|
|
|
|
|
<div class="navbar-fixed">
|
|
<nav>
|
|
<div class="nav-wrapper row green darken-1">
|
|
|
|
<ul class="right">
|
|
{% if user.is_authenticated %}
|
|
<li class="active"><a href="{{user.get_absolute_url}}"> {{ user.get_username }}</a></li>
|
|
<li><a href="{% url 'logout'%}?next={{request.path}}">Logout</a></li>
|
|
</ul>
|
|
{% load cache %}
|
|
{% cache 500 sidebar request.user.username %}
|
|
<!--Maybe i'm retarded but this is not caching versions per user-->
|
|
<ul class="left">
|
|
<li><a href="{% url 'books' %}">Books</a></li>
|
|
<li><a class="dropdown-trigger" href={% url 'authors' %} data-target="dropdown-authors">Authors<i
|
|
class="material-icons right">arrow_drop_down</i></a></li>
|
|
<li><a class="dropdown-trigger" href={% url "ratings" %} data-target="dropdown-ratings">Ratings<i
|
|
class="material-icons right">arrow_drop_down</i></a></li>
|
|
<li><a class="dropdown-trigger" href={% url "tags" %} data-target="dropdown-tags">Tags<i
|
|
class="material-icons right">arrow_drop_down</i></a></li>
|
|
|
|
<li><a class="dropdown-trigger" href={% url "series" %} data-target="dropdown-series">Series<i
|
|
class="material-icons right">arrow_drop_down</i></a></li>
|
|
|
|
<li><a class="dropdown-trigger" href={% url "publishers" %} data-target="dropdown-pubishers">Publishers<i
|
|
class="material-icons right">arrow_drop_down</i></a></li>
|
|
|
|
<li><a href="{% url 'search' %}">Advanced search</a></li>
|
|
<li>
|
|
<!-- stefan, this div. can we have this int the navbar? -->
|
|
<div class="container">
|
|
<form action="{% url 'results' %}" method="get" style="padding-top:2em">
|
|
<label for="generic"></label>
|
|
<input id="generic" type="text" name="generic" value="">
|
|
<button class="waves-effect waves-light btn green accent-4" type="submit">search</button>
|
|
</form>
|
|
</div>
|
|
<!-- this is the end of the div, stefan -->
|
|
</li>
|
|
</ul>
|
|
<ul id="dropdown-authors" class="dropdown-content">
|
|
{% for author in unique_authors %}
|
|
<li><a href="{{author.get_absolute_url}}">{{author}}</a></li>
|
|
{% endfor %}
|
|
</ul>
|
|
<ul id="dropdown-ratings" class="dropdown-content">
|
|
{% for rating in unique_ratings %}
|
|
<li><a href="{{rating.get_absolute_url}}">{{rating}}</a></li>
|
|
{% endfor %}
|
|
</ul>
|
|
<ul id="dropdown-tags" class="dropdown-content">
|
|
{% for tag in unique_tags %}
|
|
<li><a href="{{tag.get_absolute_url}}">{{tag}} ({{tag.num_books}})</a></li>
|
|
{% endfor %}
|
|
</ul>
|
|
|
|
<ul id="dropdown-series" class="dropdown-content">
|
|
{% for tag in unique_series %}
|
|
<li><a href="{{tag.get_absolute_url}}">{{tag}} ({{tag.num_books}})</a></li>
|
|
{% endfor %}
|
|
</ul>
|
|
<ul id="dropdown-pubishers" class="dropdown-content">
|
|
{% for pub in unique_publishers %}
|
|
<!-- stefan here's my shit count -->
|
|
<li><a href="{{pub.get_absolute_url}}">{{pub}} <p class="count">{{pub.num_books}}</p> </a> </li>
|
|
{% endfor %}
|
|
</ul>
|
|
{% endcache %}
|
|
{% else %}
|
|
<li><a href="{% url 'sign-up'%}?next={{request.path}}">Sign up</a></li>
|
|
<li><a href="{% url 'login'%}?next={{request.path}}">Login</a></li>
|
|
</ul>
|
|
{% endif %}
|
|
</div>
|
|
|
|
</nav>
|
|
</div>
|
|
<script>
|
|
$(".dropdown-trigger").dropdown({
|
|
hover: true,
|
|
constrainWidth: false,
|
|
coverTrigger: false
|
|
});
|
|
</script>
|
|
|
|
{% if user.is_authenticated %}
|
|
{% block content %} {% endblock %}
|
|
{% else %}
|
|
<div class="valign-wrapper" style="width:100%;height:100%;position: absolute;">
|
|
<div class="valign" style="width:100%;">
|
|
<div class="container">
|
|
<div class="row">
|
|
<div class="col s12 m6 offset-m3">
|
|
<div class="card">
|
|
<div class="card-content center">
|
|
<p>You don't have permission to view this.</p>
|
|
</div>
|
|
<div class="card-action center">
|
|
<a class="waves-effect waves-light btn-large green accent-4"
|
|
href="{% url 'login'%}?next={{request.path}}">Login</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
{% endif %}
|
|
|
|
<script>
|
|
function sortTable(n) {
|
|
var table, rows, switching, i, x, y, shouldSwitch, dir, switchcount = 0;
|
|
table = document.getElementById("books");
|
|
switching = true;
|
|
// Set the sorting direction to ascending:
|
|
dir = "asc";
|
|
/* Make a loop that will continue until
|
|
no switching has been done: */
|
|
while (switching) {
|
|
// Start by saying: no switching is done:
|
|
switching = false;
|
|
rows = table.rows;
|
|
/* Loop through all table rows (except the
|
|
first, which contains table headers): */
|
|
for (i = 1; i < (rows.length - 1); i++) {
|
|
// Start by saying there should be no switching:
|
|
shouldSwitch = false;
|
|
/* Get the two elements you want to compare,
|
|
one from current row and one from the next: */
|
|
x = rows[i].getElementsByTagName("TD")[n];
|
|
y = rows[i + 1].getElementsByTagName("TD")[n];
|
|
/* Check if the two rows should switch place,
|
|
based on the direction, asc or desc: */
|
|
if (dir == "asc") {
|
|
if (x.innerHTML.toLowerCase() > y.innerHTML.toLowerCase()) {
|
|
// If so, mark as a switch and break the loop:
|
|
shouldSwitch = true;
|
|
break;
|
|
}
|
|
} else if (dir == "desc") {
|
|
if (x.innerHTML.toLowerCase() < y.innerHTML.toLowerCase()) {
|
|
// If so, mark as a switch and break the loop:
|
|
shouldSwitch = true;
|
|
break;
|
|
}
|
|
}
|
|
}
|
|
if (shouldSwitch) {
|
|
/* If a switch has been marked, make the switch
|
|
and mark that a switch has been done: */
|
|
rows[i].parentNode.insertBefore(rows[i + 1], rows[i]);
|
|
switching = true;
|
|
// Each time a switch is done, increase this count by 1:
|
|
switchcount++;
|
|
} else {
|
|
/* If no switching has been done AND the direction is "asc",
|
|
set the direction to "desc" and run the while loop again. */
|
|
if (switchcount == 0 && dir == "asc") {
|
|
dir = "desc";
|
|
switching = true;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
</body>
|
|
|
|
</html> |