[...] added GREAT debug with 'DEBUG_MOD: true' as an activation method + with console groups

webpack/lib/client/xhr.js

@@ -153,7 +153,7 @@ export default class XHRClientDriver extends ClientDriver{
 		let request_uri = this.resource.split(/\/$/).concat(http_uri.split(/^\//)).filter((v) => v.trim().length).join('/');
 
 		/* (2) Open connection */
-		console.log(`API >>> ${this.proto}${request_uri}`);
+		// console.log(`API >>> ${this.proto}${request_uri}`);
 		this.xhr.open(http_method, `${this.proto}${request_uri}`, true);
 		if( http_token != null )
 			this.xhr.setRequestHeader('Authorization', `Basic ${btoa(http_token)}`);

webpack/lib/content-controller.js

@@ -7,19 +7,37 @@ export default class ContentController{
 
 		/* (1) Websocket re-connection policy */
 		this.attempt = {
-			max:     3,
+			max:     5,
-			count:   0,
+			count:   1,
 			_default_timeout: 500, // in ms
 			get timeout(){
 
 				// return timeout + increment it for next time
-				return this._default_timeout * Math.pow(2, this.count++);
+				return (this._default_timeout/2) * Math.pow(2, this.count++);
-			}
+			},
+			// same without incrementing (for LOGS)
+			get raw_timeout(){ return (this._default_timeout/2) * Math.pow(2, this.count); }
 		};
 
 		/* (2) Manage updates in connection status (ONLINE - OFFLINE) */
-		window.addEventListener('online',  this.ws_connect.bind(this));
+		window.addEventListener('online',  function(){
-		window.addEventListener('offline', function(){ gs.get.connection = 0; }); // connection status bar
+			DEBUG_MOD && console.log(`[NETWORK] online`);
+
+			DEBUG_MOD && console.log(` + Try to connect`);
+			// wait 500ms for net to be really online
+			setTimeout( this.ws_connect.bind(this), 500);
+
+		}.bind(this));
+
+		window.addEventListener('offline', function(){
+
+			DEBUG_MOD && console.log(`[NETWORK] offline`);
+			gs.get.connection = 0; // connection status bar
+
+			DEBUG_MOD && console.log(` + stop resync-strategy`);
+			csock.onclose = function(){}; // stop propagating recursive ws_connect()
+
+		});
 
 
 
@@ -161,7 +179,6 @@ export default class ContentController{
 	---------------------------------------------------------*/
 	ws_connect(){
 
-		console.warn(`new ws(/channel/${this.cid})`);
 		gs.get.connection = 1;
 
 		// 1. Close websocket if exists
@@ -176,16 +193,19 @@ export default class ContentController{
 		// 3. Bind events
 		csock.onconnected = () => {
 
+			DEBUG_MOD && console.log('[WS] connected');
+			DEBUG_MOD && console.log('[WS] pop stack', csock.stack.map( v => v.buffer ) );
+
 			// show connection status
 			gs.get.connection = 2;
 
 			// reset attempt count
-			gs.get.content.attempt.count = 0;
+			gs.get.content.attempt.count = 1;
 
 			setTimeout( () => { gs.get.connection = null; }, 1500);
 		};
-		csock.onreceive   = gs.get.content.ws_handler.bind({ event: 'receive' });
+		csock.onreceive   = gs.get.content.ws_handler.bind({ event: 'receive', class: this });
-		csock.onclose     = gs.get.content.ws_handler.bind({ event: 'close'   });
+		csock.onclose     = gs.get.content.ws_handler.bind({ event: 'close',   class: this });
 
 		// 4. Start communication
 		csock.bind();
@@ -193,6 +213,10 @@ export default class ContentController{
 		// 5. Send RID (useful when reconnecting, but a doublon at first connection)
 		csock.send({ buffer: { rid: gs.get.room.text.current } });
 
+		DEBUG_MOD && console.log('[WS] connecting');
+		DEBUG_MOD && console.log(` + start resync-strategy`);
+		DEBUG_MOD && console.log(`[WS] push stack`, { rid: gs.get.room.text.current });
+
 	}
 
 
@@ -205,7 +229,7 @@ export default class ContentController{
 	---------------------------------------------------------*/
 	ws_handler(_response){
 
-		console.warn('ws(', this.event, _response || '', ')');
+		DEBUG_MOD && console.groupCollapsed(`[WS] on${this.event}`);
 
 		/* (1) Manage error */
 		if( this.event === null )
@@ -215,22 +239,30 @@ export default class ContentController{
 		/* (2) CLOSE event -> reconnect
 		---------------------------------------------------------*/
 		if( this.event === 'close' ){
+
 			// 1. update connection status bar
 			gs.get.connection = 0;
 
 			// 2. Do nothing if offline (online trigger will do the job when online again)
-			if( !navigator.onLine )
+			if( !navigator.onLine ){
-				return;
+				DEBUG_MOD && console.log(' + network offline, wait for online trigger');
+				return DEBUG_MOD && console.groupEnd();
+			}
+
 
 			// 3. if max attempt exceeded -> logout user
-			if( gs.get.content.attempt.count >= gs.get.content.attempt.max-1 ){
+			if( this.class.attempt.count > this.class.attempt.max ){
+				DEBUG_MOD && console.log(' + max resync offset reached');
+				DEBUG_MOD && console.log(' + logout');
 				auth.token = null;
 				gs.get.refresh();
-				return;
+				return DEBUG_MOD && console.groupEnd();
 			}
 
 			// 4. Try to reconnect
-			return setTimeout(gs.get.content.ws_connect.bind(gs.get.content), gs.get.content.attempt.timeout);
+			DEBUG_MOD && console.log(` + resync (${this.class.attempt.count}/${this.class.attempt.max}) in ${this.class.attempt.raw_timeout}ms`);
+			setTimeout(this.class.ws_connect.bind(this.class), this.class.attempt.timeout);
+			return DEBUG_MOD && console.groupEnd();
 		}
 
 
@@ -239,11 +271,15 @@ export default class ContentController{
 		if( this.event === 'receive' ){
 
 			/* (1) Communication error -> reconnect in 500ms */
-			if( typeof _response !== 'object' )
+			if( typeof _response !== 'object' ){
-				return setTimeout(gs.get.content.ws_connect.bind(gs.get.content), 500);
+				DEBUG_MOD && console.log(` + invalid response: resync in 500ms`);
+				setTimeout(this.class.ws_connect.bind(this.class), 500);
+				return DEBUG_MOD && console.groupEnd();
+			}
 
 			/* (2) If message update -> update interface model */
-			gs.get.content.ws_to_model(_response);
+			this.class.ws_to_model(_response);
+			return DEBUG_MOD && console.groupEnd();
 
 		}
 
@@ -257,6 +293,8 @@ export default class ContentController{
 	ws_to_model(_dat){
 
 
+		DEBUG_MOD && console.group(`room`);
+
 		/* (1) Manage rooms DELETE
 		---------------------------------------------------------*/
 		/* (1) Extract ids */
@@ -272,6 +310,7 @@ export default class ContentController{
 				let to_remove = room_ids.indexOf(current_list[t].list[ri].id) < 0;
 
 				// delete room from interface
+				DEBUG_MOD && to_remove && console.log(` + #${current_list[t].list[ri].id} dropped`);
 				( to_remove ) && current_list[t].list.splice(ri,1);
 
 			}
@@ -314,7 +353,7 @@ export default class ContentController{
 			// 5. Create room
 			if( existing_index < 0  ){
 
-				console.log(`create room#${ri} of type ${room.type}`);
+				DEBUG_MOD && console.log(` + #${ri} [${room.type}] room created`);
 				gs.get.room.dump([{
 					rid:      ri,
 					name:     room.name,
@@ -336,6 +375,8 @@ export default class ContentController{
 
 
 			// 7. Push new messages
+			DEBUG_MOD && ( room.messages.length > 0 ) && console.log(` + #${ri} has ${room.messages.length} new message(s)`);
+
 			for( let m of room.messages ){
 
 				current_list[room.type].list[existing_index].messages.push({
@@ -358,8 +399,16 @@ export default class ContentController{
 
 		}
 
+		DEBUG_MOD && console.groupEnd();
 
 
+
+
+		DEBUG_MOD && console.group(`channel`);
+		DEBUG_MOD && ( _dat.channels.add.length > 0 ) && console.log(` + ${_dat.channels.add.length} new`);
+		DEBUG_MOD && ( _dat.channels.rem.length > 0 ) && console.log(` + ${_dat.channels.rem.length} dropped`);
+		DEBUG_MOD && ( _dat.channels.upd.length > 0 ) && console.log(` + ${_dat.channels.upd.length} updated`);
+
 		/* (3) Manage channels DELETE
 		---------------------------------------------------------*/
 		for( let c of _dat.channels.rem ){
@@ -377,6 +426,7 @@ export default class ContentController{
 						gs.get.channel.nav(1);
 
 					// 2.2. Delete channel
+					DEBUG_MOD && console.log(` + #${channel.id} dropped`);
 					gs.get.channel.list.splice(ci, 1);
 				}
 
@@ -390,6 +440,8 @@ export default class ContentController{
 		---------------------------------------------------------*/
 		for( let c of _dat.channels.add ){
 
+			DEBUG_MOD && console.log(` + #${c.id} [/${c.link}] created`);
+
 			gs.get.channel.dump([{
 				id:    parseInt(c.id),
 				label: c.name,
@@ -411,6 +463,8 @@ export default class ContentController{
 				// 2. If id matches -> UPDATE
 				if( channel.id === c.id ){
 
+					DEBUG_MOD && console.log(` + #${c.id} updated`);
+
 					gs.get.channel.list[ci].label = c.name;
 					gs.get.channel.list[ci].link  = c.link;
 
@@ -421,6 +475,10 @@ export default class ContentController{
 		}
 
 
+		DEBUG_MOD && console.groupEnd();
+		DEBUG_MOD && console.group('users');
+
+
 
 
 		let userset = gs.get.content.cbuf.users;
@@ -436,8 +494,10 @@ export default class ContentController{
 				let user = userset[ui];
 
 				// 2. If id matches -> REMOVE
-				if( user.uid === u.id )
+				if( user.uid === u.id ){
+					DEBUG_MOD && console.log(` + '${user.username}' dropped`);
 					userset.splice(ui, 1);
+				}
 
 			}
 
@@ -449,6 +509,7 @@ export default class ContentController{
 		---------------------------------------------------------*/
 		for( let u of _dat.users.add ){
 
+			DEBUG_MOD && console.log(` + '${u.name}' created`);
 			userset.push({
 				uid:      parseInt(u.id),
 				username: u.name
@@ -467,15 +528,19 @@ export default class ContentController{
 				let user = userset[ui];
 
 				// 2. If id matches -> UPDATE
-				if( user.uid === u.id )
+				if( user.uid === u.id ){
+					DEBUG_MOD && console.log(` + '${user.username}' renamed '${u.name}'`);
 					userset[ui].username = u.name;
-
 				}
 
 			}
 
 		}
 
+		DEBUG_MOD && console.groupEnd();
+
+	}
+
 
 
 

webpack/setup.js

@@ -58,6 +58,10 @@ gs.set('connection', 1); // null -> normal, 0 -> offline, 1 -> connecting, 2 ->
 /* (7) Ask for permission API */
 Notification.requestPermission();
 
+/* (8) DEBUG MODE */
+window.DEBUG_MOD = false;
+
+