Screen Brightness in JavaScript: WebInto.app `app` Bridge (GET, SET & RESET)

person Web2App Team calendar_today May 12, 2026
Screen Brightness in JavaScript: WebInto.app `app` Bridge (GET, SET & RESET) image

When your website runs inside WebInto.app, you may want to dim the display for reading modes, video overlays, or accessibility—and then restore or reset behaviour. The app bridge lets you read, set, and reset brightness for this app’s window; it does not push a new system-wide level that other apps must follow.

SET_BRIGHTNESS uses a level between 0 (dimmest) and 1 (brightest). The app clamps out-of-range values. GET_BRIGHTNESS usually returns params.brightness in [0, 1] while your app is forcing a level. brightness can be -1 when there is no window override yet—for example before the first SET_BRIGHTNESS, or on Android after RESET_BRIGHTNESS, meaning the window is following system brightness again instead of a fixed level.

RESET_BRIGHTNESS clears that override so normal platform behaviour applies again (details below).

This tutorial documents GET_BRIGHTNESS, SET_BRIGHTNESS, RESET_BRIGHTNESS, the JSON response shape, and a safe JavaScript pattern that waits for window.Native (same idea as the custom HTML no-internet screen guide).


When to use the app bridge for brightness

Scenario Suggested approach
Reader / “night mode” page in the WebView SET_BRIGHTNESS lower, then restore or RESET_BRIGHTNESS when leaving
Show current brightness in your UI GET_BRIGHTNESS, display params.brightness (treat -1 as “following system / not overridden”)
Done dimming—give brightness back to the system RESET_BRIGHTNESS
Same HTML in desktop Chrome No window.Native — branch your code (see tip below)

Your page uses the app bridge name in Native.call—the WebInto app handles the rest on the device side.


Tip: Only run brightness code inside WebInto.app

If your URL is also opened in a normal browser, guard calls so you never assume Native.call exists:

function canUseNativeBridge() {
    return typeof window !== 'undefined' && window.Native && typeof window.Native.call === 'function';
}

async function setBrightnessIfInApp(value) {
    if (!canUseNativeBridge()) {
        console.info('Brightness bridge unavailable — likely outside WebInto.app.');
        return null;
    }
    return callAppBridge({ action: 'SET_BRIGHTNESS', payload: { brightness: value } });
}

You can combine this with a custom User-Agent suffix (for example WebIntoApp/1.0 appended in the WebView settings) so your script chooses bridge path vs standard web behaviour, similar to the OneSignal JavaScript bridge tutorial—User-Agent is for UX branching only, not security.


Calling from JavaScript

Use window.Native.call(methodName, paramsObject) like other bridge guides.

Method name: app

Params object:

Field Type Required Description
action string Yes GET_BRIGHTNESS, SET_BRIGHTNESS, or RESET_BRIGHTNESS (case-insensitive).
payload object or null Varies For SET_BRIGHTNESS, must include numeric brightness. For GET_BRIGHTNESS and RESET_BRIGHTNESS, null or {} is fine.

Helper (same “wait for the app bridge” idea as the no-internet screen guide):

async function callAppBridge(body) {
    if (typeof window.waitForNative === 'function') {
        const ready = await window.waitForNative(2000);
        if (!ready) {
            console.warn('App bridge not ready');
            return null;
        }
    } else if (!window.Native) {
        console.warn('window.Native is not available');
        return null;
    }
    return window.Native.call('app', body);
}

Response format

The app returns a JSON string (parse if your wrapper returns a string). Typical shape:

Field Type Description
status boolean true on success.
message string or omitted Error text when status is false.
params object or omitted On GET_BRIGHTNESS success, includes brightness: usually [0, 1] while a level is forced; -1 when the window is not overriding brightness (see GET_BRIGHTNESS below).

GET_BRIGHTNESS

Reads the brightness used for this app’s window. params.brightness is usually a number in [0, 1] while your content has a forced level.

-1 means there is no window brightness override in effect—for example you have not called SET_BRIGHTNESS yet, or on Android you have just used RESET_BRIGHTNESS, so the activity follows system brightness again rather than a fixed app level.

Request

{ "action": "GET_BRIGHTNESS", "payload": null }

Response (success) — forced level

{
  "status": true,
  "params": {
    "brightness": 0.65
  }
}

Response (success) — no override (-1)

{
  "status": true,
  "params": {
    "brightness": -1
  }
}

Do not send -1 to SET_BRIGHTNESS (only [0, 1] is valid there).


RESET_BRIGHTNESS

Stops forcing a custom level and returns to normal platform behaviour for this app’s window.

  • Android: Clears the window brightness override so system brightness applies again for that activity.
  • iOS: There is no public “clear system brightness” API. The app restores the level that was current the first time setBrightness ran in this session, then clears that saved value. If you never called SET_BRIGHTNESS, this action succeeds but may not visibly change the screen.

Request

{ "action": "RESET_BRIGHTNESS", "payload": null }

Response (success)

{ "status": true }

SET_BRIGHTNESS

Sets screen brightness. payload is required and must contain brightness as a JSON number (integer or float).

Request

{
  "action": "SET_BRIGHTNESS",
  "payload": { "brightness": 0.8 }
}

Response (success)

{ "status": true }

Response (missing or invalid brightness)

If brightness is absent, not a number, or cannot be decoded:

{
  "status": false,
  "message": "please send brightness in payload as a number between 0 and 1."
}

Send values in [0, 1]; values outside that range are clamped on the app side. Only this app’s window is affected, not global system brightness for other apps.


Invalid action / malformed body

If the JSON cannot be parsed into a valid bridge message, you may receive:

{
  "status": false,
  "message": "please send valid parameters see docs."
}

Example: dim for reading, then restore or reset

Option A — restore a previous numeric level (use when you captured a real [0, 1] value; do not call SET_BRIGHTNESS with -1 on Android):

const parse = (raw) => (typeof raw === 'string' ? JSON.parse(raw) : raw);

async function dimTemporarily(level = 0.35) {
    const before = parse(await callAppBridge({ action: 'GET_BRIGHTNESS', payload: null }));
    if (!before.status || before.params == null) return;

    const previous = before.params.brightness;
    await callAppBridge({ action: 'SET_BRIGHTNESS', payload: { brightness: level } });

    return () => {
        if (previous === -1 || previous < 0) return Promise.resolve();
        return callAppBridge({ action: 'SET_BRIGHTNESS', payload: { brightness: previous } });
    };
}

// usage
const restore = await dimTemporarily(0.3);
// later: await restore?.();

Option B — clear the override in the app (Android: system brightness for the window again; iOS: behaviour described under RESET_BRIGHTNESS above):

await callAppBridge({ action: 'RESET_BRIGHTNESS', payload: null });

UX note: Restoring on page hide (pagehide / visibilitychange) avoids leaving users on a dim screen if they navigate away without calling restore.


Summary

WebInto.app screen brightness from JavaScript uses Native.call('app', { action, payload }) with GET_BRIGHTNESS, SET_BRIGHTNESS, or RESET_BRIGHTNESS. SET only affects this app’s window, not other apps. GET returns brightness: -1 when there is no override (unset or, on Android, after RESET); otherwise [0, 1]. Use Option A (save → set → restore a real number) or Option B (RESET_BRIGHTNESS) when you want the platform to take over again.

To reload the page or use error-screen actions, see the custom HTML no-internet screen guide (web bridge with RELOAD)—not the app bridge.

Web2App app icon

Ready to start?

Convert your website into an Android app

Install Web2App and build your APK in minutes. No coding required.

Get it on Google Play