2022-12-23 00:08:42 -05:00
{% load static %}
{% load i18n %}
{% load l10n %}
{% load humanize %}
{% load admin_url %}
{% load mastodon %}
{% load oauth_token %}
{% load truncate %}
{% load highlight %}
{% load thumb %}
< div id = "modal" _ = "on closeModal add .closing then wait for animationend then remove me" >
< div class = "modal-underlay" _ = "on click trigger closeModal" > < / div >
< div class = "modal-content" >
< div class = "add-to-list-modal__head" >
< span class = "add-to-list-modal__title" > {% trans '标记' %} {{ item.title }}< / span >
< span class = "add-to-list-modal__close-button modal-close" _ = "on click trigger closeModal" >
2023-02-11 20:40:00 -05:00
< i class = "fa-solid fa-xmark" > < / i >
2022-12-23 00:08:42 -05:00
< / span >
2023-02-11 20:40:00 -05:00
< / div >
2022-12-23 00:08:42 -05:00
< div class = "add-to-list-modal__body" >
< form action = "{% url 'journal:mark' item.uuid %}" method = "post" >
{% csrf_token %}
< div id = "statusSelection" class = "mark-modal__status-radio float-right" >
< ul id = "id_status" >
{% for k, v in shelf_types %}
2023-02-15 23:45:12 -05:00
{% if v %}
2022-12-25 13:45:24 -05:00
< li > < label for = "id_status_{{ k }}" > < input type = "radio" name = "status" value = "{{ k }}" required = "" id = "id_status_{{ k }}" { % if shelf_type = = k % } checked = "" { % endif % } > {{ v }}< / label > < / li >
2023-02-15 23:45:12 -05:00
{% endif %}
2022-12-23 00:08:42 -05:00
{% endfor %}
< / ul >
< / div >
< div class = "mark-modal__rating-star rating-star-edit" > < / div >
2022-12-25 13:45:24 -05:00
< input type = "hidden" name = "rating" id = "id_rating" value = "{{ mark.rating|floatformat:0 }}" >
2022-12-23 00:08:42 -05:00
< div class = "mark-modal__clear" > < / div >
2022-12-25 13:45:24 -05:00
< textarea name = "text" cols = "40" rows = "10" placeholder = "超过360字部分实例可能无法显示" maxlength = "360" id = "id_text" > {% if mark.text %}{{ mark.text }}{% endif %}< / textarea >
2022-12-23 00:08:42 -05:00
< div class = "mark-modal__tag" >
< label > 标签< / label >
< div class = "tag-input" >
< input name = "tags" type = "text" placeholder = "回车增加标签" id = "id_tags" value = "" >
< / div >
< / div >
< div class = "mark-modal__share-checkbox float-right" >
2023-02-12 08:49:10 -05:00
< label for = "id_share_to_mastodon" > < input type = "checkbox" name = "share_to_mastodon" id = "id_share_to_mastodon" value = "1" { % if not request . user . preference . default_no_share % } checked { % endif % } > 分享到联邦网络< / label >
2022-12-23 00:08:42 -05:00
< / div >
< div class = "mark-modal__option" >
< div class = "mark-modal__visibility-radio" >
< span > 可见性:
< ul id = "id_visibility" >
< li > < label for = "id_visibility_0" > < input type = "radio" name = "visibility" value = "0" required = "" id = "id_visibility_0" { % if mark . visibility = = 0 % } checked { % endif % } > 公开< / label > < / li >
< li > < label for = "id_visibility_1" > < input type = "radio" name = "visibility" value = "1" required = "" id = "id_visibility_1" { % if mark . visibility = = 1 % } checked { % endif % } > 仅关注者< / label > < / li >
< li > < label for = "id_visibility_2" > < input type = "radio" name = "visibility" value = "2" required = "" id = "id_visibility_2" { % if mark . visibility = = 2 % } checked { % endif % } > 仅自己< / label > < / li >
< / ul >
< / span >
< / div >
< / div >
2023-01-10 22:36:13 -05:00
2022-12-23 00:08:42 -05:00
< div class = "mark-modal__confirm-button" >
< input type = "submit" class = "button float-right" value = "保存" >
< / div >
2023-01-10 22:36:13 -05:00
< div class = "mark-modal__option" >
< div class = "mark-modal__visibility-radio" >
< span > 更改标记日期:
< label for = "mark_anotherday" > < input type = "checkbox" name = "mark_anotherday" value = "1" id = "mark_anotherday" > < / label >
< input type = "date" name = "mark_date" id = "mark_date" min = "1900-01-01" max = "{{date_today}}" value = "{{date_today}}" style = "display: none;" >
< / span >
< / div >
< / div >
2022-12-23 00:08:42 -05:00
< / form >
< / div >
< script >
(function(){
new inputTags({
container: document.getElementsByClassName("tag-input")[0],
tags : "{{ tags }}".split(","),
allowDuplicateTags : false,
duplicateTime: 300,
onTagRemove : function (tag) {},
});
2023-01-10 22:36:13 -05:00
// editable rating star in modal
2022-12-23 00:08:42 -05:00
ratingLabels = $("#modal .rating-star-edit");
$(ratingLabels).each( function(index, value) {
let ratingScore = $("input[type='hidden'][name='rating']").val() / 2;
let label = $(this);
label.starRating({
initialRating: ratingScore,
starSize: 20,
onHover: function(currentIndex, currentRating, $el){
$("input[type='hidden'][name='rating']").val(currentIndex);
},
onLeave: function(currentIndex, currentRating, $el){
$("input[type='hidden'][name='rating']").val(currentRating * 2);
2023-02-11 20:40:00 -05:00
}
2022-12-23 00:08:42 -05:00
});
});
2023-01-10 22:36:13 -05:00
//show date picker if mark yesterday
$("#modal #mark_anotherday").on('click', function(e) {
if ($("#modal #mark_anotherday:checked").val() == '1') {
$("#modal #mark_date").show()
} else {
$("#modal #mark_date").hide()
}
});
// hide rating star when select wish
2022-12-23 00:08:42 -05:00
const WISH_CODE = "wishlist";
if ($("#statusSelection input[type='radio']:checked").val() == WISH_CODE) {
2022-12-25 13:45:24 -05:00
$("#modal .rating-star-edit").hide();
2022-12-23 00:08:42 -05:00
}
$("#statusSelection input[type='radio']").on('click', function() {
if ($(this).val() == WISH_CODE) {
2022-12-25 13:45:24 -05:00
$("#modal .rating-star-edit").hide();
2022-12-23 00:08:42 -05:00
} else {
2022-12-25 13:45:24 -05:00
$("#modal .rating-star-edit").show();
2022-12-23 00:08:42 -05:00
}
2023-02-11 20:40:00 -05:00
2022-12-23 00:08:42 -05:00
});
// show confirm modal
2022-12-25 13:45:24 -05:00
$("#modal a.delete").on('click', function(e) {
2022-12-23 00:08:42 -05:00
e.preventDefault();
$(".confirm-modal").show();
$(".bg-mask").show();
});
// confirm modal
$(".confirm-modal input[type='submit']").on('click', function(e) {
e.preventDefault();
2022-12-25 13:45:24 -05:00
$("#modal form").submit();
2022-12-23 00:08:42 -05:00
});
})();
< / script >
< / div >