Added pull request Freeboard#278

Added pull request Freeboard#227 Added highchart plugin from https://github.com/onlinux/freeboard-dynamic-highcharts-plugin, and added object-support
joed74 · Aug 20, 2022 · bbcba28 · bbcba28
1 parent 321d573
commit bbcba28
Show file tree

Hide file tree

Showing 18 changed files with 1,095 additions and 76 deletions.
diff --git a/css/freeboard.css b/css/freeboard.css
@@ -1167,6 +1167,7 @@ header h1 {
 	position: relative;
 	-webkit-box-shadow: 0 0 5px #000;
 	box-shadow: 0 0 5px #000;
+	overflow:scroll;
 }
 
 #toggle-header {

diff --git a/css/freeboard.min.css b/css/freeboard.min.css
diff --git a/index-dev.html b/index-dev.html
@@ -40,7 +40,8 @@
 		"plugins/thirdparty/paho.mqtt.plugin.js",
 		"plugins/thirdparty/randomdatasource.plugin.js",
 		"plugins/thirdparty/interactive_indicator.js",
-                "examples/plugin_example.js",
+		"plugins/thirdparty/plugin_highcharts.js",
+	        "examples/plugin_example.js",
 
                 // *** Load more plugins here ***
                 function(){

diff --git a/index.html b/index.html
@@ -12,7 +12,8 @@
     <script type="text/javascript">
         head.js("js/freeboard_plugins.min.js",
 		"plugins/thirdparty/paho.mqtt.plugin.js",
-		"plugins/thirdparty/interactive_indicator.js",
+	        "plugins/thirdparty/plugin_highcharts.js",
+	        "plugins/thirdparty/interactive_indicator.js",
                 // *** Load more plugins here ***
                 function(){
                     $(function()

diff --git a/js/freeboard.js b/js/freeboard.js
@@ -57,7 +57,7 @@ DatasourceModel = function(theFreeboardModel, datasourcePlugins) {
 			}
 
 			// Do we need to load any external scripts?
-			if(datasourceType.external_scripts)
+			if(datasourceType.external_scripts && datasourceType.external_scripts.length>0)
 			{
 				head.js(datasourceType.external_scripts.slice(0), finishLoad); // Need to clone the array because head.js adds some weird functions to it
 			}
@@ -704,14 +704,12 @@ function FreeboardModel(datasourcePlugins, widgetPlugins, freeboardUI)
 	}
 }
 
-function FreeboardUI()
+function FreeboardUI(pane_margin, pane_width, min_columns)
 {
-	var PANE_MARGIN = 10;
-	var PANE_WIDTH = 300;
-	var MIN_COLUMNS = 3;
-	var COLUMN_WIDTH = PANE_MARGIN + PANE_WIDTH + PANE_MARGIN;
 
-	var userColumns = MIN_COLUMNS;
+	var column_width = pane_margin + pane_width + pane_margin;
+
+	var userColumns = min_columns;
 
 	var loadingIndicator = $('<div class="wrapperloading"><div class="loading up" ></div><div class="loading down"></div></div>');
 	var grid;
@@ -812,9 +810,9 @@ function FreeboardUI()
 	{
 		var col_controls = $(".column-tool");
 		var available_width = $("#board-content").width();
-		var max_columns = Math.floor(available_width / COLUMN_WIDTH);
+		var max_columns = Math.floor(available_width / column_width);
 
-		if(grid.cols <= MIN_COLUMNS)
+		if(grid.cols <= min_columns)
 		{
 			col_controls.addClass("min");
 		}
@@ -836,14 +834,14 @@ function FreeboardUI()
 	function getMaxDisplayableColumnCount()
 	{
 		var available_width = $("#board-content").width();
-		return Math.floor(available_width / COLUMN_WIDTH);
+		return Math.floor(available_width / column_width);
 	}
 
 	function updateGridWidth(newCols)
 	{
-		if(newCols === undefined || newCols < MIN_COLUMNS)
+		if(newCols === undefined || newCols < min_columns)
 		{
-			newCols = MIN_COLUMNS;
+			newCols = min_columns;
 		}
 
 		var max_columns = getMaxDisplayableColumnCount();
@@ -853,7 +851,7 @@ function FreeboardUI()
 		}
 
 		// +newCols to account for scaling on zoomed browsers
-		var new_width = (COLUMN_WIDTH * newCols) + newCols;
+		var new_width = (column_width * newCols) + newCols;
 		$(".responsive-column-width").css("max-width", new_width);
 
 		if(newCols === grid.cols)
@@ -877,7 +875,7 @@ function FreeboardUI()
 		rootElement.find("> li").each(repositionFunction);
 
 		grid.init();
-		$(".responsive-column-width").css("width", grid.cols * PANE_WIDTH + (grid.cols * PANE_MARGIN * 2));
+		$(".responsive-column-width").css("width", grid.cols * pane_width + (grid.cols * pane_margin * 2));
 	}
 
 	function getUserColumns()
@@ -887,16 +885,16 @@ function FreeboardUI()
 
 	function setUserColumns(numCols)
 	{
-		userColumns = Math.max(MIN_COLUMNS, numCols);
+		userColumns = Math.max(min_columns, numCols);
 	}
 
 	ko.bindingHandlers.grid = {
 		init: function(element, valueAccessor, allBindingsAccessor, viewModel, bindingContext)
 		{
 			// Initialize our grid
 			grid = $(element).gridster({
-				widget_margins        : [PANE_MARGIN, PANE_MARGIN],
-				widget_base_dimensions: [PANE_WIDTH, 10],
+				widget_margins        : [pane_margin, pane_margin],
+				widget_base_dimensions: [pane_width, 10],
 				resize: {
 					enabled : false,
 					axes : "x"
@@ -1145,6 +1143,7 @@ function FreeboardUI()
 	}
 }
 
+
 JSEditor = function () {
 	var assetRoot = ""
 
@@ -1257,6 +1256,7 @@ function PaneModel(theFreeboardModel, widgetPlugins) {
 
 	this.processSizeChange = function()
 	{
+console.log("processSizeChange");
 		// Give the animation a moment to complete. Really hacky.
 		// TODO: Make less hacky. Also, doesn't work when screen resizes.
 		setTimeout(function(){
@@ -2306,16 +2306,17 @@ function WidgetModel(theFreeboardModel, widgetPlugins) {
 
 	this.processDatasourceUpdate = function (datasourceName, newDataNames) {
 		var refreshSettingNames = self.datasourceRefreshNotifications[datasourceName];
-
 		if (_.isArray(refreshSettingNames)) {
 			var updates=[];
 			_.each(refreshSettingNames, function (setting) {
 				_.each(setting.value, function (valuename) {
-				if (newDataNames.includes(valuename)) {
-					if (updates.findIndex(updates => updates === setting.name)===-1) {
+				   _.each(newDataNames, function (newdataname) {
+					if (newdataname.startsWith(valuename)) {
+					   if (updates.findIndex(updates => updates === setting.name)===-1) {
 						updates.push(setting.name);
+					   }
 					}
-			   	}
+				   });
 			    });
 			});
 			_.each(updates, function (name) {
@@ -2676,7 +2677,7 @@ var freeboard = (function()
 	var datasourcePlugins = {};
 	var widgetPlugins = {};
 
-	var freeboardUI = new FreeboardUI();
+	var freeboardUI = new FreeboardUI(10, 300, 3);
 	var theFreeboardModel = new FreeboardModel(datasourcePlugins, widgetPlugins, freeboardUI);
 
 	var jsEditor = new JSEditor();

diff --git a/js/freeboard.min.js b/js/freeboard.min.js
diff --git a/js/freeboard_plugins.js b/js/freeboard_plugins.js
@@ -57,7 +57,7 @@ DatasourceModel = function(theFreeboardModel, datasourcePlugins) {
 			}
 
 			// Do we need to load any external scripts?
-			if(datasourceType.external_scripts)
+			if(datasourceType.external_scripts && datasourceType.external_scripts.length>0)
 			{
 				head.js(datasourceType.external_scripts.slice(0), finishLoad); // Need to clone the array because head.js adds some weird functions to it
 			}
@@ -704,14 +704,12 @@ function FreeboardModel(datasourcePlugins, widgetPlugins, freeboardUI)
 	}
 }
 
-function FreeboardUI()
+function FreeboardUI(pane_margin, pane_width, min_columns)
 {
-	var PANE_MARGIN = 10;
-	var PANE_WIDTH = 300;
-	var MIN_COLUMNS = 3;
-	var COLUMN_WIDTH = PANE_MARGIN + PANE_WIDTH + PANE_MARGIN;
 
-	var userColumns = MIN_COLUMNS;
+	var column_width = pane_margin + pane_width + pane_margin;
+
+	var userColumns = min_columns;
 
 	var loadingIndicator = $('<div class="wrapperloading"><div class="loading up" ></div><div class="loading down"></div></div>');
 	var grid;
@@ -812,9 +810,9 @@ function FreeboardUI()
 	{
 		var col_controls = $(".column-tool");
 		var available_width = $("#board-content").width();
-		var max_columns = Math.floor(available_width / COLUMN_WIDTH);
+		var max_columns = Math.floor(available_width / column_width);
 
-		if(grid.cols <= MIN_COLUMNS)
+		if(grid.cols <= min_columns)
 		{
 			col_controls.addClass("min");
 		}
@@ -836,14 +834,14 @@ function FreeboardUI()
 	function getMaxDisplayableColumnCount()
 	{
 		var available_width = $("#board-content").width();
-		return Math.floor(available_width / COLUMN_WIDTH);
+		return Math.floor(available_width / column_width);
 	}
 
 	function updateGridWidth(newCols)
 	{
-		if(newCols === undefined || newCols < MIN_COLUMNS)
+		if(newCols === undefined || newCols < min_columns)
 		{
-			newCols = MIN_COLUMNS;
+			newCols = min_columns;
 		}
 
 		var max_columns = getMaxDisplayableColumnCount();
@@ -853,7 +851,7 @@ function FreeboardUI()
 		}
 
 		// +newCols to account for scaling on zoomed browsers
-		var new_width = (COLUMN_WIDTH * newCols) + newCols;
+		var new_width = (column_width * newCols) + newCols;
 		$(".responsive-column-width").css("max-width", new_width);
 
 		if(newCols === grid.cols)
@@ -877,7 +875,7 @@ function FreeboardUI()
 		rootElement.find("> li").each(repositionFunction);
 
 		grid.init();
-		$(".responsive-column-width").css("width", grid.cols * PANE_WIDTH + (grid.cols * PANE_MARGIN * 2));
+		$(".responsive-column-width").css("width", grid.cols * pane_width + (grid.cols * pane_margin * 2));
 	}
 
 	function getUserColumns()
@@ -887,16 +885,16 @@ function FreeboardUI()
 
 	function setUserColumns(numCols)
 	{
-		userColumns = Math.max(MIN_COLUMNS, numCols);
+		userColumns = Math.max(min_columns, numCols);
 	}
 
 	ko.bindingHandlers.grid = {
 		init: function(element, valueAccessor, allBindingsAccessor, viewModel, bindingContext)
 		{
 			// Initialize our grid
 			grid = $(element).gridster({
-				widget_margins        : [PANE_MARGIN, PANE_MARGIN],
-				widget_base_dimensions: [PANE_WIDTH, 10],
+				widget_margins        : [pane_margin, pane_margin],
+				widget_base_dimensions: [pane_width, 10],
 				resize: {
 					enabled : false,
 					axes : "x"
@@ -1145,6 +1143,7 @@ function FreeboardUI()
 	}
 }
 
+
 JSEditor = function () {
 	var assetRoot = ""
 
@@ -1257,6 +1256,7 @@ function PaneModel(theFreeboardModel, widgetPlugins) {
 
 	this.processSizeChange = function()
 	{
+console.log("processSizeChange");
 		// Give the animation a moment to complete. Really hacky.
 		// TODO: Make less hacky. Also, doesn't work when screen resizes.
 		setTimeout(function(){
@@ -2306,16 +2306,17 @@ function WidgetModel(theFreeboardModel, widgetPlugins) {
 
 	this.processDatasourceUpdate = function (datasourceName, newDataNames) {
 		var refreshSettingNames = self.datasourceRefreshNotifications[datasourceName];
-
 		if (_.isArray(refreshSettingNames)) {
 			var updates=[];
 			_.each(refreshSettingNames, function (setting) {
 				_.each(setting.value, function (valuename) {
-				if (newDataNames.includes(valuename)) {
-					if (updates.findIndex(updates => updates === setting.name)===-1) {
+				   _.each(newDataNames, function (newdataname) {
+					if (newdataname.startsWith(valuename)) {
+					   if (updates.findIndex(updates => updates === setting.name)===-1) {
 						updates.push(setting.name);
+					   }
 					}
-			   	}
+				   });
 			    });
 			});
 			_.each(updates, function (name) {
@@ -2676,7 +2677,7 @@ var freeboard = (function()
 	var datasourcePlugins = {};
 	var widgetPlugins = {};
 
-	var freeboardUI = new FreeboardUI();
+	var freeboardUI = new FreeboardUI(10, 300, 3);
 	var theFreeboardModel = new FreeboardModel(datasourcePlugins, widgetPlugins, freeboardUI);
 
 	var jsEditor = new JSEditor();

diff --git a/js/freeboard_plugins.min.js b/js/freeboard_plugins.min.js
diff --git a/lib/css/freeboard/styles.css b/lib/css/freeboard/styles.css
@@ -817,6 +817,7 @@ header h1 {
 	position: relative;
 	-webkit-box-shadow: 0 0 5px #000;
 	box-shadow: 0 0 5px #000;
+	overflow:scroll;
 }
 
 #toggle-header {

diff --git a/lib/js/freeboard/DatasourceModel.js b/lib/js/freeboard/DatasourceModel.js
@@ -57,7 +57,7 @@ DatasourceModel = function(theFreeboardModel, datasourcePlugins) {
 			}
 
 			// Do we need to load any external scripts?
-			if(datasourceType.external_scripts)
+			if(datasourceType.external_scripts && datasourceType.external_scripts.length>0)
 			{
 				head.js(datasourceType.external_scripts.slice(0), finishLoad); // Need to clone the array because head.js adds some weird functions to it
 			}