2009年7月31日金曜日

Gmailのエイリアス機能で複数のメールアドレスを使い分ける

社内で知らない人がいたので紹介。

メールアドレスの重複チェックしているシステムをテストするときに便利なのがGmailのエイリアス機能。

hoge@gmail.com

というアカウントを持っていた場合、

hoge+1@gmail.com
hoge+shopping@gmail.com

でもhoge@gmail.comの受信箱に届く。+以降は何を指定してもok。

個人的には買い物や会員登録などサイトによって+以降を変更してラベルをつけて管理している。便利。

でも「+」を禁止しているサイトも最近増えてきたので、この技が使えない場合も多い。

その他マニアックなGmailの使い方は下記リンクを参考に。

Gmailの使い方!

2009年7月30日木曜日

jQuery UIでリッチなユーザーインターフェースを実装する

タブ機能をもっと簡単に実現できないかなと探していたら見つけたjQuery UI

jQueryを使った

  • タブ機能
  • スライド式表示・非表示切替
  • ダイアログ
  • カレンダー
  • プログレスバー
  • スライドバー
  • ハイライト表示
  • ドラッグ&ドロップ

などを簡単に実装できる。詳しくはデモサイトで。

ダウンロードするときに必要な機能だけ選択すると、一つのjsファイルにしてダウンロードできる。それぞれ便利そうなので、どれを選択するか迷う。

ここで選ばなくてもダウンロードして解凍したフォルダ内のdevelopment-bundle/uiに個別jsファイルが置いてあるので、必要なjsファイルだけ個別に読み込むことも可能。

UI的に必要なものは、ほぼ網羅されているので、これを使えば簡単にリッチなサイトが実現できそう。

CoTVのUIはjQueryとjQuery UIを中心に開発していこう。

2009年7月29日水曜日

【FFMpeg】ネットワークカメラとffserverを使ってライブ配信

前の記事では、USBカメラを使ってライブ配信をしてみたけど、今度はネットワークカメラを使ってライブ配信をやってみた。

CoTVの機能拡張にもなるしね。

安価なUSBカメラと違ってネットワークカメラはちょっと高め。定価が20万円ぐらい。

でもカメラ自体にサーバ機能があって、直接http経由でアクセスするだけで、ライブ配信を見れたり操作できたりするので、20万円でも安いと思う。

今回は複数のネットワークカメラの映像をリアルタイムエンコードして、次のことを試してみた。

  • ネットワークカメラ自体に接続制限(30人ぐらい)があるが、これを超えた人数のライブ配信を可能とする
  • 複数のカメラの映像を1つの画面で並べて表示する
  • 音声も取得、配信する

ネットワークカメラはPanasonic, Sony, Canonなどが出しているけど、外部からアクセスできるSDKを提供してくれているCanonのカメラを使うことにした。

ちなみに聞いた話だとカメラ性能はPanasonicの方がいいらしい。

使ったカメラはCanon VB0-C60。マイクとスピーカーは内蔵されていない。

別製品のVK-16とかカメラに付属しているVK-Liteを使うと複数のカメラを並べて表示ができる(もちろん音声も)。

さて、本題。

FFMpegのインストールは前の記事を参考に。

ライブ配信可能にするffserverはFFMpegのインストールと同時に使えるようになる。

ffserverの設定ファイルをソースからコピー
# cp /opt/software/ffmpeg-0.5/doc/ffserver.conf /etc/

設定ファイルを編集。設定の仕方はこの辺を参考に。
# vi /etc/ffserver.conf

feed1.ffmをfeedに指定して、複数のFormatを記述できるが、これはfeed1.ffmに出力されてきた動画を指定した分だけ同時にエンコードする。その分CPUパワーは必要。

BitRateなどはkbits/sなのでFFMpegの変換オプションより0が3つ少なくなるので注意。

設定後ffserverを起動。バックグラウンドで。
# ffserver &

http://<サーバIP>:8090/stat.html

にアクセスするとffserverの状態を確認できる。

で、ネットワークカメラの映像を入力としてリアルタイムエンコードをしてみる。

# ffmpeg -i 'http://192.168.100.1/-wvhttp-01-/video.cgi?v=mp4:640x480:5:15' -b '512000' -r '15' http://localhost:8090/feed1.ffm

変換が無事開始されれば、ライブ配信が開始されているのでstat.htmlから確認する。エラーで怒られる場合は、feed1.ffm宛てではなく普通にmp4とかで変換できるかを確認。

このときのffserver.confの箇所はこんな感じ。

<Stream test.swf>
Feed feed1.ffm
Format swf
VideoFrameRate 15
VideoSize 640x480
VideoBitRate 512
VideoBufferSize 80
VideoGopSize 30
#AudioBitRate 256
#VideoIntraOnly
NoAudio
</Stream>

ffmpegの変換オプションとffserver.confの値が一致しないと変換に失敗するので注意。

ffserverを再起動する場合は
# fg
Ctrl-Cで強制終了
# ffserver &

ffserver.confの値を変更すると
Codec bitrates do not match for stream
と怒られたりするので、ffserver.confを変更したあとは

# rm –f /tmp/feed1.ffm

で削除したほうがいいみたい。

なんかのタイミングで別ジョブになった場合は
# ps –A
# kill 10001
とかで直接プロセスをkillする。

誰かが起動スクリプト作ってそう。あとで検索してみよう。

音声もリアルタイムエンコードできたけど、動画と一緒にするとずれる。同期をとるのが大変そう。

2009年7月27日月曜日

オープンソースのグループウェア「Aipo(アイポ)4」

のんだくれに教えてもらって試す機会がなかったので、そのうち試すためのメモ。

オープンソースで開発されている「Aipo4」というグループウェア

機能紹介をみると、カレンダー(施設予約)、プロジェクト管理、伝言メモ、携帯対応など基本機能はしっかりとおさえている感じ。

また試したら追記予定。

2009年7月24日金曜日

自治医科大学での講演が動画配信されているのが気になった

CoTVで動画配信を提供しているので、他の動画配信サービスも気になるところ。

そんなんで検索してたら自治医科大学で、講座をまるごと公開しているサイトにたどり着いた。

自治医科大学公開講座講演メニュー

内容は最近流行の子供に関する問題とか、がんとかいろいろ。

普通に勉強になりそう。

そしてCoTVの可能性も感じた。

前に紹介したポータルサイトTeniteo.jp(テニテオ)のママさんたちも勉強になる内容じゃないかな?

今度の打合せで紹介してみよう。

2009年7月23日木曜日

PDFを編集するフリーソフト「PDF-XChange Viewer」

PDFを編集したくて調査したメモ。

既存のPDFの文字を隠したり、コメントを追記したりするにはこのフリーソフトで十分。ダウンロードしてインストールするだけ。

【窓の社】PDF-XChange Viewer本家

インストール後はEdit→Preferenceから言語を日本語に変更。あとはフィーリングで操作できる。

↓吹き出し、コメント、スタンプ、図形描画(四角で文字を隠す)を使ってみた

image

保存して右下のAcrobat Reader起動で確認するとこんな感じ。

image

フリーでここまでできるのはすごい。

さらにファイル→ドキュメントのプロパティからセキュリティの設定で

  • 印刷を禁止したり
  • 編集するためのパスワードを設定したり
  • ファイルを開くときのパスワードを設定したり

できてしまう。acrobatいらない?他の商用ソフトがかわいそう・・・。

有償バージョンはさらに便利な機能が使えるらしい。ここの「PRODUCT COMPARISON CHART HERE!」から製品ごとの機能比較が参照できる。

・・・よく分からなかったけど。

あと調べていて見つけたのが、OpenOfficeでPDFを編集できるようにするプラグイン(フリー)。ダウンロードはここから。

OpenOffice3.0以上をインストールしておく必要あり。

でも、試しにPDFを読み込んでみたら、画像が表示されなかったりレイアウトが崩れたりしたので今のところはまだ実用レベルではないかも。

 

<2010/01/22 追記>

レイアーを重ねて表示しているだけなので、本当に編集しているわけではない。

illustratorとかで開くと元のpdfが参照できてしまうので重要な文書は画像でエクスポートするかAcrobat(本当に編集できるソフト)を使う必要がある。

