uupaa.js

uu.node.add(source, context, position) のpositionに数値を指定可能に

uu.node.add(source, context, position) の position に数値を指定すると、ノードの挿入位置を指定可能になりました。従来通り文字列("first", "prev", "./first", "./last", "next", "last")も指定可能です。詳しくはこちら http://code.google.com/p/uupa…

uu.ready("href:url/dispatcher", callback, ...) impl

条件成立でコールバックする関数を登録しておく機能 uu.ready() の条件に、ページのURLが一致する場合にコールバックする機能を追加しました。このようにして利用します。同じものを http://jsdo.it/uupaa/2011-01-19 にあげてあります。 // jsdo.it のコー…

IE9pp6 で -ms-transform が実装されたようなので

-ms-transform を使ったデモをどうぞ http://uupaa-js.googlecode.com/svn/trunk/0.8/test/ui/gesture_drag.htmPC, iPhone, iPad で動作します。PCなら、ホイールで拡大縮小, ホイールクリックで回転(または SHIFT + ホイールで回転), iOS なら タッチドラッ…

イベントハンドリングなら handleEvent を使えば、Function#bind や $.proxy はたぶん要らない

タイトル変えました uupaa.js の個々の機能をちょっとずつ紹介しています。h2ham さんの記事を拝見して http://h2ham.seesaa.net/article/142734325.htmluupaa.js では、 クラスオブジェクトの handleEvent にイベントを束縛できるため、 jQuery の、この(↓)…

uu.ajax(), uu.jsonp()

uupaa.js の個々の機能をちょっとずつ紹介しています。uu.ajax(url, option, callback) は Ajax, uu.jsonp(url, option, callback) は JSONP の機能です。 // uu.ajax - Async request function uuajax(url, // @param String: url option, // @param Hash: …

uu.image() で画像の読み込み管理

ちょっとI/F修正uupaa.js の個々の機能をちょっとずつ紹介しています。 uu.image(url:URLString/URLStringArray, callback:Function) // [1][load image] uu.image(url, function(response) { ... }) // [2][load images] uu.image([url, ...], function(res…

シークバーを搭載したAudioプレイヤーのデモ

ここ一週間でコツコツ改良を進めていた HTML5 Forms の <input type="range"> 風味なスライダーコントロールと、 <audio> のラッパーがいい感じになったので簡単なデモを作りました。http://uupaa-js.googlecode.com/svn/trunk/0.8/test/core/audio/player.htm IE6+ / Firefox / Safari </audio>…

uupaa.js と jQuery を機能を中心にざっくりと比較

Classの継承についてサンプルを追記しました。 jQuery の特徴的な構文を uupaa.js で表現する方法を追記しました。 デバッグ支援機能について追記しました。 特徴 uupaa.js jQuery 初版 version 0.1 (2008-06-07) version 1.0 (2006-10-27) 最新版 version 0…

HTML5 Forms Slider Control (input type="range")

デスクトップアプリケーションで利用されているフォームコントロールの多くがブラウザでは利用できません。 これを改善すべく HTML5 Forms で フォーム部品が追加されましたが、例によりブラウザの実装が追いついていないため満足に利用できる状況にありませ…

return で セミコロンが補完されてしまうのを防ぐ

uupaa.js のビルドツールは、必要な機能のみをビルドすることができます。 //{@mb if (uu.ie) { alert("IE用の特別な処理だよ"); } else { //}@mb alert("IE以外の処理だよ"); //{@mb } //}@mb このコードを、MobileWebKitモード( {@mb から }@mb までを削除…

uu.snippet 入門(2) 複数の部品を一つのsnippet に

uu.snippetで「やりましょう」、Widgetの作り方入門 - latest log の続きです。uu.snippet は、複数の部品(コードブロックや関数)を一つのファイルにまとめ上げることが可能です。 実行環境によってスタイルを微調整する MediaQuery を古いブラウザで実現す…

uu.snippetで「やりましょう」、Widgetの作り方入門

続き書きました uu.snippet 入門(2) 複数の部品を一つのsnippet に - latest log Widget(Web ブラウザ上で動作する UI 部品)を作るには、構造を HTML で、見栄えを CSS で、アクションを JavaScript で記述することになります。Widget を作る際の問題は大き…

Flashのように滑らかなアニメーションを実装するには(uupaa.js vs jQueryデモ)

JavaScript で Flash のような滑らかなアニメーションを行うためには、クロスブラウザな知識の他に、GC(ガベージコレクション)や「どうすれば安定した品質がだせるのか」といったスキルが求められます。 # GC の話は WEB+DB PRESS 57 でちょっと書いてます。…

JavaScript minified code word counter

JavaScriptのコード量とか気になりますよね? モバイルだと特に。通常は、プログラマーがソースコードの無駄を削り、Minifier Tools で更に難読化 + 圧縮を行いますが、そこから更に削りを入れるには、頻出するワードを変数に格納するなどします。 そんな時に…

uupaa.js に uuCanvas.js をマージ

