タグ

JavaScriptとjavascriptに関するdotgramのブックマーク (174)

  • フリーハンドでベジェ曲線を描く

    点列をベジェ曲線に変換する BezierGenerator.js のサンプルです。 このサンプルは Firefox, Opera くらいでしか動きませんが、BezierGenerator.js 自体に環境依存性はありません(たぶん)。

  • Google Web Toolkit - Google Code

    GWT is used by many products at Google, including Google AdWords and Google Wallet. It's open source, completely free, and used by thousands of enthusiastic developers around the world. GWT is the official open source project for GWT releases 2.5 and onwards. This site houses links to the documentation, source code repository, issues list and information related to GWT roadmap and release. It is i

  • Google Web Toolkit - yojikのlog

    多分Gmailとかで使われてそうなフレームワーク*1。 http://code.google.com/webtoolkit/ これすごい。逆転の発想だなー。 Javaで作ったウィジェットのソースをJavaScriptにコンパイルする事によってリッチなAjaxアプリを作る。実行は、JavaScriptで作られたJREエミュレーション用ランタイムを使って、クライアントのブラウザ上で行う。 開発時は「hosted mode」で開発する。このモードではコンパイルせずにJavaネイティブ(変な言い方)で実行することによって、デバッキングなどJavaのIDEのパワーをうまく生かした開発ができる。このモードのとき、GWTはAWTとかSwing上でブラウザをエミュレートするのではなく、埋め込みブラウザ*2と連携する。つまり埋め込みブラウザ側で画面表示やイベントのハンドリング等を実行する。Javaとブラウザ

    Google Web Toolkit - yojikのlog
  • JavaScript OOP におけるクラス定義方法 - IT戦記

    クラスを定義する方法です。考え付くだけでも、これだけたくさんの方法があります。やっぱり、 JavaScript って柔軟であり複雑な言語ですね。 ちなみに、以下のすべての例はこのクラスを定義しています。 ちなみに、僕は一番下の書き方ですね。 皆さんはどのようにプログラミングしていますか? プロトタイプを使わない。クロージャを使う。 // プロトタイプを使わない。 // クロージャを使う。 function Item(price) { this.showPrice = function() { alert(price); }; } プロトタイプを使わない。クロージャを使わない。 // プロトタイプを使わない。 // クロージャを使わない。 function Item(price) { this.price = price; this.showPrice = function() { aler

  • 関数的っポイ!? JavaScript: Days on the Moon

    関数型プログラミング言語を触ったことがないのでこれが関数的かどうかは知らないが、いちいち function とか return とか書くのは面倒くさいと思ったのと「関数の変形」や beyond.js 、boost::bind に影響を受けて、関数の変形を行うライブラリを作った。 まずは引数の束縛、及び入れ替え。「関数の変形」及び boost::bind にならって後々入力される引数を _n であらわすことにする。 function concat(a, b) { return "" + a + b; } concat.bind(_1, "a")("b"); // "ba" concat.bind("a", _1)("b"); // "ab" concat.bind(_2, _1)("a", "b"); // "ba" concat.bind(_1, _1)("a"); // "aa" 次に関

  • テーブルをJavascriptで自動的に見やすくする:phpspot開発日誌

    Automatic colored rows - Example for BiteSize Standards テーブルの背景って次のイメージのように行ごとに交互に色分けされていると見やすいですね。 かといって、サーバサイドでアイテムを回して、1個1個設定するのも結構面倒だったりします。 リンク先のサンプルでは、JavaScriptを使って、trエレメントを探索し、交互にクラスを割り当てていくことで、自動でテーブルに色をつけてるようです。 これで、テーブルはシンプルにHTMLでコーディングでき、サーバサイドの技術なしで見やすいテーブルが作成できますね。

  • ActiveXパッチがあたったIEでFlashなどを従来通り表示させるためのJavaScript(Flashのバージョン検出機能付き)

    2006年4月のActiveXパッチがあたったIEでFlashなどを従来通り表示させるためのJavaScript(Flashのバージョン検出機能付き) Eolasの特許回避のため、2006年4月の月例パッチでInternetExplorerのActiveX周りに変更が加えられました。 具体的には、従来のようにHTMLページ内にobjectタグやembedタグでFlashを表示するように記述した場合、Flash上にマウスカーソルを持って行くと「このコントロールをアクティブ化して使用するにはクリックしてください」 と表示され、そのFlashがクリックを受け付けたり、マウスの位置情報を取得したりするためには(インタラクティブに振る舞うには)、一旦Flash上でクリックなどをしてFlashコントロールをアクティブ化しなくてはならなくなりました。 これの回避方法として、外部JavaScriptによっ

  • TiddlyWiki - a reusable non-linear personal web notebook

    a non-linear personal web notebook

    TiddlyWiki - a reusable non-linear personal web notebook
    dotgram
    dotgram 2006/04/20
    HTMLファイル一個のwiki
  • ドラッグ&ドロップのインターフェース

    ドラッグ&ドロップのインターフェースは気分がいい。check*padでも使っている。 従来のウェブにはなかったものなので戸惑う人が多いとか、ユーザビリティ的にどうだ、とかいろいろあるが、一度その気持ちよさを味わうといろんなところで使ってみたくなる。 そこで登場したのがWatch This Nextだ。 このサイトでは「ドラッグ&ドロップでのDVDリコメンデーション」を実現している。次々に現れるDVDのタイトルを「好き!」「嫌い・・・」「まだ見ていない」にドラッグ&ドロップで分類していけば、あなたが好きそうなDVDを次々とおすすめしてくれるのだ。 「ドラッグ&ドロップで〜」っつうのは他にもいろいろ出てきそうですね。

  • Niceformでエレガントなフォーム生成:phpspot開発日誌

    badboy.media.design :: articles :: Niceforms Web forms. Everybody knows web forms. Each day we have to fill in some information in a web form, be it a simple login to your webmail application, an online purchase or signing up for a website. They are the basic (and pretty much the only) way of gathering information on the web. 配布されているJavascriptのファイルとCSSファイルを読み込むだけで、フォームデザインが早代わり。 HTMLに組み込む例) <scrip

  • yohei-y:weblog: Shibuya.js 行ってきた ($X 最高)

    昨日デジハリで行われた Shibuya.js Technical Talk#1 に行ってきました。 id:secondlife さんの結成宣言に始まり、 えとさんによるこの10年と次の10年の話、 IT戦記 amachang さんが javascript を300倍高速化した後、 竹迫さんによる爆笑プレゼン、 mala さんが自身の開発環境+ポリシーを余すことなく公開し、 id:secondlife さんから RJS Template のソース嫁とありがたいお言葉を頂戴して、 怒涛のライトニングトークの最後は怖いビデオをマッタリと視聴しつつ、 id:thx さんの軽快な司会て幕を閉じました。 どの発表も大変面白かったのですが個人的には cho45(さとう)さんの $X リスペクトです。 僕もグリモンスクリプトをちょこちょこ書いて遊んでいるんですが、 ちょっと前に見つけたこの $X なしでは

  • XPath でぐりもんだもん / Shibuya.js Technical Talk #1

    GM でよくあること クラス列挙したい (getElementsByClassName) ある要素を選択したい とか、既存のドキュメントを何かするのが殆ど。 JavaScript での XPath DOM Level 3 の仕様 現在では Gecko のみサポート Opera も 9 からサポート? こんなん: var xpathResult = document.evaluate( expression, context, resolver XPathResult.ANY_TYPE, null );

  • Shibuya.js TT#1

  • 最速インターフェース研究会 :: Shibuya.jsでしゃべってきました

    Shibuya.jsでJavaScriptの開発環境の話なんかをしゃべってきました。 プレゼン資料はこちら。少し内容削ってます。 http://ma.la/files/shibuya.js/techtalk1.html - ページめくり s/a or space - 行移動 j/k or enter Webrickのソースは結構適当でadhocにルールを追加したりしてる。なんかsecondlifeがYAMLで設定かけるようなのを作ったとか何か言ってた。 プレゼン資料だけだとわかりづらい部分があるのであとで個別にエントリを書きます。 [雑談]Opera M2はじめました。 公私ともにメールソフトはBecky! Ver.2 + POPFileを使っていたわけですが、[http://la.ma.la/blog:title]の方の「Operaはメーラー」という大胆発言にやられてしまい、いくつかある

  • C-Rose Charters, Specializing in Red Snapper

    * Single story * 2227 sq. ft. heated/cooled * 3 BR/2BA * Open greatroom/dining/kitchen * Separate sunroom * Heat pump * Low maintenance * 2 x 6 framing * Energy efficient * High ceilings * Old Chicago brick floors/Berber carpet in bedrooms * Large closets * Antique claw-foot tubs in both bathrooms * Oversized tile showers in each bathroom * Large pantry * Lots of custom cabinets * All appliances i

  • 文を短くする - こども(てれび)

    課題 さて、「文を短くする」を実践してみよう。 お皿ひとつひとつに、それぞれ、ハムや卵や、パセリや、キャベツ、ほうれんそう、お台所に残って在るもの一切合切、いろとりどりに、美しく配合させて、手際よく並べて出すのであって、手数は要らず、経済だし、ちっとも、おいしくはないけれども、でも卓は、ずいぶん賑やかに華麗になって、何だか、たいへん贅沢な御馳走のように見えるのだ。 ゲーム感覚で文を短くできるスクリプトを書きました。 ブログ文章術インベーダー どうぞご利用ください。

    文を短くする - こども(てれび)
  • JavaScript で引数束縛: Days on the Moon

    引数束縛 (カリー化) の話。まずは「JavaScriptでカリー化」(檜山正幸のキマイラ飼育記)。タイトルを見てどこかで聞いたような話だなと思ったら「関数の変形」(Effecttive JavaScript - Dynamic Scripting) だった。だが、前者は文字列に戻してから評価というのが力技っぽくて個人的に好きでないし、後者は汎用的過ぎていささかわかりにくい。そこで今回は先頭の引数から束縛していくというのに的を絞ってみたいと思う。 まず第 1 引数のみを束縛する場合。Function#apply を使えば引数を配列として渡せるので、束縛された値と後から渡された引数とを連結してやればいいのではないか。 function curry(func) { return function (first) { return function () { var args = Array.p

  • length プロパティのパフォーマンス: Days on the Moon

    「for 文 2.0」(IT戦記) では length プロパティの評価をループの外に出すことにより高速化を図っています。DOM の NodeList オブジェクト (document.getElementsByTagName() などで取得) や HTMLCollection オブジェクト (document.forms などで取得) の length プロパティは「生きている」(オブジェクト取得後の操作が反映される) 、すなわち誤解を恐れずいえば評価のたびに数えなおす必要があるので遅いというのも納得ですが、JavaScript のネイティブオブジェクトである配列の length プロパティはどうなのでしょうか。実際に調べてみました。 以下は 10000 個の span 要素に対する NodeList オブジェクトと配列の length プロパティのパフォーマンスを調べた結果です。数値は

  • for 文 2.0(笑) - IT戦記

    まぁ、かなり知られてる話ですが JavaScript は .(ドット) の計算がかなり遅い。まぁ、簡単なスクリプトなら問題にならないが。web2.0的には大違いなのであります。ちなみに、.(ドット) の計算に比較演算の 3 倍のコストがかかる(IEはとくに)。 ということで、for 文は下のように(比較に .(ドット) を使わない)書くくせをつけましょう。地道な差が大きなパフォーマンスを生みます。 // for 文 2.0 for(var i = 0, len = array.length; i < len; i++) { .... }各種ライブラリの for 文 1.0 を for 文 2.0 化するだけで、CPU 使用率がけっこう下がりました。 予断ですが、間違っても .(ドット) を避けるために with 文を使うようなことはやめてください。 with 文のコストは 比較演算の 8

    for 文 2.0(笑) - IT戦記
  • Pure JavaScript Wiki Like Formatter

    JavaScriptでWikiのフォーマッターを実装してみたものを利用した何かを作るために遊んでいたりいなかったり。 閲覧 (V) 編集 (E) JavaScriptでWikiのフォーマッターを実装してみたものを利用して、Wikiのページっぽくしてみたものです。叩き台。 ---- 1行以上の空行の連続(/\\n\\n+/)をブロックの区切りとみなすという仕様のため、空行がとても重要です。つまり何かにつけて空行を作れということ。 ---- 普通の文章はp要素でマークアップされます。普通の文章とは行頭に特殊な記号が存在しない行のことです。1行を段落とみなして、p要素でくくるということになります。 ---- インライン要素には一部対応しています。 - 強調したい文字列の前後を\'\'で括ると、''em要素''でマークアップされます - さらに強調したい文字列の前後を\'\'\'で括ると、'''s