タグ

ブックマーク / tech.nitoyon.com (16)

  • はてな記法ワープロ

    *はてな記法JavaScript はてな記法ワープロは JavaScript ならではの利点を生かしたダイナミックなワープロです。 試しに色々入力してみてください。即座に出力画面が反映されます((Windows 版 IE6 および Firefox 1.0 でのみ確認しています))。 はてな記法の変換は <a href="http://search.cpan.org/dist/Text-Hatena/">Text::Hatena</a> を JavaScript に移植した "text-hatena.js" を活用しています。 **変更履歴 |*2005/12/1|ソース機能追加 (HTMLソースを表示できます)| |*2005/11/21|はてな記法ワープロ完成| |*2005/11/13|text-hatena.js 移植開始|

  • jQuery.extend マニアックス - てっく煮ブログ

    JavaScriptjQuery の extend メソッドは便利なんだが複雑で忘れてしまいがちなのでメモしておく。jQuery.extend の呼び出しパターンは次の4通り。$.extend([deep,] target, obj1, [obj2, [obj3, ...)$.extend([deep,] obj)$.fn.extend([deep,] obj)$(...).extend([deep,] obj)全てのパターンで第一引数に [deep,] がある。これはオプションの引数で true を指定するとディープコピーしてくれる。以下では分かりやすくするために deep オプションは省略した一覧を掲載する。$.extend(target, obj1, [obj2, ...)$.extend(obj)$.fn.extend(obj)$(...).extend(obj)だいぶシンプルにな

    voidy21
    voidy21 2011/03/24
  • jQuery UI モーダルダイアログの仕組み - てっく煮ブログ

    JavaScriptjQuery UI の Dialog 機能はダイアログをモーダル表示することができる。サンプルを見ると、背景がグレーアウトされて、手前のダイアログしか操作できないTab キーを動かしてもダイアログからフォーカスを移せないといった動作になっている。いままでいろんなライブラリの擬似モーダル実装を見てきたが、Tab キーを押したらこっそり裏側の部分にフォーカスを移せるものばかりだったので、Tab キーにちゃんと対処していたところに驚いた。どうやって実装してるんだろうと思って jquery.ui.dialog.js を見てみたら、次のように泥臭く実装していた。 // prevent tabbing out of modal dialogs if (options.modal) { uiDialog.bind('keypress.ui-dialog', function(even

  • Google App Engine で DataStore を Python 対話シェルから参照する - てっく煮ブログ

    いまさらながらに Google App Engine をちょろちょろと触っている。DataStore を対話シェルから使えると便利そうなので、やり方を確立してみた。結論としては次のコードを対話シェル上で実行すれば使えるようになった。(Google App Engine SDK for Python Windows 版 1.4.0 にて確認) import os import sys import tempfile DIR_PATH = r"C:\Program Files\Google\google_appengine" APP_ID = "helloworld" sys.path += [ DIR_PATH, os.path.join(DIR_PATH, 'lib', 'antlr3'), os.path.join(DIR_PATH, 'lib', 'django'), os.path.

    voidy21
    voidy21 2010/12/20
  • 経路探索アルゴリズムの「ダイクストラ法」と「A*」をビジュアライズしてみた - てっく煮ブログ

    as詳解 ActionScript 3.0アニメーション ―衝突判定・AI・3DからピクセルシェーダまでFlash上級テクニック を読んでいて、経路探索のアルゴリズムで A* が取り上げられていました。A* については、いろいろ検索して調べたりもしたのですが、やっぱりに書いてあると理解しやすいですね。せっかくなので自分流に実装してビジュアライズしてみました。ダイクストラ法まずは A* の特別なケースでもあるダイクストラ法から見ていきます。クリックすると探索のシミュレーションが開始します。スタート地点(S)からゴール(G)への探索が始まります。色がついたところが「最短経路が決定した場所」です。スタート地点から少しずつ探索が完了していきます。半分ぐらい完了しました。まだまだ進みます。最後まで終わりました。最短経路を黒色矢印で表示しています。ダイクストラ法は、スタート地点から近いノード(=マス

  • AS3 でメソッドチェーンしたくなる話 - てっく煮ブログ

    asいろんな AS3 のサンプルが掲載されていて楽しい ActionSnippet | paste it in your timeline - or in your constructor で Functions Returning Functions が紹介されていた。シンプルで美しいのだけど、ソースに1箇所無駄があったので省いてみたものを紹介する。 // Functions Returning Functions (Revised) // original: http://actionsnippet.com/?p=2430 // - Removed line variable by using arguments.callee. package { import flash.display.Sprite; public class FlashTest extends Sprite {

  • AS3 でメソッドチェーンしたくなる話 (2) - てっく煮ブログ

    asAS3 でメソッドチェーンしたくなる話 - てっく煮ブログ にいくつか反応があって楽しかったので掘り下げてみた。自分で問題提起した以上は、何か作ってみなきゃいけない気になった。自分のモチベーション保つために記事にするのはいいことなんだと改めて実感した。題に戻る。ActionScript でメソッドチェーンするライブラリを作ってみた。こんな風に書ける。 $(graphics) .beginFill(0xff0000) .drawCircle(80, 80, 60) .endFill(); $(graphics) .lineStyle(3, 0x0000ff) .moveTo(200, 100) .lineTo(150, 150) .lineTo(200, 150) .lineTo(200, 100); $() にオブジェクトを渡すと、戻り値を返さないメソッドを this を返すようにし

  • jQuery と object タグの怪 - てっく煮ブログ

    JavaScriptSilverlightコンテンツを埋め込むjQueryプラグイン - Programmable Life で困ってたので一緒に悩んでみた。でも何故かIEでは動かない。誰か動くようにしてけれ!Silverlightコンテンツを埋め込むjQueryプラグイン - Programmable Lifeobject を作れていない?手元に環境を作って動かしてみると、 に を追加するところで JavaScript エラーが出る。状況を切り分けるために、 を追加する部分をコメントアウトしてみた。IE DOM Explorer で眺めてみると DIV タグが追加されている。どうやら var obj = $('').attr({ ... }); のところで object タグが作られていないようだ。jQuery でよく見る現象だ。こういうときは閉じ括弧を入れてあげると大抵うまくいく。

  • クラスタリングの定番アルゴリズム「K-means法」をビジュアライズしてみた - てっく煮ブログ

    集合知プログラミング を読んでいたら、K-means 法(K平均法)の説明が出てきました。K-means 法はクラスタリングを行うための定番のアルゴリズムらしいです。存在は知っていたんだけどいまいちピンときていなかったので、動作を理解するためにサンプルを作ってみました。クリックすると1ステップずつ動かすことができます。クラスタの数や点の数を変更して、RESET を押すと好きなパラメータで試すことができます。こうやって1ステップずつ確認しながら動かしてみると、意外に単純な仕組みなのが実感できました。K-means 法とはK平均法 - Wikipedia に詳しく書いてあるけど、もうすこしザックリと書くとこんなイメージになります。各点にランダムにクラスタを割り当てるクラスタの重心を計算する。点のクラスタを、一番近い重心のクラスタに変更する変化がなければ終了。変化がある限りは 2. に戻る。これ

  • IE4 の青写真を懐かしむ - てっく煮ブログ

    Internet Explorer 4.0(以下、IE4)が登場したのは、10年以上前の1997年10月のこと。いま改めて IE4 の資料を調べてみたところ、当時の Microsoft が目指していたものが見えてきて面白かったので、ここに記しておく。Windows 95 + IE4生の Windows 95 に IE4 インストールすると、OS そのものの見た目が変わってしまったのが印象的だった。見た目だけでなく、エクスプローラの操作性が変わるなど、IE4 は Windows 95 SP1 といってもいいぐらいの位置づけだった。中でも目を引くのが、画面右側に登場する「チャンネル バー」だ。このチャンネル バーは、IE4 の目玉新機能のActive ChannelActive Desktopを象徴したツールとなっている。お気に入りを発展させた Active Channelまずは Active

  • jQuery を高速に使う CSS セレクタの書き方 - てっく煮ブログ

    JavaScriptjQuery は CSS セレクタで要素を選んで処理できるのが魅力的ですね。そんな jQuery ですが、CSS セレクタの書き方次第で速度が大幅に変わってきます。ここでは jQuery の内部処理を疑似コードで示しつつ、jQuery を高速に使うためのポイントを5つに絞って紹介します。何度も同じセレクタを実行しないクラスだけを指定するのは禁止#id を積極的に使う途中までの結果を再利用する子供セレクタ(>)を使うと速くなることがある※ この記事は jQuery 1.2.6 のソースコードを元に記述しています1. 何度も同じセレクタを実行しない改善前 // 例題 1 $("div.foo").addClass("bar"); $("div.foo").css("background", "#ffffff"); $("div.foo").click(function(){

  • 具体例で説明するデザインパターン - てっく煮ブログ

    JavaScriptデザインパターンってなんだかたいそうなものに考えられがちだけど、実は、そこかしこのライブラリや仕様に取り込まれていることが多い。「デザインパターン分からん」とか「で、どうやって使うのよ」と悶々としている人には、「どういうところで使わているのか」を知っておけばイメージも沸きやすいし、意外にたいしたことないんだな、ということが分かるんじゃないだろうか。そこで、JavaScript やその周辺の技術で、デザインパターンがどのように使われているかを紹介してみることにする。ここでは、GoFの順番に沿って、以下の11個のパターンを取り上げる。生成に関するパターン Factory MethodAbstract FactoryBuilderPrototypeSingleton構造に関するパターン AdapterComposite振る舞いに関するパターン Chain Of Respon

  • AS3 で埋め込みフォントを使うテクニック - てっく煮ブログ

    as埋め込みフォントを使う場合のちょっとしたTipsを3つ紹介しておく。1. 何も考えずにフォントを埋め込む方法フォントを埋め込むには、Embed メタタグを利用する。 package { import flash.display.Sprite; import flash.text.TextField; public class EmbedFontTest extends Sprite { [Embed(source='アニトM-教漢.TTF', fontName='anito')] private var font:Class; public function EmbedFontTest(){ stage.align = "TL"; stage.scaleMode = "noScale"; var textField:TextField = new TextField(); textFi

  • Google Maps をぐーるぐる - てっく煮ブログ

    as, GoogleMapsAPIさっそく Google Maps API for Flash で遊んでみた。公式のチュートリアルを見ると MXML 必須のように見えるが、Map クラス自体は Sprite を継承してるので、AS3 の範囲だけで遊べる。回転、フィルタが自由自在ですよ、ということで、ぐるぐる回してみた。ドラッグ時にはマップ全体がぼやけます。ソースコードはこちら。 package { import flash.events.Event; import flash.geom.Matrix; import flash.filters.BlurFilter; import com.google.maps.Map; import com.google.maps.MapEvent; import com.google.maps.MapType; import com.google.m

  • てっく煮ブログ - ActionScript やるなら入れとけ。rascut 導入と使い方。

    asActionScript 3.0 でコマンドライン開発してる人は必携の rascut を導入してみた。Flex 開発や AIR 開発でも使えるよ。rascut は id:secondlife さんによる fcwrap 後継バージョン。ファイル修正から自動的にプレビューまでできたり、trace() の出力をコンソールに出力してくれたり、かなり便利。以前、勝手が分からずにかなり苦労したけど、最近、RubyForge にアップロードされてからは gem 一発で超簡単になったよ。前準備Flex SDK と fcsh を準備しましょう。fcsh にはパスを通しておきましょう。Flex SDK については ActionScript 3.0メモ さんを参照あれ。fcsh については fcsh で Apollo を高速コンパイル あたりを参照あれ。Flex 3.0 SDK には fcsh が付属してる

  • 幕末古写真ジェネレータをハックする - てっく煮ブログ

    幕末古写真ジェネレーター というウェブサービスがちょっと前に話題になりました。どんな写真も幕末の写真のように加工してくれる面白いサービスです。この仕組みを 幕末古写真ジェネレーターの仕組み? - 将来が不安 で解析していたのが面白かったので、続きをやってみることにしました。→成果を先に見たい人は、こちら からご覧くださいませ。1. 真っ黒な画像を渡すまずは、真っ黒な写真を幕末風にしてもらいます。これが幕末風にするための型紙です。以降はテンプレート画像と呼ぶことにします。2. RGB の階調を渡す直感的に、ジェネレータの実装は (元画像+色補正)+テンプレート画像 と考えられます。テンプレート画像は得られたので、あとは色補正のパラメータを探れればハック完了です。そのために、RGB の階調をジェネレータに渡してみました。結果はこうなりました。おー。青色がほとんど消えてますね。グラデーションの方

  • 1