Last active
February 13, 2016 04:03
-
-
Save kitahashiryoichi/4ceb0ab836933caf3830 to your computer and use it in GitHub Desktop.
はてなブログ記事下関連記事
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<style> | |
.same-category-entry-summary { | |
color: #666; | |
} | |
a.same-category-entries-category-name, a.same-category-entries-category-name:visited { | |
color: inherit; | |
} | |
.same-category-entries-category-name:before { | |
content: "【"; | |
} | |
.same-category-entries-category-name:after { | |
content: "】"; | |
} | |
.same-category-entry-meta { | |
color: #CCC; | |
margin-top: 0.5em; | |
} | |
.same-category-entries-category-title{ | |
border-bottom: 1px solid #E6E6E6; | |
margin-bottom:5px; | |
font-size:15px; | |
} | |
.same-category-entries-list{ | |
list-style: outside none none; | |
padding-left: 0; | |
margin-bottom:0; | |
} | |
.same-category-entries-entry { | |
border-bottom: 0.1em solid #E6E6E6; | |
padding-left: 0; | |
margin: 1em 0em; | |
} | |
.same-category-entries-entry-thum{ | |
float:left; | |
margin: 8px; | |
} | |
.same-category-entries-entry-thum img{ | |
width: 70px; | |
height: 70px; | |
border-radius: 5px; | |
-webkit-border-radius: 5px; | |
-moz-border-radius: 5px; | |
border: 1px #E6E6E6 solid; | |
} | |
.same-category-entries-entry a{ | |
color: #333333; | |
position: relative; | |
display: inline-block; | |
width: 100%; | |
} | |
.same-category-entries-entry a:hover{ | |
color:#969696; | |
transition: .3s ease; | |
} | |
.same-category-entries-entry-title{ | |
color: #4eacd1; | |
text-decoration: none; | |
word-wrap: break-word; | |
word-break: break-word; | |
font-size: 13px; | |
} | |
.same-category-entries-entry-summary{ | |
margin: 0; | |
} | |
.same-category-entries-entry-date{ | |
color: #696969; | |
} | |
</style> | |
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js"></script> | |
<script> | |
$(document).ready(function(){ | |
/*関連コンテンツの制御*/ | |
var path = location.pathname;//2015 12/8 途中の修正でコードが抜けていました。 | |
//2015 11/5 , 11/19 修正 | |
//カテゴリ一覧と検索結果とTOPページに複数記事の場合は処理を行わない | |
if(path.indexOf("/archive") < 0 && path.indexOf("/search") < 0 && $('article').length <= 1 ){ | |
setTimeout(function(){ | |
/* 関連コンテンツ出力 */ | |
var maxEntries = 3; | |
var categorytags = []; | |
var category = $('.categories'); | |
if (category.size()) { | |
var categoryobjs = category.find('a'); | |
var categoryobjscount = categoryobjs.length; | |
for(var i=0 ; i < categoryobjscount; i++){ | |
//パンくずのTOPを除外 | |
if(categoryobjs.eq(i).text() != "トップ"){ | |
categorytags.push(categoryobjs.eq(i).text()); | |
} | |
} | |
//404エラー+プロフィール画面の場合 | |
}else{ | |
categorytags = ['Web','食べ歩き','フリーエンジニア']; | |
} | |
var origin = location.protocol + '//' + location.host; | |
var startFetchCategoryEntries = function (d, categories) { | |
d = d || $.Deferred(); | |
categories = categories || []; | |
var categoryTag = categorytags.shift(); | |
if (!categoryTag) { | |
d.resolve(categories); | |
return d; | |
} | |
var category = { | |
name: categoryTag, | |
entries: [] | |
}; | |
//カテゴリページを取得しタイトルとサムネイル画像とURLと概要文を取得 | |
$.ajax(origin + '/archive/category/' + encodeURIComponent(category.name)).done(function (feed) { | |
var sectionobj = $(feed).find('.entry-list > a'); | |
var sectioncount = sectionobj.length -1; | |
//ランダムに記事の番号を選ぶ | |
var sectionNolist =[]; | |
for(var ii=0 ; ii < 20; ii++){ | |
randomNumber = Math.floor( Math.random() * (sectioncount + 1) ); | |
if($.inArray(randomNumber, sectionNolist) == -1){ | |
sectionNolist.push(randomNumber); | |
} | |
} | |
var sectionNolistcount = sectionNolist.length; | |
for(var ii=0 ; ii < sectionNolistcount; ii++){ | |
var $feedEntry = sectionobj.eq(sectionNolist[ii]); | |
var entry = $feedEntry.find('.entry-title'); | |
var thum2 = $feedEntry.find('.thumb img').attr('src'); | |
if (thum2==null||thum2==undefined) thum2=""; | |
var desc = $feedEntry.find('.entry-content p'); | |
var summary = ""; | |
if(desc.text().length >0){ | |
var summary = $.trim(desc.text()); | |
summary = escapeHtml(summary); | |
} | |
var entry = { | |
title: $.trim(entry.text()), | |
url: $feedEntry.attr('href'), | |
thumnailurl: thum2, | |
summary: summary, | |
published: new Date($feedEntry.find('time').attr('datetime')) | |
}; | |
thiscontentstitle = $('.entry-title').find('a').attr('href'); | |
if (entry.url === thiscontentstitle) continue; | |
entry.url = entry.url + "?recommend=" + location.pathname; | |
category.entries.push(entry); | |
if (category.entries.length >= maxEntries && maxEntries !== -1) { | |
break; | |
} | |
}; | |
categories.push(category); | |
startFetchCategoryEntries(d, categories); | |
}).fail(function (xhr) { | |
(console.error || console.log).call(console, xhr); | |
}); | |
return d; | |
} | |
//関連コンテンツのhtml生成 | |
startFetchCategoryEntries().done(function (categories) { | |
html = '<div class="same-category-entries">'; | |
var categoriescount = categories.length; | |
var issmp = false; | |
if ($(window).width() < 480) { | |
var issmp = true; | |
} | |
for (var i=0; i< categoriescount; i++) { | |
categorydata = categories[i]; | |
if (categorydata.entries.length > 0) { | |
html = html + '<div class="same-category-entries-category">' | |
+'<h2 class="same-category-entries-category-title"><a class="same-category-entries-category-name" href="/category/' + categorydata.name + ' ">' + categorydata.name + '</a>カテゴリの他の記事</h2>' | |
+'<ul class="same-category-entries-list">'; | |
var categorydataentriescount = categorydata.entries.length; | |
for (var ii=0; ii< categorydataentriescount; ii++) { | |
entry = categorydata.entries[ii]; | |
html = html + '<li class="same-category-entries-entry"><a href="'+entry.url +'"><p class="same-category-entries-entry-thum" >'; | |
if (entry.thumnailurl.length > 0) { | |
html = html + '<img src ="'+ entry.thumnailurl +'"></p><p class="same-category-entries-entry-title" >'+ entry.title +'</p>'; | |
}else{ | |
html = html + '</p><p class="same-category-entries-entry-title" >'+ entry.title +'</p>'; | |
} | |
if(!issmp){ | |
html = html + '<p class="same-category-entries-entry-summary" >'+ entry.summary +'</p>'; | |
} | |
publishedYear = entry.published.getFullYear(); | |
publishedMonth = entry.published.getMonth()+1; | |
publishedDate = entry.published.getDate(); | |
html = html + '</a></li>'; | |
} | |
html = html + '</ul></div>'; | |
} | |
} | |
html = html + '</div>'; | |
var $html = $($.parseHTML(html)); | |
$(".entry-content").after($html); | |
}); | |
},1000); | |
} | |
}); | |
var str = '& < > ` " ' + "'"; | |
var escapeHtml = (function (String) { | |
var escapeMap = { | |
'&': '&', | |
"'": ''', | |
'`': '`', | |
'"': '"', | |
'<': '<', | |
'>': '>' | |
}; | |
var escapeReg = '['; | |
var reg; | |
for (var p in escapeMap) { | |
if (escapeMap.hasOwnProperty(p)) { | |
escapeReg += p; | |
} | |
} | |
escapeReg += ']'; | |
reg = new RegExp(escapeReg, 'g'); | |
return function escapeHtml (str) { | |
str = (str === null || str === undefined) ? '' : '' + str; | |
return str.replace(reg, function (match) { | |
return escapeMap[match]; | |
}); | |
}; | |
}(String)); | |
</script> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment