inputlog

Google AJAX APIを使うとjQueryをgoogleからダウンロードできます。これを使うと自分でサーバーに配置する場合に比べて以下のようなメリットがあります。

• バージョン指定を最後までしないことで最新版を利用できる
• gzipによる圧縮を自動で行ってくれる（jquery.minだと54.5 KB->16 KBへ）
• 普及すればネット全体でjQueryをキャッシュできる

デメリットとしては以下のような感じでしょうか。

• インターネットにつながっていないとライブラリが利用できない（ローカルでの確認時の問題）
• googleのサーバーが落ちたら困る（ほぼないと思いますが。。）

使い方はhtmlで読み込んでいるscript要素を以下のように書き換えるだけです。

<script type="text/javascript" src="js/jquery-1.2.6.min.js"></script>

<script type="text/javascript" src="http://www.google.com/jsapi"></script>

<script type="text/javascript">google.load("jquery", "1.2.6");</script>

google.loadで指定しているバージョンを1.2とすると1.2.xの最新バージョンを自動で読み込んでくれます。

<script type="text/javascript" src="http://www.google.com/jsapi"></script>

<script type="text/javascript">google.load("jquery", "1.2");</script>

参考サイト

• Google人気JavaScriptライブラリ配布開始、ネット全体でキャッシュ効果 | エンタープライズ | マイコミジャーナル
• AJAX Libraries API - Google Code

ubuntu8.04にJaxerをインストールして起動する際（start.shを実行する時）、エラーが出たのでその対処方法をメモ

エラーの内容

error while loading shared libraries: libexpat.so.0: cannot load shared object file: No such file or directory

解決方法