uupaa.js version 0.8 に uuCanvas.js の最新版相当の機能をマージしました。IE なら VML, Silverlight3+, Flash9+ のいずれかでレンダリングを行い、それ以外のブラウザでは<canvas>でレンダリングします。 Flash や Silverlight が利用できない場合でも VML でレン</canvas>…

MultiTouch DnD + Gesture で Microsoft Surface 的な(2)

http://d.hatena.ne.jp/uupaa/20100625/1277424226 の続きです。拡大/縮小/回転をクロスブラウザにしました。 http://jsdo.it/uupaa/MultiTouchDragAndGesture iPhone(iOS4), IE 6+, Opera 10.50+, Firefox 3.5+, Google Chrome 5+, Safari 4+ で動作を確認…

uupaa.js の これまでと これから

uupaa の中の人は28ヶ月前にペットショップからウーパールーパーを2匹連れ帰りました。 同じ日に、「作れども作れども UI 速くならず、じっとコード見る」な感じから脱却するため、中の人は、"uupaa" という固有名詞がWeb上に存在しないことを確認し uupaa.j…

JavaScriptとプリプロセッサ

uupaa.js にはビルドツール(minify/upa.php)が同梱されています。upa.php は C/C++ のように #include src.js を自動的に展開します。 クライアントサイド JavaScriptでは include は予約語ではありませんが、(他のライブラリと衝突する可能性があるので)通…

uuStorage.js

uuStorage.js は、HTML5 の Client Side Storage (WebStorage) のフォールバックな実装です。http://uupaa-js-spinoff.googlecode.com/svn/trunk/uuStorage.js/README.htm中身は、以下のシングルトンなクラスで構成されてます。 Storage (Storage auto detec…

IE9 で

IE9 を含む様々なブラウザで <audio> や window.Audio の機能の一部を利用できるようにしてみました。Silverlight3+ がインストールされている、Firefox3.0, Firefox3.5+, IE8, IE9, Google Chrome3+, Safari4+ で動いてます。 # そのうち、Flash でも動作するよう</audio>…

uuCanvas.js version 2.03 release

HTML5 Canvas を IE で使えるようになるライブラリ uuCanvas.js の version 2.03 をリリースしました。http://code.google.com/p/uupaa-js-spinoff/今回は Flash backend で Pixel API をサポートしました。これらを使うとドットにアクセスできます。 ctx.cr…

canvas 互換機能の bugfix

uupaa.js コードリード用のエントリです。興味が無い方は読み飛ばしてください。 VML backend で ctx.drawImage(image) + 不透明度(globalAlpha) を有効にしました(条件あり) <vml:image> は opacity 属性が機能しません。そのため、<vml:image> ではなく、<vml:shape> <v:fill opacity="..." src="..." /> </v:shape> を使うことで、不透明…

uuCanvas.js version 2.0 release

今日は「RIP IE6 day」らしいので、uuCanvas.js version 2.0 をリリースしました。http://code.google.com/p/uupaa-js-spinoff/downloads/list 試食できます こちらにコピーを上げておきました。http://pigs.sourceforge.jp/blog/20100303/uuCanvas2.js/READ…

TextAPI と Shadow API を仮実装

Flashバックエンドに、TextAPI と Shadow API の仮実装を入れました。globalCompositeOperation も幾つか実装しています。 まだ調整が甘くて、 影が切れることがある textAlign 未実装実装済 利用できないフォントが指定されると、Times New Roman が使われ…

Canvas on Flashでアニメーション

Flashバックエンドの実装とbugfixもいい感じに進んでます。残すは clip() globalCompositeOperation ShadowAPI TextAPI PixelAPI toDataURL(), getImageData() な感じです。 アニメーションデモ 今までは派手目なデモの紹介を控えてきましたが、そろそろ頃合…

資料追加

uupaa.js の設定方法について、スライドを作成しました。http://handsout.jp/slide/2341

Flashモードにベジェ曲線と画像描画のサポートを追加

ctx.bezierCurveTo(), ctx.quadraticCurveTo(), ctx.drawImage() を実装しました。http://pigs.sourceforge.jp/blog/20100219/demo/ Silverlight, VML, Flash の各モードで、画像の拡大/縮小方法が異なるため、並べてみるとなかなか面白い事になっています。

Canvasをレンダリングする3つのモード

タイトル変更しました今のところこんな感じです。Flashモードはアニメーションが高速に動作するようになりました。 http://pigs.sourceforge.jp/blog/20100217/demo/ (IEや他のブラウザで見てね)今日は「uupaa.js が実装している <canvas> をエミュレートする三つの</canvas>…

canvasをより速く(Flashもサポート)-Take4

このエントリは canvasをより速く(Flashもサポート) - latest log や canvasをより速く(Flashもサポート)-Take3 - latest log の続きです。今日も、Flashモードのレンダリングをちょっと速くしました。 送信部分の高速化 修正前 var _stack = []; var _lockS…

canvasをより速く(Flashもサポート)-Take3

latest log の続きですFlashモードのレンダリング速度をさらに改善しました。fpsが半分ぐらいに落ち込む問題も解決できたようです。 なにをしたか ExternalInterface のjs側のコードを要約し CallFunction() だけにする事で、最適化していた(つもりだった)の…