PrimoPDFとかで出力しても元のPDFを参照できる。PDF(Portable Document Format)は元の文書の著作権を守る側面もあるためしょうがない。

 

<関連リンク>

2009年7月22日水曜日

【Linux】Lamppの環境にFFMpeg-PHPをインストール

Lamppを使えると導入が楽できるので、FFMpeg-phpをLamppで使えるようにしたメモ。httpdの環境にインストールした記事も参考に。

FFMpegの導入はまとめページを参考に。

Lamppをインストールする場合はffmpeg-phpのコンパイルもLamppを使う。

LamppのページからDevelopment packageをダウンロード

# mv xampp-linux-devel-1.7.1.tar.gz /opt/
# tar xzvf xampp-linux-devel-1.7.1.tar.gz

これでコンパイル環境が整った。

次はffmpeg-phpのコンパイルとインストール

# tar jxvf ffmpeg-php-0.6.2-ex.tar.bz2
# cd ffmpeg-php-0.6.2
# /opt/lampp/bin/phpize
# ./configure --with-php-config=/opt/lampp/bin/php-config
# make
# make install

/opt/lampp/lib/php/extensions/no-debug-non-zts-20060613/にffmpeg.soができている。

lamppを再起動
# /etc/rc.d/init.d/lampp restart

これで前の記事の下の方に書いたようにffmpeg-phpモジュールを動的に読み込むようにすれば使える。

php.iniに
extension="ffmpeg.so"
して常に読み込んでもO.K.(要再起動 or 再読込)

動作確認する場合は

# cd ffmpeg-php-0.6.2/tests
# /opt/lampp/bin/php getFrameCount.php

ffmpeg getFrameCount(): 240

と出力されれば正常に動作している。

2009年7月21日火曜日

【Linux】FFMpegを使った動画配信サーバーの環境構築まとめ

このブログに情報は載せているけど、私以外でももうちょっと簡単に導入できるように情報をまとめてみた。

