前回途中まで作った
ほげ山くん：先輩！
くれま先輩：だね。2009年3月18日に、
ほげ山くん：今回はあっという間でしたねぇ。前にも話題に出たMotionが使えるようになったんですよね？
くれま先輩：そうそう！
- 【参考ページ】
- 【Movable Type 4.
25公開】 Action Streamをブログに追加して楽しもう: 世界中の1％の人々へ
http://www. dakiny. com/ archives/ mt42/ movable_ type_ 425action_ stream/ - Movable Type 4.
25 出荷開始 | MovableType. jp
http://www. movabletype. jp/ blog/ movable_ type_ 425. html
ページを分割するために必要な手順を確認
くれま先輩：っじゃ、
- 「検索結果」
テンプレート内に、 必要な記述を追加する - デフォルトのテンプレートセットからmt.
jsを持ってくる - デフォルトの
「検索結果」 テンプレートから、 必要なJavaScriptをとってくる - ヘッダ領域の検索フォームにCGIに渡す引数を足す
ほげ山くん：了解です！
「検索結果」テンプレート内に、必要な記述を追加する
ほげ山くん：では、
くれま先輩：足す部分が多いので、
<meta http-equiv="Content-Script-Type" content="text/javascript" />
<script type="text/javascript" src="<mt:BlogURL />mt.js"></script>
<mt:Include module="ページ分割用Javascript" />ほげ山くん：あれ？
くれま先輩：ごめんね…。あの時は、
ほげ山くん：ふーん。分りました。あと、
くれま先輩：うん。それはこれから作るからね。次は、
<div id="search-results">
<mt:SetVarTemplate id="search_results" name="search_results">
<mt:SearchResults>
<mt:BlogResultHeader>
<span id="current-page" class="hidden"><mt:CurrentPage /></span>
<h1>「<mt:SearchString />」での検索結果</h1>
</mt:BlogResultHeader>
<div class="serchResult">
<h3><a href="<mt:EntryLink />"><mt:EntryTitle /></a></h3>
<mt:SetVarBlock name="entry_category"><mt:EntryCategory></mt:SetVarBlock>
<mt:If name="entry_category" eq="最新情報">
<p><mt:EntryBody words="50" /></p>
<mt:Else>
<dl>
<dt>著者名</dt>
<dd><mt:author_name /></dd>
<dt>発売日</dt>
<dd><mt:release_date /></dd>
<dt>対象年齢</dt>
<dd><mt:readers_age /></dd>
<dt>版型</dt>
<dd><mt:book_size /></dd>
<dt>説明</dt>
<dd><mt:EntryBody words="50" /></dd>
</dl>
<p><mt:coverAsset><a href="<mt:EntryLink />"><img src="<mt:AssetThumbnailURL width="100" />"alt="<mt:EntryTitle />" title="<mt:EntryTitle />" /></a></mt:coverAsset></p>
</mt:If>
<!-- end div.serchResult --></div>
<mt:SearchResultsFooter>
<div class="content-nav">
<mt:IfPreviousResults><a href="<mt:PreviousLink />" rel="prev" onclick="return swapContent(-1);">< 前</a> </mt:IfPreviousResults><mt:PagerBlock><mt:IfCurrentPage><mt:Var name="__value__" /><mt:Else><a href="<mt:PagerLink />"><mt:Var name="__value__" /></a></mt:IfCurrentPage><mt:Unless name="__last__"> </mt:Unless></mt:PagerBlock><mt:IfMoreResults> <a href="<mt:NextLink />" rel="next" onclick="return swapContent();">次 ></a></mt:IfMoreResults>
<!-- end div.content-nav --></div>
</mt:SearchResultsFooter>
</mt:SearchResults>
</mt:SetVarTemplate>
<mt:Var name="search_results" />
<!-- end div#search-results --></div>ほげ山くん：長いですね！！！
くれま先輩：<div id="search-results">はJavaScriptのソースからDOM要素を取得するために必要なので足しているんだよ。<span id="current-page" class="hidden"><mt:CurrentPage /></span>も記述しないとAjaxによる動作ができないので、
ほげ山くん：後は、
くれま先輩：mt:SearchResultsFooterの中身は、
ほげ山くん：なるほど、
くれま先輩：<mt:IfPreviousResults>は、
ほげ山くん：1 2 3 4…っていう数字が出されてる部分ですか？
くれま先輩：そうよ。その数字を出力するのは、
ほげ山くん：<mt:Unless name="__last__">の部分っていうのは、
くれま先輩：そうだね。
ほげ山くん：なるほど、
くれま先輩：うんうん。後は
ほげ山くん：はーい。
くれま先輩：最後に、
<mt:Include module="ページ分割用Javascript002" />ほげ山くん：できましたー。
くれま先輩：はい、
デフォルトのテンプレートセットからmt.jsを持ってくる
ほげ山くん：次は
くれま先輩：うん、
ほげ山くん：新規のブログを作る…。えーっと、
くれま先輩：ブログの名前とサイトURL＋サイトパスのディレクトリ名は、
ほげ山くん：はいー。テンプレートセットは
くれま先輩：そうしたら、
ほげ山くん：すごく長いソースが入ってますね…。
くれま先輩：ここは詳しく解説しないので、
ほげ山くん：戻りました。
くれま先輩：そうしたら、
デフォルトの「検索結果」テンプレートから、必要なJavaScriptをとってくる
ほげ山くん：デフォルトの
くれま先輩：うん。
<script type="text/javascript">
/* <![CDATA[ */
var user = <$mt:UserSessionState$>;
<mt:IfMoreResults>
function getResults(page) {
page = parseInt(page);
if (timer) window.clearTimeout(timer);
var xh = mtGetXmlHttp();
if (!xh) return false;
var res = results[page];
if (!res) return;
var url = res['next_url'];
if (!url) return;
xh.open('GET', url + '&format=js', true);
xh.onreadystatechange = function() {
if ( xh.readyState == 4 ) {
if ( xh.status && ( xh.status != 200 ) ) {
// error - ignore
} else {
try {
var page_results = eval("(" + xh.responseText + ")");
if ( page_results['error'] == null )
results[page + 1] = page_results['result'];
} catch (e) {
}
}
}
};
xh.send(null);
}
function swapContent(direction) {
if ( direction == undefined ) direction = 1;
var page_span = document.getElementById('current-page');
if (!page_span) return true;
var next_page = direction + parseInt(page_span.innerHTML);
var res = results[next_page];
if (!res) return true;
var content = res['content'];
if (!content) return true;
var div = document.getElementById('search-results');
if (!div) return true;
div.innerHTML = content;
timer = window.setTimeout("getResults(" + next_page + ")", 1*1000);
window.scroll(0, 0);
return false;
}
<mt:Else><mt:IfPreviousResults>
function swapContent(direction) {
return true;
}</mt:IfPreviousResults>
</mt:IfMoreResults>
/* ]]> */
</script><mt:Ignore>Used with the ajax search capability of the new search class</mt:Ignore>
<mt:IfMoreResults>
<script type="text/javascript">
<!--
var div = document.getElementById('search-results');
var results = {
'<$mt:CurrentPage$>': {
'content': div.innerHTML,
'next_url': '<$mt:NextLink$>'
}
};
var timer = window.setTimeout("getResults(" + <$mt:CurrentPage$> + ")", 1*1000);
//-->
</script>
</mt:IfMoreResults>ほげ山くん：あぁ、
くれま先輩：うん、
ヘッダ領域の検索フォームにCGIに渡す引数を足す
くれま先輩：最後に、
ほげ山くん：しましたー。
くれま先輩：そうしたら、
<input type="hidden" name="limit" value="：<mt:SearchMaxResults />" />ほげ山くん：mt:SearchMaxResultsって、
くれま先輩：検索で返される結果の最大数を出力するタグなのよ。
ほげ山くん：なるほど。その最大値って、
くれま先輩：環境設定ファイル
ほげ山くん：今日の作業で、
くれま先輩：うん、