2016-09-18 08:33:46 +00:00
|
|
|
<!DOCTYPE html5>
|
|
|
|
|
<html>
|
|
|
|
|
<head>
|
2016-11-07 02:00:30 +00:00
|
|
|
{% import "photo_card.html" as photo_card %}
|
2016-09-18 08:33:46 +00:00
|
|
|
{% import "header.html" as header %}
|
2017-03-11 01:08:38 +00:00
|
|
|
<title>Album {{album.display_name}}</title>
|
2016-09-18 08:33:46 +00:00
|
|
|
<meta charset="UTF-8">
|
|
|
|
|
<link rel="stylesheet" href="/static/common.css">
|
2017-04-23 04:38:23 +00:00
|
|
|
<script src="/static/common.js"></script>
|
2016-11-27 09:06:11 +00:00
|
|
|
|
2016-09-18 08:33:46 +00:00
|
|
|
<style>
|
2016-12-14 21:26:42 +00:00
|
|
|
p
|
|
|
|
|
{
|
|
|
|
|
word-break: break-word;
|
|
|
|
|
}
|
2016-09-18 08:33:46 +00:00
|
|
|
#content_body
|
|
|
|
|
{
|
|
|
|
|
/* overriding common.css here */
|
|
|
|
|
display: block;
|
|
|
|
|
}
|
2017-04-23 04:38:23 +00:00
|
|
|
#title_editor,
|
|
|
|
|
#description_editor
|
|
|
|
|
{
|
|
|
|
|
width: 100%;
|
|
|
|
|
max-width: 800px;
|
|
|
|
|
}
|
2017-05-13 22:26:34 +00:00
|
|
|
#description_text
|
2017-04-23 04:38:23 +00:00
|
|
|
{
|
2017-07-17 00:28:06 +00:00
|
|
|
font-family: initial;
|
2017-05-13 22:26:34 +00:00
|
|
|
padding: 8px;
|
|
|
|
|
background-color: rgba(0, 0, 0, 0.1);
|
2017-04-23 04:38:23 +00:00
|
|
|
}
|
2017-05-13 22:26:34 +00:00
|
|
|
#description_editor textarea
|
2017-04-23 04:38:23 +00:00
|
|
|
{
|
2017-05-13 22:26:34 +00:00
|
|
|
width: 100%;
|
2017-04-23 04:38:23 +00:00
|
|
|
}
|
2016-09-18 08:33:46 +00:00
|
|
|
</style>
|
2016-11-27 09:06:11 +00:00
|
|
|
</head>
|
|
|
|
|
|
2016-09-18 08:33:46 +00:00
|
|
|
|
|
|
|
|
<body>
|
2016-12-18 13:12:14 +00:00
|
|
|
{{header.make_header(session=session)}}
|
2016-09-18 08:33:46 +00:00
|
|
|
<div id="content_body">
|
2017-07-14 06:28:51 +00:00
|
|
|
<h2>
|
|
|
|
|
<span data-editor-id="title" data-editor-placeholder="title" id="title_text">
|
2017-06-15 04:45:20 +00:00
|
|
|
{%- if album.title -%}
|
|
|
|
|
{{album.title}}
|
|
|
|
|
{%- else -%}
|
|
|
|
|
Album {{album.id}}
|
|
|
|
|
{%- endif -%}
|
2017-07-14 06:28:51 +00:00
|
|
|
</span>
|
2017-04-23 04:38:23 +00:00
|
|
|
</h2>
|
2017-07-17 00:28:06 +00:00
|
|
|
<pre
|
|
|
|
|
id="description_text"
|
|
|
|
|
data-editor-id="description"
|
|
|
|
|
data-editor-placeholder="description"
|
|
|
|
|
{% if album.description == "" %}class="hidden"{% endif %}
|
|
|
|
|
>
|
|
|
|
|
{{-album.description-}}
|
|
|
|
|
</pre>
|
2017-04-23 04:38:23 +00:00
|
|
|
|
2017-04-01 04:48:27 +00:00
|
|
|
{% set viewparam = "?view=list" if view == "list" else "" %}
|
2017-04-23 04:38:23 +00:00
|
|
|
{% set parent = album.parent() %}
|
2016-09-18 08:33:46 +00:00
|
|
|
{% if parent %}
|
2017-04-01 04:48:27 +00:00
|
|
|
<h3>Parent: <a href="/album/{{parent.id}}{{viewparam}}">{{parent.display_name}}</a></h3>
|
2016-11-06 00:58:37 +00:00
|
|
|
{% else %}
|
|
|
|
|
<h3>Parent: <a href="/albums">Albums</a></h3>
|
2016-09-18 08:33:46 +00:00
|
|
|
{% endif %}
|
2017-04-23 04:38:23 +00:00
|
|
|
|
2016-12-21 00:33:40 +00:00
|
|
|
{% set sub_albums = album.children() %}
|
2016-09-18 08:33:46 +00:00
|
|
|
<h3>Sub-albums</h3>
|
|
|
|
|
<ul>
|
2017-02-05 02:30:02 +00:00
|
|
|
{% for sub_album in sub_albums|sort(attribute='title') %}
|
2017-05-13 23:13:26 +00:00
|
|
|
<li><a href="/album/{{sub_album.id}}{{viewparam}}">{{sub_album.display_name}}</a></li>
|
2016-09-18 08:33:46 +00:00
|
|
|
{% endfor %}
|
2017-05-13 23:13:26 +00:00
|
|
|
<li><button class="green_button" onclick="var parent='{{album.id}}'; create_album_and_follow(parent);">Create child</button></li>
|
2016-09-18 08:33:46 +00:00
|
|
|
</ul>
|
2017-04-23 04:38:23 +00:00
|
|
|
|
2016-12-24 03:49:51 +00:00
|
|
|
{% set photos = album.photos() %}
|
2016-09-18 08:33:46 +00:00
|
|
|
{% if photos %}
|
2017-03-31 01:56:27 +00:00
|
|
|
<h3>Photos</h3>
|
|
|
|
|
{% if view != "list" %}
|
|
|
|
|
<a href="?view=list">List view</a>
|
|
|
|
|
{% else %}
|
|
|
|
|
<a href="?view=grid">Grid view</a>
|
|
|
|
|
{% endif %}
|
|
|
|
|
<ul>
|
2016-09-18 08:33:46 +00:00
|
|
|
{% for photo in photos %}
|
2017-03-31 01:56:27 +00:00
|
|
|
{{photo_card.create_photo_card(photo, view=view)}}
|
2016-09-18 08:33:46 +00:00
|
|
|
{% endfor %}
|
2017-03-31 01:56:27 +00:00
|
|
|
</ul>
|
2016-09-18 08:33:46 +00:00
|
|
|
{% endif %}
|
2017-05-13 22:25:31 +00:00
|
|
|
<p>
|
|
|
|
|
{% if photos or sub_albums %}
|
|
|
|
|
Download:
|
|
|
|
|
{% if photos %}
|
|
|
|
|
<a href="/album/{{album.id}}.zip?recursive=no">
|
|
|
|
|
These files ({{album.sum_bytes(recurse=False, string=True)}})
|
|
|
|
|
</a>
|
|
|
|
|
{% endif %}
|
|
|
|
|
{% if photos and sub_albums %}—{% endif %}
|
|
|
|
|
{% if sub_albums %}
|
|
|
|
|
<a href="/album/{{album.id}}.zip?recursive=yes">
|
|
|
|
|
Include children ({{album.sum_bytes(recurse=True, string=True)}})
|
|
|
|
|
</a>
|
|
|
|
|
{% endif %}
|
|
|
|
|
{% endif %}
|
|
|
|
|
</p>
|
2016-09-18 08:33:46 +00:00
|
|
|
</div>
|
|
|
|
|
</body>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<script type="text/javascript">
|
2017-04-23 04:38:23 +00:00
|
|
|
var blank_title_text = "Album {{album.id}}";
|
|
|
|
|
|
2017-07-14 06:32:14 +00:00
|
|
|
function on_open(editor, edit_element_map, display_element_map)
|
2017-05-06 04:17:13 +00:00
|
|
|
{
|
2017-07-14 06:32:14 +00:00
|
|
|
if (display_element_map["title"].innerText == blank_title_text)
|
2017-04-23 04:38:23 +00:00
|
|
|
{
|
2017-07-14 06:32:14 +00:00
|
|
|
display_element_map["title"].innerText = "";
|
2017-04-23 04:38:23 +00:00
|
|
|
}
|
2017-06-15 04:45:20 +00:00
|
|
|
editor.open();
|
2017-07-14 06:32:14 +00:00
|
|
|
edit_element_map["title"].focus();
|
2017-04-23 04:38:23 +00:00
|
|
|
}
|
|
|
|
|
|
2017-07-14 06:32:14 +00:00
|
|
|
function on_save(editor, edit_element_map, display_element_map)
|
2017-04-23 04:38:23 +00:00
|
|
|
{
|
2017-07-14 06:32:14 +00:00
|
|
|
var title_editor = edit_element_map["title"];
|
|
|
|
|
var description_editor = edit_element_map["description"];
|
2017-05-06 04:17:13 +00:00
|
|
|
|
2017-06-15 04:45:20 +00:00
|
|
|
editor.show_spinner();
|
|
|
|
|
function callback()
|
2017-05-06 04:17:13 +00:00
|
|
|
{
|
2017-06-15 04:45:20 +00:00
|
|
|
editor.hide_spinner();
|
|
|
|
|
editor.save();
|
|
|
|
|
if (title_text.innerText == "")
|
2017-04-23 04:38:23 +00:00
|
|
|
{
|
2017-06-15 04:45:20 +00:00
|
|
|
document.title = blank_title_text;
|
2017-04-23 04:38:23 +00:00
|
|
|
title_text.innerText = blank_title_text;
|
|
|
|
|
}
|
|
|
|
|
else
|
|
|
|
|
{
|
2017-06-15 04:45:20 +00:00
|
|
|
document.title = "Album " + title_text.innerText;
|
|
|
|
|
}
|
|
|
|
|
if (description_text.innerText == "")
|
|
|
|
|
{
|
|
|
|
|
description_text.classList.add("hidden");
|
2017-04-23 04:38:23 +00:00
|
|
|
}
|
|
|
|
|
}
|
2017-06-15 04:45:20 +00:00
|
|
|
|
|
|
|
|
var url = "/album/{{album.id}}/edit";
|
|
|
|
|
var data = new FormData();
|
|
|
|
|
data.append("title", title_editor.value);
|
|
|
|
|
data.append("description", description_editor.value);
|
|
|
|
|
post(url, data, callback);
|
2017-04-23 04:38:23 +00:00
|
|
|
}
|
2017-06-15 04:45:20 +00:00
|
|
|
|
2017-07-14 06:32:14 +00:00
|
|
|
function on_cancel(editor, edit_element_map, display_element_map)
|
2017-06-15 04:56:47 +00:00
|
|
|
{
|
|
|
|
|
editor.cancel();
|
2017-07-14 06:32:14 +00:00
|
|
|
if (display_element_map["title"].innerText == "")
|
2017-06-15 04:56:47 +00:00
|
|
|
{
|
2017-07-14 06:32:14 +00:00
|
|
|
display_element_map["title"].innerText = blank_title_text;
|
2017-06-15 04:56:47 +00:00
|
|
|
}
|
2017-07-14 06:32:14 +00:00
|
|
|
if (display_element_map["description"].innerText == "")
|
2017-06-15 04:56:47 +00:00
|
|
|
{
|
2017-07-14 06:32:14 +00:00
|
|
|
display_element_map["description"].classList.add("hidden");
|
2017-06-15 04:56:47 +00:00
|
|
|
}
|
|
|
|
|
}
|
2017-06-15 04:45:20 +00:00
|
|
|
|
2017-07-14 06:32:14 +00:00
|
|
|
var title_text = document.getElementById("title_text");
|
|
|
|
|
var description_text = document.getElementById("description_text");
|
2017-06-15 04:45:20 +00:00
|
|
|
var editor = new Editor([title_text, description_text], on_open, on_save, on_cancel);
|
2016-11-27 09:06:11 +00:00
|
|
|
</script>
|
2017-04-23 04:38:23 +00:00
|
|
|
</html>
|
