最后的egret
坚持做一件事真的好难~ 决定重新写博客的时候想着一定要坚持一个周一篇,然而….
年后上班老板找我的第一件大事:以后公司的棋牌产品不会有大的动作了;公司PHP(内部用的运营后台)的小姐姐休产假了,我暂时接手她的工作;以后公司会向着其他游戏方向发展,想让我去学习cocos;
写了egret 半年了,伴随着今天最后一个egret棋牌游戏上线,也就宣告着我的egret生涯暂时告一段落了,今天写点东西算是纪念一下吧。
一、因为是做的h5游戏,跑在微信浏览器里面的,所以前端出身的我还是有一点点优势的,尽管我只是个菜鸟。
对于egret 锁屏js休眠的问题,由于egret的这种机制,往往会导致用户在锁屏后(或者切出去之后)再进来就会发现游戏画面渲染出现错乱,可能要等到下个阶段渲染改组件的时候才恢复;
这种问题应该也不算是新鲜事了吧。在浏览器有这样一个事件可以监听当前页面是否处于激活状态:我是判断锁屏到解锁花了多久。一般超过5秒就会让用户刷新一下,重现渲染游戏画面。
Utils.activationDoc = function (status) {
//兼容写法 var hiddenProperty = \'hidden\' in document ? \'hidden\' : \'webkitHidden\' in document ? \'webkitHidden\' : \'mozHidden\' in document ? \'mozHidden\' : null; var visibilityChangeEvent = hiddenProperty.replace(/hidden/i, \'visibilitychange\'); var hiddenTime = null; var showTime = null; var onVisibilityChange = function () {if (!document[hiddenProperty]) { //激活做点什么 } else { //非激活做点什么 } } document.addEventListener(visibilityChangeEvent, onVisibilityChange); }
二、关于websocket
一直用不习惯egret提供的socket,所以借鉴了一个小框架大家可以看一看,学习一下,啥也不说了,都在代码里
// TypeScript file class ReconnectingWebSocket { //These can be altered by calling code public debug:boolean = false; //Time to wait before attempting reconnect (after close) public reconnectInterval:number = 1000; //Time to wait for WebSocket to open (before aborting and retrying) public timeoutInterval:number = 2000; //Should only be used to read WebSocket readyState public readyState:number; //Whether WebSocket was forced to close by this client private forcedClose:boolean = false; //Whether WebSocket opening timed out private timedOut:boolean = false; //List of WebSocket sub-protocols private protocols:string[] = []; //The underlying WebSocket private ws:WebSocket; private url:string; /** * Setting this to true is the equivalent of setting all instances of ReconnectingWebSocket.debug to true. */ public static debugAll = false; //Set up the default \'noop\' event handlers public onopen:(ev:Event) => void = function (event:Event) {}; public onclose:(ev:CloseEvent) => void = function (event:CloseEvent) {}; public onconnecting:() => void = function () {}; public onmessage:(ev:MessageEvent) => void = function (event:MessageEvent) {}; public onerror:(ev:ErrorEvent) => void = function (event:ErrorEvent) {}; constructor(url:string, protocols:string[] = []) { this.url = url; this.protocols = protocols; this.readyState = WebSocket.CONNECTING; this.connect(false); } public connect(reconnectAttempt:boolean) { this.ws = new WebSocket(this.url, this.protocols); this.onconnecting(); this.log(\'ReconnectingWebSocket\', \'attempt-connect\', this.url); var localWs = this.ws; var timeout = setTimeout(() => { this.log(\'ReconnectingWebSocket\', \'connection-timeout\', this.url); this.timedOut = true; localWs.close(); this.timedOut = false; }, this.timeoutInterval); this.ws.onopen = (event:Event) => { clearTimeout(timeout); this.log(\'ReconnectingWebSocket\', \'onopen\', this.url); this.readyState = WebSocket.OPEN; reconnectAttempt = false; this.onopen(event); }; this.ws.onclose = (event:CloseEvent) => { clearTimeout(timeout); this.ws = null; if (this.forcedClose) { this.readyState = WebSocket.CLOSED; this.onclose(event); } else { this.readyState = WebSocket.CONNECTING; this.onconnecting(); if (!reconnectAttempt && !this.timedOut) { this.log(\'ReconnectingWebSocket\', \'onclose\', this.url); this.onclose(event); } setTimeout(() => { this.connect(true); }, this.reconnectInterval); } }; this.ws.onmessage = (event) => { this.log(\'ReconnectingWebSocket\', \'onmessage\', this.url, event.data); this.onmessage(event); }; this.ws.onerror = (event) => { this.log(\'ReconnectingWebSocket\', \'onerror\', this.url, event); this.onerror(event); }; } public send(data:any) { if (this.ws) { this.log(\'ReconnectingWebSocket\', \'send\', this.url, data); return this.ws.send(data); } else { throw \'INVALID_STATE_ERR : Pausing to reconnect websocket\'; } } /** * Returns boolean, whether websocket was FORCEFULLY closed. */ public close():boolean { if (this.ws) { this.forcedClose = true; this.ws.close(); return true; } return false; } /** * Additional public API method to refresh the connection if still open (close, re-open). * For example, if the app suspects bad data / missed heart beats, it can try to refresh. * * Returns boolean, whether websocket was closed. */ public refresh():boolean { if (this.ws) { this.ws.close(); return true; } return false; } private log(...args: any[]) { if (this.debug || ReconnectingWebSocket.debugAll) { console.debug.apply(console, args); } } }