feature: document, element, window

README.md

@@ -15,27 +15,30 @@ apmjs install @searchfe/sandbox
 <dt><a href="#Sandbox">Sandbox</a></dt>
 <dd><p>沙盒实例 创建后默认处于睡眠状态。需要调用 <code>sandbox.run()</code> 让它开始工作。</p>
 </dd>
-<dt><a href="#Scope">Scope</a></dt>
+<dt><a href="#Window">Window</a></dt>
 <dd><p>沙盒上下文 提供给沙盒内的业务逻辑使用，相当于浏览器的 window。</p>
 </dd>
 <dt><a href="#Document">Document</a></dt>
-<dd><p>沙盒文档 只实现 window.document 的一个子集，托管了所有事件，页面属性等。</p>
+<dd><p>沙盒文档 局部的 DOM 文档对象，托管了所有事件，页面属性等。</p>
+</dd>
+<dt><a href="#Element">Element</a></dt>
+<dd><p>元素对象 这是 HTMLElement 的一个沙盒代理对象，封装并托管了 DOM 操作。</p>
 </dd>
 </dl>
 
 ## Interfaces
 
 <dl>
 <dt><a href="#EventTarget">EventTarget</a></dt>
-<dd><p>事件接口，用于托管全局事件。Scope 和 Document 对象实现了该接口。
+<dd><p>事件接口，用于托管全局事件。Window 和 Document 对象实现了该接口。
 根元素以下的事件监听不予监听，见：<a href="https://github.com/searchfe/sandbox/issues/2">https://github.com/searchfe/sandbox/issues/2</a></p>
 </dd>
 </dl>
 
 <a name="EventTarget"></a>
 
 ## EventTarget
-事件接口，用于托管全局事件。Scope 和 Document 对象实现了该接口。
+事件接口，用于托管全局事件。Window 和 Document 对象实现了该接口。
 根元素以下的事件监听不予监听，见：https://github.com/searchfe/sandbox/issues/2
 
 **Kind**: global interface  
@@ -157,24 +160,32 @@ Remove a listener to the sandbox, available event types: run, stop, die
 | type | <code>function</code> | the event type |
 | cb | <code>function</code> | the callback |
 
-<a name="Scope"></a>
+<a name="Window"></a>
 
