xingcheng
/
QZoneExport
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

说说样式优化，并支持自动展开全文

Browse Source
dev
lvshuncai 3 years ago
parent a52c24a484
commit aa31cbbb55
7 changed files with 59 additions and 35 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 17
      src/export/css/common.css
  2. 38
      src/export/js/messages.js
  3. 10
      src/html/options.html
  4. 1
      src/js/config.js
  5. 6
      src/js/modules/messages.js
  6. 2
      src/js/options.js
  7. 20
      src/templates/messages.html

17
src/export/css/common.css
Unescape View File

@ -979,4 +979,21 @@ pre {
.message-infos>.list-group-item{ .message-infos>.list-group-item{
padding: .25rem 1.25rem; padding: .25rem 1.25rem;
}
/* 有全文时，限制高度 */
.messageText pre.hasMore {
height: 13rem !important;
overflow: hidden;
}
/* 查看全文时，不限制高度 */
.messageText pre.more {
height: auto !important;
}
/* 查看全文图标样式 */
.readMore {
display: block;
text-align: center;
} }

38
src/export/js/messages.js
Unescape View File

@ -13,15 +13,9 @@ const ITEM_TPL = `
<div class="messageText ml-4 container m-2"> <div class="messageText ml-4 container m-2">
<%/* 说说内容 */%> <%/* 说说内容 */%>
<%/* 说说全文 */%> <%/* 说说全文 */%>
<pre class="card-text content <%:=message.has_more_con ? 'hasMore' : ''%>"><%:=API.Common.formatContent(message, "HTML", false, false)%></pre>
<%if(message.has_more_con){%> <%if(message.has_more_con){%>
<details> <span class="fa fa-2x fa-angle-down cursor readMore" title="展开全文"></span>
<summary>查看全文</summary>
<div class="container">
<%:=API.Common.formatContent(message, "HTML", false, false)%>
</div>
</details>
<%}else{%>
<pre class="card-text content"><%:=API.Common.formatContent(message, "HTML", false, false)%></pre>
<%}%> <%}%>
<%/* 语音内容 */%> <%/* 语音内容 */%>
<%if(message.custom_voices){%> <%if(message.custom_voices){%>
@ -36,15 +30,9 @@ const ITEM_TPL = `
<span class="text-info"><%:=API.Common.formatContent(message.rt_uinname)%>：</span> <span class="text-info"><%:=API.Common.formatContent(message.rt_uinname)%>：</span>
</a> </a>
<%/* 转发全文 */%> <%/* 转发全文 */%>
<pre class="card-text content <%:=message.has_more_con ? 'hasMore' : ''%>"><%:=API.Common.formatContent(message, "HTML", true, false)%></pre>
<%if(message.rt_has_more_con && message.rt_con){%> <%if(message.rt_has_more_con && message.rt_con){%>
<details class="float-left ml-3" > <span class="fa fa-2x fa-angle-down cursor readMore" title="展开全文"></span>
<summary>查看全文</summary>
<div class="container">
<%:=API.Common.formatContent(message, "HTML", true, false)%>
</div>
</details>
<%}else{%>
<pre class="card-text content"><%:=API.Common.formatContent(message, "HTML", true, false)%></pre>
<%}%> <%}%>
<%}%> <%}%>
<%/* 多媒体内容 */%> <%/* 多媒体内容 */%>
@ -281,4 +269,22 @@ $(function () {
API.Common.showVisitorsWin(this, messages); API.Common.showVisitorsWin(this, messages);
}); });
// 查看全文
$(".readMore").unbind("click").click(function(e) {
const text = $(this).attr('title');
if (text == "展开全文") {
$(this).attr('title',"收起全文");
$(this).removeClass("fa-angle-down");
$(this).addClass("fa-angle-up");
$(this).prev().addClass("more");
}
if (text == "收起全文") {
$(this).attr('title',"展开全文");
$(this).removeClass("fa-angle-up");
$(this).addClass("fa-angle-down");
$(this).prev().removeClass("more");
}
return;
});
}); });

