Added support for messages from the server with ohSnap

css/ohsnap.css

@@ -3,10 +3,9 @@
 
 .alert {
     padding: 15px;
-    margin-bottom: 20px;
+    margin-bottom: 10px;
     border: 1px solid #eed3d7;
     border-radius: 4px;
-    position: absolute;
     bottom: 0px;
     right: 21px;
     /* Each alert has its own width */

css/style.css

@@ -13,6 +13,12 @@ body {
     font-size: 12px;
 }
 
+#ohsnap
+{
+	position: absolute;
+    bottom: 0;
+    right: 0;
+}
 #top-bar button.script-status{
 	margin:10px;
 }

js/control-panel.js

@@ -418,7 +418,7 @@ function showProfileEditDialog(editableName, dialogTitle, isSaveAs) {
             url: "save_beer_profile.php",
             dataType: "json",
             data: { name: profName, profile: profData },
-            success: function(response) {
+            success: ajaxSuccessHandler( function(response) {
                 if ( response.status !== 'error' ) {
                     loadProfile(profName, renderProfile);
                     $('#profileSaveError').hide();
@@ -431,7 +431,7 @@ function showProfileEditDialog(editableName, dialogTitle, isSaveAs) {
                     console.log("profile save error: " + decodeURIComponent(response.message));
                     $('#profileSaveError').show();
                 }
-            },
+            }),
             error: function(xhr, ajaxOptions, thrownError) {
                 console.log("profile save HTTP error - request status: " + xhr.status + " - error: " + thrownError);
                 $('#profileSaveError').show();

js/device-config.js

@@ -19,7 +19,7 @@ function getDeviceList(){
         type: 'POST',
         url: 'socketmessage.php',
         data: {messageType: "getDeviceList", message: ""},
-        success: function(response){
+        success: ajaxSuccessHandler( function(response){
             if(showErrorsInNotification(response)){
                 return;
             }
@@ -34,6 +34,7 @@ function getDeviceList(){
                 try
                 {
                     deviceAndPinList = JSON.parse(response);
+					deviceAndPinList = deviceAndPinList.response;
                     deviceList = deviceAndPinList.deviceList;
                     pinList = deviceAndPinList.pinList;
                     jsonParsed = true;
@@ -90,7 +91,7 @@ function getDeviceList(){
             // scroll box down
             var deviceConsole = document.getElementById('device-console');
             deviceConsole.scrollTop = deviceConsole.scrollHeight;
-        },
+        }),
         async:true
     });
 }

js/main.js

@@ -23,6 +23,30 @@ var controlConstants = {};
 var controlSettings = {};
 var controlVariables = {};
 
+
+function ajaxSuccessHandler(func){
+    return function(data) {
+		if (data !== null && typeof data === 'object')
+		{
+       jQuery.each(data.messages, function(i, val) {
+             	switch (val.messageType) {
+             			case 'error': var m_color = "red"; break;
+             			case 'info': var m_color = "green"; break;
+             			case 'warning': var m_color = "orange"; break;
+             		}
+               ohSnap(val.message, {color: m_color, duration: 4000});
+               console.log(val);
+            });
+		// Send the 'response' part on to the original handler
+          func(data.response);
+		} else {
+			// Send the response to the handler
+			func(data);
+		}
+
+    };
+}
+
 function showErrorsInNotification(socketResponse){
     if(socketResponse.indexOf("ERROR: ") == 0){
         var errorMessage = socketResponse.replace("ERROR: ", "");
@@ -32,6 +56,7 @@ function showErrorsInNotification(socketResponse){
     return false;
 }
 
+
 function receiveControlConstants(){
 	"use strict";
 	$.ajax({
@@ -41,7 +66,7 @@ function receiveControlConstants(){
         contentType:"application/x-www-form-urlencoded; charset=utf-8",
         data: {messageType: "getControlConstants", message: ""},
         url: 'socketmessage.php',
-        success: function(controlConstantsJSON){
+        success: ajaxSuccessHandler (function(controlConstantsJSON){
             window.controlConstants = controlConstantsJSON;
             for (var i in window.controlConstants){
                 if(window.controlConstants.hasOwnProperty(i)){
@@ -54,7 +79,7 @@ function receiveControlConstants(){
                     $('.cc.'+i+' .val').text(window.controlConstants[i]);
                 }
             }
-        }
+        })
     });
 }
 
@@ -67,7 +92,7 @@ function receiveControlSettings(callback){
         contentType:"application/x-www-form-urlencoded; charset=utf-8",
         url: 'socketmessage.php',
         data: {messageType: "getControlSettings", message: ""},
-        success: function(controlSettingsJSON){
+        success: ajaxSuccessHandler( function(controlSettingsJSON){
             window.controlSettings = controlSettingsJSON;
             for (var i in controlSettings) {
                 if(controlSettings.hasOwnProperty(i)){
@@ -98,7 +123,7 @@ function receiveControlSettings(callback){
             if (callback && typeof(callback) === "function") {
                 callback();
             }
-	    }
+	    })
     });
 }
 
@@ -130,13 +155,13 @@ function receiveControlVariables(){
         contentType:"application/x-www-form-urlencoded; charset=utf-8",
         url: 'socketmessage.php',
         data: {messageType: "getControlVariables", message: ""},
-        success: function(controlVariablesJSON){
+        success: ajaxSuccessHandler( function(controlVariablesJSON){
             if(showErrorsInNotification(controlVariablesJSON)){
                 return;
             }
             var jsonPretty = JSON.stringify(JSON.parse(controlVariablesJSON),null,2);
       	    $('#algorithm-json').html(syntaxHighlight(jsonPretty));
-        }
+        })
      });
 }
 
@@ -194,13 +219,13 @@ function refreshLcd(){
         url: 'socketmessage.php',
         data: {messageType: "lcd", message: ""}
         })
-        .done( function(lcdText){
+        .done( ajaxSuccessHandler (function(lcdText){
             var $lcdText = $('#lcd .lcd-text');
             for (var i = lcdText.length - 1; i >= 0; i--) {
                 $lcdText.find('#lcd-line-' + i).html(lcdText[i]);
             }
             updateScriptStatus(true);
-        })
+        }))
         .fail(function() {
             var $lcdText = $('#lcd .lcd-text');
             $lcdText.find('#lcd-line-0').html("Cannot receive");
@@ -435,5 +460,6 @@ $(document).ready(function(){
 	receiveControlSettings();
 	receiveControlVariables();
 	refreshLcd(); //will call refreshLcd and alternate between the two
+
 });
 

js/maintenance-panel.js

@@ -159,9 +159,9 @@ function updateControllerVersion() {
         contentType:"application/x-www-form-urlencoded; charset=utf-8",
         url: 'socketmessage.php',
         data: {messageType: "getVersion", message: ""},
-        success: function(controllerVersionJSON){
+        success: ajaxSuccessHandler( function(controllerVersionJSON){
             setControllerVersion(controllerVersionJSON);
-        }
+        })
     });
 }
 

maintenance-panel.php

@@ -87,7 +87,8 @@ function echoRotarySelect($optionName){
 						<option value="diecimila">Atmega168 based</option>
 						<option value="mega2560">Mega 2560</option>
 						<option value="mega">Mega 1280</option>
-						<option value="spark-core">Spark Core</option>
+						<option value="core">Spark Core</option>
+						<option value="photon">Particle Photon</option>
 					</select>
 				</div>
 				<div class="program-option">