<?xml version="1.0" encoding="utf-8"?>
 <feed xmlns="http://www.w3.org/2005/Atom" xml:lang="ja">
 <title type="text">ppBlog official</title>
 <subtitle type="text">ppBlog official: Recent Entries</subtitle>
 <link rel="alternate" type="text/html" href="http://p2b.jp/" />
 <link rel="self" type="application/atom+xml" href="http://p2b.jp/feeds/atom1.0.xml" />
 <id>http://p2b.jp/</id>
 <author>
  <name>martin</name>
 </author>
 <logo>http://p2b.jp/Images/logo.png</logo>
 <updated>2012-01-08T14:53:52Z</updated>
 <generator uri="http://p2b.jp/" version="1.9.0b">ppBlog ver.1.9.0b</generator> 
 <rights>copyright (c) 2012 p2b.jp</rights> 

 <entry>
 <title type="text">頌春2012</title>
 <link rel="alternate" type="text/html" href="http://p2b.jp/1326001540" />
 <author>
   <name>martin</name>
 </author>
 <id>http://p2b.jp/1326001540</id>
 <category term="その他" label="その他" scheme="http://p2b.jp/category/others/" xml:lang="ja" />
 <summary type="text" xml:lang="ja">　こんにちは、martinです。日本に帰国して1年が経ちました。昨年は２月から新...</summary>
 <content type="xhtml" xml:lang="ja">
  <div xmlns="http://www.w3.org/1999/xhtml">
   <p>　こんにちは、martinです。日本に帰国して1年が経ちました。昨年は２月から新しい職場で働き始めたり、9月６日に第１子が生まれたりとバタバタな一年でして、まるでppBlogの開発・サポートが出来ませんでしたが、今年はなるべく時間を作ってppBlogをいじれたらと思っています。</p>
<p>　世界中の皆さんにとって、良い年でありますように。</p>

  </div> 
 </content>
 <updated>2012-01-08T14:45:40+09:00</updated>
 <published>2012-01-08T14:45:40+09:00</published>
 </entry>

 <entry>
 <title type="text">静的モードでのリンク表示を変えてみる</title>
 <link rel="alternate" type="text/html" href="http://p2b.jp/1320633953" />
 <author>
   <name>martin</name>
 </author>
 <id>http://p2b.jp/1320633953</id>
 <category term="開発日誌" label="開発日誌" scheme="http://p2b.jp/category/developement/" xml:lang="ja" />
 <summary type="text" xml:lang="ja">　久しぶりのカキコ。　静的リンクでの挙動を変えています。URLのパスに日付情報な...</summary>
 <content type="xhtml" xml:lang="ja">
  <div xmlns="http://www.w3.org/1999/xhtml">
   <p>　久しぶりのカキコ。</p>
<p>　静的リンクでの挙動を変えています。URLのパスに日付情報などを含ませるように。まだ、いじっている段階なので、色々と不具合があるだろうけれど、まぁ気にしないと。</p>
<p>　日付情報がある以外には、現状、PermaLink用の英数文字からなる記事タイトルを別に指定できたのですが、これはそのまま取っておくとして、そうでない場合は、記事のタイトルがそのままブラウザのアドレスバーに表示されるような感じにしてます（静的リンクが有効な場合ですが）。今時のブラウザならエンコードされた長ったらしい英数字ではなくて日本語文字列をそのまま表示してくれるので。</p>

  </div> 
 </content>
 <updated>2011-11-07T11:45:53+09:00</updated>
 <published>2011-11-07T11:45:53+09:00</published>
 </entry>

 <entry>
 <title type="text">記事投稿時のスピードアップ</title>
 <link rel="alternate" type="text/html" href="http://p2b.jp/1301154201" />
 <author>
   <name>martin</name>
 </author>
 <id>http://p2b.jp/1301154201</id>
 <category term="アップデート" label="アップデート" scheme="http://p2b.jp/category/update/" xml:lang="ja" />
 <summary type="text" xml:lang="ja">　こんばんは、martinです。久しぶりの更新です。寒い日が続きなかなか暖かくな...</summary>
 <content type="xhtml" xml:lang="ja">
  <div xmlns="http://www.w3.org/1999/xhtml">
   <p>　こんばんは、martinです。久しぶりの更新です。寒い日が続きなかなか暖かくなりませんが、春はすぐそこだと思います。今は横浜に住んでいますが、余震はここ１－２日はちょっと落ち着いてきた感じがします（油断は出来ませんが）。原発問題がはやく解決されること、そして被災地の一日でも早い復興をお祈りしつつ。</p>