▼FFMpegのインストール手順

  1. 便利そうなコーデックのコンパイルとインストール(説明ページ) 。FFMpegのインストールは別の記事で。
  2. 高圧縮率のh264コーデックのコンパイルとインストール(説明ページ
  3. FFMpeg本体のコンパイルとインストール(説明ページ

▼FFMpegの機能をPHPから呼び出せるモジュールのインストール

  1. FFMpeg-phpのコンパイルとインストール(説明ページとサンプル
  2. Lamppの環境にインストールする場合はこちら

▼携帯用(Docomo, Au, Softbank)に対応した動画を作成するためにMpeg(3gp)動画を操作するツールのインストール

  1. Gpac(MP4Box)のコンパイルとインストール(説明ページ

 

▼その他FFMpeg関連記事のリンク

 

▼外部リンク

2009年7月16日木曜日

Teniteo.jp(テニテオ) ママさんのためのポータルサイト

開発に携わったので紹介。

今月の15日から創刊されたフリーペーパー「テニテオ」のポータルサイト。

完成された雑誌を頂いたので拝読。

フリーペーパーであるにも関わらず120ページものボリューム。

ママさんではないけれど「しつけのコツ」とか「食育のギモン」など普通に読んでしまった。緊急病院リストもママさんにとっては貴重な情報だと思う。

これをフリーでやっているのはすごい。

なぜ「teniteo」なのか聞いてみたら、

「いや特に・・・」

ということだったので深い意味ないらしい。

もうすぐママさんになる人にもお勧め。

サイトの方ももっと気合い入れて作らないとね。

配っているのはアピタとかジャスコとか。設置店リスト

もってない人もオンラインで読むことができる。バックナンバーから。

会員限定のプレゼントとかアンケートのプレゼントとか会員数が少ない今がチャンス。

2009年7月10日金曜日

【JavaScript】IE6だと画像が表示されたり、されなかったり

またもやIE6でちょっと嵌ったのでメモ。

IE6 SP2(Windows XP SP2のIE)だとgif画像がなぜか表示されない。タグは生成されているけど、右クリック→画像の表示とやると見える。しかもブラウザによって見えたり見えなかったりするので、読み込みとかキャッシュが関連するのではないかと調べてみた。

ちなみに現象が起きたのはWordpressのcustom-smilies-seを使って顔文字(絵文字)をポップアップで表示するとき。

参考になったのはここのサイト。

要はJavascriptでimgタグのsrcにセットしていると、画像が読み込まれる前に処理が終わってしまった場合、画像が画面に表示されない。

一度ブラウザにキャッシュされている画像は表示される。

なので、画面を表示するときにimageオブジェクトを使って先行読み込みをしてあげれば良い。

簡単なJavaScriptのコードは以下

objImage = new Image();
objImage.src="test.gif";

genlist_post.js.phpに追加したコードは以下

preLoadImage();
function preLoadImage() {
  <?php
    $i = 1;
    foreach ($clcs_smilies as $k => $v) {
        echo 'objImage_' . $i . ' = new Image();';
        echo 'objImage_' . $i . '.src = "' . $imagesdirurl . $v . '";';
        $i++;
    }
    ?>
}

さらに画面が表示するまで時間がかかるようになったので、ベタで表示する方法に変更するかも。

2009年7月9日木曜日

【JavaScript】IE6でもmin-width, max-widthを使えるようにする

結局使わなかったけど、今後使う機会がありそうなのでメモ。

IE6で
min-width
max-width
min-height
max-height
を指定するやり方。

一番簡単なのはminmax.jsというJavaScriptを読み込むのが早い。

body要素だけでなく、imgタグなどにも適用してくれるので便利。

欠点は適用されるまで(表示した瞬間は)元のサイズで表示されてしまうこと。

さらにie8だとエラーが起きるので、回避の仕方としてはtry catchを以下のように記述する。

36行目あたり

try {
  em.style.setExpression('width', 'minmax_checkFont()');
  document.body.insertBefore(em, document.body.firstChild);
}
catch(err){}

バージョンアップで対応してるかも。この時点でのバージョンは1.0

2009年7月8日水曜日

【Linux】UVC対応カメラをCentOSで認識させる

動画のストリーミングライブ配信の調査でffmpegとffserverでライブ配信したときのメモ。

まずはUSBカメラをCentOSに認識させるところから。UVC(USB Video Device Class)対応カメラなら共通のドライバをインストールすることで対応可能。

Linux kernelのバージョンが2.6.26以上ならUVCドライバが標準でついているので別途インストールは必要ないらしい。最近のUbuntuだったらカーネルのバージョンが新しいので標準でついている。

やってみたのはCentOS5.2でkernel 2.6.18-92.1.22.el5。64bit OS。

ちなみにカーネルのバージョンを確かめるのは
# uname –a

UVCドライバについてはまずここ(英語)を参照。サポートしているデバイスの一覧があるので自分のWebカメラが対応しているか確認。

そこの下の方にリンクがあるけど、ドライバはここのページからダウンロード。ページの上にあるgzのリンクから落とす。

サーバに配置して解凍+インストール

# tar xzvf uvcvideo-14d5abfc0d7e.tar.gz
# cd uvcvideo-14d5abfc0d7e
# make
# make install

コンパイルに必要なgccとかkernel-develは先にインストールが必要

これでログファイルを監視しながらUSBを挿してみる

# tail -f /var/log/messages

挿した瞬間に次のメッセージが表示されればOK。

kernel: usb 1-1: configuration #1 chosen from 1 choice
kernel: Linux video capture interface: v2.00
kernel: uvcvideo: Found UVC 1.00 device <unnamed> (046d:0992)
kernel: input: UVC Camera (046d:0992) as /class/input/input3
kernel: usbcore: registered new driver uvcvideo
kernel: USB Video Class driver (v0.1.0)

ちゃんと/dev/video0ができている。

別の環境(CentOS 5.2 i686)でコンパイルしたときは下のエラーでコンパイルできなかった。

File not found: /lib/modules/2.6.18-128.1.10.el5/build/.config at ./scripts/make_kconfig.pl line 32, <IN> line 4.
make[1]: *** `config-compat.h' に必要なターゲット `.myconfig' を make するルールがありません.  中止.

kernel-develをインストールしてないだけかと思い別途インストールしても直らない。

どうやらkernel-develを参照したいみたいなのでシンボリックリンクを手動で作成。

# mv /lib/modules/2.6.18-128.1.10.el5/build /lib/modules/2.6.18-128.1.10.el5/build.bak
# ln -s /usr/src/kernels/2.6.18-128.1.16.el5-686/ /lib/modules/2.6.18-128.1.10.el5/build

これでmakeとmake installが通った。

実は64bitのCentOSがVMware Server 2.0がインストールされていて、ゲストのCentOSにffmpegをインストールしていたので、2つドライバをインストールする必要があったのです。

ゲストマシンにUSBを認識させるためには「USB Controller」を追加して、上に出てくるUSBマークから選択して有効にする。

image

これで無事、ホストに接続されたUSBカメラをゲストで認識することができた。

2009年7月6日月曜日

【HTML】IE6のtextareaがマウスクリックしても無反応

IE6のバグなのか分からないけど、IE6のtextareaをクリックしてもカーソルが移動せず入力可能な状態にならない現象が起きたのでメモ。

ちなみにtab移動だとちゃんとカーソルが移動する。

とりあえず適用されているCSSを調べてみて、怪しそうな

background: none;

を削除したら、無事直った・・・。

まぁ、よくあることですね。

2009年7月3日金曜日

【JavaScript】ajaxuploadのIE6でのズレをなんとかする

ファイルをアップロードするときにajaxuploadを利用して非同期にアップロードする処理を加えたけど、これがIE6でうまく動かない。

ブラウザによって「ファイル選択ダイアログ」を表示するクリックの位置がずれる。

今のところIE6だと発生するのだけれど、同じIE6でもコンソールで実行したときは大丈夫だけど、リモートデスクトップ環境で実行したときは駄目。・・・なぜ?

しょうがないのでずれても大丈夫なようにajaxuploadをハック。ajaxuploadのバージョンは3.5

295行目あたりに以下を追加

//for IE 6
if (typeof document.documentElement.style.maxHeight == "undefined") {
    input.style['margin'] = '-5px 0 0 -85px';
    input.style['fontSize'] = '32px';
    input.style['width'] = '40px';
}

IE6のときだけフォントサイズと横幅とマージンを調整。

デバッグするときはopacity=100にすると仕組みが分かる。

2009年7月2日木曜日

【PostgreSQL】PostgreSQL8.4とpgAdmin3 1.10.0がリリース

PostgreSQLが8.3系から8.4にバージョンアップしたのでメモ。

PostgreSQL 8.4プレスキット(日本語)を読むと、なんとなくどんな機能が追加されたか分かる。

追加された機能の中には特に惹かれるものはなかったけど、性能が大幅に改善されているということなので、今後は8.4を使っていこうかな。

管理ツールのpgAdminも最新版(1.10.0)がリリースされたので、こっちはすぐにでもインストールしといて損はなし。

2009年7月1日水曜日

【Wordpress】BuddyPressのアバター変更で画像の切り抜きができない

BuddyPressをインストールした直後はできていたけど、他のプラグインをインストールしたり開発していく中でいつの間にかJavascriptのエラーで失敗するようになっていた。

原因はprototype.jsとjQueryがConflict(衝突)を起こしていた。

jQuery Lightboxのプラグインをインストールすると起きる。

回避法はどこかに

function xb_jquery_conflict() {
    echo '<script language="JavaScript" type="text/javascript">';
    echo 'jQuery.noConflict();';
    echo '</script>';
}
add_action('wp_head', 'xb_jquery_conflict');

って書けば(jQuery.noConflict()を実行すれば)、O.K

これでjavascriptエラーは出なくなったけど、今度は画像を切り抜く枠が画面の端に出るようになった。これも嵌った。

プラグインのアンインストールとインストールを繰り返して、Google Analyticsを簡単に導入できるプラグイン「Ultimate GA」をインストールすることが判明。

でもロジック的に怪しいのはなかったので、Ultimate GAのせいでないかも。

注意点としては、プラグインのアンインストールしたあと、ブラウザのキャッシュを削除しないと現象が起きたままだったりする。これも嵌った要因の一つ。

プラグインをたくさん入れるとプラグイン同士の競合が恐いですね。

Related Posts Plugin for WordPress, Blogger...

Blog Archives