cleanup and remove unused files
This commit is contained in:
Your Name
Henri Dickson
parent
9f2ef266a9
commit
add2a2077e
29 changed files with 31 additions and 3008 deletions
|
|
@ -1,107 +0,0 @@
|
||||||
function create_player(audio) {
|
|
||||||
window.player = new Shikwasa.Player({
|
|
||||||
container: () => document.querySelector('.player'),
|
|
||||||
preload: 'metadata',
|
|
||||||
autoplay: true,
|
|
||||||
themeColor: '#1190C0',
|
|
||||||
fixed: {
|
|
||||||
type: 'fixed',
|
|
||||||
position: 'bottom'
|
|
||||||
},
|
|
||||||
audio: audio
|
|
||||||
});
|
|
||||||
// $('.shk-title').on('click', e=>{
|
|
||||||
// window.location = "#";
|
|
||||||
// });
|
|
||||||
$('.footer').attr('style', 'margin-bottom: 120px !important');
|
|
||||||
}
|
|
||||||
|
|
||||||
function catalog_init(context) {
|
|
||||||
// readonly star rating of detail display section
|
|
||||||
let ratingLabels = $(".grid__main .rating-star", context);
|
|
||||||
$(ratingLabels).each( function(index, value) {
|
|
||||||
let ratingScore = $(this).data("rating-score") / 2;
|
|
||||||
$(this).starRating({
|
|
||||||
initialRating: ratingScore,
|
|
||||||
readOnly: true,
|
|
||||||
});
|
|
||||||
});
|
|
||||||
// readonly star rating at aside section
|
|
||||||
ratingLabels = $("#aside .rating-star"), context;
|
|
||||||
$(ratingLabels).each( function(index, value) {
|
|
||||||
let ratingScore = $(this).data("rating-score") / 2;
|
|
||||||
$(this).starRating({
|
|
||||||
initialRating: ratingScore,
|
|
||||||
readOnly: true,
|
|
||||||
starSize: 15,
|
|
||||||
});
|
|
||||||
});
|
|
||||||
// hide long text
|
|
||||||
$(".entity-desc__content", context).each(function() {
|
|
||||||
let copy = $(this).clone()
|
|
||||||
.addClass('entity-desc__content--folded')
|
|
||||||
.css("visibility", "hidden");
|
|
||||||
$(this).after(copy);
|
|
||||||
if ($(this).height() > copy.height()) {
|
|
||||||
$(this).addClass('entity-desc__content--folded');
|
|
||||||
$(this).siblings(".entity-desc__unfold-button").removeClass("entity-desc__unfold-button--hidden");
|
|
||||||
}
|
|
||||||
copy.remove();
|
|
||||||
});
|
|
||||||
|
|
||||||
// expand hidden long text
|
|
||||||
$(".entity-desc__unfold-button a", context).on('click', function() {
|
|
||||||
$(this).parent().siblings(".entity-desc__content").removeClass('entity-desc__content--folded');
|
|
||||||
$(this).parent(".entity-desc__unfold-button").remove();
|
|
||||||
});
|
|
||||||
|
|
||||||
// spoiler
|
|
||||||
$(".spoiler", context).on('click', function(){
|
|
||||||
$(this).toggleClass('revealed');
|
|
||||||
})
|
|
||||||
|
|
||||||
// podcast
|
|
||||||
$('.source-label__rss', context).parent().on('click', (e)=>{
|
|
||||||
e.preventDefault();
|
|
||||||
})
|
|
||||||
$('.source-label__rss', context).parent().attr('title', 'Copy link here and subscribe in your podcast app');
|
|
||||||
|
|
||||||
$('.episode', context).on('click', e=>{
|
|
||||||
e.preventDefault();
|
|
||||||
var ele = e.target;
|
|
||||||
var album = $(ele).data('album');
|
|
||||||
var artist = $(ele).data('hosts');
|
|
||||||
var title = $(ele).data('title');
|
|
||||||
var cover_url = $(ele).data('cover');
|
|
||||||
var media_url = $(ele).data('media');
|
|
||||||
var position = $(ele).data('position');
|
|
||||||
if (!media_url) return;
|
|
||||||
window.current_item_uuid = $(ele).data('uuid');
|
|
||||||
if (!window.player) {
|
|
||||||
create_player({
|
|
||||||
title: title,
|
|
||||||
cover: cover_url,
|
|
||||||
src: media_url,
|
|
||||||
album: album,
|
|
||||||
artist: artist
|
|
||||||
})
|
|
||||||
} else {
|
|
||||||
window.player.update({
|
|
||||||
title: title,
|
|
||||||
cover: cover_url,
|
|
||||||
src: media_url,
|
|
||||||
album: album,
|
|
||||||
artist: artist
|
|
||||||
})
|
|
||||||
}
|
|
||||||
if (position) window.player._initSeek = position;
|
|
||||||
window.player.play()
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
$(function() {
|
|
||||||
document.body.addEventListener('htmx:load', function(evt) {
|
|
||||||
catalog_init(evt.detail.elt);
|
|
||||||
});
|
|
||||||
catalog_init(document.body);
|
|
||||||
});
|
|
||||||
|
|
@ -24,7 +24,7 @@
|
||||||
<script src="https://cdn.jsdelivr.net/npm/shikwasa@2.2.1/dist/shikwasa.min.js"></script>
|
<script src="https://cdn.jsdelivr.net/npm/shikwasa@2.2.1/dist/shikwasa.min.js"></script>
|
||||||
<link href="https://cdn.jsdelivr.net/npm/shikwasa@2.2.1/dist/style.min.css"
|
<link href="https://cdn.jsdelivr.net/npm/shikwasa@2.2.1/dist/style.min.css"
|
||||||
rel="stylesheet"></link>
|
rel="stylesheet"></link>
|
||||||
<script src="{% static 'podcast.js' %}"></script>
|
<script src="{% static 'js/podcast.js' %}"></script>
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
{% include "_header.html" with current="discover" %}
|
{% include "_header.html" with current="discover" %}
|
||||||
|
|
|
||||||
|
|
@ -13,7 +13,7 @@
|
||||||
<script src="https://cdn.jsdelivr.net/npm/shikwasa@2.2.1/dist/shikwasa.min.js"></script>
|
<script src="https://cdn.jsdelivr.net/npm/shikwasa@2.2.1/dist/shikwasa.min.js"></script>
|
||||||
<link href="https://cdn.jsdelivr.net/npm/shikwasa@2.2.1/dist/style.min.css"
|
<link href="https://cdn.jsdelivr.net/npm/shikwasa@2.2.1/dist/style.min.css"
|
||||||
rel="stylesheet"></link>
|
rel="stylesheet"></link>
|
||||||
<script src="{% static 'podcast.js' %}"></script>
|
<script src="{% static 'js/podcast.js' %}"></script>
|
||||||
{% endblock %}
|
{% endblock %}
|
||||||
{% block details %}
|
{% block details %}
|
||||||
<div>
|
<div>
|
||||||
|
|
|
||||||
|
|
@ -1,32 +0,0 @@
|
||||||
.box {
|
|
||||||
position: absolute;
|
|
||||||
left: 50%;
|
|
||||||
top: 50%;
|
|
||||||
transform: translate(-50%, -50%);
|
|
||||||
padding: 60px 40px;
|
|
||||||
background-color: var(--bright);
|
|
||||||
text-align: center;
|
|
||||||
min-width: 400px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.box .sec-msg {
|
|
||||||
color: var(--light);
|
|
||||||
font-size: smaller;
|
|
||||||
}
|
|
||||||
|
|
||||||
.box .main-msg {
|
|
||||||
margin-bottom: 5px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.box .logo {
|
|
||||||
width: 140px;
|
|
||||||
margin-bottom: 60px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.box p {
|
|
||||||
text-align: justify;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* body {
|
|
||||||
filter: grayscale(1);
|
|
||||||
} */
|
|
||||||
|
|
@ -1,734 +0,0 @@
|
||||||
/* Global */
|
|
||||||
|
|
||||||
:root {
|
|
||||||
--primary: #00a1cc;
|
|
||||||
--secondary: #606c76;
|
|
||||||
--light: #ccc;
|
|
||||||
--bright: rgb(247, 247, 247);
|
|
||||||
}
|
|
||||||
|
|
||||||
html {
|
|
||||||
/* background-color: #eee; */
|
|
||||||
font-size: 55%;
|
|
||||||
height: 100%;
|
|
||||||
}
|
|
||||||
|
|
||||||
body {
|
|
||||||
height: 100%;
|
|
||||||
margin: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
.errorlist {
|
|
||||||
color: var(--primary);
|
|
||||||
font-size: small;
|
|
||||||
font-weight: bold;
|
|
||||||
list-style-type: square;
|
|
||||||
}
|
|
||||||
|
|
||||||
#page-wrapper {
|
|
||||||
position: relative;
|
|
||||||
min-height: 100vh;
|
|
||||||
z-index: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
#content-wrapper {
|
|
||||||
padding-bottom: 160px;
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
input[type=text]::-ms-clear { display: none; width : 0; height: 0; }
|
|
||||||
input[type=text]::-ms-reveal { display: none; width : 0; height: 0; }
|
|
||||||
input[type="search"]::-webkit-search-decoration,
|
|
||||||
input[type="search"]::-webkit-search-cancel-button,
|
|
||||||
input[type="search"]::-webkit-search-results-button,
|
|
||||||
input[type="search"]::-webkit-search-results-decoration { display: none; }
|
|
||||||
|
|
||||||
footer {
|
|
||||||
text-align: center;
|
|
||||||
|
|
||||||
margin-bottom: 4px !important;
|
|
||||||
|
|
||||||
border-top: var(--bright) solid 2px;
|
|
||||||
|
|
||||||
position: absolute !important;
|
|
||||||
left: 50%;
|
|
||||||
transform: translateX(-50%);
|
|
||||||
bottom: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
footer a {
|
|
||||||
margin: 0 15px;
|
|
||||||
font-size: small;
|
|
||||||
}
|
|
||||||
|
|
||||||
img.emoji {
|
|
||||||
height: 20px !important;
|
|
||||||
width: 20px !important;
|
|
||||||
box-sizing: border-box;
|
|
||||||
object-fit: contain;
|
|
||||||
position: relative;
|
|
||||||
top: 3px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.more-link {
|
|
||||||
font-size: small;
|
|
||||||
margin-left: 5px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.highlight {
|
|
||||||
font-weight: bold;
|
|
||||||
}
|
|
||||||
|
|
||||||
div.dividing-line {
|
|
||||||
height: 0;
|
|
||||||
width: 100%;
|
|
||||||
margin: 40px 0 15px 0;
|
|
||||||
border-top: solid 1px var(--light);
|
|
||||||
}
|
|
||||||
|
|
||||||
.icon-lock svg{
|
|
||||||
fill: var(--light);
|
|
||||||
height: 12px;
|
|
||||||
position: relative;
|
|
||||||
top: 1px;
|
|
||||||
margin-left: 3px;
|
|
||||||
}
|
|
||||||
|
|
||||||
textarea::placeholder {
|
|
||||||
color: var(--light);
|
|
||||||
}
|
|
||||||
|
|
||||||
input::placeholder {
|
|
||||||
color: var(--light);
|
|
||||||
}
|
|
||||||
|
|
||||||
.spinner {
|
|
||||||
transform: scale(0.4);
|
|
||||||
margin: auto;
|
|
||||||
}
|
|
||||||
|
|
||||||
.lds-spinner {
|
|
||||||
color: official;
|
|
||||||
display: inline-block;
|
|
||||||
position: relative;
|
|
||||||
width: 80px;
|
|
||||||
height: 80px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.lds-spinner div {
|
|
||||||
transform-origin: 40px 40px;
|
|
||||||
animation: lds-spinner 1.2s linear infinite;
|
|
||||||
}
|
|
||||||
|
|
||||||
.lds-spinner div:after {
|
|
||||||
content: " ";
|
|
||||||
display: block;
|
|
||||||
position: absolute;
|
|
||||||
top: 3px;
|
|
||||||
left: 37px;
|
|
||||||
width: 6px;
|
|
||||||
height: 18px;
|
|
||||||
border-radius: 20%;
|
|
||||||
background: var(--secondary);
|
|
||||||
}
|
|
||||||
|
|
||||||
.lds-spinner div:nth-child(1) {
|
|
||||||
transform: rotate(0deg);
|
|
||||||
animation-delay: -1.1s;
|
|
||||||
}
|
|
||||||
|
|
||||||
.lds-spinner div:nth-child(2) {
|
|
||||||
transform: rotate(30deg);
|
|
||||||
animation-delay: -1s;
|
|
||||||
}
|
|
||||||
|
|
||||||
.lds-spinner div:nth-child(3) {
|
|
||||||
transform: rotate(60deg);
|
|
||||||
animation-delay: -0.9s;
|
|
||||||
}
|
|
||||||
|
|
||||||
.lds-spinner div:nth-child(4) {
|
|
||||||
transform: rotate(90deg);
|
|
||||||
animation-delay: -0.8s;
|
|
||||||
}
|
|
||||||
|
|
||||||
.lds-spinner div:nth-child(5) {
|
|
||||||
transform: rotate(120deg);
|
|
||||||
animation-delay: -0.7s;
|
|
||||||
}
|
|
||||||
|
|
||||||
.lds-spinner div:nth-child(6) {
|
|
||||||
transform: rotate(150deg);
|
|
||||||
animation-delay: -0.6s;
|
|
||||||
}
|
|
||||||
|
|
||||||
.lds-spinner div:nth-child(7) {
|
|
||||||
transform: rotate(180deg);
|
|
||||||
animation-delay: -0.5s;
|
|
||||||
}
|
|
||||||
|
|
||||||
.lds-spinner div:nth-child(8) {
|
|
||||||
transform: rotate(210deg);
|
|
||||||
animation-delay: -0.4s;
|
|
||||||
}
|
|
||||||
|
|
||||||
.lds-spinner div:nth-child(9) {
|
|
||||||
transform: rotate(240deg);
|
|
||||||
animation-delay: -0.3s;
|
|
||||||
}
|
|
||||||
|
|
||||||
.lds-spinner div:nth-child(10) {
|
|
||||||
transform: rotate(270deg);
|
|
||||||
animation-delay: -0.2s;
|
|
||||||
}
|
|
||||||
|
|
||||||
.lds-spinner div:nth-child(11) {
|
|
||||||
transform: rotate(300deg);
|
|
||||||
animation-delay: -0.1s;
|
|
||||||
}
|
|
||||||
|
|
||||||
.lds-spinner div:nth-child(12) {
|
|
||||||
transform: rotate(330deg);
|
|
||||||
animation-delay: 0s;
|
|
||||||
}
|
|
||||||
|
|
||||||
@keyframes lds-spinner {
|
|
||||||
0% {
|
|
||||||
opacity: 1;
|
|
||||||
}
|
|
||||||
|
|
||||||
100% {
|
|
||||||
opacity: 0;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
/* overwrite rating-star plugin makes it readonly */
|
|
||||||
.rating-star .jq-star {
|
|
||||||
cursor: unset;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Nav Bar */
|
|
||||||
|
|
||||||
section#navbar {
|
|
||||||
background-color: var(--bright);
|
|
||||||
box-sizing: border-box;
|
|
||||||
padding: 18px 0;
|
|
||||||
margin-bottom: 50px;
|
|
||||||
border-bottom: var(--light) 0.5px solid;
|
|
||||||
|
|
||||||
}
|
|
||||||
|
|
||||||
.navbar img.logo {
|
|
||||||
width: 100px;
|
|
||||||
float: left;
|
|
||||||
}
|
|
||||||
|
|
||||||
.navbar .search-box {
|
|
||||||
height: 32px;
|
|
||||||
margin: 5px 0 0 16px;
|
|
||||||
width: 50%;
|
|
||||||
float: left;
|
|
||||||
background-color: white;
|
|
||||||
}
|
|
||||||
|
|
||||||
.navbar .search-box::placeholder {
|
|
||||||
color: var(--light);
|
|
||||||
}
|
|
||||||
|
|
||||||
.navbar a.nav-link, .navbar a.nav-link:visited {
|
|
||||||
font-size: 80%;
|
|
||||||
float: right;
|
|
||||||
margin-top: 10px;
|
|
||||||
color: var(--secondary);
|
|
||||||
margin-left: 20px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.navbar a.nav-link:hover, .navbar a.nav-link:hover:visited {
|
|
||||||
color: var(--primary);
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Main Content Section */
|
|
||||||
|
|
||||||
section#content div#main {
|
|
||||||
padding: 32px 35px;
|
|
||||||
background-color: var(--bright);
|
|
||||||
margin-right: 40px;
|
|
||||||
width: 75%;
|
|
||||||
position: relative;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Aside Content Section */
|
|
||||||
|
|
||||||
section#content div#aside {
|
|
||||||
width: 25%;
|
|
||||||
}
|
|
||||||
|
|
||||||
.set {
|
|
||||||
margin-bottom: 20px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.set .set-title {
|
|
||||||
display: inline-block;
|
|
||||||
margin-bottom: 7px;
|
|
||||||
}
|
|
||||||
.set .set-empty {
|
|
||||||
font-size: small;
|
|
||||||
margin: 0;
|
|
||||||
padding-left: 20px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.set .set-item-list {
|
|
||||||
padding: 8px 25px 0 10px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.set .set-item {
|
|
||||||
text-align: center;
|
|
||||||
margin-bottom: 0 !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
.set .set-item-image {
|
|
||||||
max-width: 90px;
|
|
||||||
height: 110px;
|
|
||||||
object-fit: contain;
|
|
||||||
}
|
|
||||||
|
|
||||||
.set .set-item-title, .set .set-item-title:visited {
|
|
||||||
/* width: 80%; */
|
|
||||||
margin: auto;
|
|
||||||
line-height: 1.3em;
|
|
||||||
font-size: small;
|
|
||||||
display: block;
|
|
||||||
color: var(--secondary);
|
|
||||||
|
|
||||||
}
|
|
||||||
|
|
||||||
.set .set-item-title:hover, .set .set-item-title:visited:hover {
|
|
||||||
color: var(--primary);
|
|
||||||
}
|
|
||||||
|
|
||||||
.set .set-content {
|
|
||||||
font-size: small;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Info Card */
|
|
||||||
|
|
||||||
.aside-card {
|
|
||||||
background-color: var(--bright);
|
|
||||||
padding: 20px 24px 15px 24px;
|
|
||||||
margin-bottom: 30px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.aside-card .clearfix {
|
|
||||||
margin-bottom: 15px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.aside-card .info-avatar {
|
|
||||||
width: 72px;
|
|
||||||
object-fit: contain;
|
|
||||||
float: left;
|
|
||||||
}
|
|
||||||
|
|
||||||
.aside-card .info-name {
|
|
||||||
margin: 0;
|
|
||||||
max-width: 120px;
|
|
||||||
margin-bottom: 12px;
|
|
||||||
padding-left: 8px;
|
|
||||||
float: left;
|
|
||||||
}
|
|
||||||
|
|
||||||
.aside-card .info-brief {
|
|
||||||
line-height: 2rem;
|
|
||||||
font-size: small;
|
|
||||||
overflow-wrap: break-word;
|
|
||||||
hyphens: auto;
|
|
||||||
}
|
|
||||||
|
|
||||||
.aside-card a.report {
|
|
||||||
color: var(--light);
|
|
||||||
font-size: small;
|
|
||||||
}
|
|
||||||
|
|
||||||
.aside-card a.follow {
|
|
||||||
font-size: small;
|
|
||||||
color: var(--secondary);
|
|
||||||
margin-right: 10px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.aside-card .button.add-button {
|
|
||||||
margin-top: 10px;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Relation Card */
|
|
||||||
|
|
||||||
.relation-card {
|
|
||||||
padding: 2px;
|
|
||||||
margin-bottom: 10px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.relation-card .relation-label {
|
|
||||||
margin: 0;
|
|
||||||
margin-bottom: 12px;
|
|
||||||
display: inline-block;
|
|
||||||
}
|
|
||||||
|
|
||||||
.relation-card .relation-user .relation-avatar {
|
|
||||||
width: 50px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.relation-card .relation-user .relation-name {
|
|
||||||
display: block;
|
|
||||||
font-size: small;
|
|
||||||
line-height: 1.8rem;
|
|
||||||
/* white-space: nowrap; */
|
|
||||||
text-overflow: ellipsis;
|
|
||||||
/* max-width: 100px; */
|
|
||||||
overflow: hidden;
|
|
||||||
}
|
|
||||||
|
|
||||||
.relation-user .relation-name .emoji {
|
|
||||||
transform: scale(0.8);
|
|
||||||
}
|
|
||||||
|
|
||||||
.relation-card .relation-user-list {
|
|
||||||
margin-bottom: 15px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.relation-card .relation-user-list .relation-user {
|
|
||||||
list-style-type: none;
|
|
||||||
text-align: center;
|
|
||||||
margin-bottom: 0px !important;
|
|
||||||
justify-items: center;
|
|
||||||
padding: 0 3px !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Report Card */
|
|
||||||
|
|
||||||
.report-card {
|
|
||||||
padding: 2px;
|
|
||||||
font-size: small;
|
|
||||||
}
|
|
||||||
|
|
||||||
.report-card .report-label {
|
|
||||||
margin: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
.report-card .report-user-link {
|
|
||||||
padding: 0 5px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.report-card .report-message {
|
|
||||||
list-style-type: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Search Result */
|
|
||||||
|
|
||||||
.result-items .result-item:last-of-type {
|
|
||||||
margin-bottom: 50px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.result-item {
|
|
||||||
list-style: none;
|
|
||||||
margin-bottom: 30px;
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
.result-item .result-info {
|
|
||||||
margin-left: 20px;
|
|
||||||
float: left;
|
|
||||||
}
|
|
||||||
|
|
||||||
.result-item img.result-book-cover {
|
|
||||||
float: left;
|
|
||||||
object-fit: contain;
|
|
||||||
height: 150px;
|
|
||||||
width: 100px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.result-item .result-info .rating-empty {
|
|
||||||
font-size: small;
|
|
||||||
}
|
|
||||||
|
|
||||||
.result-item .result-info .rating-star{
|
|
||||||
cursor: unset;
|
|
||||||
display: inline;
|
|
||||||
position: relative;
|
|
||||||
top: 3px;
|
|
||||||
left: -3px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.result-item .result-info .result-book-info {
|
|
||||||
font-size: 80%;
|
|
||||||
overflow: hidden;
|
|
||||||
width: 420px;
|
|
||||||
display: inline-block;
|
|
||||||
white-space: nowrap;
|
|
||||||
text-overflow: ellipsis;
|
|
||||||
position: relative;
|
|
||||||
top: .55rem;
|
|
||||||
}
|
|
||||||
|
|
||||||
.result-item .result-info .rating-score {
|
|
||||||
font-size: 80%;
|
|
||||||
display: inline;
|
|
||||||
margin-right: 20px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.result-item .result-info .result-item-title {
|
|
||||||
white-space: nowrap;
|
|
||||||
text-overflow: ellipsis;
|
|
||||||
max-width: 500px;
|
|
||||||
display: block;
|
|
||||||
overflow: hidden
|
|
||||||
}
|
|
||||||
|
|
||||||
.result-item .result-info .result-item-brief {
|
|
||||||
margin-top: 10px;
|
|
||||||
margin-bottom: 0;
|
|
||||||
font-size: small;
|
|
||||||
width: 565px;
|
|
||||||
display: block;
|
|
||||||
text-overflow: ellipsis;
|
|
||||||
overflow: hidden;
|
|
||||||
/* white-space: nowrap; */
|
|
||||||
height: 90px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.aside-card .add-nav .clearfix {
|
|
||||||
margin-bottom: 5px;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Pagination */
|
|
||||||
.pagination {
|
|
||||||
position: absolute;
|
|
||||||
bottom: 30px;
|
|
||||||
left: 50%;
|
|
||||||
transform: translateX(-50%);
|
|
||||||
text-align: center;
|
|
||||||
}
|
|
||||||
|
|
||||||
.pagination a {
|
|
||||||
display: inline-block;
|
|
||||||
}
|
|
||||||
|
|
||||||
.pagination .button {
|
|
||||||
padding: 0 5px;
|
|
||||||
height: 2rem;
|
|
||||||
}
|
|
||||||
|
|
||||||
.pagination .page-index {
|
|
||||||
font-size: small;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Display Page */
|
|
||||||
|
|
||||||
img.display-image {
|
|
||||||
height: 210px;
|
|
||||||
object-fit: contain;
|
|
||||||
float: left;
|
|
||||||
max-width: 200px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.display-info {
|
|
||||||
max-width: 530px;
|
|
||||||
float: left;
|
|
||||||
margin-left: 20px;
|
|
||||||
|
|
||||||
overflow: hidden;
|
|
||||||
text-overflow: ellipsis;
|
|
||||||
}
|
|
||||||
|
|
||||||
.display-title {
|
|
||||||
display: -webkit-box;
|
|
||||||
-webkit-line-clamp: 1; /* number of lines to show */
|
|
||||||
-webkit-box-orient: vertical;
|
|
||||||
font-weight: bold;
|
|
||||||
}
|
|
||||||
|
|
||||||
.display-info-detail {
|
|
||||||
font-size: small;
|
|
||||||
width: 250px;
|
|
||||||
display: inline-block;
|
|
||||||
vertical-align: top;
|
|
||||||
}
|
|
||||||
|
|
||||||
.display-info-detail .rating-star {
|
|
||||||
position: relative;
|
|
||||||
left: -5px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.display-info-detail .rating-score {
|
|
||||||
position: relative;
|
|
||||||
top: -2.5px;
|
|
||||||
font-weight: bold;
|
|
||||||
}
|
|
||||||
|
|
||||||
.display-info-detail form, .display-info-detail input[type='submit'] {
|
|
||||||
display: inline;
|
|
||||||
}
|
|
||||||
|
|
||||||
.mark {
|
|
||||||
font-size: small;
|
|
||||||
margin-bottom: 5px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.mark form {
|
|
||||||
display: inline;
|
|
||||||
/* margin: 0; */
|
|
||||||
}
|
|
||||||
|
|
||||||
.mark .mark-status-label {
|
|
||||||
font-weight: bold;
|
|
||||||
}
|
|
||||||
|
|
||||||
.mark .rating-star {
|
|
||||||
position: relative;
|
|
||||||
top: 1.5px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.mark .icon-lock {
|
|
||||||
position: relative;
|
|
||||||
top: -0.5px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.mark .clearfix {
|
|
||||||
margin-bottom: 5px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.list-item .item-time {
|
|
||||||
color: var(--light);
|
|
||||||
margin-left: 5px;
|
|
||||||
font-size: small;
|
|
||||||
}
|
|
||||||
|
|
||||||
.list-item .mark-text {
|
|
||||||
margin: 20px 0 15px 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
.mark .button-group a.button{
|
|
||||||
width: 33%;
|
|
||||||
box-sizing: border-box;
|
|
||||||
display: initial;
|
|
||||||
padding: 7px 8%;
|
|
||||||
margin: 0 4px;
|
|
||||||
font-weight: normal;
|
|
||||||
}
|
|
||||||
|
|
||||||
.review {
|
|
||||||
font-size: small;
|
|
||||||
margin-bottom: 5px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.review .clearfix {
|
|
||||||
margin-bottom: 5px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.review .review-label {
|
|
||||||
font-weight: bold;
|
|
||||||
}
|
|
||||||
|
|
||||||
.review .review-time {
|
|
||||||
color: var(--light);
|
|
||||||
}
|
|
||||||
|
|
||||||
.review .review-title {
|
|
||||||
font-size: small;
|
|
||||||
font-weight: bold;
|
|
||||||
display: block;
|
|
||||||
margin-top: 10px;
|
|
||||||
margin-bottom: 5px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.review .review-head .edit {
|
|
||||||
margin-left: 10px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.set .mark {
|
|
||||||
font-size: small;
|
|
||||||
/* margin-bottom: 3px; */
|
|
||||||
padding-left: 20px;
|
|
||||||
padding-right: 20px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.list-label .rating-star {
|
|
||||||
position: relative;
|
|
||||||
top: 3px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.list-label .list-owner-name {
|
|
||||||
position: relative;
|
|
||||||
top: -1px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.list-label {
|
|
||||||
font-size: small;
|
|
||||||
}
|
|
||||||
|
|
||||||
.set .mark-text {
|
|
||||||
margin: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
.set .review-title {
|
|
||||||
font-weight: bold;
|
|
||||||
font-size: small;
|
|
||||||
}
|
|
||||||
|
|
||||||
.set.result-items .list-item {
|
|
||||||
margin-bottom: 10px;
|
|
||||||
}s
|
|
||||||
|
|
||||||
.aside-card .aside-item {
|
|
||||||
overflow: hidden;
|
|
||||||
}
|
|
||||||
|
|
||||||
.aside-item .item-image {
|
|
||||||
height: 150px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.aside-item div {
|
|
||||||
font-size: small;
|
|
||||||
}
|
|
||||||
|
|
||||||
.aside-item .item-title {
|
|
||||||
font-weight: bold;
|
|
||||||
font-size: small;
|
|
||||||
margin-bottom: 5px;
|
|
||||||
margin-top: 10px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.aside-item .rating-star {
|
|
||||||
position: relative;
|
|
||||||
top: 4px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.list-head {
|
|
||||||
margin-bottom: 30px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.user {
|
|
||||||
font-size: small;
|
|
||||||
margin-bottom: 24px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.user .user-info {
|
|
||||||
margin-left: 15px;
|
|
||||||
max-width: 88%;
|
|
||||||
}
|
|
||||||
|
|
||||||
.user .user-name {
|
|
||||||
font-size: small;
|
|
||||||
margin-bottom: 5px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.user .user-brief {
|
|
||||||
margin: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
.user .avatar {
|
|
||||||
height: 70px;
|
|
||||||
}
|
|
||||||
|
|
||||||
iframe {
|
|
||||||
width: 100%;
|
|
||||||
height: 500px;
|
|
||||||
}
|
|
||||||
|
|
@ -1,361 +0,0 @@
|
||||||
/* Global */
|
|
||||||
|
|
||||||
:root {
|
|
||||||
--primary: #00a1cc;
|
|
||||||
--secondary: #606c76;
|
|
||||||
--light: #ccc;
|
|
||||||
--bright: rgb(247, 247, 247);
|
|
||||||
}
|
|
||||||
|
|
||||||
html {
|
|
||||||
/* background-color: #eee; */
|
|
||||||
font-size: 55%;
|
|
||||||
height: 100%;
|
|
||||||
}
|
|
||||||
|
|
||||||
body {
|
|
||||||
height: 100%;
|
|
||||||
margin: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
.rating-star {
|
|
||||||
cursor: unset;
|
|
||||||
}
|
|
||||||
|
|
||||||
.rating-star .jq-star {
|
|
||||||
cursor: unset;
|
|
||||||
}
|
|
||||||
|
|
||||||
.icon-lock svg{
|
|
||||||
fill: var(--light);
|
|
||||||
height: 12px;
|
|
||||||
position: relative;
|
|
||||||
top: 1px;
|
|
||||||
margin-left: 3px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.errorlist {
|
|
||||||
color: var(--primary);
|
|
||||||
font-size: small;
|
|
||||||
font-weight: bold;
|
|
||||||
list-style-type: square;
|
|
||||||
}
|
|
||||||
|
|
||||||
#page-wrapper {
|
|
||||||
position: relative;
|
|
||||||
min-height: 100vh;
|
|
||||||
z-index: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
#content-wrapper {
|
|
||||||
padding-bottom: 160px;
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
input[type=text]::-ms-clear { display: none; width : 0; height: 0; }
|
|
||||||
input[type=text]::-ms-reveal { display: none; width : 0; height: 0; }
|
|
||||||
input[type="search"]::-webkit-search-decoration,
|
|
||||||
input[type="search"]::-webkit-search-cancel-button,
|
|
||||||
input[type="search"]::-webkit-search-results-button,
|
|
||||||
input[type="search"]::-webkit-search-results-decoration { display: none; }
|
|
||||||
|
|
||||||
footer {
|
|
||||||
text-align: center;
|
|
||||||
|
|
||||||
margin-bottom: 4px !important;
|
|
||||||
|
|
||||||
border-top: var(--bright) solid 2px;
|
|
||||||
|
|
||||||
position: absolute !important;
|
|
||||||
left: 50%;
|
|
||||||
transform: translateX(-50%);
|
|
||||||
bottom: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
footer a {
|
|
||||||
margin: 0 15px;
|
|
||||||
font-size: small;
|
|
||||||
}
|
|
||||||
|
|
||||||
textarea {
|
|
||||||
resize: vertical;
|
|
||||||
height: 180px;
|
|
||||||
}
|
|
||||||
|
|
||||||
img.emoji {
|
|
||||||
height: 20px !important;
|
|
||||||
width: 20px !important;
|
|
||||||
box-sizing: border-box;
|
|
||||||
object-fit: contain;
|
|
||||||
position: relative;
|
|
||||||
top: 3px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.more-link {
|
|
||||||
font-size: small;
|
|
||||||
margin-left: 5px;
|
|
||||||
}
|
|
||||||
|
|
||||||
div.dividing-line {
|
|
||||||
height: 0;
|
|
||||||
width: 100%;
|
|
||||||
margin: 40px 0 15px 0;
|
|
||||||
border-top: solid 1px var(--light);
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Nav Bar */
|
|
||||||
|
|
||||||
section#navbar {
|
|
||||||
background-color: var(--bright);
|
|
||||||
box-sizing: border-box;
|
|
||||||
padding: 18px 0;
|
|
||||||
margin-bottom: 50px;
|
|
||||||
border-bottom: var(--light) 0.5px solid;
|
|
||||||
|
|
||||||
}
|
|
||||||
|
|
||||||
.navbar img.logo {
|
|
||||||
width: 100px;
|
|
||||||
float: left;
|
|
||||||
}
|
|
||||||
|
|
||||||
.navbar h4.nav-title {
|
|
||||||
display: inline;
|
|
||||||
margin-left: 16px;
|
|
||||||
position: relative;
|
|
||||||
top: 7px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.navbar a.nav-link, .navbar a.nav-link:visited {
|
|
||||||
|
|
||||||
float: right;
|
|
||||||
margin-top: 10px;
|
|
||||||
color: var(--secondary);
|
|
||||||
margin-left: 20px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.navbar a.nav-link:hover, .navbar a.nav-link:hover:visited {
|
|
||||||
color: var(--primary);
|
|
||||||
}
|
|
||||||
|
|
||||||
textarea::placeholder {
|
|
||||||
color: var(--light);
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Main Content Section */
|
|
||||||
|
|
||||||
section#content div#main {
|
|
||||||
padding: 32px 35px;
|
|
||||||
background-color: var(--bright);
|
|
||||||
width: 100%;
|
|
||||||
}
|
|
||||||
|
|
||||||
div#main form label {
|
|
||||||
font-size: small;
|
|
||||||
font-weight: normal;
|
|
||||||
}
|
|
||||||
|
|
||||||
div#main form input::placeholder {
|
|
||||||
color: var(--light);
|
|
||||||
}
|
|
||||||
|
|
||||||
div#main form button[type="submit"] {
|
|
||||||
margin-top: 20px;
|
|
||||||
}
|
|
||||||
|
|
||||||
div#main form input[type="file"] {
|
|
||||||
display: block;
|
|
||||||
margin-bottom: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Info Card */
|
|
||||||
|
|
||||||
.aside-card {
|
|
||||||
background-color: var(--bright);
|
|
||||||
padding: 20px 24px 15px 24px;
|
|
||||||
margin-bottom: 30px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.aside-card .clearfix {
|
|
||||||
margin-bottom: 15px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.aside-card .info-avatar {
|
|
||||||
width: 72px;
|
|
||||||
object-fit: contain;
|
|
||||||
float: left;
|
|
||||||
}
|
|
||||||
|
|
||||||
.aside-card .info-name {
|
|
||||||
margin: 0;
|
|
||||||
max-width: 120px;
|
|
||||||
margin-bottom: 12px;
|
|
||||||
padding-left: 8px;
|
|
||||||
float: left;
|
|
||||||
}
|
|
||||||
|
|
||||||
.aside-card .info-brief {
|
|
||||||
line-height: 2rem;
|
|
||||||
font-size: small;
|
|
||||||
overflow-wrap: break-word;
|
|
||||||
hyphens: auto;
|
|
||||||
}
|
|
||||||
|
|
||||||
.aside-card a.report {
|
|
||||||
color: var(--light);
|
|
||||||
font-size: small;
|
|
||||||
}
|
|
||||||
|
|
||||||
.aside-card a.follow {
|
|
||||||
font-size: small;
|
|
||||||
color: var(--secondary);
|
|
||||||
margin-right: 10px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.aside-card .button.add-button {
|
|
||||||
margin-top: 10px;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Relation Card */
|
|
||||||
|
|
||||||
.relation-card {
|
|
||||||
padding: 2px;
|
|
||||||
margin-bottom: 10px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.relation-card .relation-label {
|
|
||||||
margin: 0;
|
|
||||||
margin-bottom: 12px;
|
|
||||||
display: inline-block;
|
|
||||||
}
|
|
||||||
|
|
||||||
.relation-card .relation-user .relation-avatar {
|
|
||||||
width: 50px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.relation-card .relation-user .relation-name {
|
|
||||||
display: block;
|
|
||||||
font-size: small;
|
|
||||||
line-height: 1.8rem;
|
|
||||||
/* white-space: nowrap; */
|
|
||||||
text-overflow: ellipsis;
|
|
||||||
/* max-width: 100px; */
|
|
||||||
overflow: hidden;
|
|
||||||
}
|
|
||||||
|
|
||||||
.relation-card .relation-user-list {
|
|
||||||
margin-bottom: 15px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.relation-card .relation-user-list .relation-user {
|
|
||||||
list-style-type: none;
|
|
||||||
text-align: center;
|
|
||||||
margin-bottom: 0px !important;
|
|
||||||
justify-items: center;
|
|
||||||
padding: 0 3px !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Report Card */
|
|
||||||
|
|
||||||
.report-card {
|
|
||||||
padding: 2px;
|
|
||||||
font-size: small;
|
|
||||||
}
|
|
||||||
|
|
||||||
.report-card .report-label {
|
|
||||||
margin: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
.report-card .report-user-link {
|
|
||||||
padding: 0 5px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.report-card .report-message {
|
|
||||||
list-style-type: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
.item-card img.item-image {
|
|
||||||
height: 150px;
|
|
||||||
display: inline-block;
|
|
||||||
}
|
|
||||||
|
|
||||||
.item-card .item-info {
|
|
||||||
display: inline-block;
|
|
||||||
margin-left: 20px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.item-card .item-info .item-title {
|
|
||||||
font-weight: bold;
|
|
||||||
}
|
|
||||||
|
|
||||||
.item-card .item-info .rating-star {
|
|
||||||
display: inline;
|
|
||||||
position: relative;
|
|
||||||
top: 3px;
|
|
||||||
left: -2px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.prompt {
|
|
||||||
font-weight: bold;
|
|
||||||
margin-bottom: 40px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.review .option .selection ul {
|
|
||||||
list-style-type: none;
|
|
||||||
display: inline;
|
|
||||||
}
|
|
||||||
|
|
||||||
.review .option .selection ul li, .review .option .selection ul label {
|
|
||||||
display: inline;
|
|
||||||
}
|
|
||||||
|
|
||||||
.review .option .selection ul li {
|
|
||||||
position: relative;
|
|
||||||
top: 1px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.review .option input[type="checkbox"], .review .option input[type="radio"] {
|
|
||||||
position: relative;
|
|
||||||
top: 2px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.review input[type="submit"] {
|
|
||||||
margin-top: 16px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.review textarea {
|
|
||||||
height: 400px;
|
|
||||||
margin: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
.review .preview-button {
|
|
||||||
font-size: small;
|
|
||||||
font-weight: bold;
|
|
||||||
color: var(--primary);
|
|
||||||
cursor: pointer;
|
|
||||||
}
|
|
||||||
|
|
||||||
.review .markdownx-preview {
|
|
||||||
display: none;
|
|
||||||
min-height: 400px;
|
|
||||||
overflow: auto;
|
|
||||||
border-top: 0.1rem solid #d1d1d1;
|
|
||||||
border-bottom: 0.1rem solid #d1d1d1;
|
|
||||||
padding: 10px;
|
|
||||||
margin: 20px 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
.review .fyi {
|
|
||||||
margin-bottom: 15px;
|
|
||||||
color: var(--light);
|
|
||||||
}
|
|
||||||
|
|
||||||
.review {
|
|
||||||
margin-top: 30px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.review .delete-preview .markdownx-preview {
|
|
||||||
padding-left: 0;
|
|
||||||
padding-right: 0;
|
|
||||||
margin: 20px 0;
|
|
||||||
}
|
|
||||||
|
|
@ -1,129 +0,0 @@
|
||||||
$(document).ready( function() {
|
|
||||||
$("#userInfoCard .mast-brief").text($("<div>"+$("#userInfoCard .mast-brief").text().replace(/\<br/g,'\n<br').replace(/\<p/g,'\n<p')+"</div>").text());
|
|
||||||
$("#userInfoCard .mast-brief").html($("#userInfoCard .mast-brief").html().replace(/\n/g,'<br/>'));
|
|
||||||
|
|
||||||
let token = $("#oauth2Token").text();
|
|
||||||
let mast_domain = $("#mastodonURI").text();
|
|
||||||
let mast_uri = 'https://' + mast_domain
|
|
||||||
let id = $("#userMastodonID").text();
|
|
||||||
|
|
||||||
if (id && id != 'None' && mast_domain != 'twitter.com') {
|
|
||||||
// let userInfoSpinner = $("#spinner").clone().removeAttr("hidden");
|
|
||||||
let followersSpinner = $("#spinner").clone().removeAttr("hidden");
|
|
||||||
let followingSpinner = $("#spinner").clone().removeAttr("hidden");
|
|
||||||
// $("#userInfoCard").append(userInfoSpinner);
|
|
||||||
$("#followings h5").after(followingSpinner);
|
|
||||||
$("#followers h5").after(followersSpinner);
|
|
||||||
$(".mast-following-more").hide();
|
|
||||||
$(".mast-followers-more").hide();
|
|
||||||
|
|
||||||
getUserInfo(
|
|
||||||
id,
|
|
||||||
mast_uri,
|
|
||||||
token,
|
|
||||||
function(userData) {
|
|
||||||
let userName;
|
|
||||||
if (userData.display_name) {
|
|
||||||
userName = translateEmojis(userData.display_name, userData.emojis, true);
|
|
||||||
} else {
|
|
||||||
userName = userData.username;
|
|
||||||
}
|
|
||||||
$("#userInfoCard .mast-displayname").html(userName);
|
|
||||||
}
|
|
||||||
);
|
|
||||||
|
|
||||||
getFollowers(
|
|
||||||
id,
|
|
||||||
mast_uri,
|
|
||||||
token,
|
|
||||||
function(userList, request) {
|
|
||||||
if (userList.length == 0) {
|
|
||||||
$(".mast-followers").hide();
|
|
||||||
$(".mast-followers").before('<div style="margin-bottom: 20px;">暂无</div>');
|
|
||||||
|
|
||||||
} else {
|
|
||||||
if (userList.length > 4){
|
|
||||||
userList = userList.slice(0, 4);
|
|
||||||
$(".mast-followers-more").show();
|
|
||||||
}
|
|
||||||
let template = $(".mast-followers li").clone();
|
|
||||||
$(".mast-followers").html("");
|
|
||||||
userList.forEach(data => {
|
|
||||||
temp = $(template).clone();
|
|
||||||
temp.find("img").attr("src", data.avatar);
|
|
||||||
if (data.display_name) {
|
|
||||||
temp.find(".mast-displayname").html(translateEmojis(data.display_name, data.emojis));
|
|
||||||
} else {
|
|
||||||
temp.find(".mast-displayname").text(data.username);
|
|
||||||
}
|
|
||||||
let url;
|
|
||||||
if (data.acct.includes('@')) {
|
|
||||||
url = $("#userPageURL").text().replace('0', data.acct);
|
|
||||||
} else {
|
|
||||||
url = $("#userPageURL").text().replace('0', data.acct + '@' + mast_domain);
|
|
||||||
}
|
|
||||||
temp.find("a").attr('href', url);
|
|
||||||
$(".mast-followers").append(temp);
|
|
||||||
});
|
|
||||||
}
|
|
||||||
$(followersSpinner).remove();
|
|
||||||
}
|
|
||||||
);
|
|
||||||
|
|
||||||
getFollowing(
|
|
||||||
id,
|
|
||||||
mast_uri,
|
|
||||||
token,
|
|
||||||
function(userList, request) {
|
|
||||||
if (userList.length == 0) {
|
|
||||||
$(".mast-following").hide();
|
|
||||||
$(".mast-following").before('<div style="margin-bottom: 20px;">暂无</div>');
|
|
||||||
} else {
|
|
||||||
if (userList.length > 4){
|
|
||||||
userList = userList.slice(0, 4);
|
|
||||||
$(".mast-following-more").show();
|
|
||||||
}
|
|
||||||
let template = $(".mast-following li").clone();
|
|
||||||
$(".mast-following").html("");
|
|
||||||
userList.forEach(data => {
|
|
||||||
temp = $(template).clone()
|
|
||||||
temp.find("img").attr("src", data.avatar);
|
|
||||||
if (data.display_name) {
|
|
||||||
temp.find(".mast-displayname").html(translateEmojis(data.display_name, data.emojis));
|
|
||||||
} else {
|
|
||||||
temp.find(".mast-displayname").text(data.username);
|
|
||||||
}
|
|
||||||
let url;
|
|
||||||
if (data.acct.includes('@')) {
|
|
||||||
url = $("#userPageURL").text().replace('0', data.acct);
|
|
||||||
} else {
|
|
||||||
url = $("#userPageURL").text().replace('0', data.acct + '@' + mast_domain);
|
|
||||||
}
|
|
||||||
temp.find("a").attr('href', url);
|
|
||||||
$(".mast-following").append(temp);
|
|
||||||
});
|
|
||||||
}
|
|
||||||
$(followingSpinner).remove();
|
|
||||||
|
|
||||||
}
|
|
||||||
);
|
|
||||||
}
|
|
||||||
|
|
||||||
// mobile dropdown
|
|
||||||
$(".relation-dropdown__button").data("collapse", true);
|
|
||||||
function onClickDropdownButton(e) {
|
|
||||||
const button = $(".relation-dropdown__button");
|
|
||||||
button.data("collapse", !button.data("collapse"));
|
|
||||||
button.children('.icon-arrow').toggleClass("icon-arrow--expand");
|
|
||||||
$('.relation-dropdown__body').toggleClass("relation-dropdown__body--expand");
|
|
||||||
}
|
|
||||||
$(".relation-dropdown__button").on('click', onClickDropdownButton);
|
|
||||||
|
|
||||||
// close when click outside
|
|
||||||
window.onclick = evt => {
|
|
||||||
const target = $(evt.target);
|
|
||||||
if (!target.parents('.relation-dropdown').length && !$(".relation-dropdown__button").data("collapse")) {
|
|
||||||
onClickDropdownButton();
|
|
||||||
}
|
|
||||||
};
|
|
||||||
});
|
|
||||||
|
|
@ -1,81 +0,0 @@
|
||||||
function keyValueInput(valueKeyWidget, hiddenInput) {
|
|
||||||
let placeholderKey = valueKeyWidget.attr('placeholder-key');
|
|
||||||
let placeholderValue = valueKeyWidget.attr('placeholder-value');
|
|
||||||
if (placeholderKey == null) {
|
|
||||||
placeholderKey = '';
|
|
||||||
}
|
|
||||||
|
|
||||||
if (placeholderValue == null) {
|
|
||||||
placeholderValue = '';
|
|
||||||
}
|
|
||||||
// assign existing pairs to hidden input
|
|
||||||
setHiddenInput(valueKeyWidget);
|
|
||||||
|
|
||||||
let newInputPair = $('<input type="text"' + 'placeholder=' + placeholderKey + '><input type="text"' + 'placeholder=' + placeholderValue + '>');
|
|
||||||
valueKeyWidget.append(newInputPair.clone());
|
|
||||||
// add new input pair
|
|
||||||
valueKeyWidget.on('input', ':nth-last-child(1)', function () {
|
|
||||||
if ($(this).val() && $(this).prev().val()) {
|
|
||||||
valueKeyWidget.append($(newInputPair).clone());
|
|
||||||
}
|
|
||||||
});
|
|
||||||
valueKeyWidget.on('input', ':nth-last-child(2)', function () {
|
|
||||||
if ($(this).val() && $(this).next().val()) {
|
|
||||||
valueKeyWidget.append($(newInputPair).clone());
|
|
||||||
}
|
|
||||||
});
|
|
||||||
valueKeyWidget.on('input', ':nth-last-child(4)', function () {
|
|
||||||
if (!$(this).val() && !$(this).next().val() && valueKeyWidget.children("input").length > 2) {
|
|
||||||
$(this).next().remove();
|
|
||||||
$(this).remove();
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
valueKeyWidget.on('input', ':nth-last-child(3)', function () {
|
|
||||||
if (!$(this).val() && !$(this).prev().val() && valueKeyWidget.children("input").length > 2) {
|
|
||||||
$(this).prev().remove();
|
|
||||||
$(this).remove();
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
valueKeyWidget.on('input', function () {
|
|
||||||
setHiddenInput(this);
|
|
||||||
});
|
|
||||||
|
|
||||||
function setHiddenInput(elem) {
|
|
||||||
let keys = $(elem).children(":nth-child(odd)").map(function () {
|
|
||||||
if ($(this).val()) {
|
|
||||||
return $(this).val();
|
|
||||||
}
|
|
||||||
}).get();
|
|
||||||
let values = $(elem).children(":nth-child(even)").map(function () {
|
|
||||||
if ($(this).val()) {
|
|
||||||
return $(this).val();
|
|
||||||
}
|
|
||||||
}).get();
|
|
||||||
if (keys.length == values.length) {
|
|
||||||
let finalValue = [];
|
|
||||||
keys.forEach(function (key, i) {
|
|
||||||
let json = new Object;
|
|
||||||
json[key] = values[i];
|
|
||||||
finalValue.push(JSON.stringify(json))
|
|
||||||
});
|
|
||||||
hiddenInput.val(finalValue.toString());
|
|
||||||
} else if (keys.length - values.length == 1) {
|
|
||||||
let finalValue = [];
|
|
||||||
keys.forEach(function (key, i) {
|
|
||||||
let json = new Object;
|
|
||||||
if (i < keys.length - 1) {
|
|
||||||
json[key] = values[i];
|
|
||||||
} else {
|
|
||||||
json[key] = ''
|
|
||||||
}
|
|
||||||
finalValue.push(JSON.stringify(json))
|
|
||||||
});
|
|
||||||
hiddenInput.val(finalValue.toString());
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
@ -1,140 +0,0 @@
|
||||||
// .replace(":id", "")
|
|
||||||
|
|
||||||
// GET
|
|
||||||
const API_FOLLOWERS = "/api/v1/accounts/:id/followers"
|
|
||||||
// GET
|
|
||||||
const API_FOLLOWING = "/api/v1/accounts/:id/following"
|
|
||||||
// GET
|
|
||||||
const API_GET_ACCOUNT = '/api/v1/accounts/:id'
|
|
||||||
|
|
||||||
const NUMBER_PER_REQUEST = 20
|
|
||||||
|
|
||||||
|
|
||||||
// [
|
|
||||||
// {
|
|
||||||
// "id": "1020382",
|
|
||||||
// "username": "atul13061987",
|
|
||||||
// "acct": "atul13061987",
|
|
||||||
// "display_name": "",
|
|
||||||
// "locked": false,
|
|
||||||
// "bot": false,
|
|
||||||
// "created_at": "2019-12-04T07:17:02.745Z",
|
|
||||||
// "note": "<p></p>",
|
|
||||||
// "url": "https://mastodon.social/@atul13061987",
|
|
||||||
// "avatar": "https://mastodon.social/avatars/original/missing.png",
|
|
||||||
// "avatar_static": "https://mastodon.social/avatars/original/missing.png",
|
|
||||||
// "header": "https://mastodon.social/headers/original/missing.png",
|
|
||||||
// "header_static": "https://mastodon.social/headers/original/missing.png",
|
|
||||||
// "followers_count": 0,
|
|
||||||
// "following_count": 2,
|
|
||||||
// "statuses_count": 0,
|
|
||||||
// "last_status_at": null,
|
|
||||||
// "emojis": [],
|
|
||||||
// "fields": []
|
|
||||||
// },
|
|
||||||
// {
|
|
||||||
// "id": "1020381",
|
|
||||||
// "username": "linuxliner",
|
|
||||||
// "acct": "linuxliner",
|
|
||||||
// "display_name": "",
|
|
||||||
// "locked": false,
|
|
||||||
// "bot": false,
|
|
||||||
// "created_at": "2019-12-04T07:15:56.426Z",
|
|
||||||
// "note": "<p></p>",
|
|
||||||
// "url": "https://mastodon.social/@linuxliner",
|
|
||||||
// "avatar": "https://mastodon.social/avatars/original/missing.png",
|
|
||||||
// "avatar_static": "https://mastodon.social/avatars/original/missing.png",
|
|
||||||
// "header": "https://mastodon.social/headers/original/missing.png",
|
|
||||||
// "header_static": "https://mastodon.social/headers/original/missing.png",
|
|
||||||
// "followers_count": 0,
|
|
||||||
// "following_count": 2,
|
|
||||||
// "statuses_count": 0,
|
|
||||||
// "last_status_at": null,
|
|
||||||
// "emojis": [],
|
|
||||||
// "fields": []
|
|
||||||
// }
|
|
||||||
// ]
|
|
||||||
async function getFollowers(id, mastodonURI, token, callback) {
|
|
||||||
const url = mastodonURI + API_FOLLOWERS.replace(":id", id);
|
|
||||||
var response;
|
|
||||||
try {
|
|
||||||
response = await fetch(url+'?limit='+NUMBER_PER_REQUEST, {headers: {'Authorization': 'Bearer ' + token}});
|
|
||||||
} catch (e) {
|
|
||||||
console.error('loading followers failed.');
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
const json = await response.json();
|
|
||||||
let nextUrl = null;
|
|
||||||
let links = response.headers.get('link');
|
|
||||||
if (links) {
|
|
||||||
links.split(',').forEach(link => {
|
|
||||||
if (link.includes('next')) {
|
|
||||||
let regex = /<(.*?)>/;
|
|
||||||
nextUrl = link.match(regex)[1];
|
|
||||||
}
|
|
||||||
});
|
|
||||||
}
|
|
||||||
callback(json, nextUrl);
|
|
||||||
}
|
|
||||||
|
|
||||||
async function getFollowing(id, mastodonURI, token, callback) {
|
|
||||||
const url = mastodonURI + API_FOLLOWING.replace(":id", id);
|
|
||||||
var response;
|
|
||||||
try {
|
|
||||||
response = await fetch(url+'?limit='+NUMBER_PER_REQUEST, {headers: {'Authorization': 'Bearer ' + token}});
|
|
||||||
} catch (e) {
|
|
||||||
console.error('loading following failed.');
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
const json = await response.json();
|
|
||||||
let nextUrl = null;
|
|
||||||
let links = response.headers.get('link');
|
|
||||||
if (links) {
|
|
||||||
links.split(',').forEach(link => {
|
|
||||||
if (link.includes('next')) {
|
|
||||||
let regex = /<(.*?)>/;
|
|
||||||
nextUrl = link.match(regex)[1];
|
|
||||||
}
|
|
||||||
});
|
|
||||||
}
|
|
||||||
callback(json, nextUrl);
|
|
||||||
}
|
|
||||||
|
|
||||||
function getUserInfo(id, mastodonURI, token, callback) {
|
|
||||||
let url = mastodonURI + API_GET_ACCOUNT.replace(":id", id);
|
|
||||||
fetch(url, {headers: {'Authorization': 'Bearer ' + token}}).then((response) => response.json()).then(callback);
|
|
||||||
// $.ajax({
|
|
||||||
// url: url,
|
|
||||||
// method: 'GET',
|
|
||||||
// headers: {
|
|
||||||
// 'Authorization': 'Bearer ' + token,
|
|
||||||
// },
|
|
||||||
// success: function(data){
|
|
||||||
// callback(data);
|
|
||||||
// },
|
|
||||||
// });
|
|
||||||
}
|
|
||||||
|
|
||||||
function getEmojiDict(emoji_list) {
|
|
||||||
let dict = new Object;
|
|
||||||
emoji_list.forEach(pair => {
|
|
||||||
dict[":" + pair.shortcode + ":"] = pair.url;
|
|
||||||
});
|
|
||||||
return dict;
|
|
||||||
}
|
|
||||||
|
|
||||||
function translateEmojis(text, emoji_list, large) {
|
|
||||||
let dict = getEmojiDict(emoji_list);
|
|
||||||
let regex = /:(.*?):/g;
|
|
||||||
let translation = null
|
|
||||||
if (large) {
|
|
||||||
translation = text.replace(regex, function (match) {
|
|
||||||
return "<img src=" + dict[match] + " class=emoji--large alt=" + match + ">";
|
|
||||||
});
|
|
||||||
} else {
|
|
||||||
translation = text.replace(regex, function (match) {
|
|
||||||
return "<img src=" + dict[match] + " class=emoji alt=" + match + ">";
|
|
||||||
});
|
|
||||||
}
|
|
||||||
return translation;
|
|
||||||
}
|
|
||||||
|
|
@ -1,271 +0,0 @@
|
||||||
.action-bar {
|
|
||||||
float: right;
|
|
||||||
color: #ccc;
|
|
||||||
}
|
|
||||||
|
|
||||||
.action-bar.inline {
|
|
||||||
float: unset;
|
|
||||||
display: inline;
|
|
||||||
}
|
|
||||||
|
|
||||||
.action-bar a {
|
|
||||||
cursor: pointer;
|
|
||||||
color: #ccc;
|
|
||||||
}
|
|
||||||
|
|
||||||
.action-bar>span {
|
|
||||||
margin-left: 8px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.action-bar a:hover {
|
|
||||||
color: #00a1cc;
|
|
||||||
}
|
|
||||||
|
|
||||||
.action-icon svg {
|
|
||||||
cursor: pointer;
|
|
||||||
fill: #ccc;
|
|
||||||
height: 12px;
|
|
||||||
vertical-align: text-bottom;
|
|
||||||
}
|
|
||||||
|
|
||||||
.entity-list__entity-img-wrapper {
|
|
||||||
position: relative;
|
|
||||||
}
|
|
||||||
|
|
||||||
.entity-list__entity-action-icon {
|
|
||||||
position: absolute;
|
|
||||||
top:0;
|
|
||||||
right:0;
|
|
||||||
mix-blend-mode: hard-light;
|
|
||||||
text-stroke: 1px black;
|
|
||||||
background-color: lightgray;
|
|
||||||
border-radius: 0 0 0 8px;
|
|
||||||
padding: 0 4px;
|
|
||||||
cursor: pointer;
|
|
||||||
opacity: 0.2;
|
|
||||||
}
|
|
||||||
|
|
||||||
.entity-list__entity-action-icon:hover {
|
|
||||||
opacity: 1;
|
|
||||||
}
|
|
||||||
|
|
||||||
.helptext{
|
|
||||||
position: relative;
|
|
||||||
top: -1em;
|
|
||||||
}
|
|
||||||
/*** django-jsoneditor ***/
|
|
||||||
div.jsoneditor {
|
|
||||||
border-color: #ccc !important;;
|
|
||||||
}
|
|
||||||
div.jsoneditor-menu {
|
|
||||||
background-color: #606c76 !important;;
|
|
||||||
border-color: #606c76 !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
/***** MODAL DIALOG ****/
|
|
||||||
#modal {
|
|
||||||
/* Underlay covers entire screen. */
|
|
||||||
position: fixed;
|
|
||||||
top:0px;
|
|
||||||
bottom: 0px;
|
|
||||||
left:0px;
|
|
||||||
right:0px;
|
|
||||||
background-color:rgba(0,0,0,0.5);
|
|
||||||
z-index:1000;
|
|
||||||
|
|
||||||
/* Flexbox centers the .modal-content vertically and horizontally */
|
|
||||||
display:flex;
|
|
||||||
flex-direction:column;
|
|
||||||
align-items:center;
|
|
||||||
|
|
||||||
/* Animate when opening */
|
|
||||||
animation-name: fadeIn;
|
|
||||||
animation-duration:150ms;
|
|
||||||
animation-timing-function: ease;
|
|
||||||
}
|
|
||||||
|
|
||||||
#modal > .modal-underlay {
|
|
||||||
/* underlay takes up the entire viewport. This is only
|
|
||||||
required if you want to click to dismiss the popup */
|
|
||||||
position: absolute;
|
|
||||||
z-index: -1;
|
|
||||||
.collection_list_position_edittop:0px;
|
|
||||||
|
|
||||||
|
|
||||||
bottom:0px;
|
|
||||||
left: 0px;
|
|
||||||
right: 0px;
|
|
||||||
}
|
|
||||||
|
|
||||||
#modal > .modal-content {
|
|
||||||
/* Position visible dialog near the top of the window */
|
|
||||||
margin-top:10vh;
|
|
||||||
|
|
||||||
/* Sizing for visible dialog */
|
|
||||||
width:80%;
|
|
||||||
max-width:600px;
|
|
||||||
|
|
||||||
/* Display properties for visible dialog*/
|
|
||||||
background-color: #f7f7f7;
|
|
||||||
padding: 20px 20px 10px 20px;
|
|
||||||
color: #606c76;
|
|
||||||
|
|
||||||
/* Animate when opening */
|
|
||||||
animation-name:zoomIn;
|
|
||||||
animation-duration:150ms;
|
|
||||||
animation-timing-function: ease;
|
|
||||||
}
|
|
||||||
|
|
||||||
#modal.closing {
|
|
||||||
/* Animate when closing */
|
|
||||||
animation-name: fadeOut;
|
|
||||||
animation-duration:150ms;
|
|
||||||
animation-timing-function: ease;
|
|
||||||
}
|
|
||||||
|
|
||||||
#modal.closing > .modal-content {
|
|
||||||
/* Aniate when closing */
|
|
||||||
animation-name: zoomOut;
|
|
||||||
animation-duration:150ms;
|
|
||||||
animation-timing-function: ease;
|
|
||||||
}
|
|
||||||
|
|
||||||
@keyframes fadeIn {
|
|
||||||
0% {opacity: 0;}
|
|
||||||
100% {opacity: 1;}
|
|
||||||
}
|
|
||||||
|
|
||||||
@keyframes fadeOut {
|
|
||||||
0% {opacity: 1;}
|
|
||||||
100% {opacity: 0;}
|
|
||||||
}
|
|
||||||
|
|
||||||
@keyframes zoomIn {
|
|
||||||
0% {transform: scale(0.9);}
|
|
||||||
100% {transform: scale(1);}
|
|
||||||
}
|
|
||||||
|
|
||||||
@keyframes zoomOut {
|
|
||||||
0% {transform: scale(1);}
|
|
||||||
100% {transform: scale(0.9);}
|
|
||||||
}
|
|
||||||
|
|
||||||
#modal .add-to-list-modal__head {
|
|
||||||
margin-bottom: 20px;
|
|
||||||
}
|
|
||||||
|
|
||||||
#modal .add-to-list-modal__head::after {
|
|
||||||
content: ' ';
|
|
||||||
clear: both;
|
|
||||||
display: table;
|
|
||||||
}
|
|
||||||
|
|
||||||
#modal .add-to-list-modal__title {
|
|
||||||
font-weight: bold;
|
|
||||||
font-size: 1.2em;
|
|
||||||
float: left;
|
|
||||||
}
|
|
||||||
|
|
||||||
#modal .add-to-list-modal__close-button {
|
|
||||||
float: right;
|
|
||||||
cursor: pointer;
|
|
||||||
}
|
|
||||||
|
|
||||||
#modal .add-to-list-modal__confirm-button {
|
|
||||||
float: right;
|
|
||||||
}
|
|
||||||
|
|
||||||
#modal li, #modal ul, #modal label {
|
|
||||||
display: inline;
|
|
||||||
}
|
|
||||||
|
|
||||||
.donut {
|
|
||||||
margin-left: 10%;
|
|
||||||
width: 80%;
|
|
||||||
aspect-ratio : 1 / 1;
|
|
||||||
border-radius: 50%;
|
|
||||||
display: flex;
|
|
||||||
align-items: center;
|
|
||||||
justify-content: center;
|
|
||||||
}
|
|
||||||
.donut .hole {
|
|
||||||
width: 80%;
|
|
||||||
aspect-ratio : 1 / 1;
|
|
||||||
border-radius: 50%;
|
|
||||||
background: #f7f7f7;
|
|
||||||
display: flex;
|
|
||||||
align-items: center;
|
|
||||||
justify-content: center;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* progress {
|
|
||||||
border-radius: 7px;
|
|
||||||
width: 80%;
|
|
||||||
height: 10px;
|
|
||||||
box-shadow: 1px 1px 4px rgba( 0, 0, 0, 0.2 );
|
|
||||||
}
|
|
||||||
::-webkit-progress-bar {
|
|
||||||
background-color: #ccc;
|
|
||||||
}
|
|
||||||
::-webkit-progress-value {
|
|
||||||
background-color: #00a1cc;
|
|
||||||
} */
|
|
||||||
|
|
||||||
.markdownx-editor {
|
|
||||||
font-family: monospace;
|
|
||||||
}
|
|
||||||
|
|
||||||
.icon {
|
|
||||||
color: grey;
|
|
||||||
cursor: pointer;
|
|
||||||
}
|
|
||||||
.icon:hover {
|
|
||||||
color: #00a1cc;
|
|
||||||
}
|
|
||||||
|
|
||||||
input:invalid#position {
|
|
||||||
border: red dashed 1px;
|
|
||||||
}
|
|
||||||
|
|
||||||
summary:focus {
|
|
||||||
outline-style: none;
|
|
||||||
}
|
|
||||||
summary::-webkit-details-marker {
|
|
||||||
display: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
.gg-play-button-o {
|
|
||||||
box-sizing: border-box;
|
|
||||||
position: relative;
|
|
||||||
display: inline-block;
|
|
||||||
transform: scale(var(--ggs,1));
|
|
||||||
width: 22px;
|
|
||||||
height: 22px;
|
|
||||||
border: 2px solid;
|
|
||||||
border-radius: 20px
|
|
||||||
}
|
|
||||||
.gg-play-button-o::before {
|
|
||||||
content: "";
|
|
||||||
display: inline-block;
|
|
||||||
box-sizing: border-box;
|
|
||||||
position: absolute;
|
|
||||||
width: 0;
|
|
||||||
height: 10px;
|
|
||||||
border-top: 5px solid transparent;
|
|
||||||
border-bottom: 5px solid transparent;
|
|
||||||
border-left: 6px solid;
|
|
||||||
top: 4px;
|
|
||||||
left: 7px
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
.icon-spin {
|
|
||||||
transition: transform .8s ease-in-out;
|
|
||||||
}
|
|
||||||
.icon-spin:hover {
|
|
||||||
transform: rotate(360deg);
|
|
||||||
}
|
|
||||||
|
|
||||||
.action-bar .fa-lock, .fa-spin {
|
|
||||||
color: lightgray;
|
|
||||||
}
|
|
||||||
|
|
@ -1,38 +0,0 @@
|
||||||
.jq-stars {
|
|
||||||
display: inline-block;
|
|
||||||
}
|
|
||||||
|
|
||||||
.jq-rating-label {
|
|
||||||
font-size: 22px;
|
|
||||||
display: inline-block;
|
|
||||||
position: relative;
|
|
||||||
vertical-align: top;
|
|
||||||
font-family: helvetica, arial, verdana;
|
|
||||||
}
|
|
||||||
|
|
||||||
.jq-star {
|
|
||||||
width: 100px;
|
|
||||||
height: 100px;
|
|
||||||
display: inline-block;
|
|
||||||
cursor: pointer;
|
|
||||||
}
|
|
||||||
|
|
||||||
.jq-star-svg {
|
|
||||||
padding-left: 3px;
|
|
||||||
width: 100%;
|
|
||||||
height: 100% ;
|
|
||||||
}
|
|
||||||
|
|
||||||
.jq-star:hover .fs-star-svg path {
|
|
||||||
}
|
|
||||||
|
|
||||||
.jq-star-svg path {
|
|
||||||
/* stroke: #000; */
|
|
||||||
stroke-linejoin: round;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* un-used */
|
|
||||||
.jq-shadow {
|
|
||||||
-webkit-filter: drop-shadow( -2px -2px 2px #888 );
|
|
||||||
filter: drop-shadow( -2px -2px 2px #888 );
|
|
||||||
}
|
|
||||||
|
|
@ -1,64 +0,0 @@
|
||||||
@charset "UTF-8";
|
|
||||||
.tag-input {
|
|
||||||
display: -webkit-box;
|
|
||||||
display: -ms-flexbox;
|
|
||||||
display: flex;
|
|
||||||
-webkit-box-pack: start;
|
|
||||||
-ms-flex-pack: start;
|
|
||||||
justify-content: flex-start;
|
|
||||||
-ms-flex-wrap: wrap;
|
|
||||||
flex-wrap: wrap;
|
|
||||||
border-bottom: 0.1rem solid #ccc;
|
|
||||||
padding-bottom: 2px;
|
|
||||||
|
|
||||||
}
|
|
||||||
|
|
||||||
.tag-input__tag {
|
|
||||||
position: relative;
|
|
||||||
display: block;
|
|
||||||
float: left;
|
|
||||||
color: white;
|
|
||||||
background: #d5d5d5;
|
|
||||||
padding: 5px 20px 5px 6px;
|
|
||||||
margin: 4px;
|
|
||||||
border-radius: .4rem;
|
|
||||||
line-height: 1em;
|
|
||||||
-webkit-transition: all 0.2s ease-in-out;
|
|
||||||
transition: all 0.2s ease-in-out;
|
|
||||||
}
|
|
||||||
|
|
||||||
.tag-input__tag.tag-input__tag--highlight {
|
|
||||||
color: white;
|
|
||||||
background: #00a1cc;
|
|
||||||
}
|
|
||||||
|
|
||||||
.tag-input__close {
|
|
||||||
position: absolute;
|
|
||||||
top: 0;
|
|
||||||
right: 0;
|
|
||||||
width: 14px;
|
|
||||||
height: 100%;
|
|
||||||
cursor: pointer;
|
|
||||||
border-radius: 0 2px 2px 0;
|
|
||||||
-webkit-transition: background 0.2s;
|
|
||||||
transition: background 0.2s;
|
|
||||||
}
|
|
||||||
|
|
||||||
.tag-input__close:after {
|
|
||||||
position: absolute;
|
|
||||||
content: "×";
|
|
||||||
top: 5px;
|
|
||||||
left: 2px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.tag-input__close:hover {
|
|
||||||
color: #606c76;
|
|
||||||
}
|
|
||||||
|
|
||||||
.tag-input input {
|
|
||||||
border: 0;
|
|
||||||
margin: 4px;
|
|
||||||
padding: 3px 7px 3px 0;
|
|
||||||
width: auto;
|
|
||||||
outline: none;
|
|
||||||
}
|
|
||||||
File diff suppressed because one or more lines are too long
|
|
@ -1,311 +0,0 @@
|
||||||
/*
|
|
||||||
* jQuery StarRatingSvg v1.2.0
|
|
||||||
*
|
|
||||||
* http://github.com/nashio/star-rating-svg
|
|
||||||
* http://nashio.github.io/star-rating-svg/demo/
|
|
||||||
* Author: Ignacio Chavez
|
|
||||||
* hello@ignaciochavez.com
|
|
||||||
* Licensed under MIT
|
|
||||||
*/
|
|
||||||
|
|
||||||
;(function ( $, window, document, undefined ) {
|
|
||||||
|
|
||||||
'use strict';
|
|
||||||
|
|
||||||
// Create the defaults once
|
|
||||||
var pluginName = 'starRating';
|
|
||||||
var noop = function(){};
|
|
||||||
var defaults = {
|
|
||||||
totalStars: 5,
|
|
||||||
useFullStars: false,
|
|
||||||
starShape: 'straight',
|
|
||||||
emptyColor: 'lightgray',
|
|
||||||
hoverColor: 'gold',
|
|
||||||
activeColor: 'gold',
|
|
||||||
ratedColor: 'gold',
|
|
||||||
useGradient: false,
|
|
||||||
readOnly: false,
|
|
||||||
disableAfterRate: false,
|
|
||||||
baseUrl: false,
|
|
||||||
starGradient: {
|
|
||||||
start: '#FEF7CD',
|
|
||||||
end: '#FF9511'
|
|
||||||
},
|
|
||||||
strokeWidth: 0,
|
|
||||||
strokeColor: 'black',
|
|
||||||
initialRating: 0,
|
|
||||||
starSize: 18,
|
|
||||||
callback: noop,
|
|
||||||
onHover: noop,
|
|
||||||
onLeave: noop
|
|
||||||
};
|
|
||||||
|
|
||||||
// The actual plugin constructor
|
|
||||||
var Plugin = function( element, options ) {
|
|
||||||
var _rating;
|
|
||||||
this.element = element;
|
|
||||||
this.$el = $(element);
|
|
||||||
this.settings = $.extend( {}, defaults, options );
|
|
||||||
|
|
||||||
// grab rating if defined on the element
|
|
||||||
_rating = this.$el.data('rating') || this.settings.initialRating;
|
|
||||||
this._state = {
|
|
||||||
// round to the nearest half
|
|
||||||
rating: (Math.round( _rating * 2 ) / 2).toFixed(1)
|
|
||||||
};
|
|
||||||
|
|
||||||
// create unique id for stars
|
|
||||||
this._uid = Math.floor( Math.random() * 999 );
|
|
||||||
|
|
||||||
// override gradient if not used
|
|
||||||
if( !options.starGradient && !this.settings.useGradient ){
|
|
||||||
this.settings.starGradient.start = this.settings.starGradient.end = this.settings.activeColor;
|
|
||||||
}
|
|
||||||
|
|
||||||
this._defaults = defaults;
|
|
||||||
this._name = pluginName;
|
|
||||||
this.init();
|
|
||||||
};
|
|
||||||
|
|
||||||
var methods = {
|
|
||||||
init: function () {
|
|
||||||
this.renderMarkup();
|
|
||||||
this.addListeners();
|
|
||||||
this.initRating();
|
|
||||||
},
|
|
||||||
|
|
||||||
addListeners: function(){
|
|
||||||
if( this.settings.readOnly ){ return; }
|
|
||||||
this.$stars.on('mouseover', this.hoverRating.bind(this));
|
|
||||||
this.$stars.on('mouseout', this.restoreState.bind(this));
|
|
||||||
this.$stars.on('click', this.handleRating.bind(this));
|
|
||||||
},
|
|
||||||
|
|
||||||
// apply styles to hovered stars
|
|
||||||
hoverRating: function(e){
|
|
||||||
var index = this.getIndex(e);
|
|
||||||
this.paintStars(index, 'hovered');
|
|
||||||
this.settings.onHover(index + 1, this._state.rating, this.$el);
|
|
||||||
},
|
|
||||||
|
|
||||||
// clicked on a rate, apply style and state
|
|
||||||
handleRating: function(e){
|
|
||||||
var index = this.getIndex(e);
|
|
||||||
var rating = index + 1;
|
|
||||||
|
|
||||||
this.applyRating(rating, this.$el);
|
|
||||||
this.executeCallback( rating, this.$el );
|
|
||||||
|
|
||||||
if(this.settings.disableAfterRate){
|
|
||||||
this.$stars.off();
|
|
||||||
}
|
|
||||||
},
|
|
||||||
|
|
||||||
applyRating: function(rating){
|
|
||||||
var index = rating - 1;
|
|
||||||
// paint selected and remove hovered color
|
|
||||||
this.paintStars(index, 'rated');
|
|
||||||
this._state.rating = index + 1;
|
|
||||||
this._state.rated = true;
|
|
||||||
},
|
|
||||||
|
|
||||||
restoreState: function(e){
|
|
||||||
var index = this.getIndex(e);
|
|
||||||
var rating = this._state.rating || -1;
|
|
||||||
// determine star color depending on manually rated
|
|
||||||
var colorType = this._state.rated ? 'rated' : 'active';
|
|
||||||
this.paintStars(rating - 1, colorType);
|
|
||||||
this.settings.onLeave(index + 1, this._state.rating, this.$el);
|
|
||||||
},
|
|
||||||
|
|
||||||
getIndex: function(e){
|
|
||||||
var $target = $(e.currentTarget);
|
|
||||||
var width = $target.width();
|
|
||||||
var side = $(e.target).attr('data-side');
|
|
||||||
|
|
||||||
// hovered outside the star, calculate by pixel instead
|
|
||||||
side = (!side) ? this.getOffsetByPixel(e, $target, width) : side;
|
|
||||||
side = (this.settings.useFullStars) ? 'right' : side ;
|
|
||||||
|
|
||||||
// get index for half or whole star
|
|
||||||
var index = $target.index() - ((side === 'left') ? 0.5 : 0);
|
|
||||||
|
|
||||||
// pointer is way to the left, rating should be none
|
|
||||||
index = ( index < 0.5 && (e.offsetX < width / 4) ) ? -1 : index;
|
|
||||||
return index;
|
|
||||||
},
|
|
||||||
|
|
||||||
getOffsetByPixel: function(e, $target, width){
|
|
||||||
var leftX = e.pageX - $target.offset().left;
|
|
||||||
return ( leftX <= (width / 2) && !this.settings.useFullStars) ? 'left' : 'right';
|
|
||||||
},
|
|
||||||
|
|
||||||
initRating: function(){
|
|
||||||
this.paintStars(this._state.rating - 1, 'active');
|
|
||||||
},
|
|
||||||
|
|
||||||
paintStars: function(endIndex, stateClass){
|
|
||||||
var $polygonLeft;
|
|
||||||
var $polygonRight;
|
|
||||||
var leftClass;
|
|
||||||
var rightClass;
|
|
||||||
|
|
||||||
$.each(this.$stars, function(index, star){
|
|
||||||
$polygonLeft = $(star).find('[data-side="left"]');
|
|
||||||
$polygonRight = $(star).find('[data-side="right"]');
|
|
||||||
leftClass = rightClass = (index <= endIndex) ? stateClass : 'empty';
|
|
||||||
|
|
||||||
// has another half rating, add half star
|
|
||||||
leftClass = ( index - endIndex === 0.5 ) ? stateClass : leftClass;
|
|
||||||
|
|
||||||
$polygonLeft.attr('class', 'svg-' + leftClass + '-' + this._uid);
|
|
||||||
$polygonRight.attr('class', 'svg-' + rightClass + '-' + this._uid);
|
|
||||||
|
|
||||||
}.bind(this));
|
|
||||||
},
|
|
||||||
|
|
||||||
renderMarkup: function () {
|
|
||||||
var s = this.settings;
|
|
||||||
var baseUrl = s.baseUrl ? location.href.split('#')[0] : '';
|
|
||||||
|
|
||||||
// inject an svg manually to have control over attributes
|
|
||||||
var star = '<div class="jq-star" style="width:' + s.starSize+ 'px; height:' + s.starSize + 'px;"><svg version="1.0" class="jq-star-svg" shape-rendering="geometricPrecision" xmlns="http://www.w3.org/2000/svg" ' + this.getSvgDimensions(s.starShape) + ' stroke-width:' + s.strokeWidth + 'px;" xml:space="preserve"><style type="text/css">.svg-empty-' + this._uid + '{fill:url(' + baseUrl + '#' + this._uid + '_SVGID_1_);}.svg-hovered-' + this._uid + '{fill:url(' + baseUrl + '#' + this._uid + '_SVGID_2_);}.svg-active-' + this._uid + '{fill:url(' + baseUrl + '#' + this._uid + '_SVGID_3_);}.svg-rated-' + this._uid + '{fill:' + s.ratedColor + ';}</style>' +
|
|
||||||
|
|
||||||
this.getLinearGradient(this._uid + '_SVGID_1_', s.emptyColor, s.emptyColor, s.starShape) +
|
|
||||||
this.getLinearGradient(this._uid + '_SVGID_2_', s.hoverColor, s.hoverColor, s.starShape) +
|
|
||||||
this.getLinearGradient(this._uid + '_SVGID_3_', s.starGradient.start, s.starGradient.end, s.starShape) +
|
|
||||||
this.getVectorPath(this._uid, {
|
|
||||||
starShape: s.starShape,
|
|
||||||
strokeWidth: s.strokeWidth,
|
|
||||||
strokeColor: s.strokeColor
|
|
||||||
} ) +
|
|
||||||
'</svg></div>';
|
|
||||||
|
|
||||||
// inject svg markup
|
|
||||||
var starsMarkup = '';
|
|
||||||
for( var i = 0; i < s.totalStars; i++){
|
|
||||||
starsMarkup += star;
|
|
||||||
}
|
|
||||||
this.$el.append(starsMarkup);
|
|
||||||
this.$stars = this.$el.find('.jq-star');
|
|
||||||
},
|
|
||||||
|
|
||||||
getVectorPath: function(id, attrs){
|
|
||||||
return (attrs.starShape === 'rounded') ?
|
|
||||||
this.getRoundedVectorPath(id, attrs) : this.getSpikeVectorPath(id, attrs);
|
|
||||||
},
|
|
||||||
|
|
||||||
getSpikeVectorPath: function(id, attrs){
|
|
||||||
return '<polygon data-side="center" class="svg-empty-' + id + '" points="281.1,129.8 364,55.7 255.5,46.8 214,-59 172.5,46.8 64,55.4 146.8,129.7 121.1,241 212.9,181.1 213.9,181 306.5,241 " style="fill: transparent; stroke: ' + attrs.strokeColor + ';" />' +
|
|
||||||
'<polygon data-side="left" class="svg-empty-' + id + '" points="281.1,129.8 364,55.7 255.5,46.8 214,-59 172.5,46.8 64,55.4 146.8,129.7 121.1,241 213.9,181.1 213.9,181 306.5,241 " style="stroke-opacity: 0;" />' +
|
|
||||||
'<polygon data-side="right" class="svg-empty-' + id + '" points="364,55.7 255.5,46.8 214,-59 213.9,181 306.5,241 281.1,129.8 " style="stroke-opacity: 0;" />';
|
|
||||||
},
|
|
||||||
|
|
||||||
getRoundedVectorPath: function(id, attrs){
|
|
||||||
var fullPoints = 'M520.9,336.5c-3.8-11.8-14.2-20.5-26.5-22.2l-140.9-20.5l-63-127.7 c-5.5-11.2-16.8-18.2-29.3-18.2c-12.5,0-23.8,7-29.3,18.2l-63,127.7L28,314.2C15.7,316,5.4,324.7,1.6,336.5S1,361.3,9.9,370 l102,99.4l-24,140.3c-2.1,12.3,2.9,24.6,13,32c5.7,4.2,12.4,6.2,19.2,6.2c5.2,0,10.5-1.2,15.2-3.8l126-66.3l126,66.2 c4.8,2.6,10,3.8,15.2,3.8c6.8,0,13.5-2.1,19.2-6.2c10.1-7.3,15.1-19.7,13-32l-24-140.3l102-99.4 C521.6,361.3,524.8,348.3,520.9,336.5z';
|
|
||||||
|
|
||||||
return '<path data-side="center" class="svg-empty-' + id + '" d="' + fullPoints + '" style="stroke: ' + attrs.strokeColor + '; fill: transparent; " /><path data-side="right" class="svg-empty-' + id + '" d="' + fullPoints + '" style="stroke-opacity: 0;" /><path data-side="left" class="svg-empty-' + id + '" d="M121,648c-7.3,0-14.1-2.2-19.8-6.4c-10.4-7.6-15.6-20.3-13.4-33l24-139.9l-101.6-99 c-9.1-8.9-12.4-22.4-8.6-34.5c3.9-12.1,14.6-21.1,27.2-23l140.4-20.4L232,164.6c5.7-11.6,17.3-18.8,30.2-16.8c0.6,0,1,0.4,1,1 v430.1c0,0.4-0.2,0.7-0.5,0.9l-126,66.3C132,646.6,126.6,648,121,648z" style="stroke: ' + attrs.strokeColor + '; stroke-opacity: 0;" />';
|
|
||||||
},
|
|
||||||
|
|
||||||
getSvgDimensions: function(starShape){
|
|
||||||
return (starShape === 'rounded') ? 'width="550px" height="500.2px" viewBox="0 146.8 550 500.2" style="enable-background:new 0 0 550 500.2;' : 'x="0px" y="0px" width="305px" height="305px" viewBox="60 -62 309 309" style="enable-background:new 64 -59 305 305;';
|
|
||||||
},
|
|
||||||
|
|
||||||
getLinearGradient: function(id, startColor, endColor, starShape){
|
|
||||||
var height = (starShape === 'rounded') ? 500 : 250;
|
|
||||||
return '<linearGradient id="' + id + '" gradientUnits="userSpaceOnUse" x1="0" y1="-50" x2="0" y2="' + height + '"><stop offset="0" style="stop-color:' + startColor + '"/><stop offset="1" style="stop-color:' + endColor + '"/> </linearGradient>';
|
|
||||||
},
|
|
||||||
|
|
||||||
executeCallback: function(rating, $el){
|
|
||||||
var callback = this.settings.callback;
|
|
||||||
callback(rating, $el);
|
|
||||||
}
|
|
||||||
|
|
||||||
};
|
|
||||||
|
|
||||||
var publicMethods = {
|
|
||||||
|
|
||||||
unload: function() {
|
|
||||||
var _name = 'plugin_' + pluginName;
|
|
||||||
var $el = $(this);
|
|
||||||
var $starSet = $el.data(_name).$stars;
|
|
||||||
$starSet.off();
|
|
||||||
$el.removeData(_name).remove();
|
|
||||||
},
|
|
||||||
|
|
||||||
setRating: function(rating, round) {
|
|
||||||
var _name = 'plugin_' + pluginName;
|
|
||||||
var $el = $(this);
|
|
||||||
var $plugin = $el.data(_name);
|
|
||||||
if( rating > $plugin.settings.totalStars || rating < 0 ) { return; }
|
|
||||||
if( round ){
|
|
||||||
rating = Math.round(rating);
|
|
||||||
}
|
|
||||||
$plugin.applyRating(rating);
|
|
||||||
},
|
|
||||||
|
|
||||||
getRating: function() {
|
|
||||||
var _name = 'plugin_' + pluginName;
|
|
||||||
var $el = $(this);
|
|
||||||
var $starSet = $el.data(_name);
|
|
||||||
return $starSet._state.rating;
|
|
||||||
},
|
|
||||||
|
|
||||||
resize: function(newSize) {
|
|
||||||
var _name = 'plugin_' + pluginName;
|
|
||||||
var $el = $(this);
|
|
||||||
var $starSet = $el.data(_name);
|
|
||||||
var $stars = $starSet.$stars;
|
|
||||||
|
|
||||||
if(newSize <= 1 || newSize > 200) {
|
|
||||||
console.error('star size out of bounds');
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
|
|
||||||
$stars = Array.prototype.slice.call($stars);
|
|
||||||
$stars.forEach(function(star){
|
|
||||||
$(star).css({
|
|
||||||
'width': newSize + 'px',
|
|
||||||
'height': newSize + 'px'
|
|
||||||
});
|
|
||||||
});
|
|
||||||
},
|
|
||||||
|
|
||||||
setReadOnly: function(flag) {
|
|
||||||
var _name = 'plugin_' + pluginName;
|
|
||||||
var $el = $(this);
|
|
||||||
var $plugin = $el.data(_name);
|
|
||||||
if(flag === true){
|
|
||||||
$plugin.$stars.off('mouseover mouseout click');
|
|
||||||
} else {
|
|
||||||
$plugin.settings.readOnly = false;
|
|
||||||
$plugin.addListeners();
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
};
|
|
||||||
|
|
||||||
|
|
||||||
// Avoid Plugin.prototype conflicts
|
|
||||||
$.extend(Plugin.prototype, methods);
|
|
||||||
|
|
||||||
$.fn[ pluginName ] = function ( options ) {
|
|
||||||
|
|
||||||
// if options is a public method
|
|
||||||
if( !$.isPlainObject(options) ){
|
|
||||||
if( publicMethods.hasOwnProperty(options) ){
|
|
||||||
return publicMethods[options].apply(this, Array.prototype.slice.call(arguments, 1));
|
|
||||||
} else {
|
|
||||||
$.error('Method '+ options +' does not exist on ' + pluginName + '.js');
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
return this.each(function() {
|
|
||||||
// preventing against multiple instantiations
|
|
||||||
if ( !$(this).data( 'plugin_' + pluginName ) ) {
|
|
||||||
$(this).data( 'plugin_' + pluginName, new Plugin( this, options ) );
|
|
||||||
}
|
|
||||||
});
|
|
||||||
};
|
|
||||||
|
|
||||||
})( $, window, document );
|
|
||||||
|
|
@ -1,146 +0,0 @@
|
||||||
function inputTags(configs) {
|
|
||||||
|
|
||||||
|
|
||||||
let tagsContainer = configs.container,
|
|
||||||
input = configs.container.querySelector('input')
|
|
||||||
|
|
||||||
let _privateMethods = {
|
|
||||||
|
|
||||||
init: function (configs) {
|
|
||||||
|
|
||||||
// this.inspectConfigProperties(configs);
|
|
||||||
|
|
||||||
let self = this,
|
|
||||||
input_hidden = document.createElement('input');
|
|
||||||
let name = input.getAttribute('name'),
|
|
||||||
id = input.getAttribute('id');
|
|
||||||
input.removeAttribute('name');
|
|
||||||
// input.removeAttribute('id');
|
|
||||||
input_hidden.setAttribute('type', 'hidden');
|
|
||||||
// input_hidden.setAttribute('id', id);
|
|
||||||
input_hidden.setAttribute('name', name);
|
|
||||||
input.parentNode.insertBefore(input_hidden, input);
|
|
||||||
this.input_hidden = input_hidden
|
|
||||||
|
|
||||||
tagsContainer.addEventListener('click', function () {
|
|
||||||
input.focus();
|
|
||||||
});
|
|
||||||
|
|
||||||
if (configs.tags) {
|
|
||||||
for (let i = 0; i < configs.tags.length; i++) {
|
|
||||||
if (configs.tags[i]) {
|
|
||||||
this.create(configs.tags[i]);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
input.addEventListener("focusout", function () {
|
|
||||||
|
|
||||||
let tag_txt = this.value.trim(),
|
|
||||||
tag_exists = false;
|
|
||||||
|
|
||||||
if (self.tags_array) {
|
|
||||||
tag_exists = Boolean(self.tags_array.indexOf(tag_txt) + 1);
|
|
||||||
}
|
|
||||||
|
|
||||||
if (tag_txt && tag_exists && !configs.allowDuplicateTags) {
|
|
||||||
self.showDuplicate(tag_txt);
|
|
||||||
}
|
|
||||||
else if (tag_txt && tag_exists && configs.allowDuplicateTags) {
|
|
||||||
self.create(tag_txt);
|
|
||||||
}
|
|
||||||
else if (tag_txt && !tag_exists) {
|
|
||||||
self.create(tag_txt);
|
|
||||||
}
|
|
||||||
this.value = "";
|
|
||||||
|
|
||||||
});
|
|
||||||
|
|
||||||
input.addEventListener('keydown', function (ev) {
|
|
||||||
|
|
||||||
|
|
||||||
if (ev.keyCode === 13 || ev.keyCode === 188 ||
|
|
||||||
(ev.keyCode === 32 && configs.allowDuplicateTags)) { // enter || comma || space
|
|
||||||
let event = new Event('focusout');
|
|
||||||
input.dispatchEvent(event);
|
|
||||||
ev.preventDefault();
|
|
||||||
}
|
|
||||||
else if (event.which === 8 && !input.value) { // backspace
|
|
||||||
let tag_nodes = document.querySelectorAll('.tag-input__tag');
|
|
||||||
if (tag_nodes.length > 0) {
|
|
||||||
input.addEventListener('keyup', function (event) {
|
|
||||||
if (event.which === 8) {
|
|
||||||
let node_to_del = tag_nodes[tag_nodes.length - 1];
|
|
||||||
node_to_del.remove();
|
|
||||||
self.update();
|
|
||||||
}
|
|
||||||
});
|
|
||||||
}
|
|
||||||
ev.preventDefault();
|
|
||||||
}
|
|
||||||
});
|
|
||||||
},
|
|
||||||
|
|
||||||
create: function (tag_txt) {
|
|
||||||
|
|
||||||
let tag_nodes = document.querySelectorAll('.tag-input__tag');
|
|
||||||
|
|
||||||
if (!configs.maxTags || tag_nodes.length < configs.maxTags) {
|
|
||||||
let self = this,
|
|
||||||
span_tag = document.createElement('span'),
|
|
||||||
input_hidden_field = self.input_hidden;
|
|
||||||
|
|
||||||
span_tag.setAttribute('class', 'tag-input__tag');
|
|
||||||
span_tag.innerText = tag_txt;
|
|
||||||
|
|
||||||
let span_tag_close = document.createElement('span');
|
|
||||||
span_tag_close.setAttribute('class', 'tag-input__close');
|
|
||||||
span_tag.appendChild(span_tag_close);
|
|
||||||
|
|
||||||
tagsContainer.insertBefore(span_tag, input_hidden_field);
|
|
||||||
|
|
||||||
span_tag.childNodes[1].addEventListener('click', function () {
|
|
||||||
self.remove(this);
|
|
||||||
});
|
|
||||||
|
|
||||||
this.update();
|
|
||||||
|
|
||||||
}
|
|
||||||
},
|
|
||||||
|
|
||||||
update: function () {
|
|
||||||
|
|
||||||
let tags = document.getElementsByClassName('tag-input__tag'),
|
|
||||||
tags_arr = [];
|
|
||||||
|
|
||||||
for (let i = 0; i < tags.length; i++) {
|
|
||||||
tags_arr.push(tags[i].textContent.replace(/\s+/g, ' ').trim());
|
|
||||||
}
|
|
||||||
this.tags_array = tags_arr;
|
|
||||||
|
|
||||||
this.input_hidden.setAttribute('value', tags_arr.join());
|
|
||||||
},
|
|
||||||
|
|
||||||
remove: function (tag) {
|
|
||||||
configs.onTagRemove(tag.parentNode.textContent);
|
|
||||||
tag.parentNode.remove();
|
|
||||||
this.update();
|
|
||||||
},
|
|
||||||
|
|
||||||
showDuplicate: function (tag_value) {
|
|
||||||
let tags = document.getElementsByClassName('tag-input__tag');
|
|
||||||
|
|
||||||
for (let i = 0; i < tags.length; i++) {
|
|
||||||
if (tags[i].textContent === tag_value) {
|
|
||||||
tags[i].classList.add("tag-input__tag--highlight");
|
|
||||||
window.setTimeout(function () {
|
|
||||||
tags[i].classList.remove("tag-input__tag--highlight");
|
|
||||||
}, configs.duplicateTime);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
_privateMethods.init(configs);
|
|
||||||
// return false;
|
|
||||||
}
|
|
||||||
|
|
@ -106,15 +106,13 @@
|
||||||
</ul>
|
</ul>
|
||||||
</nav>
|
</nav>
|
||||||
</header>
|
</header>
|
||||||
{% comment %}
|
{% if request.user.is_authenticated and not request.user.mastodon_username and not request.user.username %}
|
||||||
{% if request.user.is_authenticated and not request.user.username %}
|
<ul class="messages" style="text-align:center">
|
||||||
<ul class="messages" style="text-align:center">
|
|
||||||
<li class="error">
|
<li class="error">
|
||||||
请<a href="{% url 'users:info' %}">设置用户名</a>
|
请<a href="{% url 'users:info' %}">设置用户名</a>
|
||||||
</li>
|
</li>
|
||||||
</ul>
|
</ul>
|
||||||
{% endif %}
|
{% endif %}
|
||||||
{% endcomment %}
|
|
||||||
{% if messages %}
|
{% if messages %}
|
||||||
<ul class="messages" style="text-align:center">
|
<ul class="messages" style="text-align:center">
|
||||||
{% for message in messages %}
|
{% for message in messages %}
|
||||||
|
|
|
||||||
|
|
@ -5,7 +5,11 @@
|
||||||
<a href="{% url 'oauth2_provider:developer' %}">Developer Console</a> | {% trans "Your applications" %}
|
<a href="{% url 'oauth2_provider:developer' %}">Developer Console</a> | {% trans "Your applications" %}
|
||||||
</h3>
|
</h3>
|
||||||
<div class="block-center">
|
<div class="block-center">
|
||||||
{% if applications %}
|
{% if not request.user.mastodon_acct %}
|
||||||
|
<p>
|
||||||
|
Please <a href="{% url 'users:info' %}">connect to a Fediverse identity</a> before creating an application.
|
||||||
|
</p>
|
||||||
|
{% elif applications %}
|
||||||
<ul>
|
<ul>
|
||||||
{% for application in applications %}
|
{% for application in applications %}
|
||||||
<li>
|
<li>
|
||||||
|
|
|
||||||
|
|
@ -25,8 +25,8 @@
|
||||||
title="{{ site_name }} - @{{ user.handler }}的评论"
|
title="{{ site_name }} - @{{ user.handler }}的评论"
|
||||||
href="{{ request.build_absolute_uri }}feed/reviews/">
|
href="{{ request.build_absolute_uri }}feed/reviews/">
|
||||||
{% include "common_libs.html" with jquery=0 v2=1 %}
|
{% include "common_libs.html" with jquery=0 v2=1 %}
|
||||||
<script src="{% static 'lib/js/calendar_yearview_blocks.js' %}" defer></script>
|
<script src="{% static 'js/calendar_yearview_blocks.js' %}" defer></script>
|
||||||
<link href="{% static 'lib/css/calendar_yearview_blocks.css' %}"
|
<link href="{% static 'css/calendar_yearview_blocks.css' %}"
|
||||||
media="all"
|
media="all"
|
||||||
rel="stylesheet" />
|
rel="stylesheet" />
|
||||||
</head>
|
</head>
|
||||||
|
|
|
||||||
|
|
@ -16,7 +16,7 @@
|
||||||
<script src="https://cdn.jsdelivr.net/npm/shikwasa@2.2.1/dist/shikwasa.min.js"></script>
|
<script src="https://cdn.jsdelivr.net/npm/shikwasa@2.2.1/dist/shikwasa.min.js"></script>
|
||||||
<link href="https://cdn.jsdelivr.net/npm/shikwasa@2.2.1/dist/style.min.css"
|
<link href="https://cdn.jsdelivr.net/npm/shikwasa@2.2.1/dist/style.min.css"
|
||||||
rel="stylesheet"></link>
|
rel="stylesheet"></link>
|
||||||
<script src="{% static 'podcast.js' %}"></script>
|
<script src="{% static 'js/podcast.js' %}"></script>
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
{% include "_header.html" with current="timeline" %}
|
{% include "_header.html" with current="timeline" %}
|
||||||
|
|
|
||||||
|
|
@ -158,8 +158,8 @@ def import_douban(request):
|
||||||
if request.method == "POST":
|
if request.method == "POST":
|
||||||
importer = DoubanImporter(
|
importer = DoubanImporter(
|
||||||
request.user,
|
request.user,
|
||||||
int(request.POST.get("visibility")),
|
int(request.POST.get("visibility", 0)),
|
||||||
int(request.POST.get("import_mode")),
|
int(request.POST.get("import_mode", 0)),
|
||||||
)
|
)
|
||||||
if importer.import_from_file(request.FILES["file"]):
|
if importer.import_from_file(request.FILES["file"]):
|
||||||
messages.add_message(request, messages.INFO, _("文件上传成功，等待后台导入。"))
|
messages.add_message(request, messages.INFO, _("文件上传成功，等待后台导入。"))
|
||||||
|
|
|
||||||
|
|
@ -1,226 +0,0 @@
|
||||||
|
|
||||||
$(document).ready( function() {
|
|
||||||
|
|
||||||
let token = $("#oauth2Token").text();
|
|
||||||
let mast_uri = $("#mastodonURI").text();
|
|
||||||
let mast_domain = new URL(mast_uri);
|
|
||||||
mast_domain = mast_domain.hostname;
|
|
||||||
let id = $("#userMastodonID").text();
|
|
||||||
let nextUrl = null;
|
|
||||||
let requesting = false;
|
|
||||||
|
|
||||||
let userInfoSpinner = $("#spinner").clone().removeAttr("hidden");
|
|
||||||
let followersSpinner = $("#spinner").clone().removeAttr("hidden");
|
|
||||||
let followingSpinner = $("#spinner").clone().removeAttr("hidden");
|
|
||||||
let mainSpinner = $("#spinner").clone().removeAttr("hidden");
|
|
||||||
|
|
||||||
$(".mast-user").first().hide();
|
|
||||||
|
|
||||||
$(".mast-user-list").append(mainSpinner);
|
|
||||||
$("#userInfoCard").append(userInfoSpinner);
|
|
||||||
$("#followings h5").after(followingSpinner);
|
|
||||||
$("#followers h5").after(followersSpinner);
|
|
||||||
$(".mast-following-more").hide();
|
|
||||||
$(".mast-followers-more").hide();
|
|
||||||
|
|
||||||
getUserInfo(
|
|
||||||
id,
|
|
||||||
mast_uri,
|
|
||||||
token,
|
|
||||||
function (userData) {
|
|
||||||
let userName;
|
|
||||||
if (userData.display_name) {
|
|
||||||
userName = translateEmojis(userData.display_name, userData.emojis, true);
|
|
||||||
} else {
|
|
||||||
userName = userData.username;
|
|
||||||
}
|
|
||||||
$("#userInfoCard .mast-avatar").attr("src", userData.avatar);
|
|
||||||
$("#userInfoCard .mast-displayname").html(userName);
|
|
||||||
$("#userInfoCard .mast-brief").text($("<div>"+userData.note.replace(/\<br/g,'\n<br').replace(/\<p/g,'\n<p')+"</div>").text());
|
|
||||||
$("#userInfoCard .mast-brief").html($("#userInfoCard .mast-brief").html().replace(/\n/g,'<br/>'));
|
|
||||||
$(userInfoSpinner).remove();
|
|
||||||
}
|
|
||||||
);
|
|
||||||
|
|
||||||
getFollowers(
|
|
||||||
id,
|
|
||||||
mast_uri,
|
|
||||||
token,
|
|
||||||
function(userList, nextPage) {
|
|
||||||
let subUserList = null;
|
|
||||||
if (userList.length == 0) {
|
|
||||||
$(".mast-followers").hide();
|
|
||||||
$(".mast-followers").before('<div style="margin-bottom: 20px;">暂无</div>');
|
|
||||||
} else {
|
|
||||||
if (userList.length > 4){
|
|
||||||
subUserList = userList.slice(0, 4);
|
|
||||||
$(".mast-followers-more").show();
|
|
||||||
} else {
|
|
||||||
subUserList = userList;
|
|
||||||
}
|
|
||||||
let template = $(".mast-followers li").clone();
|
|
||||||
$(".mast-followers").html("");
|
|
||||||
subUserList.forEach(data => {
|
|
||||||
temp = $(template).clone();
|
|
||||||
temp.find("img").attr("src", data.avatar);
|
|
||||||
if (data.display_name) {
|
|
||||||
temp.find(".mast-displayname").html(translateEmojis(data.display_name, data.emojis));
|
|
||||||
} else {
|
|
||||||
temp.find(".mast-displayname").text(data.username);
|
|
||||||
}
|
|
||||||
let url;
|
|
||||||
if (data.acct.includes('@')) {
|
|
||||||
url = $("#userPageURL").text().replace('0', data.acct);
|
|
||||||
} else {
|
|
||||||
url = $("#userPageURL").text().replace('0', data.acct + '@' + mast_domain);
|
|
||||||
}
|
|
||||||
temp.find("a").attr('href', url);
|
|
||||||
$(".mast-followers").append(temp);
|
|
||||||
});
|
|
||||||
}
|
|
||||||
$(followersSpinner).remove();
|
|
||||||
// main
|
|
||||||
let template = $(".mast-user").clone().show();
|
|
||||||
|
|
||||||
userList.forEach(data => {
|
|
||||||
temp = $(template).clone();
|
|
||||||
temp.find("img").attr("src", data.avatar);
|
|
||||||
if (data.display_name) {
|
|
||||||
temp.find(".mast-displayname").html(translateEmojis(data.display_name, data.emojis));
|
|
||||||
} else {
|
|
||||||
temp.find(".mast-displayname").text(data.username);
|
|
||||||
}
|
|
||||||
let url;
|
|
||||||
if (data.acct.includes('@')) {
|
|
||||||
url = $("#userPageURL").text().replace('0', data.acct);
|
|
||||||
} else {
|
|
||||||
url = $("#userPageURL").text().replace('0', data.acct + '@' + mast_domain);
|
|
||||||
}
|
|
||||||
temp.find("a").attr('href', url);
|
|
||||||
temp.find(".mast-brief").text(data.note.replace(/(<([^>]+)>)/ig,""));
|
|
||||||
$(".mast-user").last().after(temp);
|
|
||||||
});
|
|
||||||
|
|
||||||
mainSpinner.hide();
|
|
||||||
nextUrl = nextPage;
|
|
||||||
}
|
|
||||||
);
|
|
||||||
|
|
||||||
getFollowing(
|
|
||||||
id,
|
|
||||||
mast_uri,
|
|
||||||
token,
|
|
||||||
function(userList, request) {
|
|
||||||
if (userList.length == 0) {
|
|
||||||
$(".mast-following").hide();
|
|
||||||
$(".mast-following").before('<div style="margin-bottom: 20px;">暂无</div>');
|
|
||||||
} else {
|
|
||||||
if (userList.length > 4){
|
|
||||||
userList = userList.slice(0, 4);
|
|
||||||
$(".mast-following-more").show();
|
|
||||||
}
|
|
||||||
let template = $(".mast-following li").clone();
|
|
||||||
$(".mast-following").html("");
|
|
||||||
userList.forEach(data => {
|
|
||||||
temp = $(template).clone()
|
|
||||||
temp.find("img").attr("src", data.avatar);
|
|
||||||
if (data.display_name) {
|
|
||||||
temp.find(".mast-displayname").html(translateEmojis(data.display_name, data.emojis));
|
|
||||||
} else {
|
|
||||||
temp.find(".mast-displayname").text(data.username);
|
|
||||||
}
|
|
||||||
let url;
|
|
||||||
if (data.acct.includes('@')) {
|
|
||||||
url = $("#userPageURL").text().replace('0', data.acct);
|
|
||||||
} else {
|
|
||||||
url = $("#userPageURL").text().replace('0', data.acct + '@' + mast_domain);
|
|
||||||
}
|
|
||||||
temp.find("a").attr('href', url);
|
|
||||||
$(".mast-following").append(temp);
|
|
||||||
});
|
|
||||||
}
|
|
||||||
$(followingSpinner).remove();
|
|
||||||
|
|
||||||
}
|
|
||||||
);
|
|
||||||
|
|
||||||
$(document.body).on('touchmove', () => {
|
|
||||||
let scrollPosition = $(window).scrollTop();
|
|
||||||
// test if scoll to bottom
|
|
||||||
// mobile phone has extra offset
|
|
||||||
if (scrollPosition + $(window).height() > $(document).height() - 70) {
|
|
||||||
onScroll();
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
|
|
||||||
$(window).on("scroll", function () {
|
|
||||||
let scrollPosition = $(window).scrollTop();
|
|
||||||
// test if scoll to bottom
|
|
||||||
if (scrollPosition + $(window).height() > $(document).height() - 0.5) {
|
|
||||||
onScroll();
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
|
|
||||||
function onScroll() {
|
|
||||||
if (!requesting && nextUrl) {
|
|
||||||
// acquire lock
|
|
||||||
requesting = true;
|
|
||||||
mainSpinner.show();
|
|
||||||
$.ajax({
|
|
||||||
url: nextUrl,
|
|
||||||
method: 'GET',
|
|
||||||
data: {
|
|
||||||
'limit': NUMBER_PER_REQUEST,
|
|
||||||
},
|
|
||||||
headers: {
|
|
||||||
'Authorization': 'Bearer ' + token,
|
|
||||||
},
|
|
||||||
success: function (userList, status, request) {
|
|
||||||
if (userList.length == 0) {
|
|
||||||
mainSpinner.hide();
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
let template = $(".mast-user").first().clone().show();
|
|
||||||
let newUrlFlag = false;
|
|
||||||
request.getResponseHeader('link').split(',').forEach(link => {
|
|
||||||
if (link.includes('next')) {
|
|
||||||
let regex = /<(.*?)>/;
|
|
||||||
nextUrl = link.match(regex)[1];
|
|
||||||
newUrlFlag = true;
|
|
||||||
}
|
|
||||||
});
|
|
||||||
if (!newUrlFlag) {
|
|
||||||
nextUrl = null;
|
|
||||||
}
|
|
||||||
userList.forEach(data => {
|
|
||||||
temp = $(template).clone()
|
|
||||||
temp.find("img").attr("src", data.avatar);
|
|
||||||
if (data.display_name) {
|
|
||||||
temp.find(".mast-displayname").html(translateEmojis(data.display_name, data.emojis));
|
|
||||||
} else {
|
|
||||||
temp.find(".mast-displayname").text(data.username);
|
|
||||||
}
|
|
||||||
let url;
|
|
||||||
if (data.acct.includes('@')) {
|
|
||||||
url = $("#userPageURL").text().replace('0', data.acct);
|
|
||||||
} else {
|
|
||||||
url = $("#userPageURL").text().replace('0', data.acct + '@' + mast_domain);
|
|
||||||
}
|
|
||||||
temp.find("a").attr('href', url);
|
|
||||||
temp.find(".mast-brief").text(data.note.replace(/(<([^>]+)>)/ig, ""));
|
|
||||||
// console.log($(temp).html())
|
|
||||||
$(".mast-user").last().after(temp);
|
|
||||||
});
|
|
||||||
mainSpinner.hide();
|
|
||||||
// release lock
|
|
||||||
// console.log(userList[userList.length-1].username)
|
|
||||||
// console.log(nextUrl)
|
|
||||||
requesting = false;
|
|
||||||
},
|
|
||||||
});
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
});
|
|
||||||
|
|
@ -1,226 +0,0 @@
|
||||||
|
|
||||||
$(document).ready( function() {
|
|
||||||
|
|
||||||
let token = $("#oauth2Token").text();
|
|
||||||
let mast_uri = $("#mastodonURI").text();
|
|
||||||
let mast_domain = new URL(mast_uri);
|
|
||||||
mast_domain = mast_domain.hostname;
|
|
||||||
let id = $("#userMastodonID").text();
|
|
||||||
let nextUrl = null;
|
|
||||||
let requesting = false;
|
|
||||||
|
|
||||||
let userInfoSpinner = $("#spinner").clone().removeAttr("hidden");
|
|
||||||
let followersSpinner = $("#spinner").clone().removeAttr("hidden");
|
|
||||||
let followingSpinner = $("#spinner").clone().removeAttr("hidden");
|
|
||||||
let mainSpinner = $("#spinner").clone().removeAttr("hidden");
|
|
||||||
|
|
||||||
$(".mast-user").first().hide();
|
|
||||||
|
|
||||||
$(".mast-user-list").append(mainSpinner);
|
|
||||||
$("#userInfoCard").append(userInfoSpinner);
|
|
||||||
$("#followings h5").after(followingSpinner);
|
|
||||||
$("#followers h5").after(followersSpinner);
|
|
||||||
$(".mast-following-more").hide();
|
|
||||||
$(".mast-followers-more").hide();
|
|
||||||
|
|
||||||
getUserInfo(
|
|
||||||
id,
|
|
||||||
mast_uri,
|
|
||||||
token,
|
|
||||||
function (userData) {
|
|
||||||
let userName;
|
|
||||||
if (userData.display_name) {
|
|
||||||
userName = translateEmojis(userData.display_name, userData.emojis, true);
|
|
||||||
} else {
|
|
||||||
userName = userData.username;
|
|
||||||
}
|
|
||||||
$("#userInfoCard .mast-avatar").attr("src", userData.avatar);
|
|
||||||
$("#userInfoCard .mast-displayname").html(userName);
|
|
||||||
$("#userInfoCard .mast-brief").text($("<div>"+userData.note.replace(/\<br/g,'\n<br').replace(/\<p/g,'\n<p')+"</div>").text());
|
|
||||||
$("#userInfoCard .mast-brief").html($("#userInfoCard .mast-brief").html().replace(/\n/g,'<br/>'));
|
|
||||||
$(userInfoSpinner).remove();
|
|
||||||
}
|
|
||||||
);
|
|
||||||
|
|
||||||
getFollowers(
|
|
||||||
id,
|
|
||||||
mast_uri,
|
|
||||||
token,
|
|
||||||
function (userList, request) {
|
|
||||||
if (userList.length == 0) {
|
|
||||||
$(".mast-followers").hide();
|
|
||||||
$(".mast-followers").before('<div style="margin-bottom: 20px;">暂无</div>');
|
|
||||||
} else {
|
|
||||||
if (userList.length > 4) {
|
|
||||||
userList = userList.slice(0, 4);
|
|
||||||
$(".mast-followers-more").show();
|
|
||||||
}
|
|
||||||
let template = $(".mast-followers li").clone();
|
|
||||||
$(".mast-followers").html("");
|
|
||||||
userList.forEach(data => {
|
|
||||||
temp = $(template).clone();
|
|
||||||
temp.find("img").attr("src", data.avatar);
|
|
||||||
if (data.display_name) {
|
|
||||||
temp.find(".mast-displayname").html(translateEmojis(data.display_name, data.emojis));
|
|
||||||
} else {
|
|
||||||
temp.find(".mast-displayname").text(data.username);
|
|
||||||
}
|
|
||||||
let url;
|
|
||||||
if (data.acct.includes('@')) {
|
|
||||||
url = $("#userPageURL").text().replace('0', data.acct);
|
|
||||||
} else {
|
|
||||||
url = $("#userPageURL").text().replace('0', data.acct + '@' + mast_domain);
|
|
||||||
}
|
|
||||||
temp.find("a").attr('href', url);
|
|
||||||
$(".mast-followers").append(temp);
|
|
||||||
});
|
|
||||||
}
|
|
||||||
$(followersSpinner).remove();
|
|
||||||
}
|
|
||||||
);
|
|
||||||
|
|
||||||
getFollowing(
|
|
||||||
id,
|
|
||||||
mast_uri,
|
|
||||||
token,
|
|
||||||
function(userList, nextPage) {
|
|
||||||
// aside
|
|
||||||
let subUserList = null;
|
|
||||||
if (userList.length == 0) {
|
|
||||||
$(".mast-following").hide();
|
|
||||||
$(".mast-following").before('<div style="margin-bottom: 20px;">暂无</div>');
|
|
||||||
} else {
|
|
||||||
if (userList.length > 4){
|
|
||||||
subUserList = userList.slice(0, 4);
|
|
||||||
$(".mast-following-more").show();
|
|
||||||
} else {
|
|
||||||
subUserList = userList;
|
|
||||||
}
|
|
||||||
let template = $(".mast-following li").clone();
|
|
||||||
$(".mast-following").html("");
|
|
||||||
subUserList.forEach(data => {
|
|
||||||
temp = $(template).clone()
|
|
||||||
temp.find("img").attr("src", data.avatar);
|
|
||||||
if (data.display_name) {
|
|
||||||
temp.find(".mast-displayname").html(translateEmojis(data.display_name, data.emojis));
|
|
||||||
} else {
|
|
||||||
temp.find(".mast-displayname").text(data.username);
|
|
||||||
}
|
|
||||||
let url;
|
|
||||||
if (data.acct.includes('@')) {
|
|
||||||
url = $("#userPageURL").text().replace('0', data.acct);
|
|
||||||
} else {
|
|
||||||
url = $("#userPageURL").text().replace('0', data.acct + '@' + mast_domain);
|
|
||||||
}
|
|
||||||
temp.find("a").attr('href', url);
|
|
||||||
$(".mast-following").append(temp);
|
|
||||||
});
|
|
||||||
}
|
|
||||||
$(followingSpinner).remove();
|
|
||||||
|
|
||||||
// main
|
|
||||||
let template = $(".mast-user").clone().show();
|
|
||||||
userList.forEach(data => {
|
|
||||||
temp = $(template).clone()
|
|
||||||
temp.find("img").attr("src", data.avatar);
|
|
||||||
if (data.display_name) {
|
|
||||||
temp.find(".mast-displayname").html(translateEmojis(data.display_name, data.emojis));
|
|
||||||
} else {
|
|
||||||
temp.find(".mast-displayname").text(data.username);
|
|
||||||
}
|
|
||||||
let url;
|
|
||||||
if (data.acct.includes('@')) {
|
|
||||||
url = $("#userPageURL").text().replace('0', data.acct);
|
|
||||||
} else {
|
|
||||||
url = $("#userPageURL").text().replace('0', data.acct + '@' + mast_domain);
|
|
||||||
}
|
|
||||||
temp.find("a").attr('href', url);
|
|
||||||
temp.find(".mast-brief").text(data.note.replace(/(<([^>]+)>)/ig,""));
|
|
||||||
$(".mast-user").last().after(temp);
|
|
||||||
});
|
|
||||||
|
|
||||||
mainSpinner.hide();
|
|
||||||
nextUrl = nextPage;
|
|
||||||
}
|
|
||||||
);
|
|
||||||
|
|
||||||
$(document.body).on('touchmove', () => {
|
|
||||||
let scrollPosition = $(window).scrollTop();
|
|
||||||
// test if scoll to bottom
|
|
||||||
// mobile phone has extra offset
|
|
||||||
if (scrollPosition + $(window).height() > $(document).height() - 70) {
|
|
||||||
onScroll();
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
|
|
||||||
$(window).on("scroll", function() {
|
|
||||||
let scrollPosition = $(window).scrollTop();
|
|
||||||
// test if scoll to bottom
|
|
||||||
if (scrollPosition + $(window).height() > $(document).height() - 0.5) {
|
|
||||||
onScroll();
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
function onScroll() {
|
|
||||||
if (!requesting && nextUrl) {
|
|
||||||
// acquire lock
|
|
||||||
requesting = true;
|
|
||||||
mainSpinner.show();
|
|
||||||
$.ajax({
|
|
||||||
url: nextUrl,
|
|
||||||
method: 'GET',
|
|
||||||
data: {
|
|
||||||
'limit': NUMBER_PER_REQUEST,
|
|
||||||
},
|
|
||||||
headers: {
|
|
||||||
'Authorization': 'Bearer ' + token,
|
|
||||||
},
|
|
||||||
success: function (userList, status, request) {
|
|
||||||
if (userList.length == 0) {
|
|
||||||
mainSpinner.hide();
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
let template = $(".mast-user").first().clone().show();
|
|
||||||
let newUrlFlag = false;
|
|
||||||
request.getResponseHeader('link').split(',').forEach(link => {
|
|
||||||
if (link.includes('next')) {
|
|
||||||
let regex = /<(.*?)>/;
|
|
||||||
nextUrl = link.match(regex)[1];
|
|
||||||
newUrlFlag = true;
|
|
||||||
}
|
|
||||||
});
|
|
||||||
if (!newUrlFlag) {
|
|
||||||
nextUrl = null;
|
|
||||||
}
|
|
||||||
// console.log(userList.length)
|
|
||||||
userList.forEach(data => {
|
|
||||||
temp = $(template).clone()
|
|
||||||
temp.find("img").attr("src", data.avatar);
|
|
||||||
if (data.display_name) {
|
|
||||||
temp.find(".mast-displayname").html(translateEmojis(data.display_name, data.emojis));
|
|
||||||
} else {
|
|
||||||
temp.find(".mast-displayname").text(data.username);
|
|
||||||
}
|
|
||||||
let url;
|
|
||||||
if (data.acct.includes('@')) {
|
|
||||||
url = $("#userPageURL").text().replace('0', data.acct);
|
|
||||||
} else {
|
|
||||||
url = $("#userPageURL").text().replace('0', data.acct + '@' + mast_domain);
|
|
||||||
}
|
|
||||||
temp.find("a").attr('href', url);
|
|
||||||
temp.find(".mast-brief").text(data.note.replace(/(<([^>]+)>)/ig, ""));
|
|
||||||
// console.log($(temp).html())
|
|
||||||
$(".mast-user").last().after(temp);
|
|
||||||
});
|
|
||||||
mainSpinner.hide();
|
|
||||||
// console.log(userList[userList.length-1].username)
|
|
||||||
// console.log(nextUrl)
|
|
||||||
// release lock
|
|
||||||
requesting = false;
|
|
||||||
},
|
|
||||||
});
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
});
|
|
||||||
|
|
@ -53,18 +53,24 @@
|
||||||
<form action="{% url 'users:reconnect' %}" method="post">
|
<form action="{% url 'users:reconnect' %}" method="post">
|
||||||
{% csrf_token %}
|
{% csrf_token %}
|
||||||
<fieldset>
|
<fieldset>
|
||||||
<label>
|
{% if request.user.mastodon_acct %}
|
||||||
社交身份
|
<label>
|
||||||
<input type="input"
|
已关联社交身份
|
||||||
{% if request.user.mastodon_acct %}aria-invalid="false"{% endif %}
|
<input type="input"
|
||||||
value="{{ request.user.mastodon_acct | default:'未关联' }}"
|
{% if request.user.mastodon_acct %}aria-invalid="false"{% endif %}
|
||||||
readonly>
|
value="{{ request.user.mastodon_acct | default:'未关联' }}"
|
||||||
</label>
|
readonly>
|
||||||
|
</label>
|
||||||
|
{% else %}
|
||||||
|
<p>
|
||||||
|
如果你还没有在任何<em data-tooltip="联邦宇宙(Fediverse 有时也被称为长毛象)是一种分布式社交网络">联邦宇宙</em>实例注册过，可先<a href="https://joinmastodon.org/zh/servers" target="_blank">选择实例并注册</a>。
|
||||||
|
</p>
|
||||||
|
{% endif %}
|
||||||
<label>
|
<label>
|
||||||
{% if request.user.mastodon_acct %}
|
{% if request.user.mastodon_acct %}
|
||||||
如需关联到另一个联邦宇宙社交身份，请输入新身份所在的实例域名
|
如需关联到另一个联邦宇宙社交身份，请输入新身份所在的实例域名
|
||||||
{% else %}
|
{% else %}
|
||||||
请输入已注册实例域名
|
如果你已经注册过联邦宇宙实例，请输入实例域名
|
||||||
{% endif %}
|
{% endif %}
|
||||||
<input type="input"
|
<input type="input"
|
||||||
name="domain"
|
name="domain"
|
||||||
|
|
@ -77,8 +83,7 @@
|
||||||
{% if request.user.mastodon_acct %}
|
{% if request.user.mastodon_acct %}
|
||||||
替换关联后可使用新的联邦宇宙身份来登录{{ site_name }}和控制数据可见性，已有的标记评论收藏单等数据不受影响。
|
替换关联后可使用新的联邦宇宙身份来登录{{ site_name }}和控制数据可见性，已有的标记评论收藏单等数据不受影响。
|
||||||
{% else %}
|
{% else %}
|
||||||
启用联邦宇宙身份后可关注更多的用户并用到本站完整功能。
|
启用联邦宇宙身份后可发现和关注<em data-tooltip="部分用户开启了关注审核，你需有联邦宇宙身份方可请求关注">更多</em>的用户，并使用本站完整功能。
|
||||||
如果你还没有注册过<em data-tooltip="联邦宇宙(Fediverse 亦称长毛象)是一种分布式社交网络">联邦宇宙</em>，可先<a href="https://joinmastodon.org/zh/servers" target="_blank">选择实例并注册</a>。
|
|
||||||
{% endif %}
|
{% endif %}
|
||||||
</small>
|
</small>
|
||||||
</fieldset>
|
</fieldset>
|
||||||
|
|
|
||||||
|
|
@ -1,79 +0,0 @@
|
||||||
{% load static %}
|
|
||||||
{% load i18n %}
|
|
||||||
{% load admin_url %}
|
|
||||||
{% load mastodon %}
|
|
||||||
{% load oauth_token %}
|
|
||||||
{% load highlight %}
|
|
||||||
<!DOCTYPE html>
|
|
||||||
<html lang="zh" class="classic-page">
|
|
||||||
<head>
|
|
||||||
<meta charset="UTF-8">
|
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
||||||
{% if is_followers_page %}
|
|
||||||
<title>{{ site_name }} - {% trans '被他们关注' %}</title>
|
|
||||||
{% else %}
|
|
||||||
<title>{{ site_name }} - {% trans '关注的人' %}</title>
|
|
||||||
{% endif %}
|
|
||||||
{% include "common_libs.html" with jquery=1 v2=1 %}
|
|
||||||
<script src="{% static 'js/mastodon.js' %}"></script>
|
|
||||||
{% if is_followers_page %}
|
|
||||||
<script src="{% static 'js/followers_list.js' %}"></script>
|
|
||||||
{% else %}
|
|
||||||
<script src="{% static 'js/following_list.js' %}"></script>
|
|
||||||
{% endif %}
|
|
||||||
</head>
|
|
||||||
<body>
|
|
||||||
{% include "_header.html" %}
|
|
||||||
<main>
|
|
||||||
<div class="grid__main">
|
|
||||||
<h5 class="related-user-list__title">
|
|
||||||
{% if is_followers_page %}
|
|
||||||
{% trans ' 被他们关注' %}
|
|
||||||
{% else %}
|
|
||||||
{% trans '关注的人' %}
|
|
||||||
{% endif %}
|
|
||||||
</h5>
|
|
||||||
<div class="main-section-wrapper">
|
|
||||||
<div class="related-user-list mast-user-list">
|
|
||||||
<div class="related-user-list__user mast-user">
|
|
||||||
<img src="" alt="" class="related-user-list__user-avatar">
|
|
||||||
<div class="related-user-list__user-info">
|
|
||||||
<a href="">
|
|
||||||
<div class="related-user-list__user-name mast-displayname"></div>
|
|
||||||
</a>
|
|
||||||
<p class="related-user-list__user-bio mast-brief"></p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
{% include "_sidebar.html" with show_profile=1 %}
|
|
||||||
</main>
|
|
||||||
{% include '_footer.html' %}
|
|
||||||
<div id="oauth2Token" hidden="true">{% oauth_token %}</div>
|
|
||||||
<div id="mastodonURI" hidden="true">{% mastodon request.user.mastodon_site %}</div>
|
|
||||||
<!--current user mastodon id-->
|
|
||||||
{% if user == request.user %}
|
|
||||||
<div id="userMastodonID" hidden="true">{{ user.mastodon_id }}</div>
|
|
||||||
{% else %}
|
|
||||||
<div id="userMastodonID" hidden="true"></div>
|
|
||||||
{% endif %}
|
|
||||||
<div id="userPageURL" hidden="true">/users/0/</div>
|
|
||||||
<div id="spinner" hidden>
|
|
||||||
<div class="spinner">
|
|
||||||
<div></div>
|
|
||||||
<div></div>
|
|
||||||
<div></div>
|
|
||||||
<div></div>
|
|
||||||
<div></div>
|
|
||||||
<div></div>
|
|
||||||
<div></div>
|
|
||||||
<div></div>
|
|
||||||
<div></div>
|
|
||||||
<div></div>
|
|
||||||
<div></div>
|
|
||||||
<div></div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</body>
|
|
||||||
</html>
|
|
||||||
|
|
@ -32,8 +32,6 @@ urlpatterns = [
|
||||||
path("unmute/<str:user_name>", unmute, name="unmute"),
|
path("unmute/<str:user_name>", unmute, name="unmute"),
|
||||||
path("block/<str:user_name>", block, name="block"),
|
path("block/<str:user_name>", block, name="block"),
|
||||||
path("unblock/<str:user_name>", unblock, name="unblock"),
|
path("unblock/<str:user_name>", unblock, name="unblock"),
|
||||||
path("<str:id>/followers", followers, name="followers"),
|
|
||||||
path("<str:id>/following", following, name="following"),
|
|
||||||
path("report", report, name="report"),
|
path("report", report, name="report"),
|
||||||
path("manage_report", manage_report, name="manage_report"),
|
path("manage_report", manage_report, name="manage_report"),
|
||||||
path(
|
path(
|
||||||
|
|
|
||||||
|
|
@ -39,42 +39,6 @@ def render_user_blocked(request):
|
||||||
)
|
)
|
||||||
|
|
||||||
|
|
||||||
@login_required
|
|
||||||
def followers(request, id):
|
|
||||||
if request.method == "GET":
|
|
||||||
user = User.get(id)
|
|
||||||
if user is None or user != request.user:
|
|
||||||
return render_user_not_found(request)
|
|
||||||
return render(
|
|
||||||
request,
|
|
||||||
"users/relation_list.html",
|
|
||||||
{
|
|
||||||
"user": user,
|
|
||||||
"is_followers_page": True,
|
|
||||||
},
|
|
||||||
)
|
|
||||||
else:
|
|
||||||
raise BadRequest()
|
|
||||||
|
|
||||||
|
|
||||||
@login_required
|
|
||||||
def following(request, id):
|
|
||||||
if request.method == "GET":
|
|
||||||
user = User.get(id)
|
|
||||||
if user is None or user != request.user:
|
|
||||||
return render_user_not_found(request)
|
|
||||||
return render(
|
|
||||||
request,
|
|
||||||
"users/relation_list.html",
|
|
||||||
{
|
|
||||||
"user": user,
|
|
||||||
"page_type": "followers",
|
|
||||||
},
|
|
||||||
)
|
|
||||||
else:
|
|
||||||
raise BadRequest()
|
|
||||||
|
|
||||||
|
|
||||||
@login_required
|
@login_required
|
||||||
def follow(request, user_name):
|
def follow(request, user_name):
|
||||||
if request.method != "POST":
|
if request.method != "POST":
|
||||||
|
|
|
||||||
Loading…
Add table
Reference in a new issue