<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
	xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
	>

<channel>
	<title>ピクスログ &#187; javascript</title>
	<atom:link href="http://picslog.picsmate.net/category/javascript/feed/" rel="self" type="application/rss+xml" />
	<link>http://picslog.picsmate.net</link>
	<description>みずがめのラクガキはじめました。（あと、写真とか日記とか）</description>
	<lastBuildDate>Thu, 15 Apr 2010 08:30:35 +0000</lastBuildDate>
	<language>ja</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
	<generator>http://wordpress.org/?v=3.0</generator>
		<item>
		<title>javascriptでの値の比較結果を表にまとめてみた</title>
		<link>http://picslog.picsmate.net/2009/02/12/717/</link>
		<comments>http://picslog.picsmate.net/2009/02/12/717/#comments</comments>
		<pubDate>Thu, 12 Feb 2009 14:20:34 +0000</pubDate>
		<dc:creator>Mizugame</dc:creator>
				<category><![CDATA[WEB開発]]></category>
		<category><![CDATA[javascript]]></category>
		<category><![CDATA[メモ]]></category>
		<category><![CDATA[比較]]></category>

		<guid isPermaLink="false">http://picslog.picsmate.net/?p=717</guid>
		<description><![CDATA[
この間のNaNの判定で、ちょっとJavascriptの値の比較を整理しときたいと思ったので表にまとめた。
NaNってホント独特なんだなぁ・・・（￣□￣；）

比較
簡単な比較。
PHPでいう「2a問題」はないけど、型を [...]]]></description>
			<content:encoded><![CDATA[<p><a href="http://picslog.picsmate.net/wp/wp-content/uploads/2009/02/2009-2-12_js_check_sheet.jpg" alt="Javascript-比較結果" rel="lightbox[2009-2-12]" title="Javascript-比較結果"><img src="http://picslog.picsmate.net/wp/wp-content/uploads/2009/02/2009-2-12_js_check_sheet.thumbnail.jpg" alt="Javascript-比較結果" width="240" height="150" class="attachment wp-att-716 " /></a><br />
この間の<a href="http://picslog.picsmate.net/2009/02/05/698/">NaNの判定</a>で、ちょっとJavascriptの値の比較を整理しときたいと思ったので表にまとめた。</p>
<p>NaNってホント独特なんだなぁ・・・（￣□￣；）<br />
<span id="more-717"></span></p>
<p class="sub">比較</p>
<p>簡単な比較。<br />
PHPでいう「<a href="http://www.google.co.jp/search?hl=ja&#038;q=2a%E5%95%8F%E9%A1%8C&#038;btnG=%E6%A4%9C%E7%B4%A2&#038;lr=" rel="external">2a問題</a>」はないけど、型を意識しない比較。</p>
<p>falseとかは結構広範囲に対応できてしまう。</p>
<p>ちなみにNaNはすべてにおいてfalse。<br />
自分自身でさえも・・・（＞_＜）</p>
<table border="1">
<tr>
<th>比較(==)</th>
<th>true</th>
<th>false</th>
<th>null</th>
<th>undefined</th>
<th>NaN</th>
<th>&#8220;&#8221;</th>
<th>0</th>
<th>&#8220;0&#8243;</th>
<th>&#8220;0a&#8221;</th>
</tr>
<tr>
<th>true</th>
<td class="yellow">true</td>
<td class="red">false</td>
<td class="red">false</td>
<td class="red">false</td>
<td class="red">false</td>
<td class="red">false</td>
<td class="red">false</td>
<td class="red">false</td>
<td class="red">false</td>
</tr>
<tr>
<th>false</th>
<td class="red">false</td>
<td class="yellow">true</td>
<td class="red">false</td>
<td class="red">false</td>
<td class="red">false</td>
<td class="yellow">true</td>
<td class="yellow">true</td>
<td class="yellow">true</td>
<td class="red">false</td>
</tr>
<tr>
<th>null</th>
<td class="red">false</td>
<td class="red">false</td>
<td class="yellow">true</td>
<td class="yellow">true</td>
<td class="red">false</td>
<td class="red">false</td>
<td class="red">false</td>
<td class="red">false</td>
<td class="red">false</td>
</tr>
<tr>
<th>undefined</th>
<td class="red">false</td>
<td class="red">false</td>
<td class="yellow">true</td>
<td class="yellow">true</td>
<td class="red">false</td>
<td class="red">false</td>
<td class="red">false</td>
<td class="red">false</td>
<td class="red">false</td>
</tr>
<tr>
<th>NaN</th>
<td class="red">false</td>
<td class="red">false</td>
<td class="red">false</td>
<td class="red">false</td>
<td class="red">false</td>
<td class="red">false</td>
<td class="red">false</td>
<td class="red">false</td>
<td class="red">false</td>
</tr>
<tr>
<th>&#8220;&#8221;</th>
<td class="red">false</td>
<td class="yellow">true</td>
<td class="red">false</td>
<td class="red">false</td>
<td class="red">false</td>
<td class="yellow">true</td>
<td class="yellow">true</td>
<td class="red">false</td>
<td class="red">false</td>
</tr>
<tr>
<th>0</th>
<td class="red">false</td>
<td class="yellow">true</td>
<td class="red">false</td>
<td class="red">false</td>
<td class="red">false</td>
<td class="yellow">true</td>
<td class="yellow">true</td>
<td class="yellow">true</td>
<td class="red">false</td>
</tr>
<tr>
<th>0</th>
<td class="red">false</td>
<td class="yellow">true</td>
<td class="red">false</td>
<td class="red">false</td>
<td class="red">false</td>
<td class="red">false</td>
<td class="yellow">true</td>
<td class="yellow">true</td>
<td class="red">false</td>
</tr>
<tr>
<th>&#8220;0a&#8221;</th>
<td class="red">false</td>
<td class="red">false</td>
<td class="red">false</td>
<td class="red">false</td>
<td class="red">false</td>
<td class="red">false</td>
<td class="red">false</td>
<td class="red">false</td>
<td class="yellow">true</td>
</tr>
</table>
<p class="sub">型比較</p>
<p>より厳密な比較(*°∀°)=3<br />
簡単の比較のようにfalseは柔軟でなくなる。</p>
<p>相変わらずNaNはすべてに対して偽。</p>
<table border="1">
<tr>
<th>型比較(===)</th>
<th>true</th>
<th>false</th>
<th>null</th>
<th>undefined</th>
<th>NaN</th>
<th>&#8220;&#8221;</th>
<th>0</th>
<th>&#8220;0&#8243;</th>
<th>&#8220;0a&#8221;</th>
</tr>
<tr>
<th>true</th>
<td class="yellow">true</td>
<td class="red">false</td>
<td class="red">false</td>
<td class="red">false</td>
<td class="red">false</td>
<td class="red">false</td>
<td class="red">false</td>
<td class="red">false</td>
<td class="red">false</td>
</tr>
<tr>
<th>false</th>
<td class="red">false</td>
<td class="yellow">true</td>
<td class="red">false</td>
<td class="red">false</td>
<td class="red">false</td>
<td class="red">false</td>
<td class="red">false</td>
<td class="red">false</td>
<td class="red">false</td>
</tr>
<tr>
<th>null</th>
<td class="red">false</td>
<td class="red">false</td>
<td class="yellow">true</td>
<td class="red">false</td>
<td class="red">false</td>
<td class="red">false</td>
<td class="red">false</td>
<td class="red">false</td>
<td class="red">false</td>
</tr>
<tr>
<th>undefined</th>
<td class="red">false</td>
<td class="red">false</td>
<td class="red">false</td>
<td class="yellow">true</td>
<td class="red">false</td>
<td class="red">false</td>
<td class="red">false</td>
<td class="red">false</td>
<td class="red">false</td>
</tr>
<tr>
<th>NaN</th>
<td class="red">false</td>
<td class="red">false</td>
<td class="red">false</td>
<td class="red">false</td>
<td class="red">false</td>
<td class="red">false</td>
<td class="red">false</td>
<td class="red">false</td>
<td class="red">false</td>
</tr>
<tr>
<th>&#8220;&#8221;</th>
<td class="red">false</td>
<td class="red">false</td>
<td class="red">false</td>
<td class="red">false</td>
<td class="red">false</td>
<td class="yellow">true</td>
<td class="red">false</td>
<td class="red">false</td>
<td class="red">false</td>
</tr>
<tr>
<th>0</th>
<td class="red">false</td>
<td class="red">false</td>
<td class="red">false</td>
<td class="red">false</td>
<td class="red">false</td>
<td class="red">false</td>
<td class="yellow">true</td>
<td class="red">false</td>
<td class="red">false</td>
</tr>
<tr>
<th>0</th>
<td class="red">false</td>
<td class="red">false</td>
<td class="red">false</td>
<td class="red">false</td>
<td class="red">false</td>
<td class="red">false</td>
<td class="red">false</td>
<td class="yellow">true</td>
<td class="red">false</td>
</tr>
<tr>
<th>&#8220;0a&#8221;</th>
<td class="red">false</td>
<td class="red">false</td>
<td class="red">false</td>
<td class="red">false</td>
<td class="red">false</td>
<td class="red">false</td>
<td class="red">false</td>
<td class="red">false</td>
<td class="yellow">true</td>
</tr>
</table>
<p>正確な各比較結果を確認できるように、<a href="http://picsmate.net/sample/js/check_sheet/" rel="sample">実際にJavascriptを走らせる比較表</a>を置いときます。</p>
<p class="sub">おまけに数値のオーバーフローをちょこっと</p>
<p>phpの時もそうだけど、やっぱり数値のオーバーフローは発生する。</p>
<p>「11111111111111111」を境に結果がおかしくなったりし始める。<br />
とにかく当てにならない(＞_＜);;;</p>
<ul>
<li>「11111111111111110」 は「11111111111111110」<br />
  [<a href="javascript:alert(11111111111111110);" rel="javascript">実行して確認</a>]</li>
<li>「11111111111111111」 は「11111111111111112」<br />
  [<a href="javascript:alert(11111111111111111);" rel="javascript">実行して確認</a>]</li>
<li>「11111111111111112」 は「11111111111111112」・・・ってあれ？<br />
  [<a href="javascript:alert(11111111111111112);" rel="javascript">実行して確認</a>]</li>
<li>「11111111111111113」 は「11111111111111112」<br />
  [<a href="javascript:alert(11111111111111113);" rel="javascript">実行して確認</a>]</li>
<li>「11111111111111124」 は「11111111111111124」・・・正常？？？<br />
  [<a href="javascript:alert(11111111111111124);" rel="javascript">実行して確認</a>]</li>
<li>「11111111111111125」 は「11111111111111124」・・・ってオイオイ（￣□￣；）<br />
  [<a href="javascript:alert(11111111111111125);" rel="javascript">実行して確認</a>]</li>
</ul>
<p>ついでに、parseIntによる変換。</p>
<ul>
<li>「&#8221;0&#8243;」 は「0」 [<a href="javascript:alert(parseInt('0'));" rel="javascript">実行して確認</a>]</li>
<li>「&#8221;1&#8243;」 は「1」 [<a href="javascript:alert(parseInt('1'));" rel="javascript">実行して確認</a>]</li>
<li>「&#8221;0a&#8221;」 は「0」  [<a href="javascript:alert(parseInt('0a'));" rel="javascript">実行して確認</a>]</li>
<li>「&#8221;a0&#8243;」 は「NaN」 [<a href="javascript:alert(parseInt('a0'));" rel="javascript">実行して確認</a>]</li>
</ul>
<p>いろいろ抑えとかないと(´･ω･`)</p>
<p>関連情報：<br />
<a href="http://picslog.picsmate.net/2009/02/05/698/">javascriptでNaNを判定してみる</a><br />
<a href="http://picslog.picsmate.net/2008/12/28/652/">JavascriptでindexOfとmatchの速度がちょっと気になった</a><br />
<a href="http://picslog.picsmate.net/2008/12/20/645/">[MDIEスクリプト] select2zip.jsを更新</a></p>
]]></content:encoded>
			<wfw:commentRss>http://picslog.picsmate.net/2009/02/12/717/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>javascriptでNaNを判定してみる</title>
		<link>http://picslog.picsmate.net/2009/02/05/698/</link>
		<comments>http://picslog.picsmate.net/2009/02/05/698/#comments</comments>
		<pubDate>Thu, 05 Feb 2009 12:28:52 +0000</pubDate>
		<dc:creator>Mizugame</dc:creator>
				<category><![CDATA[WEB開発]]></category>
		<category><![CDATA[javascript]]></category>
		<category><![CDATA[メモ]]></category>

		<guid isPermaLink="false">http://picslog.picsmate.net/?p=698</guid>
		<description><![CDATA[
javascriptでparseIntやparseFloatなんかで文字列型を数値に変換したりするんですが、ちょっとNaNが来たときなんかは判定があやしくなっちゃうんですよね。
例えば
alert(parseInt(' [...]]]></description>
			<content:encoded><![CDATA[<p><img src="http://picslog.picsmate.net/wp/wp-content/uploads/2009/02/2009-2-5_javascript_nan.jpg" alt="javascriptでNaNを判定したい" width="345" height="134" class="attachment wp-att-697 " /><br />
javascriptでparseIntやparseFloatなんかで文字列型を数値に変換したりするんですが、ちょっとNaNが来たときなんかは判定があやしくなっちゃうんですよね。</p>
<p>例えば</p>
<pre><code class="color">alert(parseInt('a') ? 'Number' : 'NaN');</code></pre>
<p>みたいな安直なことはできないわけですよ。</p>
<pre><code class="color">alert(parseInt('0') ? 'Number' : 'NaN');</code></pre>
<p>みたいに文字列が「0」の場合、ちゃんと0が返ってきてもNaN判定になっちゃうから。</p>
<p>ググっても「NaN」そのものを判定するのが見つからなかったので、正常にNaNを判定する方法を考えてみた。<br />
・・・検索が下手なだけかもしれないどヽ（´ー｀）┌<br />
<span id="more-698"></span></p>
<p class="sub">Number.NaNを判定</p>
<pre><code class="color">javascript:alert(parseInt('a').toString() == 'NaN');</code></pre>
<p>なんだかパースしながら、さらに文字列に戻しちゃうわけですが(＞▽＜);;;<br />
遠まわしだけど、今のとこ思いつく確実な方法。</p>
<pre><code class="color">alert(parseInt('a') == NaN);</code></pre>
<p>とか</p>
<pre><code class="color">alert(parseInt('a') == Number.NaN);</code></pre>
<p>でいけるかなとか思ってたんだけど、どうも偽が返ってきちゃったので。</p>
<p>もっといい方法を知ってる人がいたら、ぜひ教えてください。</p>
<p>ともかくNaNを文字列に戻すと空になるかなと思ったけど、NaNって文字が返ってくるんだね。</p>
<p class="sub">ちょこっと追記</p>
<p>関数として使うなら<br />
※isNaNって関数がそもそも存在するみたいなのでis_NaNに微変更</p>
<pre><code class="color">function is_NaN($value)
{
  return (typeof $value == 'number' &#038;&#038; $value.toString() == 'NaN');
}

alert(is_NaN(1)); //false
alert(is_NaN('a')); //false
alert(is_NaN(parseInt('a'))); //true
</code></pre>
<p>ってとこだろうか。</p>
<p class="sub">さらに追記</p>
<p>いろいろやってたら、そもそもisNaNって関数があるみたい（￣□￣；<br />
で、全くの無駄記事になるかと思ったら・・・(＞_＜);;;</p>
<pre><code class="color">alert(isNaN(NaN)); //true （これはOK）
alert(isNaN(1)); //false （これもOK）
alert(isNaN(Infinity)); //false （OK）
alert(isNaN(undefined)); //true （あれ？）
alert(isNaN('text')); //true （あれれ？）
alert(isNaN('')); //false （OK）
alert(isNaN('1')); //false （これもOKだけど、キャストされてる？）
alert(isNaN('Infinity')) //false (これもキャストされてる？)
</code></pre>
<p>ダメじゃん。</p>
<p>isNaNだとundefinedとかまでNaNと判定されるらしい。<br />
なんか基準もよくわからないし。</p>
<p>やっぱ正確にはnumber型でかつ文字列に変換後にNaNとなるものを判定するのがいいみたい。<br />
まぁ、勉強になりました(＞_＜);;;</p>
<p>関連記事：<br />
<a href="http://picslog.picsmate.net/2008/12/28/652/">JavascriptでindexOfとmatchの速度がちょっと気になった</a><br />
<a href="http://picslog.picsmate.net/2008/12/20/645/">[MDIEスクリプト] select2zip.jsを更新</a><br />
<a href="http://picslog.picsmate.net/2008/12/08/577/">[clipFolder.js] MDIEでクリップボードからサクッとフォルダを作成</a></p>
]]></content:encoded>
			<wfw:commentRss>http://picslog.picsmate.net/2009/02/05/698/feed/</wfw:commentRss>
		<slash:comments>2</slash:comments>
		</item>
		<item>
		<title>JavascriptでindexOfとmatchの速度がちょっと気になった</title>
		<link>http://picslog.picsmate.net/2008/12/28/652/</link>
		<comments>http://picslog.picsmate.net/2008/12/28/652/#comments</comments>
		<pubDate>Sat, 27 Dec 2008 15:26:17 +0000</pubDate>
		<dc:creator>Mizugame</dc:creator>
				<category><![CDATA[javascript]]></category>
		<category><![CDATA[プログラム]]></category>
		<category><![CDATA[メモ]]></category>
		<category><![CDATA[日記]]></category>
		<category><![CDATA[Mozilla Firefox]]></category>
		<category><![CDATA[比較]]></category>

		<guid isPermaLink="false">http://picslog.picsmate.net/?p=652</guid>
		<description><![CDATA[
まぁ大したことしてないし、どうでもいい記事なんですけどね。
最近Firefox3でindexOfと正規表現（match）による速度測定をしたけど、速度に差がなかったよ・・・的な記事を見かけた。
そんなことはないはず！と [...]]]></description>
			<content:encoded><![CDATA[<p><a href="http://picslog.picsmate.net/wp/wp-content/uploads/2008/12/2008-12-28_js_indexof.jpg" alt="ソース-indexOfとmatchの速度比較" rel="lightbox[2008-12-28]" title="ソース-indexOfとmatchの速度比較"><img src="http://picslog.picsmate.net/wp/wp-content/uploads/2008/12/2008-12-28_js_indexof.thumbnail.jpg" alt="ソース-indexOfとmatchの速度比較" width="240" height="150" class="attachment wp-att-653 " /></a><br />
まぁ大したことしてないし、どうでもいい記事なんですけどね。</p>
<p>最近Firefox3でindexOfと正規表現（match）による速度測定をしたけど、速度に差がなかったよ・・・的な記事を見かけた。</p>
<p>そんなことはないはず！とか思いながらも、ちょっと気になったんで簡単に試してみた。<br />
ちょっと元記事がどこいっちゃったのか、紛失しちゃったんですが・・・(＞_＜);;;<br />
<span id="more-652"></span></p>
<p class="sub">実行コード</p>
<p>というわけで、以下のコードを用意して実行してみた。</p>
<pre><code class="color">(function(){
  var $measure = function() {
    this.compact = /s+/g;
  };

    $measure.prototype.time = function()
    {
      return (new Date()).getTime();
    };

    $measure.prototype.exec = function(func)
    {
      var i=0;
      this.st = this.time();
      for (;i&lt;10000;i++) func();
      this.ft = this.time();
      return this.result = func.toString().replace(this.compact, ' ') +
        ' (' + (this.ft - this.st) + ')';
    };

  var $M = new $measure(),
    text = 'abcdefghijklmnopqrstuvwxyz',
    ward = 'lmn',
    reg  = /lmn/;

  alert($M.exec(function()
  {
    text.indexOf(ward);
  }) + 'n'+ $M.exec(function()
  {
    text.match(/lmn/);
  }) + 'n'+ $M.exec(function()
  {
    text.match(reg);
  }));
})();
</code></pre>
<p>やっつけだったんで、突っ込みどころもあるだろうけど、さておき。</p>
<p>処理自体は文字列「abcdefghijklmnopqrstuvwxyz」の中から、「lmn」を探し出すというだけ。</p>
<p class="sub">結果</p>
<ol>
<li>indexOfは5～6ミリ秒前後。</li>
<li>match使用で正規表現を毎回作成すると27～30ミリ秒前後。</li>
<li>match使用で正規表現を変数から割り当てた場合は26～28ミリ秒前後。</li>
</ol>
<p>というわけで、予想通りうちの環境ではindexOfが速い。</p>
<p>正規表現オブジェクトを変数代入した場合と、毎回作成した場合での結果がたまに気になる（￣□￣；）</p>
<p>基本は変数に入れてる方が速いんだけど、たまに逆転したり。<br />
いろいろなプロセスが動いてる状態でテストしてるから、今回はその辺りの誤差だと勝手に納得することにする。</p>
<p>目的は果たせたし。<br />
記事もやっつけ(゜∀゜)</p>
<p>それにしても元記事どこいったんだろう・・・(´･ω･`)</p>
<p class="sub">実行環境</p>
<ol>
<li>OS: Windows XP SP3</li>
<li>CPU: Pen4 3.2G</li>
<li>メモリー: 3G</li>
<li>Firefox3.0.5</li>
</ol>
<p class="sub">おまけ</p>
<p>せっかくなので、ブックマークレットを載せておきます。<br />
<a href="javascript:(function(){var $measure=function(){this.compact=/s+/g;};$measure.prototype.time=function(){return(new Date()).getTime();};$measure.prototype.exec=function(func){var i=0;this.st=this.time();for(;i&lt;10000;i++)func();this.ft=this.time();return this.result=func.toString().replace(this.compact,' ')+' ('+(this.ft-this.st)+')';};var $M=new $measure(),text='abcdefghijklmnopqrstuvwxyz',ward='lmn',reg=/lmn/;alert($M.exec(function(){text.indexOf(ward);})+'n'+$M.exec(function(){text.match(/lmn/);})+'n'+$M.exec(function(){text.match(reg);}));})();" rel="javascript">indexOfとmatchの速度比較</a></p>
<p class="sub">追記：2009-1-21</p>
<p>正規表現とindexOfを比較するなら、大文字小文字の対応も必要だなと思ってtoLowerCaseを加えた。</p>
<p>正規表現は大文字小文字の区別なし、indexOf()はtoLowerCase()を使用した文字を検索するよう変更。</p>
<p>ほぼ一緒だけど、コードは以下の通り。</p>
<pre><code class="color">(function(){
  var $measure = function() {
    this.compact = /s+/g;
  };

    $measure.prototype.time = function()
    {
      return (new Date()).getTime();
    };

    $measure.prototype.exec = function(func)
    {
      var i=0;
      this.st = this.time();
      for (;i&lt;10000;i++) func();
      this.ft = this.time();
      return this.result = func.toString().replace(this.compact, ' ') +
        ' (' + (this.ft - this.st) + ')';
    };

  var $M = new $measure(),
    text = 'abcdefghijklmnopqrstuvwxyz',
    ward = 'lmn',
    reg  = /lmn/i;

  alert($M.exec(function()
  {
    text.indexOf(ward);
  }) + 'n'+ $M.exec(function()
  {
    text.indexOf(ward.toLowerCase());
  }) + 'n'+ $M.exec(function()
  {
    text.match(/lmn/i);
  }) + 'n'+ $M.exec(function()
  {
    text.match(reg);
  }));
})();
</code></pre>
<p class="sub">結果</p>
<ol>
<li>indexOfでtoLowerCaseなしは6ミリ秒前後。</li>
<li>indexOfでtoLowerCaseありは9ミリ秒前後。</li>
<li>match使用で正規表現の大文字小文字の区別なしを毎回作成すると28ミリ秒前後。</li>
<li>match使用で正規表現の大文字小文字の区別なしを変数から割り当てた場合は28ミリ秒前後。</li>
</ol>
<p>toLowerCaseを加えた分少し遅くなったけど、やっぱり正規表現よりは速いらしい。</p>
<p>こちらも、ブックマークレットを載せておきます。<br />
<a href="javascript:(function(){var $measure=function(){this.compact=/s+/g;};$measure.prototype.time=function(){return(new Date()).getTime();};$measure.prototype.exec=function(func){var i=0;this.st=this.time();for(;i&lt;10000;i++)func();this.ft=this.time();return this.result=func.toString().replace(this.compact,' ')+' ('+(this.ft-this.st)+')';};var $M=new $measure(),text='abcdefghijklmnopqrstuvwxyz',ward='lmn',reg=/lmn/i;alert($M.exec(function(){text.indexOf(ward);})+'n'+$M.exec(function(){text.indexOf(ward.toLowerCase());})+'n'+$M.exec(function(){text.match(/lmn/i);})+'n'+$M.exec(function(){text.match(reg);}));})();" rel="javascript">indexOfとmatchの速度比較（toLowerCase追加、正規表現は大文字小文字の区別なし）</a></p>
<p>関連記事：<br />
<a href="http://picslog.picsmate.net/2008/12/20/645/">[MDIEスクリプト] select2zip.jsを更新</a><br />
<a href="http://picslog.picsmate.net/2008/12/08/577/">[clipFolder.js] MDIEでクリップボードからサクッとフォルダを作成</a><br />
<a href="http://picslog.picsmate.net/2008/06/03/324/">AIR用のSQLiteライブラリ「AirDB.js」</a></p>
]]></content:encoded>
			<wfw:commentRss>http://picslog.picsmate.net/2008/12/28/652/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>[MDIEスクリプト] select2zip.jsを更新</title>
		<link>http://picslog.picsmate.net/2008/12/20/645/</link>
		<comments>http://picslog.picsmate.net/2008/12/20/645/#comments</comments>
		<pubDate>Sat, 20 Dec 2008 07:38:10 +0000</pubDate>
		<dc:creator>Mizugame</dc:creator>
				<category><![CDATA[MDIE]]></category>
		<category><![CDATA[javascript]]></category>
		<category><![CDATA[プログラム]]></category>
		<category><![CDATA[7z]]></category>
		<category><![CDATA[ソフト]]></category>
		<category><![CDATA[cmd]]></category>
		<category><![CDATA[MDIEスクリプト]]></category>

		<guid isPermaLink="false">http://picslog.picsmate.net/?p=645</guid>
		<description><![CDATA[
公開せずに放置してたんですが、一段落したとして最新版のselect2zip.jsを公開しておきます。
一度、書き直したのでスクリプト自体は別物になってますが（・∀・）
少し機能が増えました。
というか、1年近くたっちゃ [...]]]></description>
			<content:encoded><![CDATA[<p><a href="http://picslog.picsmate.net/wp/wp-content/uploads/2008/12/2008-12-20_mdie_select2zip.jpg" rel="lightbox[2008-12-20]" title="MDIE-select2zip.js"><img src="http://picslog.picsmate.net/wp/wp-content/uploads/2008/12/2008-12-20_mdie_select2zip.thumbnail.jpg" alt="MDIE-select2zip.js" width="240" height="180" class="attachment wp-att-644 " /></a><br />
公開せずに放置してたんですが、一段落したとして最新版のselect2zip.jsを公開しておきます。</p>
<p>一度、書き直したのでスクリプト自体は別物になってますが（・∀・）<br />
少し機能が増えました。</p>
<p>というか、1年近くたっちゃってるね・・・。<br />
<span id="more-645"></span></p>
<p>以下、使い方とか説明です。</p>
<p class="sub">使い方</p>
<p>基本的に使い方自体はいっしょだけど、とりあえず。<br />
ソースコードは<a href="http://picsmate.net/sample/select2zip/" rel="source">ソースコード</a>から。</p>
<ol>
<li>「<a href="http://picsmate.net/sample/select2zip/select2zip.zip" rel="zip">select2zip.zip</a>」をクリックしてダウンロード。</li>
<li>ダウンロードしたZIPファイルを解凍。</li>
<li>解凍してできた「select2zip.v076.js」をMDIEのインストールフォルダにあるscriptフォルダ内に移動(任意のフォルダでもいい)</li>
<li>MDIEを起動してメニューの「ツール」 &gt; 「拡張」 &gt; 「スクリプトに追加」で「select2zip.v076.js」を追加</li>
<li>MDIEのメニューの「ツール」にある「キーボードショートカット」や「マウスジェスチャ」に任意で登録</li>
</ol>
<p class="sub">設定について</p>
<p>解凍した「select2zip.v076.js」をテキストエディタ等で直接編集します。<br />
コメント入れているので大丈夫だと思うけど、ちょっと補足。</p>
<p>まずは環境設定。</p>
<ol>
<li>select2zip.v076.jsをテキストエディタで開いて、21行目以降を確認。
<pre><code class="color">/*
 * システム設定（7-zipの位置とか、ログファイルの場所を指定）
 * $system.exe        : 7zipプログラムのパス
 * $system.logfile    : ログファイルのパス(設定しない場合は、実行したディレクトリ内に自動作成)
 * $system.zipMode    : 圧縮タイプ(デフォルトはzip)
 * $system.skipExt    : 圧縮しないファイル拡張子（$option.skipZipがtrueの場合のみ有効）
 */
$system.exe     = '';
$system.logfile = '';
$system.zipMode = 'zip';
$system.skipExt = ['lzh','zip','cab','rar','7z','gz','bz2','tar'];
</code></pre>
</li>
<li>$system.exeだけは「7zipのパス」を確実に記述。<br />
  ※ここさえ間違ってなければ、とりあえず動くはず。</li>
<li>ログファイルを固定ファイルにしたい場合は「$system.logfile」に任意のパスを記述。</li>
<li>圧縮ファイルの種類を変更する場合は、$system.zipModeのzipを変更。<br />
  サポートしている圧縮タイプは「zip」、「7z」、「tar」、「gzip」、「bzip」で任意のファイルタイプを記述すればいい。<br />
  ※「gzip」、「bzip」は単体ファイルの圧縮しかサポートしてないので、非推奨。</li>
<li>$system.skipExtで圧縮したくないファイルの拡張子を記述。<br />
  ※Array形式での記述（['拡張子１', '拡張子２']）</li>
</ol>
<p>次にオプション設定。<br />
（オプションは「true」か「false」のみで記述）</p>
<ol>
<li>select2zip.v076.jsをテキストエディタで開いて、33行目以降を確認。
<pre><code class="color">/*
 * オプション設定（圧縮対象の設定とか、ログを残すかとか）
 * $option.pressDir   : 選択したフォルダを圧縮するか(圧縮する:true, 圧縮しない:false)
 * $option.pressFile  : 選択したファイルを圧縮するか(圧縮する:true, 圧縮しない:false)
 * $option.saveLog    : 実行ログを記録するか(記録する:true, 記録しない:false)
 * $option.skipZip    : 選択ファイルがZIPの場合、重複圧縮を回避するか(回避する:true, 回避しない:false)
 * $option.removeExt  : ファイル圧縮時に拡張子を外すか(外す:true, 残す:false)
 * $option.keepAction : ユーザによる圧縮中断後、残りの圧縮を継続するか(継続する:true, 継続しない:false)
 * $option.finish     : 終了時のアラート(アラートする:true, アラートしない:false)
 */
$option.pressDir   = true;
$option.pressFile  = true;
$option.saveLog    = true;
$option.skipZip    = true;
$option.removeExt  = true;
$option.keepAction = false;
$option.finish     = false;
</code></pre>
</li>
<li>$option.pressDirで選択中フォルダの圧縮の可否を決定。<br />
  ※フォルダの圧縮を無視したい場合、これをfalseにする。</li>
<li>$option.pressFileで選択中ファイルの圧縮の可否を決定。<br />
  ※ファイルの圧縮を無視したい場合、これをfalseにする。</li>
<li>ユーザが指定した拡張子をもつファイルの場合に、圧縮を無視するのであれば$option.skipZipをtrueにする。<br />
  ※圧縮ファイルの重複圧縮を回避するために作ったけど、圧縮ファイル以外の拡張子も指定できます。</li>
<li>ファイルの圧縮時のファイル名に、元の拡張子を取り外して、圧縮タイプの拡張子を付ける場合は、$option.removeExtをtrueにする。</li>
<li>タスクバーに表示されるコマンドプロンプトが、ユーザによって閉じられた場合に、残りのファイルの圧縮を引き続き行う場合に$option.keepActionをtrueにする。</li>
<li>select2zipの処理終了を通知したい場合に$option.finishをtrueにする。</li>
</ol>
<p>そんな感じ。</p>
<p>基本的に初期値が割り振られるようにしているので、$system.exe以外は削除しても動きます。<br />
※Vistaの場合で、プログラムフォルダに7zipをインストールした場合は、$system.exeも削除しても動くはず。<br />
※XPはシステム変数の展開の都合で、うまく動かないっぽい。</p>
<p class="sub">前回からの変更点</p>
<p>放置期間が長かったので、スクリプトとしては別物かも。</p>
<ul>
<li>処理終了までに、MDIEで選択ファイルを変更すると圧縮するファイルリストまで変わってしまうバグを修正。<br />
  ※とはいっても、前もってリストを確保してるだけなので、ファイルが多い場合にすぐ選択を解除したりなんかするとダメだと思う。</li>
<li>圧縮の種類をzipのみから、7z、tarにも変更できるように変更。<br />
  ※gzipやbzipもできるようにはしてるけど、1ファイル専用</li>
<li>選択ファイルに圧縮ファイルが含まれる場合、重複圧縮を回避できるように設定追加。<br />
  ※ただし、拡張子のみによる判別）</li>
<li>圧縮対象がファイルの場合、拡張子を取り外していたのを、設定により動作を変更できるようにした。</li>
<li>ログで書き出す内容が７ｚのすべてのexit codeに対応。（たぶん）</li>
<li>設定周りの変数名をいろいろ変更。</li>
<li>ログのテキスト情報をいろいろ変更。</li>
<li>ソースコードが膨張したり、キレイになったり、汚くなったり。</li>
<li>コードの切り分けがいま一つだけど、オブジェクトベースにしたので、（自分的に）多少変更が加えやすくなった。</li>
</ul>
<p>前回がバージョンもついてない状態で、いきなり中途半端なバージョンになってるけど・・・。<br />
とりあえず、やりたかったことは一通り実装した感じ。</p>
<p>・・・ソースがいま一つ整理できてないけど(＞_＜)</p>
<p>関連記事：<br />
<a href="http://picslog.picsmate.net/2008/12/08/577/">[clipFolder.js] MDIEでクリップボードからサクッとフォルダを作成</a><br />
<a href="http://picslog.picsmate.net/2008/01/31/181/">7-zipで選択中のファイル(またはフォルダ)を圧縮するMDIE用スクリプト「select2zip.js」</a><br />
<a href="http://picslog.picsmate.net/2007/10/14/148/">選択フォルダの階層構造をテキストファイルに出力するMDIE用スクリプト</a></p>
]]></content:encoded>
			<wfw:commentRss>http://picslog.picsmate.net/2008/12/20/645/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>[clipFolder.js] MDIEでクリップボードからサクッとフォルダを作成</title>
		<link>http://picslog.picsmate.net/2008/12/08/577/</link>
		<comments>http://picslog.picsmate.net/2008/12/08/577/#comments</comments>
		<pubDate>Sun, 07 Dec 2008 18:21:58 +0000</pubDate>
		<dc:creator>Mizugame</dc:creator>
				<category><![CDATA[MDIE]]></category>
		<category><![CDATA[javascript]]></category>
		<category><![CDATA[プログラム]]></category>
		<category><![CDATA[ソフト]]></category>
		<category><![CDATA[設定]]></category>
		<category><![CDATA[MDIEスクリプト]]></category>

		<guid isPermaLink="false">http://picslog.picsmate.net/?p=577</guid>
		<description><![CDATA[
新規フォルダを作成するときに、フォルダ名をコピペでつける機会って結構多いんですよね（・∀・）
これって、私だけって事はないはず！
・・・だけ？（　ﾟ Дﾟ）
ともあれ、１アクションで実行したいので、サクッとフォルダ作成 [...]]]></description>
			<content:encoded><![CDATA[<p><a href="http://picslog.picsmate.net/wp/wp-content/uploads/2008/12/2008-12-8_mdie_clipfolder.jpg" rel="lightbox[pics-1228673912]" title="MDIE-clipFolder.js"><img src="http://picslog.picsmate.net/wp/wp-content/uploads/2008/12/2008-12-8_mdie_clipfolder.thumbnail.jpg" alt="MDIE-clipFolder.js" width="240" height="180" class="attachment wp-att-576 " /></a><br />
新規フォルダを作成するときに、フォルダ名をコピペでつける機会って結構多いんですよね（・∀・）<br />
これって、私だけって事はないはず！</p>
<p>・・・だけ？（　ﾟ Дﾟ）</p>
<p>ともあれ、１アクションで実行したいので、サクッとフォルダ作成する<a href="http://picslog.picsmate.net/category/mdie/">MDIE用スクリプト</a>を、サクッと書いてみました。</p>
<p>とりあえず、発想が発想なんで既出だったらゴメンナサイ(´･ω･`)<br />
<span id="more-577"></span></p>
<p class="sub">使い方</p>
<p>いつも通り、以下に使う手順を書いときます。</p>
<ol>
<li>「<a href="http://picsmate.net/sample/clipfolder/clipfolder.zip" rel="external">clipfolder.zip</a>」をクリックしてダウンロード。</li>
<li>ダウンロードしたZIPファイルを解凍。</li>
<li>解凍してできた「clipFolder.js」をMDIEのインストールフォルダにあるscriptフォルダ内に移動(任意のフォルダでもいい)</li>
<li>MDIEを起動してメニューの「ツール」 &gt; 「拡張」 &gt; 「スクリプトに追加」で「clipFolder.js」を追加</li>
<li>MDIEのメニューの「ツール」にある「キーボードショートカット」や「マウスジェスチャ」に任意で登録</li>
</ol>
<p>以上で新規フォルダ後にコピペで名前を付けなくても、サクッと１アクションで名前の付いたフォルダが作れます。<br />
そんだけ(＞_＜)</p>
<p>「ctrlキー」＋「kキー」に設定されてる新規フォルダ作成を、「ctrlキー」＋「nキー」に変更してるんだけど、クリップボードをクリアするのがめんどうな時もありそうなので、使い分けのために「ctrlキー」＋「shftキー」＋「nキー」なんかに割り当てています。</p>
<p class="sub">仕様とか</p>
<p>ソースコードを確認する場合は<a href="http://picsmate.net/sample/clipfolder/" rel="external">MDIEスクリプト clipFolder.js ソースコード [ピクスメイト]</a>から。</p>
<p>多少、邪魔に感じるかもしれないおせっかい機能とかもあります。</p>
<ul>
<li>クリップボードから取得した文字列に、フォルダ名として使用できない文字はすべて「-」に変換。<br />
  ※なんかフォルダ作成時に使えない文字としてカンマ「,」が出てるけど、あれって使えるよね？</li>
<li>フォルダ名の重複時は、とりあえずフォルダ名の最後に「(数値)」を付与。<br />
  ・・・個人的にフォルダの大量作成時に便利だから。</li>
<li>クリップボードが文字列でない場合、通常の新規フォルダコマンドを実行。<br />
  ※MDIE.Clipboardはテキストデータしか見ないみたいだから、typeof判定いらなかったかも</li>
<li>フォルダパスとして有効な文字数かどうかのチェックまではやっていません。</li>
</ul>
<p>仕様じゃないんだけど、大したことしてない割に動作が重い気がするよ（　ﾟ Дﾟ）<br />
「Scripting.FileSystemObject」って結構コストがかかる？</p>
<p>それにしても<a href="http://cres.s28.xrea.com/soft/mdie.html" rel="external">MDIE</a>、そろそろ更新されないかなぁ・・・。</p>
<p>関連記事：<br />
<a href="http://picslog.picsmate.net/2008/01/31/181/">7-zipで選択中のファイル(またはフォルダ)を圧縮するMDIE用スクリプト「select2zip.js」</a><br />
<a href="http://picslog.picsmate.net/2007/10/14/148/">選択フォルダの階層構造をテキストファイルに出力するMDIE用スクリプト</a><br />
<a href="http://picslog.picsmate.net/2007/10/08/146/">拡張子ごとにフォルダ振り分けを行うMDIE用スクリプト</a></p>
]]></content:encoded>
			<wfw:commentRss>http://picslog.picsmate.net/2008/12/08/577/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Google ChromeのJS速度に活目！</title>
		<link>http://picslog.picsmate.net/2008/11/20/439/</link>
		<comments>http://picslog.picsmate.net/2008/11/20/439/#comments</comments>
		<pubDate>Wed, 19 Nov 2008 15:54:04 +0000</pubDate>
		<dc:creator>Mizugame</dc:creator>
				<category><![CDATA[javascript]]></category>
		<category><![CDATA[メモ]]></category>
		<category><![CDATA[日記]]></category>
		<category><![CDATA[ブラウザー]]></category>
		<category><![CDATA[Google Chrome]]></category>
		<category><![CDATA[Mozilla Firefox]]></category>

		<guid isPermaLink="false">http://picslog.picsmate.net/?p=439</guid>
		<description><![CDATA[
退院してから速攻で2日ほど更新をさぼりましたが。(　ﾟ Дﾟ)
入院前に「Google Chrome（以後ちょろめ）のJSって速いよね！」って記事を書こうとしてたのを思い出したんで、更新しときます。

キャプチャに「W [...]]]></description>
			<content:encoded><![CDATA[<p><a href="http://picslog.picsmate.net/wp/wp-content/uploads/2008/11/2008-11-20_cap.jpg" rel="lightbox[pics-1227108626]" title="Box2D JS-キャプチャ"><img src="http://picslog.picsmate.net/wp/wp-content/uploads/2008/11/2008-11-20_cap.thumbnail.jpg" alt="Box2D JS-キャプチャ" width="240" height="180" class="attachment wp-att-438 " /></a><br />
退院してから速攻で2日ほど更新をさぼりましたが。(　ﾟ Дﾟ)</p>
<p>入院前に「<a href="http://www.google.com/chrome/" rel="external">Google Chrome</a>（以後ちょろめ）のJSって速いよね！」って記事を書こうとしてたのを思い出したんで、更新しときます。<br />
<span id="more-439"></span></p>
<p>キャプチャに「<a href="http://www.debugmode.com/wink/" rel="external">Wink</a>」を使おうかなと思ったものの、マシンスペックを結構取られちゃうのでデジカメでモニタを映すことにしましたヽ（´ー｀）┌</p>
<p class="sub">実行環境</p>
<ul>
<li>OS：Windows XP SP3</li>
<li>CPU：Pen4 3.2G</li>
<li>メモリー： 3G</li>
</ul>
<p>というわけでJSで書かれた物理エンジンの「<a href="http://box2d-js.sourceforge.net/index2.html" rel="external">Box2D JS</a>」を使って体感的に速いか試してみた。</p>
<p>直観的に動作が分かりやすそうだったので、サンプルはピストンです。</p>
<p>尚、ちょろめの速度を体感的に感じるために、比較に使ったのはFireFoxです。</p>
<p class="sub">Firefox</p>
<p><a href="http://www.youtube.com/watch?v=9mcXNCOpZHQ"><img src="http://img.youtube.com/vi/9mcXNCOpZHQ/default.jpg" width="130" height="97" border=0></a><br />
アドオンやら追加しまくってたので、一応新しいプロファイルを作った初期状態同様のFirefox 3.0.4で試しています。<br />
速いんだけど、オブジェクトが増えてくるとかなりしんどそう(＞_＜);;;</p>
<p>処理落ちに加えて、ぷちフリーズ気味に一瞬動作が止まったりする場合があります。</p>
<p>なんか3.0.4の更新が来たんで入れたものの、ちょっと不安定になって動作も若干遅くなったような気がしてる。<br />
・・・気だけなことを祈る。</p>
<p class="sub">ちょろめ</p>
<p><a href="http://www.youtube.com/watch?v=42yegPinLic"><img src="http://img.youtube.com/vi/42yegPinLic/default.jpg" width="130" height="97" border=0></a><br />
かなり軽快。<br />
オブジェクトが増えてきてもなかなか動いてくれる。</p>
<p>最初ピストンの動きが速くて、ちょっと気持ち悪いくらい（゜◇゜）<br />
まるでオブジェクトがゴミのように掃き飛ばされていっています（￣□￣；）</p>
<p>そこそこ弾幕が激しいSTGならいけるんじゃないのか？</p>
<p>ちょろめのバージョンは0.3.154.9で現在最新版だそうです。</p>
<p class="sub">結果</p>
<p>というわけでBox2D JSを使った場合、割と処理速度の差が顕著に出てしまった感じもありますが、やっぱり現状ではアドオンとか便利すぎてFirefoxを切り離せない！！(≧∇≦)/</p>
<p>GmailとかブクマとかのサービスをFirefoxで使ってる分には、全然ストレスも感じてないし。<br />
（アドオンの入れすぎで起動が遅くなったのだけがネックだけど）</p>
<p>でもFirefox3が出た時の処理の軽快さはかなり衝撃だったのに、ちょろめのこの速度はすごいね！<br />
まだベータ版だし。</p>
<p>ちょろめの今後を期待しながら、Firefox3.1もめちゃくちゃ期待してるんだけど（・∀・）<br />
早く出ないかなぁ・・・。</p>
<p>関連情報：<br />
<a href="http://www.google.com/chrome/" rel="external">Google Chrome &#8211; ブラウザのダウンロード</a><br />
<a href="http://mozilla.jp/" rel="external">次世代ブラウザ Firefox &#8211; 高速・安全・自由にカスタマイズ</a><br />
<a href="http://www.debugmode.com/wink/" rel="external">Wink &#8211; [Homepage]</a></p>
<p>関連記事：<br />
<a href="http://picslog.picsmate.net/2008/06/03/324/" rel="external">AIR用のSQLiteライブラリ「AirDB.js」</a><br />
<a href="http://picslog.picsmate.net/2008/04/02/223/" rel="external">GMapをXMLで初期化するjQueryプラグイン「jquery.xmap.js」</a></p>
]]></content:encoded>
			<wfw:commentRss>http://picslog.picsmate.net/2008/11/20/439/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>AIR用のSQLiteライブラリ「AirDB.js」</title>
		<link>http://picslog.picsmate.net/2008/06/03/324/</link>
		<comments>http://picslog.picsmate.net/2008/06/03/324/#comments</comments>
		<pubDate>Mon, 02 Jun 2008 17:11:28 +0000</pubDate>
		<dc:creator>Mizugame</dc:creator>
				<category><![CDATA[AIR]]></category>
		<category><![CDATA[WEB開発]]></category>
		<category><![CDATA[javascript]]></category>
		<category><![CDATA[プログラム]]></category>

		<guid isPermaLink="false">http://picslog.picsmate.net/2008/06/03/324/</guid>
		<description><![CDATA[
AIRでSQLiteをもう少し簡単に使えるように、叩き台用にライブラリ化してみた。
久しぶりのプログラム記事かもしれない。。。（゜◇゜）
AS(Action Script)ではなく、JS(Java Script)用なの [...]]]></description>
			<content:encoded><![CDATA[<div class="imageframe" style="width:320px;"><a href="http://picslog.picsmate.net/wp/wp-content/uploads/2008/06/20080602_airdbjs.jpg" rel="lightbox[pics-1212414840]" title="AirDB.js"><img src="http://picslog.picsmate.net/wp/wp-content/uploads/2008/06/20080602_airdbjs.thumbnail.jpg" width="320" height="240" alt="AirDB.js" /></a></div>
<p>AIRでSQLiteをもう少し簡単に使えるように、叩き台用にライブラリ化してみた。<br />
久しぶりのプログラム記事かもしれない。。。（゜◇゜）</p>
<p>AS(Action Script)ではなく、JS(Java Script)用なので注意。</p>
<p>とりあえず、使い方とかを紹介。<br />
<span id="more-324"></span></p>
<p class="sub">ファイルの入手</p>
<p><a href="http://picsmate.net/sample/AirDB/AirDB.v010.zip" rel="zip">AirDB.v010.zip</a>からjsファイルを入手。</p>
<p>内容は以下の通り。</p>
<ul>
<li>AirDB.v010.js （オリジナルファイル）</li>
<li>AirDB.v010.pack.js （pack圧縮ファイル）</li>
</ul>
<p>ソースコードは「<a href="http://picsmate.net/sample/AirDB/" rel="external">AIR SQLiteライブラリ AirDB.js ソースコード [ピクスメイト]</a>」で確認できます。</p>
<p class="sub">まずは読み込む</p>
<p>AIRプロジェクトのhtmlファイルのヘッダー要素に以下を追加。</p>
<pre><code class="color">&lt;script type="text/javascript" src="AIRAliases.js"&gt;&lt;/script&gt;
&lt;script type="text/javascript" src="AirDB.v010.js"&gt;&lt;/script&gt;
</code></pre>
<p>AIRのJS用のアクションスクリプトエイリアス群を使うので、「AIRAliases.js」も読み込みます。</p>
<p class="sub">使う準備をする</p>
<p>AirDBオブジェクトを読み込む。今回は「$DB」という変数で初期化することとします。</p>
<pre><code class="color">var $DB = new AirDB;
window.addEventListener('unload', $DB.close);
</code></pre>
<p>例としてAIRが閉じられるときに、一応データベースを閉じるようにイベントを登録したけど、多分いらない。</p>
<p class="sub">データベースをファイルから読み込んで、テーブルを作成</p>
<p>AirDB.connectでファイルからSQLiteに接続、AirDB.createでテーブルを作成します。</p>
<pre><code class="color">try {
  $DB.connect("app:sample.db");
  $DB.create("test", {
    id: 'INTEGER PRIMARY KEY',
    message: 'TEXT'
  });
} catch (error) {
  alert(error.toString());
}
</code></pre>
<p>$DB.createでは常にテーブルの存在を確認する「CREATE TABLE IF NOT EXISTS ～」の文法でSQLを組み立てます。</p>
<p>上記の例では結果が返ってくるまで待つ「同期」状態でSQLiteに接続していますが、非同期で接続する場合はAirDB.connectの第2引数にtrueを与えます。</p>
<p>また、AirDB.connectの第3引数には接続直後に実行する関数を与えることができます。</p>
<p>具体的には以下のような感じ。</p>
<pre><code class="color">try {
  $DB.connect("app:sample.db",true, function(){
    $DB.create("test", {
      id: 'INTEGER PRIMARY KEY',
      message: 'TEXT'
    });
  });
} catch (error) {
  alert(error.toString());
}
</code></pre>
<p>個人的に長い関数名を打ち込むのがめんどくさいので、AirDB.connectはAirDB.con、AirDB.createはAirDB.creのように短い関数名のエイリアスを張っています。</p>
<p>エイリアスについては、AirDB.v010.jsか<a href="http://picsmate.net/sample/AirDB/" rel="external">ソースコード</a>の終わりのほうを見てください（投げやり）</p>
<p class="sub">データの挿入とか更新</p>
<p>同期か非同期で、エラーイベントとかの取得とかのタイミングが変わるので、ここからは同期で接続した場合の例です。</p>
<p>データ入力の例</p>
<pre><code class="color">function insertData()
{
  try {
    $DB.insert('test', {
      message : 'message'
    });
  } catch(error) {
    alert(error.toString());
  }
}
</code></pre>
<p>こんな感じ。</p>
<p>AirDB.insert(テーブル名:string,インサートデータ:object)で使えます。</p>
<p>トランザクション処理を入れる場合は、AirDB.begin()、AirDB.commit()、AirDB.rollback()が利用できます。</p>
<p>データ更新の例</p>
<pre><code class="color">function updateData()
{
  try {
    $DB.update('test', {
        message : 'update message'
      },
      "WHERE" +
      "  id = '1'"
    );
  } catch(error) {
    alert(error.toString());
  }
}
</code></pre>
<p>AirDB.update(テーブル名:string,アップデートデータ:object,絞込条件とか:string)で使えます。</p>
<p>同じ要領で、AirDB.Delete(テーブル名:string,絞込条件とか:string)でデータの削除ができます。<br />
(関数名がdeleteではなくDeleteになってるのは間違いではなく、jsのdeleteと被るから)</p>
<p>とりあえず、AirDB.insertとAirDB.updateは、内部でパラメータを登録してプリペアードで実行するようにしています。<br />
（ただし、AirDB.updateの絞込みとかのWHERE句とかはそのまま）</p>
<p class="sub">登録データの取得</p>
<p>データ取得の例</p>
<pre><code class="color">function selectData()
{
  try {
    $DB.select('test',
      ['id','message'],
      "WHERE" +
      "  message not NULL"
    );
  } catch(error) {
    alert(error.toString());
  }

  //ここから結果の表示処理
  result = $DB.getRows();
  if (result != null) {
    var data = new String();
    for (row in result) {
      data += "[" + row + "] " +
              "id: \"" + result[row].id + "\" " +
              "message: \"" + result[row].message + "\"\n";
    }
    alert(data);
  } else {
    alert('データが見つかりません！');
  }
}
</code></pre>
<p>こんな感じ。</p>
<p>AirDB.select(テーブル名:string,取得対象カラム:string or array,絞込条件とか:string)で使えます。</p>
<p class="sub">まとめ</p>
<p>いろいろ解説サイトとか見て思ったけど、ローカルで扱うのを前提としているためか、意外とプリペアードクエリもエスケープもやってないもの多いね。</p>
<p>一応、エスケープ用にAirDB.escapeも作ったものの、プリペアードの方が便利な気もするし、大雑把にしか対応させてない。<br />
バイナリセーフとか、JSでどうやってるんだろう。</p>
<p>あと、AIRのSQLStatement.textの中にバックスラッシュ(￥)が入ったSQL文を入れた場合、SQLStatement.textを確認するとバックスラッシュが改行になっちゃうのはなぜなんだろう・・・バグ？（￣□￣；）</p>
<p>おかげで、LIKE文用のワイルドカード（%と_）のエスケープができねぇ。</p>
<p>ものすごくハマった上、解決してないんだけど。<br />
・・・そもそもやり方が間違ってる？</p>
<p>そんなわけなんで、AirDB.escapePatternって関数を今のところ残してるんだけど、まったく役に立ちません！</p>
<p>作っててずーっと思ってたけど、やっぱりSQLStatement周りは、中途半端なのでどうにかしないと。</p>
<pre><code class="color">var select = new $DB.select('table', '*');
  select.where(条件);
  select.or(条件);
  select.order(条件);
  select.param('name', 'value');
  select.query();
</code></pre>
<p>みたいに操作できるように、個別にオブジェクト化しておきたい。</p>
<p>・・・とりあえず、めんどくさいので。<br />
更新する気になったら、大幅に改造するかも・・・くらいの。</p>
<p>ワイルドカードもパラメータ登録にすれば、どうにかなるかしら？</p>
<p>それにしても、思ったよりAIRの解説サイトって少ないね。<br />
最初はもっと流行るかなと思ってたのに。</p>
<p>お世話になったサイト：<br />
<a href="http://www.hakkaku.net/series/api-%e3%81%a7%e8%a6%9a%e3%81%88%e3%82%8b-adobe-air" rel="external">八角研究所  : Series: API で覚える Adobe AIR &laquo;</a><br />
<a href="http://www.atmarkit.co.jp/fwcr/rensai/air02/air02_1.html" rel="external">AIRとSQLiteで学ぶ ローカルDB操作の基本 （1/3） ─ ＠IT</a></p>
<p>関連記事：<br />
<a href="http://picslog.picsmate.net/2008/04/02/223/" rel="external">GMapをXMLで初期化するjQueryプラグイン「jquery.xmap.js」</a></p>
]]></content:encoded>
			<wfw:commentRss>http://picslog.picsmate.net/2008/06/03/324/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>GMapをXMLで初期化するjQueryプラグイン「jquery.xmap.js」</title>
		<link>http://picslog.picsmate.net/2008/04/02/223/</link>
		<comments>http://picslog.picsmate.net/2008/04/02/223/#comments</comments>
		<pubDate>Wed, 02 Apr 2008 01:39:53 +0000</pubDate>
		<dc:creator>Mizugame</dc:creator>
				<category><![CDATA[WEB開発]]></category>
		<category><![CDATA[javascript]]></category>
		<category><![CDATA[プログラム]]></category>

		<guid isPermaLink="false">http://picslog.picsmate.net/2008/04/02/223/</guid>
		<description><![CDATA[
GMapを使うのって結構、設定が結構めんどくさかったりするんですよね。
なんで表示用の設定を書き込んだXMLを読み込むだけで、GMapを初期化できるjQuery用のプラグインを作ってみました。
開発をしやすいようにjQ [...]]]></description>
			<content:encoded><![CDATA[<p><a href="http://picslog.picsmate.net/wp/wp-content/uploads/2008/04/20080402.jpg" rel="lightbox[pics-1207084029]" title="jquery.xmap.js デモ"><img src="http://picslog.picsmate.net/wp/wp-content/uploads/2008/04/20080402.thumbnail.jpg" width="320" height="240" alt="jquery.xmap.js デモ" class="imageframe" /></a></p>
<p>GMapを使うのって結構、設定が結構めんどくさかったりするんですよね。</p>
<p>なんで表示用の設定を書き込んだXMLを読み込むだけで、GMapを初期化できるjQuery用のプラグインを作ってみました。</p>
<p>開発をしやすいようにjQueryを使っただけなので、それほどjQueryの恩恵は感じられないプラグインですが・・・(^^;<br />
まぁ、GMapの設定を簡単にするためのものなんで・・・(^^;;;<br />
<span id="more-223"></span></p>
<p class="sub">XMapでできること</p>
<p>XMLファイルを使って、簡単にGMapが初期化できます。</p>
<p>具体的には、以下がXMLで設定できます。</p>
<ul>
<li>GMap座標の設定とマップ中央に表示し続けるアイコンを設定</li>
<li>表示するGMapコントローラーの設定</li>
<li>アイコンとマーカーの表示設定</li>
</ul>
<p>以下、jquery.xmap.jsを使ったデモページです。<br />
<a href="http://picsmate.net/sample/xmap/">デモページ</a></p>
<p class="sub">まず、jQueryとxmapを準備する。</p>
<p>使うためにですが、まず<a href="http://jquery.com/" rel="external">jQuery本家</a>で、jQueryをダウンロードしてきます。<br />
<a href="http://code.jquery.com/jquery-latest.js" rel="external">最新版のjQuery</a>(<a href="http://jquery.com/src/jquery-latest.pack.js" rel="external">Packed版</a>)</p>
<p>次に、<strong>jquery.xmap.js</strong>をダウンロードします。<br />
<a href="http://picsmate.net/sample/xmap/jquery.xmap.zip">ダウンロード</a><br />
（ZIP圧縮していますので、ダウンロード後、解凍してお使いください。）</p>
<p>あと当然ながら、<strong>GMap</strong>を利用しますので、利用登録をする必要があります。<br />
<a href="http://code.google.com/intl/ja/apis/maps/index.html" rel="external">Google マップ API</a>のサイトからGoogleアカウントを使って、APIキーを取得する必要があります。<br />
<a href="http://code.google.com/intl/ja/apis/maps/signup.html" rel="external">Google マップ API 登録ページ</a></p>
<p>この３つが揃ったら、後は簡単。<br />
設定用のXMLと、ほんの少しスクリプトを書くだけです。</p>
<p class="sub">GMapやjQueryをページに読み込む。</p>
<pre><code class="color">&lt;script src=&quot;http://maps.google.com/maps?file=api&amp;amp;v=2&amp;amp;key=[API Key]&quot; type=&quot;text/javascript&quot; charset=&quot;utf-8&quot;&gt;&lt;/script&gt;
&lt;script type=&quot;text/javascript&quot; src=&quot;jquery-latest.js&quot; charset=&quot;shift_jis&quot;&gt;&lt;/script&gt;
&lt;script type=&quot;text/javascript&quot; src=&quot;jquery.xmap.js&quot;&gt;&lt;/script&gt;
</code></pre>
<p>のような感じで、GMapを利用するページでJSファイルを読み込む。</p>
<p class="sub">XMapを開始するためのJSスクリプトをページに書く</p>
<p>本当は先に設定ファイルの書き方を説明するべきだけど、スクリプトの方が簡単で短くすみそうなので、とりあえずこっちから説明します。</p>
<pre><code class="color">&lt;div id=&quot;map&quot;&gt;
    ここにGMapを表示する予定。
&lt;/div&gt;</code></pre>
<p>みたいな「map」っていうIDのDIVタグ内に、「setting.xml」というXMLファイルで初期化した、GMapを表示させる場合を想定して、スクリプトを書くとこうなる。</p>
<pre><code class="color">&lt;script type=&quot;text/javascript&quot;&gt;
    jQuery(function() { jQuery(&quot;#map&quot;).XMap(&quot;setting.xml&quot;); });
&lt;/script&gt;</code></pre>
<p>これだけ。</p>
<p>「map」っていうIDだったので、jQuery(&#8220;#map&#8221;)と書いてるけど、「map」っていうclassの場合はもちろんjQuery(&#8220;.map&#8221;)のようになる。<br />
（ただし、IDやclassに一致するすべての要素に対して、GMapを挿入する仕様）</p>
<p>XMap()には設定ファイルとなるXMLのパスを渡すだけです。</p>
<p class="sub">GMapの設定用XMLを書く</p>
<p>まずは、設定できるすべての項目を書いたXMLだと以下のような感じになります。</p>
<pre style="height:300px"><code class="color">&lt;?xml version=&quot;1.0&quot; encoding=&quot;utf-8&quot;?&gt;
&lt;data&gt;
    &lt;show&gt;
        &lt;center lat=&quot;34.701909&quot; lng=&quot;135.494977&quot; zoom=&quot;16&quot; address=&quot;大阪駅&quot;&gt;
            &lt;img src=&quot;./module/center.png&quot; width=&quot;30&quot; height=&quot;30&quot; /&gt;
            &lt;shadow src=&quot;./module/center-shadow.png&quot; width=&quot;30&quot; height=&quot;30&quot; /&gt;
        &lt;/center&gt;
        &lt;control&gt;
            &lt;large value=&quot;true&quot; /&gt;
            &lt;small value=&quot;false&quot; /&gt;
            &lt;zoom value=&quot;false&quot; /&gt;
            &lt;type value=&quot;true&quot; /&gt;
            &lt;overview value=&quot;true&quot; /&gt;
            &lt;scale value=&quot;true&quot; /&gt;
        &lt;/control&gt;
        &lt;option&gt;
            &lt;wheelZoom value=&quot;true&quot; /&gt;
        &lt;/option&gt;
    &lt;/show&gt;
    &lt;icons&gt;
        &lt;icon name=&quot;icon-1&quot;&gt;
            &lt;img src=&quot;./module/icon-1.png&quot; width=&quot;18&quot; height=&quot;30&quot; /&gt;
            &lt;shadow src=&quot;./module/shadow-1.png &quot; width=&quot;34&quot; height=&quot;30&quot; /&gt;
        &lt;/icon&gt;
        &lt;icon name=&quot;icon-2&quot;&gt;
            &lt;img src=&quot;./module/icon-2.png&quot; width=&quot;18&quot; height=&quot;30&quot; /&gt;
        &lt;/icon&gt;
    &lt;/icons&gt;
    &lt;markers&gt;
        &lt;marker name=&quot;marker-1&quot; lat=&quot;34.701909&quot; lng=&quot;135.494977&quot; address=&quot;大阪駅&quot;&gt;
            &lt;option&gt;
                &lt;icon name=&quot;icon-1&quot; /&gt;
                &lt;drag value=&quot;true&quot; /&gt;
                &lt;title&gt;大阪駅&lt;/title&gt;
            &lt;/option&gt;
            &lt;html&gt;
                &amp;lt;h3 style=&quot;color:red&quot;&amp;gt;icon sample1&amp;lt;/h3&amp;gt;
                &amp;lt;ul&amp;gt;
                    &amp;lt;li&amp;gt;list1&amp;lt;/li&amp;gt;
                    &amp;lt;li&amp;gt;list2&amp;lt;/li&amp;gt;
                    &amp;lt;li&amp;gt;list3&amp;lt;/li&amp;gt;
                &amp;lt;/ul&amp;gt;
            &lt;/html&gt;
        &lt;/marker&gt;
        &lt;marker name=&quot;marker-2&quot; address=&quot;大阪府高津&quot;&gt;
            &lt;option&gt;
                &lt;icon name=&quot;icon-2&quot; /&gt;
                &lt;title&gt;大阪府高津&lt;/title&gt;
            &lt;/option&gt;
        &lt;/marker&gt;
    &lt;/markers&gt;
&lt;/data&gt;
</code></pre>
<p>そこそこ設定できるようにしているので、割とややこしく見えるかもしれないですが、順に説明します。</p>
<p>とりあえずXML宣言部分と、一番外のdataタグは説明を省きますが、利用する場合はこういうものだと割り切って記述するようにしてください(^^;</p>
<p>dataタグ内は大きく分類すると、show要素、icons要素、markers要素と３つに分かれています。<br />
全部一度だとわかりにくいと思うので、３つの要素を以下で順に説明します。</p>
<p class="sub">show要素内の設定について</p>
<p>「show」要素内はGmapの表示位置やコントローラーの表示など、GMapの基本的な表示に関する設定です。</p>
<p>「show」要素内の「center」要素は、GMapで表示する中心座標やズームレベルなどを設定します。</p>
<pre><code class="color">&lt;center lat=&quot;緯度&quot; lng=&quot;経度&quot; zoom=&quot;GMapのズームレベル&quot; address=&quot;地図の中心座標を住所や駅名から検索&quot;&gt;
    &lt;img src=&quot;地図の中心に表示するアイコン画像を指定&quot; width=&quot;画像の横サイズ（数値）&quot; height=&quot;画像の縦サイズ（数値）&quot; /&gt;
    &lt;shadow src=&quot;アイコンの影画像を指定&quot; width=&quot;画像の横サイズ（数値）&quot; height=&quot;画像の縦サイズ（数値）&quot; /&gt;
&lt;/center&gt;
</code></pre>
<p>中身の設定はざっとこんな感じです。</p>
<p>「center」タグ内の「address」に住所などを書くと便利ですが、見つからない場合や、検索まで時間がかかるときがあるので、緯度や経度も設定して置く方が無難です。</p>
<p>もし、緯度や経度を設定していない場合で、検索した住所の座標が見つからなかった場合は、GMapの登録を済ませたときに参考ソースでもらえる座標が、デフォルトとして適用されるようにしているので、アメリカの地図が出ます。</p>
<p>ズームレベルは「0～19」までの数値を入れてください。設定しなかった場合は、デフォルトとして「13」に設定されます。<br />
「0」に近づくほど地図をひいて（0は世界地図のようになる）、「19」に近づくほど寄っていきます。</p>
<p>「center」内にあるimgタグとshadowタグは、地図の中央にアイコンを表示する場合のみ記述します。<br />
中央にアイコンを表示したいときだけなので、「img」と「shadow」いずれか、もしくは両方のタグは省略可能です。</p>
<p>「show」要素内の「control」要素は、GMapを操作する各コントローラーを表示するかどうかを設定できます。</p>
<pre><code class="color">&lt;control&gt;
    &lt;large value=&quot;ここにtrueを書いた場合、GMapに大きいコントローラー（GLargeMapControl）を表示する&quot; /&gt;
    &lt;small value=&quot;ここにtrueを書いた場合、GMapに小さいコントローラー（GSmallMapControl）を表示する&quot; /&gt;
    &lt;zoom value=&quot;ここにtrueを書いた場合、GMapにズームのみのコントローラー（GSmallZoomControl）を表示する&quot; /&gt;
    &lt;type value=&quot;ここにtrueを書いた場合、GMapにマップ切り替え用のコントローラー（GMapTypeControl）を表示する&quot; /&gt;
    &lt;overview value=&quot;ここにtrueを書いた場合、GMapにオーバービューコントローラー（GOverviewMapControl）を表示する&quot; /&gt;
    &lt;scale value=&quot;ここにtrueを書いた場合、GMapにスケールコントローラー（GScaleControl）を表示する&quot; /&gt;
&lt;/control&gt;
</code></pre>
<p>説明するより、試してもらった方が早い気もしますが、１点だけ。</p>
<p>表示する場合はコントローラー用のタグの「value」の値を「true」にして記述する必要がありますが、非表示の場合はタグ自体を省略してもいいです。</p>
<p>「show」要素内の「option」要素は、XMapによる拡張機能です。</p>
<pre><code class="color">&lt;option&gt;
    &lt;wheelZoom value=&quot;ここにtrueを書いた場合、GMapをマウスホイールでズームレベルを操作できるようにする&quot; /&gt;
&lt;/option&gt;
</code></pre>
<p>拡張といっても、今のところマウスホイールによるズーム操作しかありません。</p>
<p>さらに実験的なものなので、もしかしたら不具合があるかもです。</p>
<p>不要な場合は「option」タグごと省略可能です。</p>
<p class="sub">iconsタグ内の設定について</p>
<p>「icons」要素内は、GMapで利用するアイコンを作成するための設定です。</p>
<p>独自アイコンを使用しない場合は、中の「icon」要素ごと「icons」タグを省略することができます。</p>
<pre><code class="color">&lt;icon name=&quot;アイコンの名前&quot;&gt;
    &lt;img src=&quot;アイコンに使用する画像のパス&quot; width=&quot;画像の横サイズ（数値）&quot; height=&quot;画像の縦サイズ（数値）&quot; /&gt;
    &lt;shadow src=&quot;アイコンの影に使用する画像のパス&quot; width=&quot;画像の横サイズ（数値）&quot; height=&quot;画像の縦サイズ（数値）&quot; /&gt;
&lt;/icon&gt;
</code></pre>
<p>「icons」タグ内で「icon」タグを繰り返し記述することで、複数のアイコンを作成することができます。</p>
<p>次の「marker」要素で、作成したアイコンを利用してGMapにアイコンを表示することができます。</p>
<p>作成したアイコンは、以下のようにスクリプトを書くと取得できます。</p>
<pre><code class="color">//すべてのアイコンを取得
var icons = jQuery('#map').XMap().$getIcon();
//アイコンを指定して取得
var icon = jQuery('#map').XMap().$getIcon('アイコンの名前');
</code></pre>
<p class="sub">markersタグ内の設定について</p>
<p>「markers」要素内は、GMapにアイコンを設置するための設定です。</p>
<p>各「marker」要素で設定した座標にアイコンを表示します。</p>
<p>GMapにアイコンを設置しない場合は、「markers」要素ごと省略が可能です。</p>
<pre><code class="color">&lt;marker name=&quot;マーカーの名前&quot; lat=&quot;緯度&quot; lng=&quot;経度&quot; address=&quot;表示する住所や駅名を指定&quot;&gt;
    &lt;option&gt;
        &lt;icon name=&quot;icons内で作成したアイコンの名前&quot; /&gt;
        &lt;drag value=&quot;ここにtrueを書いた場合、アイコンをドラッグ＆ドロップで移動できるようになる&quot; /&gt;
        &lt;title&gt;アイコンの上にマウスが来たときに、ここに書いた文字がツールチップとして表示させる&lt;/title&gt;
    &lt;/option&gt;
    &lt;html&gt;
        アイコンをクリックしたときに吹き出しが出るようになる。
        （HTMLタグが利用できるけど、「&lt;」は「&amp;lt;」に、「&gt;」は「&amp;gt;」に、「&amp;」は「&amp;amp;」に変換する必要がある）
    &lt;/html&gt;
&lt;/marker&gt;;
</code></pre>
<p>「icons」タグと同じく、「markers」タグ内で「marker」タグを繰り返し記述することで、複数のアイコンを作成することができます。</p>
<p>「marker」要素の「lat」や「lng」、「address」などの使い方は、GMapの中心を決めるために指定した「center」要素の時と基本的に同じです。</p>
<p>ちょっとだけ違うのは、「lat」、「lng」を指定せずに「address」を指定した場合、検索した住所の座標が見つからないと、GMapにアイコンを追加しません。</p>
<p>アイコンの表示が必須の場合は、検索よりも緯度や経度を直接設定する方が確実ということです。</p>
<p>「marker」要素内の「option」で表示するアイコンなどの細かな設定が行えます。<br />
アイコンの設定が不要な場合は省略可能です。</p>
<p>「option」要素の「icon」は、「icons」要素内で作成したアイコンの名前を指定することで、表示するアイコンに独自に作成したアイコンを使用できます。</p>
<p>「option」要素の「drag」は、「value」に「true」を記述することで、配置したアイコンをドラッグ＆ドロップで移動させることができるようになります。</p>
<p>「option」要素の「title」は、アイコンにマウスが乗ったときに、ツールチップを表示させる文章を記述します。<br />
「title」にはHTMLタグは利用できません。</p>
<p>「option」要素内の「icon」、「drag」、「title」の各要素も省略可能です。</p>
<p>「marker」要素内の「html」を設定すると、アイコンのクリック時に噴出しを表示することができます。<br />
HTMLタグが利用できるので、「option」要素の「title」で指定したツールチップよりも、詳細な情報を表示させることができます。</p>
<p>「html」要素も省略することができます。</p>
<p>作成したマーカーは、以下のようにスクリプトを書くと取得できます。</p>
<pre><code class="color">//すべてのマーカーを取得
var markers = jQuery('#map').XMap().$getMarker();
//マーカーを指定して取得
var marker = jQuery('#map').XMap().$getMarker('マーカーの名前');
</code></pre>
<p class="sub">その他</p>
<p>後でGMapオブジェクトを利用したいときは、以下のようにスクリプトを書くと取得できます。</p>
<pre><code class="color">var gmap = jQuery('#map')._GMap2();
</code></pre>
<p>実際、jQuery(&#8216;#map&#8217;)で一番最初に見つかったエレメントに対するGMapオブジェクトを返すので、適用したGMapオブジェクトが複数ある場合には</p>
<pre><code class="color">var gmaps = [];
jQuery('.map').each(function(i)
{
    gmaps[i] = jQuery(this)._GMap2();
});
</code></pre>
<p>のようにするといいかも。</p>
<p>GClientGeocoderを利用する場合は、</p>
<pre><code class="color">var geo = jQuery("#map")._Geo();
geo.getLatLng(text, function(){});
</code></pre>
<p>のように利用することもできます。</p>
<p>いまのところ、Geocoderはオブジェクト毎に作ってしまうので、ここは修正しないといけないかな・・・。</p>
<p>最後に、GMapのコントロールの表示／非表示を切り替える（表示されている場合は非表示に、非表示の場合は表示する）関数をXMap内に持たせていますので、利用いただける場合は、利用してください。</p>
<pre><code class="color">//大きいコントロールの表示切替
jQuery("#map").XMap().$switchControl('large');
//大きいコントロールとスケールの表示切替
jQuery("#map").XMap().$switchControl(['large','scale']);
</code></pre>
<p class="sub">最後に</p>
<p>一応、ライセンスについてはjQueryに合わせてGPLライセンスとします。</p>
<p>このスクリプトを利用して発生した損害につきまして、一切責任は負いません。<br />
いつもどおり、自己責任でお使いください。</p>
<p>関連記事：<br />
<a href="http://picslog.picsmate.net/2008/01/07/174/">UTF-8以外の文字コードで作成したページでGmapを利用する</a></p>
]]></content:encoded>
			<wfw:commentRss>http://picslog.picsmate.net/2008/04/02/223/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>7-zipで選択中のファイル(またはフォルダ)を圧縮するMDIE用スクリプト「select2zip.js」</title>
		<link>http://picslog.picsmate.net/2008/01/31/181/</link>
		<comments>http://picslog.picsmate.net/2008/01/31/181/#comments</comments>
		<pubDate>Thu, 31 Jan 2008 14:01:58 +0000</pubDate>
		<dc:creator>Mizugame</dc:creator>
				<category><![CDATA[MDIE]]></category>
		<category><![CDATA[javascript]]></category>
		<category><![CDATA[プログラム]]></category>
		<category><![CDATA[日記]]></category>

		<guid isPermaLink="false">http://picslog.picsmate.net/2008/01/31/181/</guid>
		<description><![CDATA[
久々にMDIEスクリプトを書いてみました。
フォルダ単位で圧縮をかけたいときに、いちいち圧縮が終わるのを待って次のを圧縮する・・・といった地道な作業をしていました。
これが結構面倒くさいので、一覧を渡して圧縮してくれる [...]]]></description>
			<content:encoded><![CDATA[<p><a href="http://picslog.picsmate.net/wp/wp-content/uploads/200801311.jpg" rel="lightbox[pics181]" title="200801311.jpg"><img src="http://picslog.picsmate.net/wp/wp-content/uploads/200801311.thumbnail.jpg" width="320" height="120" alt="200801311.jpg" class="imageframe" /></a><br />
久々にMDIEスクリプトを書いてみました。</p>
<p>フォルダ単位で圧縮をかけたいときに、いちいち圧縮が終わるのを待って次のを圧縮する・・・といった地道な作業をしていました。<br />
これが結構面倒くさいので、一覧を渡して圧縮してくれるといいな・・・と思っていたんですが。</p>
<p>意外と「これだ！」っていうソフトってないんですよねぇ。<br />
（いいのを知っている人がいたら、ぜひ教えてください！）</p>
<p>7-zipがコマンドラインに対応していたので、MDIE用に選択中のファイルを1個につき、1つの圧縮ファイルを作成するスクリプトを書いてみました。<br />
※<a href="http://picslog.picsmate.net/2008/12/20/645/" rel="internal">2008-12-20時点で更新</a>しました。<br />
<span id="more-181"></span></p>
<p>今回は圧縮プログラムに「<a href="http://www.7-zip.org/" rel="external">7-zip</a>」を利用していますので、別途入手する必要があります。</p>
<p>というわけで、とりあえず以下がスクリプト。</p>
<pre style="height:300px"><code class="color">/*** 設定開始 ***/
/*
 * [zipExeDir] string
 * 7z.exeをインストールしたフォルダ
 * フォルダセパレータは\\\\で記述
 * 最後は\\\\で閉じておく
 *
 * 例：
 * var zipExeDir = "C:\\\\Program Files\\\\7z\\\\"
 *
 * ※環境変数のパスに通している場合は空で良い
 */
var zipExeDir = "";
/*
 * [targetType] object
 * 圧縮対象にフォルダ、またはファイルを入れるかどうかのフラグ
 *   targetType
 *     'dir':  フォルダを圧縮対象に入れるか[true,false]
 *     'file': ファイルを圧縮対象に入れるか[true,false]
 *
 *     true :対象にする
 *     false:対象にしない
 */
var targetType = {
    'dir':true,
    'file':true
};
/*
 * [logMode] boolean
 * 圧縮状況のログを書き込むかどうか
 * true :残す
 * false:残さない
 */
var logMode = true;
/*
 * [exitMode] boolean
 * ユーザが圧縮プロンプトを終了させた場合、
 * 残りのファイル、またはディレクトリの圧縮を継続するか
 * true :継続する
 * false:継続しない
 */
var exitMode = false;
/*** 設定終了 ***/

/*** dir2zip method ***/
var $select2zip = {
    'fso':  new ActiveXObject("Scripting.FileSystemObject"),
    'shell':new ActiveXObject("WScript.Shell"),

    /**
     * getDateFormat(now)
     *
     *   @param object now:Date Object
     *   @return yyyy年m(m)月d(d)日 hh:mn:ss
     */
    'getDateFormat':function (now) {
        return now.toLocaleString();
    },
    /**
     * getTimeFormat(now)
     *
     *   @param object now:Date Object
     *   @return hh:mn:ss.milliseconds
     */
    'getTimeFormat':function (now) {
        return now.getHours() + ":"
                + now.getMinutes() + ":"
                + now.getSeconds() + "."
                + now.getMilliseconds();
    },
    /**
     * getLogFile(path)
     *
     *   @param object fso:Scripting.FileSystemObject
     *   @param string path:log faile path
     */
    'getLogFile':function (path) {
        if (this.fso.FileExists(path)) {
            return this.fso.GetFile(path).OpenAsTextStream(8);
        } else {
            return this.fso.CreateTextFile(path, false);
        }
    },
    /**
     * getArchiveName(path)
     *
     *   @param string path:log faile path
     */
    'getArchiveName':function (path) {
        var name = "";

        if ($select2zip.fso.FolderExists(FolderView.Items(i).Path) &#038;&#038; targetType.dir == true) {
            name = this.fso.GetFileName(FolderView.Items(i).Path);
        } else {
            if ($select2zip.fso.FileExists(FolderView.Items(i).Path) &#038;&#038; targetType.file == true) {
                if (!(name = this.fso.GetBaseName(FolderView.Items(i).Path))) {
                    name = this.fso.GetFileName(FolderView.Items(i).Path);
                }
            }
        }
        return name;
    },
    /**
     * uniqueFilePath(path)
     * // pathのファイルがすでに存在する場合、番号を振ったファイル名の作成を試みる
     *
     *   @param string path:string file path
     *   @return string path:unique file path
     */
    'uniqueFilePath':function (path) {
        // パスを分解
        var parent = this.fso.GetParentFolderName(path),
            name   = this.fso.GetBaseName(path),
            ext    = this.fso.GetExtensionName(path);

        if (this.fso.FileExists(path)) {
            for (var j=1; j< =100; j++) {
                uniquePath = parent + "\\\\" + name + "(" + j + ")." + ext;
                if (!this.fso.FileExists(uniquePath)) {
                    return uniquePath;
                }
            }
        } else {
            return path;
        }
    },
    /**
     * exitMessage(code)
     *
     *   @param string code:exit code
     *   @return code:exit message
     */
    'exitMessage':function (code) {
        switch (code)
        {
            case 0:
                $property.count.success++;
                return "圧縮完了。";
                break;

            case 255:
                return "ユーザによって実行がキャンセルされました。";
                break;

            default:
                $property.count.failure++;
                return "圧縮に失敗しました。(不明な終了コード:" + code +")";
                break;
        }
    },
    /**
     * cmdThrow(zip, path)
     *
     *   @param string zip:create file name
     *   @param string path:press file or folder
     *   @return exit code
     */
    'cmdThrow':function (archive, path) {
        return this.shell.run('"' + zipExeDir + '7z.exe" a -tzip'
                             + ' "' + archive + '" "' + path + '"', 7, true);
    }
}
/*** end method ***/

/*** begin property ***/
$property = {
    'path':{
        'parentDir':$select2zip.fso.GetParentFolderName(FolderView.Items(0).Path) + "\\\\",
        /*
         * ログファイルのパス
         * MDIEのインストールフォルダに、ログを残す場合は下記に変更。
         * 'logFile':$select2zip.fso.GetParentFolderName(MDIE.exePath) + "\\\\" + "select2zip.log"
         */
        'logFile'  :$select2zip.fso.GetParentFolderName(FolderView.Items(0).Path) + "\\\\" + "select2zip.log"
    },
    'count':{
        'Items': FolderView.count,
        'success':0,
        'failure':0
    }
}
/* log file stream */
if (logMode == true) {
    $property.objLog = $select2zip.getLogFile($property.path.logFile);
    $property.objLog.WriteLine(">> die2zip start: " + $select2zip.getDateFormat(new Date));
}
/*** end property ***/

/*** begin main script ***/
// zip圧縮部分
press: {
    for (var i = 0; i < $property.count.Items; i++) {

        if (FolderView.Items(i).Selected) {

            var archiveName = $select2zip.getArchiveName(FolderView.Items(i).Path);

            if (archiveName) {
                var archivePath = $select2zip.uniqueFilePath($property.path.parentDir + archiveName + '.zip');

                // 開始ログ
                var logs = "  " + FolderView.Items(i).Path + " > " + archivePath + "\\r\\n"
                         + "    [" + $select2zip.getTimeFormat(new Date) + "] 圧縮開始。\\r\\n";

                // シェルから7zを起動
                var exitCode = $select2zip.cmdThrow(archivePath, FolderView.Items(i).Path);

                // 終了ログ
                logs += "    [" + $select2zip.getTimeFormat(new Date) + "] " + $select2zip.exitMessage(exitCode);

                if (logMode == true) {
                    $property.objLog.WriteLine(logs);
                }

                if (exitMode == false &#038;&#038; exitCode == 255) {
                    if (logMode == true) {
                        $property.objLog.WriteLine("    実行を中止しました。");
                    }
                    break press;
                }
            }
        }
    }
}

if (logMode == true) {
    // 結果を書き込む
    if ($property.count.success == 0 &#038;&#038; $property.count.failure == 0) {
        $property.objLog.WriteLine("  圧縮対象が見つかりませんでした。");
    } else {
        var logs = "  " + $property.count.success + "個のファイルを圧縮をしました。";
        if ($property.count.failure != 0) {
            logs += "(" + $property.count.failure + "個のファイルの圧縮に失敗。)";
        }
        $property.objLog.WriteLine(logs);
    }
}
/*** end main script ***/

// 終了をアラート
if ($property.count.success == 0 &#038;&#038; $property.count.failure == 0) {
    MDIE.echo("圧縮対象が見つかりませんでした。");
} else {
    MDIE.echo("select2zipを終了しました");
}</code></pre>
<p>今回は珍しく、結構コメントを入れたので、比較的わかりやすくなったと思っているんですが。</p>
<p class="sub">まずは、簡単に導入手順を。</p>
<ol>
<li>まず、<a href="http://www.7-zip.org/" rel="external">7-zipのダウンロードページ</a>から7-zipを入手します。<br />
（インストーラー版でも、zipを解凍するだけの方でもどっちでもいいです）</li>
<li>7-zipをインストールします。<br />
（zip版をダウンロードした場合は、解凍後に任意のフォルダに入れるだけです。）</li>
<li>次に、<a href="http://picsmate.net/sample/20080131/select2zip.zip" rel="file">select2zip.zip</a>をダウンロードします。</li>
<li>ダウンロードしたファイルを解凍して、MDIEのインストールフォルダにあるscriptフォルダ内に移動<br />
（任意のフォルダに入れてもいい）</li>
<li>select2zip.jsをエディタで開き、3行目からの「/*** 設定開始 ***/」から「/*** 設定終了 ***/」までを、環境にあわせて修正します。<br />
コメントを入れているので大丈夫かと思いますが、設定がわからない場合は、このページのコメント欄などでお知らせください。</li>
<li>MDIEを起動してメニューの「ツール」から「拡張」→「スクリプトに追加」でselect2zip.jsを登録</li>
<li>MDIEのメニューのツールからキーボードショートカットやマウスジェスチャに登録</li>
</ol>
<p>以上で、選択中のファイルやフォルダを、1個づつZIPファイルにしてくれます。</p>
<p class="sub">ザックリと現在の仕様を説明</p>
<p>スクリプトファイルから7z.exeにコマンドを送った際、コマンドプロンプトをタスクバーに最小化して残しています。<br />
なのでコマンドプロンプトを終了させることで、実行を強制終了させることもできます。</p>
<p>あと、設定の中にあるexitModeをfalseに設定することで、強制終了時に圧縮対象のファイルが残っていても、処理を終了できるようになります。<br />
（大きなファイルを大量に送っていた場合などで、ユーザ側でコマンドプロンプトを終了させ続ける手間が回避できます。）</p>
<p>フォルダやファイルの圧縮ですが、選択中のファイルやフォルダが</p>
<ul>
<li>C:\\hoge\folder\</li>
<li>C:\\hoge\hoge.txt</li>
<li>C:\\hoge\hogehoge.mov</li>
</ul>
<p>だった場合は</p>
<ul>
<li>C:\\hoge\folder.zip</li>
<li>C:\\hoge\hoge.zip</li>
<li>C:\\hoge\hogehoge.zip</li>
</ul>
<p>のようにZipファイルが作成されます。</p>
<p>今のところ、ファイルだった場合は拡張子を外してzp拡張子をつけるので、選択中のファイルが</p>
<ul>
<li>C:\\hoge\hoge\</li>
<li>C:\\hoge\hoge.txt</li>
<li>C:\\hoge\hoge.mov</li>
</ul>
<p>だった場合、</p>
<ul>
<li>C:\\hoge\hoge.zip</li>
<li>C:\\hoge\hoge(1).zip</li>
<li>C:\\hoge\hoge(2).zip</li>
</ul>
<p>のようになります。</p>
<p>・・・拡張子を残すかどうかも、フラグにした方がいいかなぁ。</p>
<p>あと、今のところ選択中のファイルにzipが含まれても、圧縮をスルーするような処理は入れていません。<br />
なので、2重、３重にzipされていくこともあります。</p>
<p>圧縮ファイルを作成後、自動で元ファイルを消すなんて処理も入れていません。<br />
（完了フォルダに自動で移動するくらいは、追加してもいいかもしれない。）</p>
<p>もうちょっと、やりたい事があるので、もしかしたらバージョンアップをするかもです。</p>
<p>いつもどおり、このスクリプトを利用して発生した損害につきまして、一切責任は負いません。<br />
自己責任でお使いください。</p>
<p class="sub">以下、スクリプトを確認した環境です。</p>
<ul>
<li>Windows XP sp2</li>
<li>MDIE Ver 0.3.0.0 RC6</li>
</ul>
<p>関連情報：<br />
<a href="http://picslog.picsmate.net/2007/10/14/148/">選択フォルダの階層構造をテキストファイルに出力するMDIE用スクリプト</a><br />
<a href="http://picslog.picsmate.net/2007/10/08/146/">拡張子ごとにフォルダ振り分けを行うMDIE用スクリプト</a><br />
<a href="http://picslog.picsmate.net/2007/08/28/110/">カスタマイズ性の高い高機能ファイラ「MDIE」</a></p>
]]></content:encoded>
			<wfw:commentRss>http://picslog.picsmate.net/2008/01/31/181/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>ソースコードのハイライトを行うJavascriptライブラリ「SyntaxHighlighter」</title>
		<link>http://picslog.picsmate.net/2008/01/13/176/</link>
		<comments>http://picslog.picsmate.net/2008/01/13/176/#comments</comments>
		<pubDate>Sun, 13 Jan 2008 14:35:34 +0000</pubDate>
		<dc:creator>Mizugame</dc:creator>
				<category><![CDATA[WEB開発]]></category>
		<category><![CDATA[javascript]]></category>
		<category><![CDATA[プログラム]]></category>
		<category><![CDATA[メモ]]></category>

		<guid isPermaLink="false">http://picslog.picsmate.net/2008/01/13/176/</guid>
		<description><![CDATA[
以前の記事で、いくつかのJavascriptベースのソースハイライトライブラリを紹介しましたが、最近「SyntaxHighlighter」が気になってきたので試してみました。

前回の比較もかねて、サンプルには以前の記 [...]]]></description>
			<content:encoded><![CDATA[<p><a href="http://picslog.picsmate.net/wp/wp-content/uploads/20080113.jpg" rel="lightbox[pics-1200231999]" title="20080113.jpg"><img src="http://picslog.picsmate.net/wp/wp-content/uploads/20080113.thumbnail.jpg" width="320" height="240" alt="20080113.jpg" class="imageframe" /></a><br />
<a href="http://picslog.picsmate.net/2007/11/08/149/">以前の記事</a>で、いくつかのJavascriptベースのソースハイライトライブラリを紹介しましたが、最近「<a href="http://code.google.com/p/syntaxhighlighter/" rel="external">SyntaxHighlighter</a>」が気になってきたので試してみました。<br />
<span id="more-176"></span></p>
<p>前回の比較もかねて、サンプルには以前の記事で使ったソースを利用しました。<br />
<a href="http://picsmate.net/sample/20080113/SyntaxHighlighter/" rel="external">今回試したSyntaxHighlighterのデモページ</a></p>
<p>リスト番号が表示されるのでソースがわかりやすく、説明もしやすくなりそうです。</p>
<p>しかし、「<strong>empty</strong>」がなぜ2重に出力されるんだ（T_T<br />
・・・片方だけハイライトされてるし。<br />
でも、これはPHPのソースハイライトを行った場合だけ2重になるらしいので「shBrushPhp.js」内の問題か。</p>
<p>あと気になった点は、コードハイライトを行った部分に書いたHTMLタグが、勝手に視認できるように変換されてるところ・・・<br />
つまり「&lt;」が「&amp;lt;」、「&gt;」が「&amp;gt;」に。</p>
<p>場合によっては便利だけど、これはオプションで指定できるようにしてほしい。</p>
<p>ソースコードにはcodeタグを書きたくなる私には、ちょっと困った仕様です<br />
（我慢するか・・・改造するか</p>
<p>・・・と、先に文句ばかり書いてしまったけど、簡単に利用できて、デフォルトでも見た目もスマートで使い勝手はいいです。<br />
やっぱり、リスト番号が表示されるとわかりやすいし。</p>
<p class="sub">以下、簡単に使い方を説明。</p>
<ol>
<li>まず、<a href="http://code.google.com/p/syntaxhighlighter/" rel="external">syntaxhighlighter &#8211; Google Code</a>に行ってライブラリをダウンロード</li>
<li>ダウンロードした圧縮ファイルを解凍</li>
<li>解凍したファイルからScriptsフォルダとStylesフォルダのファイルを以下のように取り込む。
<pre><code class="color">&lt;link type="text/css" rel="stylesheet" href="./Styles/SyntaxHighlighter.css"&gt;&lt;/link&gt;
&lt;script language="javascript" src="./Scripts/shCore.js"&gt;&lt;/script&gt;
&lt;script language="javascript" src="./Scripts/shBrushPhp.js"&gt;&lt;/script&gt;
&lt;script language="javascript"&gt;
window.onload = function() {
	dp.SyntaxHighlighter.HighlightAll('code');
}
&lt;/script&gt;</code></pre>
<p>※上記はPHPコードのハイライトを行う場合です。</li>
<li>下記のように、ハイライトを行うソースをpreタグ（もしくはtextareaタグ）で囲む。<br />
その後、name属性を追加し、class属性に言語コードを記述しておく。</p>
<pre><code class="color">&lt;pre name="code" class="php"&gt;
ハイライトを行うコードを記述
&lt;/pre&gt;</code></pre>
</li>
</ol>
<p>これで設置は完了です。<br />
JavascriptやCSSのディレクトリパスは、任意で変更して埋め込むようにしてください。</p>
<p>SyntaxHighlighterの言語対応は、<a href="http://code.google.com/p/syntaxhighlighter/wiki/Languages" rel="external">Languages &#8211; syntaxhighlighter &#8211; Google Code</a>で一覧できます。</p>
<p>言語ごとのハイライト用スクリプト名は、「shBrush[言語コード].js」の規則で登録されています。<br />
どのスクリプトを読み込めばいいのかが、直感的にわかっていいですね。</p>
<p>perlはサポートされてないようです。<br />
ある程度は別の言語で対応できそうですが。</p>
<p class="sub">上記内容とかぶりますが、まとめとして下記のような問題があります。</p>
<ul>
<li>preタグにname属性は存在しないが適用する必要がある。（使用するとValidできない）</li>
<li>ハイライト内でタグを配置できない。</li>
</ul>
<p>人によっては利用をためらいそうですが、改善されることを祈って今後に期待です。</p>
<p>細かいですが、PHPの変数はハイライトにしてくれないんですね。<br />
・・・残念。</p>
<p>関連記事：<br />
<a href="http://picslog.picsmate.net/2007/11/08/149/">ソースコードのハイライトを行うJavascriptプログラムの比較</a></p>
]]></content:encoded>
			<wfw:commentRss>http://picslog.picsmate.net/2008/01/13/176/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
	</channel>
</rss>
