@marineyachtradar/signalk-playback-plugin 0.1.2 → 0.2.0

package/public/responsive.css

@@ -0,0 +1,29 @@
+/* ============================================
+   Responsive Styles - Media Queries
+   ============================================ */
+
+/* Touch-friendly: larger touch targets */
+@media (pointer: coarse) {
+  .myr_power_button,
+  .myr_range_button,
+  .myr_toggle_button,
+  .myr_enum_button,
+  .myr_mode_button {
+    min-height: 44px;
+    font-size: 14px;
+  }
+
+  .myr_slider {
+    height: 32px;
+  }
+
+  .myr_slider::-webkit-slider-thumb {
+    width: 32px;
+    height: 32px;
+  }
+
+  .myr_slider::-moz-range-thumb {
+    width: 32px;
+    height: 32px;
+  }
+}

package/public/van-1.5.2.debug.js

@@ -0,0 +1,126 @@
+import van from "./van-1.5.2.js"
+
+// If this variable is set to an Array, we will push the error message into the array instead of
+// throwing an error. This is useful in testing, to capture the error occurred asynchronous to the initiating
+// callstack. e.g.: a state change can trigger a dom update processing when idle (i.e.: dom update
+// processing is set via setTimeout function, which is asynchronous to the initiating callstack).
+let capturedErrors
+
+const startCapturingErrors = () => capturedErrors = []
+
+const stopCapturingErrors = () => capturedErrors = null
+
+const expect = (cond, msg) => {
+  if (!cond) {
+    if (capturedErrors) capturedErrors.push(msg); else throw new Error(msg)
+    return false
+  }
+  return true
+}
+
+const protoOf = Object.getPrototypeOf
+const stateProto = protoOf(van.state())
+const isState = s => protoOf(s ?? 0) === stateProto
+
+const checkStateValValid = v => {
+  expect(!isState(v), "State couldn't have value to other state")
+  expect(!(v instanceof Node), "DOM Node is not valid value for state")
+  return v
+}
+
+const state = initVal => {
+  const proxy = new Proxy(van.state(checkStateValValid(initVal)), {
+    set: (s, prop, val) => {
+      prop === "val" && checkStateValValid(val)
+      return Reflect.set(s, prop, val, proxy)
+    },
+  })
+  return proxy
+}
+
+const derive = f => {
+  expect(typeof(f) === "function", "Must pass-in a function to `van.derive`")
+  return van.derive(f)
+}
+
+const isValidPrimitive = v =>
+  typeof(v) === "string" ||
+  typeof(v) === "number" ||
+  typeof(v) === "boolean" ||
+  typeof(v) === "bigint"
+
+const isDomOrPrimitive = v => v instanceof Node || isValidPrimitive(v)
+
+const validateChild = child => {
+  expect(
+    isDomOrPrimitive(child) || child === null || child === undefined,
+    "Only DOM Node, string, number, boolean, bigint, null, undefined are valid child of a DOM Element",
+  )
+  return child
+}
+
+const withResultValidation = f => dom => {
+  const r = validateChild(f(dom))
+  if (r !== dom && r instanceof Node)
+    expect(!r.isConnected,
+      "If the result of complex binding function is not the same as previous one, it shouldn't be already connected to document")
+  return r
+}
+
+const checkChildren = children => children.flat(Infinity).map(c => {
+  if (isState(c)) return withResultValidation(() => c.val)
+  if (typeof c === "function") return withResultValidation(c)
+  expect(!c?.isConnected, "You can't add a DOM Node that is already connected to document")
+  return validateChild(c)
+})
+
+const add = (dom, ...children) => {
+  expect(dom instanceof Element, "1st argument of `van.add` function must be a DOM Element object")
+  return van.add(dom, ...checkChildren(children))
+}
+
+const debugHandler = {
+  get: (vanTags, name) => {
+    const vanTag = vanTags[name]
+    return (...args) => {
+      const [props, ...children] = protoOf(args[0] ?? 0) === Object.prototype ? args : [{}, ...args]
+      const debugProps =  {}
+      for (const [k, v] of Object.entries(props)) {
+        const validatePropValue = k.startsWith("on") ?
+          (k.toLowerCase() === k ?
+            v => (expect(typeof v === "function" || v === null,
+              `Invalid property value for ${k}: Only functions and null are allowed for ${k} property`), v) :
+            v => (expect(typeof v === "string",
+              `Invalid property value for ${k}: Only strings are allowed for ${k} attribute`), v)
+          ) :
+          v => (expect(isValidPrimitive(v) || v === null,
+            `Invalid property value for ${k}: Only string, number, boolean, bigint and null are valid prop value types`), v)
+
+        if (isState(v))
+          debugProps[k] = van.derive(() => validatePropValue(v.val))
+        else if (typeof v === "function" && (!k.startsWith("on") || v._isBindingFunc))
+          debugProps[k] = van.derive(() => validatePropValue(v()))
+        else
+          debugProps[k] = validatePropValue(v)
+      }
+      return vanTag(debugProps, ...checkChildren(children))
+    }
+  },
+}
+
+const _tagsNS = ns => new Proxy(van.tags(ns), debugHandler)
+const tagsNS = ns => {
+  expect(typeof ns === "string", "Must provide a string for parameter `ns` in `van.tags`")
+  return _tagsNS(ns)
+}
+
+const _tags = _tagsNS("")
+const tags = new Proxy(tagsNS, {get: (_, name) => _tags[name]})
+
+const hydrate = (dom, f) => {
+  expect(dom instanceof Node, "1st argument of `van.hydrate` function must be a DOM Node object")
+  expect(typeof(f) === "function", "2nd argument of `van.hydrate` function must be a function")
+  return van.hydrate(dom, withResultValidation(f))
+}
+
+export default {add, tags, state, derive, hydrate, startCapturingErrors, stopCapturingErrors, get capturedErrors() { return capturedErrors }}