-## Scope
+## Window
 沙盒上下文 提供给沙盒内的业务逻辑使用，相当于浏览器的 window。
 
 **Kind**: global class  
 **Implements**: [<code>EventTarget</code>](#EventTarget)  
 
-* [Scope](#Scope)
-    * [new Scope(element, sandbox)](#new_Scope_new)
-    * [.setInterval(fn, timeout)](#Scope+setInterval)
-    * [.clearInterval(id)](#Scope+clearInterval)
-    * [.setTimeout(fn, timeout)](#Scope+setTimeout)
-    * [.clearTimeout(id)](#Scope+clearTimeout)
-
-<a name="new_Scope_new"></a>
-
-### new Scope(element, sandbox)
+* [Window](#Window)
+    * [new Window(element, sandbox)](#new_Window_new)
+    * [.document](#Window+document) : [<code>Document</code>](#Document)
+    * [.pageXOffset](#Window+pageXOffset) : <code>Number</code>
+    * [.pageYOffset](#Window+pageYOffset) : <code>Number</code>
+    * [.innerHeight](#Window+innerHeight) : <code>Number</code>
+    * [.outerHeight](#Window+outerHeight) : <code>Number</code>
+    * [.innerWidth](#Window+innerWidth) : <code>Number</code>
+    * [.outerWidth](#Window+outerWidth) : <code>Number</code>
+    * [.scrollTo()](#Window+scrollTo)
+    * [.setInterval(fn, timeout)](#Window+setInterval)
+    * [.clearInterval(id)](#Window+clearInterval)
+    * [.setTimeout(fn, timeout)](#Window+setTimeout)
+    * [.clearTimeout(id)](#Window+clearTimeout)
+
+<a name="new_Window_new"></a>
+
+### new Window(element, sandbox)
 创建一个沙盒上下文
 
 
@@ -183,51 +194,93 @@ Remove a listener to the sandbox, available event types: run, stop, die
 | element | <code>HTMLElement</code> | 沙盒的根 DOM 元素 |
 | sandbox | [<code>Sandbox</code>](#Sandbox) | 绑定到的沙盒对象 |
 
-<a name="Scope+setInterval"></a>
+<a name="Window+document"></a>
+
+### window.document : [<code>Document</code>](#Document)
+沙盒的文档对象
+
+**Kind**: instance property of [<code>Window</code>](#Window)  
+<a name="Window+pageXOffset"></a>
+
+### window.pageXOffset : <code>Number</code>
+**Kind**: instance property of [<code>Window</code>](#Window)  
+**Read only**: true  
+<a name="Window+pageYOffset"></a>
+
+### window.pageYOffset : <code>Number</code>
+**Kind**: instance property of [<code>Window</code>](#Window)  
+**Read only**: true  
+<a name="Window+innerHeight"></a>
+
+### window.innerHeight : <code>Number</code>
+**Kind**: instance property of [<code>Window</code>](#Window)  
+**Read only**: true  
+<a name="Window+outerHeight"></a>
 
-### scope.setInterval(fn, timeout)
+### window.outerHeight : <code>Number</code>
+**Kind**: instance property of [<code>Window</code>](#Window)  
+**Read only**: true  
+<a name="Window+innerWidth"></a>
+
+### window.innerWidth : <code>Number</code>
+**Kind**: instance property of [<code>Window</code>](#Window)  
+**Read only**: true  
+<a name="Window+outerWidth"></a>
+
+### window.outerWidth : <code>Number</code>
+**Kind**: instance property of [<code>Window</code>](#Window)  
+**Read only**: true  
+<a name="Window+scrollTo"></a>
+
+### window.scrollTo()
+滚动窗口，见 https://developer.mozilla.org/en-US/docs/Web/API/Window/scrollTo
+
+**Kind**: instance method of [<code>Window</code>](#Window)  
+<a name="Window+setInterval"></a>
+
+### window.setInterval(fn, timeout)
 The setInterval() method repeatedly calls a function or executes a code snippet,
 with a fixed time delay between each call.
 It returns an interval ID which uniquely identifies the interval,
 so you can remove it later by calling clearInterval()
 
-**Kind**: instance method of [<code>Scope</code>](#Scope)  
+**Kind**: instance method of [<code>Window</code>](#Window)  
 
 | Param | Type | Description |
 | --- | --- | --- |
 | fn | <code>function</code> | The scheduled callback |
 | timeout | <code>Number</code> | Time inteval in millisecond |
 
-<a name="Scope+clearInterval"></a>
+<a name="Window+clearInterval"></a>
 
-### scope.clearInterval(id)
+### window.clearInterval(id)
 移除定时器
 
-**Kind**: instance method of [<code>Scope</code>](#Scope)  
+**Kind**: instance method of [<code>Window</code>](#Window)  
 
 | Param | Type | Description |
 | --- | --- | --- |
 | id | <code>Number</code> | 定时器 ID，即 setInteval 的返回值 |
 
-<a name="Scope+setTimeout"></a>
+<a name="Window+setTimeout"></a>
 
-### scope.setTimeout(fn, timeout)
+### window.setTimeout(fn, timeout)
 The setTimeout() method sets a timer which executes a function or
 specified piece of code once after the timer expires.
 
-**Kind**: instance method of [<code>Scope</code>](#Scope)  
+**Kind**: instance method of [<code>Window</code>](#Window)  
 
 | Param | Type | Description |
 | --- | --- | --- |
 | fn | <code>function</code> | The scheduled callback |
 | timeout | <code>Number</code> | Time in millisecond |
 
-<a name="Scope+clearTimeout"></a>
+<a name="Window+clearTimeout"></a>
 
-### scope.clearTimeout(id)
+### window.clearTimeout(id)
 移除定时器
 
-**Kind**: instance method of [<code>Scope</code>](#Scope)  
+**Kind**: instance method of [<code>Window</code>](#Window)  
 
 | Param | Type | Description |
 | --- | --- | --- |
@@ -236,20 +289,109 @@ specified piece of code once after the timer expires.
 <a name="Document"></a>
 
 ## Document
-沙盒文档 只实现 window.document 的一个子集，托管了所有事件，页面属性等。
+沙盒文档 局部的 DOM 文档对象，托管了所有事件，页面属性等。
 
 **Kind**: global class  
-**Implements**: [<code>EventTarget</code>](#EventTarget)  
+
+* [Document](#Document)
+    * [new Document(element, sandbox)](#new_Document_new)
+    * [.documentElement](#Document+documentElement) : <code>HTMLElement</code>
+    * [.scrollingElement](#Document+scrollingElement) : [<code>Element</code>](#Element)
+
 <a name="new_Document_new"></a>
 
-### new Document(scope, sandbox)
+### new Document(element, sandbox)
 创建一个文档对象
 
 
 | Param | Type | Description |
 | --- | --- | --- |
-| scope | [<code>Scope</code>](#Scope) | 沙盒上下文 |
+| element | [<code>Element</code>](#Element) | 沙盒上下文 |
 | sandbox | [<code>Sandbox</code>](#Sandbox) | 对应的沙盒对象 |
 
+<a name="Document+documentElement"></a>
+
+### document.documentElement : <code>HTMLElement</code>
+**Kind**: instance property of [<code>Document</code>](#Document)  
+**Read only**: true  
+<a name="Document+scrollingElement"></a>
+
+### document.scrollingElement : [<code>Element</code>](#Element)
+**Kind**: instance property of [<code>Document</code>](#Document)  
+**Read only**: true  
+<a name="Element"></a>
+
+## Element
+元素对象 这是 HTMLElement 的一个沙盒代理对象，封装并托管了 DOM 操作。
+
+**Kind**: global class  
+**Implements**: [<code>EventTarget</code>](#EventTarget)  
+
+* [Element](#Element)
+    * [new Element(element)](#new_Element_new)
+    * [.scrollTo](#Element+scrollTo) : [<code>Document</code>](#Document)
+    * [.offsetHeight](#Element+offsetHeight) : <code>Number</code>
+    * [.offsetWidth](#Element+offsetWidth) : <code>Number</code>
+    * [.scrollHeight](#Element+scrollHeight) : <code>Number</code>
+    * [.scrollWidth](#Element+scrollWidth) : <code>Number</code>
+    * [.clientHeight](#Element+clientHeight) : <code>Number</code>
+    * [.clientWidth](#Element+clientWidth) : <code>Number</code>
+    * [.scrollTop](#Element+scrollTop) : <code>Number</code>
+    * [.scrollLeft](#Element+scrollLeft) : <code>Number</code>
+
+<a name="new_Element_new"></a>
+
+### new Element(element)
+创建一个元素对象
+
+
+| Param | Type | Description |
+| --- | --- | --- |
+| element | <code>HTMLElement</code> | HTML 元素对象 |
+
+<a name="Element+scrollTo"></a>
+
+### element.scrollTo : [<code>Document</code>](#Document)
+**Kind**: instance property of [<code>Element</code>](#Element)  
+<a name="Element+offsetHeight"></a>
+
+### element.offsetHeight : <code>Number</code>
+**Kind**: instance property of [<code>Element</code>](#Element)  
+**Read only**: true  
+<a name="Element+offsetWidth"></a>
+
+### element.offsetWidth : <code>Number</code>
+**Kind**: instance property of [<code>Element</code>](#Element)  
+**Read only**: true  
+<a name="Element+scrollHeight"></a>
+
+### element.scrollHeight : <code>Number</code>
+**Kind**: instance property of [<code>Element</code>](#Element)  
+**Read only**: true  
+<a name="Element+scrollWidth"></a>
+
+### element.scrollWidth : <code>Number</code>
+**Kind**: instance property of [<code>Element</code>](#Element)  
+**Read only**: true  
+<a name="Element+clientHeight"></a>
+
+### element.clientHeight : <code>Number</code>
+**Kind**: instance property of [<code>Element</code>](#Element)  
+**Read only**: true  
+<a name="Element+clientWidth"></a>
+
+### element.clientWidth : <code>Number</code>
+**Kind**: instance property of [<code>Element</code>](#Element)  
+**Read only**: true  
+<a name="Element+scrollTop"></a>
+
+### element.scrollTop : <code>Number</code>
+**Kind**: instance property of [<code>Element</code>](#Element)  
+**Read only**: true  
+<a name="Element+scrollLeft"></a>
+
+### element.scrollLeft : <code>Number</code>
+**Kind**: instance property of [<code>Element</code>](#Element)  
+**Read only**: true  
 
 [apmjs]: https://github.com/apmjs/apmjs

src/apis/document.js

@@ -1,19 +1,31 @@
 define(function (require) {
+    var objUtil = require('../utils/object');
+    var Element = require('./element');
+
     /**
      * 创建一个文档对象
      *
-     * @class 沙盒文档 只实现 window.document 的一个子集，托管了所有事件，页面属性等。
+     * @class 沙盒文档 局部的 DOM 文档对象，托管了所有事件，页面属性等。
      * @alias Document
-     * @implements EventTarget
-     * @param {Scope} scope 沙盒上下文
+     * @param {Element} element 沙盒上下文
      * @param {Sandbox} sandbox 对应的沙盒对象
      */
-    function Document (scope, sandbox) {
-        var events = require('./events')(sandbox);
+    function Document (element, sandbox) {
+        var scrollingElement = document.scrollingElement || document.body;
 
         Object.defineProperties(this, {
-            addEventListener: { value: events.addEventListener, writable: false },
-            removeEventListener: { value: events.removeEventListener, writable: false }
+            /**
+             * @type {HTMLElement}
+             * @name Document#documentElement
+             * @readonly
+             */
+            documentElement: objUtil.readOnly(element),
+            /**
+             * @type {Element}
+             * @name Document#scrollingElement
+             * @readonly
+             */
+            scrollingElement: objUtil.readOnly(new Element(scrollingElement, sandbox))
         });
     }
     return Document;