$ ls -l /usr/lib/libexpat.so*
lrwxrwxrwx 1 root root     17 2008-04-26 19:56 /usr/lib/libexpat.so.1 -> libexpat.so.1.5.2
-rw-r--r-- 1 root root 131652 2007-12-06 02:51 /usr/lib/libexpat.so.1.5.2
$ cd /usr/lib
$ ln -s libexpat.so.1.5.2 libexpat.so.0
ln: creating symbolic link `libexpat.so.0': Permission denied
$ sodo ln -s libexpat.so.1.5.2 libexpat.so.0
bash: sodo: command not found
$ sudo ln -s libexpat.so.1.5.2 libexpat.so.0
$ ls -l /usr/lib/libexpat.so*
lrwxrwxrwx 1 root root     17 2008-05-21 23:46 /usr/lib/libexpat.so.0 -> libexpat.so.1.5.2
lrwxrwxrwx 1 root root     17 2008-04-26 19:56 /usr/lib/libexpat.so.1 -> libexpat.so.1.5.2
-rw-r--r-- 1 root root 131652 2007-12-06 02:51 /usr/lib/libexpat.so.1.5.2

参考サイト VMware WebCenter Remote MKS Plug-in（zchan’s blog）

時間に余裕ができたのでyuga.jsに新機能を追加しました。追加した機能は以下です。

• 親ディレクトリへのリンクにクラスを設定と画像の変更
• 簡易タブ機能の追加

そのほか、スクロール周りのソースの整理などを行いました。

yuga.js 0.6.0 ダウンロード

最低限の使い方

XHTMLのhead要素内で次のように読み込みます。これで各機能が有効になります。

<link rel="stylesheet" href="css/thickbox.css" type="text/css" media="screen" />
<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript" src="js/thickbox.js"></script>
<script type="text/javascript" src="js/yuga.js" charset="utf-8"></script>

機能を無効にする

27行目に以下のようなコードがあります。

$(function() {
  $.yuga.selflink();
  $.yuga.rollover();
  $.yuga.externalLink();
  $.yuga.thickbox();
  $.yuga.scroll();
  $.yuga.tab();
  $.yuga.stripe();
  $.yuga.css3class();
});

この中で不要な機能はコメントアウトすることで切ることができます。たとえば、外部リンクを別ウインドウ、first-child、emptyなどのクラス付加機能をOFFにするには以下のようにします。

$(function() {
  $.yuga.selflink();
  $.yuga.rollover();
  //$.yuga.externalLink();
  $.yuga.thickbox();
  $.yuga.scroll();
  $.yuga.tab();
  $.yuga.stripe();
  //$.yuga.css3class();
});

機能のパラメータを変える

ロールオーバーのクラス名などを変えたい場合は設定をすることが可能です。fuctionの引数としてobjectの形でパラメータをセットします。 たとえば、rolloverのクラスをrollとrollgroupに、ファイル名につく名前を_overに変更するには以下のようにします。

$(function() {
  $.yuga.selflink();
  $.yuga.rollover({
    hoverSelector: '.roll',
    groupSelector: '.rollgroup',
    postfix: '_over'
  });
  $.yuga.externalLink();
  $.yuga.thickbox();
  $.yuga.scroll();
  $.yuga.tab();
  $.yuga.stripe();
  $.yuga.css3class();
});

hoverSlectorなど、何というプロパティ名で設定するかは対応するfunctionの var c = $.extend({ …となっている部分を参照してください。

新機能1：親ディレクトリへのリンクのクラス設定

今まで、yuga.jsでは自分のページに設定したリンクに対してcurrentというクラスと画像を_cr付きのものに差し替えるという機能がありました。今回はこれの拡張です。 リンク先のURLが現在見ているページの一部であった場合にparentsLinkというクラスを付加し、画像を_cr付きのものに差し替えるようにしました。 これによって、companyディレクトリ以下のhtmlでは、/company/とリンクを張った場合にparentsLinkというクラスが設定されます。

現在見ているページ： /company/map.html

元のソース：

<ul>
<li><a href="/company/">会社案内</a><ul>
  <li><a href="/company/map.html">地図</a></li>
</ul></li>
<li><a href="/service/">サービス</a></li>
<li><a href="/recruit/">求人案内</a></li>
</ul>

適用後のソース：

<ul>
<li><a href="/company/" class="parentsLink">会社案内</a><ul>
  <li><a href="/company/map.html" class="current">地図</a></li>
</ul></li>
<li><a href="/service/">サービス</a></li>
<li><a href="/recruit/">求人案内</a></li>
</ul>

index.htmlなどがついている場合はURLの一部ではないのでparentsLink設定されません。適用したくない場合にindex.htmlまで記述するなどといった使い方も可能です。

新機能2：簡易タブ機能

簡単なタブ機能です。tabNavというクラスを設定した中のa要素を調べ、リンク先に設定されているdiv要素の表示を切り替えるようになります。 最初はひとつめのa要素のタブが表示され、また、a要素にはactiveというクラスが設定されます。

<ul class="tabNav">
  <li><a href="#tab1">タブ1</a></li>
  <li><a href="#tab2">タブ3</a></li>
  <li><a href="#tab3">タブ3</a></li>
</ul>
<div id="tab1">1のタブ内容</div>
<div id="tab2">2のタブ内容</div>
<div id="tab3">3のタブ内容</div>

もっと高度な機能が必要な場合は jQuery UIのタブ機能を利用をおすすめします。

yuga.jsの0.5.3を公開します。0.5.1からの差分は以下の通りです。

• 0.5.3 : するするスクロールを高速で切りかえられた場合の動作修正
• 0.5.2 : 余計なアクセスが発生する不具合の修正

基本的にはバグフィックスですが、0.5.2で修正した内容が大きなバグなのでできればアップデートを推奨します。

yuga.js 0.5.3 ダウンロード

不具合などありましたら、この記事にコメントしていただけると助かります。

ubuntuの新しいバージョンがでたので、ゴールデンウィークの前半でWindowsをubuntuとデュアルブートにしました。

WindowsではMacとキーボード、マウスを共有するためにSynergyを便利に使っていたので ubuntuでもMacとマウス共有できるようにSynergyをインストール、その際QuickSynergyというGUIでSynergyの設定ができるソフトがリポジトリで見つかったので試してみました。

QuickSynergyを使うと簡単にSynergyを設定できます。Windowsのときにクライアントより簡単かもしれません。 しかし、バージョンが少し古いためか、まだ実装されていないのか自動起動の設定がありません。

そこで、QuickSynergyの設定を使ってSynergyを自動起動するよう設定しました。 設定を忘れないようにメモしておきます。

QuickSynergyによって作られたsynergy.confは以下にありました。

~/.quicksynergy/synergy.conf

そこで、シェルから以下のようにしたところうまくSynergyを起動できました。

$ synergys --config ~/.quicksynergy/synergy.conf

あとはシステム＞設定＞セッションから「自動起動するプログラム」タブの追加ボタンで追加します。 僕は以下のようにしました。

名前： Synergy (QuickSynergy) コマンド：synergys –config /home/{ユーザー名}/.quicksynergy/synergy.conf コメント：QuickSynergyの設定を使ってSynergyサーバを起動

これで次回ログイン以降は自動的にSynergyサーバが起動します。 （/home/{ユーザー名}/の部分、~/ではダメでした。。なんでだろ？）