10
src/html/options.html
Unescape View File

@ -130,7 +130,15 @@
<input type="checkbox" class="custom-control-input" id="messages_full"> <input type="checkbox" class="custom-control-input" id="messages_full">
<label style="margin-left: 14px;" class="custom-control-label" for="messages_full" aria-describedby="messages_full_help"></label> <label style="margin-left: 14px;" class="custom-control-label" for="messages_full" aria-describedby="messages_full_help"></label>
</div> </div>
<small class="text-muted">默认不获取全文，勾选获取全文，适用长说说</small> <small id="messages_full_help" class="text-muted">默认获取全文，取消勾选不获取全文</small>
</div>
<div class="form-group row">
<div class="col-sm-1">展开全文：</div>
<div class="col-sm-2 custom-control custom-checkbox">
<input type="checkbox" class="custom-control-input" id="messages_full_show">
<label style="margin-left: 14px;" class="custom-control-label" for="messages_full_show" aria-describedby="messages_full_show_help"></label>
</div>
<small id="messages_full_show_help" class="text-muted">默认不自动展开全文，勾选将自动展开全文</small>
</div> </div>
<div class="form-group row"> <div class="form-group row">
<div class="col-sm-1">屏蔽开关：</div> <div class="col-sm-1">屏蔽开关：</div>

1
src/js/config.js
Unescape View File

@ -34,6 +34,7 @@ const Default_Config = {
max: 2 max: 2
}, },
isFull: true, //是否获取全文 isFull: true, //是否获取全文
isShowMore: false, //是否展开全文
Comments: { Comments: {
isFull: true, //是否全部评论 isFull: true, //是否全部评论
pageSize: 20, pageSize: 20,

6
src/js/modules/messages.js
Unescape View File

@ -362,7 +362,8 @@ API.Messages.exportToHtml = async(messages) => {
_messageMaps.set(year, monthMaps); _messageMaps.set(year, monthMaps);
let params = { let params = {
messageMaps: _messageMaps, messageMaps: _messageMaps,
total: yearItems.length total: yearItems.length,
config: QZone_Config
} }
let yearFile = await API.Common.writeHtmlofTpl('messages', params, QZone.Messages.ROOT + "/" + year + ".html"); let yearFile = await API.Common.writeHtmlofTpl('messages', params, QZone.Messages.ROOT + "/" + year + ".html");
console.info('生成说说年份HTML文件结束', year, yearItems, yearFile); console.info('生成说说年份HTML文件结束', year, yearItems, yearFile);
@ -372,7 +373,8 @@ API.Messages.exportToHtml = async(messages) => {
// 基于模板生成汇总说说HTML // 基于模板生成汇总说说HTML
let params = { let params = {
messageMaps: API.Utils.groupedByTime(messages, "custom_create_time", 'all'), messageMaps: API.Utils.groupedByTime(messages, "custom_create_time", 'all'),
total: messages.length total: messages.length,
config: QZone_Config
} }
let allFile = await API.Common.writeHtmlofTpl('messages', params, QZone.Messages.ROOT + "/index.html"); let allFile = await API.Common.writeHtmlofTpl('messages', params, QZone.Messages.ROOT + "/index.html");
console.info('生成说说汇总HTML文件结束', allFile, messages); console.info('生成说说汇总HTML文件结束', allFile, messages);

2
src/js/options.js
Unescape View File

@ -326,6 +326,7 @@
$("#messages_list_cost_max").val(options.Messages.randomSeconds.max); $("#messages_list_cost_max").val(options.Messages.randomSeconds.max);
$("#messages_list_limit").val(options.Messages.pageSize); $("#messages_list_limit").val(options.Messages.pageSize);
$("#messages_full").prop("checked", options.Messages.isFull); $("#messages_full").prop("checked", options.Messages.isFull);
$("#messages_full_show").prop("checked", options.Messages.isShowMore);
$("#message_is_filter").prop("checked", options.Messages.isFilterKeyword).change(); $("#message_is_filter").prop("checked", options.Messages.isFilterKeyword).change();
$("#filterKeywords").val(options.Messages.FilterKeyWords.join('\n')); $("#filterKeywords").val(options.Messages.FilterKeyWords.join('\n'));
// 评论列表 // 评论列表
@ -522,6 +523,7 @@
QZone_Config.Messages.randomSeconds.max = $("#messages_list_cost_max").val() * 1; QZone_Config.Messages.randomSeconds.max = $("#messages_list_cost_max").val() * 1;
QZone_Config.Messages.pageSize = $("#messages_list_limit").val() * 1; QZone_Config.Messages.pageSize = $("#messages_list_limit").val() * 1;
QZone_Config.Messages.isFull = $("#messages_full").prop("checked"); QZone_Config.Messages.isFull = $("#messages_full").prop("checked");
QZone_Config.Messages.isShowMore = $("#messages_full_show").prop("checked");
QZone_Config.Messages.isFilterKeyword = $("#message_is_filter").prop("checked"); QZone_Config.Messages.isFilterKeyword = $("#message_is_filter").prop("checked");
QZone_Config.Messages.FilterKeyWords = $("#filterKeywords").val().split('\n'); QZone_Config.Messages.FilterKeyWords = $("#filterKeywords").val().split('\n');
// 评论列表 // 评论列表

20
src/templates/messages.html
Unescape View File

@ -63,15 +63,9 @@
<div class="messageText ml-4 container m-2"> <div class="messageText ml-4 container m-2">
<%/* 说说内容 */%> <%/* 说说内容 */%>
<%/* 说说全文 */%> <%/* 说说全文 */%>
<pre class="card-text content <%:=message.has_more_con ? 'hasMore' : ''%> <%:=config.Messages.isShowMore ? 'more' : ''%> "><%:=API.Common.formatContent(message, "HTML", false, false)%></pre>
<%if(message.has_more_con){%> <%if(message.has_more_con){%>
<details> <span class="fa fa-2x <%:=config.Messages.isShowMore ? 'fa-angle-up' : 'fa-angle-down'%> cursor <%:=config.Messages.isShowMore ? 'more' : ''%> readMore" title="<%:=config.Messages.isShowMore ? '收起全文' : '展开全文'%>"></span>
<summary>查看全文</summary>
<div class="container">
<%:=API.Common.formatContent(message, "HTML", false, false)%>
</div>
</details>
<%}else{%>
<pre class="card-text content"><%:=API.Common.formatContent(message, "HTML", false, false)%></pre>
<%}%> <%}%>
<%/* 语音内容 */%> <%/* 语音内容 */%>
<%if(message.custom_voices){%> <%if(message.custom_voices){%>
@ -86,15 +80,9 @@
<span class="text-info"><%:=API.Common.formatContent(message.rt_uinname)%>：</span> <span class="text-info"><%:=API.Common.formatContent(message.rt_uinname)%>：</span>
</a> </a>
<%/* 转发全文 */%> <%/* 转发全文 */%>
<pre class="card-text content <%:=message.has_more_con ? 'hasMore' : ''%> <%:=config.Messages.isShowMore ? 'more' : ''%> "><%:=API.Common.formatContent(message, "HTML", true, false)%></pre>
<%if(message.rt_has_more_con && message.rt_con){%> <%if(message.rt_has_more_con && message.rt_con){%>
<details class="float-left ml-3" > <span class="fa fa-2x <%:=config.Messages.isShowMore ? 'fa-angle-up' : 'fa-angle-down'%> cursor readMore" title="<%:=config.Messages.isShowMore ? '收起全文' : '展开全文'%>"></span>
<summary>查看全文</summary>
<div class="container">
<%:=API.Common.formatContent(message, "HTML", true, false)%>
</div>
</details>
<%}else{%>
<pre class="card-text content"><%:=API.Common.formatContent(message, "HTML", true, false)%></pre>
<%}%> <%}%>
<%}%> <%}%>
<%/* 多媒体内容 */%> <%/* 多媒体内容 */%>

Write Preview
Loading…
Cancel
Save