package/public/van-1.5.2.js

@@ -0,0 +1,140 @@
+// This file consistently uses `let` keyword instead of `const` for reducing the bundle size.
+
+// Global variables - aliasing some builtin symbols to reduce the bundle size.
+let protoOf = Object.getPrototypeOf
+let changedStates, derivedStates, curDeps, curNewDerives, alwaysConnectedDom = {isConnected: 1}
+let gcCycleInMs = 1000, statesToGc, propSetterCache = {}
+let objProto = protoOf(alwaysConnectedDom), funcProto = protoOf(protoOf), _undefined
+
+let addAndScheduleOnFirst = (set, s, f, waitMs) =>
+  (set ?? (setTimeout(f, waitMs), new Set)).add(s)
+
+let runAndCaptureDeps = (f, deps, arg) => {
+  let prevDeps = curDeps
+  curDeps = deps
+  try {
+    return f(arg)
+  } catch (e) {
+    console.error(e)
+    return arg
+  } finally {
+    curDeps = prevDeps
+  }
+}
+
+let keepConnected = l => l.filter(b => b._dom?.isConnected)
+
+let addStatesToGc = d => statesToGc = addAndScheduleOnFirst(statesToGc, d, () => {
+  for (let s of statesToGc)
+    s._bindings = keepConnected(s._bindings),
+    s._listeners = keepConnected(s._listeners)
+  statesToGc = _undefined
+}, gcCycleInMs)
+
+let stateProto = {
+  get val() {
+    curDeps?._getters?.add(this)
+    return this.rawVal
+  },
+
+  get oldVal() {
+    curDeps?._getters?.add(this)
+    return this._oldVal
+  },
+
+  set val(v) {
+    curDeps?._setters?.add(this)
+    if (v !== this.rawVal) {
+      this.rawVal = v
+      this._bindings.length + this._listeners.length ?
+        (derivedStates?.add(this), changedStates = addAndScheduleOnFirst(changedStates, this, updateDoms)) :
+        this._oldVal = v
+    }
+  },
+}
+
+let state = initVal => ({
+  __proto__: stateProto,
+  rawVal: initVal,
+  _oldVal: initVal,
+  _bindings: [],
+  _listeners: [],
+})
+
+let bind = (f, dom) => {
+  let deps = {_getters: new Set, _setters: new Set}, binding = {f}, prevNewDerives = curNewDerives
+  curNewDerives = []
+  let newDom = runAndCaptureDeps(f, deps, dom)
+  newDom = (newDom ?? document).nodeType ? newDom : new Text(newDom)
+  for (let d of deps._getters)
+    deps._setters.has(d) || (addStatesToGc(d), d._bindings.push(binding))
+  for (let l of curNewDerives) l._dom = newDom
+  curNewDerives = prevNewDerives
+  return binding._dom = newDom
+}
+
+let derive = (f, s = state(), dom) => {
+  let deps = {_getters: new Set, _setters: new Set}, listener = {f, s}
+  listener._dom = dom ?? curNewDerives?.push(listener) ?? alwaysConnectedDom
+  s.val = runAndCaptureDeps(f, deps, s.rawVal)
+  for (let d of deps._getters)
+    deps._setters.has(d) || (addStatesToGc(d), d._listeners.push(listener))
+  return s
+}
+
+let add = (dom, ...children) => {
+  for (let c of children.flat(Infinity)) {
+    let protoOfC = protoOf(c ?? 0)
+    let child = protoOfC === stateProto ? bind(() => c.val) :
+      protoOfC === funcProto ? bind(c) : c
+    child != _undefined && dom.append(child)
+  }
+  return dom
+}
+
+let tag = (ns, name, ...args) => {
+  let [props, ...children] = protoOf(args[0] ?? 0) === objProto ? args : [{}, ...args]
+  let dom = ns ? document.createElementNS(ns, name) : document.createElement(name)
+  for (let [k, v] of Object.entries(props)) {
+    let getPropDescriptor = proto => proto ?
+      Object.getOwnPropertyDescriptor(proto, k) ?? getPropDescriptor(protoOf(proto)) :
+      _undefined
+    let cacheKey = name + "," + k
+    let propSetter = propSetterCache[cacheKey] ??= getPropDescriptor(protoOf(dom))?.set ?? 0
+    let setter = k.startsWith("on") ?
+      (v, oldV) => {
+        let event = k.slice(2)
+        dom.removeEventListener(event, oldV)
+        dom.addEventListener(event, v)
+      } :
+      propSetter ? propSetter.bind(dom) : dom.setAttribute.bind(dom, k)
+    let protoOfV = protoOf(v ?? 0)
+    k.startsWith("on") || protoOfV === funcProto && (v = derive(v), protoOfV = stateProto)
+    protoOfV === stateProto ? bind(() => (setter(v.val, v._oldVal), dom)) : setter(v)
+  }
+  return add(dom, children)
+}
+
+let handler = ns => ({get: (_, name) => tag.bind(_undefined, ns, name)})
+
+let update = (dom, newDom) => newDom ? newDom !== dom && dom.replaceWith(newDom) : dom.remove()
+
+let updateDoms = () => {
+  let iter = 0, derivedStatesArray = [...changedStates].filter(s => s.rawVal !== s._oldVal)
+  do {
+    derivedStates = new Set
+    for (let l of new Set(derivedStatesArray.flatMap(s => s._listeners = keepConnected(s._listeners))))
+      derive(l.f, l.s, l._dom), l._dom = _undefined
+  } while (++iter < 100 && (derivedStatesArray = [...derivedStates]).length)
+  let changedStatesArray = [...changedStates].filter(s => s.rawVal !== s._oldVal)
+  changedStates = _undefined
+  for (let b of new Set(changedStatesArray.flatMap(s => s._bindings = keepConnected(s._bindings))))
+    update(b._dom, bind(b.f, b._dom)), b._dom = _undefined
+  for (let s of changedStatesArray) s._oldVal = s.rawVal
+}
+
+export default {
+  tags: new Proxy(ns => new Proxy(tag, handler(ns)), handler()),
+  hydrate: (dom, f) => update(dom, bind(f, dom)),
+  add, state, derive,
+}

