Commit a77da425 authored by Van's avatar Van

微信二维码

parent db3285ba
......@@ -13,8 +13,8 @@
"license": "AGPLv3",
"private": true,
"scripts": {
"build": "gulp",
"dev": "webpack --config webpack.js"
"build": "webpack --mode production",
"dev": "webpack"
},
"author": "Daniel <dl882509@gmail.com> (http://88250.b3log.org) & Vanessa <v@b3log.org> (http://vanessa.b3log.org)",
"maintainers": [
......
......@@ -45,14 +45,10 @@
</a>
</div>
</div>
<script type="text/javascript" src="${staticServePath}/js/common.min.js" charset="utf-8"></script>
<script type="text/javascript" src="${staticServePath}/js/lib/qrious.min.js" charset="utf-8"></script>
<script type="text/javascript">
(function () {
try {
$('.startAction')
} catch (e) {
document.querySelector('.main').innerHTML = "${staticErrorLabel}"
}
})()
if (typeof QRious === 'undefined') {
document.querySelector('.main').innerHTML = "${staticErrorLabel}"
}
</script>
</@commonPage>
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
......@@ -19,24 +19,23 @@
-->
<link type="text/css" rel="stylesheet" href="${staticServePath}/plugins/symphony-interest/style.css"/>
<div id="symphonyInterestPanel">
<div class="module-panel">
<div class="module-header">
<h2>${interestLabel}</h2>
</div>
<div class="module-body padding12">
<div id="symphonyInterest">
</div>
</div>
<div class="module-panel">
<div class="module-header">
<h2>${interestLabel}</h2>
</div>
<div class="module-body padding12">
<div id="symphonyInterest">
</div>
</div>
</div>
</div>
<script type="text/javascript">
const symphonyInterestPanelElement = document.getElementById('symphonyInterestPanel')
const symphonyInterestElement = document.getElementById('symphonyInterest')
plugins.symphonyInterest = {
init: function () {
$('#loadMsg').text("${loadingLabel}")
symphonyInterestElement.style.background = "url(${staticServePath}/images/loader.gif) no-repeat scroll center center transparent"
$('#symphonyInterest').css('background',
"url(${staticServePath}/images/loader.gif) no-repeat scroll center center transparent")
$.ajax({
url: 'https://hacpai.com/apis/articles?',
......@@ -44,8 +43,7 @@
dataType: 'jsonp',
jsonp: 'callback',
error: function () {
symphonyInterestElement.innerHTML = 'Loading Interest failed :-('
symphonyInterestElement.style.background = 'none'
$('#symphonyInterest').html('Loading Interest failed :-(').css('background', 'none')
},
success: function (data, textStatus) {
var articles = data.articles
......@@ -58,21 +56,19 @@
var article = articles[i]
var articleLiHtml = '<li>'
+ '<a target=\'_blank\' href=\'' + article.articlePermalink + '\'>'
+ article.articleTitle + '</a>&nbsp; <span class=\'date\'>' +
$.bowknot.getDate(article.articleCreateTime, 1);
+ '<a target=\'_blank\' href=\'' + article.articlePermalink + '\'>'
+ article.articleTitle + '</a>&nbsp; <span class=\'date\'>' + $.bowknot.getDate(article.articleCreateTime, 1);
+'</span></li>'
listHTML += articleLiHtml
}
listHTML += '</ul>'
symphonyInterestElement.innerHTML = listHTML
symphonyInterestElement.style.background = 'none'
},
$('#symphonyInterest').html(listHTML).css('background', 'none')
}
})
$('#loadMsg').text('')
},
}
}
/*
......@@ -81,9 +77,9 @@
admin.plugin.add({
'id': 'symphonyInterest',
'path': '/main/panel1',
'content': symphonyInterestPanelElement.innerHTML,
'content': $('#symphonyInterestPanel').html()
})
// 移除现有内容
symphonyInterestPanelElement.remove()
$('#symphonyInterestPanel').remove()
</script>
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
......@@ -682,10 +682,10 @@ aside {
&__qr {
position: absolute;
top: 33px;
left: 60px;
height: 128px;
width: 128px;
top: 30px;
left: 50px;
height: 99px;
width: 99px;
}
}
}
......
This diff is collapsed.
......@@ -762,7 +762,9 @@ a {
&__qr {
position: absolute;
top: 24px;
left: 60px;
left: 68px;
height: 99px;
width: 99px;
}
}
}
......
......@@ -495,6 +495,8 @@ a {
position: absolute;
top: 61px;
left: 60px;
height: 99px;
width: 99px;
}
}
}
......
......@@ -71,7 +71,7 @@
</div>
</#if>
</section>
<footer>
<footer class="fn__clear">
<figure class="post-author">
<a href="${servePath}/authors/${article.authorId}"
title="${article.authorName}" alt="${article.authorName}"
......@@ -79,17 +79,7 @@
<span class="fn-none">${article.authorName}</span>
</a>
</figure>
<div class="share fn-right">
<span class="icon icon-wechat"
data-type="wechat"
data-title="${article.articleTitle}"
data-blogtitle="${blogTitle}"
data-url="${servePath}${article.articlePermalink}"
data-avatar="${article.authorThumbnailURL}"></span>
<span class="icon icon-weibo" data-type="weibo"></span>
<span class="icon icon-twitter" data-type="twitter"></span>
<span class="icon icon-qqz" data-type="qqz"></span>
</div>
<#include "../../common-template/share.ftl">
</footer>
</article>
<#if 0 != relevantArticlesDisplayCount>
......@@ -146,6 +136,7 @@
<#if 0 != relevantArticlesDisplayCount>
page.loadRelevantArticles('${article.oId}', '<h4>${relevantArticles1Label}</h4>');
</#if>
page.share();
</@comment_script>
</div>
</body>
......
......@@ -372,10 +372,6 @@ pre code, pre tt {
-moz-osx-font-smoothing: grayscale;
}
.icon-qqz:before {
content: "\e902";
}
.icon-register:before {
content: "\e600";
}
......@@ -751,16 +747,6 @@ article.post {
border-bottom: #EBF2F6 1px solid;
word-wrap: break-word;
width: 80%;
.share {
position: relative;
canvas {
position: absolute;
left: 0;
top: 36px;
}
}
}
.post-content--article {
......@@ -866,31 +852,6 @@ article.post:after {
border-radius: 35px;
}
.share .icon {
cursor: pointer;
transition: all 0.2s ease-out 0s;
display: inline-block;
font-size: 16px;
margin-top: 15px;
}
.share .icon:hover {
transform: rotate(360deg);
color: #9EABB3;
}
.icon-weibo:before {
content: "\e605";
}
.icon-twitter:before {
content: "\e60b";
}
.icon-tencent:before {
content: "\e60d";
}
.icon-google:before {
content: "\e603";
}
......@@ -1090,6 +1051,58 @@ ul.comments {
margin: 0;
}
.article__share {
margin-top: 10px;
display: inline-block;
position: relative;
float: right;
.item {
cursor: pointer;
display: inline-block;
float: left;
text-align: center;
padding: 5px;
box-sizing: border-box;
color: #fdc200;
transition: all .3s ease;
opacity: .86;
svg {
fill: currentColor;
height: 16px;
width: 16px;
float: left;
}
&[data-type="wechat"] {
color: #3caf36;
}
&[data-type="twitter"] {
color: #18a3fa;
}
&[data-type="weibo"] {
color: #f93;
}
&:hover {
transform: rotate(360deg);
color: #9EABB3;
}
&__qr {
position: absolute;
top: 30px;
left: 33px;
height: 99px;
width: 99px;
}
}
}
/* end article */
/* start tags */
......
......@@ -34,7 +34,6 @@ window.Finding = {
init: function () {
Util.killIE();
this._initToc();
this.share();
$(".scroll-down").click(function (event) {
event.preventDefault();
......@@ -75,59 +74,6 @@ window.Finding = {
if ($(window).width() > 500) {
$("body").toggleClass("nav-opened nav-closed");
}
},
/**
* 分享
* @returns {undefined}
*/
share: function () {
var $this = $('.share')
var $qrCode = $this.find('.icon-wechat')
var shareURL = $qrCode.data('url')
var avatarURL = $qrCode.data('avatar')
var title = encodeURIComponent($qrCode.data('title') + ' - ' +
$qrCode.data('blogtitle')),
url = encodeURIComponent(shareURL)
var urls = {}
urls.weibo = 'http://v.t.sina.com.cn/share/share.php?title=' +
title + '&url=' + url + '&pic=' + avatarURL
urls.qqz = 'https://sns.qzone.qq.com/cgi-bin/qzshare/cgi_qzshare_onekey?url='
+ url + '&sharesource=qzone&title=' + title + '&pics=' + avatarURL
urls.twitter = 'https://twitter.com/intent/tweet?status=' + title + ' ' +
url
$this.find('span').click(function () {
var key = $(this).data('type')
if (!key) {
return
}
if (key === 'wechat') {
if ($qrCode.find('canvas').length === 0) {
$.ajax({
method: 'GET',
url: Label.staticServePath +
'/js/lib/jquery.qrcode.min.js',
dataType: 'script',
cache: true,
success: function () {
$qrCode.qrcode({
width: 128,
height: 128,
text: shareURL,
})
},
})
} else {
$qrCode.find('canvas').slideToggle()
}
return false
}
window.open(urls[key], '_blank', 'top=100,left=200,width=648,height=618')
})
}
};
......
This diff is collapsed.
......@@ -213,7 +213,6 @@
<#if pjax><!---- pjax {#pjax} end ----></#if>
</div>
<#include "footer.ftl">
<script type="text/javascript" src="${staticServePath}/js/lib/jquery.qrcode.min.js"></script>
<#if pjax><!---- pjax {#pjax} start ----></#if>
<@comment_script oId=article.oId commentable=article.commentable>
Skin.initArticle()
......
......@@ -530,10 +530,11 @@
.post__share #articleShare .article__code {
position: absolute;
height: 130px;
width: 130px;
height: 99px;
width: 99px;
left: -2px;
top: 22px
top: 22px;
z-index: 2;
}
.post__share-icon {
......@@ -581,8 +582,8 @@
.post__side .article__code {
position: absolute;
height: 130px;
width: 130px;
height: 99px;
width: 99px;
left: 45px;
top: 90px
}
......@@ -711,9 +712,9 @@
.article__toolbar .article__code {
position: absolute;
height: 130px;
width: 130px;
left: 50px;
height: 99px;
width: 99px;
left: 0;
bottom: 30px
}
......@@ -792,6 +793,10 @@
padding: 40px 0 35px
}
#articleBottomShare {
position: relative;
}
@media (max-width: 768px) {
.header {
text-align: left
......
......@@ -23,6 +23,7 @@
*/
import '../../../js/common'
/**
* @description 皮肤脚本
* @static
......@@ -43,14 +44,14 @@ window.Skin = {
return
}
if ($(window).scrollTop() > 64) {
$('#headerNav').addClass('header__nav--fixed');
$('.main').css('margin-top', '100px');
$('#headerNav').addClass('header__nav--fixed')
$('.main').css('margin-top', '100px')
} else {
$('#headerNav').removeClass('header__nav--fixed');
$('.main').css('margin-top', '50px');
$('#headerNav').removeClass('header__nav--fixed')
$('.main').css('margin-top', '50px')
}
});
$(window).scroll();
})
$(window).scroll()
Skin.initToc()
......@@ -59,43 +60,33 @@ window.Skin = {
}
Util.initPjax(function () {
if (Util.isArticlePage(location.href)) {
if (!$('#articleSideShare .article__code').qrcode) {
$.ajax({
method: "GET",
url: Label.staticServePath + '/js/lib/jquery.qrcode.min.js',
dataType: "script",
cache: true
});
}
}
Skin.initToc()
})
},
initTags: function () {
var $tags = $('#tags');
var $tags = $('#tags')
var tagsArray = $tags.find('.tag')
// 根据引用次数添加样式,产生云效果
var max = parseInt(tagsArray.first().data('count'));
var distance = Math.ceil(max / 5);
var max = parseInt(tagsArray.first().data('count'))
var distance = Math.ceil(max / 5)
for (var i = 0; i < tagsArray.length; i++) {
var count = parseInt($(tagsArray[i]).data('count'));
var count = parseInt($(tagsArray[i]).data('count'))
// 算出当前 tag 数目所在的区间,加上 class
for (var j = 0; j < 5; j++) {
if (count > j * distance && count <= (j + 1) * distance) {
tagsArray[i].className = 'tag tag__level' + j;
break;
tagsArray[i].className = 'tag tag__level' + j
break
}
}
}
// 按字母或者中文拼音进行排序
$tags.html(tagsArray.get().sort(function (a, b) {
var valA = $(a).text().toLowerCase();
var valB = $(b).text().toLowerCase();
var valA = $(a).text().toLowerCase()
var valB = $(b).text().toLowerCase()
// 对中英文排序的处理
return valA.localeCompare(valB);
}));
return valA.localeCompare(valB)
}))
},
initArticle: function () {
if ($('#articleShare').length === 0) {
......@@ -126,10 +117,11 @@ window.Skin = {
// up
$('.header').addClass('header--fixed').css({'top': '0'})
$('.main').css('padding-top', '64px')
if ($(window).height() <= $('.post').height() && scrollTop < bottomTop - $(window).height()) {
if ($(window).height() <= $('.post').height() && scrollTop <
bottomTop - $(window).height()) {
$('.article__toolbar').css({
'bottom': 0,
'opacity': 1
'opacity': 1,
})
}
} else if (beforScrollTop - scrollTop < 0) {
......@@ -138,7 +130,7 @@ window.Skin = {
$('.main').css('padding-top', '0')
$('.article__toolbar').css({
'bottom': '-44px',
'opacity': 0
'opacity': 0,
})
}
......@@ -155,18 +147,18 @@ window.Skin = {
if (bottomTop < $(window).height()) {
$postSide.css({
'position': 'absolute',
'top': (bottomTop - 125) + 'px'
'top': (bottomTop - 125) + 'px',
})
} else {
$postSide.css({
'position': 'absolute',
'top': (bottomTop - sideAbsoluteTop) + 'px'
'top': (bottomTop - sideAbsoluteTop) + 'px',
})
}
} else {
$postSide.css({
'position': 'fixed',
'top': '50%'
'top': '50%',
})
}
......@@ -180,17 +172,20 @@ window.Skin = {
var $qrCode = $this.find('.article__code')
var shareURL = $qrCode.data('url')
var avatarURL = $qrCode.data('avatar')
var title = encodeURIComponent($qrCode.data('title') + ' - ' + $qrCode.data('blogtitle')),
var title = encodeURIComponent(
$qrCode.data('title') + ' - ' + $qrCode.data('blogtitle')),
url = encodeURIComponent(shareURL)
var urls = {}
urls.tencent = 'http://share.v.t.qq.com/index.php?c=share&a=index&title=' + title +
urls.tencent = 'http://share.v.t.qq.com/index.php?c=share&a=index&title=' +
title +
'&url=' + url + '&pic=' + avatarURL
urls.weibo = 'http://v.t.sina.com.cn/share/share.php?title=' +
title + '&url=' + url + '&pic=' + avatarURL
urls.qqz = 'https://sns.qzone.qq.com/cgi-bin/qzshare/cgi_qzshare_onekey?url='
+ url + '&sharesource=qzone&title=' + title + '&pics=' + avatarURL
urls.twitter = 'https://twitter.com/intent/tweet?status=' + title + ' ' + url
urls.twitter = 'https://twitter.com/intent/tweet?status=' + title + ' ' +
url
$this.find('span').click(function () {
var key = $(this).data('type')
......@@ -200,16 +195,22 @@ window.Skin = {
}
if (key === 'wechat') {
if ($qrCode.find('canvas').length === 0) {
$qrCode.qrcode({
width: 128,
height: 128,
text: shareURL
});
if (typeof QRious === 'undefined') {
Util.addScript(Label.staticServePath + '/js/lib/qrious.min.js',
'qriousScript')
}
if ($qrCode.css('background-image') !== "none") {
$qrCode.slideToggle()
} else {
$qrCode.slideToggle();
const qr = new QRious({
padding: 0,
element: $qrCode[0],
value: shareURL,
size: 128,
})
$qrCode.css('background-image', `url(${qr.toDataURL('image/jpeg')})`)
}
return false;
return false
}
window.open(urls[key], '_blank', 'top=100,left=200,width=648,height=618')
......@@ -218,11 +219,11 @@ window.Skin = {
initToc: function () {
if ($('.article__toc').length !== 0 && $(window).width() > 1000) {
$('.article__toc').animate({
'left': ($('.post').outerWidth() + $('.post').offset().left) + 'px'
'left': ($('.post').outerWidth() + $('.post').offset().left) + 'px',
}, 600)
} else {
$('.article__toc').hide()
}
}
};
Skin.init();
},
}
Skin.init()
......@@ -126,7 +126,10 @@
data-title="${article.articleTitle}"
data-blogtitle="${blogTitle}"
data-url="${servePath}${article.articlePermalink}"
data-avatar="${article.authorThumbnailURL}">WeChat</span>
data-avatar="${article.authorThumbnailURL}">
WeChat
<span class="qrcode"></span>
</span>
</span>
<span class="post__arrow">
<#if previousArticlePermalink??>
......
......@@ -497,10 +497,12 @@ a:active, a:focus, a:hover {
&__code {
position: relative;
canvas {
.qrcode {
position: absolute;
bottom: 30px;
left: 0;
height: 99px;
width: 99px;
}
}
......
......@@ -23,6 +23,7 @@
*/
import '../../../js/common'
/**
* @description 皮肤脚本
* @static
......@@ -44,7 +45,6 @@ window.Skin = {
})
header.init()
$('.header__nav a').each(function () {
if (this.href === location.href) {
this.className = 'current'
......@@ -80,14 +80,15 @@ window.Skin = {
if ($('.article__toc').length === 0) {
return
}
$('.post__toc').css('left', $('.post').offset().left + $('.post').outerWidth())
$('.post__toc').
css('left', $('.post').offset().left + $('.post').outerWidth())
var $articleTocs = $('.vditor-reset [id^=b3_solo_h]'),
$articleToc = $('.article__toc');
$articleToc = $('.article__toc')
$(window).unbind('scroll').scroll(function (event) {
if ($('.article__toc li').length === 0) {
return false;
return false
}
if ($(window).scrollTop() > 72) {
......@@ -98,29 +99,31 @@ window.Skin = {
}
// 界面各种图片加载会导致帖子目录定位
var toc = [];
var toc = []
$articleTocs.each(function (i) {
toc.push({
id: this.id,
offsetTop: this.offsetTop
});
});
offsetTop: this.offsetTop,
})
})
// 当前目录样式
var scrollTop = $(window).scrollTop();
var scrollTop = $(window).scrollTop()
for (var i = 0, iMax = toc.length; i < iMax; i++) {
if (scrollTop < toc[i].offsetTop - 20) {
$articleToc.find('li').removeClass('current');
var index = i > 0 ? i - 1 : 0;
$articleToc.find('a[href="#' + toc[index].id + '"]').parent().addClass('current');
break;
$articleToc.find('li').removeClass('current')
var index = i > 0 ? i - 1 : 0
$articleToc.find('a[href="#' + toc[index].id + '"]').
parent().
addClass('current')
break
}
}
if (scrollTop >= toc[toc.length - 1].offsetTop - 20) {
$articleToc.find('li').removeClass('current');
$articleToc.find('li:last').addClass('current');
$articleToc.find('li').removeClass('current')
$articleToc.find('li:last').addClass('current')
}
});
})
$(window).scroll()
},
......@@ -149,23 +152,19 @@ window.Skin = {
}
if (key === 'wechat') {
if ($qrCode.find('canvas').length === 0) {
$.ajax({
method: 'GET',
url: Label.staticServePath +
'/js/lib/jquery.qrcode.min.js',
dataType: 'script',
cache: true,
success: function () {
$qrCode.qrcode({
width: 128,
height: 128,
text: shareURL,
})
},
const $qrImg = $('.qrcode')
if (typeof QRious === 'undefined') {
Util.addScript(Label.staticServePath + '/js/lib/qrious.min.js',
'qriousScript')
const qr = new QRious({
padding: 0,
element: $qrCode[0],
value: shareURL,
size: 128,
})
$qrImg.css('background-image', `url(${qr.toDataURL('image/jpeg')})`)
} else {
$qrCode.find('canvas').slideToggle()
$qrImg.slideToggle()
}
return false
}
......
......@@ -109,6 +109,7 @@
<#if 0 != externalRelevantArticlesDisplayCount>
MetroHot.loadExternalRelevantArticles("<#list article.articleTags?split(",") as articleTag>${articleTag}<#if articleTag_has_next>,</#if></#list>");
</#if>
page.share()
</@comment_script>
</body>
</html>
......@@ -534,7 +534,6 @@ textarea {
.online-count,
.user,
.notice-board,
.share,
.article-relative {
width: 188px;
}
......@@ -580,36 +579,48 @@ textarea {
width: 60px;
}
.online-count,
.share {
.online-count{
background-color: #20608E;
}
.share div.text {
color: #BDBEBD;
font-size: 16px;
font-weight: normal;
left: 128px;
line-height: 54px;
top: 5px;
width: 105px;
.article__share {
display: inline-block;
position: relative;
z-index: 10;
.icon-wechat {
position: relative;
.item {
cursor: pointer;
display: inline-block;
float: left;
text-align: center;
padding: 5px;
box-sizing: border-box;
transition: all .3s ease;
opacity: .86;
color: #323232;
svg {
fill: currentColor;
height: 20px;
width: 20px;
float: left;
}
canvas {
&:hover {
transform: rotate(360deg);
color: #9EABB3;
}
&__qr {
position: absolute;
right: 43px;
top: -17px;
top: 30px;
left: 33px;
height: 99px;
width: 99px;
}
}
}
.share .text span:hover {
cursor: pointer;
color: #FFF;
}
.online-count .text,
.article-relative .text {
font-size: 12px;
......@@ -1061,7 +1072,6 @@ pre.prettyprint {
.online-count,
.user,
.notice-board,
.share,
.article-relative {
width: 249px;
}
......@@ -1079,10 +1089,6 @@ pre.prettyprint {
width: auto !important;
}
.share div.text {
left: 173px;
}
.form {
width: auto;
}
......
......@@ -106,58 +106,6 @@ window.MetroHot = {
loadImg: function(it) {
it.style.marginTop = ("margin-top", (220 - it.height) / 2 + "px");
},
/**
* @description 分享按钮
*/
share: function() {
var $this = $('.share .text')
var $qrCode = $this.find('.icon-wechat')
var shareURL = $qrCode.data('url')
var avatarURL = $qrCode.data('avatar')
var title = encodeURIComponent($qrCode.data('title') + ' - ' +
$qrCode.data('blogtitle')),
url = encodeURIComponent(shareURL)
var urls = {}
urls.weibo = 'http://v.t.sina.com.cn/share/share.php?title=' +
title + '&url=' + url + '&pic=' + avatarURL
urls.qqz = 'https://sns.qzone.qq.com/cgi-bin/qzshare/cgi_qzshare_onekey?url='
+ url + '&sharesource=qzone&title=' + title + '&pics=' + avatarURL
urls.twitter = 'https://twitter.com/intent/tweet?status=' + title + ' ' +
url
$this.find('span').click(function () {
var key = $(this).data('type')
if (!key) {
return
}
if (key === 'wechat') {
if ($qrCode.find('canvas').length === 0) {
$.ajax({
method: 'GET',
url: Label.staticServePath +
'/js/lib/jquery.qrcode.min.js',
dataType: 'script',
cache: true,
success: function () {
$qrCode.qrcode({
width: 111,
height: 111,
text: shareURL,
})
},
})
} else {
$qrCode.find('canvas').slideToggle()
}
return false
}
window.open(urls[key], '_blank', 'top=100,left=200,width=648,height=618')
})
},
/*
* @description 加载随机文章
*/
......@@ -271,7 +219,4 @@ window.MetroHot = {
(function() {
MetroHot.init();
if ($(".article-header").length > 0) {
MetroHot.share();
}
})();
......@@ -72,31 +72,8 @@
</a>
<#if isArticle>
<div class="share side-tile">
<span data-ico="&#xe1fe;"></span>
<div class="title">
${shareLabel}
</div>
<div class="text">
<#if article??>
<span class="icon-wechat"
data-type="wechat"
data-title="${article.articleTitle}"
data-blogtitle="${blogTitle}"
data-url="${servePath}${article.articlePermalink}"
data-avatar="${article.authorThumbnailURL}">微信</span>
<#else>
<span class="icon-wechat"
data-type="wechat"
data-title="${page.pageTitle}"
data-blogtitle="${blogTitle}"
data-url="${servePath}${page.pagePermalink}"
data-avatar="${adminUser.userAvatar}">微信</span>
</#if>
<span data-type="weibo">微博</span>
<span data-type="twitter">Twitter</span>
<span data-type="qqz">QQ</span>
</div>
<div class="side-tile article-relative">
<#include "../../common-template/share.ftl">
</div>
<#if relevantArticlesDisplayCount??>
......
This diff is collapsed.
......@@ -109,15 +109,7 @@
<footer class="fn-clear share">
<div class="fn-right">
<span class="icon icon-wechat"
data-type="wechat"
data-title="${article.articleTitle}"
data-blogtitle="${blogTitle}"
data-url="${servePath}${article.articlePermalink}"
data-avatar="${article.authorThumbnailURL}"></span>
<span class="icon icon-weibo" data-type="weibo"></span>
<span class="icon icon-twitter" data-type="twitter"></span>
<span class="icon icon-qqz" data-type="qqz"></span>
<#include "../../common-template/share.ftl">
</div>
</footer>
<#if 0 != relevantArticlesDisplayCount>
......@@ -155,7 +147,7 @@
<#if 0 != relevantArticlesDisplayCount>
page.loadRelevantArticles('${article.oId}', '<h4>${relevantArticles1Label}</h4>');
</#if>
Yilia.share()
page.share()
</@comment_script>
</main>
</body>
......
This diff is collapsed.
......@@ -643,7 +643,7 @@ article .abstract {
overflow: hidden;
word-wrap: break-word;
display: block;
color: rgba(0,0,0,0.6);
color: rgba(0, 0, 0, 0.6);
}
.article__footer {
......@@ -674,26 +674,43 @@ article .abstract a:hover {
opacity: 0.7;
}
.share {
.icon-wechat {
position: relative;
z-index: 12;
}
canvas {
position: absolute;
right: -54px;
top: 18px;
}
.article__share {
display: inline-block;
position: relative;
span {
transition: all 0.2s ease-out 0s;
.item {
float: left;
text-align: center;
padding: 5px;
box-sizing: border-box;
cursor: pointer;
transition: all .3s ease;
opacity: .86;
color: rgba(0, 0, 0, 0.6);
svg {
fill: currentColor;
height: 16px;
width: 16px;
float: left;
}
&:hover {
transform: rotate(360deg);
color: #333;
}
&__qr {
position: absolute;
top: 25px;
left: 32px;
height: 99px;
width: 99px;
}
}
}
article footer .avatar:hover,
.share span:hover {
article footer .avatar:hover {
transform: rotate(360deg);
color: #333;
}
......@@ -821,7 +838,6 @@ article.post {
.post .share {
padding: 10px 0 0 0;
font-size: 14px;
margin: 30px 30px 20px 30px;
border-top: 1px solid #ddd;
}
......
......@@ -69,55 +69,6 @@ window.Yilia = {
$("a.tag").each(function (i) {
$(this).addClass("color" + Math.ceil(Math.random() * 4));
});
},
share: function () {
var $this = $('.share .fn-right')
var $qrCode = $this.find('.icon-wechat')
var shareURL = $qrCode.data('url')
var avatarURL = $qrCode.data('avatar')
var title = encodeURIComponent($qrCode.data('title') + ' - ' +
$qrCode.data('blogtitle')),
url = encodeURIComponent(shareURL)
var urls = {}
urls.weibo = 'http://v.t.sina.com.cn/share/share.php?title=' +
title + '&url=' + url + '&pic=' + avatarURL
urls.qqz = 'https://sns.qzone.qq.com/cgi-bin/qzshare/cgi_qzshare_onekey?url='
+ url + '&sharesource=qzone&title=' + title + '&pics=' + avatarURL
urls.twitter = 'https://twitter.com/intent/tweet?status=' + title + ' ' +
url
$this.find('span').click(function () {
var key = $(this).data('type')
if (!key) {
return
}
if (key === 'wechat') {
if ($qrCode.find('canvas').length === 0) {
$.ajax({
method: 'GET',
url: Label.staticServePath +
'/js/lib/jquery.qrcode.min.js',
dataType: 'script',
cache: true,
success: function () {
$qrCode.qrcode({
width: 128,
height: 128,
text: shareURL,
})
},
})
} else {
$qrCode.find('canvas').slideToggle()
}
return false
}
window.open(urls[key], '_blank', 'top=100,left=200,width=648,height=618')
})
}
};
......
/*
* Symphony - A modern community (forum/BBS/SNS/blog) platform written in Java.
* Copyright (C) 2012-present, b3log.org
*
* 本文件属于 Sym 商业版的一部分,请仔细阅读项目根文件夹的 LICENSE 并严格遵守相关约定
*/
/**
* @fileoverview webpack ipfs.
*
* @author <a href="http://vanessa.b3log.org">Liyuan Li</a>
* @version 0.1.0.0, Jan 18, 2020
*/
const path = require('path')
const fs = require('fs')
const TerserPlugin = require('terser-webpack-plugin')
const {CleanWebpackPlugin} = require('clean-webpack-plugin')
const OptimizeCSSAssetsPlugin = require('optimize-css-assets-webpack-plugin')
const genSkinsEntries = () => {
const entries = {}
fs.readdirSync('./src/main/resources/skins').forEach(function (file) {
const jsPath = `./src/main/resources/skins/${file}`
try {
fs.statSync(`${jsPath}/js/common.js`)
entries[`skins/${file}/js/common`] = `${jsPath}/js/common.js`
} catch (e) {
}
try {
fs.statSync(`${jsPath}/css/base.scss`)
entries[`dist/${file}/base`] = `${jsPath}/css/base.scss`
} catch (e) {
}
})
return entries
}
module.exports = (env, argv) => {
return {
mode: argv.mode || 'development',
watch: argv.mode !== 'production',
stats: 'minimal',
output: {
filename: '[name].min.js',
path: path.resolve(__dirname, './src/main/resources'),
},
entry: Object.assign(genSkinsEntries(), {
'js/admin/admin': [
'./src/main/resources/js/admin/admin.js',
'./src/main/resources/js/admin/editor.js',
'./src/main/resources/js/admin/tablePaginate.js',
'./src/main/resources/js/admin/article.js',
'./src/main/resources/js/admin/comment.js',
'./src/main/resources/js/admin/articleList.js',
'./src/main/resources/js/admin/draftList.js',
'./src/main/resources/js/admin/pageList.js',
'./src/main/resources/js/admin/others.js',
'./src/main/resources/js/admin/linkList.js',
'./src/main/resources/js/admin/preference.js',
'./src/main/resources/js/admin/staticsite.js',
'./src/main/resources/js/admin/themeList.js',
'./src/main/resources/js/admin/pluginList.js',
'./src/main/resources/js/admin/userList.js',
'./src/main/resources/js/admin/categoryList.js',
'./src/main/resources/js/admin/commentList.js',
'./src/main/resources/js/admin/plugin.js',
'./src/main/resources/js/admin/main.js',
'./src/main/resources/js/admin/about.js'],
'js/common': './src/main/resources/js/common.js',
'js/page': './src/main/resources/js/page.js',
'dist/admin': './src/main/resources/scss/admin.scss',
'dist/base': './src/main/resources/scss/base.scss',
'dist/start': './src/main/resources/scss/start.scss',
}),
module: {
rules: [
{
test: /\.js/,
include: [
path.resolve(__dirname, './src/main/resources/js'),
path.resolve(__dirname, './src/main/resources/templates/skins'),
],
use: {
loader: 'babel-loader',
options: {
presets: ['@babel/preset-env'],
},
},
},
{
test: /\.scss$/,
include: [
path.resolve(__dirname, './src/main/resources'),
],
use: [
{
loader: 'file-loader',
options: {
name (file) {
const skins = file.split('skins')
if (skins.length === 2) {
return `skins/${skins[1].split('/')[1]}/css/[name].css`
} else {
return 'scss/[name].css'
}
},
},
},
{
loader: 'extract-loader',
options: {
url: false,
},
},
{
loader: 'css-loader', // translates CSS into CommonJS
options: {
url: false,
},
},
{
loader: 'postcss-loader',
options: {
ident: 'postcss',
plugins: () => [
require('autoprefixer')({grid: true, remove: false}),
],
},
},
{
loader: 'sass-loader', // compiles Sass to CSS
},
],
},
],
},
optimization: {
minimizer: [
new TerserPlugin({
cache: true,
parallel: true,
terserOptions: {
output: {
comments: false,
},
},
sourceMap: false,
extractComments: false,
}),
new OptimizeCSSAssetsPlugin({}),
],
},
plugins: [
new CleanWebpackPlugin({
cleanOnceBeforeBuildPatterns: [
path.join(__dirname, 'src/main/resources/dist')],
}),
],
}
}
This diff is collapsed.
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment