<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<script type="text/javascript" src="/js/underscore.js"></script>
<script type="text/javascript">
jQuery( function () {
/* 記事のオブジェクト グローバル変数 */
allArticles = [];
/* 各ブログのJSONを指定。URL に"_embed"で写真データを要求、"per_page=3" で記事を3つ取得*/
/* 1番目のWordPress 記事を取得 */
getBlogInfo("http://www.sakuranomichi.jp/wordpress/wp-json/wp/v2/posts?_embed&per_page=2", "リボン日記2記事");
/* 2番目のWordPress 記事を取得して書き出し(複数ないので、同じブログを流用) */
getBlogInfo("http://www.sakuranomichi.jp/wordpress/wp-json/wp/v2/posts?_embed&per_page=4", "リボン日記4記事", true);
/* JSON を取得して、ブログ最新記事を変数に格納 */
function getBlogInfo(url, blog_name, display_b) {
/* 各WordPress のJSON を読み込んで、記事を表示する*/
jQuery.getJSON( url, function(results) {
/* 取得した記事をオブジェクトに格納する */
jQuery.each(results, function(i, item) {
var date_data = new Date(item.date); /* 記事の日付を取得 */
var year = date_data.getFullYear();
var month = date_data.getMonth() + 1;
var day = date_data.getDate();
var title = item.title.rendered; /* 記事タイトル */
var link = item.link; /* 記事URL */
var date = year + '年' + month + '月' + day + '日'; /* 表示用日付 */
var datetime = year + '-'+ addzero(month) + '-' + addzero(day); /* time タグのdatetime 値用日付 */
var datenum = Number(year + addzero(month) + addzero(day)); /* ソート用の日付を数値で取得 */
/* 記事アイキャッチ画像の取得*/
var thum
if (item._embedded["wp:featuredmedia"]) {
thum = item._embedded["wp:featuredmedia"][0].media_details.sizes.thumbnail.source_url
} else {
thum = "/images/basic/logo.jpg"; /* 代替画像 */
}
addData = {
title: title,
link: link,
thum: thum,
datetime: datetime,
datenum: datenum,
date : date,
name : blog_name
}
allArticles.push(addData);
});
/* ブログデータを非同期で最後まで取得したら、記事を表示する */
if (display_b) {
/* 2秒の遅延動作で、各店のJSON 読み込み時間差をなくす*/
setTimeout(function(){
/* allArticles の参照が早いと、ブログの読み込みが間に合わない時がある */
/* 日付でソート */
allArticles = _.chain(allArticles).sortBy( function(item) { return -item.datenum;}).value();
showBlogInfo(); /* 記事データを作成 */
}, 2000);
}
});
}
function showBlogInfo() {
/* 記事データを作成 */
var article = "";
/* 配列から、日付でソートされた記事データを順に取り出す */
for (var ij in allArticles) {
article += '<div><a href="'+
allArticles[ij].link + '" target="_blank">' +
'<div><img src="' +
allArticles[ij].thum + '" alt="' + allArticles[ij].title + '"></div>' +
'<p><time datetime="' +
allArticles[ij].datetime + '">' +
allArticles[ij].date + '</time></p>' +
'<p">' +
allArticles[ij].title + '</p>' + '<p>' +
allArticles[ij].name + '</p></a></div>';
}
/* 記事をまとめて表示 */
/* 記事の書き出し */
jQuery(".p-article__main").append(article);
}
//数値が一桁だとゼロを足す
function addzero(num) {
if (num < 10) {
num = "0" + String(num);
} else {
num = String(num);
}
return num;
}
} );
</script>