package/public/van-1.5.2.min.js

@@ -0,0 +1 @@
+let e,t,r,o,l,n,s=Object.getPrototypeOf,f={isConnected:1},i={},h=s(f),a=s(s),d=(e,t,r,o)=>(e??(setTimeout(r,o),new Set)).add(t),u=(e,t,o)=>{let l=r;r=t;try{return e(o)}catch(e){return console.error(e),o}finally{r=l}},w=e=>e.filter(e=>e.t?.isConnected),_=e=>l=d(l,e,()=>{for(let e of l)e.o=w(e.o),e.l=w(e.l);l=n},1e3),c={get val(){return r?.i?.add(this),this.rawVal},get oldVal(){return r?.i?.add(this),this.h},set val(o){r?.u?.add(this),o!==this.rawVal&&(this.rawVal=o,this.o.length+this.l.length?(t?.add(this),e=d(e,this,v)):this.h=o)}},S=e=>({__proto__:c,rawVal:e,h:e,o:[],l:[]}),g=(e,t)=>{let r={i:new Set,u:new Set},l={f:e},n=o;o=[];let s=u(e,r,t);s=(s??document).nodeType?s:new Text(s);for(let e of r.i)r.u.has(e)||(_(e),e.o.push(l));for(let e of o)e.t=s;return o=n,l.t=s},y=(e,t=S(),r)=>{let l={i:new Set,u:new Set},n={f:e,s:t};n.t=r??o?.push(n)??f,t.val=u(e,l,t.rawVal);for(let e of l.i)l.u.has(e)||(_(e),e.l.push(n));return t},b=(e,...t)=>{for(let r of t.flat(1/0)){let t=s(r??0),o=t===c?g(()=>r.val):t===a?g(r):r;o!=n&&e.append(o)}return e},m=(e,t,...r)=>{let[o,...l]=s(r[0]??0)===h?r:[{},...r],f=e?document.createElementNS(e,t):document.createElement(t);for(let[e,r]of Object.entries(o)){let o=t=>t?Object.getOwnPropertyDescriptor(t,e)??o(s(t)):n,l=t+","+e,h=i[l]??=o(s(f))?.set??0,d=e.startsWith("on")?(t,r)=>{let o=e.slice(2);f.removeEventListener(o,r),f.addEventListener(o,t)}:h?h.bind(f):f.setAttribute.bind(f,e),u=s(r??0);e.startsWith("on")||u===a&&(r=y(r),u=c),u===c?g(()=>(d(r.val,r.h),f)):d(r)}return b(f,l)},x=e=>({get:(t,r)=>m.bind(n,e,r)}),j=(e,t)=>t?t!==e&&e.replaceWith(t):e.remove(),v=()=>{let r=0,o=[...e].filter(e=>e.rawVal!==e.h);do{t=new Set;for(let e of new Set(o.flatMap(e=>e.l=w(e.l))))y(e.f,e.s,e.t),e.t=n}while(++r<100&&(o=[...t]).length);let l=[...e].filter(e=>e.rawVal!==e.h);e=n;for(let e of new Set(l.flatMap(e=>e.o=w(e.o))))j(e.t,g(e.f,e.t)),e.t=n;for(let e of l)e.h=e.rawVal};export default{tags:new Proxy(e=>new Proxy(m,x(e)),x()),hydrate:(e,t)=>j(e,g(t,e)),add:b,state:S,derive:y};

