h5-cli
Version:
hello
252 lines (218 loc) • 7.21 kB
JavaScript
;
/**
var page = PageModule.rendere({
init:function(){
},
onComplate:function(){
},
onSuccess:function(){
},
onError:function(){
},
renderTo:fucntion(){
}
});
page.init();
*/
define("component/VModule", function (require, exports, module) {
//lib.windvane \u5f3a\u4f9d\u8d56
var io = require("io");
var url = require("libs/url");
var util = require("libs/util");
var cache = require("libs/cache");
var windvane = require("libs/windvane");
var vTemplate = require("libs/vTemplate");
var config = window.config;
function VModule() {
//url\u4e0a\u7684\u5168\u90e8\u53c2\u6570
this.query = url.parse(window.location.href, true).query || {};
this.refs = {};
this.vTemplate = vTemplate;
this.cache = cache;
this.io = io;
this.url = url;
this.util = util;
//\u5168\u5c40\u914d\u7f6e\u6587\u4ef6
this.config = config;
//\u533b\u9662id \u53c2\u6570\u4e0a\u7684id --> confir.corpId
// console.log( this.query )
this.corpId = this.query.corpId || this.config.corpId;
//\u6d4b\u8bd5\u5f00\u542f\u6bcf\u4e2a\u9875\u9762\u7684\u65f6\u95f4\u76d1\u542c\uff0c\u9700\u8981\u5220\u9664
this.initPageEvent();
}
VModule.prototype = {
initModule: function initModule(state, id) {
var self = this;
var module = vTemplate(function (data) {
return self.toRender(data);
}, state || { loading: true });
this.state = module.data;
this.wrap = $(id);
this.wrap.html(module.dom);
this.module = module;
return module;
},
setState: function setState(state, callback) {
var _this = this;
this.module && this.module.setData(state, function (a) {
//\u8bbe\u7f6e refs
Array.prototype.slice.call(_this.wrap[0].querySelectorAll("[ref]"), 0).map(function (element) {
var ref = element.getAttribute("ref");
if (ref != undefined && _this.refs[ref] != element) {
// console.log("setting")
_this.refs[ref] = element;
} else {
// console.log("\u8df3\u8fc7")
};
});
callback && callback();
//
// //\u5904\u7406\u4e8b\u4ef6 \u76ee\u524d\u4e0d\u884c
// this.componentDidMount();
});
this.state = this.module.data;
},
getState: function getState() {
return this.module ? this.module.data : {};
},
//\u7ec4\u4ef6\u6e32\u67d3\u5b8c\u6210\u9875\u9762\u6bcf\u6b21\u66f4\u65b0\u5b8c\u6210\u4ee5\u540e
// componentDidMount(){
// },
//native\u4f1a\u901a\u8fc7jsbrige\u628a\u9875\u9762\u7684\u751f\u547d\u5468\u671f\u72b6\u6001\u4f20\u9012\u7ed9h5
initPageEvent: function initPageEvent() {
var self = this;
// console.log(windvane.eventListener)
windvane.on(windvane.READY, function (result) {
self.onPageReady(result);
});
windvane.on(windvane.ACTIVEATION, function (result) {
self.onActivation(result);
});
windvane.on(windvane.PAUSE, function (result) {
self.onPause(result);
});
},
get: function get(url, param) {
var self = this;
// \u8ba9jsonp\u5f02\u6b65\uff0c\u628a\u65f6\u95f4\u8ba9\u6e21\u7ed9 \u9875\u9762\u6e32\u67d3\uff0c\u53ef\u4ee5\u8ba9\u9875\u9762\u66f4\u5feb\u7684onload
setTimeout(function () {
io.get(url, param, function (result) {
self.onComplate(result);
}, function (result) {
if (result && result.success != undefined) {
self.onComplate(result);
} else {
console.log('????');
self.onComplate({ success: false, msg: "\u7f51\u8def\u9519\u8bef\uff0c\u8bf7\u7a0d\u540e\u518d\u8bd5" });
}
});
});
return this;
},
getCache2: function getCache2(url, param) {
this.getCache(url, param, true);
},
getCache: function getCache(url, param, isMultipleCallback) {
var self = this;
setTimeout(function () {
io.getCache(url, param, function (result) {
self.onComplate(result);
}, function (result) {
if (result && result.success != undefined) {
self.onComplate(result);
} else {
self.onComplate({ success: false, msg: "\u7f51\u8def\u9519\u8bef\uff0c\u8bf7\u7a0d\u540e\u518d\u8bd5" });
}
}, isMultipleCallback);
});
return this;
},
checkLogin: function checkLogin() {
if (!this.util.isLogin()) {
this.util.goLogin();
this.showLoginMask();
return false;
}
return true;
},
showLoginMask: function showLoginMask() {
var mask = $('<div class="ui-mask-tip-box"><div class="text">\u8bf7\u5148\u767b\u5f55<sub>\u70b9\u51fb\u4efb\u610f\u4f4d\u7f6e\u8df3\u8f6c\u5230\u767b\u5f55\u754c\u9762</sub></div></div>');
var self = this;
mask.click(function () {
if (!self.util.isLogin()) {
self.util.goLogin();
} else {
window.location.reload();
}
});
mask.appendTo(document.body);
},
onComplate: function onComplate(result) {
this.util.waitHide();
if (result.success) {
this.onSuccess(result);
} else {
this.onError(result);
}
},
onSuccess: function onSuccess() {
result.loading = false;
this.setState(result);
},
onError: function onError(result) {
result.loading = false;
this.errorHandle(result);
this.setState(result);
},
//\u9875\u9762\u88c5\u5907\u5b8c\u6210
onPageReady: function onPageReady(event) {
console.log(windvane.READY);
},
//\u9875\u9762\u88ab\u6fc0\u6d3b
onActivation: function onActivation(event) {
console.log(windvane.ACTIVEATION);
},
//\u9875\u9762\u88ab\u8f6c\u79fb\u5230\u540e\u53f0
onPause: function onPause(event) {
console.log(windvane.PAUSE);
},
//\u901a\u7528\u9519\u8bef\u5904\u7406
errorHandle: function errorHandle(result) {
if (result && result.resultCode == "202") {
this.util.goLogin();
}
},
renderError: function renderError(state) {
return "<div class=\"ui-tips center\">" + (state.msg || "\u7f51\u7edc\u9519\u8bef\uff0c\u8bf7\u7a0d\u540e\u518d\u8bd5") + "</div>";
},
renderLoading: function renderLoading() {
return "<div class=\"page wait\"></div>";
},
//\u7ed1\u5b9a\u4e8b\u4ef6\u5230dom\u4e0a
bind: function bind(fn) {
var self = this;
var id = "random_fn_" + parseInt(Math.random() * 100000);
var arg = Array.prototype.slice.call(arguments, 1);
window[id] = function (e) {
arg.push(e);
fn.apply(self, arg);
};
return id + "(this)";
},
toRender: function toRender(state) {
if (state.loading) {
return this.renderLoading(state);
} else if (!state.success) {
return this.renderError(state);
} else {
return this.render(state);
}
}
};
VModule.render = function (proto) {
var module = $.extend(new VModule(), proto);
return module;
};
// PageModule.clearOtherNode();
module.exports = VModule;
});