個人的メモ帳放置ブログ。いうJavaScriptでGIF画像を作ったり、GIFアニメを分割や逆再生するようなライブラリをちまちま書いています。ブラウザで動作させることしか考えていなかったのですが、Node.jsでも動かせそうだったので、対応させたときのやり方を書きます。GraphicsMagickやImageMagick使った方が素直だし速度面などを考えても良いです)導入もっと良い方法がありそうな気もします......もともとのものが1つの大きなJavaScriptだったので、ブラウザ依存の処理と、共通で利用できる処理をまず分けました。Node.jsにはモジュールの仕組みが既にあり、ブラウザでその処理を動くようにするソフトウェアが既にあるのでそれを利用するのが楽でしょう。導入自体は楽だったのですが、Browserifyはrequireなどの依存関係を解決してJavaScriptファイルを書き出してくれますが、Browserifyで生成した関数に閉じた状態で出力されるので、scriptタグで読み込むだけで使えるようになる、という状態にはなりません。オプションを見ても特にそれらしいものは見つかりませんでした。よって、以下のようにしました。windowオブジェクトに追加してしまいます。objectへの追加で何とかなった。最近気になっているので、サンプルを動かすところまでやってみたいと思います。Javaのサンプルでもいいのですが、多言語対応がウリの1つで、Scalaでも書けるということなので、せっかくだからScalaを使ってみたいと思います。インストール公式サイトの手順を参考に進めます。2.1RC3のダウンロード後、解凍する。標準では使えず、別途言語モジュールとして提供されているようです。io.vertx~lang-scala~1.0.0が登録されているので、どうやらこれのようです。公式のモジュールマニュアルを参考にインストールしてみます。moduleどうやらインストールできたっぽい。インストールがうまくいってない気がしてくるエラーです。書いてあることが参考になりそうでした。設定も書けば動きそうな気がしてきます。以下を追加scala=io.vertx~lang-scala~1.0.0:org.vertx.scala.platform.impl.ScalaVerticleFactory.scala=scala再度サンプルを実行。開いて動作を確認するところまでできました。動かすとこまでできたので、次はパフォーマンスの検証などしてみたいです。画像に文字を上書きできるようなものを作ってみたWEBにある画像の文字だけ書き換えたいなーってときに、一度保存してからペイントで編集して〜っていう作業が面倒だと思ったので、それっぽいものを作ってみた。komenukahttp://komenuka.herokuapp.com実は1年くらい前から公開してたのですが、放置してました。デザインももっとマシにしようとは思いつつも手をつけてないので察してください。URLのパラメータをぽちぽち変更するのは大変だったので、JavaScriptで簡単なURLメーカーもつくりました。http://komenuka.herokuapp.com/make機能しょぼいですが、クソ文字コラメーカーぐらいにはなるのかなーという気はします。Cardsにも対応させた気がするので、Twitterでの画像展開もされるかも。共有2013年10月6日日曜日JavaScriptでGIFアニメの分解と逆再生やってみたかったネット上に転がっているGIFアニメ、とても好きなのですが、フレーム早すぎてなにが写っているかわからないものもあったりでフレーム毎に分割したいと思うことが何度かありました。ImageMagickとかで分割とかはとても楽にできますが、貧弱なサーバーだとちょっとアクセス来ただけで残念なことになってしまうので、クライアント側でできないのかなってことでJavaScriptで実行してみることにした。一応それなりに動くところまでできたので公開します。現在Chrome拡張機能だけです。https://www.dropbox.com/s/gkrl4scag4hf2tt/chromeextension.crx実際使うとどんな感じになるのか?こんな感じになります。GifgigのとあるGIFアニメ。うまくできた&わかりやすい画像選んでみました。新しいタブで結果画像が表示されるArrayBufferでバイナリ解析できるので、それで実装しています。バイナリ解析行っているところはTypeScriptで実装してみました。不完全なので、うまくいかない画像あったら教えてください。拡張してTextで縦書きできるようにしてみた最近EaselJSをさわりはじめたんですが、AS3を少しやっていたのでAPIがにていてわかりやすいです。そんなに複雑なもの作ろうとしているわけじゃないので、別に素のJSをつかってかいても良かったんですが、、、EaselJSのTextですが、例によって縦書きはできないようで、縦書きをたまに使用する日本人にはかゆいところに手が届かない感じです。EaselJSはMITライセンスのOSSだったので、勉強がてら拡張して縦書きもできるTextExを作ってみました。TextEx.js変更点はdirectionプロパティを追加して、directionが"vertical"のときforで一文字ずつ縦に描画するようにしただけです。(Atom)自己紹介aaharu情報工学系の大学の学生やってました。今は東京でWebエンジニアやってるらしいです。HTML、CSS、ActionScript、PHP、JavaScript、Python、Perl、C、Javaはそれなりにわかる程度。DCプレイ環境を構築する。(VGAでSEGA最新の家庭用ゲーム機「Dreamcast」をPCの液晶モニタでプレイしてみました。私は既に1台所有してますが、ハードオフでケーブル、コントローラーなしの本体のみを500円で買ってきました。D-sub(...ドリキャスの怪しげな商品購入してみた社会人になって多少懐にも余裕が出たので、ネタ商品を購入してみた。今回買ったのはこれです。私が購入した時はAmazonでは品切れだったので、Yahoo!ショッピングを利用しました。先日Point.distance()で2点間の距離を計算できることを初めて知りました。今まで2点間の距離は、三平方の定理を使って計算していたので、Pointを使えば楽に求められると思ったのですが、どちらの計算方法が早いのか疑問に思ったので比べてみた。...JavaScriptでGIFアニメの分解と逆再生やってみたかったネット上に転がっているGIFアニメ、とても好きなのですが、フレーム早すぎてなにが写っているかわからないものもあったりでフレーム毎に分割したいと思うことが何度かありました。ImageMagickとかで分割とかはとても楽にできますが、貧弱なサーバーだとちょっとアクセス来ただけで残...きんつば今日は上野・浅草あたりをぶらぶらしてきたんですが、お店で「きんつば」を見つけたので買ってみました。この「きんつば」というお菓子、Wikipediaにも書かれてますが、私の出身のほう(福島県会津)では、今川焼き(大判焼き)のことをきんつばと呼んでたりします。http...[Flex][AIR]ポケベル暗号変換Ver.0.1そろそろ更新しないとまずいと感じたので更新します。今回は30分で書けるような楽なプログラムです。ひらがなをポケベル暗号(?)っていうのに変換します。なんか唐突に思いついたので作ってみました。ちなみに私はポケベル触ったことすらありません。SketchUpを使ってモデルを作ってみました。ソースコードは右クリックで表示できます。拡張してTextで縦書きできるようにしてみた最近EaselJSをさわりはじめたんですが、AS3を少しやっていたのでAPIがにていてわかりやすいです。例によって縦書きはできない...AS3でイベントリスナーに引数を渡すActionScript3.0でイベントリスナーにイベント以外の引数を渡す方法。自分は2つの方法を使ってます。それ以外のやり方は知らない。グローバル変数を増やしたくないときとかに使ってます。クリック数をカウントするプログラム。2つ目と3つ目は基本的にやってる...Flashで3Dなお絵描き大学の時にブラウザ上で3Dモデルに絵を描くアプリケーションを作りました。長い間ブログを放置していたので、それの紹介でもしたいと思います。ブラウザで3Dを扱うというのはあまりない話です。