<p>　さてマイナーアップデートです。フォーラムの方で、記事の更新にやたらと時間がかかるというご報告があり、調べてみると、カテゴリー数が多いとその傾向が顕著になることが判明しました。記事投稿時の処理でカテゴリー毎の記事数を更新するというのがあるのですが、その処理がボトルネックになっていました。これを解決するために、<b>category_id.ini.php</b>という定義ファイルを新たに<b>owner</b>ディレクトリに作成するようにして、そこからカテゴリー別の記事情報を取得するようにしました。</p>
<p>　<b>utils_admin.php</b>と<b>cache.php</b>を更新すればアップデートされます。上記category_id.ini.phpファイルはなければ記事投稿時に自動的に作成されます。初回時は、このファイルを作成するのに時間がかかりますが、一度作成されると次回以降はスムーズに記事投稿処理が進むと思います。</p>
<p>　この２つのファイルを添付しておきます。<a href="http://p2b.jp/index.php?mode=download&amp;aim=1301154201_cache.php" title="ダウンロード:8.6 KB">[ファイル1301154201_cache.php]</a><a href="http://p2b.jp/index.php?mode=download&amp;aim=1301154201_utils_admin.php" title="ダウンロード:38.1 KB">[ファイル1301154201_utils_admin.php]</a></p>

  </div> 
 </content>
 <updated>2011-03-27T00:43:21+09:00</updated>
 <published>2011-03-27T00:43:21+09:00</published>
 </entry>

 <entry>
 <title type="text">カテゴリー定義ファイルのバックアップ</title>
 <link rel="alternate" type="text/html" href="http://p2b.jp/1290829896" />
 <author>
   <name>martin</name>
 </author>
 <id>http://p2b.jp/1290829896</id>
 <category term="ppBlog Tips" label="ppBlog Tips" scheme="http://p2b.jp/category/ppBlog–Tips/" xml:lang="ja" />
 <summary type="text" xml:lang="ja">　こんばんは、martinです。久しぶりのカキコです。本帰国前にてブログ開発の時...</summary>
 <content type="xhtml" xml:lang="ja">
  <div xmlns="http://www.w3.org/1999/xhtml">
   <p>　こんばんは、martinです。久しぶりのカキコです。本帰国前にてブログ開発の時間が殆ど取れていませんが、何とか年内に最新版のリリースにこぎつければと思っています。</p>
<p>　ところで、<a href="http://forum.p2b.jp/index.php?mode=box&amp;UID=4813">フォーラム</a>の方で、「カテゴリーが壊れた」という報告をいただきました。サブカテゴリーの追加をしていたら、既存のカテゴリーが壊れたとのご報告。ppBlogでは、現行までのバージョンにおいて、カテゴリー定義ファイルの自動バックアップを取る設計には<em>なっていません</em>。</p>
<p>　今のところ、はっきりとした原因がつかめていませんが、カテゴリー数が多いppBlog使いの方は(そうでない方も)、定義ファイルのバックアップを手動で取っておくことを強くオススメします。カテゴリーの定義ファイルは、<b>owner</b>ディレクトリにある<b>category.ini.php</b>です。まさかの時に備え、これをFTPソフトなどでお手元にダウンロードしておきましょう。</p>
<p>　次期バージョンでは、カテゴリーの定義ファイルは、自動でバックアップするような設計にしたいと思います。</p>

  </div> 
 </content>
 <updated>2010-11-27T12:51:36+09:00</updated>
 <published>2010-11-27T12:51:36+09:00</published>
 </entry>

 <entry>
 <title type="text">photoeffect.jsの更新</title>
 <link rel="alternate" type="text/html" href="http://p2b.jp/1287096850" />
 <author>
   <name>martin</name>
 </author>
 <id>http://p2b.jp/1287096850</id>
 <category term="アップデート" label="アップデート" scheme="http://p2b.jp/category/update/" xml:lang="ja" />
 <summary type="text" xml:lang="ja">　こんばんは、martinです。久しぶりの更新です。アップした写真をお洒落に見せ...</summary>
 <content type="xhtml" xml:lang="ja">
  <div xmlns="http://www.w3.org/1999/xhtml">
   <p>　こんばんは、martinです。久しぶりの更新です。アップした写真をお洒落に見せるスクリプトがIE9βでは動かないとのご指摘があったので、IE9βでも動くようにアップデートしました。既存のものをそのまま置き換えるだけで良いと思います。</p>