package/public/viewer.html

@@ -0,0 +1,30 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <title>Mayara - Marine Yacht Radar PPI</title>
+    <meta charset="utf-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1" />
+    <meta http-equiv="Cache-Control" content="no-cache, no-store, must-revalidate" />
+    <meta http-equiv="Pragma" content="no-cache" />
+    <meta http-equiv="Expires" content="0" />
+    <link type="text/css" rel="stylesheet" href="base.css?v=1" />
+    <link type="text/css" rel="stylesheet" href="layout.css?v=1" />
+    <link type="text/css" rel="stylesheet" href="controls.css?v=1" />
+    <link type="text/css" rel="stylesheet" href="responsive.css?v=1" />
+    <script type="module" src="viewer.js?v=44"></script>
+</head>
+<body>
+    <div class="myr_container">
+        <div id="myr_controller" class="myr_controller myr_controller_left">
+            <div id="myr_title">Radar Controls</div>
+            <div id="myr_error" class="myr_error" style="visibility: hidden;"></div>
+            <div id="myr_controls" class="myr_control"></div>
+        </div>
+        <div class="myr_ppi">
+            <canvas id="myr_canvas_background" width="600" height="600"></canvas>
+            <canvas id="myr_canvas_webgl" width="600" height="600"></canvas>
+            <canvas id="myr_canvas_overlay" width="600" height="600"></canvas>
+        </div>
+    </div>
+</body>
+</html>