292 lines
15 KiB
HTML
292 lines
15 KiB
HTML
<html>
|
|
<head>
|
|
<link rel="stylesheet" href="/steam_resource/css/2.css">
|
|
<link rel="stylesheet" href="/steam_resource/css/39.css">
|
|
<link rel="stylesheet" href="/steam_resource/css/library.css">
|
|
<script src="/static/library.js"></script>
|
|
<script>
|
|
const PLOT_HEIGHT = 200;
|
|
const PLOT_WIDTH = 270;
|
|
const OFFSET_X = 0;
|
|
const OFFSET_Y = 0;
|
|
// state
|
|
let curve = [];
|
|
let plotClickIsHandled = false;
|
|
|
|
// back-end
|
|
|
|
function setCurve(curve) {
|
|
return call_plugin_method("set_curve", {"curve": curve});
|
|
}
|
|
|
|
function getCurve() {
|
|
return call_plugin_method("get_curve", {});
|
|
}
|
|
|
|
function getCurvePoint(index) {
|
|
return call_plugin_method("get_curve_point", {"index": index});
|
|
}
|
|
|
|
function setCurvePoint(index, point) {
|
|
return call_plugin_method("set_curve_point", {"index": index, "point": point});
|
|
}
|
|
|
|
function addCurvePoint(point) {
|
|
return call_plugin_method("add_curve_point", {"point": point});
|
|
}
|
|
|
|
function removeCurvePoint(index) {
|
|
return call_plugin_method("remove_curve_point", {"index": index});
|
|
}
|
|
|
|
function setEnable(enable) {
|
|
return call_plugin_method("set_enable", {"enable": enable});
|
|
}
|
|
|
|
function getEnable() {
|
|
return call_plugin_method("get_enable", {});
|
|
}
|
|
|
|
function setInterpol(enable) {
|
|
return call_plugin_method("set_interpol", {"interpolate": enable});
|
|
}
|
|
|
|
function getInterpol() {
|
|
return call_plugin_method("get_interpol", {});
|
|
}
|
|
|
|
function getFanRpm() {
|
|
return call_plugin_method("get_fan_rpm", {});
|
|
}
|
|
|
|
function getTemperature() {
|
|
return call_plugin_method("get_temperature", {});
|
|
}
|
|
|
|
function setPlotSize(x, y) {
|
|
return call_plugin_method("set_plot_size", {"x": x, "y": y});
|
|
}
|
|
|
|
// events
|
|
|
|
async function onload_body() {
|
|
let hiderDiv = document.getElementById("hiderDiv");
|
|
let graphDiv = document.getElementById("graphDiv");
|
|
await setPlotSize(PLOT_WIDTH, PLOT_HEIGHT);
|
|
const state_controlToggle = await getEnable(); // retrieve from back-end
|
|
setToggleState(document.getElementById("controlToggle"), state_controlToggle);
|
|
const state_interpolToggle = await getInterpol(); // retrieve from back-end
|
|
setToggleState(document.getElementById("interpolToggle"), state_interpolToggle);
|
|
showHideElement(hiderDiv, state_controlToggle);
|
|
if (state_controlToggle) {
|
|
curve = await getCurve();
|
|
buildCurvePlot(curve);
|
|
}
|
|
window.setInterval(pollStats, 500);
|
|
console.log("Loaded");
|
|
}
|
|
|
|
async function onclick_graphDiv(e) {
|
|
console.log("Click @ (" + e.layerX.toString() + ", " + e.layerY.toString() + ")");
|
|
if (plotClickIsHandled) {
|
|
plotClickIsHandled = false;
|
|
} else {
|
|
await addCurvePoint({"x": (e.layerX - OFFSET_X) / PLOT_WIDTH, "y": (e.layerY - OFFSET_Y) / PLOT_HEIGHT});
|
|
curve = await getCurve();
|
|
buildCurvePlot(curve);
|
|
}
|
|
}
|
|
|
|
async function onclick_controlToggle() {
|
|
console.log("Click @ controlToggle");
|
|
let hiderDiv = document.getElementById("hiderDiv");
|
|
let graphDiv = document.getElementById("graphDiv");
|
|
let controlToggle = document.getElementById("controlToggle");
|
|
const state_controlToggle = getToggleState(controlToggle);
|
|
await setEnable(!state_controlToggle); // notify back-end
|
|
setToggleState(controlToggle, !state_controlToggle);
|
|
if (!state_controlToggle) {
|
|
curve = await getCurve();
|
|
buildCurvePlot(curve);
|
|
}
|
|
showHideElement(hiderDiv, !state_controlToggle);
|
|
}
|
|
|
|
async function onclick_interpolToggle() {
|
|
console.log("Click @ interpolToggle");
|
|
let interpolToggle = document.getElementById("interpolToggle");
|
|
const state_interpolToggle = getToggleState(interpolToggle);
|
|
await setInterpol(!state_interpolToggle); // notify back-end
|
|
setToggleState(interpolToggle, !state_interpolToggle);
|
|
}
|
|
|
|
async function onclick_plotPoint(e, index) {
|
|
console.log("Click @ plotPoint " + index.toString());
|
|
plotClickIsHandled = true; // this must be before the first async call (janky!)
|
|
await removeCurvePoint(index);
|
|
curve = await getCurve();
|
|
buildCurvePlot(curve);
|
|
//e.stopPropogation();
|
|
}
|
|
|
|
// common
|
|
|
|
function buildCurvePlot(curve_points) {
|
|
let graphDiv = document.getElementById("graphDiv");
|
|
let newStr = "<span style=\"font-size:x-small;position:absolute;left:1px;top:-1px;\">100%</span><span style=\"font-size:x-small;position:absolute;left:1px;bottom:-1px;\">0</span><span style=\"font-size:x-small;position:absolute;left:-2px;bottom:50%;writing-mode:vertical-lr;text-orientation:mixed;\">Fan</span><span style=\"font-size:x-small;position:absolute;right:1px;bottom:-1px;\">100</span><span style=\"font-size:x-small;position:absolute;left:35%;bottom:-1px;\">Temperature (°C)</span>";
|
|
for (let i = 0; i < curve_points.length; i++) {
|
|
const point = curve_points[i];
|
|
newStr += "<span style=\"position:absolute;"
|
|
newStr += "top:" + Math.round(point["y"]*PLOT_HEIGHT + OFFSET_Y + 1).toString() + "px;left:" + Math.round(point["x"]*PLOT_WIDTH + OFFSET_X + 1).toString() + "px;";
|
|
newStr += "width:8px;height:8px;background-color:#1a9fff;border-radius:4px\" id=\"plotPoint";
|
|
newStr += i.toString() + "\" onclick=\"onclick_plotPoint(event," + i.toString() + ")\"></span>";
|
|
}
|
|
//graphDiv.innerHTML = "";
|
|
graphDiv.innerHTML = newStr;
|
|
console.log("Fan graph redrawn");
|
|
}
|
|
|
|
function pollStats() {
|
|
/*getFanRpm().then(speed => {
|
|
let fanNow = document.getElementById("fanNow");
|
|
fanNow.innerText = speed.toString() + " RPM";
|
|
});
|
|
sleep(1).then(_ => {});
|
|
getTemperature().then(temp => {
|
|
let tempNow = document.getElementById("tempNow");
|
|
tempNow.innerText = temp.toString() + " °C";
|
|
});
|
|
sleep(1).then(_ => {});*/
|
|
pollStatsAsync().then(_ => {});
|
|
}
|
|
|
|
async function pollStatsAsync() {
|
|
let fanNow = document.getElementById("fanNow");
|
|
let tempNow = document.getElementById("tempNow");
|
|
|
|
const speed = await getFanRpm();
|
|
const temp = await getTemperature();
|
|
|
|
fanNow.innerText = speed.toString() + " RPM";
|
|
tempNow.innerText = temp.toString() + " °C";
|
|
}
|
|
|
|
function showHideElement(elem, visible) {
|
|
if (visible) {
|
|
elem.style.visibility = "visible";
|
|
elem.style.height = "auto";
|
|
} else {
|
|
elem.style.visibility = "hidden";
|
|
elem.style.height = "0px";
|
|
}
|
|
}
|
|
|
|
const TOGGLE_ON_CLASS = "gamepaddialog_On_3ld7T"
|
|
|
|
function setToggleState(toggle, state) {
|
|
if (state && !toggle.classList.contains(TOGGLE_ON_CLASS)) {
|
|
toggle.classList.add(TOGGLE_ON_CLASS);
|
|
}
|
|
|
|
if (!state && toggle.classList.contains(TOGGLE_ON_CLASS)) {
|
|
toggle.classList.remove(TOGGLE_ON_CLASS);
|
|
}
|
|
}
|
|
|
|
function getToggleState(toggle) {
|
|
return toggle.classList.contains(TOGGLE_ON_CLASS);
|
|
}
|
|
|
|
function sleep(ms) {
|
|
return new Promise(resolve => setTimeout(resolve, ms));
|
|
}
|
|
</script>
|
|
</head>
|
|
<body onload="onload_body()" style="overflow-x:hidden;margin:0px;">
|
|
<!-- Spacer (moves top out of shadow above it) -->
|
|
<div class="quickaccessmenu_TabGroupPanel_1QO7b">
|
|
<div class="quickaccesscontrols_PanelSection_2C0g0" style="margin-bottom:6px;">
|
|
<!--<div class="quickaccesscontrols_PanelSectionRow_2VQ88">
|
|
</div>-->
|
|
</div>
|
|
</div>
|
|
<div class="quickaccessmenu_TabGroupPanel_1QO7b Panel Focusable">
|
|
<div class="quickaccesscontrols_PanelSection_2C0g0" style="padding:0px 4px;">
|
|
<div class="quickaccesscontrols_PanelSectionRow_2VQ88">
|
|
<div class="gamepaddialog_Field_S-_La gamepaddialog_WithFirstRow_qFXi6 gamepaddialog_VerticalAlignCenter_3XNvA gamepaddialog_WithDescription_3bMIS gamepaddialog_WithBottomSeparatorStandard_3s1Rk gamepaddialog_ExtraPaddingOnChildrenBelow_5UO-_ gamepaddialog_StandardPadding_XRBFu gamepaddialog_HighlightOnFocus_wE4V6 Panel Focusable" style="--indent-level:0;">
|
|
<div class="gamepaddialog_FieldLabelRow_H9WOq">
|
|
<div class="gamepaddialog_FieldLabel_3b0U-">
|
|
Custom Fan Curve
|
|
</div>
|
|
<div class="gamepaddialog_FieldChildren_14_HB">
|
|
<div id="controlToggle" tabindex="0" class="gamepaddialog_Toggle_24G4g Focusable" onclick="onclick_controlToggle()">
|
|
<div class="gamepaddialog_ToggleRail_2JtC3"></div>
|
|
<div class="gamepaddialog_ToggleSwitch_3__OD"></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="gamepaddialog_FieldDescription_2OJfk">Overrides SteamOS fan curve</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div id="hiderDiv">
|
|
<div id="graphDiv" style="height:200px;width:270px;border:1px solid #1a9fff;position:relative;background-color:#1a1f2c;border-radius:4px;margin:auto;" onclick="onclick_graphDiv(event)">
|
|
Some text to show that something is broken :(
|
|
</div>
|
|
<div style="font-size:x-small; text-align:center;">
|
|
Click to add/remove points on the fan curve.
|
|
</div>
|
|
<div class="quickaccessmenu_TabGroupPanel_1QO7b Panel Focusable">
|
|
<div class="quickaccesscontrols_PanelSection_2C0g0" style="padding:0px 4px;">
|
|
<div class="quickaccesscontrols_PanelSectionRow_2VQ88">
|
|
<div class="gamepaddialog_Field_S-_La gamepaddialog_WithFirstRow_qFXi6 gamepaddialog_VerticalAlignCenter_3XNvA gamepaddialog_WithDescription_3bMIS gamepaddialog_WithBottomSeparatorStandard_3s1Rk gamepaddialog_ExtraPaddingOnChildrenBelow_5UO-_ gamepaddialog_StandardPadding_XRBFu gamepaddialog_HighlightOnFocus_wE4V6 Panel Focusable" style="--indent-level:0;">
|
|
<div class="gamepaddialog_FieldLabelRow_H9WOq">
|
|
<div class="gamepaddialog_FieldLabel_3b0U-">
|
|
Linear Interpolation
|
|
</div>
|
|
<div class="gamepaddialog_FieldChildren_14_HB">
|
|
<div id="interpolToggle" tabindex="0" class="gamepaddialog_Toggle_24G4g Focusable" onclick="onclick_interpolToggle()">
|
|
<div class="gamepaddialog_ToggleRail_2JtC3"></div>
|
|
<div class="gamepaddialog_ToggleSwitch_3__OD"></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="gamepaddialog_FieldDescription_2OJfk">Pretends a straight line connects points</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!-- Fan Info -->
|
|
<div class="quickaccesscontrols_PanelSection_2C0g0" onclick="updateBatteryStats()" style="margin-bottom:0px;">
|
|
<!--<div class="quickaccesscontrols_PanelSectionTitle_1IigU">
|
|
<div class="quickaccesscontrols_Text_1cokl">Fan</div>
|
|
</div>-->
|
|
<div class="Panel Focusable" tabindex="0">
|
|
<div class="quickaccesscontrols_PanelSectionRow_2VQ88">
|
|
<div class="gamepaddialog_Field_S-_La gamepaddialog_WithFirstRow_qFXi6 gamepaddialog_VerticalAlignCenter_3XNvA gamepaddialog_InlineWrapShiftsChildrenBelow_pHUb6 gamepaddialog_WithBottomSeparatorStandard_3s1Rk gamepaddialog_StandardPadding_XRBFu gamepaddialog_HighlightOnFocus_wE4V6 Panel Focusable" style="--indent-level:0;padding-left:0px;padding-right:0px;">
|
|
<div class="gamepaddialog_FieldLabelRow_H9WOq">
|
|
<div class="gamepaddialog_FieldLabel_3b0U-">Current Fan Speed</div>
|
|
<div class="gamepaddialog_FieldChildren_14_HB">
|
|
<div class="gamepaddialog_LabelFieldValue_5Mylh" id="fanNow"> (|-_-|) </div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="Panel Focusable" tabindex="0">
|
|
<div class="quickaccesscontrols_PanelSectionRow_2VQ88">
|
|
<div class="gamepaddialog_Field_S-_La gamepaddialog_WithFirstRow_qFXi6 gamepaddialog_VerticalAlignCenter_3XNvA gamepaddialog_InlineWrapShiftsChildrenBelow_pHUb6 gamepaddialog_WithBottomSeparatorStandard_3s1Rk gamepaddialog_StandardPadding_XRBFu gamepaddialog_HighlightOnFocus_wE4V6 Panel Focusable" style="--indent-level:0;padding-left:0px;padding-right:0px;">
|
|
<div class="gamepaddialog_FieldLabelRow_H9WOq">
|
|
<div class="gamepaddialog_FieldLabel_3b0U-">Current Temperature</div>
|
|
<div class="gamepaddialog_FieldChildren_14_HB">
|
|
<div class="gamepaddialog_LabelFieldValue_5Mylh" id="tempNow"> (|-_-|) </div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</body>
|
|
</html>
|