<p>　IE9βでは、念願のCANVAS要素がサポートされています。なので、IE8以下では従来のようにVMLを利用、IE9以上であれば他のモダンブラウザと同じようにCANVAS要素で描画するようにしています。</p>
<p><img src="http://p2b.jp/PIX/s2/1287096850_IMG_0906.CR2.jpg" alt="IMG_0906" width="500" height="333" title="モネの睡蓮の池。ジヴェルニーにて。" /><img src="http://p2b.jp/PIX/s2/1287096850_IMG_0954.CR2.jpg" alt="IMG_0954" width="500" height="333" title="女性がダンスしているようなシルエット。" /><img src="http://p2b.jp/PIX/s2/1287096850_IMG_0955.jpg" alt="IMG_0955" width="500" height="334" title="植物ってほんと知らない名前ばかり" /><img src="http://p2b.jp/PIX/s2/1287096850_IMG_0929.CR2.jpg" alt="IMG_0929" width="500" height="333" title="ミニ唐辛子みたいな花。大きさは1-2cmってところ。" /><img src="http://p2b.jp/PIX/s2/1287096850_IMG_0960.CR2.jpg" alt="IMG_0960" width="500" height="333" title="同じ赤系でも色々ある。" /></p>
<p>　最新版のphotoeffect.jsを添付しておきます。<a href="http://p2b.jp/index.php?mode=download&amp;aim=1287096850_photoeffect.js" title="ダウンロード:5.5 KB">[ファイル1287096850_photoeffect.js]</a></p>

  </div> 
 </content>
 <updated>2010-10-15T07:54:10+09:00</updated>
 <published>2010-10-15T07:54:10+09:00</published>
 </entry>

 <entry>
 <title type="text">記事アクセスランキングで勢いランキング</title>
 <link rel="alternate" type="text/html" href="http://p2b.jp/1282945798" />
 <author>
   <name>martin</name>
 </author>
 <id>http://p2b.jp/1282945798</id>
 <category term="開発日誌" label="開発日誌" scheme="http://p2b.jp/category/developement/" xml:lang="ja" />
 <summary type="text" xml:lang="ja">　こんばんは、martinです。ppBlogでは、アクセス解析画面に「記事アクセ...</summary>
 <content type="xhtml" xml:lang="ja">
  <div xmlns="http://www.w3.org/1999/xhtml">
   <p>　こんばんは、martinです。</p>
