次のセクションでは、jsui 固有のプロパティとメソッドについて述べています。js および jsui の両方に共通したプロパティとメソッドについては、js オブジェクトセクションを参照して下さい。
sketch (Sketch, get)
描画を行なわれる Sketch のインスタンス。下記はその簡単な例です。Sketch オブジェクトのプロパティとメソッドに関する完全な記述は、Sketch のリファレンスセクションを参照して下さい。function bang() { sketch.glclear(); sketch.glcolor(0.5,0.7,0.3); sketch.moveto(0.25,-0.25); sketch.circle(0.3); refresh(); }
refresh ()
this.sketch の内容をスクリーンにコピーします。jsui オブジェクトはユーザインターフェイスオブジェクトであるため、ユーザインターフェイスイベントを受け取り、処理することができます。現在のところ、サポートされるユーザインターフェイスイベントは、マウスの動作に関するものと、jsui オブジェクトのリサイズのみです。次のようなメソッドが Javascript コードで定義されている場合、これらのユーザインターフェイスイベントを扱うために呼び出されます。全てのマウスイベントハンドラは次のような標準の形式で定義されなければなりません。
function on<eventname> (x, y, button, modifier1, shift, capslock, option, modifier2) { // 処理を実行 }
modifier1 というアーギュメントは Macintosh のコマンドキーのステート（状態）と PC のコントロールキーのステートを、modifier2 というアーギュメントは Macintosh のコントロールキーのステートと PC の右ボタンのステートを表します。キーが押し下げられている場合に、修飾キーのステートは 1 になり、そうでない場合には 0 になります。イベントハンドラが後続のアーギュメントを考慮しない場合には、これを省略できます。
潜在的なややこしい問題の１つに、マウスイベントが、jsui オブジェクトの左上を (0,0)とし、右下を（幅、高さ）とする絶対スクリーン座標で与えられるということがあります。これに対し、Sketch の描画座標は (0,0)が中央、+1 が一番上、-1 が一番下という相対ワールド座標を使用し、x 座標は y 座標と同じスケール（縮尺）を使っています。スクリーン座標とワールド座標の間の変換には、sketch.screentoworld(x,y) と sketch.worldtoscreen(x,y,z)を使います。例えば、次のようになります。
function onclick (x, y) { sketch.glmoveto(sketch.screentoworld(x,y)); sketch.framecircle(0.1); refresh(); }
onclick (x, y, button, mod1, shift, caps, opt, mod2)
ondblclick (x, y, button, mod1, shift, caps, opt, mod2)
ondrag (x, y, button, mod1, shift, caps, opt, mod2)
onidle (x, y, button, mod1, shift, caps, opt, mod2)
onidleout (x, y, button, mod1, shift, caps, opt, mod2)
onresize (width, height)