diff --git a/README.md b/README.md index 4243364..b46c303 100644 --- a/README.md +++ b/README.md @@ -29,24 +29,25 @@ THIS IS THE 2.0.0 DEVELOPMENT BRANCH, NOT GUARANTIED TO WORK - API changes by @eringerli ✅ - less updateControl functions ✅ - proper wrappers for all create/update actions ✅ -- OptionList by @eringerli - Min Max on slider by @eringerli ✅ -- Public Access to ESPAsyncServer -- Accelerometer Widget -- Graph Widget -- -- Cleanup Example, DNS and autojoin -- Cleanup and extend Documentation +- OptionList by @eringerli ✅ +- Public Access to ESPAsyncServer ✅ +- Graph Widget ✅ + +* Cleanup Example, DNS and autojoin +* Cleanup and extend Documentation - Number field ✅ - Text field ✅ - Data directory ✅ - Graph Usage - - Accelerometer - Slider - OptionList - Tab usage - Verbosity setting +To check: +data upload new info to doc? + ## OLD Roadmap : - Datagraph output -> _WIP_ diff --git a/data/js/controls.js b/data/js/controls.js index 7ccbfd4..65d1580 100644 --- a/data/js/controls.js +++ b/data/js/controls.js @@ -70,6 +70,8 @@ const C_NONE = 255; var graphData = new Array(); +var hasAccel = false; + function colorClass(colorId) { colorId = Number(colorId); switch (colorId) { @@ -104,6 +106,57 @@ function colorClass(colorId) { var websock; var websockConnected = false; +function requestOrientationPermission() { + /* + // Currently this fails, since it needs secure context on IOS safari + if (typeof DeviceMotionEvent.requestPermission === "function") { + DeviceOrientationEvent.requestPermission() + .then(response => { + if (response == "granted") { + window.addEventListener("deviceorientation", handleOrientation); + } + }) + .catch(console.error); + } else { + // Non IOS 13 + window.addEventListener("deviceorientation", handleOrientation); + } + */ +} +/* +function handleOrientation(event) { + var x = event.beta; // In degree in the range [-180,180] + var y = event.gamma; // In degree in the range [-90,90] + + var output = document.querySelector(".output"); + output.innerHTML = "beta : " + x + "\n"; + output.innerHTML += "gamma: " + y + "\n"; + + // Because we don't want to have the device upside down + // We constrain the x value to the range [-90,90] + if (x > 90) { + x = 90; + } + if (x < -90) { + x = -90; + } + + // To make computation easier we shift the range of + // x and y to [0,180] + x += 90; + y += 90; + + // 10 is half the size of the ball + // It center the positioning point to the center of the ball + var ball = document.querySelector(".ball"); + var garden = document.querySelector(".garden"); + var maxX = garden.clientWidth - ball.clientWidth; + var maxY = garden.clientHeight - ball.clientHeight; + ball.style.top = (maxY * y) / 180 - 10 + "px"; + ball.style.left = (maxX * x) / 180 - 10 + "px"; +} +*/ + function restart() { $(document) .add("*") @@ -157,7 +210,7 @@ function start() { var center = ""; switch (data.type) { case UI_INITIAL_GUI: - data.controls.forEach((element) => { + data.controls.forEach(element => { var fauxEvent = { data: JSON.stringify(element) }; @@ -628,12 +681,14 @@ function start() { break; case UI_ACCEL: + if (hasAccel) break; var parent; if (data.parentControl) { parent = $("#tab" + data.parentControl); } else { parent = $("#row"); } + hasAccel = true; parent.append( "
" + "
" ); + + requestOrientationPermission(); break; case UPDATE_LABEL: