[ICE-10448] Add ICEfaces support for online/offline window events - ICEsoft JIRA Issue Tracker

Details

Type: New Feature
Status: Closed
Priority: Major
Resolution: Fixed
Affects Version/s: None
Fix Version/s: EE-4.0.0.GA
Component/s: Bridge
Labels:
None
Environment:
ICEfaces 4

Assignee Priority:
P1
Affects:

Documentation (User Guide, Ref. Guide, etc.), Sample App./Tutorial

Description

In order to support the notion of offline vs online modalities in ICEfaces, we need to provide support for new window-level "online" and "offline" events.

These events could be used by the application or potentially components to dynamically enable/disable themselves depending on the online status..

Issue Links

blocks

ICE-10451 New mobi:onlineStatus component

Closed

ICE-10449 ace:pushButton - add "offlineDisabled" attribute

Closed

ICE-10450 mobi:flipSwitch - add "offlineDisabled" attribute

Closed

Activity

Ascending order - Click to sort in descending order

Hide

Permalink

Philip Breau added a comment - 27/Jan/15 6:52 AM - edited

I would suggest that the following code be integrated into the ICEfaces core js lib:

/* Online Listener */
(function() {
    function OnlineStatusListener(clientId, cfg) {
        var id = clientId;
        var onOnline = cfg.onOnline;
        var onOffline = cfg.onOffline;
        
        function deregisterEvents(){
            window.removeEventListener('online', updateOnlineStatus, false);
            window.removeEventListener('offline', updateOnlineStatus, false);
        } 
        
        function registerEvents(){
            window.addEventListener('online', updateOnlineStatus, false);
            window.addEventListener('offline', updateOnlineStatus, false);
        }
        
        registerEvents();
        updateOnlineStatus(new Object());
        
        function updateOnlineStatus(event) {
            var elem = document.getElementById(id);
            if( !elem ){
                deregisterEvents();
                return;
            }
            if( navigator.onLine ){
                if( onOnline ){
                    onOnline(event, elem);
                }
            }
            else{
                if( onOffline ){
                    onOffline(event, elem);
                }
            }
        }
        
        return {
            registerEvents: registerEvents,
            deregisterEvents: deregisterEvents
        }
    };
    ice.mobi.onlineStatusListener = {
        instances: {},
        
        initClient: function(clientId, cfg) {
            if (!this.instances[clientId]) {
                this.instances[clientId] = new OnlineStatusListener(clientId, cfg);
            } else {
                this.instances[clientId].deregisterEvents();
                this.instances[clientId].registerEvents();
            }
        }
    
    }
})();

The Java interface can also be brought into core:

public interface OnlineStatusListener {
    
    public void setOnoffline(String str);
    public String getOnoffline();
    public void setOnonline(String str);
    public String getOnonline();
    public String getClientId();
}

And any components that wish to use the general online/offline listener, whether, ace, mobi, or core, can use the script util renderer:

public class OnlineStatusListenerUtil {
    
    public static void renderOnlineStatusScript(OnlineStatusListener listener, ResponseWriter writer)
        throws IOException{
        String onOffline = listener.getOnoffline();
        if( onOffline != null && onOffline.length() == 0 ){
            onOffline = null;
        }
        String onOnline = listener.getOnonline();
        if( onOnline != null && onOnline.length() == 0 ){
            onOnline = null;
        }
        if( onOffline != null || onOnline != null ){
            String clientId = listener.getClientId();
            String cleanClientId = clientId.replace(':', '_');
            writer.startElement("script", null);
            writer.writeAttribute("type", "text/javascript", null);
            String script = "ice.mobi.onlineStatusListener.initClient('" + clientId + "', {";
            
            if( onOnline != null ){
                script += "onOnline: onOnline_" + cleanClientId;
            }
            if( onOnline != null && onOffline != null ){
                script += ",";
            }
            if( onOffline != null ){
                script += "onOffline: onOffline_" + cleanClientId;
            }
            script += "});";
            if( onOnline != null ){
                script += "function onOnline_" + cleanClientId + "(event, elem){"
                           + onOnline
                       + "};";
            }
            if( onOffline != null ){
                script += "function onOffline_" + cleanClientId + "(event, elem){"
                           + onOffline
                       + "};";
            }
            writer.write(script);
            writer.endElement("script");
        }
    }

}

Like so:

public class FieldSetGroup extends FieldSetBase implements OnlineStatusListener{
    ...
}
public class  FieldSetGroupRenderer{
    public void encodeEnd(FacesContext facesContext, UIComponent uiComponent)
            throws IOException {
        FieldSetGroup field = (FieldSetGroup) uiComponent; 
	ResponseWriter writer = facesContext.getResponseWriter(); 
	OnlineStatusListenerUtil.renderOnlineStatusScript(field, writer); 
	writer.endElement(HTML.FIELDSET_ELEM);      
    }
}

