fix following$followers page bug

This commit is contained in:
doubaniux 2020-05-07 01:10:08 +08:00
parent ddefd2e16d
commit 4fb25ba55e
8 changed files with 291 additions and 122 deletions

View file

@ -86,7 +86,7 @@ if DEBUG:
'NAME': 'test',
'USER': 'donotban',
'PASSWORD': 'donotbansilvousplait',
'HOST': '192.168.13.70',
'HOST': '192.168.13.72',
'OPTIONS': {
'client_encoding': 'UTF8',
# 'isolation_level': psycopg2.extensions.ISOLATION_LEVEL_DEFAULT,
@ -166,8 +166,8 @@ AUTH_USER_MODEL = 'users.User'
MEDIA_URL = '/media/'
MEDIA_ROOT = os.path.join(BASE_DIR, 'media/')
CLIENT_ID = '3U57sjR7uvCu8suyFlp-fiBVj9-pKt3-jd7F2gLF6EE'
CLIENT_SECRET = 'HZohdI-xR8lUyTs_bM0G3l9Na0W6bZ6DfMK3b84_E0g'
CLIENT_ID = 'kEbwT9Je5HHg4FoLx4nb0tNaIrPNs5Mw6AYlQlsj2_4'
CLIENT_SECRET = 'xwmEvlmudLCkBmvdzGf8m41Ug5o5di9xnDqeVLrcKSg'
# Path to save report related images, ends without slash
REPORT_MEDIA_PATH_ROOT = 'report/'
@ -176,7 +176,7 @@ BOOK_MEDIA_PATH_ROOT = 'book/'
DEFAULT_BOOK_IMAGE = os.path.join(MEDIA_ROOT, BOOK_MEDIA_PATH_ROOT, 'default.jpg')
# Mastodon domain name
MASTODON_DOMAIN_NAME = 'cmx-im.work'
MASTODON_DOMAIN_NAME = 'donotban.com'
# Timeout of requests to Mastodon, in seconds
MASTODON_TIMEOUT = 30

View file

@ -0,0 +1,234 @@
{% load static %}
{% load i18n %}
{% load admin_url %}
{% load mastodon %}
{% load oauth_token %}
{% load truncate %}
{% load highlight %}
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<!-- <meta name="viewport" content="width=device-width, initial-scale=1.0"> -->
<title>{% trans 'Boofilsic - 书' %}</title>
<script src="https://cdn.staticfile.org/jquery/3.5.0/jquery.min.js"></script>
<script src="{% static 'lib/js/rating-star.js' %}"></script>
<script src="{% static 'js/rating-star-readonly.js' %}"></script>
<script src="{% static 'js/mastodon.js' %}"></script>
<script src="{% static 'js/home.js' %}"></script>
<link rel="stylesheet" href="{% static 'css/boofilsic_browse.css' %}">
<link rel="stylesheet" href="{% static 'lib/css/rating-star.css' %}">
<link rel="stylesheet" href="{% static 'lib/css/milligram.css' %}">
</head>
<body>
<div id="page-wrapper">
<div id="content-wrapper">
<section id="navbar" class="navbar">
<div class="container">
<nav class="clearfix">
<a href="{% url 'common:home' %}">
<img src="{% static 'img/logo.svg' %}" alt="" class="logo">
</a>
<input type="search" class="search-box" name="keywords"
value="{% if request.GET.keywords %}{{ request.GET.keywords }}{% endif %}" id="searchInput" required="true" placeholder="{% trans '搜索书影音,多个关键字以空格分割' %}">
<a class="nav-link" id="logoutLink" href="{% url 'users:logout' %}">{% trans '登出' %}</a>
<a class="nav-link" href="{% url 'common:home' %}">{% trans '主页' %}</a>
{% if request.user.is_staff %}
<a class="nav-link" href="{% admin_url %}">{% trans '后台' %}</a>
{% endif %}
</nav>
</div>
</section>
<section id="content" class="container">
<div class="row">
<div id="main">
<ul class="result-items">
{% for mark in marks %}
<li class="result-item clearfix">
<a href="{% url 'books:retrieve' mark.book.id %}">
<img src="{{ mark.book.cover.url }}" alt="" class="result-book-cover">
</a>
<div class="result-info">
<a href="{% url 'books:retrieve' mark.book.id %}" class="result-item-title">
{{ mark.book.title }}
</a>
{% if mark.book.rating %}
<div class="rating-star" data-rating-score="{{ mark.book.rating | floatformat:"0" }}"></div>
<span class="rating-score">
{{ mark.book.rating }}
</span>
{% else %}
<span class="rating-empty"> {% trans '暂无评分' %}</span>
{% endif %}
<span class="result-book-info">
{% if mark.book.pub_year %}
{{ mark.book.pub_year }}{% trans '年' %} /
{% if mark.book.pub_month %}
{{ mark.book.pub_month }}{% trans '月' %} /
{% endif %}
{% endif %}
{% if mark.book.author %}
{% trans '作者' %}
{% for author in mark.book.author %}
{{ author }}{% if not forloop.last %},{% endif %}
{% endfor %}/
{% endif %}
{% if mark.book.translator %}
{% trans '译者' %}
{% for translator in mark.book.translator %}
{{ translator }}{% if not forloop.last %},{% endif %}
{% endfor %}/
{% endif %}
{% if mark.book.orig_title %}
&nbsp;{% trans '原名' %}
{{ mark.book.orig_title }}
{% endif %}
</span>
<p class="result-item-brief">
{{ mark.book.brief | truncate:170 }}
</p>
</div>
</li>
{% empty %}
{% trans '无结果' %}
{% endfor %}
</ul>
<div class="pagination" >
<a
{% if marks.has_previous %}
href="?page=1"
{% else %}
disabled
{% endif %}>
<button {% if not marks.has_previous %}disabled{% endif %} class="button button-clear">{% trans "首页" %}</button>
</a>&nbsp;&nbsp;
<a
{% if marks.has_previous %}
href="?page={{ marks.previous_page_number }}"
{% else %}
disabled
{% endif %}>
<button {% if not marks.has_previous %}disabled{% endif %} class="button button-clear">{% trans "上一页" %}</button>
</a>&nbsp;&nbsp;
<span class="page-index">
{% trans "第" %}{% if request.GET.page %}{{ request.GET.page }}{% else %}1{% endif %}{% trans "页" %}
</span>
&nbsp;&nbsp;<a
{% if marks.has_next %}
href="?page={{ marks.next_page_number }}"
{% else %}
disabled
{% endif %}
>
<button {% if not marks.has_next %}disabled{% endif %} class="button button-clear">{% trans "下一页" %}</button>
</a>
&nbsp;&nbsp;<a
{% if marks.has_next %}
href="?page={{ marks.paginator.num_pages }}"
{% else %}
disabled
{% endif %}>
<button {% if not marks.has_next %}disabled{% endif %} class="button button-clear">{% trans "末页" %}</button>
</a>
</div>
</div>
<div id="aside">
<div class="aside-card mast-user" id="userInfoCard">
<div class="clearfix">
<img src="" class="info-avatar mast-avatar" alt="{{ user.username }}">
<a href="{% url 'users:home' user.id %}">
<h5 class="info-name mast-displayname"></h5>
</a>
</div>
<p class="info-brief mast-brief"></p>
<!-- <a href="#" class="follow">{% trans '关注TA' %}</a> -->
{% if request.user != user %}
<a href="#" class="report">{% trans '举报用户' %}</a>
{% endif %}
</div>
<div class="relation-card" id="userRelationCard">
<h5 class="relation-label">
{% trans '关注的人' %}
</h5>
<a href="{% url 'users:following' user.id %}" class="more-link mast-following-more">{% trans '更多' %}</a>
<ul class="row mast-following relation-user-list">
<li class="column column-25 relation-user">
<img src="" alt="" class="relation-avatar">
<a class="relation-name"></a>
</li>
</ul>
<h5 class="relation-label">
{% trans '被他们关注' %}
</h5>
<a href="{% url 'users:followers' user.id %}" class="more-link mast-followers-more">{% trans '更多' %}</a>
<ul class="row mast-followers relation-user-list">
<li class="column column-25 relation-user">
<img src="" alt="" class="relation-avatar">
<a class="relation-name"></a>
</li>
</ul>
</div>
</div>
</section>
</div>
<footer class="container">
<a href="https://donotban.com/@whitiewhite">去长毛象向作者提意见</a>
<a href="https://github.com/doubaniux/boofilsic" id="githubLink">Github</a>
</footer>
</div>
<div id="oauth2Token" hidden="true">{% oauth_token %}</div>
<div id="mastodonURI" hidden="true">{% mastodon %}</div>
<!--current user mastodon id-->
<div id="userMastodonID" hidden="true">{{ user.mastodon_id }}</div>
<div id="userPageURL" hidden="true">{% url 'users:home' 0 %}</div>
<div class="spinner" id="spinner" hidden>
<div class="lds-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>
<script>
$("#searchInput").on('keyup', function (e) {
if (e.keyCode === 13) {
let keywords = $(this).val();
if (keywords)
location.href = "{% url 'common:search' %}" + "?keywords=" + keywords;
}
});
</script>
</body>
</html>

View file

@ -61,7 +61,7 @@
<div>
{% trans '根据豆瓣内容填写!' %}
{% trans '根据豆瓣内容填写下方表格' %}
</div>
<a href="{% url 'books:scrape' %}" id="submit" class="button add-button">{% trans '剽取!' %}</a>
</div>

View file

@ -6,14 +6,18 @@ from .api import *
def obtain_token(request, code):
""" Returns token if success else None. """
# TODO change http!
payload = {
'client_id': CLIENT_ID,
'client_secret': CLIENT_SECRET,
'redirect_uri': f"http://{request.get_host()}{reverse('users:OAuth2_login')}",
'redirect_uri': f"https://{request.get_host()}{reverse('users:OAuth2_login')}",
'grant_type': 'authorization_code',
'code': code,
'scope': 'read write'
}
from boofilsic.settings import DEBUG
if DEBUG:
payload['redirect_uri']= f"http://{request.get_host()}{reverse('users:OAuth2_login')}",
url = 'https://' + MASTODON_DOMAIN_NAME + API_OBTAIN_TOKEN
response = post(url, data=payload)
if response.status_code != 200:

View file

@ -43,16 +43,17 @@ $(document).ready( function() {
mast_uri,
token,
function(userList, request) {
let subUserList = null;
if (userList.length == 0) {
$(".mast-followers").hide();
} else {
if (userList.length > 4){
userList = userList.slice(0, 4);
subUserList = userList.slice(0, 4);
$(".mast-followers-more").show();
}
let template = $(".mast-followers li").clone();
$(".mast-followers").html("");
userList.forEach(data => {
subUserList.forEach(data => {
temp = $(template).clone();
temp.find("img").attr("src", data.avatar);
if (data.display_name) {
@ -68,8 +69,9 @@ $(document).ready( function() {
$(followersSpinner).remove();
// main
let template = $("#main .user").clone().show();
userList.forEach(data => {
temp = $(template).clone()
temp = $(template).clone();
temp.find(".avatar").attr("src", data.avatar);
if (data.display_name) {
temp.find(".user-name").html(translateEmojis(data.display_name, data.emojis));
@ -147,7 +149,7 @@ $(document).ready( function() {
mainSpinner.hide();
return;
}
let template = $("#main .user:first").clone();
let template = $("#main .user:first").clone().show();
let newUrlFlag = false;
request.getResponseHeader('link').split(',').forEach(link => {
if (link.includes('next')) {

View file

@ -75,16 +75,17 @@ $(document).ready( function() {
token,
function(userList, request) {
// aside
let subUserList = null;
if (userList.length == 0) {
$("#aside .mast-following").hide();
} else {
if (userList.length > 4){
userList = userList.slice(0, 4);
subUserList = userList.slice(0, 4);
$("#aside .mast-following-more").show();
}
let template = $("#aside .mast-following li").clone();
$("#aside .mast-following").html("");
userList.forEach(data => {
subUserList.forEach(data => {
temp = $(template).clone()
temp.find("img").attr("src", data.avatar);
if (data.display_name) {
@ -148,7 +149,7 @@ $(document).ready( function() {
mainSpinner.hide();
return;
}
let template = $("#main .user:first").clone();
let template = $("#main .user:first").clone().show();
let newUrlFlag = false;
request.getResponseHeader('link').split(',').forEach(link => {
if (link.includes('next')) {

View file

@ -11,14 +11,20 @@
<head>
<meta charset="UTF-8">
<!-- <meta name="viewport" content="width=device-width, initial-scale=1.0"> -->
<title>{% trans 'Boofilsic - 书' %}</title>
{% if is_followers_page %}
<title>{% trans 'Boofilsic - 被他们关注' %}</title>
{% else %}
<title>{% trans 'Boofilsic - 关注的人' %}</title>
{% endif %}
<script src="https://cdn.staticfile.org/jquery/3.5.0/jquery.min.js"></script>
<script src="{% static 'lib/js/rating-star.js' %}"></script>
<script src="{% static 'js/rating-star-readonly.js' %}"></script>
<script src="{% static 'js/mastodon.js' %}"></script>
<script src="{% static 'js/home.js' %}"></script>
{% if is_followers_page %}
<script src="{% static 'js/followers_list.js' %}"></script>
{% else %}
<script src="{% static 'js/following_list.js' %}"></script>
{% endif %}
<link rel="stylesheet" href="{% static 'css/boofilsic_browse.css' %}">
<link rel="stylesheet" href="{% static 'lib/css/rating-star.css' %}">
<link rel="stylesheet" href="{% static 'lib/css/milligram.css' %}">
</head>
@ -45,109 +51,25 @@
<section id="content" class="container">
<div class="row">
<div id="main">
<ul class="result-items">
{% for mark in marks %}
<li class="result-item clearfix">
<a href="{% url 'books:retrieve' mark.book.id %}">
<img src="{{ mark.book.cover.url }}" alt="" class="result-book-cover">
</a>
<div class="result-info">
<a href="{% url 'books:retrieve' mark.book.id %}" class="result-item-title">
{{ mark.book.title }}
</a>
{% if mark.book.rating %}
<div class="rating-star" data-rating-score="{{ mark.book.rating | floatformat:"0" }}"></div>
<span class="rating-score">
{{ mark.book.rating }}
</span>
{% else %}
<span class="rating-empty"> {% trans '暂无评分' %}</span>
{% endif %}
<span class="result-book-info">
{% if mark.book.pub_year %}
{{ mark.book.pub_year }}{% trans '年' %} /
{% if mark.book.pub_month %}
{{ mark.book.pub_month }}{% trans '月' %} /
{% endif %}
{% endif %}
{% if mark.book.author %}
{% trans '作者' %}
{% for author in mark.book.author %}
{{ author }}{% if not forloop.last %},{% endif %}
{% endfor %}/
{% endif %}
{% if mark.book.translator %}
{% trans '译者' %}
{% for translator in mark.book.translator %}
{{ translator }}{% if not forloop.last %},{% endif %}
{% endfor %}/
{% endif %}
{% if mark.book.orig_title %}
&nbsp;{% trans '原名' %}
{{ mark.book.orig_title }}
{% endif %}
</span>
<p class="result-item-brief">
{{ mark.book.brief | truncate:170 }}
</p>
</div>
</li>
{% empty %}
{% trans '无结果' %}
{% endfor %}
</ul>
<div class="pagination" >
<a
{% if marks.has_previous %}
href="?page=1"
{% else %}
disabled
{% endif %}>
<button {% if not marks.has_previous %}disabled{% endif %} class="button button-clear">{% trans "首页" %}</button>
</a>&nbsp;&nbsp;
<a
{% if marks.has_previous %}
href="?page={{ marks.previous_page_number }}"
{% else %}
disabled
{% endif %}>
<button {% if not marks.has_previous %}disabled{% endif %} class="button button-clear">{% trans "上一页" %}</button>
</a>&nbsp;&nbsp;
<span class="page-index">
{% trans "第" %}{% if request.GET.page %}{{ request.GET.page }}{% else %}1{% endif %}{% trans "页" %}
</span>
&nbsp;&nbsp;<a
{% if marks.has_next %}
href="?page={{ marks.next_page_number }}"
{% else %}
disabled
{% endif %}
>
<button {% if not marks.has_next %}disabled{% endif %} class="button button-clear">{% trans "下一页" %}</button>
</a>
&nbsp;&nbsp;<a
{% if marks.has_next %}
href="?page={{ marks.paginator.num_pages }}"
{% else %}
disabled
{% endif %}>
<button {% if not marks.has_next %}disabled{% endif %} class="button button-clear">{% trans "末页" %}</button>
</a>
</div>
<div class="set">
<h5 class="set-title">
{% if is_followers_page %}
{% trans ' 被他们关注' %}
{% else %}
{% trans '关注的人' %}
{% endif %}
</h5>
<div class="user clearfix">
<img src="" alt="" class="avatar float-left">
<div class="user-info float-left">
<a href="">
<div class="user-name"></div>
</a>
<p class="user-brief"></p>
</div>
</div>
</div>
</div>
<div id="aside">

View file

@ -53,6 +53,12 @@ def login(request):
f"client_id={CLIENT_ID}&scope=read+write&" +\
f"redirect_uri=https://{request.get_host()}{reverse('users:OAuth2_login')}" +\
"&response_type=code"
from boofilsic.settings import DEBUG
if DEBUG:
auth_url = f"https://{MASTODON_DOMAIN_NAME}{API_OAUTH_AUTHORIZE}?" +\
f"client_id={CLIENT_ID}&scope=read+write&" +\
f"redirect_uri=http://{request.get_host()}{reverse('users:OAuth2_login')}" +\
"&response_type=code"
return render(
request,
@ -290,7 +296,7 @@ def book_list(request, id, status):
marks = paginator.get_page(page_number)
return render(
request,
'users/list.html',
'books/list.html',
{
'marks': marks,
'user': user,