serve orx-rabbit-control locally using Ktor

* orx-rabbit-control: writing the QR code to a file is no longer necessary
* Smaller QR-code image with MagnifyingFilter.NEAREST
* orx-rabbit-control: client is now served locally using Ktor
* Changed some getters to 'val'
* compile ⟶  implementation

orx-rabbit-control/.gitignore

@@ -0,0 +1 @@
+.DS_Store

orx-rabbit-control/build.gradle

@@ -20,6 +20,7 @@ dependencies {
     implementation "io.github.rabbitcontrol:rcp:0.3.1"
     implementation "com.google.zxing:core:3.4.0"
     implementation "com.google.zxing:javase:3.4.0"
+    implementation "io.ktor:ktor-server-netty:1.3.2"
 
     demoImplementation("org.openrndr:openrndr-extensions:$openrndrVersion")
     demoRuntimeOnly("org.openrndr:openrndr-gl3:$openrndrVersion")

orx-rabbit-control/src/main/kotlin/RabbitControlServer.kt

@@ -1,5 +1,10 @@
 import com.google.zxing.BarcodeFormat
 import com.google.zxing.qrcode.QRCodeWriter
+import io.ktor.http.content.resources
+import io.ktor.http.content.static
+import io.ktor.routing.routing
+import io.ktor.server.engine.embeddedServer
+import io.ktor.server.netty.Netty
 import org.openrndr.Extension
 import org.openrndr.Program
 import org.openrndr.color.ColorRGBa
@@ -25,7 +30,7 @@ import java.net.Socket
 import kotlin.reflect.KMutableProperty1
 
 
-class RabbitControlServer(private val showQRUntilClientConnects: Boolean = true, port: Int = 10000) : Extension {
+class RabbitControlServer(private val showQRUntilClientConnects: Boolean = true, rcpPort: Int = 10000, staticFilesPort: Int = 8080) : Extension {
     private val rabbitServer = RCPServer()
     private val transporter = WebsocketServerTransporterNetty()
 
@@ -40,10 +45,10 @@ class RabbitControlServer(private val showQRUntilClientConnects: Boolean = true,
      */
     private var currentOpacity = 0.0
 
-    private var targetOpacity: Double = 0.0
+    private val targetOpacity: Double
         get() = if (shouldShowQR) 0.8 else 0.0
 
-    private var shouldShowQR = false
+    private val shouldShowQR
         get() = (rabbitServer.connectionCount == 0 && showQRUntilClientConnects) || showQRCode
 
 
@@ -55,14 +60,27 @@ class RabbitControlServer(private val showQRUntilClientConnects: Boolean = true,
 
     init {
         rabbitServer.addTransporter(transporter)
-        transporter.bind(port)
+        transporter.bind(rcpPort)
 
-        // FIXME please help me find a better way to get the local address
+        /**
+         * Start KTOR to serve the static files of the RabbitControl client
+         */
+        val server = embeddedServer(Netty, port = staticFilesPort) {
+            routing {
+                static("/rabbit-client") {
+                    resources("rabbit-client")
+                }
+            }
+        }
+        server.start()
+
+        /**
+         * Print the address
+         */
         val socket = Socket()
         socket.connect(InetSocketAddress("google.com", 80))
         val ip = socket.localAddress.toString().replace("/", "")
-
-        val clientUrlWithHash = "https://rabbitcontrol.github.io/client/#$ip:$port"
+        val clientUrlWithHash = "http://$ip:8080/rabbit-client/index.html/#$ip:$rcpPort"
         qrCodeImage = getQRCodeImage(barcodeText = clientUrlWithHash)
         println("RabbitControl Web Client: $clientUrlWithHash")
 

orx-rabbit-control/src/main/resources/rabbit-client/asset-manifest.json

@@ -0,0 +1,16 @@
+{
+  "main.css": "/rabbit-client/static/css/main.93507422.chunk.css",
+  "main.js": "/rabbit-client/static/js/main.4dd4cd02.chunk.js",
+  "main.js.map": "/rabbit-client/static/js/main.4dd4cd02.chunk.js.map",
+  "static/css/1.ba60bb3e.chunk.css": "/rabbit-client/static/css/1.ba60bb3e.chunk.css",
+  "static/js/1.22b399cb.chunk.js": "/rabbit-client/static/js/1.22b399cb.chunk.js",
+  "static/js/1.22b399cb.chunk.js.map": "/rabbit-client/static/js/1.22b399cb.chunk.js.map",
+  "runtime~main.js": "/rabbit-client/static/js/runtime~main.139d7d3d.js",
+  "runtime~main.js.map": "/rabbit-client/static/js/runtime~main.139d7d3d.js.map",
+  "static/media/blueprint-icons.css": "/rabbit-client/static/media/icons-20.0ec8ac2b.ttf",
+  "static/css/1.ba60bb3e.chunk.css.map": "/rabbit-client/static/css/1.ba60bb3e.chunk.css.map",
+  "static/css/main.93507422.chunk.css.map": "/rabbit-client/static/css/main.93507422.chunk.css.map",
+  "index.html": "/rabbit-client/index.html",
+  "precache-manifest.9ca7f9967bc846c7fd99590e2cfc96f4.js": "/rabbit-client/precache-manifest.9ca7f9967bc846c7fd99590e2cfc96f4.js",
+  "service-worker.js": "/rabbit-client/service-worker.js"
+}

orx-rabbit-control/src/main/resources/rabbit-client/index.html

@@ -0,0 +1 @@
+<!doctype html><html lang="en"><head><meta charset="utf-8"><link rel="shortcut icon" href="/rabbit-client/favicon.ico"><meta name="viewport" content="width=device-width,initial-scale=1,shrink-to-fit=no"><meta name="theme-color" content="#000000"><link rel="manifest" href="/rabbit-client/manifest.json"><title>RabbitControl Web Carrot</title><link href="/rabbit-client/static/css/1.ba60bb3e.chunk.css" rel="stylesheet"><link href="/rabbit-client/static/css/main.93507422.chunk.css" rel="stylesheet"></head><body><noscript>You need to enable JavaScript to run this app.</noscript><div id="root"></div><script>!function(f){function e(e){for(var r,t,n=e[0],o=e[1],u=e[2],i=0,l=[];i<n.length;i++)t=n[i],c[t]&&l.push(c[t][0]),c[t]=0;for(r in o)Object.prototype.hasOwnProperty.call(o,r)&&(f[r]=o[r]);for(s&&s(e);l.length;)l.shift()();return p.push.apply(p,u||[]),a()}function a(){for(var e,r=0;r<p.length;r++){for(var t=p[r],n=!0,o=1;o<t.length;o++){var u=t[o];0!==c[u]&&(n=!1)}n&&(p.splice(r--,1),e=i(i.s=t[0]))}return e}var t={},c={2:0},p=[];function i(e){if(t[e])return t[e].exports;var r=t[e]={i:e,l:!1,exports:{}};return f[e].call(r.exports,r,r.exports,i),r.l=!0,r.exports}i.m=f,i.c=t,i.d=function(e,r,t){i.o(e,r)||Object.defineProperty(e,r,{enumerable:!0,get:t})},i.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},i.t=function(r,e){if(1&e&&(r=i(r)),8&e)return r;if(4&e&&"object"==typeof r&&r&&r.__esModule)return r;var t=Object.create(null);if(i.r(t),Object.defineProperty(t,"default",{enumerable:!0,value:r}),2&e&&"string"!=typeof r)for(var n in r)i.d(t,n,function(e){return r[e]}.bind(null,n));return t},i.n=function(e){var r=e&&e.__esModule?function(){return e.default}:function(){return e};return i.d(r,"a",r),r},i.o=function(e,r){return Object.prototype.hasOwnProperty.call(e,r)},i.p="/rabbit-client/";var r=window.webpackJsonp=window.webpackJsonp||[],n=r.push.bind(r);r.push=e,r=r.slice();for(var o=0;o<r.length;o++)e(r[o]);var s=n;a()}([])</script><script src="/rabbit-client/static/js/1.22b399cb.chunk.js"></script><script src="/rabbit-client/static/js/main.4dd4cd02.chunk.js"></script></body></html>

orx-rabbit-control/src/main/resources/rabbit-client/manifest.json

@@ -0,0 +1,15 @@
+{
+  "short_name": "React App",
+  "name": "Create React App Sample",
+  "icons": [
+    {
+      "src": "favicon.ico",
+      "sizes": "64x64 32x32 24x24 16x16",
+      "type": "image/x-icon"
+    }
+  ],
+  "start_url": ".",
+  "display": "standalone",
+  "theme_color": "#000000",
+  "background_color": "#ffffff"
+}

orx-rabbit-control/src/main/resources/rabbit-client/precache-manifest.9ca7f9967bc846c7fd99590e2cfc96f4.js

@@ -0,0 +1,50 @@
+self.__precacheManifest = [
+  {
+    "revision": "4dd4cd02e38d736039d0",
+    "url": "/rabbit-client/static/css/main.93507422.chunk.css"
+  },
+  {
+    "revision": "4dd4cd02e38d736039d0",
+    "url": "/rabbit-client/static/js/main.4dd4cd02.chunk.js"
+  },
+  {
+    "revision": "22b399cb3740b49ae9ab",
+    "url": "/rabbit-client/static/css/1.ba60bb3e.chunk.css"
+  },
+  {
+    "revision": "22b399cb3740b49ae9ab",
+    "url": "/rabbit-client/static/js/1.22b399cb.chunk.js"
+  },
+  {
+    "revision": "139d7d3db39fbf2981c3",
+    "url": "/rabbit-client/static/js/runtime~main.139d7d3d.js"
+  },
+  {
+    "revision": "5dbae370414339a081c1c6fac80659cc",
+    "url": "/rabbit-client/static/media/icons-16.5dbae370.eot"
+  },
+  {
+    "revision": "26e98f292f486f2bfac2abf9472e490a",
+    "url": "/rabbit-client/static/media/icons-16.26e98f29.ttf"
+  },
+  {
+    "revision": "d0bcd5b9effbe2570868f8c906ea7792",
+    "url": "/rabbit-client/static/media/icons-16.d0bcd5b9.woff"
+  },
+  {
+    "revision": "9d0578e5315c18aa528db1f1bfcb56f5",
+    "url": "/rabbit-client/static/media/icons-20.9d0578e5.woff"
+  },
+  {
+    "revision": "f4d910a0626d8e60f310a7199dc6b191",
+    "url": "/rabbit-client/static/media/icons-20.f4d910a0.eot"
+  },
+  {
+    "revision": "0ec8ac2bacb2c3a1b2a2064305bc1223",
+    "url": "/rabbit-client/static/media/icons-20.0ec8ac2b.ttf"
+  },
+  {
+    "revision": "fae0314c758e9b827ad8344cb936f997",
+    "url": "/rabbit-client/index.html"
+  }
+];

orx-rabbit-control/src/main/resources/rabbit-client/service-worker.js

@@ -0,0 +1,34 @@
+/**
+ * Welcome to your Workbox-powered service worker!
+ *
+ * You'll need to register this file in your web app and you should
+ * disable HTTP caching for this file too.
+ * See https://goo.gl/nhQhGp
+ *
+ * The rest of the code is auto-generated. Please don't update this file
+ * directly; instead, make changes to your Workbox build configuration
+ * and re-run your build process.
+ * See https://goo.gl/2aRDsh
+ */
+
+importScripts("https://storage.googleapis.com/workbox-cdn/releases/3.6.3/workbox-sw.js");
+
+importScripts(
+  "/rabbit-client/precache-manifest.9ca7f9967bc846c7fd99590e2cfc96f4.js"
+);
+
+workbox.clientsClaim();
+
+/**
+ * The workboxSW.precacheAndRoute() method efficiently caches and responds to
+ * requests for URLs in the manifest.
+ * See https://goo.gl/S9QRab
+ */
+self.__precacheManifest = [].concat(self.__precacheManifest || []);
+workbox.precaching.suppressWarnings();
+workbox.precaching.precacheAndRoute(self.__precacheManifest, {});
+
+workbox.routing.registerNavigationRoute("/rabbit-client/index.html", {
+  
+  blacklist: [/^\/_/,/\/[^\/]+\.[^\/]+$/],
+});

orx-rabbit-control/src/main/resources/rabbit-client/static/css/main.93507422.chunk.css

@@ -0,0 +1,2 @@
+body{margin:0;padding:0;font-family:sans-serif;background-color:#232a2f}code{font-family:source-code-pro,Menlo,Monaco,Consolas,Courier New,monospace}hr{display:block;height:1px;border:0;border-top:1px solid #ccc;margin:1em 0;padding:0}.bp3-slider-handle:focus{outline:0}.App{text-align:left;margin:4px 4px -30px;display:flex;flex-direction:column;justify-content:center}.bp3-slider-label{-webkit-transform:translateY(20px);transform:translateY(20px)}.bp3-slider-axis :nth-child(2),.bp3-slider-axis :nth-child(3){-webkit-transform:translate(-100%,20px);transform:translate(-100%,20px)}.bp3-slider-axis :nth-child(3){right:0 px}.bp3-slider-handle .bp3-slider-label{-webkit-transform:translate(-50%,-20px);transform:translate(-50%,-20px)}.parameter-label{white-space:nowrap;color:grey;font-size:16;margin-bottom:4px}.parameter-wrapper{padding-top:4px;padding-bottom:0}.parameter-wrapper .inner{padding:5px;border-radius:4px}.rootgroup-wrapper{padding:0 5px 4px;border-radius:4px;border:1px solid #454545}.serverid{font-size:.8em;margin-top:5px;margin-left:2px}.credits{margin-top:20;margin-bottom:5;width:100%;text-align:center;font-size:.8em}
+/*# sourceMappingURL=main.93507422.chunk.css.map */

orx-rabbit-control/src/main/resources/rabbit-client/static/css/main.93507422.chunk.css.map

@@ -0,0 +1 @@
+{"version":3,"sources":["/Users/reinvanderwoerd/Desktop/rcp-ts-client/src/index.css","main.93507422.chunk.css","/Users/reinvanderwoerd/Desktop/rcp-ts-client/src/App.css"],"names":[],"mappings":"AAAA,KACE,SAAU,AACV,UAAW,AACX,uBAAwB,AAMxB,wBAAkC,CACnC,AAED,KACE,uEACY,CACb,AAED,GACE,cAAe,AACf,WAAY,AACZ,SAAU,AACV,0BAA2B,AAC3B,aAAc,AACd,SAAW,CACZ,AAED,yBACE,SAAW,CCCZ,AC5BD,KACE,gBAAiB,AAEjB,qBAAqB,AACrB,aAAc,AACd,sBAAuB,AACvB,sBAAwB,CACzB,AAGD,kBACE,mCAAsC,AAC9B,0BAA8B,CACvC,AAOD,8DAJE,wCAAyC,AACjC,+BAAiC,CAQ1C,AALD,+BAIE,UAAY,CACb,AAED,qCACE,wCAAyC,AACjC,+BAAiC,CAC1C,AAGD,iBACE,mBAAoB,AACpB,WAAY,AACZ,aAAc,AACd,iBAAmB,CACpB,AAED,mBACE,gBAAiB,AACjB,gBAAoB,CACrB,AAED,0BACE,YAAa,AACb,iBAAmB,CACpB,AAED,mBAGE,kBAAoB,AACpB,kBAAmB,AACnB,wBAA0B,CAC3B,AAED,UACE,eAAiB,AACjB,eAAgB,AAChB,eAAiB,CAClB,AAED,SAEE,cAAe,AACf,gBAAiB,AACjB,WAAY,AACZ,kBAAmB,AACnB,cAAiB,CD8BlB","file":"main.93507422.chunk.css","sourcesContent":["body {\n  margin: 0;\n  padding: 0;\n  font-family: sans-serif;\n  /* font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen',\n    'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue',\n    sans-serif; */\n  /* -webkit-font-smoothing: antialiased;\n  -moz-osx-font-smoothing: grayscale; */\n  background-color: rgb(35, 42, 47);\n}\n\ncode {\n  font-family: source-code-pro, Menlo, Monaco, Consolas, 'Courier New',\n    monospace;\n}\n\nhr {\n  display: block;\n  height: 1px;\n  border: 0;\n  border-top: 1px solid #ccc;\n  margin: 1em 0;\n  padding: 0; \n}\n\n.bp3-slider-handle:focus {\n  outline: 0;\n}","body {\n  margin: 0;\n  padding: 0;\n  font-family: sans-serif;\n  /* font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen',\n    'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue',\n    sans-serif; */\n  /* -webkit-font-smoothing: antialiased;\n  -moz-osx-font-smoothing: grayscale; */\n  background-color: rgb(35, 42, 47);\n}\n\ncode {\n  font-family: source-code-pro, Menlo, Monaco, Consolas, 'Courier New',\n    monospace;\n}\n\nhr {\n  display: block;\n  height: 1px;\n  border: 0;\n  border-top: 1px solid #ccc;\n  margin: 1em 0;\n  padding: 0; \n}\n\n.bp3-slider-handle:focus {\n  outline: 0;\n}\n.App {\n  text-align: left;\n  margin: 4px;\n  margin-bottom: -30px;\n  display: flex;\n  flex-direction: column;\n  justify-content: center;\n}\n\n/* bluepring style overwrites*/\n.bp3-slider-label{\n  -webkit-transform:translate(0%, 20px);\n          transform:translate(0%, 20px);\n}\n\n.bp3-slider-axis :nth-child(2){\n  -webkit-transform:translate(-100%, 20px);\n          transform:translate(-100%, 20px);\n}\n\n.bp3-slider-axis :nth-child(3){\n  -webkit-transform:translate(-100%, 20px);\n          transform:translate(-100%, 20px);\n\n  right: 0 px;\n}\n\n.bp3-slider-handle .bp3-slider-label{\n  -webkit-transform:translate(-50%, -20px);\n          transform:translate(-50%, -20px);\n}\n\n/* gui styles */\n.parameter-label {\n  white-space: nowrap;\n  color: gray;\n  font-size: 16;  \n  margin-bottom: 4px;\n}\n\n.parameter-wrapper {\n  padding-top: 4px;\n  padding-bottom: 0px;  \n}\n\n.parameter-wrapper .inner{\n  padding: 5px;\n  border-radius: 4px;\n}\n\n.rootgroup-wrapper {\n  padding: 5px;\n  padding-top: 0px;\n  padding-bottom: 4px;\n  border-radius: 4px;\n  border: 1px solid #454545;\n}\n\n.serverid {\n  font-size: 0.8em;\n  margin-top: 5px;\n  margin-left: 2px;\n}\n\n.credits {\n  font-size: 0.8em;\n  margin-top: 20;\n  margin-bottom: 5;\n  width: 100%;\n  text-align: center;\n  font-size: 0.8em;\n}\n",".App {\n  text-align: left;\n  margin: 4px;\n  margin-bottom: -30px;\n  display: flex;\n  flex-direction: column;\n  justify-content: center;\n}\n\n/* bluepring style overwrites*/\n.bp3-slider-label{\n  -webkit-transform:translate(0%, 20px);\n          transform:translate(0%, 20px);\n}\n\n.bp3-slider-axis :nth-child(2){\n  -webkit-transform:translate(-100%, 20px);\n          transform:translate(-100%, 20px);\n}\n\n.bp3-slider-axis :nth-child(3){\n  -webkit-transform:translate(-100%, 20px);\n          transform:translate(-100%, 20px);\n\n  right: 0 px;\n}\n\n.bp3-slider-handle .bp3-slider-label{\n  -webkit-transform:translate(-50%, -20px);\n          transform:translate(-50%, -20px);\n}\n\n/* gui styles */\n.parameter-label {\n  white-space: nowrap;\n  color: gray;\n  font-size: 16;  \n  margin-bottom: 4px;\n}\n\n.parameter-wrapper {\n  padding-top: 4px;\n  padding-bottom: 0px;  \n}\n\n.parameter-wrapper .inner{\n  padding: 5px;\n  border-radius: 4px;\n}\n\n.rootgroup-wrapper {\n  padding: 5px;\n  padding-top: 0px;\n  padding-bottom: 4px;\n  border-radius: 4px;\n  border: 1px solid #454545;\n}\n\n.serverid {\n  font-size: 0.8em;\n  margin-top: 5px;\n  margin-left: 2px;\n}\n\n.credits {\n  font-size: 0.8em;\n  margin-top: 20;\n  margin-bottom: 5;\n  width: 100%;\n  text-align: center;\n  font-size: 0.8em;\n}"]}

orx-rabbit-control/src/main/resources/rabbit-client/static/js/runtime~main.139d7d3d.js

@@ -0,0 +1,2 @@
+!function(e){function r(r){for(var n,i,l=r[0],f=r[1],a=r[2],p=0,s=[];p<l.length;p++)i=l[p],o[i]&&s.push(o[i][0]),o[i]=0;for(n in f)Object.prototype.hasOwnProperty.call(f,n)&&(e[n]=f[n]);for(c&&c(r);s.length;)s.shift()();return u.push.apply(u,a||[]),t()}function t(){for(var e,r=0;r<u.length;r++){for(var t=u[r],n=!0,l=1;l<t.length;l++){var f=t[l];0!==o[f]&&(n=!1)}n&&(u.splice(r--,1),e=i(i.s=t[0]))}return e}var n={},o={2:0},u=[];function i(r){if(n[r])return n[r].exports;var t=n[r]={i:r,l:!1,exports:{}};return e[r].call(t.exports,t,t.exports,i),t.l=!0,t.exports}i.m=e,i.c=n,i.d=function(e,r,t){i.o(e,r)||Object.defineProperty(e,r,{enumerable:!0,get:t})},i.r=function(e){"undefined"!==typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},i.t=function(e,r){if(1&r&&(e=i(e)),8&r)return e;if(4&r&&"object"===typeof e&&e&&e.__esModule)return e;var t=Object.create(null);if(i.r(t),Object.defineProperty(t,"default",{enumerable:!0,value:e}),2&r&&"string"!=typeof e)for(var n in e)i.d(t,n,function(r){return e[r]}.bind(null,n));return t},i.n=function(e){var r=e&&e.__esModule?function(){return e.default}:function(){return e};return i.d(r,"a",r),r},i.o=function(e,r){return Object.prototype.hasOwnProperty.call(e,r)},i.p="/rabbit-client/";var l=window.webpackJsonp=window.webpackJsonp||[],f=l.push.bind(l);l.push=r,l=l.slice();for(var a=0;a<l.length;a++)r(l[a]);var c=f;t()}([]);
+//# sourceMappingURL=runtime~main.139d7d3d.js.map