javascript

Toolkit for CreateJSでパブリッシュするとアニメーションがずれるときがある件

デザイナーさんがつくったFlashアニメーションを、Toolkit for CreateJSを用いてCanvas用にパブリッシュするという業務がちょいちょい発生するのですが、パブリッシュされたものを再生してみると、アニメーションがずれている現象が時々みられました。アニメ…

Toolkit for CreateJSのスプライトイメージ化のフローを検討する (2)

前回のエントリで書いた方法で大方問題ないかなと思ったのだけどまだ駄目だった 汗。スプライトイメージをそれぞれの画像として用いるためにトリミングしようとするところで、 (lib.hoge = function() { this.initialize(img.hoge); }).prototype = p = new …

Toolkit for CreateJSのスプライトイメージ化のフローを検討する (1)

以前書いたToolkit for CreateJSのブログにて、画像のスプライトイメージ化のフローをまだ確立できていないと書いたのだけど、少し進展(?)あったので書いておく。 TexturePackerのコマンドラインツールでスプライトイメージ生成 自分はTexturePackerを使…

はじめてToolkit for CreateJS使ってみての所感

業務ではじめてToolkit for Createjs使いました。 その所感というか、ハマったところ・気をつけなければならないことも多々あったのでメモ。 flash内の画像ファイル名やインスタンス名には気をつけよう flash内で画像ファイル名やインスタンス名が日本語だと…

createjs(preloadjs)とCORSのところでハマったのでメモ

業務で、canvasに描画されているバイナリデータをサーバに送りたいということになった。 で、canvasのAPIにtoDataUrlというメソッドあるの知ってたので以下のように試してみるも、 var canvas = document.getElementById('testCanvas'); var data = canvas.t…

jsrender使ってviewとロジックをわける

恥を忍んで書きます。業務でアイテム一覧のようなものを表示する際に、コーダーから以下のような素材をもらって(実際のものとは違う。あくまでイメージ) <div class="div_xxx"> <p class="p_xxx">アイテム名称</p> <p class="p_yyy">期間限定</p> ##期間限定のもののみ <img class="img_xxx" src="xxx.png"> </div> で、エンジニアである自分が、ajax通信で取得したjs…

HTML版スライドのライブラリ、Bespoke.jsをさわってみた

前回のエントリでHTML版スライドをつくるためのフレームワーク一覧のリンクを貼って試してみたいなんて書いたので、そのうちの1つ"Bespoke.js"というのをさわってみた。markdalgleish/bespoke.js · GitHubまあREADME.mdに書いてあることちょこっとやってみ…

Node.jsでトータライザみたいなものをつくってみる

つい先日、社内勉強会でjsの話をしたのですが、そのときにjsついでということで"Node.jsでトータライザみたいなもの"をつくった。つくったけれどもあまりうまくいかなかったので(ウケもいまいち 汗)、戒めついでにメモとして残しておこう。トータライザっ…

'Galaxy S4'のWebViewでのcanvasの表示不具合の対応

'Galaxy S4'のWebViewでのcanvasの表示不具合が結構有名ぽくて、自分もハマった。。。 以下のサイトなどに書かれています。http://blog.happyelements.co.jp/2013_08_01_archive.htmlGalaxy S4のWebviewで、非同期処理の中でのCanvasの描画がバグってる - 車…

createjsの継承の実装について整理

javascriptで、オブジェクト指向の継承のようなものを実装する方法はいくつかあるようですが、今回のエントリーでは現在業務で使っているcreatejsのそれについて簡単に整理しましたので書いておこうと思います。 // ネームスペース // 名前空間の汚染を防ぐ…

スマートフォンwebのタップイベントを高速化するライブラリ"fastclick.js"をさわってみた

先日参加したADC MEETUP ROUND 07での@akb7_jpさんのセッション「HTML アプリケーションのパフォーマンスを良くする 10 のポイント」にて、"fastclick.js"というタップイベントを高速化するツールの話があって試してみたのでここに書いておきます。ftlabs/fa…

Sublime Text 2でまとめてインクリメントの処理を行う

少し前から業務でjavascriptを書いています。エディタはSublime Text 2を使っているのですが、あるとき以下のようなインクリメントなコードを書く必要があって(あくまで例です!業務で何書いたか忘れてしまいました・・・)、 <img src="/test_1.png"> <img src="/test_2.png"> <img src="/test_3.png"> <img src="/test_4.png"> <img src="/test_5.png"> <img src="/test_6.png"> <img src="/test_7.png">