タブで写真切り替え
Innovative Tools for Web Publishing JavaScript + Ruby + PHP + Interaction Design Hi! My name is Ryan Johnson. I develop web applications for businesses in the Puget Sound area, and maintain a number of open source projects. I invite you to explore some of the links below: LivePipe™ Blog Control Suite : High Quality Controls and Widgets for Prototype Object.Event : An Event Model for JavaScript Obj
JavaScriptを使って描画するCanvasとは？
Canvasとは、JavaScriptを使って動的に図を描くために策定された仕様です。これまで、動的に図を表示させる方法としては、Flashが代表的な選択肢でした。しかし、Canvasを使うことで、テキストエディタさえあれば、誰でも無料で動的に図を描くアプリケーションを作ることができるようになるのです。 手前みそで恐縮ですが、図1は筆者がCanvasを使って作った棒グラフを描くJavaScriptライブラリのキャプチャ画像です。Canvasを使うことで、簡単な図だけではなく、かなり凝ったデザインも扱うことができることがおわかりいただけると思います。 しかし、Canvasは決してFlashの代替技術ではありません。まずは、Canvasの特徴を簡単にまとめてみましょう。Canvasの特徴としては、「JavaScriptを使って描画する」「文字は描けない」「アニメーション機能がない」の3つがあり
IE8 で実装された Selectors API とは何か？ - IT戦記
はじめに IE8 には Selectors API という新しい仕様が実装されました。 ということで、今後 DOM 操作 API の主流になるであろう Selectors API についてまとめておきます。 Selectors API が使えるブラウザ 2008 年 3 月 6 日現在の一覧 WebKit Build Archives | WebKit (開発版の Safari) Windows | Official Site for Microsoft Windows 10 Home & Pro OS, laptops, PCs, tablets & more (IE8 の Beta 版) Selectors API とは Selectors API とは W3C で定義された仕様です。詳細に関してはこちらをどうぞ 簡単に説明すると getElementsByTagName や getE
MOONGIFT: » JavaScriptの開発のお供に「newjs」:オープンソースを毎日紹介
RailsがあるからRubyをやる、という訳ではないだろうがRailsからRubyに入ったという人は数多い。そうした人にとって、コントローラやモデル、テストケースまで生成できるコマンドラインツールは非常に便利に感じることだろう。 同様の手法をJavaScriptでも活かそうというのがこのソフトウェアだ。 今回紹介するオープンソース・ソフトウェアはnewjs、JavaScriptの開発、テスト環境構築ソフトウェアだ。 newjsはgemからインストールできる。そしてnewjsコマンドで必要なファイルを一気に生成してくれる。そしてテストケースも生成してくれるので、開発からテストと言った流れがスムーズになる。 サーバなどは特にないようで、生成されたHTMLファイルをブラウザで開いてUnitTestを実行する。他にも作成したファイルをRubyForgeへアップロードする機能や、Webサイト（ind
JavaScriptでSLを走らせる「SL.JS」を作りました | Creazy!
開発に関わっていて、UNIX（Linux）を触った事のある人は「SLコマンド」をご存知の方が多いのではないでしょうか？ lsを間違えてslと打つとこんなのが煙を吹きながら走る sl(1) コマンドを作りました． via: 豊田正史とslコマンド (Masashi Toyoda and SL command) ファイル一覧を出力する「ls」をtypoして「sl」と打ってしまうと、文字通りSLが画面を走り抜けるというすばらしくくだらない仕組みなのだ。いわゆる、ジョークコマンドの一つとしてとても有名で、多くの開発者の気持ちを和らげた（腰を砕いた）ことでしょう。 さて、そんなくだらないジョークコマンドを懐かしんでいると、JavaScriptでSLを動かしてみたくなってしまったので作ってみました。 ・SL.JS ブックマークレット方式にしてあるので、上のSL.JSリンクをブックマークして下さい。 ど
TinySegmenter: Javascriptだけで実装されたコンパクトな分かち書きソフトウェア
TinySegmenterはJavascriptだけ書かれた極めてコンパクトな日本語分かち書きソフトウェアです。 わずか25kバイトのソースコードで、日本語の新聞記事であれば文字単位で95%程度の精度で分かち書きが行えます。 Yahoo!の形態素解析のように サーバーサイドで解析するのではなく、全てクライアントサイドで解析を行うため、セキュリティの 観点から見ても安全です。分かち書きの単位はMeCab + ipadicと互換性があります。 デモ 日本語の文章を入力し、解析ボタンをクリックしてください。 ダウンロード TinySegmenterはフリーソフトウェアです. 修正BSDライセンスに従って本ソフトウェアを使用,再配布することができます. Download TinySegmenter version 0.2 使い方 <script type="text/javascript" src
JavaScript でお手軽テンプレートエンジン - Psychs's blog
JavaScript で DOM をがしがしいじるのは大変だけど、でかいテンプレートエンジンを使うのはちょっと大げさだ、というときがある。そんなときに気軽に使えるテンプレートエンジンを作ってみた。 ソースは以下の通り。 function applyTemplate(template, f) { try { return template.replace(/#\{[^#{}]+}/g, function(s) { var v = f(s.slice(2, -1)); return v == null ? '' : v.toString().escapeHTML(); }); } catch (e) { return '[' + e.name + '] ' + e.message; } } 使い方は、 <div id="template" style="display:none"> <h2>#
Route 477(2008-01-14)
■ [event][javascript] Kanasan.JS Javascript第5版読書会#2いってきた Shibuya.js meets Kansai. もし、日本のJavascript界の歴史にいくつかの転機を見出すとしたら、今日は 確実にその内の一つに選ばれるのではないか。 前代未聞、50人弱で輪になっての読書会。もちろん、グループ分けは無し。 果たして読書会として成立するのか？ Shibuya.jsからの使者amachangはLTに間に合うのか？ 博多行きの新幹線に乗ったnaoya_tは無事新大阪で降りられるのか！？ 続報、刮目して待て！ (訳：例によってやたら長いログを書いてるのですが編集中なので待って) ■ [javascript] Javascriptで無限ループを実現する5つの方法 「Javascriptで無限ループを実現する5つの方法」というLTをしました。 スラ
JavaScriptソースを整形して表示するGreaseMonkeyスクリプト、外部スクリプトのキャッシュ - 実用
JavaScriptsubtechグループ - マングローブ - VoxのTemplateクラス できちゃったGreaseMonkeyスクリプト!!そのページで利用されているJavaScriptをフォーマットと色付けを行い表示します。 ShowColorizedSource.user.js Web Developer拡張の[JavaScriptを表示する]機能をより見やすくしたものです。色の抽出と同じく、Web Developerのinformation.jsから多くをコピーして作りました。 以下はGoogleの検索結果で実行したイメージです。 調査したいページを表示し[ツール]-[User Script Commands]-[Show Colorized Source]をクリックすると、ページ内容が消えて、スクリプト一覧が表示されます。各スクリプトのタイトルをクリックすると、整形されたソ
IE7.js登場 - IEのCSS/HTML非準拠はこれで対応 | エンタープライズ | マイコミジャーナル
Dean Edwards氏は7日(米国時間)、IEの動作をW3C標準仕様へ準拠させるためのライブラリIE7.jsの最新版を公開した。IE7.jsはJavaScriptで開発されたMS Internet ExplorerのHTML/CSS表示を調整するライブラリ。IE7.jsを使うことでMSIEのHTML/CSSまわりの表示処理をよりW3C標準規約に準拠したものにする。IE5やIE6で透過PNGを表示できるようにもなる。 IE7.jsは基本的にMSIE5/6向けに用意されていたライブラリをIE7に対応させたもの。これまでのモジュール構造は廃止され、IE7.jsやIE8.jsといったように個別のファイルに分離されている。ホスティング先もGoogle Codeへ変更された。IE7.jsはサイズも縮小され、圧縮した状態で11KBほど。またbase2.DOMのセレクタエンジンを使うことでより高速に動
軽くてシンプルに使えるWYSIWYGエディタ「NicEdit」:phpspot開発日誌
NicEdit.com - Micro Inline WYSIWYG NicEdit is a Javascript/AJAX inline content editor to allow easy editing of web site content on the fly in the browser. 軽くてシンプルに使えるWYSIWYGエディタ「NicEdit」。 TinyMCEやFCKEditorは凄く重い(200KBオーバー)です。 でもNicEditなら30KB程度で上図のような必要最低限のWYSIWYGが実装できます。 これは覚えておきたいですね。 関連エントリ ６つの新コンポーネントを搭載したYUI 2.3.0がリリース！リッチテキストエディタ等 XHTMLを編集できるWYSIWYMエディタ「WYMeditor」 JavaScriptを使った各種WYSIWYGライブラリま
Railsプラグイン - ActiveJaxの密結合な実装にビックリ:TKMR.blog.show
ActiveJaxというRailsプラグインを見つけた ActiveJax - Simpltry Rails 「ActiveRecordのモデルをJavaScriptから叩ける」と書いてあり、RESTなWebAPIを叩くJesterの競合になりそうかな、と思ったら全然違った。 Jester-RESTfullなRails向けJavaScriptライブラリ Jesterの場合はあくまでもRESTなWebAPIに向かって、それっぽいURLでアクセスする。Railsのscaffold resourceで作られたWebAPIを想定してるけど、細かくカスタムも可能で別にPerlでもPHPでもJava, C# 相手は何でも良い。 ActiveJaxの場合は、ActiveRecordモデルの構造を見て動的にJavaScriptを作成しちゃう。こんな感じ #Model def _active_jax_met
MOONGIFT: » Yahoo! Pipesのような動きを実現「WireIt」:オープンソースを毎日紹介
Yahoo! Pipesには触ってみたことがあるだろうか。各種フィードやHTMLを取得、加工して別な形（フィードやJSON等）で出力できるWebアプリケーションだ。 そのYahoo! Pipesでは各データをつなげる時にパイプを伸ばしてビジュアル的に「接続」する。それを実現するライブラリがこれだ。 今回紹介するオープンソース・ソフトウェアはWireIt、オブジェクトをつなげるイフェクトを実現するライブラリだ。 WireItはYahoo! Inc.の提供するYUIを使い、Yahoo! Pipesライクなインタフェースを実現している。ボックスに付けられた丸をドラッグすると、パイプが伸び、それを別なボックスの丸に持っていくことで、接続できる。 これがただの直線であれば何だが、パイプのような曲線を描いてつながるのが面白い。サンプルは数多く登録されており、ボックスを追加して接続するもの、アニメーショ
jQueryベースの滑らかなグラフ描画ライブラリ「Flot」:phpspot開発日誌
Ruminations: Flot 0.1 released! It draws on inspiration from Plotr and PlotKit, and several other commercial packages. But also from venerable old gnuplot - there's nothing more boring than hand-picking axis scales so I wanted the default algorithm to be smart. jQueryベースの滑らかなグラフ描画ライブラリ「Flot」。 Flotを使えば次のようなグラフをJavaScriptで描画することが可能です。 コードは次のように書くみたいです。 <div id="placeholder" style="width:600px;height
MOONGIFT: » prototype.jsベースのカレンダー「protocalendar.js」:オープンソースを毎日紹介
よく、誕生日の入力などでドロップダウンリストから選ばせるものがあるが、あれほど入力が面倒なものはないと思っている。テキストボックスにそのまま数字で入れた方がよっぽども手軽だ。 とは言え、入力チェックやユーザビリティを考えるとそれもお勧めはできない。手軽で、さらに正確な入力が促せる方法としてこれをお勧めしたい。 今回紹介するオープンソース・ソフトウェアはprotocalendar.js、prototype.jsベースのカレンダー入力ライブラリだ。 protocalendar.jsはテキストボックスにフォーカスが当たるとカレンダーが表示されるライブラリだ。良くあるものだが、prototype.jsベースなのと、何より日本製というのが特徴だ。 日本製の嬉しい点としては、休日に対応している点だろう。ハッピーマンデーにも対応しているので、数年後の休日も表示されるのが素晴らしい。 さらに多言語対応によ
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
swfobject - SWFObject is an easy-to-use and standards-friendly method to embed Flash content, which utilizes one small JavaScript file - Google Project Hosting
memolog » Blog Archive » javascriptでSVM
http://blog.tkmr.org/tatsuya/show/301-jester-restfull-rails-javascript
Google Code Archive - Long-term storage for Google Code Project Hosting.
REVNODE