2006-09-07 Thu
set.js - JavaScriptでset
- Summary
Pythonのset型を,Arrayを拡張してJavaScriptで実装.
setは要素が重複しないリスト.
格納できる型は,string型, number型, boolean型.
pushを使って要素を追加すると重複してしまう.
- Reference
最速インターフェース研究会 - 2006-09-06 - JavaScriptでPythonのsetみたいなの
http://la.ma.la/blog/diary_200609062338.htm
Python ライブラリリファレンス - 2.3.7 set (集合) 型
http://www.python.jp/doc/release/lib/types-set.html
set data type for javascript
http://la.ma.la/misc/js/set/
http://la.ma.la/misc/js/set/compat.js
http://la.ma.la/misc/js/set/set.js
2006-09-07 Thu
benchmark.js - JavaScriptのベンチマークツール
- Summary
JavaScriptのベンチマークツール.
連想配列の関数を渡せば利用可能.
benchmark()しか汚染しない.
FireBugのコンソールに表示することも可能.
- 使用上の注意
1. 計測はグローバル領域で行なうこと.
2. 軽すぎる関数は正確な値が出ないことがある.
- Usage
benchmark({ 'test1': function() { // do something }, 'test2': function() { // do something }, 'test3': function() { // do something } });
- Usage (FireBugを利用)
benchmark.at('firebug')({
'test1': function() {
// do something
},
'test2': function() {
// do something
},
'test3': function() {
// do something
}
});
- Sample (http://sample.ecmascript.jp/benchmark.html)
benchmark({ 'getElementById': function() { document.getElementById('target'); }, 'getElementsByTagName': function() { document.getElementsByTagName('target'); }, 'Prototype\'s $ function': function() { $('target'); } });
- Reference
IT戦記 - ベンチマークツール公開
http://d.hatena.ne.jp/amachang/20060906/1157571938
Benchmark Demo
http://sample.ecmascript.jp/benchmark.html
ソース
http://sample.ecmascript.jp/benchmark.js
2006-08-30 Wed
JavaScript ミニライブラリ
鷹の島 2006-07-17 - JavaScript ミニライブラリ
http://espion.just-size.jp/archives/06/198181103.html
2006-08-30 Wed
JavaScriptで配列をシャッフルする方法リファクタリング
- Reference
最速インターフェース研究会 2006-08-30 - 実践JavaScriptで配列をシャッフルする方法リファクタリング
http://la.ma.la/blog/diary_200608300350.htm
hail2u.net - Weblog - 2006-08-28 - JavaScriptで配列をシャッフル
http://hail2u.net/blog/coding/shuffle-array-in-javascript.html
Flash非公式テクニカルノート - FN0212002 - 配列をランダムに並替えるメソッドを定義する[上級テクニック]
http://www.fumiononaka.com/TechNotes/Flash/FN0212002.html
Flash非公式テクニカルノート - FN0212003 - 配列を偏りなくランダムに並替える
http://www.fumiononaka.com/TechNotes/Flash/FN0212003.html
2006-08-27 Sun
入力フォームをリサイズ可能にする JavaScript
- Reference
鷹の島 - 2006-08-25 - テキストエリアとかリサイズ可能にする JavaScript
http://espion.just-size.jp/archives/06/237175908.html
2006-08-25 Fri
CSS と JavaScriptを利用した訪問済み,未訪問サイトを分析
- Demo
Tapping into your browser history
http://icant.co.uk/sandbox/nickhistory.html
- Reference
techfoolery - 2006-08-21 - A New Way of Tracking Users' Browsing Habits
http://techfoolery.com/archives/2006/08/21/2042/
- via
phpspot開発日誌 - 2006-08-25 - CSS&JavaScriptを使ってサイト利用者の訪問済みor未訪問サイトを分析
http://phpspot.org/blog/archives/2006/08/cssjavascriptor.html
2006-08-23 Wed
JavaScriptソースを整形して表示するGreaseMonkeyスクリプト
- Reference
Collection & Copy - JavaScriptソースを整形して表示するGreaseMonkeyスクリプト、外部スクリプトのキャッシュ
http://d.hatena.ne.jp/brazil/20060820/1156022719
2006-08-22 Tue
JavaScript Lint - JavaScriptの文法をチェックするソフトウェア
- Summary
JavaScriptの文法をチェックするソフトウェア.
- JavaScript Lint が検出する一般的な誤り
o 行末にセミコロンが無い行
o ifやfor,while等のないところにあるブレース("{}")など
o returnやthrow,continueやbreakによって,実行されることが無くなってしまっているコード
o break文が無いcase文
o 数値の前や後についている小数点
o A leading zero that turns a number into octal (base 8).(?)
o コメント内にあるコメント
o Ambiguity whether two adjacent lines are part of the same statement.
o 一つの文なのかそうじゃないのか分からない,繋がった文
o 何もしていない文
- JavaScript Lint が検出する,そこまで一般的でない誤り
o バーレンやアサインメント,コロンやカンマが前に来ていない正規表現
o セミコロンではなくカンマで区切られてしまっている文
o おかしな場所でのインクリメントやデクリメント
o void が使われている時
o "x+++y" や "x---y" の様に連続している "+" や "-"
o while や for ループの中で labeled ステートメントが使われいる部分
o ブレースが使われていないif, for, while
- Reference
JavaScript Lint
http://www.javascriptlint.com/
The Online Lint (JavaScript Lint Online版)
http://www.javascriptlint.com/online_lint.php
Out of Hanwell (JavaScript Lint開発者のblog)
http://www.outofhanwell.com/blog/
7korobi8oki.com - 2005-08-19 - "JavaScript Lint"でJavaScriptの文法を細かくチェックする
http://www.7korobi8oki.com/mt/archives/000080.html
2006-08-22 Tue
WebFX - グラフを描くためのJavaScriptライブラリ
- Sample
<html> <head> <script type="text/javascript" src="includes/iecanvas.js"></script> <script type="text/javascript" src="includes/chart.js"></script> <script type="text/javascript" src="includes/canvaschartpainter.js"></script> <link rel="stylesheet" type="text/css" media="screen" href="includes/canvaschart.css" /> </head> <body> <div id="chart" class="chart" style="width: 400px; height: 200px;"></div> </body> </html>
function draw() { var c = new Chart(document.getElementById('chart')); c.setDefaultType(CHART_AREA | CHART_STACKED); c.setGridDensity(5, 5); c.setVerticalRange(0, 100); c.setHorizontalLabels(['mon', 'tue', 'wed', 'thu', 'fri']); c.add('Spam', '#4040FF', [ 5, 10, 20, 10, 40, 52, 68, 70, 70, 60]); c.add('Innocent', '#8080FF', [ 8, 7, 12, 20, 24, 16, 36, 28, 28, 45]); c.add('Missed Spam', '#A5A5FF', [ 8, 7, 12, 20, 24, 16, 36, 36, 18, 5]); c.add('False Positives', '#DEDEFF', [ 1, 2, 3, 2, 1, 4, 18, 12, 8, 7]); c.draw(); } window.onload = function() { ieCanvasInit('includes/iecanvas.htc'); draw(); };
- Reference
Chart Usage (WebFX)
http://webfx.eae.net/dhtml/chart/usage.html
- via
phpspot開発日誌 - 2006-08-22 - JavaScriptでグラフを描画出来るライブラリ『WebFX』
http://phpspot.org/blog/archives/2006/08/javascriptwebfx.html
2006-08-22 Tue
qooxdoo - JavaScriptのGUIツールキット
- Reference
qooxdoo
http://qooxdoo.org/
MOONGIFT - qooxdoo
http://oss.moongift.jp/intro/i-2260.html
MOONGIFT - qooxdoo レビュー
http://oss.moongift.jp/review/i-2263.html
2006-08-22 Tue
Scriptio - プレゼンテーション用の JavaScript のフレームワーク
- Reference
Scriptio - A JavaScript Presentation Framework
http://www.scriptio.us/
Scriptio - Examples
http://www.scriptio.us/examples.php
- via
ユビキタスの街角 - 2006-07-14 - ボーっと読めるブログ
http://pitecan.com/blog/2006/07/blog-post.html
2006-08-16 Wed
PlotKit - Canvas, VML, SVG でグラフを描画するためのJavaScriptライブラリ
- Summary
グラフを描画することに特化したJavaScriptライブラリ.
<table> 内の数値をデータとして扱うことも可能.
MochiKit を利用して開発されている.
Internet Explorer でも Canvas をエミュレートして,ベクターな画像が表示可能.
- グラフを扱うライブラリなど
XML/SWF Charts, PHP/SWF Charts[2005-03-10-6]
- クロスブラウザなベクタグラフィック描画ライブラリ
DrawingCanvas.js [2006-01-10-12]
wz_jsgraphics.js[2006-07-03-9]
- Reference
liquidx.net - PlotKit - Javascript Chart Plotting
http://www.liquidx.net/plotkit/
2006-08-14 Mon
JavaScript 1.7 の新機能
- Reference
Days on the Moon - 2006-08-12 - JavaScript 1.7 の新機能
http://nanto.asablo.jp/blog/2006/08/12/481381
Hawk's Laboratory - 2006-08-13 - JavaScript 1.7の新機能
http://blog.hawklab.jp/item-84.html
2006-08-09 Wed
incsearch.js - インクリメンタルサーチライブラリ
- Summary
JavaScriptによるインクリメンタルサーチを行うためのライブラリ
creative commons (帰属 2.1 日本) ライセンス.
- 利用例
Enjoy×Study - del.icio.us IncSearch - del.icio.usをインクリメンタルサーチ
http://www.enjoyxstudy.com/javascript/bookmarklet/delicious_incsearch/
Enjoy×Study - hatebu IncSearch - はてなブックマークをインクリメンタルサーチ
http://www.enjoyxstudy.com/javascript/bookmarklet/hatebu_incsearch/
- Reference
Enjoy×Study - incsearch.js - インクリメンタルサーチライブラリ
http://www.enjoyxstudy.com/javascript/incsearch/
Enjoy×Study - incsearch.jsを使って、del.icio.us direc.torのようなものを作ってみた
http://d.hatena.ne.jp/onozaty/20060319/p1
2006-08-09 Wed
suggest.js - 入力補完ライブラリ
- Summary
JavaScriptで入力補完を手軽に行うためのライブラリ
creative commons (帰属 2.1 日本) ライセンス.
- Reference
Enjoy×Study - suggest.js - 入力補完ライブラリ
http://www.enjoyxstudy.com/javascript/suggest/
2006-08-09 Wed
glayer.js - グレーアウト表示させるためのJavaScriptライブラリ
- Summary
Lightbox などのように,背景全体をグレーアウト表示させるためのライブラリ
creative commons (帰属 2.1 日本) ライセンス.
- Reference
Enjoy×Study - glayer.js - グレーアウト表示ライブラリ
http://www.enjoyxstudy.com/javascript/glayer/
Enjoy×Study - 背景をグレーアウト表示するためのライブラリを作ってみました。
http://d.hatena.ne.jp/onozaty/20060807/p1
- via
phpspot開発日誌 - グレーアウト表示ライブラリ:glayer.js
http://phpspot.org/blog/archives/2006/08/glayerjs.html
2006-08-08 Tue
JavaScript 1.7のyield文とは
- Reference
outsider reflex - JavaScript 1.7のyield文ってなんじゃらほ
http://piro.sakura.ne.jp/latest/blosxom.cgi/webtech/javascript/2006-08-07_yield.htm
IT戦記 - JavaScript 1.7 の yield が凄すぎる件について
http://d.hatena.ne.jp/amachang/20060805/1154743229
2006-08-07 Mon
JavaScriptで履歴,Undoの実現
- Reference
IBM - Ajaxを利用してPHPを開発する、第2回: 「戻る」「進む」「更新」
http://www-06.ibm.com/jp/developerworks/opensource/060802/j_os-php-rad2.shtml
- via
オレンジニュース - 2006-08-04
http://secure.ddo.jp/~kaku/tdiary/20060804.html#p03
2006-08-04 Fri
JavaScriptでブラウザの表示領域のサイズを取得する方法
- Summary
| ブラウザ | 表示モード | 表示領域の幅を取得するプロパティ | 表示領域の高さを取得するプロパティ |
| IE 6 | 標準 | document.documentElement.clientWidth | document.documentElement.clientHeight |
| IE 6 | 互換 | document.body.clientWidth | document.body.clientHeight |
| FireFox 1.5 | 標準 | document.documentElement.clientWidth | document.documentElement.clientHeight |
| FireFox 1.5 | 互換 | document.body.clientWidth | document.body.clientHeight |
| Opera 9 | 標準 | document.body.clientWidth | document.body.clientHeight |
| Opera 9 | 互換 | document.body.clientWidth | document.body.clientHeight |
FireFox,Operaのwindow.innerWidth,window.innerHeightでは,スクロールバー自体も含んだサイズとなる.
スクロールバーが表示されている場合には,表示領域のサイズより+10数px大きいサイズになる.
- Reference
Enjoy×Study - ブラウザの表示領域のサイズを取得する方法
http://d.hatena.ne.jp/onozaty/20060802/p1
Enjoy×Study - ブラウザのスクロールバーで隠れている領域を含むサイズを取得する方法
http://d.hatena.ne.jp/onozaty/20060803/p1
2006-07-25 Tue
マウスホイールのイベント検知
- Summary
| ブラウザ | event | property | 手前に回転 |
| Internet Explorer | onmousewheel | WheelDelta | 負 |
| Firefox | DOMMouseScroll | detail | 正 |
| Opera | onmousewheel | WheelDelta,detail | 正 |
- Reference
Mouse wheel programming in JavaScript
http://adomas.org/javascript-mouse-wheel/
Mouse wheel programming in JavaScript - Demo
http://adomas.org/javascript-mouse-wheel/test.html
JavaScript++かも日記: マウスホイールで拡大縮小
http://jsgt.org/mt/archives/01/000044.html
インフォシーク ホームページ作成 - マウスホイールで画像を拡大縮小する
http://iswebmag.hp.infoseek.co.jp/sample105.html
せつないぶろぐ : JavaScriptによるマウスホイールのイベント処理
http://f56.aaa.livedoor.jp/~tdnr/ppblog/?id=06060007
暴満館 - OperaのJavaScriptでマウスホイールを検知できるようになった
http://bmky.net/diary/log/1336.html
- via
GIGAZINE - マウスホイールの回転イベントをJavaScriptで検知する
http://gigazine.net/index.php?/news/comments/20060725_javascript_wheel/