Connected Now Playing

Show album artwork, a scrolling track title, and the artist while laying out the pieces needed for a provider connection. Demo mode is fully runnable; the live path intentionally uses placeholder provider URLs and credentials.

Complete app

app.star

load("encoding/base64.star", "base64")
load("encoding/json.star", "json")
load("http.star", "http")
load("render.star", "render")
load("schema.star", "schema")
load("secret.star", "secret")

DEMO_MODE = True
ENCRYPTED_CLIENT_TOKEN = "..."
DEMO_ART = """iVBORw0KGgoAAAANSUhEUgAAABkAAAAYCAMAAAA4a6b0AAAAJ1BMVEUAAABBJBb+0wvT
min//vr71QQEBAT///cMCQQBCwD6zwT/0BL31g9Dk4qKAAAAAXRSTlMAQObYZgAAAItJ
REFUKM99ktkSgCAIRQW1bPn/7w1kycg6T8TpojOYkgJGegKASn466hdCVIYxYG2mupIA
DujELhDn5kU/a/miGzrGG6WsagDpS2oa4zWN+zNt00FYd61a64b/lMixe6lmdm8ymY
vg622iYuPKcGHmHblVZkZBJqZ8eRAGjgvX2Bm3LTFj8nrCq7oAcPEFwi8JX50AAAAAS
UVORK5CYII="""

DEMO_TRACK = {
    "title": "Neon Skyline",
    "artist": "The Pixels",
    "artwork": DEMO_ART,
}

def fetch_track(config):
    token = secret.decrypt(ENCRYPTED_CLIENT_TOKEN) or config.get("dev_token")
    if token == None:
        fail("Missing provider token")

    response = http.get(
        "https://music.example/me/now-playing",
        headers = {"Authorization": "Bearer %s" % token},
        ttl_seconds = 30,
    )
    if response.status_code != 200:
        fail("Music request failed: %d" % response.status_code)
    return response.json()

def main(config):
    track = DEMO_TRACK if DEMO_MODE else fetch_track(config)

    return render.Root(
        delay = 50,
        child = render.Padding(
            pad = (2, 4, 2, 4),
            child = render.Row(
                cross_align = "center",
                children = [
                    render.Image(
                        src = base64.decode(track["artwork"]),
                        width = 24,
                        height = 24,
                    ),
                    render.Box(width = 3, height = 1),
                    render.Column(
                        children = [
                            render.Marquee(
                                width = 33,
                                child = render.Text(track["title"], color = "#f8fafc"),
                            ),
                            render.Text(
                                track["artist"],
                                font = "CG-pixel-3x5-mono",
                                color = "#a78bfa",
                            ),
                        ],
                    ),
                ],
            ),
        ),
    )

def oauth_handler(raw_params):
    params = json.decode(raw_params)
    token = params.get("access_token")
    if token == None:
        fail("Exchange the provider authorization code for a token")
    return token

def get_schema():
    return schema.Schema(
        version = "1",
        fields = [
            schema.OAuth2(
                id = "auth",
                name = "Music account",
                desc = "Connect a music provider.",
                icon = "key",
                handler = oauth_handler,
                client_id = "your-client-id",
                authorization_endpoint = "https://music.example/oauth/authorize",
                scopes = ["now-playing:read"],
            ),
        ],
    )

Download this app.star.

How it works

1. The image is decoded from Base64, sized to 24×24, and placed beside a column.
2. Marquee scrolls titles that exceed the remaining 33-pixel width.
3. fetch_track() decrypts the app secret, adds a bearer header, and decodes JSON.
4. OAuth2 declares the provider authorization screen and its handler contract.

Connect a real provider

Replace both music.example URLs, the client ID, scopes, and response mapping with your provider's contract. Implement its authorization-code exchange inside oauth_handler, encrypt the resulting token, and only then set DEMO_MODE to False. Never commit a plaintext client secret or refresh token.