Finished configurable logging view and control.

Fixes #51
Fixes #52

pom.xml

@@ -5,7 +5,7 @@
 
 	<groupId>com.bwssystems.HABridge</groupId>
 	<artifactId>ha-bridge</artifactId>
-	<version>1.4.0</version>
+	<version>1.4.1</version>
 	<packaging>jar</packaging>
 
 	<name>HA Bridge</name>
@@ -29,16 +29,42 @@
 		    <groupId>com.github.bwssytems</groupId>
 		    <artifactId>harmony-java-client</artifactId>
 		    <version>1.0.8</version>
+		    <exclusions>
+		       <exclusion> 
+		          <groupId>org.slf4j</groupId>
+		          <artifactId>slf4j-simple</artifactId>
+		       </exclusion>
+		       <exclusion> 
+		            <groupId>org.slf4j</groupId>
+		            <artifactId>log4j-over-slf4j</artifactId>
+		       </exclusion>
+		    </exclusions> 
 		</dependency>
         <dependency>
             <groupId>com.github.bwssytems</groupId>
             <artifactId>nest-controller</artifactId>
-            <version>1.0.4</version>
+            <version>1.0.5</version>
+		    <exclusions>
+		       <exclusion> 
+		          <groupId>org.slf4j</groupId>
+		          <artifactId>slf4j-simple</artifactId>
+		       </exclusion>
+		       <exclusion> 
+		            <groupId>org.slf4j</groupId>
+		            <artifactId>log4j-over-slf4j</artifactId>
+		       </exclusion>
+		    </exclusions> 
         </dependency>
 		<dependency>
 		    <groupId>com.sparkjava</groupId>
 		    <artifactId>spark-core</artifactId>
 		    <version>2.3</version>
+		    <exclusions>
+		    	<exclusion>
+		    		<artifactId>slf4j-simple</artifactId>
+		    		<groupId>org.slf4j</groupId>
+		    	</exclusion>
+		    </exclusions>
 		</dependency>
 		<dependency>
 			<groupId>org.apache.httpcomponents</groupId>
@@ -52,14 +78,14 @@
         </dependency>
         <dependency>
             <groupId>org.slf4j</groupId>
-            <artifactId>slf4j-simple</artifactId>
-            <version>1.7.5</version>
-        </dependency>
-        <dependency>
-            <groupId>org.slf4j</groupId>
-            <artifactId>log4j-over-slf4j</artifactId>
+            <artifactId>slf4j-api</artifactId>
             <version>1.7.5</version>
         </dependency>
+		<dependency>
+			<groupId>ch.qos.logback</groupId>
+			<artifactId>logback-classic</artifactId>
+			<version>1.1.5</version>
+		</dependency>
         <dependency>
             <groupId>com.google.code.gson</groupId>
             <artifactId>gson</artifactId>
@@ -138,7 +164,7 @@
 									<artifact>*:*</artifact>
 								</filter>
 								<filter>
-									<artifact>org.slf4j:*</artifact>
+									<artifact>org.slf4j:slf4j-api</artifact>
 									<includes>
 										<include>**</include>
 									</includes>

src/main/java/com/bwssystems/HABridge/BridgeSettings.java

@@ -15,6 +15,8 @@ import org.apache.http.conn.util.InetAddressUtils;
 import org.slf4j.Logger;
 import org.slf4j.LoggerFactory;
 
+import com.bwssystems.util.BackupHandler;
+import com.bwssystems.util.JsonTransformer;
 import com.google.gson.Gson;
 
 public class BridgeSettings extends BackupHandler {
@@ -53,6 +55,7 @@ public class BridgeSettings extends BackupHandler {
         else
         {
         	log.info("reading from system properties");
+        	theBridgeSettings.setNumberoflogmessages(Configuration.NUMBER_OF_LOG_MESSAGES);
         	theBridgeSettings.setConfigfile(Configuration.CONFIG_FILE);
         	theBridgeSettings.setServerPort(System.getProperty("server.port", Configuration.DEFAULT_WEB_PORT));
         	theBridgeSettings.setUpnpConfigAddress(System.getProperty("upnp.config.address"));

src/main/java/com/bwssystems/HABridge/BridgeSettingsDescriptor.java

@@ -20,6 +20,7 @@ public class BridgeSettingsDescriptor {
 	private boolean harmonyconfigured;
 	private boolean nestconfigured;
 	private String configfile;
+	private Integer numberoflogmessages;
 	
 	public BridgeSettingsDescriptor() {
 		super();
@@ -137,6 +138,12 @@ public class BridgeSettingsDescriptor {
 	public void setConfigfile(String configfile) {
 		this.configfile = configfile;
 	}
+	public Integer getNumberoflogmessages() {
+		return numberoflogmessages;
+	}
+	public void setNumberoflogmessages(Integer numberoflogmessages) {
+		this.numberoflogmessages = numberoflogmessages;
+	}
 	public Boolean isValidVera() {
 		if(this.getVeraAddress() == null)
 			return false;

src/main/java/com/bwssystems/HABridge/Configuration.java

@@ -11,4 +11,5 @@ public class Configuration {
 	public static final int UPNP_DISCOVERY_PORT = 1900;
 	public static final String UPNP_MULTICAST_ADDRESS = "239.255.255.250";
 	public static final String CONFIG_FILE = "data/habridge.config";
+	public static final int NUMBER_OF_LOG_MESSAGES = 512;
 }

src/main/java/com/bwssystems/HABridge/SystemControl.java

@@ -9,28 +9,52 @@ import java.io.IOException;
 import java.net.DatagramPacket;
 import java.net.InetAddress;
 import java.net.MulticastSocket;
+import java.text.DateFormat;
+import java.text.SimpleDateFormat;
+import java.util.Arrays;
 
 import org.apache.http.HttpStatus;
 import org.slf4j.Logger;
 import org.slf4j.LoggerFactory;
 
 import com.bwssystems.HABridge.dao.BackupFilename;
+import com.bwssystems.logservices.LoggerInfo;
+import com.bwssystems.logservices.LoggingForm;
+import com.bwssystems.logservices.LoggingManager;
+import com.bwssystems.util.JsonFreeTextStringFormatter;
+import com.bwssystems.util.JsonTransformer;
 import com.google.gson.Gson;
 
+import ch.qos.logback.classic.LoggerContext;
+import ch.qos.logback.classic.spi.ILoggingEvent;
+import ch.qos.logback.classic.spi.LoggingEvent;
+import ch.qos.logback.core.read.CyclicBufferAppender;
+
 public class SystemControl {
     private static final Logger log = LoggerFactory.getLogger(SystemControl.class);
+    public static final String CYCLIC_BUFFER_APPENDER_NAME = "CYCLIC";
+    private LoggerContext lc; 
     private static final String SYSTEM_CONTEXT = "/system";
     private BridgeSettings bridgeSettings;
     private Version version;
+    private CyclicBufferAppender<ILoggingEvent> cyclicBufferAppender;
+    private DateFormat dateFormat;
+    private LoggingManager theLogServiceMgr;
+
 
 	public SystemControl(BridgeSettings theBridgeSettings, Version theVersion) {
         this.bridgeSettings = theBridgeSettings;
 		this.version = theVersion;
+		this.lc = (LoggerContext) LoggerFactory.getILoggerFactory(); 
+		this.dateFormat = new SimpleDateFormat("MM-dd-yyyy HH:mm:ss.SSS");
+		reacquireCBA();
+		theLogServiceMgr = new LoggingManager();
+		theLogServiceMgr.init();
 	}
 
 //	This function sets up the sparkjava rest calls for the hue api
     public void setupServer() {
-    	log.info("Hue emulator service started....");
+    	log.info("System control service started....");
 	    // http://ip_address:port/system/habridge/version gets the version of this bridge instance
     	get (SYSTEM_CONTEXT + "/habridge/version", "application/json", (request, response) -> {
 	    	log.debug("Get HA Bridge version: v" + version.getVersion());
@@ -38,7 +62,67 @@ public class SystemControl {
 	        return "{\"version\":\"" + version.getVersion() + "\"}";
 	    });
 
-//      http://ip_address:port/system/settings which returns the bridge configuration settings
+	    // http://ip_address:port/system/logmsgs gets the log messages for the bridge
+    	get (SYSTEM_CONTEXT + "/logmsgs", "application/json", (request, response) -> {
+			log.debug("Get logmsgs.");
+			response.status(HttpStatus.SC_OK);
+			String logMsgs;
+		    int count = -1;
+		    if(cyclicBufferAppender == null)
+		    	reacquireCBA();
+		    if (cyclicBufferAppender != null) {
+		      count = cyclicBufferAppender.getLength();
+		    }
+		    logMsgs = "[";
+		    if (count == -1) {
+		      logMsgs = logMsgs + "{\"message\":\"Failed to locate CyclicBuffer\"}";
+		    } else if (count == 0) {
+		    	logMsgs = logMsgs + "{\"message\":\"No logging events to display\"}";
+		    } else {
+				LoggingEvent le;
+				for (int i = 0; i < count; i++) {
+					le = (LoggingEvent) cyclicBufferAppender.get(i);
+					logMsgs = logMsgs + ( i > 0?",{":"{") + "\"time\":\"" + dateFormat.format(le.getTimeStamp()) + "\",\"level\":\"" + le.getLevel().levelStr + "\",\"component\":\"" + le.getLoggerName() + "\",\"message\":\"" + JsonFreeTextStringFormatter.forJSON(le.getFormattedMessage()) + "\"}";
+				}
+		    }
+		    logMsgs = logMsgs + "]";
+			response.status(200);
+			return logMsgs;
+	    });
+
+	    // http://ip_address:port/system/logmgmt/loggers gets the logger info for the bridge
+    	get (SYSTEM_CONTEXT + "/logmgmt/loggers/:all", "application/json", (request, response) -> {
+			log.info("Get loggers info with showAll argument: " + request.params(":all"));
+			Boolean showAll = false;
+			if(request.params(":all").equals("true"))
+				showAll = true;
+			theLogServiceMgr.setShowAll(showAll);
+			theLogServiceMgr.init();
+			response.status(200);
+			return theLogServiceMgr.getConfiguredLoggers();
+	    }, new JsonTransformer());
+
+//      http://ip_address:port/system/logmgmt/update CORS request
+	    options(SYSTEM_CONTEXT + "/logmgmt/update", "application/json", (request, response) -> {
+	        response.status(HttpStatus.SC_OK);
+	        response.header("Access-Control-Allow-Origin", request.headers("Origin"));
+	        response.header("Access-Control-Allow-Methods", "GET, POST, PUT");
+	        response.header("Access-Control-Allow-Headers", request.headers("Access-Control-Request-Headers"));
+	        response.header("Content-Type", "text/html; charset=utf-8");
+	    	return "";
+	    });
+//      http://ip_address:port/system/logmgmt/update which changes logging parameters for the process
+		put(SYSTEM_CONTEXT + "/logmgmt/update", "application/json", (request, response) -> {
+			response.status(200);
+			LoggerInfo updateLoggers[];
+			updateLoggers = new Gson().fromJson(request.body(), LoggerInfo[].class);
+			LoggingForm theModel = theLogServiceMgr.getModel();
+			theModel.setUpdatedLoggers(Arrays.asList(updateLoggers));
+			theLogServiceMgr.updateLogLevels();
+            return theLogServiceMgr.getConfiguredLoggers();
+        }, new JsonTransformer());
+
+    	//      http://ip_address:port/system/settings which returns the bridge configuration settings
 		get(SYSTEM_CONTEXT + "/settings", "application/json", (request, response) -> {
 			log.debug("bridge settings requested from " + request.ip());
 
@@ -158,6 +242,12 @@ public class SystemControl {
 	        return null;
 	    }, new JsonTransformer());
     }
+    
+    void reacquireCBA() {
+        cyclicBufferAppender = (CyclicBufferAppender<ILoggingEvent>) lc.getLogger(
+            Logger.ROOT_LOGGER_NAME).getAppender(CYCLIC_BUFFER_APPENDER_NAME);
+        cyclicBufferAppender.setMaxSize(bridgeSettings.getBridgeSettingsDescriptor().getNumberoflogmessages());
+      }
 
     protected void pingListener() {
         try {

src/main/java/com/bwssystems/HABridge/dao/DeviceRepository.java

@@ -15,9 +15,9 @@ import java.util.Random;
 import org.slf4j.Logger;
 import org.slf4j.LoggerFactory;
 
-import com.bwssystems.HABridge.BackupHandler;
-import com.bwssystems.HABridge.JsonTransformer;
 import com.bwssystems.HABridge.dao.DeviceDescriptor;
+import com.bwssystems.util.BackupHandler;
+import com.bwssystems.util.JsonTransformer;
 import com.google.gson.stream.JsonReader;
 
 import java.util.List;

src/main/java/com/bwssystems/HABridge/devicemanagmeent/DeviceResource.java

@@ -16,7 +16,6 @@ import org.slf4j.Logger;
 import org.slf4j.LoggerFactory;
 
 import com.bwssystems.HABridge.BridgeSettingsDescriptor;
-import com.bwssystems.HABridge.JsonTransformer;
 import com.bwssystems.HABridge.dao.BackupFilename;
 import com.bwssystems.HABridge.dao.DeviceDescriptor;
 import com.bwssystems.HABridge.dao.DeviceRepository;
@@ -25,6 +24,7 @@ import com.bwssystems.NestBridge.NestHome;
 import com.bwssystems.harmony.HarmonyHome;
 import com.bwssystems.luupRequests.Device;
 import com.bwssystems.luupRequests.Scene;
+import com.bwssystems.util.JsonTransformer;
 import com.bwssystems.vera.VeraHome;
 import com.google.gson.Gson;
 
@@ -34,7 +34,6 @@ import com.google.gson.Gson;
 public class DeviceResource {
     private static final String API_CONTEXT = "/api/devices";
     private static final Logger log = LoggerFactory.getLogger(DeviceResource.class);
-
     private DeviceRepository deviceRepository;
     private VeraHome veraHome;
     private HarmonyHome myHarmonyHome;
@@ -58,7 +57,6 @@ public class DeviceResource {
 			this.nestHome = aNestHome;
 		else
 			this.nestHome = null;
-		
         setupEndpoints();
 	}
 

src/main/java/com/bwssystems/HABridge/hue/HueMulator.java

@@ -1,7 +1,6 @@
 package com.bwssystems.HABridge.hue;
 
 import com.bwssystems.HABridge.BridgeSettingsDescriptor;
-import com.bwssystems.HABridge.JsonTransformer;
 import com.bwssystems.HABridge.api.UserCreateRequest;
 import com.bwssystems.HABridge.api.hue.DeviceResponse;
 import com.bwssystems.HABridge.api.hue.DeviceState;
@@ -14,6 +13,7 @@ import com.bwssystems.harmony.HarmonyHandler;
 import com.bwssystems.harmony.HarmonyHome;
 import com.bwssystems.harmony.RunActivity;
 import com.bwssystems.nest.controller.Nest;
+import com.bwssystems.util.JsonTransformer;
 import com.fasterxml.jackson.databind.DeserializationFeature;
 import com.fasterxml.jackson.databind.ObjectMapper;
 import com.google.gson.Gson;

src/main/java/com/bwssystems/HABridge/upnp/UpnpListener.java

@@ -104,7 +104,7 @@ public class UpnpListener {
 	 */
 	protected boolean isSSDPDiscovery(DatagramPacket packet){
 		//Only respond to discover request for strict upnp form
-		String packetString = new String(packet.getData());
+		String packetString = new String(packet.getData(), 0, packet.getLength());
 		if(packetString != null && packetString.startsWith("M-SEARCH * HTTP/1.1") && packetString.contains("\"ssdp:discover\"")){
 			log.debug("isSSDPDiscovery Found message to be an M-SEARCH message.");
 			log.debug("isSSDPDiscovery Got SSDP packet from " + packet.getAddress().getHostAddress() + ":" + packet.getPort() + ", body: " + packetString);
@@ -148,9 +148,9 @@ public class UpnpListener {
 		String discoveryResponse = null;
 		discoveryResponse = String.format(discoveryTemplate, responseAddress, httpServerPort);
 		if(traceupnp)
-			log.info("Traceupnp: sendUpnpResponse: " + discoveryResponse);
+			log.info("Traceupnp: sendUpnpResponse discovery template with address: " + responseAddress + " and port: " + httpServerPort);
 		else
-			log.debug("sendUpnpResponse: " + discoveryResponse);
+			log.debug("sendUpnpResponse discovery template with address: " + responseAddress + " and port: " + httpServerPort);
 		DatagramPacket response = new DatagramPacket(discoveryResponse.getBytes(), discoveryResponse.length(), requester, sourcePort);
 		socket.send(response);
 	}

src/main/java/com/bwssystems/HABridge/upnp/UpnpSettingsResource.java

@@ -54,9 +54,9 @@ public class UpnpSettingsResource {
 			String filledTemplate = null;
 			filledTemplate = String.format(hueTemplate, theSettings.getUpnpConfigAddress(), portNumber, theSettings.getUpnpConfigAddress());
 			if(theSettings.isTraceupnp())
-				log.info("Traceupnp: upnp device settings response: " + filledTemplate);
+				log.info("Traceupnp: upnp device settings template filled with address: " + theSettings.getUpnpConfigAddress() + " and port: " + portNumber);
 			else
-				log.debug("upnp device settings response: " + filledTemplate);
+				log.debug("Traceupnp: upnp device settings template filled with address: " + theSettings.getUpnpConfigAddress() + " and port: " + portNumber);
 //			response.header("Cache-Control", "no-store, no-cache, must-revalidate, post-check=0, pre-check=0");
 //			response.header("Pragma", "no-cache");
 //			response.header("Expires", "Mon, 1 Aug 2011 09:00:00 GMT");

src/main/java/com/bwssystems/logservices/LogFileInfo.java

@@ -0,0 +1,50 @@
+/*
+*	http://www.jrecruiter.org
+*
+*	Disclaimer of Warranty.
+*
+*	Unless required by applicable law or agreed to in writing, Licensor provides
+*	the Work (and each Contributor provides its Contributions) on an "AS IS" BASIS,
+*	WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied,
+*	including, without limitation, any warranties or conditions of TITLE,
+*	NON-INFRINGEMENT, MERCHANTABILITY, or FITNESS FOR A PARTICULAR PURPOSE. You are
+*	solely responsible for determining the appropriateness of using or
+*	redistributing the Work and assume any risks associated with Your exercise of
+*	permissions under this License.
+*
+*/
+package com.bwssystems.logservices;
+
+import java.util.Date;
+
+/**
+ * Log file information.
+ *
+ */
+public class LogFileInfo {
+
+    private String fileName;
+    private Long fileSize;
+    private Date fileLastChanged;
+    
+	public String getFileName() {
+		return fileName;
+	}
+	
+	public void setFileName(String fileName) {
+		this.fileName = fileName;
+	}
+	public Long getFileSize() {
+		return fileSize;
+	}
+	public void setFileSize(Long fileSize) {
+		this.fileSize = fileSize;
+	}
+	public Date getFileLastChanged() {
+		return fileLastChanged;
+	}
+	public void setFileLastChanged(Date fileLastChanged) {
+		this.fileLastChanged = fileLastChanged;
+	}
+
+}

src/main/java/com/bwssystems/logservices/LoggerInfo.java

@@ -0,0 +1,51 @@
+package com.bwssystems.logservices;
+
+import com.bwssystems.logservices.LoggingUtil.LogLevels;
+
+/**
+ * Logger information.
+ *
+ *
+ */
+public class LoggerInfo {
+
+	private String    loggerName;
+    private LogLevels logLevel;
+    private LogLevels newLogLevel;
+    
+    //~~~~~Constructors~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
+	
+    /**
+	 * 
+	 */
+	public LoggerInfo() {
+		super();
+	}
+	public LoggerInfo(String loggerName, int logLevelAsInt) {
+		super();
+		this.loggerName = loggerName;
+		this.logLevel = LogLevels.getLogLevelFromId(logLevelAsInt);
+	}
+    
+	//~~~~~Getters and Setters~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
+	
+	public String getLoggerName() {
+		return loggerName;
+	}
+	public void setLoggerName(String loggerName) {
+		this.loggerName = loggerName;
+	}
+	public LogLevels getLogLevel() {
+		return logLevel;
+	}
+	public void setLogLevel(LogLevels logLevel) {
+		this.logLevel = logLevel;
+	}
+	public LogLevels getNewLogLevel() {
+		return newLogLevel;
+	}
+	public void setNewLogLevel(LogLevels newLogLevel) {
+		this.newLogLevel = newLogLevel;
+	}
+	
+}

src/main/java/com/bwssystems/logservices/LoggingForm.java

@@ -0,0 +1,58 @@
+package com.bwssystems.logservices;
+
+import java.io.Serializable;
+import java.util.ArrayList;
+import java.util.List;
+
+/**
+ * Form for the Logging Action.
+ */
+public class LoggingForm implements Serializable {
+
+    /** serialVersionUID. */
+	private static final long serialVersionUID = 5970927715241338665L;
+
+	/** List of Loggers, simplified for display purposes */
+    private List<LoggerInfo> updatedLoggers = new ArrayList<LoggerInfo>();
+
+    /** The user can enter a new logger to be configured */
+    private LoggerInfo newLogger;
+    
+    /** Used for requesting a logfile download */
+    private String fileName;
+    
+    //~~~~~Constructors~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
+	
+	public LoggingForm() {
+		super();
+	}
+
+    
+	//~~~~~Getters and Setters~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
+	
+	
+	public List<LoggerInfo> getUpdatedLoggers() {
+		return updatedLoggers;
+	}
+
+	public void setUpdatedLoggers(List<LoggerInfo> updatedLoggers) {
+		this.updatedLoggers = updatedLoggers;
+	}
+
+	public LoggerInfo getNewLogger() {
+		return newLogger;
+	}
+
+	public void setNewLogger(LoggerInfo newLogger) {
+		this.newLogger = newLogger;
+	}
+
+	public String getFileName() {
+		return fileName;
+	}
+
+	public void setFileName(String fileName) {
+		this.fileName = fileName;
+	}
+	
+}

src/main/java/com/bwssystems/logservices/LoggingManager.java

@@ -0,0 +1,163 @@
+package com.bwssystems.logservices;
+
+import java.io.File;
+import java.io.FileInputStream;
+import java.io.InputStream;
+import java.util.ArrayList;
+import java.util.EnumSet;
+import java.util.List;
+import java.util.Set;
+
+import com.bwssystems.logservices.LoggingUtil;
+import com.bwssystems.logservices.LoggingUtil.LogLevels;
+
+import ch.qos.logback.classic.Level;
+import ch.qos.logback.classic.Logger;
+
+/**
+ * Show log files and allow to set log levels for the configured loggers (logback)
+ * to be changed dynamically at runtime.
+ */
+
+public class LoggingManager {
+
+	/** Show all loggers or only the configured loggers */
+    private boolean showAll = false;
+    
+    /** List of log files and associated information */
+    private List<LogFileInfo> logFileInfos = new ArrayList<LogFileInfo>();
+    
+    /** List of Loggers, simplified for display purposes */
+    private List<LoggerInfo> configuredLoggers =  new ArrayList<LoggerInfo>();
+    
+    /** Used to stream a logfile back to the client */
+    private transient InputStream fileToDownLoad;
+    
+    private LoggingForm model = new LoggingForm();
+    
+    //~~~~~Reference Data~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
+    
+    /** Defines a collection of log levels. Unfortunately logback does not use 
+     *  enums to define its log levels. */
+    private Set<LogLevels> logLevels = EnumSet.allOf(LogLevels.class); 
+    
+    //~~~~~Prepare data~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
+    
+	public void init() {
+		loadLoggers();
+		loadLogFiles();
+	}
+	
+	//~~~~~Helper Methods~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
+
+	private void loadLoggers() {
+		this.configuredLoggers.clear();
+		
+    	final List<Logger> loggers = LoggingUtil.getLoggers(this.showAll);
+    	
+    	for (Logger logger : loggers) {
+    		
+    		this.configuredLoggers.add(new LoggerInfo(logger.getName(), logger.getEffectiveLevel().levelInt));
+    	}
+	}
+	
+	private void loadLogFiles() {
+		this.logFileInfos = LoggingUtil.getLogFileInfos();
+	}
+	
+	/** Updates loglevels for loggers */
+    public String updateLogLevels() {
+
+        if (this.model.getUpdatedLoggers() != null && !this.model.getUpdatedLoggers().isEmpty()) {
+        	
+        	for (LoggerInfo loggerInfo : this.model.getUpdatedLoggers()) {
+        		
+        		if (loggerInfo != null && loggerInfo.getNewLogLevel() != null) {
+        			
+        			LoggingUtil.getLogger(loggerInfo.getLoggerName())
+        			           .setLevel(Level.toLevel(loggerInfo.getNewLogLevel().getLogLevel()));
+        			
+        		}
+        	}
+        	
+        	//Need to refresh the loggers
+        	loadLoggers();
+        }
+        
+        
+        return "successRedirect";
+        
+    }
+	
+    /** Adds a new logger at runtime.  */
+	public String addNewLogger() {
+	
+        if (this.model.getNewLogger() != null 
+        		&& this.model.getNewLogger().getLoggerName() != null 
+        		&& this.model.getNewLogger().getNewLogLevel() != null) {
+        	final Logger newLogger = LoggingUtil.getLogger(this.model.getNewLogger().getLoggerName());
+        	newLogger.setLevel(Level.toLevel(this.model.getNewLogger().getNewLogLevel().getLogLevel()));  
+            
+        	//Need to refresh the loggers
+        	loadLoggers();
+        }
+		
+		return "successRedirect";
+	}
+	
+    /**
+     * Retrieve the requested log file.
+     * 
+     * @return
+     * @throws Exception
+     */
+    public String download() throws Exception {
+
+        if (this.model.getFileName() == null) {
+            throw new IllegalArgumentException("FileName must not be null.");
+        }
+        
+        final File logFile = LoggingUtil.getLogFile(this.model.getFileName());
+        
+        if (logFile != null) {
+        	this.fileToDownLoad = new FileInputStream(logFile);
+        }
+
+        return "download";
+    }
+
+    //~~~~~Getters and Setters~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
+    
+	public List<LogFileInfo> getLogFileInfos() {
+        return logFileInfos;
+    }
+
+    public InputStream getFileToDownLoad() {
+        return fileToDownLoad;
+    }
+
+    public List<LoggerInfo> getConfiguredLoggers() {
+		return configuredLoggers;
+	}
+
+	public boolean isShowAll() {
+        return showAll;
+    }
+
+    public void setShowAll(boolean showAll) {
+        this.showAll = showAll;
+    }
+    
+	public Set<LogLevels> getLogLevels() {
+		return logLevels;
+	}
+
+	public LoggingForm getModel() {
+		return model;
+	}
+
+	public void setModel(LoggingForm model) {
+		this.model = model;
+	}
+
+}

src/main/java/com/bwssystems/logservices/LoggingUtil.java

@@ -0,0 +1,198 @@
+package com.bwssystems.logservices;
+
+import java.io.File;
+import java.util.ArrayList;
+import java.util.Date;
+import java.util.Iterator;
+import java.util.List;
+
+import com.bwssystems.logservices.LogFileInfo;
+import org.slf4j.LoggerFactory;
+
+import ch.qos.logback.classic.Logger;
+import ch.qos.logback.classic.LoggerContext;
+import ch.qos.logback.classic.spi.ILoggingEvent;
+import ch.qos.logback.core.Appender;
+import ch.qos.logback.core.FileAppender;
+
+/**
+ * Contains utility methods to interact with the logback during runtime.
+ */
+public class LoggingUtil {
+
+	/**
+	 * re-defines the logback logging levels as a Java enumeration. This is quite
+	 * helpful if you need to render the various log-levels as select-box. I wish
+	 * logback @see {@link ch.qos.logback.classic.Level} would not use static variables
+	 * but use enums instead. 
+	 */
+	public enum LogLevels {
+
+		OFF(Integer.MAX_VALUE, "Off"),
+		ERROR_INT(40000, "Error"),
+		WARN_INT(30000, "Warn"),
+		INFO_INT(20000, "Info"),
+		DEBUG_INT(10000, "Debug"),
+		TRACE(5000, "Trace"),
+		ALL(Integer.MIN_VALUE, "All");
+
+		private int logLevel;	
+		private String logLevelName;
+
+		LogLevels(final int logLevel, final String logLevelName) {
+			this.logLevel = logLevel;
+			this.logLevelName = logLevelName; 
+		}
+
+		public int getLogLevel() {
+			return this.logLevel;
+		}
+
+		public String getLogLevelName() {
+			return this.logLevelName;
+		}
+
+		public static LogLevels getLogLevelFromId(final int logLevelAsInt) {
+
+			for (LogLevels logLevel : LogLevels.values()) {
+
+				if (logLevelAsInt == logLevel.logLevel) {
+					return logLevel;
+				}
+			}
+
+			throw new IllegalStateException("Loglevel " + logLevelAsInt + " does not exist.");
+
+		}
+
+		@Override
+		public String toString() {
+			return this.logLevelName;
+		}
+	}
+	
+	/**
+	 * Retrieve all configured logback loggers. 
+	 * 
+	 * @param showAll If set return ALL loggers, not only the configured ones.
+	 * @return List of Loggers
+	 */
+	public static List<ch.qos.logback.classic.Logger> getLoggers(final boolean showAll) {
+
+		final LoggerContext lc = (LoggerContext) LoggerFactory.getILoggerFactory();
+		final List<ch.qos.logback.classic.Logger> loggers = new ArrayList<ch.qos.logback.classic.Logger>();
+
+		for (ch.qos.logback.classic.Logger log : lc.getLoggerList()) {
+			if(showAll == false) {
+				if(log.getLevel() != null || LoggingUtil.hasAppenders(log)) {
+					loggers.add(log);
+				}
+			} else {
+				loggers.add(log);
+			}
+		}
+
+		return loggers;
+	}
+
+	/**
+	 * Get a single logger. 
+	 * 
+	 * @return Logger
+	 */
+	public static ch.qos.logback.classic.Logger getLogger(final String loggerName) {
+
+		final LoggerContext lc = (LoggerContext) LoggerFactory.getILoggerFactory();
+
+		return lc.getLogger(loggerName);
+		
+	}
+	
+	/** 
+	 * Test whether the provided logger has appenders. 
+	 * 
+	 * @param logger The logger to test
+	 * @return true if the logger has appenders.
+	 */
+	public static boolean hasAppenders(ch.qos.logback.classic.Logger logger) {
+		Iterator<Appender<ILoggingEvent>> it = logger.iteratorForAppenders();
+		return it.hasNext();
+	}
+
+	/**
+	 * Get the logfile information for the roor logger.
+	 * 
+	 * @return List of LogFileInfo obejcts
+	 */
+	public static List<LogFileInfo> getLogFileInfos() {
+		
+		final LoggerContext lc = (LoggerContext) LoggerFactory.getILoggerFactory();
+
+		final List<LogFileInfo> logFileInfos = new ArrayList<LogFileInfo>();
+
+		final Logger logger = lc.getLogger(Logger.ROOT_LOGGER_NAME);
+
+		final Iterator<Appender<ILoggingEvent>> it = logger.iteratorForAppenders();
+
+		while (it.hasNext()) {
+
+			final Appender<ILoggingEvent> appender = it.next();
+
+			if (appender instanceof FileAppender) {
+
+				final FileAppender<ILoggingEvent> fileAppender = (FileAppender<ILoggingEvent>) appender;
+
+				final File logFile = new File(fileAppender.getFile());
+				final LogFileInfo logFileInfo = new LogFileInfo();
+
+				logFileInfo.setFileName(logFile.getName());
+				logFileInfo.setFileLastChanged(new Date(logFile.lastModified()));
+				logFileInfo.setFileSize(logFile.length());
+				logFileInfos.add(logFileInfo);
+			}
+
+		}
+
+		return logFileInfos;
+	}
+
+	/**
+	 * Get the log file.
+	 * 
+	 * @param logFileName The name of the log file 
+	 * @return The actual file
+	 */
+	public static File getLogFile(final String logFileName) {
+
+		if (logFileName == null) {
+			throw new IllegalArgumentException("logFileName cannot be null.");
+		}
+
+		final LoggerContext lc = (LoggerContext) LoggerFactory.getILoggerFactory();
+
+		final Logger logger = lc.getLogger(Logger.ROOT_LOGGER_NAME);
+
+		final Iterator<Appender<ILoggingEvent>> it = logger.iteratorForAppenders();
+
+		while (it.hasNext()) {
+
+			final Appender<ILoggingEvent> appender = it.next();
+
+			if (appender instanceof FileAppender) {
+
+				final FileAppender<ILoggingEvent> fileAppender = (FileAppender<ILoggingEvent>) appender;
+
+				final File logFile = new File(fileAppender.getFile());
+
+				if (logFile.getName().equalsIgnoreCase(logFileName)) {
+					return logFile;
+				}
+
+			}
+
+		}
+
+		return null;
+	}
+
+}

src/main/java/com/bwssystems/util/BackupHandler.java

@@ -1,4 +1,4 @@
-package com.bwssystems.HABridge;
+package com.bwssystems.util;
 
 import java.io.IOException;
 import java.nio.file.DirectoryStream;

src/main/java/com/bwssystems/util/JsonFreeTextStringFormatter.java

@@ -0,0 +1,49 @@
+package com.bwssystems.util;
+
+import java.text.StringCharacterIterator;
+
+public final class JsonFreeTextStringFormatter {
+	  private JsonFreeTextStringFormatter(){
+		    //empty - prevent construction
+		  }
+
+	  public static String forJSON(String aText){
+		    final StringBuilder result = new StringBuilder();
+		    StringCharacterIterator iterator = new StringCharacterIterator(aText);
+		    char character = iterator.current();
+		    while (character != StringCharacterIterator.DONE){
+		      if( character == '\"' ){
+		        result.append("\\\"");
+		      }
+		      else if(character == '\\'){
+		        result.append("\\\\");
+		      }
+		      else if(character == '/'){
+		        result.append("\\/");
+		      }
+		      else if(character == '\b'){
+		        result.append("\\b");
+		      }
+		      else if(character == '\f'){
+		        result.append("\\f");
+		      }
+		      else if(character == '\n'){
+		        result.append("\\n");
+		      }
+		      else if(character == '\r'){
+		        result.append("\\r");
+		      }
+		      else if(character == '\t'){
+		        result.append("\\t");
+		      }
+		      else {
+		        //the char is not a special one
+		        //add it to the result as is
+		        result.append(character);
+		      }
+		      character = iterator.next();
+		    }
+		    return result.toString();    
+		  }
+
+}

src/main/java/com/bwssystems/util/JsonTransformer.java

@@ -1,4 +1,4 @@
-package com.bwssystems.HABridge;
+package com.bwssystems.util;
 
 import com.google.gson.Gson;
 import spark.ResponseTransformer;

src/main/resources/logback.xml

@@ -0,0 +1,18 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<configuration>
+
+	<appender name="STDOUT" class="ch.qos.logback.core.ConsoleAppender">
+		<encoder>
+			<pattern>%d [%thread] %-5level %logger - %msg%n</pattern>
+		</encoder>
+	</appender>
+
+	<appender name="CYCLIC" class="ch.qos.logback.core.read.CyclicBufferAppender">
+		<MaxSize>512</MaxSize>
+	</appender>
+
+	<root level="info">
+		<appender-ref ref="STDOUT" />
+		<appender-ref ref="CYCLIC" />
+	</root>
+</configuration>

src/main/resources/public/css/scrollable-table.css

@@ -0,0 +1,127 @@
+.scrollableContainer {
+    height: 800px;
+    position: relative;
+    padding-top: 35px;
+    overflow: hidden;
+}
+.scrollableContainer .headerSpacer {
+    border: 1px solid #d5d5d5;
+    border-bottom-color: #bbb;
+    position: absolute;
+    height: 36px;
+    top: 0;
+    right: 0;
+    left: 0;
+}
+.scrollableContainer th .orderWrapper {
+    position: absolute;
+    top: 0;
+    right: 2px;
+    cursor: pointer;
+}
+.scrollableContainer th .orderWrapper .order {
+    font-size: 8pt;
+    color: #BDBDBD;
+}
+.scrollableContainer th .orderWrapper .active {
+    color: #464646;
+}
+
+.scrollArea {
+    height: 100%;
+    overflow-x: auto;
+    overflow-y: auto;
+    border: 1px solid #d5d5d5;
+    /*  the implementation of this is still quite buggy; specifically, it doesn't like the 
+        absolutely positioned headers within 
+    -webkit-overflow-scrolling: touch;  */
+}
+.scrollArea table {
+    overflow-x: hidden;
+    overflow-y: auto;
+    margin-bottom: 0;
+    width: 100%;
+    border: none;
+    /*border-collapse: separate;*/
+}
+.scrollArea table th {
+    padding: 0 !important;
+    border: none !important;
+    min-width: 60px;
+}
+.scrollArea table .th-inner {
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+    position: absolute;
+    top: 0;
+    height: 36px;
+    line-height: 36px;
+}
+
+.scrollArea table th .box {
+    padding: 0 8px;
+    padding-right: 11px;    /*  order icon width*/
+    border-left: 1px solid #ddd;
+}
+
+/*  to hack fix firefox border issue    */
+@-moz-document url-prefix() {
+    .scrollArea table th .box{
+        border-right: 1px solid #ddd;
+        border-left: none;
+    }
+}
+
+.scrollArea table .th-inner .ng-scope {
+    display: block;
+    overflow: hidden;
+    text-overflow: ellipsis;
+}
+.scrollArea table tr th:first-child th .box {
+    border-left: none;
+}
+.scrollArea table .th-inner.condensed {
+    padding: 0 3px;
+}
+.scrollArea table tbody tr td:first-child {
+    border-left: none;
+}
+.scrollArea table tbody tr td:last-child {
+    border-right: none;
+}
+.scrollArea table tbody tr:first-child td {
+    border-top: none;
+}
+.scrollArea table tbody tr:last-child td {
+    border-bottom: 2px solid #ddd;
+}
+.scrollArea table tbody tr td {
+    border-bottom: 1px solid #ddd;
+    overflow: hidden;
+    text-overflow: ellipsis;
+}
+
+.scrollableContainer .scaler {
+    position: absolute;
+    top: 0px;
+    width: 2px;
+    height: 100%;
+    background-color: #CFCFCF;
+}
+
+.scrollableContainer th .resize-rod {
+    position: absolute;
+    top: 0;
+    right: 0;
+    cursor: col-resize;
+    width: 4px;
+    height: 100%;
+}
+
+.scrollable-resizing .scrollableContainer {
+    cursor: col-resize;
+    -moz-user-select: none;
+    -webkit-user-select: none;
+    -ms-user-select: none;
+}

src/main/resources/public/index.html

@@ -12,6 +12,7 @@
 	<link href="css/rzslider.min.css" rel="stylesheet">
 	<link href="css/ngDialog.min.css" rel="stylesheet">
 	<link href="css/ngDialog-theme-default.min.css" rel="stylesheet">
+	<link href="css/scrollable-table.css" rel="stylesheet">
 
     <!--[if lt IE 9]>
     <script type="text/javascript" src="js/html5shiv.min.js"></script>
@@ -59,10 +60,11 @@
     <script src="js/angular.min.js"></script>
     <script src="js/angular-route.min.js"></script>
 	<script src="js/angular-sanitize.min.js"></script>
+	<script src="js/bootstrap.min.js"></script>
 	<script src="js/ngToast.min.js"></script>
 	<script src="js/rzslider.min.js"></script>
-	<script src="js/rzslider.min.js"></script>
     <script src="js/ngDialog.min.js"></script>
+    <script src="js/angular-scrollable-table.min.js"></script>
     <script src="scripts/app.js"></script>
 </body>
 </html>

src/main/resources/public/scripts/app.js

@@ -1,4 +1,4 @@
-var app = angular.module('habridge', ['ngRoute','ngToast','rzModule','ngDialog']);
+var app = angular.module('habridge', ['ngRoute','ngToast','rzModule','ngDialog','scrollable-table']);
 
 app.config(function ($routeProvider) {
 	$routeProvider.when('/#', {
@@ -7,27 +7,30 @@ app.config(function ($routeProvider) {
 	}).when('/system', {
 		templateUrl: 'views/system.html',
 		controller: 'SystemController'		
+	}).when('/logs', {
+		templateUrl: 'views/logs.html',
+		controller: 'LogsController'		
 	}).when('/editor', {
 		templateUrl: 'views/editor.html',
-		controller: 'AddingController'		
+		controller: 'EditController'		
 	}).when('/editdevice', {
 		templateUrl: 'views/editdevice.html',
-		controller: 'AddingController'		
+		controller: 'EditController'		
 	}).when('/veradevices', {
 		templateUrl: 'views/veradevice.html',
-		controller: 'AddingController'		
+		controller: 'VeraController'		
 	}).when('/verascenes', {
 		templateUrl: 'views/verascene.html',
-		controller: 'AddingController'		
+		controller: 'VeraController'		
 	}).when('/harmonydevices', {
 		templateUrl: 'views/harmonydevice.html',
-		controller: 'AddingController'		
+		controller: 'HarmonyController'		
 	}).when('/harmonyactivities', {
 		templateUrl: 'views/harmonyactivity.html',
-		controller: 'AddingController'		
+		controller: 'HarmonyController'		
 	}).when('/nest', {
 		templateUrl: 'views/nestactions.html',
-		controller: 'AddingController'		
+		controller: 'NestController'		
 	}).otherwise({
 		templateUrl: 'views/configuration.html',
 		controller: 'ViewingController'
@@ -41,7 +44,7 @@ app.run( function (bridgeService) {
 
 app.service('bridgeService', function ($http, $window, ngToast) {
 	var self = this;
-	this.state = {base: window.location.origin + "/api/devices", bridgelocation: window.location.origin, systemsbase: window.location.origin + "/system", huebase: window.location.origin + "/api", configs: [], backups: [], devices: [], device: [], type: "", settings: [], myToastMsg: [], olddevicename: "", isInControl: false, showVera: false, showHarmony: false, showNest: false, habridgeversion: ""};
+	this.state = {base: window.location.origin + "/api/devices", bridgelocation: window.location.origin, systemsbase: window.location.origin + "/system", huebase: window.location.origin + "/api", configs: [], backups: [], devices: [], device: [], type: "", settings: [], myToastMsg: [], logMsgs: [], loggerInfo: [], olddevicename: "", logShowAll: false, isInControl: false, showVera: false, showHarmony: false, showNest: false, habridgeversion: ""};
 
 	this.displayWarn = function(errorTitle, error) {
 		if(error == null || typeof(error) != 'undefined') {
@@ -92,6 +95,22 @@ app.service('bridgeService', function ($http, $window, ngToast) {
 		);
 	};
 
+	this.clearDevice = function () {
+		self.state.device.id = "";
+		self.state.device.mapType = null;
+		self.state.device.mapId = null;
+		self.state.device.name = "";
+		self.state.device.onUrl = "";
+		self.state.device.deviceType = "custom";
+		self.state.device.targetDevice = null;
+		self.state.device.offUrl = "";
+		self.state.device.httpVerb = null;
+		self.state.device.contentType = null;
+		self.state.device.contentBody = null;
+		self.state.device.contentBodyOff = null;
+		self.state.bridge.olddevicename = "";
+	};
+
 	this.getHABridgeVersion = function () {
 		return $http.get(this.state.systemsbase + "/habridge/version").then(
 				function (response) {
@@ -158,6 +177,28 @@ app.service('bridgeService', function ($http, $window, ngToast) {
 		);
 	};
 
+	this.viewLogs = function () {
+		return $http.get(this.state.systemsbase + "/logmsgs").then(
+				function (response) {
+					self.state.logMsgs = response.data;
+				},
+				function (error) {
+					self.displayWarn("Get log messages Error: ", error);
+				}
+		);
+	};
+
+	this.viewLoggerInfo = function () {
+		return $http.get(this.state.systemsbase + "/logmgmt/loggers/" + self.state.logShowAll).then(
+				function (response) {
+					self.state.loggerInfo = response.data;
+				},
+				function (error) {
+					self.displayWarn("Get logger info Error: ", error);
+				}
+		);
+	};
+
 	this.viewNestItems = function () {
 		if(!this.state.showNest)
 			return;
@@ -223,6 +264,19 @@ app.service('bridgeService', function ($http, $window, ngToast) {
 		);
 	};
 
+	this.updateLogLevels = function(logComponents) {
+		return $http.put(this.state.systemsbase + "/logmgmt/update", logComponents ).then(
+				function (response) {
+					self.state.loggerInfo = response.data;
+					self.displaySuccess("Updated " + logComponents.length + " loggers for log levels.")
+				},
+				function (error) {
+					self.displayWarn("Update Log components Error: ", error);
+				}
+		);
+			
+	};
+	
 	this.findDeviceByMapId = function(id, target, type) {
 		for(var i = 0; i < this.state.devices.length; i++) {
 			if(this.state.devices[i].mapId == id && this.state.devices[i].mapType == type && this.state.devices[i].targetDevice == target)
@@ -448,7 +502,7 @@ app.service('bridgeService', function ($http, $window, ngToast) {
 					self.viewDevices();
 				},
 				function (error) {
-					nself.displayWarn("Delete Device Error: ", error);
+					self.displayWarn("Delete Device Error: ", error);
 				}
 		);
 	};
@@ -507,8 +561,6 @@ app.controller('SystemController', function ($scope, $location, $http, $window,
     $scope.isInControl = false;
     $scope.visible = false;
     $scope.imgUrl = "glyphicon glyphicon-plus";
-    $scope.visibleBk = false;
-    $scope.imgBkUrl = "glyphicon glyphicon-plus";
     $scope.addVeratoSettings = function (newveraname, newveraip) {
     	if($scope.bridge.settings.veraaddress == null) {
     		$scope.bridge.settings.veraaddress = { devices: [] };
@@ -575,13 +627,48 @@ app.controller('SystemController', function ($scope, $location, $http, $window,
         else
             $scope.imgUrl = "glyphicon glyphicon-plus";
     };
-    $scope.toggleBk = function () {
-        $scope.visibleBk = !$scope.visibleBk;
-        if($scope.visibleBk)
-            $scope.imgBkUrl = "glyphicon glyphicon-minus";
-        else
-            $scope.imgBkUrl = "glyphicon glyphicon-plus";
-    };
+});
+
+app.controller('LogsController', function ($scope, $location, $http, $window, bridgeService) {
+    bridgeService.viewLogs();
+    $scope.bridge = bridgeService.state;
+    $scope.levels = ["INFO_INT", "WARN_INT", "DEBUG_INT", "TRACE_INT"];
+	$scope.updateComponents = [];
+	$scope.visible = false;
+	$scope.imgUrl = "glyphicon glyphicon-plus";
+	$scope.updateLogs = function() {
+		bridgeService.viewLogs();
+	};
+	$scope.toggle = function () {
+		$scope.visible = !$scope.visible;
+		if($scope.visible) {
+			$scope.imgUrl = "glyphicon glyphicon-minus";
+		    bridgeService.viewLoggerInfo();
+		}
+		else
+			$scope.imgUrl = "glyphicon glyphicon-plus";
+	};
+	$scope.addToUpdate = function (logInfo) {
+		var idx = $scope.updateComponents.indexOf(logInfo);
+
+		// is currently selected
+		if (idx > -1) {
+			$scope.updateComponents.splice(idx, 1);
+		}
+
+		// is newly selected
+		else {
+			$scope.updateComponents.push(logInfo);
+		}
+	};
+	
+	$scope.updateLoggers = function () {
+		bridgeService.updateLogLevels($scope.updateComponents);
+	};
+	
+	$scope.reloadLoggers = function () {
+		bridgeService.viewLoggerInfo();
+	};
 });
 
 app.controller('ViewingController', function ($scope, $location, $http, $window, bridgeService, ngDialog) {
@@ -594,12 +681,6 @@ app.controller('ViewingController', function ($scope, $location, $http, $window,
 	$scope.imgUrl = "glyphicon glyphicon-plus";
 	$scope.visibleBk = false;
 	$scope.imgBkUrl = "glyphicon glyphicon-plus";
-	$scope.predicate = '';
-	$scope.reverse = true;
-	$scope.order = function(predicate) {
-		$scope.reverse = ($scope.predicate === predicate) ? !$scope.reverse : false;
-		$scope.predicate = predicate;
-	};
 	$scope.testUrl = function (device, type) {
 		var dialogNeeded = false;
 		if((type == "on" && (bridgeService.aContainsB(device.onUrl, "${intensity..byte}") ||
@@ -685,7 +766,7 @@ app.controller('ValueDialogCtrl', function ($scope, bridgeService, ngDialog) {
 	};
 });
 
-app.controller('AddingController', function ($scope, $location, $http, bridgeService) {
+app.controller('VeraController', function ($scope, $location, $http, bridgeService) {
 	$scope.bridge = bridgeService.state;
 	$scope.device = $scope.bridge.device;
 	$scope.device_dim_control = "";
@@ -697,72 +778,11 @@ app.controller('AddingController', function ($scope, $location, $http, bridgeSer
 		$scope.vera = {base: "http://", port: "3480", id: ""};
 	bridgeService.viewVeraDevices();
 	bridgeService.viewVeraScenes();
-	bridgeService.viewHarmonyActivities();
-	bridgeService.viewHarmonyDevices();
-	bridgeService.viewNestItems();
 	$scope.imgButtonsUrl = "glyphicon glyphicon-plus";
 	$scope.buttonsVisible = false;
 
-	$scope.predicate = '';
-	$scope.reverse = true;
-	$scope.order = function(predicate) {
-		$scope.reverse = ($scope.predicate === predicate) ? !$scope.reverse : false;
-		$scope.predicate = predicate;
-	};
-
 	$scope.clearDevice = function () {
-		$scope.device.id = "";
-		$scope.device.mapType = null;
-		$scope.device.mapId = null;
-		$scope.device.name = "";
-		$scope.device.onUrl = "";
-		$scope.device.deviceType = "custom";
-		$scope.device.targetDevice = null;
-		$scope.device.offUrl = "";
-		$scope.device.httpVerb = null;
-		$scope.device.contentType = null;
-		$scope.device.contentBody = null;
-		$scope.device.contentBodyOff = null;
-		$scope.bridge.olddevicename = "";
-	};
-
-	$scope.buildUrlsUsingDevice = function (dim_control) {
-		if ($scope.vera.base.indexOf("http") < 0) {
-			$scope.vera.base = "http://" + $scope.vera.base;
-		}
-		$scope.device.deviceType = "switch";
-		$scope.device.targetDevice = "Encapsulated";
-		$scope.device.mapType = "veraDevice";
-		$scope.device.mapId = $scope.vera.id;
-		if(dim_control.indexOf("byte") >= 0 || dim_control.indexOf("percent") >= 0 || dim_control.indexOf("math") >= 0)
-			$scope.device.onUrl = $scope.vera.base + ":" + $scope.vera.port
-			+ "/data_request?id=action&output_format=json&DeviceNum="
-			+ $scope.vera.id
-			+ "&serviceId=urn:upnp-org:serviceId:Dimming1&action=SetLoadLevelTarget&newLoadlevelTarget="
-			+ dim_control;
-		else
-			$scope.device.onUrl = $scope.vera.base + ":" + $scope.vera.port
-			+ "/data_request?id=action&output_format=json&serviceId=urn:upnp-org:serviceId:SwitchPower1&action=SetTarget&newTargetValue=1&DeviceNum="
-			+ $scope.vera.id;
-		$scope.device.offUrl = $scope.vera.base + ":" + $scope.vera.port
-		+ "/data_request?id=action&output_format=json&serviceId=urn:upnp-org:serviceId:SwitchPower1&action=SetTarget&newTargetValue=0&DeviceNum="
-		+ $scope.vera.id;
-	};
-
-	$scope.buildUrlsUsingScene = function () {
-		if ($scope.vera.base.indexOf("http") < 0) {
-			$scope.vera.base = "http://" + $scope.vera.base;
-		}
-		$scope.device.deviceType = "scene";
-		$scope.device.targetDevice = "Encapsulated";
-		$scope.device.mapType = "veraScene";
-		$scope.device.mapId = $scope.vera.id;
-		$scope.device.onUrl = $scope.vera.base + ":" + $scope.vera.port
-		+ "/data_request?id=action&output_format=json&serviceId=urn:micasaverde-com:serviceId:HomeAutomationGateway1&action=RunScene&SceneNum="
-		+ $scope.vera.id;
-		$scope.device.offUrl = $scope.vera.base + ":" + $scope.vera.port
-		+ "/data_request?id=action&output_format=json&serviceId=urn:micasaverde-com:serviceId:HomeAutomationGateway1&action=RunScene&SceneNum="
-		+ $scope.vera.id;
+		bridgeService.clearDevice();
 	};
 
 	$scope.buildDeviceUrls = function (veradevice, dim_control) {
@@ -800,6 +820,95 @@ app.controller('AddingController', function ($scope, $location, $http, bridgeSer
 		+ verascene.id;
 	};
 
+	$scope.addDevice = function () {
+		if($scope.device.name == "" && $scope.device.onUrl == "")
+			return;
+		bridgeService.addDevice($scope.device).then(
+				function () {
+					$scope.clearDevice();
+					bridgeService.viewDevices();
+					bridgeService.viewVeraDevices();
+					bridgeService.viewVeraScenes();
+				},
+				function (error) {
+				}
+		);
+
+	};
+
+	$scope.bulkAddDevices = function(dim_control) {
+		var devicesList = [];
+		for(var i = 0; i < $scope.bulk.devices.length; i++) {
+			for(var x = 0; x < bridgeService.state.veradevices.length; x++) {
+				if(bridgeService.state.veradevices[x].id == $scope.bulk.devices[i]) {
+					$scope.buildDeviceUrls(bridgeService.state.veradevices[x],dim_control);
+					devicesList[i] = {
+							name: $scope.device.name,
+							mapId: $scope.device.mapId,
+							mapType: $scope.device.mapType,
+							deviceType: $scope.device.deviceType,
+							targetDevice: $scope.device.targetDevice,
+							onUrl: $scope.device.onUrl,
+							offUrl: $scope.device.offUrl,
+							httpVerb: $scope.device.httpVerb,
+							contentType: $scope.device.contentType,
+							contentBody: $scope.device.contentBody,
+							contentBodyOff: $scope.device.contentBodyOff
+					};
+				}
+			}
+		}
+		bridgeService.bulkAddDevice(devicesList);
+		$scope.clearDevice();
+		bridgeService.viewDevices();
+		bridgeService.viewVeraDevices();
+		bridgeService.viewVeraScenes();
+		$scope.bulk = { devices: [] };
+	};
+
+	$scope.toggleSelection = function toggleSelection(deviceId) {
+		var idx = $scope.bulk.devices.indexOf(deviceId);
+
+		// is currently selected
+		if (idx > -1) {
+			$scope.bulk.devices.splice(idx, 1);
+		}
+
+		// is newly selected
+		else {
+			$scope.bulk.devices.push(deviceId);
+		}
+	};
+
+	$scope.toggleButtons = function () {
+		$scope.buttonsVisible = !$scope.buttonsVisible;
+		if($scope.buttonsVisible)
+			$scope.imgButtonsUrl = "glyphicon glyphicon-minus";
+		else
+			$scope.imgButtonsUrl = "glyphicon glyphicon-plus";
+	};
+
+	$scope.deleteDeviceByMapId = function (id, mapType) {
+		bridgeService.deleteDeviceByMapId(id, mapType);
+		bridgeService.viewDevices();
+		bridgeService.viewVeraDevices();
+		bridgeService.viewVeraScenes();
+	};
+
+});
+
+app.controller('HarmonyController', function ($scope, $location, $http, bridgeService) {
+	$scope.bridge = bridgeService.state;
+	$scope.device = $scope.bridge.device;
+	bridgeService.viewHarmonyActivities();
+	bridgeService.viewHarmonyDevices();
+	$scope.imgButtonsUrl = "glyphicon glyphicon-plus";
+	$scope.buttonsVisible = false;
+
+	$scope.clearDevice = function () {
+		bridgeService.clearDevice();
+	};
+
 	$scope.buildActivityUrls = function (harmonyactivity) {
 		$scope.device.deviceType = "activity";
 		$scope.device.targetDevice = harmonyactivity.hub;
@@ -830,6 +939,50 @@ app.controller('AddingController', function ($scope, $location, $http, bridgeSer
 		}
 	};
 
+	$scope.addDevice = function () {
+		if($scope.device.name == "" && $scope.device.onUrl == "")
+			return;
+		bridgeService.addDevice($scope.device).then(
+				function () {
+					$scope.clearDevice();
+					bridgeService.viewDevices();
+					bridgeService.viewHarmonyActivities();
+					bridgeService.viewHarmonyDevices();
+				},
+				function (error) {
+				}
+		);
+
+	};
+
+	$scope.toggleButtons = function () {
+		$scope.buttonsVisible = !$scope.buttonsVisible;
+		if($scope.buttonsVisible)
+			$scope.imgButtonsUrl = "glyphicon glyphicon-minus";
+		else
+			$scope.imgButtonsUrl = "glyphicon glyphicon-plus";
+	};
+
+	$scope.deleteDeviceByMapId = function (id, mapType) {
+		bridgeService.deleteDeviceByMapId(id, mapType);
+		bridgeService.viewDevices();
+		bridgeService.viewHarmonyActivities();
+		bridgeService.viewHarmonyDevices();
+	};
+
+});
+
+app.controller('NestController', function ($scope, $location, $http, bridgeService) {
+	$scope.bridge = bridgeService.state;
+	$scope.device = $scope.bridge.device;
+	bridgeService.viewNestItems();
+	$scope.imgButtonsUrl = "glyphicon glyphicon-plus";
+	$scope.buttonsVisible = false;
+
+	$scope.clearDevice = function () {
+		bridgeService.clearDevice();
+	};
+
 	$scope.buildNestHomeUrls = function (nestitem) {
 		$scope.device.deviceType = "home";
 		$scope.device.name = nestitem.name;
@@ -900,8 +1053,91 @@ app.controller('AddingController', function ($scope, $location, $http, bridgeSer
 		$scope.device.offUrl = "{\"name\":\"" + nestitem.id + "\",\"control\":\"fan-auto\"}";
 	};
 
-	$scope.testUrl = function (device, type) {
-		bridgeService.testUrl(device, type);
+	$scope.addDevice = function () {
+		if($scope.device.name == "" && $scope.device.onUrl == "")
+			return;
+		bridgeService.addDevice($scope.device).then(
+				function () {
+					$scope.clearDevice();
+					bridgeService.viewDevices();
+					bridgeService.viewNestItems();
+				},
+				function (error) {
+				}
+		);
+
+	};
+
+	$scope.toggleButtons = function () {
+		$scope.buttonsVisible = !$scope.buttonsVisible;
+		if($scope.buttonsVisible)
+			$scope.imgButtonsUrl = "glyphicon glyphicon-minus";
+		else
+			$scope.imgButtonsUrl = "glyphicon glyphicon-plus";
+	};
+
+	$scope.deleteDeviceByMapId = function (id, mapType) {
+		bridgeService.deleteDeviceByMapId(id, mapType);
+		bridgeService.viewDevices();
+		bridgeService.viewNestItems();
+	};
+
+});
+
+app.controller('EditController', function ($scope, $location, $http, bridgeService) {
+	$scope.bridge = bridgeService.state;
+	$scope.device = $scope.bridge.device;
+	$scope.device_dim_control = "";
+	$scope.bulk = { devices: [] };
+	var veraList = angular.fromJson($scope.bridge.settings.veraaddress);
+	if(veraList != null)
+		$scope.vera = {base: "http://" + veraList.devices[0].ip, port: "3480", id: ""};
+	else
+		$scope.vera = {base: "http://", port: "3480", id: ""};
+	$scope.imgButtonsUrl = "glyphicon glyphicon-plus";
+	$scope.buttonsVisible = false;
+
+	$scope.clearDevice = function () {
+		bridgeService.clearDevice();
+	};
+
+	$scope.buildUrlsUsingDevice = function (dim_control) {
+		if ($scope.vera.base.indexOf("http") < 0) {
+			$scope.vera.base = "http://" + $scope.vera.base;
+		}
+		$scope.device.deviceType = "switch";
+		$scope.device.targetDevice = "Encapsulated";
+		$scope.device.mapType = "veraDevice";
+		$scope.device.mapId = $scope.vera.id;
+		if(dim_control.indexOf("byte") >= 0 || dim_control.indexOf("percent") >= 0 || dim_control.indexOf("math") >= 0)
+			$scope.device.onUrl = $scope.vera.base + ":" + $scope.vera.port
+			+ "/data_request?id=action&output_format=json&DeviceNum="
+			+ $scope.vera.id
+			+ "&serviceId=urn:upnp-org:serviceId:Dimming1&action=SetLoadLevelTarget&newLoadlevelTarget="
+			+ dim_control;
+		else
+			$scope.device.onUrl = $scope.vera.base + ":" + $scope.vera.port
+			+ "/data_request?id=action&output_format=json&serviceId=urn:upnp-org:serviceId:SwitchPower1&action=SetTarget&newTargetValue=1&DeviceNum="
+			+ $scope.vera.id;
+		$scope.device.offUrl = $scope.vera.base + ":" + $scope.vera.port
+		+ "/data_request?id=action&output_format=json&serviceId=urn:upnp-org:serviceId:SwitchPower1&action=SetTarget&newTargetValue=0&DeviceNum="
+		+ $scope.vera.id;
+	};
+
+	$scope.buildUrlsUsingScene = function () {
+		if ($scope.vera.base.indexOf("http") < 0) {
+			$scope.vera.base = "http://" + $scope.vera.base;
+		}
+		$scope.device.deviceType = "scene";
+		$scope.device.targetDevice = "Encapsulated";
+		$scope.device.mapType = "veraScene";
+		$scope.device.mapId = $scope.vera.id;
+		$scope.device.onUrl = $scope.vera.base + ":" + $scope.vera.port
+		+ "/data_request?id=action&output_format=json&serviceId=urn:micasaverde-com:serviceId:HomeAutomationGateway1&action=RunScene&SceneNum="
+		+ $scope.vera.id;
+		$scope.device.offUrl = $scope.vera.base + ":" + $scope.vera.port
+		+ "/data_request?id=action&output_format=json&serviceId=urn:micasaverde-com:serviceId:HomeAutomationGateway1&action=RunScene&SceneNum="
+		+ $scope.vera.id;
 	};
 
 	$scope.addDevice = function () {
@@ -938,59 +1174,6 @@ app.controller('AddingController', function ($scope, $location, $http, bridgeSer
 
 	};
 
-	$scope.bulkAddDevices = function(dim_control) {
-		var devicesList = [];
-		for(var i = 0; i < $scope.bulk.devices.length; i++) {
-			for(var x = 0; x < bridgeService.state.veradevices.length; x++) {
-				if(bridgeService.state.veradevices[x].id == $scope.bulk.devices[i]) {
-					$scope.buildDeviceUrls(bridgeService.state.veradevices[x],dim_control);
-					devicesList[i] = {
-							name: $scope.device.name,
-							mapId: $scope.device.mapId,
-							mapType: $scope.device.mapType,
-							deviceType: $scope.device.deviceType,
-							targetDevice: $scope.device.targetDevice,
-							onUrl: $scope.device.onUrl,
-							offUrl: $scope.device.offUrl,
-							httpVerb: $scope.device.httpVerb,
-							contentType: $scope.device.contentType,
-							contentBody: $scope.device.contentBody,
-							contentBodyOff: $scope.device.contentBodyOff
-					};
-				}
-			}
-		}
-		bridgeService.bulkAddDevice(devicesList);
-		$scope.clearDevice();
-		$scope.bulk = { devices: [] };
-	};
-
-	$scope.toggleSelection = function toggleSelection(deviceId) {
-		var idx = $scope.bulk.devices.indexOf(deviceId);
-
-		// is currently selected
-		if (idx > -1) {
-			$scope.bulk.devices.splice(idx, 1);
-		}
-
-		// is newly selected
-		else {
-			$scope.bulk.devices.push(deviceId);
-		}
-	};
-
-	$scope.toggleButtons = function () {
-		$scope.buttonsVisible = !$scope.buttonsVisible;
-		if($scope.buttonsVisible)
-			$scope.imgButtonsUrl = "glyphicon glyphicon-minus";
-		else
-			$scope.imgButtonsUrl = "glyphicon glyphicon-plus";
-	};
-
-	$scope.deleteDeviceByMapId = function (id, mapType) {
-		bridgeService.deleteDeviceByMapId(id, mapType);
-	};
-
 });
 
 app.filter('availableHarmonyActivityId', function(bridgeService) {

src/main/resources/public/views/configuration.html

@@ -1,6 +1,7 @@
       <ul class="nav nav-pills" role="tablist">
         <li role="presentation" class="active"><a href="#">Bridge Devices</a></li>
         <li role="presentation"><a href="#/system">Bridge Control</a></li>
+        <li role="presentation"><a href="#/logs">Logs</a></li>
         <li ng-if="bridge.showVera" role="presentation"><a href="#/veradevices">Vera Devices</a></li>
         <li ng-if="bridge.showVera" role="presentation"><a href="#/verascenes">Vera Scenes</a></li>
         <li ng-if="bridge.showHarmony" role="presentation"><a href="#/harmonyactivities">Harmony Activities</a></li>
@@ -13,26 +14,19 @@
 		<div class="panel-heading">
 			<h2 class="panel-title">Current devices ({{bridge.devices.length}}) </h2>
 		</div>
+        <scrollable-table watch="bridge.devices">
 		<table class="table table-bordered table-striped table-hover">
 			<thead>
 				<tr>
 					<th>Row</th>
-					<th>
-						<a href="" ng-click="order('id')">ID</a>
-        				<span class="sortorder" ng-show="predicate === 'id'" ng-class="{reverse:reverse}"></span></th>
-					<th>
-						<a href="" ng-click="order('name')">Name</a>
-        				<span class="sortorder" ng-show="predicate === 'name'" ng-class="{reverse:reverse}"></span></th>
-					<th>
-						<a href="" ng-click="order('deviceType')">Type</a>
-        				<span class="sortorder" ng-show="predicate === 'deviceType'" ng-class="{reverse:reverse}"></span></th>
-					<th>
-						<a href="" ng-click="order('targetDevice')">Target</a>
-        				<span class="sortorder" ng-show="predicate === 'targetDevice'" ng-class="{reverse:reverse}"></span></th>
+					<th sortable-header col="id">ID</th>
+					<th sortable-header col="name">Name</th>
+					<th sortable-header col="deviceType">Type</th>
+					<th sortable-header col="targetDevice">Target</th>
 					<th>Actions</th>
 				</tr>
 			</thead>
-			<tr ng-repeat="device in bridge.devices | orderBy:predicate:reverse">
+			<tr ng-repeat="device in bridge.devices">
 				<td>{{$index+1}}</td>
 				<td>{{device.id}}</td>
 				<td>{{device.name}}</td>
@@ -52,6 +46,7 @@
 				</td>
 			</tr>
 		</table>
+        </scrollable-table>
 	</div>
 	<div class="panel panel-default backup">
 		<div class="panel-heading">

src/main/resources/public/views/editdevice.html

@@ -1,6 +1,7 @@
       <ul class="nav nav-pills" role="tablist">
         <li role="presentation"><a href="#">Bridge Devices</a></li>
         <li role="presentation"><a href="#/system">Bridge Control</a></li>
+        <li role="presentation"><a href="#/logs">Logs</a></li>
         <li ng-if="bridge.showVera" role="presentation"><a href="#/veradevices">Vera Devices</a></li>
         <li ng-if="bridge.showVera" role="presentation"><a href="#/verascenes">Vera Scenes</a></li>
         <li ng-if="bridge.showHarmony" role="presentation"><a href="#/harmonyactivities">Harmony Activities</a></li>

src/main/resources/public/views/editor.html

@@ -1,6 +1,7 @@
       <ul class="nav nav-pills" role="tablist">
         <li role="presentation"><a href="#">Bridge Devices</a></li>
         <li role="presentation"><a href="#/system">Bridge Control</a></li>
+        <li role="presentation"><a href="#/logs">Logs</a></li>
         <li ng-if="bridge.showVera" role="presentation"><a href="#/veradevices">Vera Devices</a></li>
         <li ng-if="bridge.showVera" role="presentation"><a href="#/verascenes">Vera Scenes</a></li>
         <li ng-if="bridge.showHarmony" role="presentation"><a href="#/harmonyactivities">Harmony Activities</a></li>

src/main/resources/public/views/harmonyactivity.html

@@ -1,6 +1,7 @@
       <ul class="nav nav-pills" role="tablist">
         <li role="presentation"><a href="#">Bridge Devices</a></li>
         <li role="presentation"><a href="#/system">Bridge Control</a></li>
+        <li role="presentation"><a href="#/logs">Logs</a></li>
         <li ng-if="bridge.showVera" role="presentation"><a href="#/veradevices">Vera Devices</a></li>
         <li ng-if="bridge.showVera" role="presentation"><a href="#/verascenes">Vera Scenes</a></li>
         <li role="presentation" class="active"><a href="#/harmonyactivities">Harmony Activities</a></li>
@@ -19,26 +20,18 @@
 			Then you can modify the name to anything you want that will be the keyword for Alexa. Click the 'Add Bridge Device' to finish that selection setup.
 			The 'Already Configured Activities' list below will show what is already setup for your Harmony Hubs.</p>
 
+        	<scrollable-table watch="bridge.harmonyactivities">
 			<table class="table table-bordered table-striped table-hover">
 				<thead>
 					<tr>
 						<th>Row</th>
-						<th>
-							<a href="" ng-click="order('label')">Name</a>
-        					<span class="sortorder" ng-show="predicate === 'name'" ng-class="{reverse:reverse}"></span>
-        				</th>
-						<th>
-							<a href="" ng-click="order('id')">Id</a>
-        					<span class="sortorder" ng-show="predicate === 'id'" ng-class="{reverse:reverse}"></span>
-        				</th>
-						<th>
-							<a href="" ng-click="order('hub')">Hub</a>
-        					<span class="sortorder" ng-show="predicate === 'hub'" ng-class="{reverse:reverse}"></span>
-        				</th>
+						<th sortable-header col="name">Name</th>
+						<th sortable-header col="id">Id</th>
+						<th sortable-header col="hub">Hub</th>
 						<th>Actions</th>
 					</tr>
 				</thead>
-				<tr ng-repeat="harmonyactivity in bridge.harmonyactivities | availableHarmonyActivityId | orderBy:predicate:reverse">
+				<tr ng-repeat="harmonyactivity in bridge.harmonyactivities | availableHarmonyActivityId">
 					<td>{{$index+1}}</td>
 					<td>{{harmonyactivity.activity.label}}</td>
 					<td>{{harmonyactivity.activity.id}}</td>
@@ -50,6 +43,7 @@
 					</td>
 				</tr>
 			</table>
+        	</scrollable-table>
 		</li>
 	</ul>
 	<div class="panel-heading">
@@ -57,26 +51,18 @@
 	</div>
 	<ul ng-if="buttonsVisible" class="list-group">
 		<li class="list-group-item">
+        	<scrollable-table watch="bridge.harmonyactivities">
 			<table class="table table-bordered table-striped table-hover">
 				<thead>
 					<tr>
 						<th>Row</th>
-						<th>
-							<a href="" ng-click="order('label')">Name</a>
-        					<span class="sortorder" ng-show="predicate === 'name'" ng-class="{reverse:reverse}"></span>
-        				</th>
-						<th>
-							<a href="" ng-click="order('id')">Id</a>
-        					<span class="sortorder" ng-show="predicate === 'id'" ng-class="{reverse:reverse}"></span>
-        				</th>
-						<th>
-							<a href="" ng-click="order('hub')">Hub</a>
-        					<span class="sortorder" ng-show="predicate === 'hub'" ng-class="{reverse:reverse}"></span>
-        				</th>
+						<th sortable-header col="name">Name</th>
+						<th sortable-header col="id">Id</th>
+						<th sortable-header col="hub">Hub</th>
 						<th>Actions</th>
 					</tr>
 				</thead>
-				<tr ng-repeat="harmonyactivity in bridge.harmonyactivities | unavailableHarmonyActivityId | orderBy:predicate:reverse">
+				<tr ng-repeat="harmonyactivity in bridge.harmonyactivities | unavailableHarmonyActivityId">
 					<td>{{$index+1}}</td>
 					<td>{{harmonyactivity.activity.label}}</td>
 					<td>{{harmonyactivity.activity.id}}</td>
@@ -85,6 +71,7 @@
 						ng-click="deleteDeviceByMapId(harmonyactivity.activity.id, 'harmonyActivity')">Delete</button></td>
 				</tr>
 			</table>
+        	</scrollable-table>
 		</li>
 	</ul>
 </div>

src/main/resources/public/views/harmonydevice.html

@@ -1,6 +1,7 @@
       <ul class="nav nav-pills" role="tablist">
         <li role="presentation"><a href="#">Bridge Devices</a></li>
         <li role="presentation"><a href="#/system">Bridge Control</a></li>
+        <li role="presentation"><a href="#/logs">Logs</a></li>
         <li ng-if="bridge.showVera" role="presentation"><a href="#/veradevices">Vera Devices</a></li>
         <li ng-if="bridge.showVera" role="presentation"><a href="#/verascenes">Vera Scenes</a></li>
         <li role="presentation"><a href="#/harmonyactivities">Harmony Activities</a></li>
@@ -20,28 +21,20 @@
 			Then you can modify the name to anything you want that will be the keyword for Alexa. Click the 'Add Bridge Device' to finish that selection setup.
 			The 'Already Configured Harmony Buttons' list below will show what is already setup for your Harmony Hubs.</p>
 
+        	<scrollable-table watch="bridge.harmonydevices">
 			<table class="table table-bordered table-striped table-hover">
 				<thead>
 					<tr>
 						<th>Row</th>
-						<th>
-							<a href="" ng-click="order('label')">Name</a>
-        					<span class="sortorder" ng-show="predicate === 'name'" ng-class="{reverse:reverse}"></span>
-        				</th>
-						<th>
-							<a href="" ng-click="order('id')">Id</a>
-        					<span class="sortorder" ng-show="predicate === 'id'" ng-class="{reverse:reverse}"></span>
-        				</th>
-						<th>
-							<a href="" ng-click="order('hub')">Hub</a>
-        					<span class="sortorder" ng-show="predicate === 'hub'" ng-class="{reverse:reverse}"></span>
-        				</th>
+						<th sortable-header col="name">Name</th>
+						<th sortable-header col="id">Id</th>
+						<th sortable-header col="hub">Hub</th>
 						<th>On Button</th>
 						<th>Off Button</th>
 						<th>Actions</th>
 					</tr>
 				</thead>
-				<tr ng-repeat="harmonydevice in bridge.harmonydevices | orderBy:predicate:reverse">
+				<tr ng-repeat="harmonydevice in bridge.harmonydevices">
 					<td>{{$index+1}}</td>
 					<td>{{harmonydevice.device.label}}</td>
 					<td>{{harmonydevice.device.id}}</td>
@@ -66,6 +59,7 @@
 					</td>
 				</tr>
 			</table>
+        	</scrollable-table>
 		</li>
 	</ul>
 	<div class="panel-heading">
@@ -73,26 +67,15 @@
 	</div>
 	<ul ng-if="buttonsVisible" class="list-group">
 		<li class="list-group-item">
+        	<scrollable-table watch="bridge.harmonydevices">
 			<table class="table table-bordered table-striped table-hover">
 				<thead>
 					<tr>
 						<th>Row</th>
-						<th>
-							<a href="" ng-click="order('name')">Name</a>
-        					<span class="sortorder" ng-show="predicate === 'name'" ng-class="{reverse:reverse}"></span>
-        				</th>
-						<th>
-							<a href="" ng-click="order('id')">Device Id</a>
-        					<span class="sortorder" ng-show="predicate === 'id'" ng-class="{reverse:reverse}"></span>
-        				</th>
-						<th>
-							<a href="" ng-click="order('targetDevice')">Hub</a>
-        					<span class="sortorder" ng-show="predicate === 'targetDevice'" ng-class="{reverse:reverse}"></span>
-        				</th>
-						<th>
-							<a href="" ng-click="order('mapId')">Harmony Device-Button On-Button Off</a>
-        					<span class="sortorder" ng-show="predicate === 'id'" ng-class="{reverse:reverse}"></span>
-        				</th>
+						<th sortable-header col="name">Name</th>
+						<th sortable-header col="id">Device Id</th>
+						<th sortable-header col="targetDevice">Hub</th>
+						<th>Harmony Device-Button On-Button Off</th>
 						<th>Actions</th>
 					</tr>
 				</thead>
@@ -108,6 +91,7 @@
 					</td>
 				</tr>
 			</table>
+        	</scrollable-table>
 		</li>
 	</ul>
 </div>

src/main/resources/public/views/logs.html

@@ -0,0 +1,75 @@
+      <ul class="nav nav-pills" role="tablist">
+        <li role="presentation"><a href="#">Bridge Devices</a></li>
+        <li role="presentation"><a href="#/system">Bridge Control</a></li>
+        <li role="presentation" class="active"><a href="#/logs">Logs</a></li>
+        <li ng-if="bridge.showVera" role="presentation"><a href="#/veradevices">Vera Devices</a></li>
+        <li ng-if="bridge.showVera" role="presentation"><a href="#/verascenes">Vera Scenes</a></li>
+        <li ng-if="bridge.showHarmony" role="presentation"><a href="#/harmonyactivities">Harmony Activities</a></li>
+        <li ng-if="bridge.showHarmony" role="presentation"><a href="#/harmonydevices">Harmony Devices</a></li>
+        <li ng-if="bridge.showNest" role="presentation"><a href="#/nest">Nest</a></li>
+        <li role="presentation"><a href="#/editor">Manual Add</a></li>
+      </ul>
+
+	<div class="panel panel-default bridgeServer">
+		<div class="panel-heading">
+			<h1 class="panel-title">Log Messages</h1>
+		</div>
+		<div class="panel-body">
+			<p>
+				<button class="btn btn-primary" type="submit"
+					ng-click="updateLogs()">Update Log</button>
+			</p>
+        	<scrollable-table watch="bridge.logMsgs">
+			<table class="table table-striped table-bordered table-hover">
+				<thead>
+					<tr>
+						<th sortable-header col="time">Time</th>
+						<th sortable-header col="level">Level</th>
+						<th sortable-header col="message">Message</th>
+						<th sortable-header col="component">Component</th>
+					</tr>
+				</thead>
+				<tr ng-repeat="logMessage in bridge.logMsgs">
+					<td>{{logMessage.time}}</td>
+					<td>{{logMessage.level}}</td>
+					<td>{{logMessage.message}}</td>
+					<td>{{logMessage.component}}</td>
+				</tr>
+			</table>
+        	</scrollable-table>
+		</div>
+	</div>
+	<div class="panel panel-default logconfig">
+		<div class="panel-heading">
+			<h1 class="panel-title">Logging Configuration <a ng-click="toggle()"><span class={{imgUrl}} aria-hidden="true"></a></h1>
+		</div>
+		<div ng-if="visible" class="animate-if" class="panel-body">
+			<p>
+				<button class="btn btn-primary" type="submit"
+					ng-click="updateLoggers()">Update Log Levels</button>
+				  Show All Loggers <input type="checkbox" ng-model="bridge.logShowAll"
+           				ng-change="reloadLoggers()" ng-true-value=true ng-false-value=false>  {{bridge.logShowAll}}
+			</p>
+        	<scrollable-table watch="bridge.loggerInfo">
+			<table class="table table-bordered table-striped table-hover">
+				<thead>
+					<tr>
+						<th sortable-header col="logLevel">Log Level</th>
+						<th sortable-header col="loggerName">Component</th>
+						<th>New Log Level</th>
+					</tr>
+				</thead>
+				<tr ng-repeat="logInfo in bridge.loggerInfo">
+					<td>{{logInfo.logLevel.substr(0,logInfo.logLevel.indexOf("_"))}}</td>
+					<td>{{logInfo.loggerName}}</td>
+					<td>
+						<select name="new-log-level" id="new-log-level" ng-change="addToUpdate(logInfo)" ng-model="logInfo.newLogLevel">
+							<option ng-repeat="alevel in levels" value="{{alevel}}">{{alevel.substr(0,alevel.indexOf("_"))}}</option>
+						</select>
+					</td>
+				</tr>
+			</table>
+        	</scrollable-table>
+		</div>
+	</div>
+	

src/main/resources/public/views/nestactions.html

@@ -1,6 +1,7 @@
       <ul class="nav nav-pills" role="tablist">
         <li role="presentation"><a href="#">Bridge Devices</a></li>
         <li role="presentation"><a href="#/system">Bridge Control</a></li>
+        <li role="presentation"><a href="#/logs">Logs</a></li>
         <li ng-if="bridge.showVera" role="presentation"><a href="#/veradevices">Vera Devices</a></li>
         <li ng-if="bridge.showVera" role="presentation"><a href="#/verascenes">Vera Scenes</a></li>
         <li ng-if="bridge.showHarmony"  role="presentation"><a href="#/harmonyactivities">Harmony Activities</a></li>
@@ -19,22 +20,14 @@
 			Then you can modify the name to anything you want that will be the keyword for Alexa. Click the 'Add Bridge Device' to finish that selection setup.
 			The 'Already Configured Nest Items' list below will show what is already setup for your Nest.</p>
 
+        	<scrollable-table watch="bridge.nestitems">
 			<table class="table table-bordered table-striped table-hover">
 				<thead>
 					<tr>
 						<th>Row</th>
-						<th>
-							<a href="" ng-click="order('name')">Name</a>
-        					<span class="sortorder" ng-show="predicate === 'name'" ng-class="{reverse:reverse}"></span>
-        				</th>
-						<th>
-							<a href="" ng-click="order('type')">Type</a>
-        					<span class="sortorder" ng-show="predicate === 'type'" ng-class="{reverse:reverse}"></span>
-        				</th>
-						<th>
-							<a href="" ng-click="order('location')">Location</a>
-        					<span class="sortorder" ng-show="predicate === 'location'" ng-class="{reverse:reverse}"></span>
-        				</th>
+						<th sortable-header col="name">Name</th>
+						<th sortable-header col="type">Type</th>
+						<th sortable-header col="location">Location</th>
 						<th>Actions</th>
 					</tr>
 				</thead>
@@ -71,6 +64,7 @@
 					</td>
 				</tr>
 			</table>
+        	</scrollable-table>
 		</li>
 	</ul>
 	<div class="panel-heading">
@@ -78,22 +72,14 @@
 	</div>
 	<ul ng-if="buttonsVisible" class="list-group">
 		<li class="list-group-item">
+        	<scrollable-table watch="bridge.nestitems">
 			<table class="table table-bordered table-striped table-hover">
 				<thead>
 					<tr>
 						<th>Row</th>
-						<th>
-							<a href="" ng-click="order('name')">Name</a>
-        					<span class="sortorder" ng-show="predicate === 'name'" ng-class="{reverse:reverse}"></span>
-        				</th>
-						<th>
-							<a href="" ng-click="order('id')">Id</a>
-        					<span class="sortorder" ng-show="predicate === 'id'" ng-class="{reverse:reverse}"></span>
-        				</th>
-						<th>
-							<a href="" ng-click="order('mapId')">mapId</a>
-        					<span class="sortorder" ng-show="predicate === 'mapId'" ng-class="{reverse:reverse}"></span>
-        				</th>
+						<th sortable-header col="name">Name</th>
+						<th sortable-header col="id">Device Id</th>
+						<th>mapId</th>
 						<th>Actions</th>
 					</tr>
 				</thead>
@@ -106,6 +92,7 @@
 						ng-click="deleteDeviceByMapId(device.mapId, 'nest')">Delete</button></td>
 				</tr>
 			</table>
+        	</scrollable-table>
 		</li>
 	</ul>
 </div>

src/main/resources/public/views/system.html

@@ -1,6 +1,7 @@
       <ul class="nav nav-pills" role="tablist">
         <li role="presentation"><a href="#">Bridge Devices</a></li>
         <li role="presentation" class="active"><a href="#/system">Bridge Control</a></li>
+        <li role="presentation"><a href="#/logs">Logs</a></li>
         <li ng-if="bridge.showVera" role="presentation"><a href="#/veradevices">Vera Devices</a></li>
         <li ng-if="bridge.showVera" role="presentation"><a href="#/verascenes">Vera Scenes</a></li>
         <li ng-if="bridge.showHarmony" role="presentation"><a href="#/harmonyactivities">Harmony Activities</a></li>
@@ -157,6 +158,11 @@
 					<td><input id="bridge-settings-nestpwd" class="form-control" type="password"
 							ng-model="bridge.settings.nestpwd" placeholder="thepassword"></td>
 				</tr>
+				<tr>
+					<td>Log Messages to Buffer</td>
+					<td><input id="bridge-settings-numberoflogmessages" class="form-control" type="number"
+							ng-model="bridge.settings.numberoflogmessages"  min="100" max="65535"></td>
+				</tr>
 				<tr>
 					<td>UPNP Strict Handling</td>
 					<td><input type="checkbox" ng-model="bridge.settings.upnpstrict"
@@ -173,9 +179,9 @@
 	</div>
 	<div class="panel panel-default backup">
 		<div class="panel-heading">
-			<h1 class="panel-title">Bridge Settings Backup <a ng-click="toggleBk()"><span class={{imgBkUrl}} aria-hidden="true"></a></h1>
+			<h1 class="panel-title">Bridge Settings Backup <a ng-click="toggle()"><span class={{imgUrl}} aria-hidden="true"></a></h1>
 		</div>
-		<div ng-if="visibleBk" class="animate-if" class="panel-body">
+		<div ng-if="visible" class="animate-if" class="panel-body">
 			<form class="form-horizontal">
 				<div class="form-group">
 					<label class="col-xs-12 col-sm-2 control-label" for="backup-name">Backup Settings File Name</label>

src/main/resources/public/views/veradevice.html

@@ -1,6 +1,7 @@
       <ul class="nav nav-pills" role="tablist">
         <li role="presentation"><a href="#">Bridge Devices</a></li>
         <li role="presentation"><a href="#/system">Bridge Control</a></li>
+        <li role="presentation"><a href="#/logs">Logs</a></li>
         <li role="presentation" class="active"><a href="#/veradevices">Vera Devices</a></li>
         <li role="presentation"><a href="#/verascenes">Vera Scenes</a></li>
         <li ng-if="bridge.showHarmony" role="presentation"><a href="#/harmonyactivities">Harmony Activities</a></li>
@@ -30,34 +31,20 @@
 			<p>Use the check boxes by the names to use the bulk addition feature. Select your items and dim control type if wanted, then click bulk add below.
 			Your items will be added with on and off or dim and off if selected with the name of the device from the Vera.
 			</p>
+        	<scrollable-table watch="bridge.veradevices">
 			<table class="table table-bordered table-striped table-hover">
 				<thead>
 					<tr>
 						<th>Row</th>
-						<th>
-							<a href="" ng-click="order('name')">Name</a>
-        					<span class="sortorder" ng-show="predicate === 'name'" ng-class="{reverse:reverse}"></span>
-        				</th>
-						<th>
-							<a href="" ng-click="order('id')">Id</a>
-        					<span class="sortorder" ng-show="predicate === 'id'" ng-class="{reverse:reverse}"></span>
-        				</th>
-						<th>
-							<a href="" ng-click="order('category')">Category</a>
-        					<span class="sortorder" ng-show="predicate === 'category'" ng-class="{reverse:reverse}"></span>
-        				</th>
-						<th>
-							<a href="" ng-click="order('room')">Room</a>
-        					<span class="sortorder" ng-show="predicate === 'room'" ng-class="{reverse:reverse}"></span>
-        				</th>
-						<th>
-							<a href="" ng-click="order('vera')">Vera</a>
-        					<span class="sortorder" ng-show="predicate === 'vera'" ng-class="{reverse:reverse}"></span>
-        				</th>
+						<th sortable-header col="name">Name</th>
+						<th sortable-header col="id">Id</th>
+						<th sortable-header col="category">Category</th>
+						<th sortable-header col="room">Room</th>
+						<th sortable-header col="veraname">Vera</th>
 						<th>Actions</th>
 					</tr>
 				</thead>
-				<tr ng-repeat="veradevice in bridge.veradevices | availableVeraDeviceId | orderBy:predicate:reverse">
+				<tr ng-repeat="veradevice in bridge.veradevices | availableVeraDeviceId">
 					<td>{{$index+1}}</td>
 					<td><input type="checkbox" name="bulk.devices[]" value="{{veradevice.id}}" ng-checked="bulk.devices.indexOf(veradevice.id) > -1" ng-click="toggleSelection(veradevice.id)"> {{veradevice.name}}</td>
 					<td>{{veradevice.id}}</td>
@@ -71,6 +58,7 @@
 					</td>
 				</tr>
 			</table>
+        	</scrollable-table>
 			<p>
 				<button class="btn btn-success" type="submit"
 					ng-click="bulkAddDevices(device_dim_control)">Bulk Add ({{bulk.devices.length}})</button>
@@ -82,34 +70,20 @@
 	</div>
 	<ul ng-if="buttonsVisible" class="list-group">
 		<li class="list-group-item">
+        	<scrollable-table watch="bridge.veradevices">
 			<table class="table table-bordered table-striped table-hover">
 				<thead>
 					<tr>
 						<th>Row</th>
-						<th>
-							<a href="" ng-click="order('name')">Name</a>
-        					<span class="sortorder" ng-show="predicate === 'name'" ng-class="{reverse:reverse}"></span>
-        				</th>
-						<th>
-							<a href="" ng-click="order('id')">Id</a>
-        					<span class="sortorder" ng-show="predicate === 'id'" ng-class="{reverse:reverse}"></span>
-        				</th>
-						<th>
-							<a href="" ng-click="order('category')">Category</a>
-        					<span class="sortorder" ng-show="predicate === 'category'" ng-class="{reverse:reverse}"></span>
-        				</th>
-						<th>
-							<a href="" ng-click="order('room')">Room</a>
-        					<span class="sortorder" ng-show="predicate === 'room'" ng-class="{reverse:reverse}"></span>
-        				</th>
-						<th>
-							<a href="" ng-click="order('vera')">Vera</a>
-        					<span class="sortorder" ng-show="predicate === 'vera'" ng-class="{reverse:reverse}"></span>
-        				</th>
+						<th sortable-header col="name">Name</th>
+						<th sortable-header col="id">Id</th>
+						<th sortable-header col="category">Category</th>
+						<th sortable-header col="room">Room</th>
+						<th sortable-header col="veraname">Vera</th>
 						<th>Actions</th>
 					</tr>
 				</thead>
-				<tr ng-repeat="veradevice in bridge.veradevices | unavailableVeraDeviceId | orderBy:predicate:reverse">
+				<tr ng-repeat="veradevice in bridge.veradevices | unavailableVeraDeviceId">
 					<td>{{$index+1}}</td>
 					<td>{{veradevice.name}}</td>
 					<td>{{veradevice.id}}</td>
@@ -122,6 +96,7 @@
 					</td>
 				</tr>
 			</table>
+        	</scrollable-table>
 		</li>
 	</ul>
 </div>

src/main/resources/public/views/verascene.html

@@ -1,6 +1,7 @@
       <ul class="nav nav-pills" role="tablist">
         <li role="presentation"><a href="#">Bridge Devices</a></li>
         <li role="presentation"><a href="#/system">Bridge Control</a></li>
+        <li role="presentation"><a href="#/logs">Logs</a></li>
         <li role="presentation"><a href="#/veradevices">Vera Devices</a></li>
         <li role="presentation" class="active"><a href="#/verascenes">Vera Scenes</a></li>
         <li ng-if="bridge.showHarmony" role="presentation"><a href="#/harmonyactivities">Harmony Activities</a></li>
@@ -19,30 +20,19 @@
 			Then you can modify the name to anything you want that will be the keyword for Alexa. Click the 'Add Bridge Device' to finish that selection setup.
 			The 'Already Configured Vera Scenes' list below will show what is already setup for your Vera.</p>
 
+        	<scrollable-table watch="bridge.verascenes">
 			<table class="table table-bordered table-striped table-hover">
 				<thead>
 					<tr>
 						<th>Row</th>
-						<th>
-							<a href="" ng-click="order('name')">Name</a>
-        					<span class="sortorder" ng-show="predicate === 'name'" ng-class="{reverse:reverse}"></span>
-        				</th>
-						<th>
-							<a href="" ng-click="order('id')">Id</a>
-        					<span class="sortorder" ng-show="predicate === 'id'" ng-class="{reverse:reverse}"></span>
-        				</th>
-						<th>
-							<a href="" ng-click="order('room')">Room</a>
-        					<span class="sortorder" ng-show="predicate === 'room'" ng-class="{reverse:reverse}"></span>
-        				</th>
-						<th>
-							<a href="" ng-click="order('vera')">Vera</a>
-        					<span class="sortorder" ng-show="predicate === 'vera'" ng-class="{reverse:reverse}"></span>
-        				</th>
+						<th sortable-header col="name">Name</th>
+						<th sortable-header col="id">Id</th>
+						<th sortable-header col="room">Room</th>
+						<th sortable-header col="veraname">Vera</th>
 						<th>Actions</th>
 					</tr>
 				</thead>
-				<tr ng-repeat="verascene in bridge.verascenes | availableVeraSceneId | orderBy:predicate:reverse">
+				<tr ng-repeat="verascene in bridge.verascenes | availableVeraSceneId">
 					<td>{{$index+1}}</td>
 					<td>{{verascene.name}}</td>
 					<td>{{verascene.id}}</td>
@@ -55,6 +45,7 @@
 					</td>
 				</tr>
 			</table>
+        	</scrollable-table>
 		</li>
 	</ul>
 	<div class="panel-heading">
@@ -62,30 +53,19 @@
 	</div>
 	<ul ng-if="buttonsVisible" class="list-group">
 		<li class="list-group-item">
+        	<scrollable-table watch="bridge.verascenes">
 			<table class="table table-bordered table-striped table-hover">
 				<thead>
 					<tr>
 						<th>Row</th>
-						<th>
-							<a href="" ng-click="order('name')">Name</a>
-        					<span class="sortorder" ng-show="predicate === 'name'" ng-class="{reverse:reverse}"></span>
-        				</th>
-						<th>
-							<a href="" ng-click="order('id')">Id</a>
-        					<span class="sortorder" ng-show="predicate === 'id'" ng-class="{reverse:reverse}"></span>
-        				</th>
-						<th>
-							<a href="" ng-click="order('room')">Room</a>
-        					<span class="sortorder" ng-show="predicate === 'room'" ng-class="{reverse:reverse}"></span>
-        				</th>
-						<th>
-							<a href="" ng-click="order('vera')">Vera</a>
-        					<span class="sortorder" ng-show="predicate === 'vera'" ng-class="{reverse:reverse}"></span>
-        				</th>
+						<th sortable-header col="name">Name</th>
+						<th sortable-header col="id">Id</th>
+						<th sortable-header col="room">Room</th>
+						<th sortable-header col="veraname">Vera</th>
 						<th>Actions</th>
 					</tr>
 				</thead>
-				<tr ng-repeat="verascene in bridge.verascenes | unavailableVeraSceneId | orderBy:predicate:reverse">
+				<tr ng-repeat="verascene in bridge.verascenes | unavailableVeraSceneId">
 					<td>{{$index+1}}</td>
 					<td>{{verascene.name}}</td>
 					<td>{{verascene.id}}</td>
@@ -97,6 +77,7 @@
 					</td>
 				</tr>
 			</table>
+        	</scrollable-table>
 		</li>
 	</ul>
 </div>