hp-library/templates/layout.html

144 lines
6.1 KiB
HTML
Raw Normal View History

2019-11-22 18:57:35 +01:00
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Library</title>
<link rel="stylesheet" href="{{ url_for('static', filename='css/main.css') }}">
2019-11-27 13:40:15 +01:00
<!--TEST-->
2019-11-27 19:02:41 +01:00
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.3/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$(".librarian-names").click(function(event){
var thename = $(this).text();
2019-12-20 11:08:19 +01:00
$(".name-elements").empty();
$.getJSON('{{ url_for('static', filename='js/mergedjson.json') }}', function(test) {
// iterate in test[i].librarian to find where the name is present to get the test[i].debris that goes with it
2019-11-27 19:02:41 +01:00
var alldocs = [];
for (var i = 0; i < test.length; ++i) {
var item = test[i];
if(item.librarian.includes(thename)){
2019-12-20 11:08:19 +01:00
ledocument = item.debrispath;
2020-05-08 02:36:23 +02:00
lelibrarian = item.librarian;
2019-12-20 11:08:19 +01:00
//put ledocument into li and nest inside ul
var extension = ledocument.replace(/^.*\./, '');
console.log(ledocument);
if ((extension=="jpg") || (extension=="jpeg") || (extension=="png") || (extension=="gif") || (extension=="tiff")) {
2020-05-08 02:36:23 +02:00
$(".name-elements").append("<li><img class='listed-images' src='/files/"+ledocument+"'>Librarians: "+lelibrarian+"</li>");
2019-12-20 11:08:19 +01:00
}
else if (extension=="pdf") {
2020-05-08 02:36:23 +02:00
$(".name-elements").append("<li><embed class='listed-pdf' src='files/"+ledocument+"'/>Librarians: "+lelibrarian+"</li>");
2019-12-20 11:08:19 +01:00
}
else if (extension=="epub") {
2020-05-08 02:36:23 +02:00
$(".name-elements").append("<li>"+ledocument+lelibrarian+"</li>");
2019-12-20 11:08:19 +01:00
}
else if ((extension=="mp3") || (extension=="wav") || (extension=="m4a")) {
2020-05-08 02:36:23 +02:00
$(".name-elements").append("<li><audio class='listed-audio' controls><source src='files/"+ledocument+"'></audio>Librarians: "+lelibrarian+"</li>");
2019-12-20 11:08:19 +01:00
}
else if ((extension=="mov") || (extension=="mp4")) {
2020-05-08 02:36:23 +02:00
$(".name-elements").append("<li><video class='listed-videos' controls><source src='files/"+ledocument+"'></video>Librarians: "+lelibrarian+"</li>");
2019-12-20 11:08:19 +01:00
}
else if ((extension=="odt") || (extension=="docx")) {
// something for odt and docx
2020-05-08 02:36:23 +02:00
$(".name-elements").append("<li>"+ledocument+lelibrarian+"</li>");
2019-11-27 19:02:41 +01:00
};
};
2019-12-20 11:08:19 +01:00
};
2019-11-27 19:02:41 +01:00
});
2019-12-20 11:08:19 +01:00
});
$(".file-names").click(function(event){
var thefile = $(this).text();
2019-12-20 11:08:19 +01:00
$.getJSON('{{ url_for('static', filename='js/mergedjson.json') }}', function(test) {
$(".name-elements").empty();
// iterate in test[i].librarian to find where the name is present
//to get the test[i].debris that goes with it
var allpeeps = [];
var category = null;
for (var i = 0; i < test.length; ++i) {
var item = test[i];
2019-12-20 11:08:19 +01:00
if(item.debrisname.includes(thefile)){
ledocument = item.debrispath;
2019-12-22 20:36:29 +01:00
// allpeeps.push(ledocument);
var extension = ledocument.replace(/^.*\./, '');
console.log(ledocument);
if ((extension=="jpg") || (extension=="jpeg") || (extension=="png") || (extension=="gif") || (extension=="tiff")) {
$(".name-elements").append("<li><img class='listed-images' src='/files/"+ledocument+"'></li>");
}
else if (extension=="pdf") {
$(".name-elements").append("<li><object class='listed-pdf' data='files/"+ledocument+"'/></li>");
}
else if (extension=="epub") {
$(".name-elements").append("<li>"+ledocument+"</li>");
}
else if ((extension=="mp3") || (extension=="wav") || (extension=="m4a")) {
$(".name-elements").append("<li><audio class='listed-audio' controls><source src='files/"+ledocument+"'></audio></li>");
}
else if ((extension=="mov") || (extension=="mp4")) {
$(".name-elements").append("<li><video class='listed-videos' controls><source src='files/"+ledocument+"'></video></li>");
}
else if ((extension=="odt") || (extension=="docx")) {
// something for odt and docx
$(".name-elements").append("<li>"+ledocument+"</li>");
};
};
category = item.method;
};
2019-12-20 11:08:19 +01:00
});
});
2019-11-27 19:02:41 +01:00
});
</script>
2019-11-27 13:40:15 +01:00
2019-11-22 18:57:35 +01:00
</head>
<body>
<div class="nav-top">
<ul>
2019-12-22 20:36:29 +01:00
<li><a class="nav-button" style="text-align: left;" href="bought">BOUGHT</a></li>
<li><a class="nav-button" style="text-align: center;" href="stolen">STOLEN</a>
<li><a class="nav-button" style="text-align: right;" href="repurposed">REPURPOSED</a>
2019-11-22 18:57:35 +01:00
</ul>
</div>
<div class="main">
<div class="main-column-left">
2019-11-27 13:40:15 +01:00
<div id="listofpeople">
2019-11-22 18:57:35 +01:00
{% for librarian in librarians %}
2019-11-27 19:02:41 +01:00
<!-- <a href="#" class="librarian-names">{{ librarian }}</a> -->
<span class="librarian-names">{{ librarian }}</span>
2019-11-22 18:57:35 +01:00
{% endfor %}
2019-11-27 13:40:15 +01:00
</div>
2019-11-26 13:22:14 +01:00
<br>
2019-11-22 18:57:35 +01:00
2019-11-26 13:22:14 +01:00
<div class="file-names-container">
2019-12-20 11:08:19 +01:00
{% for file in files_without_folders %}
<span class="file-names">{{file}}</span><br>
2019-11-22 18:57:35 +01:00
{% endfor %}
2019-11-26 13:22:14 +01:00
</div>
2019-11-22 18:57:35 +01:00
</div>
2019-11-26 13:22:14 +01:00
2019-11-22 18:57:35 +01:00
<div class="main-column-right">
2019-11-27 19:02:41 +01:00
<a href="{{ url_for('static', filename='realjson.json') }}">test link</a>
2019-12-20 11:08:19 +01:00
<ul class="name-elements">
<p>hello world</p>
</ul>
2019-11-27 13:40:15 +01:00
2019-11-22 18:57:35 +01:00
{% block content %}
{% endblock content %}
</div>
</div>
<div class="nav-bottom">
<ul>
2019-12-22 20:36:29 +01:00
<li><a class="nav-button" style="text-align: left;" href="copied">COPIED</a></li>
<li><a class="nav-button" style="text-align: center;" href="found">FOUND</a></li>
<li><a class="nav-button" style="text-align: right;" href="gift">GIFT</a></li>
2019-11-22 18:57:35 +01:00
</ul>
</div>
</body>
</html>