Merge pull request #971 from alibaba/html5

Html5

doc/SUMMARY.md

@@ -64,6 +64,7 @@
         * [animation](/modules/animation.md)
         * [webview](/modules/webview.md)
         * [navigator](/modules/navigator.md)
+        * [storage](/modules/storage.md)
         * [clipboard](/modules/clipboard.md)
     * Low-level Specs
         * [JS Bundle Format](/specs/js-bundle-format.md)
@@ -77,7 +78,7 @@
     * [Slider](demo/slider.md)
     * [Animation](demo/animation.md)
     * [More](https://github.com/alibaba/weex/tree/dev/examples)
-    
+
 * Service & Tools
     * [CLI](/tools/cli.md)
     * [Devtools](/tools/devtools.md)
@@ -87,4 +88,3 @@
     * [Playground App](/tools/playground-app.md)
 
 * [FAQ](/faq.md)
-

doc/modules/storage.md

@@ -0,0 +1,107 @@
+# storage
+<span class="weex-version">0.4</span>
+<a href="https://github.com/weexteam/article/wiki/%E6%AC%A2%E8%BF%8E%E5%8F%82%E4%B8%8EWeex%E4%B8%AD%E6%96%87%E6%96%87%E6%A1%A3%E7%BF%BB%E8%AF%91"  class="weex-translate incomplete">cn</a>
+
+## Summary
+
+`storage` is a series of apis, allowing you to for example add, modify or delete stored data items.
+
+
+## API
+
+### setItem(key, value, callback)
+
+When passed a key name and value, will add that key to the storage,
+or update that key's value if it already exists.
+
+#### Arguments
+
+* `key`*(string)*: the name of the key you want to store.
+* `value`*(object)*: the name of the value you want to store.
+* `callback`*(object)*: the callback function after executing this action.  
+
+##### Example
+
+```js
+var storage = require('@weex-module/storage');
+storage.setItem('foo', 'foo-value');
+//or
+storage.setItem('bar', 'bar-value', function(e) {
+  // callback.
+});
+```
+
+### getItem(key, callback)
+
+When passed a key name, will return that key's value.
+
+#### Arguments
+
+* `key`*(string)*:  the name of the key you want to retrieve the value of.
+* `callback`*(object)*: the callback function after executing this action.  
+
+##### Example
+
+```js
+var storage = require('@weex-module/storage');
+storage.getItem('foo', function(e) {
+  //callback.'e' is an object that contains 'result' and 'data'.
+  // use 'e.data' to fetch the value of the key,if not found,'undefined' will return.
+});
+```
+
+### removeItem(key, callback)
+
+When passed a key name, will remove that key from the storage.
+
+#### Arguments
+
+* `key`*(string)*:  the name of the key you want to remove.
+* `callback`*(object)*: the callback function after executing this action.  
+
+##### Example
+
+```js
+var storage = require('@weex-module/storage');
+storage.removeItem('foo', function(e) {
+  // callback. 'e' is an object that contains 'result' and 'data'.
+  // e.result will return 'success' or 'failed' according to the executing result.
+  // 'data' is always return 'undefined' in this function.
+});
+```
+
+### length(callback)
+
+Returns an integer representing the number of data items stored in the Storage object.
+
+#### Arguments
+
+* `callback`*(object)*: the callback function after executing this action.  
+
+##### Example
+
+```js
+var storage = require('@weex-module/storage');
+storage.length(function(e) {
+  // callback. 'e' is an object that contains 'result' and 'data'.
+  //e.data will return that number.
+});
+```
+
+### getAllKeys(callback)
+
+Returns an array that contains all keys stored in Storage object.
+
+#### Arguments
+
+* `callback`*(object)*: the callback function after executing this action.  
+
+##### Example
+
+```js
+var storage = require('@weex-module/storage');
+storage.getAllKeys(function(e) {
+  // callback. 'e' is an object that contains 'result' and 'data'.
+  //e.data will return that array of keys.
+});
+```

examples/index.we

@@ -34,8 +34,9 @@
         {name: 'module/instance-api', title: 'Instance API'},
         {name: 'module/modal', title: 'Modal'},
         {name: 'module/stream-demo', title: 'Stream'},
+        {name: 'module/storage-demo',title:'Storage'},
         {name: 'module/clipboard', title: 'Clipboard'},
-        
+
         // showcase
         {name: 'showcase/new-fashion/index', title: 'Activity'},
         {name: 'showcase/calculator', title: 'Calculator'},

examples/module/storage-demo.we

@@ -0,0 +1,90 @@
+<template>
+  <scroller>
+    <wxc-panel title="storage API" type="primary">
+      <wxc-panel title="setItem">
+        <text>{{setItemResult}}</text>
+      </wxc-panel>
+
+      <wxc-panel title="getItem">
+        <text>{{getItemResult}}</text>
+      </wxc-panel>
+
+
+
+      <wxc-panel title="length">
+        <text>{{lengthResult}}</text>
+      </wxc-panel>
+
+      <wxc-panel title="getAllKeys">
+        <text>{{getAllKeysResult}}</text>
+      </wxc-panel>
+
+      <wxc-panel title="removeItem">
+        <text>{{removeItemResult}}</text>
+      </wxc-panel>
+
+    </wxc-panel>
+  </scroller>
+
+</template>
+
+
+<script>
+require('weex-components');
+module.exports = {
+  data: {
+    setItemResult:'loading',
+    getItemResult:'loading',
+    removeItemResult:'loading',
+    lengthResult:'loading',
+    getAllKeysResult:'loading'
+  },
+  ready: function() {
+    var storage = require('@weex-module/storage');
+    var me = this;
+
+
+    //setItem
+    storage.setItem('foo','foo-value',function(e){
+      console.log('set [foo<->foo-value]:'+JSON.stringify(e));
+      me.setItemResult = 'foo:'+JSON.stringify(e)+'\n';
+    });
+    storage.setItem('bar','bar-value',function(e){
+      console.log('set [bar<->bar-value]:'+JSON.stringify(e));
+      me.setItemResult = me.setItemResult + 'bar:'+JSON.stringify(e);
+    });
+
+    //getItem
+    storage.getItem('foo',function(e){
+      console.log('get foo result:'+JSON.stringify(e));
+      me.getItemResult = 'get foo,value is '+e.data+'\n';
+    });
+    storage.getItem('bar',function(e){
+      console.log('get bar result:'+JSON.stringify(e));
+      me.getItemResult += 'get bar,value is '+e.data;
+    });
+
+
+    //length
+    storage.length(function(e){
+      console.log('length:'+JSON.stringify(e));
+      me.lengthResult = 'current length is ' + e.data;
+    });
+
+    //getAllKeys
+    storage.getAllKeys(function(e){
+      console.log('getAllKeys:'+JSON.stringify(e));
+      me.getAllKeysResult = e.data;
+      //me.getAllKeysResult +=' '+ typeof e.data
+    });
+
+    //removeItem
+    storage.removeItem('foo',function(e){
+      console.log('remove foo:'+JSON.stringify(e));
+      me.removeItemResult = 'remove item foo '+e.result;
+    });
+
+  }
+};
+
+</script>

html5/browser/api/index.js

@@ -7,6 +7,7 @@ const animation = require('./animation')
 const webview = require('./webview')
 const timer = require('./timer')
 const navigator = require('./navigator')
+const storage = require('./storage')
 const clipboard = require('./clipboard')
 
 const api = {
@@ -20,6 +21,7 @@ const api = {
     Weex.registerApiModule('webview', webview, webview._meta)
     Weex.registerApiModule('timer', timer, timer._meta)
     Weex.registerApiModule('navigator', navigator, navigator._meta)
+    Weex.registerApiModule('storage', storage, storage._meta)
     Weex.registerApiModule('clipboard', clipboard, clipboard._meta)
   }
 }