<p>ppBlogでは、アクセス解析画面に「記事アクセスランキング」が組み込まれていますが、最新版(まだ配布していませんが)ではこれに「<strong>勢いランキング</strong>」も追加しました。<img src="http://p2b.jp/PIX/s2/1282945798_ranking.jpg" alt="ranking" width="500" height="239" /></p>
<p>　従来のアクセスランキングでは、記事のレビュー数のみでの評価なので古いエントリーの記事が上位に来やすいです。これに対して、「勢いランキング」は、理論上は、一日あたりのレビュー数（平均）になるので、最近のエントリーでも上位に来ることが出来、なんとなく流行のトレンドみたいなものが見えてきて、興味深いです。</p>
<p>　このサイトのサイドバーのメニューに「<a rel="internal" href="http://p2b.jp/pages/hot-articles-ranking/">人気記事ランキング</a>」があります。このリンクでも、ほぼ同じ内容のものを見ることが出来るので、興味ある方はどうぞ。タブ切り替えにしてみました。限られたスペースで、多くの情報を見せることができるので、使いどころによっては良いですね。</p>

  </div> 
 </content>
 <updated>2010-08-28T06:49:58+09:00</updated>
 <published>2010-08-28T06:49:58+09:00</published>
 </entry>

 <entry>
 <title type="text">FirefoxでのouterHTML</title>
 <link rel="alternate" type="text/html" href="http://p2b.jp/201008-outerHTML-in-Firefox" />
 <author>
   <name>martin</name>
 </author>
 <id>http://p2b.jp/201008-outerHTML-in-Firefox</id>
 <category term="開発日誌" label="開発日誌" scheme="http://p2b.jp/category/developement/" xml:lang="ja" />
 <category term="開発日誌/JavaScript" label="開発日誌/JavaScript" scheme="http://p2b.jp/category/developement//" xml:lang="ja" />
 <summary type="text" xml:lang="ja">　innerHTMLに比べると、outerHTMLを使う頻度はぐっと少ない。現状...</summary>
 <content type="xhtml" xml:lang="ja">
  <div xmlns="http://www.w3.org/1999/xhtml">
   <p>　<b>innerHTML</b>に比べると、<b>outerHTML</b>を使う頻度はぐっと少ない。現状、<b>IE</b>と <b>Safari</b>&amp;#44; <b>Chrome</b>&amp;#44; <b>Opera</b>が対応していて、未対応は<b>Firefox</b>だけ。使用頻度が低いメソッドに対して、Firefox向けに、長々しいスクリプトを書くのもどうかねぇ、と思ってググってみたところ、<a href="http://stackoverflow.com/questions/1700870/how-do-i-do-outerhtml-in-firefox/1701117#1701117">ナイスな投稿がありました</a>。</p>
<pre>sOuterHTML = new XMLSerializer().serializeToString(oElement);</pre>
<p>　確かに、これは理にかなってますね。outerHTML自体は、値の取得だけでなくて、設定も出来るんだけど、そういう場面はまずないだろうから、このgetterだけで十分ですね。</p>
<pre>&amp;lt;div id="Here"&amp;gt;Hello&amp;#44; &amp;lt;strong&amp;gt;really strange&amp;lt;/strong&amp;gt; World !&amp;lt;/div&amp;gt;</pre>
対して、<b>innerHTML</b>なら<pre>Hello&amp;#44; &amp;lt;strong&amp;gt;really strange&amp;lt;/strong&amp;gt; World !</pre>
が返されるし、<b>outerHTML</b>なら、<pre>&amp;lt;div id="Here"&amp;gt;Hello&amp;#44; &amp;lt;strong&amp;gt;really strange&amp;lt;/strong&amp;gt; World !&amp;lt;/div&amp;gt;</pre>
が返される。実装例としては、<pre>
function getOuterHTML(e) {
 if(e.outerHTML){ // IE&amp;#44; Webkit&amp;#44; Opera
  return e.outerHTML;
 } else { // Firefox (&amp;#44; Webkit&amp;#44; Opera)
  return  new XMLSerializer().serializeToString(e);
 }
};
</pre>
あるいは、短く<pre>
function getOuterHTML(e) {
  return e.outerHTML &amp;#124;&amp;#124; new XMLSerializer().serializeToString(e);
};
</pre>
とか。<div style="border-left: solid 4pt gold; margin: 2em; padding: 1em;"<button onclick="alert(getOuterHTML(this.nextSibling))">outerHTML</button><div id="Here">Hello&amp;#44; <strong>really strange</strong> World !</div>
</div><p>　実際には、Firefoxだと <b>xmlns="http://www.w3.org/1999/xhtml"</b> という属性が付加されるので、気になるようなら適宜省けば良いでしょう。</p>

  </div> 
 </content>
 <updated>2010-08-25T01:25:47+09:00</updated>
 <published>2010-08-25T01:25:47+09:00</published>
 </entry>

 <entry>
 <title type="text">ひとつの記事に複数の拡大画像がある場合</title>
 <link rel="alternate" type="text/html" href="http://p2b.jp/1282574381" />
 <author>
   <name>martin</name>
 </author>
 <id>http://p2b.jp/1282574381</id>
 <category term="開発日誌" label="開発日誌" scheme="http://p2b.jp/category/developement/" xml:lang="ja" />
 <category term="開発日誌/JavaScript" label="開発日誌/JavaScript" scheme="http://p2b.jp/category/developement//" xml:lang="ja" />
 <summary type="text" xml:lang="ja">　簡易画像ギャラリーのテスト。タイトルのような場合、ひとつの画像をクリックして、...</summary>
 <content type="xhtml" xml:lang="ja">
  <div xmlns="http://www.w3.org/1999/xhtml">
   <p>　簡易画像ギャラリーのテスト。タイトルのような場合、ひとつの画像をクリックして、拡大表示にした際に、ポップアップした画面の右端に矢印が表示される。それをクリックすると、同じ記事に含まれる次の画像を読み込む仕様。</p>
