Skip to content

Commit

Permalink
Brightness soft limits implemented for environment and device depende…
Browse files Browse the repository at this point in the history
…d adjustments.
  • Loading branch information
BlueAndi committed Dec 22, 2024
1 parent 1e06196 commit 2688bfb
Show file tree
Hide file tree
Showing 9 changed files with 487 additions and 299 deletions.
170 changes: 106 additions & 64 deletions data/display.html
Original file line number Diff line number Diff line change
Expand Up @@ -62,34 +62,51 @@ <h1 class="mt-5">Display</h1>
<li>Yellow shaded: Slot is sticky. Slot scheduling is stopped.</li>
<li>Red/Yellow shaded: Slot is sticky and locked.</li>
</ul>
<p>
<button class="btn btn-light" type="button" onclick="prevSlot()" disabled>Previous slot</button>
<button class="btn btn-light" type="button" onclick="nextSlot()" disabled>Next slot</button>
</p>
<p>Currently active fade effect: <span id="lableFadeEffect"> Linear</span></p>
<p><button class="btn btn-light" type="button" onclick="nextEffect()" disabled>Next fade effect</button></p>
<p>
<div class="form-group">
<select class="form-select" id="pluginToInstall" size="1">
</select>
<br />
<button class="btn btn-light" type="button" onclick="install()" disabled>Install</button>
</div>
</p>
<p>
<div class="form-group">
<label class="form-label" for="bAutoBrightnessCtrl">Automatic brightness control:</label>
<button class="btn btn-light" id="bAutoBrightnessCtrl" type="button" onclick="changeAutoBrightnessCtrl()" disabled>?</button>
</div>
<div class="form-group">
<label class="form-label" for="brightness">Brightness:</label>
<div class="text-primary" id="brightness">?</div>
</div>
<div class="h-100 p-5 bg-body-tertiary border rounded-3 mt-2">
<form>
<div class="form-group">
<label class="form-label" for="sliderBrightness">Change brightness:</label>
<input type="range" class="form-range" id="sliderBrightness" min="25" max="255" onchange="changeBrightness()" disabled />
</div>
</p>
<button class="btn btn-light" type="button" onclick="prevSlot()" disabled>Previous slot</button>
<button class="btn btn-light" type="button" onclick="nextSlot()" disabled>Next slot</button>
</div>
<div class="form-group">
<label class="form-label" for="bNextEffect">Currently active fade effect: <span id="lableFadeEffect"> Linear</span></label>
<button class="btn btn-light" id="bNextEffect" type="button" onclick="nextEffect()" disabled>Next fade effect</button>
</div>
</form>
</div>
<div class="h-100 p-5 bg-body-tertiary border rounded-3 mt-2">
<form>
<div class="form-group">
<select class="form-select" id="pluginToInstall" size="1">
</select>
<br />
<button class="btn btn-light" type="button" onclick="install()" disabled>Install</button>
</div>
</form>
</div>
<div class="h-100 p-5 bg-body-tertiary border rounded-3 mt-2">
<form>
<div class="form-group">
<label class="form-label" for="bAutoBrightnessCtrl">Automatic brightness control:</label>
<button class="btn btn-light" id="bAutoBrightnessCtrl" type="button" value="false" onclick="triggerAutoBrightnessCtrl();changeBrightness();" disabled>?</button>
</div>
<div class="form-group">
<label class="form-label" for="currentBrightness">Current Brightness:</label>
<div class="text-primary" id="currentBrightnessValue">?</div>
<input type="range" class="form-range" id="currentBrightness" min="0" max="255" onchange="changeBrightness();" oninput="$('#currentBrightnessValue').text(calcPercentage(this.value) + ' %')" disabled />
</div>
<div class="form-group">
<label class="form-label" for="minBrightness">Min. brightness soft limit:</label>
<div class="text-primary" id="minBrightnessValue">?</div>
<input type="range" class="form-range" id="minBrightness" min="0" max="255" onchange="changeBrightness();" oninput="$('#minBrightness').text(calcPercentage(this.value) + ' %')" disabled />
</div>
<div class="form-group">
<label class="form-label" for="maxBrightness">Max. brightness soft limit:</label>
<div class="text-primary" id="maxBrightnessValue">?</div>
<input type="range" class="form-range" id="maxBrightness" min="0" max="255" onchange="changeBrightness();" oninput="$('#maxBrightnessValue').text(calcPercentage(this.value) + ' %')" disabled />
</div>
</form>
</div>
</div>
</main>

