add inital work on this...

This adds a basic WebSocket testing framework. Sources different files based upon protocol, so the testing framework will get used when opened from a file... Uses Makefile and the C Preprocessor to build a single JS file for use...
hace 4 años · ffc744a7b0
--- a/.gitignore
+++ b/.gitignore
@@ -0,0 +1,2 @@
 .DS_Store
 root/js/solardash.file.js
--- a/+ 18
+++ b/+ 18
@@ -0,0 +1,18 @@
 .PHONY: all
 .SUFFIXES: .jspp .js

 JSFILES = root/js/solardash.file.js

 root/js/jquery.js:
 	wget -O $@ "https://code.jquery.com/jquery-3.4.1.min.js"

 # manual deps
 root/js/solardash.file.js: root/js/jquery.js root/js/solardash.base.js

 all: $(JSFILES)

 .jspp.js:
 	cpp -E $< | sed -e '/^#/d' > $@

 keepupdate:
 	find . -name '*.js' -o -name '*.jspp' | entr make all
--- a/NOTES.md
+++ b/NOTES.md
@@ -0,0 +1,8 @@
 Fast JS loading:
 https://web.archive.org/web/20200108190917/https://humanwhocodes.com/blog/2009/07/28/the-best-way-to-load-external-javascript/

 aiohttp websockets:
 https://web.archive.org/web/20200108235147/https://aiohttp.readthedocs.io/en/stable/web_quickstart.html#websockets

 WebSocket JS specification:
 https://web.archive.org/web/20200109005314/https://html.spec.whatwg.org/multipage/web-sockets.html#dom-websocket
--- a/root/css/styles.css
+++ b/root/css/styles.css
--- a/root/index.html
+++ b/root/index.html
@@ -0,0 +1,24 @@
 <!doctype html>
 <html lang="en">
 <head>
  <meta charset="utf-8">

  <title>Solar Dashboard</title>

  <link rel="stylesheet" type="text/css" href="css/styles.css">

 </head>

 <body>
 <span>Production: <span id="production">Unknown</span>
 <script type="text/javascript" src="js/solardash.init.js"></script>
 <script type="text/javascript">
 // Load testing/prod data first
 loadScript("js/solardash." + document.location.protocol.slice(0, -1) + ".js", function(){
 	loadScript("js/solardash.main.js", function(){
 	    // main init code
 	});
 });
 </script>
 </body>
 </html>
--- a/root/js/jquery.js
+++ b/root/js/jquery.js
--- a/root/js/solardash.base.js
+++ b/root/js/solardash.base.js
@@ -0,0 +1,12 @@
 socket.onopen = function() {
 	// connected
 }

 socket.onmessage = function(m) {
 	var msg = m.data.split(" ");
 	if (msg[0] == "p") {
 		// production value
 		var prod = parseFloat(msg[1]);
 		$("#production").text(prod.toString());
 	}
 }
--- a/root/js/solardash.file.jspp
+++ b/root/js/solardash.file.jspp
@@ -0,0 +1,39 @@
 // Interface for testing, provides testing data, and dynamic updates, etc.

 //jquery
 #include "jquery.js"

 // WebSocket emulation class for testing
 function WebSocketTest(actions) {
 	this.actions = actions.slice(); // copy
 	this.actions.reverse()
 	this.processNextItem()
 }

 // WebSocketTest.prototype.send = function ()
 // WebSocketTest.prototype.close = function ()

 // Internal
 WebSocketTest.prototype.processNextItem = function () {
 	var item = this.actions.pop()
 	var wst = this;
 	setTimeout(function() {
 		item[1](wst); 
 		wst.processNextItem();
 	}, item[0]);

 	return this;
 }

 // Setup the socket that will be used
 var socket = new WebSocketTest([
 	[ 10, function(a) { a.onopen(new Object()) } ],
 	[ 10, function(a) { a.onmessage(new MessageEvent('websockettest', {
 		  data : 'p .123'
 		})) } ],
 	[ 2000, function(a) { a.onmessage(new MessageEvent('websockettest', {
 		  data : 'p .234'
 		})) } ],
 ]);

 #include "solardash.base.js"
--- a/root/js/solardash.init.js
+++ b/root/js/solardash.init.js
@@ -0,0 +1,22 @@
 function loadScript(url, callback){

    var script = document.createElement("script")
    script.type = "text/javascript";

    if (script.readyState){  //IE
        script.onreadystatechange = function(){
            if (script.readyState == "loaded" ||
                    script.readyState == "complete"){
                script.onreadystatechange = null;
                callback();
            }
        };
    } else {  //Others
        script.onload = function(){
            callback();
        };
    }

    script.src = url;
    document.getElementsByTagName("head")[0].appendChild(script);
 }