Vimac - macOS上の操作をVim風に
MOONGIFTはオープンソース・ソフトウェアを紹介するブログです。2021年07月16日で更新停止しました macOSではテキストエディタなどで簡易的なEmacs風のキーバインドが利用できます。Emacs派としては便利なのですが、他のエディタを使っている方としては慣れない操作で、わざわざ使わないでしょう。 もしあなたがVim派であれば、Vimacを使ってみましょう。macOS上の操作がVimライクなキーバインドで使えるようになります。 Vimacの使い方 Vimacはセキュリティとプライバシーにて利用を許可する必要があります。 一度起動してしまえば、後はmacOS上の操作でどこでもVim風のキーバインドが使えるようになります。iを押せばInsert modeになりますし、それ以外の時にはキャレットの移動もVim風に行えます。 VimacはObjective-C製のオープンソース・ソフトウ
ruby_enabler.js·ルビ表示を多くのブラウザで適切に MOONGIFT
ルビというのは東アジア（たぶん日本くらい？）の文化で、HTMLでもrubyタグとしてサポートされています。しかしブラウザによって表示が違ったり、そもそもルビが使えなかったりとむしろストレスになるかも知れません。 やはりルビ文化を理解できていない海外に任せるのではなく、日本で実装すべきなのかも知れません。そこで使ってみたいのがruby_enabler.jsです。 ruby_enabler.jsの使い方 古いFirefox/Operaでの素の表示とruby_enabler.jsを使った時の違いです。 Safari/Chromeでも書き方によっては表示が乱れるようです。しかしruby_enabler.jsを使えば改善します。 ruby_enabler.jsを使えばvalidなHTML構造は維持しつつ、綺麗なルビ表示が行えるようになります。誰がどんなブラウザを使っているか分からないので、公共系や海
Remote.js·WebSocketも使わずデスクトップブラウザをリモート操作 MOONGIFT
これは目から鱗！ Googleがスマートフォンとデスクトップブラウザを連携させるサービスを幾つかリリースしています。その際にはデスクトップ側（または逆）で表示されたキーをもう片方で入力することでWebSocketによって接続しています。 技術的に高度で容易には実現しがたい訳ですが、もっと簡単にスマートフォンとデスクトップのブラウザを連携させる方法がありました。それを実現しているのがRemote.jsです。 こちらがデモ。スマートフォンで操作するとA/Bのハイライトが切り替わります。 こちらはスマートフォン側のリモコン。なぜか文字が逆になっています。 こんな感じで別なウィンドウを開いたり、閉じたりもできます。 種明かしをすると、Remote.jsは音を使っています。スマートフォンでボタンを押すと、特定の音が出ます。それをデスクトップ側のマイクで聞かせると特定のアクションを実行する仕組みになっ
AirShow – WindowsでもAirPlayが使えるようになるライブラリ集
MOONGIFTはオープンソース・ソフトウェアを紹介するブログです。2021年07月16日で更新停止しました Apple TVが会社にあると、iPhoneやデスクトップをAirPlay機能を使ってミラーリングさせられます。これにより情報を共有したり、アプリの説明をしたりするのがとても簡単になります。 そんなAirPlayのプロトコルを使えるようになるのがAirShowです。Mac OSX用があっても意味がないのだろ…と思ったのですが意外と別な使い道もありそうです。 GUIのMac OSXアプリの場合は正直使い道があるのか分かりませんが、面白いのはJava/PHPのスクリプトがあることです。例えば写真の場合次のように実行できます。 php airplay.php -h hostname[:port] -p file java -jar airplay.jar -h hostname[:por
Rubicure - プリキュアを愛する方向けのRubyライブラリ MOONGIFT
私にも娘がいて、幼稚園くらいの頃にはプリキュアに夢中になっていた時代がありました。たぶん小さい女の子はみんな一度はハマる時期があるのではないかと思います。 それを一緒に見ていた（または単独でも可）プログラマーはお父さんが腕にものを言わせるとRubicureというのが出来上がる訳です。 RubicureはRubyのバージョンは2.0以降が要求されます。インストールはRubyGemsでできますのでさっそく試してみましょう。 $ gem install rubicure 完了したらおもむろにirbを実行します。 require "rubicure" そして実行します。 Precure.title #=> "ふたりはプリキュア" うーん熱い。 実行結果。ハッシュで受け取れます。 Precure.max_heart.title #=> "ふたりはプリキュア Max Heart" うーん実に熱い。作者
Megamoji·絵文字を使って巨大な絵文字を作る！ MOONGIFT
インパクトのある絵文字を手軽に作りましょう！ アスキーアートは文字を使って絵や巨大な文字を作ったりします。時にイラストよりもインパクトのある作品が作られて驚かされます。 同じような仕組みで作ってみたいのがメガモジです。絵文字は一文字ですが、絵文字を使って大きな絵文字を作ってしまおうという試みです。それを誰でも簡単に作れるようにするのがMegamojiです。 パレットです。まずは作りたい絵文字を選びます。 絵文字ではなく任意の画像を選択もできます。 次にその絵文字の中で絵にしたい部分を選択します。 ついでその絵文字を構成する絵文字を選択します。入力補完が組み込まれているので簡単に選択できます。 下手ですが一例… 絵文字を解析して1、2、3といった数字を自動的にピックアップします。後はその色に合わせた絵文字を選択すればできあがりという訳です。 文字に変換。 文字に変換したら、後はGitHubな
funnyText.js - テキストがめまぐるしく入れ替わる MOONGIFT
スタイルシートが強力になっていくのに合わせてテキストだけでできることの範囲がどんどん広がっています。アニメーション処理もHTMLだけでできてしまうくらいです。 そこで今回はテキストを使った面白い表示をサポートしてくれるfunnyText.jsを紹介します。特に難しい使い方はなく、テキストアニメーションが実現します。 参考例。2色の文字がランダムに入れ替わります。 自動で変わっていくのでずっと眺めているだけで良いです。 画像だと分かりづらいので動画で紹介します。 使い方は以下のようなコードになります。 $(document).ready(function() { $('.text1').funnyText({ speed: 700, activeColor: '#fff', color: 'black', fontSize: '8em' }); $('.text2').funnyText({
slow.js·JavaScriptをゆっくり実行 MOONGIFT
デバッグに良いかも？ JavaScriptでアニメーションやイフェクトを実行したり、何らかの処理を行うといったことは良くあるのですが、ほんの一瞬で終わってしまう処理の場合確認がとてもしづらいことがあります。 そこでJavaScriptの実行時間を遅らせられるslow.jsを使ってみましょう。CSSによるイフェクト処理をゆっくり実行してくれるようになります。 例えばこういったモーダルを表示する処理に使います。 使い方は簡単で、 slow.listen({ keyCode: 16, multiplier: 2 }); のようなコードを記述します。keyCodeで何かのキーを指定し、そのキーが押されている状態だとイフェクト処理をmultiplierで指定した数字倍遅らせます。この場合、速度は1/2になるといった具合です。 あるキーを押した時だけ実行速度が変えられるのでデバッグとして使ってみるのも
Maplace.js - 軽量なjQuery × Googleマップライブラリ MOONGIFT
Googleマップをプログラマブルに組み込むのに良さそうです。 GoogleマップはAPIの多彩さ、機能の柔軟さもあって様々なサービスで使われています。位置情報や地図を扱おうと思ったら一番に考えるのではないでしょうか。 そんなGoogleマップをさらに手軽に使えるようにしてくれるライブラリがMaplace.jsです。機能は限られますが広範囲に利用できそうです。 まずは簡単なデモ。地図の表示を行います。コードとしてはたった数行です。 // JavaScript var maplace = new Maplace(); maplace.Load(); // or new Maplace().Load(); // HTML <div id="gmap"></div> その結果は次のようになります。 シンプルな地図表示。 次はドロップダウンやリストを使ったマーカーのデモ。マーカーは自動的に中央に表
iniscan·php.iniの設定ファイルをチェックして危険なポイントを洗い出し MOONGIFT
PHPは年々進化していて、それでいて過去のバージョンとの互換性もほぼ維持されています。しかしネットワークが進化する中で従来は使われていた設定が非推奨になっていることも少なくありません。 もしかするとWebサーバのPHPの設定が危険な状態になっているかも知れませんよ。それをチェックできるのがiniscanです。 iniscanはcomposerを使ってインストールします。まずはcomposer.jsonを下記の内容で作成します。 $ cat composer.json { "require": { "psecio/iniscan": "dev-master" } } そしてインストールを実行します。 $ sudo composer install Loading composer repositories with package information Installing depende
音声認識APIを手軽に使えるようにする·annyang MOONGIFT
annyangはJavaScript製のオープンソース・ソフトウェア（MIT License）です。 Siriなどの登場によって一気に知名度があがった音声認識システムですが、それをWebベースで、しかもJavaScriptだけで実現してしまおうというのがannyangです。 まずマイクへのアクセス許可が求められます。 いきなりHelloというと文字が表示されます。 さらにShow me〜というとFlickr検索をします。 Show TPS reportで下から画像がせり出してきます。 annyangではモダンなWebブラウザに実装されている音声認識API（webkitSpeechRecognitionなど）を使っています。そして指定したワードにヒットした場合に予め決められた処理をコールする仕組みです。音声認識を使ったイベント処理を容易に実装できる面白いライブラリです。 MOONGIFTはこ
危険なコードが存在しないかチェック·Pecker Scanner MOONGIFT
Pecker ScannerはPHP製のオープンソース・ソフトウェア（GPL）です。 便利だけれど安易な利用は危険な関数や処理と言ったものはプログラミング言語に確実に存在します。それを発見してくれるPHPのツールがPecker Scannerです。 実行例。evalやexecなどを検出しています。 こちらがそのソース。 関数を文字列として定義してそれを関数として呼び出すと言った処理に対しても検出ができています。さらにbase64で文字列をデコードした場合も同様です。その他create_functionなどセキュリティホールになりがちな処理も検出してくれます。Pecker Scannerを使えば完全安心という訳ではありませんが、危ない処理が存在しないか確認するためにも使っておくといいでしょう。 MOONGIFTはこう見る CMSやプラグイン機構の備わっているソフトウェアの場合、どうしても動的
等幅なコーディング向けフォント·Anonymous Pro MOONGIFT
Anonymous ProはOpen Font Licenseのオープンソース・ソフトウェアです。 プログラミングやWebデザインを行う際にフォントは厳選して選んだ方が良いです。より可読性、品質の高いフォントを選ぶのが良いでしょう。今回はその一つ、Anonymous Proを紹介します。 Anonymous Proのレギュラー。等幅フォントでそれぞれの文字がはっきりと分かれています。 ボールド。こちらも見やすさは変わりません。 Anonymous Pro Minus。こちらはちょっとフォントの数が少なくなってサイズが軽減しています（標準文字だけなので分からないですが…） Anonymous Proの特徴は等幅フォントであること、レギュラー/ボールド/イタリック/ボールドイタリックがあること、各種キーボードのシンボル（Mac OSXのコマンドキーなど）対応、英語の他ヨーロッパ圏の拡張言語サポ
既存のHTMLからID/クラスを抜き出してCSSを生成·extractCSS MOONGIFT
extractCSSはJavaScript製のオープンソース・ソフトウェア（MIT License）です。 スタイルシートの記述法は幾つかあります。linkタグで外部ファイル化、styleタグでインラインに表示、そしてstyle要素でタグごとに指定する方法です。styleタグに書き込まれてしまったスタイル設定を一気に書き出してくれるのがextractCSSです。 トップページです。まず右側に現状のHTMLソースを入力します。 そしてExtractボタンを押すとスタイルシートが出力されます。 入れ子向上も適切に処理されています。 extractCSSではID/クラスを自動的にピックアップして生成していますので空っぽの指定が相当数生成されることになると思います。それらを必要に応じてフィルタリングするようにすればスタイルシートのベースとして使えるのではないでしょうか。 MOONGIFTはこう見る
iTunesの音楽、Podcastingを様々なデバイスで楽しむ·SevenMinutes MOONGIFT
SevenMinutesはMac OSX用のオープンソース・ソフトウェア（Ruby License）です。 iTunesはiPhone/iPodと同期できるとあって、メディアサーバとして使っている人も多いのではないでしょうか。今回はiTunesを他のデバイスからも利用できるようにするSevenMinutesを紹介します。 サーバを立ち上げました。この状態で16017番ポートにアクセスします。 最初に設定が表示されます。音質の設定が可能です。 設定が終わるとプレイリストが出ます。 iTunesのプレイリストも指定できます。 プレイリストの中には楽曲が入っています。後はPlayボタンを押せばOKです。 楽曲に対してレイティングもできます。 SevenMinutesはiTunesのフロントエンドとして動作し、デスクトップのブラウザやスマートフォン、タブレットで音楽を楽しめるようになります。その他
JavaScriptでGeckoブラウザを自動操作·SlimerJS MOONGIFT
SlimerJSはWindows/Mac OSX/Linux用のオープンソース・ソフトウェア（Mozilla Public License）です。 スクレイピングをしたり、テスト自動化を行う際に役立つのがPhantomJSですが、ブラウザはWebKitベースです。今回はGeckoベースのSlimerJSを紹介します。 実行した場合です。スクリプトを書いてSlimerJSに渡します。 Geckoベースのブラウザが立ち上がってテストが実行されます。 MOONGIFTもちゃんと表示されます。 ログも表示されます。 SlimerJSはスタンドアローン版でWindows/Mac OSX/Linux向けのバイナリも提供されています。XULRunnerを使って実行もできますので、使いやすい方を選択すれば良いでしょう。Geckoエンジンを使った自動処理に便利です。 MOONGIFTはこう見る 今はHTML
WebCrypto APIのJavaScript実装·PolyCrypt MOONGIFT
PolyCryptはJavaScript製、BSD Licenseのオープンソース・ソフトウェアです。 HTML5で策定が進んでいる仕様の一つにWebCrypto APIがあります。これはWebブラウザの標準機能として暗号化を提供するものです。しかし実際に実現するにはまだしばらく時間がかかるでしょう。そこで使ってみたいのがPolyCryptです。 デモです。入力と暗号化しての出力、そして復号化が行われています。 SHA-256のハッシュ値を算出するデモです。 メールアドレスとパスワードを指定して、PEM/P12の証明書を出力するデモです。 ダウンロードするとちゃんと証明書になっています。 PolyCryptはWebCrypto APIのJavaScript実装です。Androidのデフォルトブラウザ、Opera Mini、IE10未満では動作しませんのでご注意ください。先進的な機能を先んじ
iframeを使った簡易レスポンシブWebデザインエミュレータ·rFrame MOONGIFT
rFrameはJavaScript/jQuery製のオープンソース・ソフトウェア（MIT License）です。 レスポンシブで作成されるWebサイトが増えています。そうした時の表示確認ではウィンドウの幅を縮める方法もありますが、今回はrFrameを使った方法を紹介します。デバイスと方向を指定して表示を素早く確認できます。 iPhone5、縦の場合です。画面上部のツールバーで指示できます。 iPhone4の場合。デバイスの縦の表示領域が狭まりました。 メニューなどをクリックすることもできます。 横向きの表示に切り替えもできます。 iPadの場合。 こちらはKindle。iPadと比べて横の表示領域は殆ど変わらない模様。 Androidもありますが、これはどのデバイスかによって変わりそうです。 rFrameはiframeタグを使って幅を変更することでレスポンシブのデザイン確認が出来るようにな
ピアノロールを使ってWeb上で音楽を奏でよう·PianoRoll.js MOONGIFT
PianoRoll.jsはJavaScript製のソフトウェア（ソースコードは公開されていますがライセンスは明記されていません）です。 Web上で音楽を作る方法は幾つかありますが、今回はPianoRoll.jsを紹介します。いわゆるピアノロールを使ってマルチトラックの音楽を作成できます。 Firefoxで試しています。Google Chromeでは音符部分が表示されませんでした。 音符の記号を選んで、ピアノロールに描画します。 トラックを変更してピアノ以外の音を出す事もできます。再生時には全て一斉に再生されます。 試した感じでは同じトラックの音を同時に奏でる事ができませんでした。しかし他のトラックの音は流せるので音楽の幅が広がりそうです。ぜひ創作活動に励んでください。 MOONGIFTはこう見る 何となくですがピアノロールの方が楽譜に書くよりも直感的に音楽の創作ができる気がします。幾つか適
高度なファイルアップロード機能を提供·Fine Uploader MOONGIFT
Fine UploaderはJavaScript製、GPL v3のオープンソース・ソフトウェアです。 HTML5になってファイルのアップロード処理は大幅に改善されました。特にドラッグ&ドロップによるファイルアップロードは便利です。そんな機能をさらに便利にしてくれるライブラリがFine Uploaderです。 デモです。ファイルの選択またはドラッグ&ドロップでリストに追加できます。追加後、即アップデートが開始されます。 デザインの拡張性は高いです。 エラーのキャッチもできます。 拡張子によるテストにも対応しています。 画像のサムネイルビューもあります。 アップロード上限の制限に対応しています。 Fine Uploaderを使えばファイルアップロードにおける大抵のニーズには対応できるのではないでしょうか。JavaScriptで細かくカスタマイズしたり、コールバックを使って独自の仕組みを組み込む
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
