Tabulator - これはすごい。HTMLテーブルを高機能に MOONGIFT
テーブル表示はWebシステムのデファクトとも言えます。業務システムはいうに及ばず、管理者画面などでも必ず求められる表示です。そしてただ表示すればいいという訳ではなく、ソートやフィルタリング、インラインでの編集など様々な機能が求められるものです。 そんな多機能なテーブル表示を実現してくれるのがTabulatorです。多くのニーズを満たしてくれることでしょう。 Tabulatorの使い方 てんこ盛りなデモテーブル。ざっと見てもフィルタ、ページネーション、グラフ表示、ソートなどの機能が確認できます。 インライン編集もサポートされています。 データに合わせて幅を自動調整。 行をクリックして展開する機能。 カラムをグループ化。 カラムを縦に。これはカラムが多い時に便利そうです。 ドリルダウン。 テーブルを入れ子にもできます。 スパークライン表示。 フッターで集計。 HTMLテーブルを変換する機能もあ
p2.js·JavaScript製の物理エンジン MOONGIFT
物理エンジンは様々なケースで利用されています。ゲームはもちろんのこと、オブジェクトが動く際に、それがよりリアルに感じられるためには物理エンジンが欠かせません。複数のオブジェクトが関係し合う場合も同様です。 有名どころとしてはBox2dが知られていますが、今回はp2.jsを紹介します。Web上で動作するJavaScript製の物理エンジンです。 p2.jsの使い方 p2.jsは多数のデモを用意していますが、今回はその一部を紹介します。 二つくっついたオブジェクト同士が衝突するデモ。 一つの物質が横に飛んでいくもの。 多数のオブジェクトが衝突するデモ。 車のデモ。矢印キーで動かせます。 実際に車を動かしてみたところ。バネもあって、ショックを吸収しながら進んでいるのが分かります。 p2.jsは衝突検出、コンタクト、摩擦、反発、モーター、スプリングなどの機能が備わっています。サンプルコードは次のよ
DevOOPS - 多数のパターンを用意したBootstrap管理画面
デザインでシステムの品質が決まるわけではありません。しかし、それでも全くデザインされていないシステムよりも見た目が整っている方が安心して使えるでしょう。それは管理画面でも同様です。 通常、管理画面は利用者が限定的なため、デザインが適当になってしまいます。そんな寂しい管理画面もDevOOPSを使えば一気に見た目が向上するでしょう。 DevOOPSの使い方 DevOOPSには多くのテンプレートが用意されています。これらを組み合わせるだけで格好良い管理画面ができあがりそうです。Bootstrapベースなので、カスタマイズもそれほど難しくはないと思います。 DevOOPSはHTML5/JavaScript製、GPL v3のオープンソース・ソフトウェアです。 devoopsme/devoops
kuromoji.js - Webブラウザ上で分かち書き！ MOONGIFT
テキストから意味を読み取るというのは非常に難しく、そのための専用ソフトウェアが存在するほどです。そしてテキスト解析手法の一つとして知られているのが分かち書きです。日本語であればChasenがよく知られています。 kuromoji.jsはそんな分かち書き処理をJavaScriptで行ってしまおうというソフトウェアになります。KuromojiというApache財団のオープンソース分かち書きエンジンをJavaScriptにポーティングしています。 kuromoji.jsの使い方 こちらはデモです。Webブラウザベースで動作しています。nodeでも使えます。 適当な文章をリアルタイムに分かち書きできます。 kuromoji.jsは辞書ファイルをAjaxで取得しています。そのためサイズは大きくなりますが、分かち書きの精度はとても高くなります。サーバサイドで辞書を用意したり分かち書きエンジンを用意する
Flow.js - 巨大なファイルもリジューム付きで簡単アップロード MOONGIFT
巨大なファイルをアップロードする際に欲しくなるのがリジューム機能です。万一途中でネットワークエラーになったりして最初からやり直し、なんてことになったらもはや二度とアップロードする気にならなくなるでしょう。 今後Webの利用範囲が広がっていく中で、動画をはじめサイズの大きいファイルをアップロードしようと思ったらリジューム機能は欠かせなくなります。そこで使ってみたいのがFlow.jsです。 Flow.jsの使い方 Flow.jsは通常のファイルアップロードの代わりに使えるようになっています。 デモです。ボックスにファイルを追加します。 アップロード中… 途中で止めたり、一つだけ再開もできます。 タネを明かすと、Flow.jsではFile APIを使ってファイルを読み込み、小さく分割（チャンク）してアップロードを行っています。その分ネットワーク接続の回数が多くなりますが、巨大なファイルによるネッ
Resurrectio - CasperJS向けのテストコードをWebブラウザ上で生成
MOONGIFTはオープンソース・ソフトウェアを紹介するブログです。2021年07月16日で更新停止しました これでWebのUIテストが容易になりそうです。 WebアプリケーションのUI上のテストをするというのは大変です。そこでよく使われるのが操作を記録し、再現することでテストコードの大枠を生成してしまうという方法です。Seleniumでもそういった手法がよく使われています。 PhantomJSを使ったCasperJSというテストユーティリティがありますが、そのCasperJS向けのテストコードを生成してくれるのがResurrectoiです。 ResurrectoiはGoogle Chrome機能拡張としてインストールしますので、テストコードの作成が手軽です。 インストールするとアイコンが表示されますので、それをクリックします。 Resurrectioを使えばCasperJS向けのテストコ
PeerServer – WebRTCを使ったWebベースのP2Pサーバ
MOONGIFTはオープンソース・ソフトウェアを紹介するブログです。2021年07月16日で更新停止しました WebRTCが手軽に使えるようになります！ WebRTCを使うことでサーバを介さずP2Pでデータの送受信ができるようになります。とは言えその実装については知識が必要で、クライアント同士のID（ピアID）をつなぎ込むための仕組みも必要です。 そうした面倒な部分をまるっと実装しているのがPeerServerです。HTML5の新しい楽しみを知る上でも興味深いソフトウェアと言えるでしょう。 まず使い方としてPeer.jsを読み込みます。 <script src="http://cdn.peerjs.com/0.3/peer.js"></script> 後はAPIを作成（オープンソース版は不要かも？）して、それを読み込みます。 var peer = new Peer('pick-an-id'
No more Flash！HTML5を使ったWebカム&顔認識·HTML5 Face Detection MOONGIFT
HTML5 Face DetectionはHTML5のgetUserMediaを使ってWebカムへアクセスし、リアルタイムに画像解析を加えるソフトウェアです。 HTML5の新しい機能の一つとして注目されているのがWebカムへのアクセスです。これまではFlashを介してのみ行われていましたが、これでさらに一歩FlashからHTML5への流れが促進します。そしてそのWebカム認識を使ったソフトウェアがHTML5 Face Detection、顔認識ソフトウェアです。 Flashは使っていません。HTML5がWebカムへのアクセスを求めています。 接続するとフローティングが表示されます。 顔の上にメガネとつけ鼻が表示されます。もちろん顔を動かすとリアルタイムに追従してきます。 HTML5 Face DetectionはまだgetUserMediaが実装されているWebブラウザのみ動作が可能です。
動画にチャプタ、字幕を簡単に埋め込む·Subler MOONGIFT
Sublerは動画へ字幕の埋め込み、メタデータ編集、チャプチャの追加を行うMac OSX用の簡易動画編集ソフトウェア。 SublerはMac OSX用のオープンソース・ソフトウェア。インターネット上には無数の動画コンテンツが存在する。さらにムービーカメラも手軽になっており、携帯電話でも撮影ができるようになっている。それを使って録画している人も多いだろう。 メイン画面 しかし動画というのは編集はとても面倒なフォーマットでもある。例えば字幕をつけた動画をiPhoneで観たいと思うといきなり複雑な操作が必要になってしまう。幾つか限定的な操作にはなるが、手軽に動画を編集できるのがSublerだ。 Sublerは動画（MP4など）を読み込んで、字幕ファイルを追加したり、チャプターデータを追加できるソフトウェアだ。ファイルを指定すれば良いだけで、後は自動的に認識してくれる。言語の設定もドロップダウンか
MOONGIFT: � 動画から連続サムネイルを作成する「Thumber」:オープンソースを毎日紹介
実用性については不明。でも面白い遊びができそうなソフトウェアだ。 動画を楽しむにはメディアプレーヤが必要だ。そして倍速などにしても時間はかかるものだ。そこで動画共有サイトでは動画の一部を画像化して、サムネイルに使っている。しかしちょうど良い場所が切り取られる保証はない（操作できるが面倒だ）。 メイン画面 そこでこんな動画の楽しみ方はどうだろう。動画サムネイルを連続してくっつけて、何となく見た気にするのだ。 今回紹介するフリーウェアはThumber、動画をサムネイル化するソフトウェアだ。 Thumberは指定したサイズ、指定したカラム数で動画のサムネイルを作成し、それらを横並べにして一つの大きな画像を作成するソフトウェアだ。インターバルは最低一秒から可能で、一コマのサイズを大きくすれば動画の時間に応じて巨大なサイズに仕上がっていく。 できあがった画像 できあがった画像を見ると…すごい！とは言
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