Expand Down Expand Up @@ -125,8 +142,6 @@ <h1 class="mt-5">Display</h1>
var wsClient = new pixelix.ws.Client();
var isPageUnload = false;
var plugins = []; // List of all available plugins
var autoBrightnessCtrl = false; // Is automatic brightness control enabled or disabled?
var brightness = 0; // Brightness [0; 255]
var currentFadeEffect = 0 // Fade effect [1;3]

const PIXEL_WIDTH = 10; // Width of a single LED in pixels
Expand All @@ -145,8 +160,14 @@ <h1 class="mt-5">Display</h1>

/* Enable all UI elements. */
function enableUI() {
var automaticBrightnessControl = $("#bAutoBrightnessCtrl").val() === "true";

$("main :button").prop("disabled", false);
$("main :input").prop("disabled", false);

if (true == automaticBrightnessControl) {
$("#currentBrightness").prop("disabled", true);
}
}

/* If websocket connection is unexpectedly closed, clean up. */
Expand Down Expand Up @@ -669,55 +690,76 @@ <h1 class="mt-5">Display</h1>
});
}

function updateBrightness() {
var brightnessInPercent = (brightness * 100 / 255).toFixed(2);
$("#brightness").text("" + brightnessInPercent + " %");
$("#sliderBrightness").val(brightness);
function calcPercentage(value) {
return (value * 100 / 255).toFixed(1);
}

function changeBrightness() {
disableUI();
function updateCurrentBrightness(brightness) {
var brightnessInPercent = calcPercentage(brightness);
$("#currentBrightnessValue").text("" + brightnessInPercent + " %");
$("#currentBrightness").val(brightness);
}

wsClient.setBrightness({
brightness: parseInt(document.getElementById("sliderBrightness").value)
}).then(function(rsp) {
brightness = rsp.brightness;
autoBrightnessCtrl = rsp.automaticBrightnessControl;
updateAutoBrightnessCtrl();
updateBrightness();
}).catch(function(err) {
if ("undefined" !== typeof err) {
console.error(err);
}
updateBrightness();
return dialog.showError("<p>Changing brightness failed.</p>");
}).finally(function() {
enableUI();
});
function updateMinBrightness(minBrightness) {
var minBrightnessInPercent = calcPercentage(minBrightness);
$("#minBrightnessValue").text("" + minBrightnessInPercent + " %");
$("#minBrightness").val(minBrightness);
}

function updateMaxBrightness(maxBrightness) {
var maxBrightnessInPercent = calcPercentage(maxBrightness);
$("#maxBrightnessValue").text("" + maxBrightnessInPercent + " %");
$("#maxBrightness").val(maxBrightness);
}

function updateAutoBrightnessCtrl() {
function updateAutoBrightnessCtrl(autoBrightnessCtrl) {
if (false === autoBrightnessCtrl) {
$("#bAutoBrightnessCtrl").text("Enable");
$("#bAutoBrightnessCtrl").val("false");
$("#currentBrightness").prop("disabled", false);
} else {
$("#bAutoBrightnessCtrl").text("Disable");
$("#bAutoBrightnessCtrl").val("true");
$("#currentBrightness").prop("disabled", true);
}
}

function changeAutoBrightnessCtrl() {
function triggerAutoBrightnessCtrl() {
var autoBrightnessCtrl = $("#bAutoBrightnessCtrl").val() === "true";

if (false === autoBrightnessCtrl) {
$("#bAutoBrightnessCtrl").text("Disable");
$("#bAutoBrightnessCtrl").val("true");
} else {
$("#bAutoBrightnessCtrl").text("Enable");
$("#bAutoBrightnessCtrl").val("false");
}
}

function changeBrightness() {
var currentBrightness = parseInt($("#currentBrightness").val());
var minBrightness = parseInt($("#minBrightness").val());
var maxBrightness = parseInt($("#maxBrightness").val());
var autoBrightnessCtrl = $("#bAutoBrightnessCtrl").val() === "true";

disableUI();
wsClient.setBrightness({
brightness: brightness,
automaticBrightnessControl: (false == autoBrightnessCtrl) ? true : false
brightness: currentBrightness,
minBrightness: minBrightness,
maxBrightness: maxBrightness,
automaticBrightnessControl: autoBrightnessCtrl
}).then(function(rsp) {
brightness = rsp.brightness;
autoBrightnessCtrl = rsp.automaticBrightnessControl;
updateAutoBrightnessCtrl();
updateBrightness();
updateCurrentBrightness(rsp.brightness);
updateMinBrightness(rsp.minBrightness);
updateMaxBrightness(rsp.maxBrightness);
updateAutoBrightnessCtrl(rsp.automaticBrightnessControl);
}).catch(function(err) {
if ("undefined" !== typeof err) {
console.error(err);
}
return dialog.showError("<p>Changing automatic brightness control failed.</p>");
return dialog.showError("<p>Changing brightness failed.</p>");
}).finally(function() {
enableUI();
});
}

Expand Down Expand Up @@ -756,10 +798,10 @@ <h1 class="mt-5">Display</h1>
/* Get brightness information */
return wsClient.getBrightness();
}).then(function(rsp) {
brightness = rsp.brightness;
autoBrightnessCtrl = rsp.automaticBrightnessControl;
updateAutoBrightnessCtrl();
updateBrightness();
updateCurrentBrightness(rsp.brightness);
updateMinBrightness(rsp.minBrightness);
updateMaxBrightness(rsp.maxBrightness);
updateAutoBrightnessCtrl(rsp.automaticBrightnessControl);
}).then(function(rsp) {
/* Get fadeEffect information */
return wsClient.getFadeEffect();
Expand Down
21 changes: 15 additions & 6 deletions data/js/ws.js
Original file line number Diff line number Diff line change
Expand Up @@ -178,7 +178,9 @@ pixelix.ws.Client.prototype._onMessage = function(msg) {
this._pendingCmd.resolve(rsp);
} else if ("BRIGHTNESS" === this._pendingCmd.name) {
rsp.brightness = parseInt(data[0]);
rsp.automaticBrightnessControl = (1 === parseInt(data[1])) ? true : false;
rsp.minBrightness = parseInt(data[1]);
rsp.maxBrightness = parseInt(data[2]);
rsp.automaticBrightnessControl = (1 === parseInt(data[3])) ? true : false;
this._pendingCmd.resolve(rsp);
} else if ("BUTTON" === this._pendingCmd.name) {
this._pendingCmd.resolve(rsp);
Expand Down Expand Up @@ -325,14 +327,21 @@ pixelix.ws.Client.prototype.setBrightness = function(options) {
reject();
} else if ("number" !== typeof options.brightness) {
reject();
} else if ("number" !== typeof options.minBrightness) {
reject();
} else if ("number" !== typeof options.maxBrightness) {
reject();
} else if ("boolean" !== typeof options.automaticBrightnessControl) {
reject();
} else {

par += options.brightness;

if ("boolean" === typeof options.automaticBrightnessControl) {
par += ";";
par += (false == options.automaticBrightnessControl) ? 0 : 1;
}
par += ";";
par += options.minBrightness;
par += ";";
par += options.maxBrightness;
par += ";";
par += (false == options.automaticBrightnessControl) ? 0 : 1;

this._sendCmd({
name: "BRIGHTNESS",
Expand Down
4 changes: 2 additions & 2 deletions lib/SettingsService/src/SettingsService.cpp
Original file line number Diff line number Diff line change
Expand Up @@ -243,7 +243,7 @@ static const size_t MIN_VALUE_WEB_LOGIN_PASSWORD = 4U;
/** Hostname min. length */
static const size_t MIN_VALUE_HOSTNAME = 1U;

/** Brightness min. value in % */
/** Brightness min. value in %. Its a hard limit. The soft limit can be adjusted by the user. */
static const uint8_t MIN_VALUE_BRIGHTNESS = 10U;

/* MIN_VALUE_AUTO_BRIGHTNESS_CTRL */
Expand Down Expand Up @@ -291,7 +291,7 @@ static const size_t MAX_VALUE_WEB_LOGIN_PASSWORD = 32U;
/** Hostname max. length */
static const size_t MAX_VALUE_HOSTNAME = 63U;

/** Brightness max. value in % */
/** Brightness max. value in %. Its a hard limit. The soft limit can be adjusted by the user. */
static const uint8_t MAX_VALUE_BRIGHTNESS = 100U;

/* MAX_VALUE_AUTO_BRIGHTNESS_CTRL */
Expand Down
Loading

0 comments on commit 2688bfb

Please sign in to comment.