Web application APIs

8.1. Scripting

【 この節の和訳は、 別ページ にて。 】

8.2. `WindowOrWorkerGlobalScope^I ~mixin

`WindowOrWorkerGlobalScope$I ~mixinは、 `Window$I, `WorkerGlobalScope$I 両~obj上に公開されることになる~APIを利用するためにある。 ◎ The WindowOrWorkerGlobalScope mixin is for use of APIs that are to be exposed on Window and WorkerGlobalScope objects.

注記： 他の標準は、 partial interface mixin `WindowOrWorkerGlobalScope$I { … }; を利用して，適切な参照-とともに更に拡張することが奨励される。 ◎ Other standards are encouraged to further extend it using partial interface mixin WindowOrWorkerGlobalScope { … }; along with an appropriate reference.

typedef (DOMString or `Function$I) `TimerHandler@I;

interface mixin `WindowOrWorkerGlobalScope@I {
  [Replaceable] readonly attribute USVString `origin$m;

  // base64 utility methods
  DOMString `btoa$m(DOMString %data);
  ByteString `atob$m(DOMString %data);

  // timers
  long `setTimeout$m(
      `TimerHandler$I %handler,
      optional long %timeout = 0,
      any... %arguments
  );
  void `clearTimeout$m(optional long %handle = 0);
  long `setInterval$m(
      `TimerHandler$I %handler,
      optional long %timeout = 0,
      any... %arguments
  );
  void `clearInterval$m(optional long %handle = 0);

  // ImageBitmap
  Promise<`ImageBitmap$I> `createImageBitmap$m(
      `ImageBitmapSource$I %image,
      optional `ImageBitmapOptions$I %options
  );
  Promise<`ImageBitmap$I> `createImageBitmap$m(
      `ImageBitmapSource$I %image,
      long %sx, long %sy, long %sw, long %sh,
      optional `ImageBitmapOptions$I %options
  );
};
`Window$I includes `WindowOrWorkerGlobalScope$I;
`WorkerGlobalScope$I includes `WindowOrWorkerGlobalScope$I;

%origin = self . `origin$m

当の大域~objの`生成元$を文字列に直列化した結果を返す。 ◎ Returns the global object's origin, serialized as string.

var %frame = document.createElement("iframe")
%frame.onload = function() {
  var %frameWin = %frame.contentWindow
  console.log(%frameWin.location.origin) // "null"
  console.log(%frameWin.origin) // "https://stargate.example"
}
document.body.appendChild(%frame)

`origin@m

取得子は、次の結果を返さ~MUST ⇒ `生成元を直列化する$( 此れに`関連する設定群~obj$の`生成元$enV ) ◎ The origin attribute's getter must return this object's relevant settings object's origin, serialized.

8.3. ~base64用の便利~method

`atob()$m ／ `btoa()$m ~methodにより、内容~dataと~base64符号化法との間で相互に変形できるようになる。 ◎ The atob() and btoa() methods allow developers to transform content to and from the base64 encoding.

注記： これらの~method名は、語呂的には "b" は "binary", "a" は "ASCII" を表すと考えられるが、主に歴史的~理由から，実施においては入力, 出力のいずれも ~Unicode文字列である。 【 `atob()^m が返す値は `ByteString^I 型に改められたが（過去には `DOMString^I 型だった）、いずれにせよ，~JS側においては文字列になる。】 ◎ In these APIs, for mnemonic purposes, the "b" can be considered to stand for "binary", and the "a" for "ASCII". In practice, though, for primarily historical reasons, both the input and output of these functions are Unicode strings.

%result = self . `btoa( data )$m

各 文字が［ 範囲 { 0x00 〜 0xFF } の同じ値をとる~binary~byte ］を表現しているような，~Unicode文字列の形をとる［ 範囲 { `0000^U 〜 `00FF^U } の文字のみからなる入力~data ］を，その~base64表現に変換した結果を返す。 ◎ Takes the input data, in the form of a Unicode string containing only characters in the range U+0000 to U+00FF, each representing a binary byte with values 0x00 to 0xFF respectively, and converts it to its base64 representation, which it returns.

入力~文字列~内に範囲~外の文字がある場合、 `InvalidCharacterError$E 例外が投出される。 ◎ Throws an "InvalidCharacterError" DOMException exception if the input string contains any out-of-range characters.

%result = self . `atob( data )$m

~Unicode文字列の形をとる［ ~base64に符号化された ~binary~data ］を包含する入力を，［ 範囲 { `0000^U 〜 `00FF^U } の文字のみからなる~Unicode文字列 ］に復号した結果を返す — 各 文字が［ 範囲 { 0x00 〜 0xFF } の同じ値をとる~binary~byte ］を表現しているような。 ◎ Takes the input data, in the form of a Unicode string containing base64-encoded binary data, decodes it, and returns a string consisting of characters in the range U+0000 to U+00FF, each representing a binary byte with values 0x00 to 0xFF respectively, corresponding to that binary data.

入力~文字列が妥当な~base64~dataでない場合、 `InvalidCharacterError$E 例外が投出される。 ◎ Throws an "InvalidCharacterError" DOMException if the input string is not valid base64 data.

`btoa(data)@m

被呼出時には、次を走らせ~MUST： ◎ The btoa(data) method must＼

1. ~IF［ %data 内に［ 符号位置 ~GT `00FF^U ］なる文字がある ］ ⇒ ~THROW `InvalidCharacterError$E ◎ throw an "InvalidCharacterError" DOMException if data contains any character whose code point is greater than U+00FF.＼
2. ~RET `~forgiving-base64符号化する$( `同型に符号化する$( %data ) ) ◎ Otherwise, the user agent must convert data to a byte sequence whose nth byte is the eight-bit representation of the nth code point of data, and then must apply forgiving-base64 encode to that byte sequence and return the result.

`atob(data)@m

被呼出時には、次を走らせ~MUST： ◎ The atob(data) method, when invoked, must run the following steps:

1. %結果 ~LET `~forgiving-base64復号する$( %data ) ◎ Let decodedData be the result of running forgiving-base64 decode on data.
2. ~IF［ %結果 ~EQ `失敗^i ］ ⇒ ~THROW `InvalidCharacterError$E ◎ If decodedData is failure, then throw an "InvalidCharacterError" DOMException.
3. ~RET %結果 ◎ Return decodedData.

8.4. 動的~markup挿入

【 この節の内容の和訳は、 別ページ にて。 】

8.5. ~timer

`setTimeout()$m ／ `setInterval()$m ~methodにより、作者は，~timerに基づく~callbackを~scheduleできるようになる。 ◎ The setTimeout() and setInterval() methods allow authors to schedule timer-based callbacks.

%handle = self . `setTimeout( handler [, timeout [, arguments... ] ] )$m

%timeout ~milli秒~後に %handler を走らす~timeoutを~scheduleする。 %arguments は そのまま %handler に渡される。 ◎ Schedules a timeout to run handler after timeout milliseconds. Any arguments are passed straight through to the handler.

%handle = self . `setTimeout( code [, timeout ] )$m

%timeout ~milli秒~後に %code を~compileして走らす~timeoutを~scheduleする ◎ Schedules a timeout to compile and run code after timeout milliseconds.

self . `clearTimeout( handle )$m

［ `setTimeout()$m ／ `setInterval()$m により設定された~timeout ］のうち， %handle で識別されるものを取消す。 ◎ Cancels the timeout set with setTimeout() or setInterval() identified by handle.

%handle = self . `setInterval( handler [, timeout [, arguments... ] ] )$m

%timeout ~milli秒ごとに %handler を走らす~timeoutを~scheduleする。 %arguments は そのまま %handler に渡される。 ◎ Schedules a timeout to run handler every timeout milliseconds. Any arguments are passed straight through to the handler.

%handle = self . `setInterval( code [, timeout ] )$m

%timeout ~milli秒ごとに %code を~compileしてを走らす~timeoutを~scheduleする。 ◎ Schedules a timeout to compile and run code every timeout milliseconds.

self . `clearInterval( handle )$m

［ `setTimeout()$m ／ `setInterval()$m により設定された~timeout ］のうち， %handle で識別されるものを取消す。 ◎ Cancels the timeout set with setInterval() or setTimeout() identified by handle.

注記： ~timerは、入子にできる。 ただし、そのような入子にされた~timerが 5 個を超えて以降は，~intervalは、 4 ~milli秒~以上に強制される。 ◎ Timers can be nested; after five such nested timers, however, the interval is forced to be at least four milliseconds.

注記： この~APIは、~timerが正確に~schedule通りに走らすことは保証しない。 CPU 負荷, 他の~task, 等々に因る延期が予期される。 ◎ This API does not guarantee that timers will run exactly on schedule. Delays due to CPU load, other tasks, etc, are to be expected.

`WindowOrWorkerGlobalScope$I ~mixinを実装する~objは、 `作動中の~timer~list@ を持つ。 この~list内の各~entryは、 数で識別される。 それらの数は、~objが存続する限り，~listの中で一意で~MUST。 ◎ Objects that implement the WindowOrWorkerGlobalScope mixin have a list of active timers. Each entry in this lists is identified by a number, which must be unique within the list for the lifetime of the object that implements the WindowOrWorkerGlobalScope mixin.

`setTimeout()@m

被呼出時には、［ 次を与える下で，`~timer初期化~手続き$から返される値 ］を返さ~MUST ⇒＃ %~method引数~list ~SET この~methodに渡された引数たち, %~method文脈 ~SET 此れ, %繰返~flag ~SET ~OFF ◎ The setTimeout() method must return the value returned by the timer initialization steps, passing them the method's arguments, the object on which the method for which the algorithm is running is implemented (a Window or WorkerGlobalScope object) as the method context, and the repeat flag set to false.

`setInterval()@m

被呼出時には、［ 次を与える下で，`~timer初期化~手続き$から返される値 ］を返さ~MUST ⇒＃ %~method引数~list ~SET この~methodに渡された引数たち, %~method文脈 ~SET 此れ, %繰返~flag ~SET ~ON ◎ The setInterval() method must return the value returned by the timer initialization steps, passing them the method's arguments, the object on which the method for which the algorithm is running is implemented (a Window or WorkerGlobalScope object) as the method context, and the repeat flag set to true.

`clearTimeout(handle)@m

`clearInterval(handle)@m

これらのいずれも，被呼出時には、此れの`作動中の~timer~list$内に %handle により識別される~entryがあれば、それを~clearし~MUST （なければ何もしない）。 ◎ The clearTimeout() and clearInterval() methods must clear the entry identified as handle from the list of active timers of the WindowOrWorkerGlobalScope object on which the method was invoked, if any, where handle is the argument passed to the method. (If handle does not identify an entry in the list of active timers of the WindowOrWorkerGlobalScope object on which the method was invoked, the method does nothing.)

注記： 両~methodとも，同じ~listに属する~entryを~clearするので、いずれも `setTimeout()$m ／ `setInterval()$m で作成された~timerを~clearするのに利用できる。 ◎ Because clearTimeout() and clearInterval() clear entries from the same list, either method can be used to clear timers created by setTimeout() or setInterval().

`~timer初期化~手続き@ は、所与の ⇒＃ %~method引数~list, %~method文脈, %繰返~flag, %前回handle（省略時は ε，非 ε にされるのは %繰返~flag ~EQ ~ON の場合に限られる） ◎終 に対し，次を走らす： ◎ The timer initialization steps, which are invoked with some method arguments, a method context, a repeat flag which can be true or false, and optionally (and only if the repeat flag is true) a previous handle, are as follows:

1. %~method文脈~proxy ~LET %~method文脈 に応じて ⇒＃ `WorkerGlobalScope$I ~objであるならば %~method文脈 ／ `Window$I ~objであるならば %~method文脈 に対応する `WindowProxy$I ~obj ◎ Let method context proxy be method context if that is a WorkerGlobalScope object, or else the WindowProxy that corresponds to method context.
2. %handle ~LET %前回handle ◎ ↓

3. ~IF［ %handle ~EQ ε ］：

   1. %handle ~SET ~UA により定義される正~整数であって，この~callにより`作動中の~timer~list$に設定される~timeoutを識別するもの
   2. `作動中の~timer~list$に %handle 用の~entryを追加する
   ◎ If previous handle was provided, let handle be previous handle; otherwise, let handle be a user-agent-defined integer that is greater than zero that will identify the timeout to be set by this call in the list of active timers. ◎ If previous handle was not provided, add an entry to the list of active timers for handle.
4. ( %~call元~Realm, %~call先~Realm ) ~LET ( `現在の~Realm~Record$js, %~method文脈 の`~JS~realm$js ) ◎ Let callerRealm be the current Realm Record, and calleeRealm be method context's JavaScript realm.
5. %起動元~script~LET `作動中の~script$ ◎ Let initiating script be the active script.
6. ~Assert： %起動元~script ~NEQ ~NULL — この~algoの~call元は，常に何らかの~scriptなので。 ◎ Assert: initiating script is not null, since this algorithm is always called from some script.

7. %~task ~LET 次の下位手続きを走らす`~task$： ◎ Let task be a task that runs the following substeps:

   1. ~IF［ `作動中の~timer~list$内に %handle に対応する~entryはない ］ ⇒ ~RET ◎ If the entry for handle in the list of active timers has been cleared, then abort these steps.
   2. %S ~LET %~method引数~list の最初の引数 ◎ Run the appropriate set of steps from the following list:
   3. ~IF［ %S は `Function$I である ］ ⇒ 次を与える下で %S を`呼出す$x ⇒＃ 引数~list： %~method引数~list の 3 個目~以降の引数（空にもなり得る）, `~callback this 値$x： %~method文脈~proxy ◎ If the first method argument is a Function • Invoke the Function. Use the third and subsequent method arguments (if any) as the arguments for invoking the Function. Use method context proxy as the callback this value.

   4. ~ELSE： ◎ Otherwise

      1. `HostEnsureCanCompileStrings$jA( %~call元~Realm, %~call先~Realm ) を遂行する ⇒ 例外が投出されたときは、~catchして ⇒＃ その`例外を報告する$； ~RET ◎ Perform HostEnsureCanCompileStrings(callerRealm, calleeRealm). If this throws an exception, catch it, report the exception, and abort these steps.
      2. %設定群~obj~LET %~method文脈 の`環境~設定群~obj$ ◎ Let script source be the first method argument. ◎ Let settings object be method context's environment settings object.
      3. %基底~URL~LET %起動元~script の`基底~URL$sC ◎ Let base URL be initiating script's base URL.

      4. %~fetch~options ~LET 次のようにされた`~script~fetch~options$ ⇒＃ `暗号用~nonce$sfO ~SET %起動元~script の`~fetch~options$sC の`暗号用~nonce$sfO, `完全性~metadata$sfO ~SET 空~文字列, `構文解析器~metadata$sfO ~SET `not-parser-inserted^l, `資格証~mode$sfO ~SET %起動元~script の`~fetch~options$sC の`資格証~mode$sfO, `~referrer施策$sfO ~SET %起動元~script の`~fetch~options$sC の`~referrer施策$sfO ◎ Let fetch options be a script fetch options whose cryptographic nonce is initiating script's fetch options's cryptographic nonce, integrity metadata is the empty string, parser metadata is "not-parser-inserted", credentials mode is initiating script's fetch options's credentials mode, and referrer policy is initiating script's fetch options's referrer policy.

         これらの~optionsによる効果は、［ `setTimeout()$m ／ `setInterval()$m ］が文字列を~compileするときの挙動は， `eval()$c によるそれと等価になることを確保する。 すなわち、 `import()$c 介して~fetchする【される？】`~module~script$は，両~文脈において同じに挙動することになる。 ◎ The effect of these options ensures that the string compilation done by setTimeout() and setInterval() behaves equivalently to that done by eval(). That is, module script fetches via import() will behave the same in both contexts.

      5. %~script~LET `~classic~scriptを作成する$( %S, %設定群~obj, %基底~URL, %~fetch~options ) ◎ Let script be the result of creating a classic script given script source, settings object, base URL, and fetch options.
      6. `~classic~scriptを走らす$( %~script ) ◎ Run the classic script script.
   5. ~IF［ %繰返~flag ~EQ ~ON ］ ⇒ 次を与える下で，`~timer初期化~手続き$を再度~callする ⇒＃ %~method引数~list ~SET %~method引数~list, %~method文脈 ~SET %~method文脈, %繰返~flag ~SET ~ON, %前回handle ~SET %handle ◎ If the repeat flag is true, then call timer initialization steps again, passing them the same method arguments, the same method context, with the repeat flag still set to true, and with the previous handle set to handler.
8. %timeout ~LET %~method引数~list の 2 個目の引数 ◎ Let timeout be the second method argument.

9. %入子~level ~LET ［ 現在~走っている`~task$は，この~algoにより作成された`~task$ならば その~taskの`~timerの入子~level$ ／ ~ELSE_ 0 ］ ◎ If the currently running task is a task that was created by this algorithm, then let nesting level be the task's timer nesting level. Otherwise, let nesting level be zero.

   注記： ~taskの`~timerの入子~level$は、［ `setTimeout()$m に対する入子の~call， `setInterval()$m により作成される繰返しの~timer ］のいずれに対しても利用される（この 2 つが混在する入子もあり得る）。 言い換えれば、特定0の~methodではなく，この~algoの入子の呼出しを表現する。 ◎ The task's timer nesting level is used both for nested calls to setTimeout(), and for the repeating timers created by setInterval(). (Or, indeed, for any combination of the two.) In other words, it represents nested invocations of this algorithm, not of a particular method.

10. ~IF［ %timeout ~LT 0 ］ ⇒ %timeout ~SET 0 ◎ If timeout is less than 0, then set timeout to 0.
11. ~IF［ %入子~level ~GT 5 ］~AND［ %timeout ~LT 4 ］ ⇒ %timeout ~SET 4 ◎ If nesting level is greater than 5, and timeout is less than 4, then set timeout to 4.
12. %入子~level ~INCBY 1 ◎ Increment nesting level by one.
13. %~task の`~timerの入子~level@ ~LET %入子~level ◎ Let task's timer nesting level be nesting level.
14. ~RET %handle — ただし、この~algoの以降も`並列的$に走らせる ◎ Return handle, and then continue running this algorithm in parallel.

15. %~method文脈 に応じて：

    `Window$I ~objである場合：

    %~method文脈 に`結付けられている文書$が`全部的に作動中$になるまで 更に %timeout ~milli秒~待機する（連続的でなくともよい 【？】 ）。

    `WorkerGlobalScope$I ~objである場合：

    ~workerを休止せずに %timeout ~milli秒~待機する（連続的でなくともよい）。

    ◎ If method context is a Window object, wait until the Document associated with method context has been fully active for a further timeout milliseconds (not necessarily consecutively). ◎ Otherwise, method context is a WorkerGlobalScope object; wait until timeout milliseconds have passed with the worker not suspended (not necessarily consecutively).

16. この~algoのこの呼出し %A とは別の，この~algoの呼出し %B のうち，次をすべて満たすものがあれば，それらが完了するまで待機する：

    • %B は完了していない
    • ( %B における %~method文脈 ) ~EQ ( %A における %~method文脈 )
    • %B は %A より先に呼出された
    • ( %B における %timeout ) ~LTE ( %A における %timeout ) †

    【† 例えば ( %A, %B ) における %timeout が ( 1, 2 ) の場合、 %B が %A の 100 ~milli秒~先に呼出されていても， %A から先に実行される余地があることになる。 （ひょっとして、この段の %timeout は時間長そのままではなく，それが指す時点を意図している？） 】

    ◎ Wait until any invocations of this algorithm that had the same method context, that started before this one, and whose timeout is equal to or less than this one's, have completed.

    注記： Web IDL に定義されるように、引数の変換は，この~algoが呼出される前に Web IDL にて定義される~algo内で起こる — 例えば、最初の引数として渡された ~obj上の `toString()^m ~methodを呼出すような： ◎ Argument conversion as defined by Web IDL (for example, invoking toString() methods on objects passed as the first argument) happens in the algorithms defined in Web IDL, before this algorithm is invoked.

    例えば、次のちっぽけな~codeによる結果の %log は `ONE TWO ^l になる： ◎ So for example, the following rather silly code will result in the log containing "ONE TWO ":

    var %log = '';
    function logger(%s) { %log += %s + ' '; }
    
    setTimeout({ toString: function () {
      setTimeout("logger('ONE')", 100);
      return "logger('TWO')";
    } }, 100);
    

17. ~UAの任意選択で ⇒ ~UAにより定義される時間だけ待機する。 ◎ Optionally, wait a further user-agent defined length of time.

    注記： この段が意図する所は、~UAが機器の電力消費を最適化する必要に応じて，~timeoutを~~延長できるようにするためである。 例えば、~timerの粒度を抑えるような節電~modeを有する~processorも中にはあり、そのような~platform上では，~UAは，より正確0な非~節電~modeを利用することを要求する代わりに，この~scheduleに見合うように~timerを遅めれる。 ◎ This is intended to allow user agents to pad timeouts as needed to optimize the power usage of the device. For example, some processors have a low-power mode where the granularity of timers is reduced; on such platforms, user agents can slow timers down to fit this schedule instead of requiring the processor to use the more accurate mode with its associated higher power usage.

18. `~task$ %~task を`~queueする$ ◎ Queue the task task.

    注記： ［ %繰返~flag ~EQ ~OFF ］の下では、~taskの処理-後に，`作動中の~timer~list$から %handle に対応する~entryを除去しても安全である（この時点を過ぎて以降，~entryの存在を検出する仕方はないので、技術的に問題0になることはない）。 ◎ Once the task has been processed, if the repeat flag is false, it is safe to remove the entry for handle from the list of active timers (there is no way for the entry's existence to be detected past this point, so it does not technically matter one way or the other).

これらの`~task$の`~task源$は、 `~timer~task源@ とする。 ◎ The task source for these tasks is the timer task source.

function doExpensiveWork() {
  var %done = false;
  // ...
  /* 
この部分は、 %done を ~T に設定するまでに数~milli秒かかる
◎
this part of the function takes up to five milliseconds set done to true if we're done
 */
  // ...

  return %done;
}

function rescheduleWork() {
  var %handle = setTimeout(rescheduleWork, 0); /*
      
次回の反復を予め~scheduleしておく
◎
preschedule next iteration
 */
  if (doExpensiveWork())
    clearTimeout(%handle); /*
      
用済みになったら~timeoutを~clearする
◎
clear the timeout if we don't need it
 */
}

function scheduleWork() {
  setTimeout(rescheduleWork, 0);
}

scheduleWork(); /*
  
たくさんの仕事を行う~taskを~queueする
◎
queues a task to do lots of work
 */

8.6. 利用者~向けの~prompt

8.7. ~systemの状態と能力

【 この節の内容の和訳は、 別ページ にて。 】

8.8. 画像

[Exposed=(Window,Worker), `Serializable$, `Transferable$]
interface `ImageBitmap@I {
  readonly attribute unsigned long `width$m;
  readonly attribute unsigned long `height$m;
  void `close$m();
};

typedef (`CanvasImageSource$I or
         `Blob$I or
         `ImageData$I) `ImageBitmapSource@I;

enum `ImageOrientation@I { `~none1$l, `flipY$l };
enum `PremultiplyAlpha@I { `none$l, `premultiply$l, `default$l };
enum `ColorSpaceConversion@I { `~none0$l, `~default0$l };
enum `ResizeQuality@I { `pixelated$l, `low$l, `medium$l, `high$l };

dictionary `ImageBitmapOptions@I {
  `ImageOrientation$I `imageOrientation$m = `~none1$l;
  `PremultiplyAlpha$I `premultiplyAlpha$m = `default$l;
  `ColorSpaceConversion$I `colorSpaceConversion$m = `~default0$l;
  [EnforceRange] unsigned long `resizeWidth$m;
  [EnforceRange] unsigned long `resizeHeight$m;
  `ResizeQuality$I `resizeQuality$m = `low$l;
};

`ImageBitmap$I ~objは、過度の遅延なく~canvasに塗れるような，~bitmap画像を表現する。 ◎ An ImageBitmap object represents a bitmap image that can be painted to a canvas without undue latency.

注記： 何を以って過度の遅延とするかの正確な判定は実装者に委ねられるが、一般に，~bitmapの利用~時に ~network I/O, や~local~disk I/O を要するならば，遅延はおそらく過度になる。 一方で，他を阻むのは GPU や~system RAM からの読取りに限られるならば、遅延はおそらく受容-可能になる。 ◎ The exact judgement of what is undue latency of this is left up to the implementer, but in general if making use of the bitmap requires network I/O, or even local disk I/O, then the latency is probably undue; whereas if it only requires a blocking read from a GPU or system RAM, the latency is probably acceptable.

%promise = self . `createImageBitmap$m(%image [, %options ])

%promise = self . `createImageBitmap$m(%image, %sx, %sy, %sw, %sh [, %options ])

所与の %image から新たな `ImageBitmap$I が作成された時点で解決される，~promiseを返す — %image は次のいずれかをとり得る ⇒ `img$e 要素 ／ `~SVG-image$ 要素 ／ `video$e 要素 ／ `canvas$e 要素 ／ `Blob$I ~obj ／ `ImageData$I ~obj ／ 別の `ImageBitmap$I ~obj ◎ Takes image, which can be an img element, an SVG image element, a video element, a canvas element, a Blob object, an ImageData object, or another ImageBitmap object, and returns a promise that is resolved when a new ImageBitmap is created.

`ImageBitmap$I ~objを構築できなかった場合 — 例えば、供された %image ~dataが実際には画像でなかったなど — ~promiseは却下される。 ◎ If no ImageBitmap object can be constructed, for example because the provided image data is not actually an image, then the promise is rejected instead.

%sx, %sy, %sw, %sh 引数が供された場合、~source画像は，それらが成す矩形に切抜かれる — 元の画像に無い画素は、`透明な黒$に置換される。 これらの座標は、~source画像の~pixel座標~空間であり，`~CSS~pixel$単位ではない。 ◎ If sx, sy, sw, and sh arguments are provided, the source image is cropped to the given pixels, with any pixels missing in the original replaced by transparent black. These coordinates are in the source image's pixel coordinate space, not in CSS pixels.

%options が供された場合、 `ImageBitmap$I ~objの~bitmap~dataは， %options に則って改変される。 例えば［ %options の `premultiplyAlpha$m ~option ~EQ `premultiply$l ］ならば、`~bitmap~data$ の各~色~channelは その~alpha~channelにより乗算済みにされる。 ◎ If options is provided, the ImageBitmap object's bitmap data is modified according to options. For example, if the premultiplyAlpha option is set to "premultiply", the bitmap data's color channels are premultiplied by its alpha channel.

~source画像の状態が妥当でない場合、~promiseは `InvalidStateError$E で却下される — 例えば：

• 成功裡に読込まれなかった `img$e 要素
• `ImageBitmap$I ~objであって［ `Detached$sl 内部~slot値 ~EQ ~T ］なるもの
• `ImageData$I ~objであって［ `data$m 属性~値の `ViewedArrayBuffer^sl 内部~slotは detached 【 `IsDetachedBuffer$jA( 内部~slotの値 ) ~EQ ~T 】 ］なるもの
• `Blob$I であって その~dataを~bitmap画像に解釈できないもの

◎ Rejects the promise with an "InvalidStateError" DOMException if the source image is not in a valid state (e.g., an img element that hasn't loaded successfully, an ImageBitmap object whose [[Detached]] internal slot value is true, an ImageData object whose data attribute value's [[ViewedArrayBuffer]] internal slot is detached, or a Blob whose data cannot be interpreted as a bitmap image).

~scriptから~source画像の画像~dataへの~accessは許容されない場合、 ~promiseは `SecurityError$E `DOMException$I で却下される（例： `~CORS非同一生成元$の `video$e ／ 別の`生成元$からの~worker内の~scriptにより描かれている `canvas$e ）。 ◎ Rejects the promise with a "SecurityError" DOMException if the script is not allowed to access the image data of the source image (e.g. a video that is CORS-cross-origin, or a canvas being drawn on by a script in a worker from another origin).

%imageBitmap . `close$m()

%imageBitmap の下層の`~bitmap~data$を解放する。 ◎ Releases imageBitmap's underlying bitmap data.

%imageBitmap . `width$m

画像の`内在的~横幅$を`~CSS~pixel$単位で返す。 ◎ Returns the intrinsic width of the image, in CSS pixels.

%imageBitmap . `height$m

画像の`内在的~縦幅$を`~CSS~pixel$単位で返す。 ◎ Returns the intrinsic height of the image, in CSS pixels.

各 `ImageBitmap$I %O は： ◎ ↓

• ［ %O の `Detached$sl 内部~slot値 ~EQ ~F ］ならば、常に 横幅, 縦幅を伴う `~bitmap~data@ が結付けられる 【~T にされたときは、この~dataは解放される（ ε にされる）】 。 しかしながら、この~dataは壊れていることもあり得る。 `ImageBitmap$I ~objは、その~media~dataが~errorなしに復号できるならば， `全部的に復号-可能@ と呼ばれる。 ◎ An ImageBitmap object whose [[Detached]] internal slot value is false always has associated bitmap data, with a width and a height. However, it is possible for this data to be corrupted. If an ImageBitmap object's media data can be decoded without errors, it is said to be fully decodable.
• %O の~bitmapは、`生成元clean~flag$を持つ — それは、［ ~bitmapが，異なる`生成元$からの内容に染まっている（ tainted ）かどうか ］を指示する。 この~flagは、初期~時には ~T に設定され（染まっていない）， `createImageBitmap()$m の手続きにより ~F に変化し得る。 ◎ An ImageBitmap object's bitmap has an origin-clean flag, which indicates whether the bitmap is tainted by content from a different origin. The flag is initially set to true and may be changed to false by the steps of createImageBitmap().

各 `ImageBitmap$I は、`直列化-可能$／`転送-可能$である： ◎ ImageBitmap objects are serializable objects and transferable objects.

• その`直列化~手続き$は、所与の ( %値, %直列形 ) に対し，次を走らす： ◎ Their serialization steps, given value and serialized, are:

  1. %直列形 . `BitmapData^sl ~SET %値 の`~bitmap~data$の複製 ◎ Set serialized.[[BitmapData]] to a copy of value's bitmap data.
  2. %直列形 . `OriginClean^sl ~SET %値 の`生成元clean~flag$ ◎ Set serialized.[[OriginClean]] to true if value's origin-clean flag is set, and false otherwise.

• その`逆直列化~手続き$は、所与の ( %直列形, %値 ) に対し，次を走らす： ◎ Their deserialization steps, given serialized and value, are:

  1. %値 の`~bitmap~data$ ~SET %直列形 . `BitmapData^sl ◎ Set value's bitmap data to serialized.[[BitmapData]].
  2. ~IF［ %直列形 . `OriginClean^sl ~EQ ~T ］ ⇒ %値 の`生成元clean~flag$ ~SET ~T ◎ If serialized.[[OriginClean]] is true, set value's origin-clean flag.

• その`転送-手続き$は、所与の ( %値, %~data保持体 ) に対し，次を走らす： ◎ Their transfer steps, given value and dataHolder, are:

  1. %~data保持体 . `BitmapData^sl ~SET %値 の`~bitmap~data$ ◎ Set dataHolder.[[BitmapData]] to value's bitmap data.
  2. %~data保持体 . `OriginClean^sl ~SET %値 の`生成元clean~flag$ ◎ Set dataHolder.[[OriginClean]] to true if value's origin-clean flag is set, and false otherwise.
  3. %値 の`~bitmap~data$ ~SET ε ◎ Unset value's bitmap data.

• その`転送-受信-時の手続き$は、所与の ( %~data保持体, %値 ) に対し，次を走らす： ◎ Their transfer-receiving steps, given dataHolder and value, are:

  1. %値 の`~bitmap~data$ ~SET %~data保持体 . `BitmapData^sl ◎ Set value's bitmap data to dataHolder.[[BitmapData]].
  2. ~IF［ %~data保持体 . `OriginClean^sl ~EQ ~T ］ ⇒ %値 の`生成元clean~flag$ ~SET ~T ◎ If dataHolder.[[OriginClean]] is true, set value's origin-clean flag.

`createImageBitmap(image, options)@m

`createImageBitmap(image, sx, sy, sw, sh, options)^m

被呼出時には、次を走らせ~MUST： ◎ The createImageBitmap(image, options) and createImageBitmap(image sx, sy, sw, sh, options) methods, when invoked, must run these steps:

1. %promise ~LET `新たな~promise$ ◎ Let p be a new promise.
2. %xywh ~LET ［ %sx, %sy, %sw, %sh 引数は指定されているならば ~T ／ ~ELSE_ ~F ］ ◎ ↓
3. ~IF［ %xywh ~EQ ~T ］ ⇒ ~IF［ %sw ~EQ 0 ］~OR［ %sh ~EQ 0 ］ ⇒＃ `RangeError$E で %promise を`却下する$； ~RET %promise ◎ If either sw or sh is given and is 0, then return p rejected with a RangeError.
4. `~resize横幅@V ~LET ［ %options に `resizeWidth@m は在するならば その値 ／ ~ELSE_ ε ］ ◎ ↓
5. `~resize縦幅@V ~LET ［ %options に `resizeHeight@m は在するならば その値 ／ ~ELSE_ ε ］ ◎ ↓
6. ~IF［ `~resize横幅$V ~EQ 0 ］~OR［ `~resize横幅$V ~EQ 0 ］ ⇒＃ `InvalidStateError$E で %promise を`却下する$； ~RET %promise ◎ If either options's resizeWidth or options's resizeHeight is present and is 0, then return p rejected with an "InvalidStateError" DOMException.
7. %image 引数は利用~可能か検査する ⇒ ~IF［ 例外が投出された／結果は `bad^i ］ ⇒＃ `InvalidStateError$E で %promise を`却下する$； ~RET %promise ◎ Check the usability of the image argument. If this throws an exception or returns bad, then return p rejected with an "InvalidStateError" DOMException.

8. %~bitmapを得る手続き ~LET 次を走らす下位手続き：

   1. ( %~bitmap~data, %生成元clean ) ~LET %image から`~bitmap~dataを取得する$
   2. ~IF［ %~bitmap~data ~EQ ε ］ ⇒＃ `InvalidStateError$E 例外で %promise を`却下する$； ~RET ε
   3. %O ~LET 新たな `ImageBitmap$I ~obj
   4. %O の`~bitmap~data$ ~SET %~bitmap~data を`~source矩形に切抜いて整形する$
   5. %O の~bitmapの`生成元clean~flag$ ~SET %生成元clean
   6. ~RET %O
   ◎ ↓

9. ~IF［ %image は `Blob$I ~objである ］ ⇒ 次を`並列的$に走らす：

   1. %~bitmap ~LET %~bitmapを得る手続き を走らせた結果
   2. ~IF［ %~bitmap ~NEQ ε ］ ⇒ %~bitmap で %promise を`解決する$
   ◎ ↓

10. ~ELSE：

    1. %~bitmap ~LET %~bitmapを得る手続き を走らせた結果
    2. ~IF［ %~bitmap ~NEQ ε ］ ⇒ 次を`並列的$に走らす ⇒ %~bitmap で %promise を`解決する$
    ◎ ↓
11. ~RET %promise ◎ ↓

【 この訳では、原文の~algoを再構成している — その重複する~logicを上の手続きに集約し，重複しない部分は次の “`~bitmap~dataを取得する$” に抜き出している。 】

上の手続きにて %image から `~bitmap~dataを取得する@ ときは、 %image に応じて，次を走らす： ◎ Let imageBitmap be a new ImageBitmap object. ◎ Switch on image:

`img$e

`~SVG-image$

1. %寸法 ~LET %image の~media~dataの`内在的~寸法$ ◎ ↓

2. ~IF［ %寸法 ~EQ ε（例： 内容~sizeが指定されていない~vector~graphic） ］：

   1. ~IF［ `~resize横幅$V ~EQ ε ］~OR［ `~resize縦幅$V ~EQ ε ］ ⇒ ~RET ( ε, ε )
   2. ~UAは、 %image を~size ( `~resize横幅$V, `~resize縦幅$V ) の~bitmapに描画するべきである 【 “べき” とは？】
   ◎ If image's media data has no intrinsic dimensions (e.g., it's a vector graphic with no specified content size) and either options's resizeWidth or options's resizeHeight is not present, then return p rejected with an "InvalidStateError" DOMException. ◎ If image's media data has no intrinsic dimensions (e.g., it's a vector graphics with no specified content size), it should be rendered to a bitmap of the size specified by the resizeWidth and the resizeHeight options.
3. %~bitmap~data ~LET %image の~media~dataを`代表する~bitmap~data$の複製 ◎ Set imageBitmap's bitmap data to a copy of image's media data, cropped to the source rectangle with formatting. If this is an animated image, imageBitmap's bitmap data must only be taken from the default image of the animation (the one that the format defines is to be used when animation is not supported or is disabled), or, if there is no such image, the first frame of the animation.
4. %生成元clean ~LET ［ 次が満たされるならば ~T ／ ~ELSE_ ~F ］ ⇒ ( %image の画像の`生成元$, `入口~設定群~obj$により指定される`生成元$enV ) は`同一生成元$である ◎ If the origin of image's image is not same origin with entry settings object's origin, then set the origin-clean flag of imageBitmap's bitmap to false.
5. ~RET ( %~bitmap~data, %生成元clean ) ◎ Run this step in parallel: • Resolve p with imageBitmap.

`video$e

1. ~IF［ %image の `networkState$m 属性~値 ~EQ `NETWORK_EMPTY$m ］ ⇒ ~RET ( ε, ε )： ◎ If image's networkState attribute is NETWORK_EMPTY, then return p rejected with an "InvalidStateError" DOMException.
2. %~bitmap~data ~LET `現在の再生位置$にある~frameの複製 — その~sizeは `~media資源$の ( `内在的~横幅$video, `内在的~縦幅$video ) とする（すなわち，縦横比による補正は適用-済み） ◎ Set imageBitmap's bitmap data to a copy of the frame at the current playback position, at the media resource's intrinsic width and intrinsic height (i.e., after any aspect-ratio correction has been applied), cropped to the source rectangle with formatting.
3. %生成元clean ~LET ［ 次が満たされるならば ~T ／ ~ELSE_ ~F ］ ⇒ ( %image の動画の`生成元$, `入口~設定群~obj$により指定される`生成元$enV ) は`同一生成元$である ◎ If the origin of image's video is not same origin with entry settings object's origin, then set the origin-clean flag of imageBitmap's bitmap to false.
4. ~RET ( %~bitmap~data, %生成元clean ) ◎ Run this step in parallel: • Resolve p with imageBitmap.

`canvas$e

1. ~RET ( %image の`~bitmap~data$の複製, %image の~bitmapの`生成元clean~flag$ ) ◎ Set imageBitmap's bitmap data to a copy of image's bitmap data, cropped to the source rectangle with formatting. ◎ Set the origin-clean flag of the imageBitmap's bitmap to the same value as the origin-clean flag of image's bitmap. ◎ Run this step in parallel: • Resolve p with imageBitmap.

`Blob$I ~obj ◎ If image is a Blob object

1. %画像~data ~LET %image から~dataを読取る 【読取り演算により？】 ⇒ 読取る間に~errorが生じたときは ⇒ ~RET ( ε, ε ) ◎ Run these step in parallel: ◎ Let imageData be the result of reading image's data. If an error occurs during reading of the object, then reject p with an "InvalidStateError" DOMException and abort these steps.
2. %画像~data の公式的な型 ~LET ［ %image の `type$m 属性で与えられる~MIME型 ］を与える下で，`画像~sniff時の規則$を適用して、 %画像~data の~file形式を決定した結果 ◎ Apply the image sniffing rules to determine the file format of imageData, with MIME type of image (as given by image's type attribute) giving the official type.

3. ~IF［ 次のいずれかが満たされる ］ ⇒ ~RET ( ε, ε )：

   • %画像~data の公式的な型は~supportされる画像~file形式でない（例：画像でない）
   • %画像~data は壊れている
   • %画像~data から寸法を得られない（例： 内在的~sizeを伴わない~vector~graphic）
   ◎ If imageData is not in a supported image file format (e.g., it's not an image at all), or if imageData is corrupted in some fatal way such that the image dimensions cannot be obtained (e.g., a vector graphic with no intrinsic size), then reject p with an "InvalidStateError" DOMException and abort these steps.
4. %~bitmap~data ~LET %画像~data を`代表する~bitmap~data$ ◎ Set imageBitmap's bitmap data to imageData, cropped to the source rectangle with formatting. If this is an animated image, imageBitmap's bitmap data must only be taken from the default image of the animation (the one that the format defines is to be used when animation is not supported or is disabled), or, if there is no such image, the first frame of the animation.
5. ~RET ( %~bitmap~data, ~T ) ◎ Resolve p with imageBitmap.

`ImageData$I

1. ~IF［ `IsDetachedBuffer$jA( %image の `data$m 属性~値の `ViewedArrayBuffer^sl 内部~slot値 ) ~EQ ~T ］ ⇒ ~RET ( ε, ε ) ◎ Let buffer be image's data attribute value's [[ViewedArrayBuffer]] internal slot. ◎ If IsDetachedBuffer(buffer) is true, then return p rejected with an "InvalidStateError" DOMException.
2. ~RET ( %image が与える画像~data, ~T ) ◎ Set imageBitmap's bitmap data to image's image data, cropped to the source rectangle with formatting. ◎ Run this step in parallel: • Resolve p with imageBitmap.

`ImageBitmap$I

1. ~RET ( %image の`~bitmap~data$の複製, %image の~bitmapの`生成元clean~flag$ ) ◎ Set imageBitmap's bitmap data to a copy of image's bitmap data, cropped to the source rectangle with formatting. ◎ Set the origin-clean flag of imageBitmap's bitmap to the same value as the origin-clean flag of image's bitmap. ◎ Run this step in parallel: • Resolve p with imageBitmap.

◎ ↑↑Return p.

上の手続きにて，`~bitmap~data$ %入力 を `~source矩形に切抜いて整形する@ ときは、次の手続きを走らす： ◎ When the steps above require that the user agent crop bitmap data to the source rectangle with formatting, the user agent must run the following steps: • Let input be the bitmap data being transformed.

1. %~source矩形 ~LET ( 左端, 上端, 右端, 下端 ) が次で与えられる矩形：

   %xywh ~EQ ~T の場合

   • 左端： max( min( %sx, %sx + %sw ), 0)
   • 上端： max( min( %sy, %sy + %sh ), 0)
   • 右端： min( max( %sx, %sx + %sw ), %入力 の横幅 )
   • 下端： min( max( %sy, %sy + %sh ), %入力 の縦幅 )

   他の場合

   ( 0, 0, %入力 の横幅, %入力 の縦幅 )

   ◎ If sx, sy, sw and sh are specified, let sourceRectangle be a rectangle whose corners are the four points (sx, sy), (sx+sw, sy),(sx+sw, sy+sh), (sx,sy+sh). Otherwise let sourceRectangle be a rectangle whose corners are the four points (0,0), (width of input, 0), (width of input, height of input), (0, height of input). ◎ If either sw or sh are negative, then the top-left corner of this rectangle will be to the left or above the (sx, sy) point. ◎ Clip sourceRectangle to the dimensions of input.
2. ( %横幅, %縦幅 ) ~LET %~source矩形 の ( 横幅, 縦幅 )

3. ( %出力~横幅, %出力~縦幅 ) ~LET (`~resize横幅$V, `~resize縦幅$V ) に応じて，次の表で与えられる値を整数に切り上げた結果：

   `~resize横幅$V	`~resize縦幅$V	%出力~横幅	%出力~縦幅
   非ε	非ε	`~resize横幅$V	`~resize縦幅$V
   非ε	ε	`~resize横幅$V	%縦幅 × `~resize横幅$V ÷ %横幅
   ε	非ε	%横幅 × `~resize縦幅$V ÷ %縦幅	`~resize縦幅$V
   ε	ε	%横幅	%縦幅

   ◎ Let outputWidth be determined as follows: • If the resizeWidth member of options is specified •• the value of the resizeWidth member of options • If the resizeWidth member of options is not specified, but the resizeHeight member is specified •• the width of sourceRectangle, times the value of the resizeHeight member of options, divided by the height of sourceRectangle, rounded up to the nearest integer • If neither resizeWidth nor resizeHeight are specified •• the width of sourceRectangle Let outputHeight be determined as follows: • If the resizeHeight member of options is specified •• the value of the resizeHeight member of options • If the resizeHeight member of options is not specified, but the resizeWidth member is specified •• the height of sourceRectangle, times the value of the resizeWidth member of options, divided by the width of sourceRectangle, rounded up to the nearest integer • If neither resizeWidth nor resizeHeight are specified •• the height of sourceRectangle
4. %平面 ~LET ( x 軸は右向き, y 軸は下向き ) にされた, 広さ無限の, `透明な黒$の平面 ◎ ↓

5. %入力 を，次に従うように %平面 に~~合成する：

   • %入力 の左上隅は、 %平面 の原点に位置させる。
   • %入力 画像~data内の各~画素は、 %平面 において 1 × 1 の正方形を占めるとする。
   ◎ Place input on an infinite transparent black grid plane, positioned so that its top left corner is at the origin of the plane, with the x-coordinate increasing to the right, and the y-coordinate increasing down, and with each pixel in the input image data occupying a cell on the plane's grid.
6. %出力 ~LET %平面 上の %~source矩形 が占める矩形~内の画像を，~size ( %出力~横幅, %出力~縦幅 ) に拡縮した結果 ⇒ この拡縮に用いる~algoは、 `resizeQuality$m ~optionの値に基づくべきである ◎ Let output be the rectangle on the plane denoted by sourceRectangle. ◎ Scale output to the size specified by outputWidth and outputHeight. The user agent should use the value of the resizeQuality option to guide the choice of scaling algorithm.

7. %options の `imageOrientation@m ~memberの値に応じて：

   `flipY@l

   %出力 を縦向きに裏返す — ~sourceの画像~方位~metadata（ `EXIF$r ~metadataなど）があっても無視rする ◎ If the value of the imageOrientation member of options is "flipY", output must be flipped vertically, disregarding any image orientation metadata of the source (such as EXIF metadata), if any. [EXIF]

   `~none1@l

   何もしない ◎ If the value is "none", no extra step is required.

8. ~IF［ %image は `img$e 要素または `Blob$I ~objである ］ ⇒ `colorSpaceConversion@m ~memberの値に応じて： ◎ If image is an img element or a Blob object, let val be the value of the colorSpaceConversion member of options, and then run these substeps:

   `~default0@l

   色~空間の変換の挙動は，実装~特有である — 実装は、画像を~canvasに描く際に利用する色~空間に則って選ぶべきである。 ◎ If val is "default", the color space conversion behavior is implementation-specific, and should be chosen according to the color space that the implementation uses for drawing images onto the canvas.

   `~none0@l

   %出力 は、色~空間の変換を遂行することなく復号され~MUST。 これは、 画像を復号する~algoは［ ~source~data内に埋込まれている色~profile~metadata, 表示~機器の色~profile ］のいずれも無視し~MUSTことを意味する。 ◎ If val is "none", output must be decoded without performing any color space conversions. This means that the image decoding algorithm must ignore color profile metadata embedded in the source data as well as the display device color profile.

   注記： ~canvasの~native色~空間は、現在は指定されていないが、将来的には変更されることが予期されている。 ◎ The native color space of canvas is currently unspecified, but this is expected to change in the future.

9. %options の `premultiplyAlpha@m ~memberの値に応じて： ◎ Let val be the value of premultiplyAlpha member of options, and then run these substeps:

   `default@l

   %出力 を~alphaにより乗算済みにするかどうかは、実装~特有である — 実装は、画像を~canvasに描くために最適と判断されるものに則って選ぶべきである。 ◎ If val is "default", the alpha premultiplication behavior is implementation-specific, and should be chosen according to implementation deems optimal for drawing images onto the canvas.

   `premultiply@l

   ~IF［ %出力 は~alphaにより乗算済みでない ］ ⇒ %出力 のすべての 色~成分を~alphaで乗算する ◎ If val is "premultiply", the output that is not premultiplied by alpha must have its color components multiplied by alpha and that is premultiplied by alpha must be left untouched.

   `none@l

   ~IF［ %出力 は~alphaにより乗算済みである ］ ⇒ %出力 のすべての色~成分を~alphaで除算する ◎ If val is "none", the output that is not premultiplied by alpha must be left untouched and that is premultiplied by alpha must have its color components divided by alpha.

10. ~RET %出力 ◎ Return output.

`close()@m

被呼出時には、次を走らせ~MUST： ◎ When the close() method is called, the user agent must run these steps:

1. 此れの `Detached$sl 内部~slot値 ~SET ~T ◎ Set this ImageBitmap object's [[Detached]] internal slot value to true.
2. 此れの`~bitmap~data$ ~SET ε ◎ Unset this ImageBitmap object's bitmap data.

`width@m

取得子は、次を走らせ~MUST： ◎ The width attribute's getter must run these steps:

1. ~IF［ 此れの `Detached$sl 内部~slotの値 ~EQ ~T ］ ⇒ ~RET 0 ◎ If this ImageBitmap object's [[Detached]] internal slot's value is true, then return 0.
2. ~RET `~CSS~pixel$単位による，此れの横幅 ◎ Return this ImageBitmap object's width, in CSS pixels.

`height@m

取得子は、次を走らせ~MUST： ◎ The height attribute's getter must run these steps:

1. ~IF［ 此れの `Detached$sl 内部~slotの値 ~EQ ~T ］ ⇒ ~RET 0 ◎ If this ImageBitmap object's [[Detached]] internal slot's value is true, then return 0.
2. ~RET `~CSS~pixel$単位による，此れの縦幅 ◎ Return this ImageBitmap object's height, in CSS pixels.

`ResizeQuality$I 列挙型の値 `resizeQuality@m は、画像の拡縮-時に利用する補間~品質の選好を表すために利用される — とり得る値の意味は： ◎ The ResizeQuality enumeration is used to express a preference for the interpolation quality to use when scaling images.

`pixelated@l

画像の外観をできるだけ保つような選好を指示する。 双線形~補間など、色を “滑らかに” 拡縮する~algoは，受容-可能である。 ◎ The "pixelated" value indicates a preference to scale the image that maximizes the appearance. Scaling algorithms that "smooth" colors are acceptable, such as bilinear interpolation.

`low@l

低~品質な画像~補間の選好を指示する。 計算量は `high$l より少なく済み得る。 ◎ The "low" value indicates a preference for a low level of image interpolation quality. Low-quality image interpolation may be more computationally efficient than higher settings.

`medium@l

中間~品質の画像~補間の選好を指示する。 ◎ The "medium" value indicates a preference for a medium level of image interpolation quality.

`high@l

高~品質な画像~補間の選好を指示する。 計算量は `low$l より多くなり得る。 ◎ The "high" value indicates a preference for a high level of image interpolation quality. High-quality image interpolation may be more computationally expensive than lower settings.

注記： 双線形~拡縮は、比較的~高速で，より低~品質な画像を滑らかに補間する~algoの例である。 双三次 ／ Lanczos 拡縮は、より高~品質な出力を生産する画像~拡縮~algoの例である。 この仕様は、値 `pixelated$l を除いて，特定の補間~algoの利用を義務付けない。 ◎ Bilinear scaling is an example of a relatively fast, lower-quality image-smoothing algorithm. Bicubic or Lanczos scaling are examples of image-scaling algorithms that produce higher-quality output. This specification does not mandate that specific interpolation algorithms be used unless the value is "pixelated".

var %sprites = {};
function loadMySprites() {
  var %image = new Image();
  %image.src = 'mysprites.png';
  var %resolver;
  var %promise = new Promise(function (%arg) { %resolver = %arg });
  %image.onload = function () {
    %resolver(Promise.all([
      createImageBitmap(%image,  0,  0, 40, 40)
        .then(function (%image) { %sprites.person = %image }),
      createImageBitmap(%image, 40,  0, 40, 40)
        .then(function (%image) { %sprites.grass   = %image }),
      createImageBitmap(%image, 80,  0, 40, 40)
        .then(function (%image) { %sprites.tree  = %image }),
      createImageBitmap(%image,  0, 40, 40, 40)
        .then(function (%image) { %sprites.hut   = %image }),
      createImageBitmap(%image, 40, 40, 40, 40)
        .then(function (%image) { %sprites.apple = %image }),
      createImageBitmap(%image, 80, 40, 40, 40)
        .then(function (%image) { %sprites.snake = %image })
    ]));
  };
  return %promise;
}

function runDemo() {
  var %canvas = document.querySelector('canvas#demo');
  var %context = %canvas.getContext('2d');
  %context.drawImage(%sprites.tree, 30, 10);
  %context.drawImage(%sprites.snake, 70, 10);
}

loadMySprites().then(runDemo);

8.9. ~animation~frame

`requestAnimationFrame(callback)@m

被呼出時には、次を走らせ~MUST： ◎ When the requestAnimationFrame() method is called, the user agent must run the following steps:

1. %文書 ~LET 此れに`結付けられている文書$ ◎ Let document be this Window object's associated Document.
2. %文書 の`~animation~frame~callback識別子$ ~INCBY 1
3. %識別子 ~LET %文書 の`~animation~frame~callback識別子$ ◎ Increment document's animation frame callback identifier by one.
4. %callback に %識別子 を結付ける ◎ ↓
5. %文書 の`~animation~frame~callback~list$に %callback を付加する ◎ Append the method's argument to document's list of animation frame callbacks, associated with document's animation frame callback identifier's current value.
6. ~RET %識別子 ◎ Return document's animation frame callback identifier's current value.

`cancelAnimationFrame(handle)@m

被呼出時には、次を走らせ~MUST： ◎ When the cancelAnimationFrame() method is called, the user agent must run the following steps:

1. ~IF［ 此れに`結付けられている文書$の`~animation~frame~callback~list$内に %handle を結付けている~callbackはある ］ ⇒ %文書 の`~animation~frame~callback~list$から その~callbackを除去する ◎ Let document be this Window object's associated Document. ◎ Find the entry in document's list of animation frame callbacks that is associated with the value given by the method's argument. ◎ If there is such an entry, remove it from document's list of animation frame callbacks.

~UAは， `~animation~frame~callbackたちを走らす@ ときは、所与の ( `文書$ %文書, 時刻印 %now ) に対し，次を走らせ~MUST： ◎ When the user agent is to run the animation frame callbacks for a Document doc with a timestamp now, it must run the following steps:

1. %~callback~list ~LET %文書 の`~animation~frame~callback~list$の複製 ◎ Let callbacks be a list of the entries in doc's list of animation frame callbacks, in the order in which they were added to the list.
2. %文書 の`~animation~frame~callback~list$を空にする ◎ Set doc's list of animation frame callbacks to the empty list.
3. %~callback~list 内の~EACH ( %~callback ) に対し ⇒ %now を引数に渡して %~callback を`呼出す$x `WEBIDL$r ⇒ 例外が投出されたときは、~catchして ⇒ その`例外を報告する$ ◎ For each entry in callbacks, in order: invoke the callback, passing now as the only argument, and if an exception is thrown, report the exception. [WEBIDL]