<p>　特に画像キャプションが付いている場合は、それも表示されるので、写真を主体に見せたい場合なんかには、好都合だと思います。</p>
<p><img src="http://p2b.jp/PIX/s2/1282574381_IMG_4128.jpg" alt="IMG_4128" width="500" height="334" title="サンチャゴ・コンポステーラへの道　その１" /><img src="http://p2b.jp/PIX/s2/1282574381_IMG_4095.jpg" alt="IMG_4095" width="500" height="334" title="サンチャゴ・コンポステーラへの道　その２" /><img src="http://p2b.jp/PIX/s2/1282574381_IMG_4156.jpg" alt="IMG_4156" width="500" height="334" title="サンチャゴ・コンポステーラへの道　その３" /><img src="http://p2b.jp/PIX/s2/1282574381_IMG_4078.jpg" alt="IMG_4078" width="500" height="334" title="サンチャゴ・コンポステーラへの道　その４" /></p>

  </div> 
 </content>
 <updated>2010-08-23T23:39:41+09:00</updated>
 <published>2010-08-23T23:39:41+09:00</published>
 </entry>

 <entry>
 <title type="text">画像なしで吹き出しみたいなもの</title>
 <link rel="alternate" type="text/html" href="http://p2b.jp/201008-cute-baloon-without-images" />
 <author>
   <name>martin</name>
 </author>
 <id>http://p2b.jp/201008-cute-baloon-without-images</id>
 <category term="WEB DESIGN" label="WEB DESIGN" scheme="http://p2b.jp/category/web-design/" xml:lang="ja" />
 <category term="WEB DESIGN/CSS" label="WEB DESIGN/CSS" scheme="http://p2b.jp/category/web-design//" xml:lang="ja" />
 <summary type="text" xml:lang="ja">　この頃は、リッチなツールチップ（バルーンヘルプ）が増えてきたように思います。中...</summary>
 <content type="xhtml" xml:lang="ja">
  <div xmlns="http://www.w3.org/1999/xhtml">
   <p>　この頃は、リッチなツールチップ（バルーンヘルプ）が増えてきたように思います。中には、派手すぎて逆に分かりづらかったりするものもありますが、まぁそういうので遊んでみるのもたまには良いかなと思います。</p>
<p>　自分なりに実装するとしたら、どのようなものが良いか考えてみました。</p>
<div style="width: 80%; margin: 2em auto; border-left: solid 4pt gold; padding-left: 1em;"><ol>
<li> シンプルであること</li>
<li> 軽快であること</li>
<li> 吹き出しっぽく見せたいな</li>
<li> 角丸コーナーが良いな</li>
<li> 出来ればドロップシャドウぐらいは付けたい</li>
</ol></div>
<p>という感じで、矛盾をはらんだリストですが、これを実装するにはどんなが良いか考えてみました。</p>
<div style="width: 80%; margin: 2em auto; border-left: solid 4pt gold; padding-left: 1em;"><ol>
<li> シンプルであること　→　<span style="color:maroon;">画像ファイルを使わずにやれるか？</span></li>
<li> 軽快であること　→　<span style="color:maroon;">フェードなどのエフェクトはなしで</span></li>
<li> 吹き出しっぽく見せたいな　→　<span style="color:maroon;">あのニョロっとした尻尾みたいなのをどうやって作るか？</span></li>
<li> 角丸コーナーが良いな　→　<span style="color:maroon;">CSS3に対応していないIEはどうするか？</span></li>
<li> 出来ればドロップシャドウぐらいは付けたい　→　<span style="color:maroon;">同上</span></li>
</ol></div>
<p>　いつものように<b>CSS3</b>のサポートが貧弱な<b>IE</b>が足かせとなります。でも、IEでも同じように見せるために四苦八苦するのがweb開発の面白いところでしょう。画像を使わずに、角丸コーナーやドロップシャドウ効果を付けるには、IEのVMLやfilter機能を使うのが良いでしょう。</p>
<p>　角丸コーナーは、[g]VMLのroundrect[/g]を使って実現できます [参考記事： <a href="http://p2b.jp/200903-rounded-corner">VMLやSVGを用いた角丸コーナー</a> ]。ドロップシャドウは、IEのフィルター機能のひとつである<b>Blur</b>を使うことでOKです[参考記事：<a href="http://p2b.jp/200909-IE-CSS3-Dropshadow"> IEでCSS3のドロップシャドウを使いたい</a>]。問題は、吹出しには必須とも言える、あのしっぽみたいなやつですが、これはCSSのボーダー属性を使うことで可能です。トリッキーな（でも正統派）手法ですが、これに関して、レファレンスともいうべき<a href="http://www.howtocreate.co.uk/tutorials/css/slopes">サイトがあります</a>。このサイトは、以前から知っていていつか利用しようと思っていたんですが、ようやくお世話になる時が来ました[にこっ/]</p>
<p>　とりあえず、試験的なモデル（プロトタイプ）を作ってみて、それが意図したように実現可能であれば、それを自動化すべくスクリプト化という流れが良いでしょう。プロトタイプが、よさげな感じに仕上がったのでスクリーンショットをば。<img src="http://p2b.jp/PIX/s2/1282064255_cutePop.jpg" alt="cutePop" width="485" height="500" title="なかなか良い感じでは。FirefoxですがIEでもほぼ同じ。" /></p>
　<p style="margin: 1em auto 2em; padding: 0.5em; border: 2pt solid gold; width: 280px;"><a href="http://p2b.jp/demo/cutePop.html">実際のデモのページはこちら。</a></p>
　で、かなり手抜きですが、これを元にスクリプト実装したのが以下。<p style="margin: 1em auto 2em; padding: 0.5em; border: 2pt solid gold; width: 280px;"><a href="http://p2b.jp/demo/cuteTooltip.html">実際のデモのページはこちら。</a></p>
<p>　ppBlogで、これらをどれくらい採り入れるかは未定ですが、引き出しは多ければ多いほど良いでしょう[署名/]</p>

  </div> 
 </content>
 <updated>2010-08-18T01:57:35+09:00</updated>
 <published>2010-08-18T01:57:35+09:00</published>
 </entry>

 <entry>
 <title type="text">表示オンオフ制御周りの改良</title>
 <link rel="alternate" type="text/html" href="http://p2b.jp/1281709863" />
 <author>
   <name>martin</name>
 </author>
 <id>http://p2b.jp/1281709863</id>
 <category term="開発日誌" label="開発日誌" scheme="http://p2b.jp/category/developement/" xml:lang="ja" />
 <category term="開発日誌/JavaScript" label="開発日誌/JavaScript" scheme="http://p2b.jp/category/developement//" xml:lang="ja" />
 <summary type="text" xml:lang="ja">　ppBlogのoParts.jsにtweenアニメーションみたいな動きを取り入...</summary>
 <content type="xhtml" xml:lang="ja">
  <div xmlns="http://www.w3.org/1999/xhtml">
   <p>　ppBlogのoParts.jsにtweenアニメーションみたいな動きを取り入れてみました。まだ試作段階ですが、テーマ：Basicであれば、左側のサイドバーの展開や、ソーシャルブックアイコンで、ちょっとした動きをみることが出来ます。</p>
<p>　写真のポップアップにも。<img src="http://p2b.jp/PIX/s2/1281709863_IMG_0285.CR2.jpg" alt="IMG_0285" width="500" height="333" title="モン・サン・ミシェル" /></p>

  </div> 
 </content>
 <updated>2010-08-13T23:31:03+09:00</updated>
 <published>2010-08-13T23:31:03+09:00</published>
 </entry>

</feed>
