1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
|
{% import "edit_macros.html" as edit_macros %}
{% extends "base.html" %}
{% block body %}
{% block edit_form_prefix %}
<div class="ui segment">
<h1 class="ui header">Edit File Entity</h1>
<form class="ui form" id="edit_file_form" method="POST" action="{% if editgroup %}/editgroup/{{ editgroup.editgroup_id }}{% endif %}/file/{{ existing_ident }}/edit">
{% endblock %}
{{ form.hidden_tag() }}
<h3 class="ui dividing header">Editgroup Metadata</h3>
{{ edit_macros.editgroup_dropdown(form, editgroup, potential_editgroups) }}
<br>
<h3 class="ui dividing header">File Metadata</h3>
{{ edit_macros.form_field_inline(form.size, "required") }}
{{ edit_macros.form_field_inline(form.mimetype) }}
{{ edit_macros.form_field_inline(form.md5) }}
{{ edit_macros.form_field_inline(form.sha1, "required") }}
{{ edit_macros.form_field_inline(form.sha256) }}
<br>
<h3 class="ui dividing header">Locations (URLs)</h3>
<i>Public web (no login/paywall) locations of this exact file (should match
by hashes).</i>
<br><br>
<div class="list-group" id="url_list" name="url_list">
{% for cform in form.urls %}
<div class="list-group-item ui grid" style="padding-right: 1em;">
{{ cform.hidden_tag() }}
<div class="one wide column middle aligned center aligned" style="padding-bottom: 0px; padding-right: 0px; padding-left: 0px;">
</div>
<div class="three wide column" style="padding-bottom: 0px; padding-left: 0px;">
<div class="field {% if cform.rel.errors %}error{% endif %}">
{{ cform.rel() }}
</div>
</div>
<div class="eleven wide column" style="padding-bottom: 0px;">
<div class="field {% if cform.url.errors %}error{% endif %}">
{{ cform.url() }}
{{ edit_macros.form_field_errors(cform.url) }}
</div>
</div>
<div class="one wide column right aligned" style="padding-bottom: 0px; padding-left: 0rem;">
<button type="button" class="ui icon red button delete-url-button"><i class="trash icon"></i></button>
</div>
</div>
{% endfor %}
</div>
<br>
<button type="button" id="add-url-button" class="ui right floated icon green button" style="margin-right: 0.3rem;">
<i class="plus icon"></i>
</button>
<br>
<h3 class="ui dividing header">Releases</h3>
<i>Usually one, but sometimes multiple Release entities (by FCID) that this
file is a fulltext copy of.</i>
<br><br>
<div class="list-group" id="release_id_list" name="release_id_list">
{% for rfield in form.release_ids %}
<div class="list-group-item ui grid" style="padding-right: 1em;">
<div class="one wide column middle aligned center aligned" style="padding-bottom: 0px; padding-right: 0px; padding-left: 0px;">
</div>
<div class="fourteen wide column" style="padding-bottom: 0px;">
<div class="field {% if rfield.errors %}error{% endif %}">
{{ rfield() }}
{{ edit_macros.form_field_errors(rfield) }}
</div>
</div>
<div class="one wide column right aligned" style="padding-bottom: 0px; padding-left: 0rem;">
<button type="button" class="ui icon red button delete-release_id-button"><i class="trash icon"></i></button>
</div>
</div>
{% endfor %}
</div>
<br>
<button type="button" id="add-release_id-button" class="ui right floated icon green button" style="margin-right: 0.3rem;">
<i class="plus icon"></i>
</button>
<br>
<h3 class="ui dividing header">Submit</h3>
{{ edit_macros.form_field_basic(form.edit_description) }}
This description will be attached to the individual edit, not to the
editgroup as a whole.
{% block edit_form_suffix %}
<br><br>
<input class="ui primary submit button" type="submit" value="Update File!">
<p>
<i>Edit will be part of the current editgroup, which needs to be submited and
approved before the change is included in the catalog.</i>
</form>
</div>
{% endblock %}
{% endblock %}
{% block postscript %}
<script>
<!-- Form code -->
$(document).ready(function() {
$('.ui.dropdown') .dropdown();
var fixup_url_numbering = function(group_item) {
items = Array.from(group_item.querySelectorAll(".list-group-item"))
for (var i = 0; i < items.length; i++) {
var item_el = items[i];
input_el = item_el.querySelectorAll("input")[0];
select_el = item_el.querySelectorAll("select")[0];
//console.log(input_el.id);
//console.log(select_el.id);
input_el.id = "urls-" + i + "-url";
input_el.name = input_el.id;
select_el.id = "urls-" + i + "-rel";
select_el.name = select_el.id;
//console.log(input_el.id);
//console.log(select_el.id);
};
console.log("re-named url rows up to i=" + i);
};
var url_list = document.getElementById('url_list');
fixup_url_numbering(url_list);
var url_delete_handler = function(ev) {
row = ev.target.parentNode.parentNode;
// I don't understand why this hack is needed; maybe because of the sortable stuff?
if(!row.classList.contains("list-group-item")) {
row = row.parentNode;
}
// console.log(row);
console.assert(row.classList.contains("list-group-item"));
row.parentNode.removeChild(row);
fixup_url_numbering(url_list);
};
var attach_url_delete_handler = function(topthing) {
Array.from(topthing.querySelectorAll(".delete-url-button")).forEach((el) => {
el.addEventListener("click", url_delete_handler);
});
};
attach_url_delete_handler(document);
// XXX: really need some way to not duplicate this code from above...
var url_template = `
<div class="list-group-item ui grid" style="padding-right: 1em;">
<div class="one wide column middle aligned center aligned" style="padding-bottom: 0px; padding-right: 0px; padding-left: 0px;">
</div>
<div class="three wide column" style="padding-bottom: 0px; padding-left: 0px;">
<select id="urls-X-rel" name="urls-X-rel"><option selected value="web">Public Web</option><option value="webarchive">Web Archive</option><option value="repository">Repository</option><option value="social">Academic Social Network</option><option value="publisher">Publisher</option><option value="dweb">Decentralized Web</option></select>
</div>
<div class="eleven wide column" style="padding-bottom: 0px;">
<input id="urls-X-url" name="urls-X-url" type="text" value="">
</div>
<div class="one wide column right aligned" style="padding-bottom: 0px; padding-left: 0rem;">
<button type="button" class="ui icon red button delete-url-button"><i class="trash icon"></i></button>
</div>
</div>
`;
var add_url_button = document.getElementById("add-url-button");
add_url_button.addEventListener("click", function(){
url_list.insertAdjacentHTML('beforeend', url_template);
attach_url_delete_handler(url_list.lastElementChild);
fixup_url_numbering(url_list);
});
var fixup_release_id_numbering = function(group_item) {
items = Array.from(group_item.querySelectorAll(".list-group-item"))
for (var i = 0; i < items.length; i++) {
var item_el = items[i];
input_el = item_el.querySelectorAll("input")[0];
//console.log(input_el.id);
input_el.id = "release_ids-" + i;
input_el.name = input_el.id;
//console.log(input_el.id);
};
console.log("re-named release_id rows up to i=" + i);
};
var release_id_list = document.getElementById('release_id_list');
fixup_release_id_numbering(release_id_list);
var release_id_delete_handler = function(ev) {
row = ev.target.parentNode.parentNode;
// I don't understand why this hack is needed; maybe because of the sortable stuff?
if(!row.classList.contains("list-group-item")) {
row = row.parentNode;
}
// console.log(row);
console.assert(row.classList.contains("list-group-item"));
row.parentNode.removeChild(row);
fixup_release_id_numbering(release_id_list);
};
var attach_release_id_delete_handler = function(topthing) {
Array.from(topthing.querySelectorAll(".delete-release_id-button")).forEach((el) => {
el.addEventListener("click", release_id_delete_handler);
});
};
attach_release_id_delete_handler(document);
// XXX: really need some way to not duplicate this code from above...
var release_id_template = `
<div class="list-group-item ui grid" style="padding-right: 1em;">
<div class="one wide column middle aligned center aligned" style="padding-bottom: 0px; padding-right: 0px; padding-left: 0px;">
</div>
<div class="fourteen wide column" style="padding-bottom: 0px;">
<div class="field ">
<input id="release_ids-X" name="release_ids-X" type="text" value="" required>
</div>
</div>
<div class="one wide column right aligned" style="padding-bottom: 0px; padding-left: 0rem;">
<button type="button" class="ui icon red button delete-release_id-button"><i class="trash icon"></i></button>
</div>
</div>
`;
var add_release_id_button = document.getElementById("add-release_id-button");
add_release_id_button.addEventListener("click", function(){
release_id_list.insertAdjacentHTML('beforeend', release_id_template);
attach_release_id_delete_handler(release_id_list.lastElementChild);
fixup_release_id_numbering(release_id_list);
});
console.log("Page loaded");
});
</script>
{% endblock %}
|
