
¥¥¥¥¥¥¥¥¥¥¥¥¥¥¥¥¥¥¥¥¥¥¥¥¥¥¥¥
touch
在開發移動端的應用中會使用到很多的手勢操作,例如一指拖動、兩指旋轉等等,為了友善開放者快速內建這些手勢,在clouda中内置了事件和手勢庫library.touch,下面将詳細的介紹如何使用library.touch。
touch.config
文法: touch.config(config)
對手勢事件庫進行全局配置。
參數描述:
config為一個對象
{
tap: true, //tap類事件開關, 預設為true
doubletap: true, //doubletap事件開關, 預設為true
hold: true, //hold事件開關, 預設為true
holdtime: 650, //hold時間長度
swipe: true, //swipe事件開關
swipetime: 300, //觸發swipe事件的最大時長
swipemindistance: 18, //swipe移動最小距離
swipefactor: 5, //加速因子, 值越大變化速率越快
drag: true, //drag事件開關
pinch: true, //pinch類事件開關
}
touch.on
文法:touch.on(element, types, options, callback)
綁定指定元素的事件。
element: 元素對象或選擇器。
types: 事件的類型, 可接受多個事件以空格分開,支援原生事件的透傳, 支援的一些事件類型有:
pinchstart 雙指縮放動作開始
pinchend 雙指縮放動作結束
pinch 雙指縮放事件
pinchin 雙指向裡縮小
pinchout 雙指向外放大
rotateleft 向左旋轉
rotateright 向右旋轉
rotate 旋轉事件
swipestart 單指滑動動作開始
swiping 單指滑動事件
swipeend 單指滑動動作結束
swipeleft 單指向左滑動
swiperight 單指向右滑動事件
swipeup 單指向上滑動
swipedown 單指向下滑動
swipe 單指滑動事件
drag 單指向左右拖動
hold 單指按住不放事件
tap 單指點選
doubletap 單指輕按兩下
例如旋轉執行個體如下:
var angle = 30;
touch.on(‘#rotation .target’, ‘touchstart’, function(ev){
ev.startrotate();
ev.originevent.preventdefault();
ev.originevent.stoppropagation();
});
touch.on(‘#rotation .target’, ‘rotate’, {interval: 10}, function(ev){
var totalangle = angle + ev.rotation;
if(ev.fingerstatus === ‘end’){
angle = angle + ev.rotation;
this.style.webkittransform = ‘rotate(’ + totalangle + ‘deg)’;
更多使用執行個體請檢視http://code.baidu.com/
options(可選): 目前可配置的參數為:
//采樣頻率
interval: 10,//性能參數,值越小,實時性越好, 但性能可能略差, 值越大, 性能越好。遇到性能問題時,可以将值設大調優,建議值設定為10。
//swipe加速度因子(swipe事件專用)
swipefactor: 5 //(int: 1-10)值越大,速率更快。
callback: 事件處理函數, 該函數接受的參數為一個gesture event object, 可通路的屬性有:
originevent //觸發某事件的原生對象
type //事件的名稱
rotation //旋轉角度
scale //縮放比例
direction //操作的方向屬性
fingerscount //操作的手勢數量
position //相關位置資訊, 不同的操作産生不同的位置資訊。
distance //swipe類兩點之間的位移
distancex //swipe類事件x方向的位移
distancey //swipe類事件y方向的位移
angle //swipe類事件觸發時偏移角度
factor //swipe事件加速度因子
startrotate //啟動單指旋轉方法,在某個元素的touchstart觸發時調用。
touch.live
文法:touch.live(selector, types, options, callback)
使用方法基本上與on相同,live的第一個參數隻接受css3選擇器。通過live()方法附加的事件處理程式适用于比對選擇器的目前及未來的元素(比如由腳本建立的新元素)
touch.off
文法:touch.off(element,types,callback)
解除某元素上的事件綁定。
element:元素對象或選擇器
types:事件的類型
callback:時間處理函數
publish/subscribe
subscribe
訂閱被釋出的資料,與pubilsh配合使用
不帶參數 env.subscribe(publishname, function(collection){});
env.subscribe(“pub-allstudents”, function(studentcollection){
pulishname
所定義的publish的唯一名稱,在一個app内全局唯一,該參數與sumeru.publish(modelname, publishname,function(callback))中的publishname名稱需要保持一緻。
function(collection){}
subscribe成功獲得資料時,被調用的響應方法。
帶參數 env.subscribe(publishname,arg1,arg2, … , function(collection){});
env.subscribe(“pub-studentswithgender”, “male”, function(msgcollection){
subscribebypage
分頁訂閱資料
不帶參數 env.subscribebypage(publishname, options, function(collection){});
var pageoption{
pagesize : 1,
page : 2,
uniquefield : ‘time’
};
env.subscribebypage(“pub-allstudents”, pageoption, function(studentcollection){
options
分頁設定
pagesize
每頁資料的數量
page
頁碼
uniquefield
排序的唯一字段名
帶參數 env.subscribebypage(publishname, options, arg1,arg2, … , function(collection){});
env.subscribebypage(“pub-studentswithgender”, pageoption, “male”, function(msgcollection){
prioritysubscribe
在斷線重新連接配接的情況下,使用prioritysubscribe方法訂閱資料優先被調用,使用方式與subscribe相同。
publish
釋出資料的方法,其運作在server上。
不帶參數 sumeru.publish(modelname,pubname,function(callback){},options)
modelname
被釋出資料所屬的model名稱
pubname
所定義的publish的唯一名稱,在一個app内全局唯一,該參數與controller中subscribe()成對使用。
function(callback)
描述資料釋出規則的自定義函數,在這裡定義被釋出資料所需要符合的條件。
可在此添加以下六種事件
beforeinsert
在實際插入資料到資料庫前的事件
beforeinsert : function(servercollection, structdata, userinfo, callback){
callback(structdata);
structdata
需要插入到資料庫的資料,我們可以對該資料進行操作,然後将資料插入到資料庫中,如果對資料沒有修改,則将原資料添加到資料庫中。
callback
before系列的事件中如果不添加 callback(),将阻止資料對資料庫的影響。
callback(structdata)
如果需要對原資料進行修改,可以傳入參數structdata
afterinsert
在實際插入資料到資料庫後的事件
afterinsert : function(servercollection, structdata){
beforeupdate
在實際更新資料庫資料前的事件
beforeupdate : function(servercollection, structdata, userinfo, callback){
callback();
afterupdate
在實際更新資料庫資料後的事件
afterupdate : function(servercollection, structdata){
beforedelete
在實際删除資料庫資料前的事件
beforedelete : function(servercollection, structdata, userinfo, callback){
afterdelete
在實際删除資料庫資料後的事件
afterdelete : function(servercollection, structdata){
執行個體:
module.exports = function(sumeru){
sumeru.publish(‘student’, ‘pub-allstudents’, function(callback){
var collection = this;
帶參數 sumeru.publish(modelname,pubname,function(arg1, …, callback){},options)
sumeru.publish(‘student’, ‘pub-allstudents’, function(gender,callback){
publishbypage
分頁釋出資料
sumeru.publishbypage(modelname,pubname,function(arg1,arg2,…,pageoptions, callback){},options)
分頁設定,有controller中subscribebypage()傳入。
sumeru.publishbypage(‘student’, ‘pub-allstudents’, function(gender,options,callback){
collection.find({ sort :{‘time’:-1},
limit : options.pagesize,
skip : (options.page-1)*options.pagesize,
“gender”: gender
}, function(err, items){
callback(items);
sort
排序
limit
每頁顯示的個數
skip
目前頁與起始頁間隔的個數
詳細的使用情況請檢視《example》文檔中的執行個體。
publishplain
用于釋出簡單對象,而非collection。
sumeru.publishplain(modelname,pubname,function(callback){},options)
如果需要釋出collection中資料的總數量,可使用下面方法:
fw.publishplain(‘student’, ‘pub-allstudents’, function(callback){
下面的三種方法是包含權限中心的身份驗證的publish。
securepublish
在身份驗證成功的情況下釋出資料
sumeru.publish(modelname,pubname,function(userinfo, callback){},options)
securepublishbypage
在身份驗證成功的情況下分頁釋出資料
sumeru.securepublishbypage(modelname,pubname,function(pageoptions,userinfo, callback){},options)
securepublishplain
在身份驗證成功的情況下釋出簡單對象
sumeru.securepublishplain(modelname,pubname,function(userinfo, callback){},options)
external
實作了三方資料同步的方法,用來滿足從三方網站/三方接口擷取和同步資料的需求。
extfind(pubname,callback)
在publish檔案中釋出第三方資料
fw.publish(‘news’,’pubnews’,function(callback){
使用該方法需要在publish下添加一個如何擷取第三方資料的配置檔案
config[pubname]
與publish中collection.extfind(pubname,callback)方法pubname一緻,全局唯一
uniquecolumn
uniquecolumn為三方資料唯一辨別,類型為string
uniquecolumn : “name”,
fetchurl: function((/* arg1, arg2, arg3 /)){}
指定抓取的url。arg1,arg2為傳遞的參數
fetchurl : function(/* arg1, arg2, arg3 /){
return ‘http://some.host.com‘;
resolve : function(origindata){}
resolve方法作用是将抓取回來的原始資料(origindata)轉化成為符合model定義的資料(resolved)
resolve : function(origindata){
var j = json.parse(origindata);
var resolved = j;
return resolved;
fetchinterval
fetchinterval為可選參數,用來指定抓取時間間隔,機關為ms
buffer
buffer為可選參數,值為true時表示擷取原始buffer,否則擷取原始資料字元串
type
聲明此子產品為歸屬為’external’
return {
type : ‘external’,
config : config
執行個體如下:
/**
* 擷取三方資料資訊,由開發者自定義
*/
function runnable(){
//{object} config是所有三方publish配置的容器
var config = {};
module.exports = runnable;
指定三方增/删/改接口以及資料
當資料發生變化時,如何使用clouda達到三方資料同步的效果,具體實作方法如下:
較為緊湊的聲明方式
posturl
posturl方法用來指定三方post接口的位址資訊, 參數type為增量類型,增量類型為’insert’,’update’,’delete’三者之一;
prepare
prepare方法用來将增量資料轉化成為符合三方post接口要求的post資料,參數type同為增量類型,參數data為增量的實際資料。
* 三方資料post請求資訊,由開發者自定義
較為工整的聲明方式
deleteurl,inserturl,updateurl
三個方法作用等同于posturl,傳回不同操作下三方接口url資訊
ondelete,oninsert,onupdate
三個方法作用等同于prepare方法, 傳回經過處理,傳給三方接口的post資料
sumeru.external.get
向第三方發送get請求
var url = “http://some.host.com“;
var getcallback = function(data){
console.log(data);
sumeru.external.get(url, getcallback);
sumeru.external.post
向第三方發送post請求
var options = {
host : “some.host.com”,
path : “/insert”
var postdata = {
name : sumeru.utils.randomstr(8),
age : parseint( 100 * math.random())
var postcallback = function(data){
sumeru.external.post(options, postdata, postcallback);
具體使用請檢視《example》文檔中的spidernews執行個體。