Show

Philip Breau added a comment - 27/Jan/15 6:52 AM - edited I would suggest that the following code be integrated into the ICEfaces core js lib: /* Online Listener */ (function() { function OnlineStatusListener(clientId, cfg) { var id = clientId; var onOnline = cfg.onOnline; var onOffline = cfg.onOffline; function deregisterEvents(){ window.removeEventListener('online', updateOnlineStatus, false ); window.removeEventListener('offline', updateOnlineStatus, false ); } function registerEvents(){ window.addEventListener('online', updateOnlineStatus, false ); window.addEventListener('offline', updateOnlineStatus, false ); } registerEvents(); updateOnlineStatus( new Object ()); function updateOnlineStatus(event) { var elem = document.getElementById(id); if ( !elem ){ deregisterEvents(); return ; } if ( navigator.onLine ){ if ( onOnline ){ onOnline(event, elem); } } else { if ( onOffline ){ onOffline(event, elem); } } } return { registerEvents: registerEvents, deregisterEvents: deregisterEvents } }; ice.mobi.onlineStatusListener = { instances: {}, initClient: function(clientId, cfg) { if (! this .instances[clientId]) { this .instances[clientId] = new OnlineStatusListener(clientId, cfg); } else { this .instances[clientId].deregisterEvents(); this .instances[clientId].registerEvents(); } } } })(); The Java interface can also be brought into core: public interface OnlineStatusListener { public void setOnoffline( String str); public String getOnoffline(); public void setOnonline( String str); public String getOnonline(); public String getClientId(); } And any components that wish to use the general online/offline listener, whether, ace, mobi, or core, can use the script util renderer: public class OnlineStatusListenerUtil { public static void renderOnlineStatusScript(OnlineStatusListener listener, ResponseWriter writer) throws IOException{ String onOffline = listener.getOnoffline(); if ( onOffline != null && onOffline.length() == 0 ){ onOffline = null ; } String onOnline = listener.getOnonline(); if ( onOnline != null && onOnline.length() == 0 ){ onOnline = null ; } if ( onOffline != null || onOnline != null ){ String clientId = listener.getClientId(); String cleanClientId = clientId.replace(':', '_'); writer.startElement( "script" , null ); writer.writeAttribute( "type" , "text/javascript" , null ); String script = "ice.mobi.onlineStatusListener.initClient('" + clientId + "', {" ; if ( onOnline != null ){ script += "onOnline: onOnline_" + cleanClientId; } if ( onOnline != null && onOffline != null ){ script += "," ; } if ( onOffline != null ){ script += "onOffline: onOffline_" + cleanClientId; } script += "});" ; if ( onOnline != null ){ script += "function onOnline_" + cleanClientId + "(event, elem){" + onOnline + "};" ; } if ( onOffline != null ){ script += "function onOffline_" + cleanClientId + "(event, elem){" + onOffline + "};" ; } writer.write(script); writer.endElement( "script" ); } } } Like so: public class FieldSetGroup extends FieldSetBase implements OnlineStatusListener{ ... } public class FieldSetGroupRenderer{ public void encodeEnd(FacesContext facesContext, UIComponent uiComponent) throws IOException { FieldSetGroup field = (FieldSetGroup) uiComponent; ResponseWriter writer = facesContext.getResponseWriter(); OnlineStatusListenerUtil.renderOnlineStatusScript(field, writer); writer.endElement(HTML.FIELDSET_ELEM); } }

Hide

Permalink

Mircea Toma added a comment - 29/Jan/15 2:39 PM - edited

Added callback registration functions for online and offline browser events.

Usage:

var removeOnlineCallback = ice.onOnline(function() {
  ...do something when browser comes back online...
});

removeOnlineCallback();//removes the registered callback

var removeOff = ice.onOffline(function() {
  ...do something when browser goes offline...
});

removeOff();//removes the registered offline callback

Show

Mircea Toma added a comment - 29/Jan/15 2:39 PM - edited Added callback registration functions for online and offline browser events. Usage: var removeOnlineCallback = ice.onOnline(function() { ... do something when browser comes back online... }); removeOnlineCallback(); //removes the registered callback var removeOff = ice.onOffline(function() { ... do something when browser goes offline... }); removeOff(); //removes the registered offline callback

Add ICEfaces support for online/offline window events

Details

Description

Issue Links

Activity

People

Dates