diff --git a/.dockerignore b/.dockerignore
index 8708dce..1f9515c 100644
--- a/.dockerignore
+++ b/.dockerignore
@@ -5,6 +5,7 @@
# Only add necessary files to the Docker build context (Dockerfiles are always included implicitly)
!/build/
!/internal/
+!/pkg/
!/go.mod
!/go.sum
!main.go
diff --git a/.github/ISSUE_TEMPLATE/bug_report.yml b/.github/ISSUE_TEMPLATE/bug_report.yml
new file mode 100644
index 0000000..bdd4fe6
--- /dev/null
+++ b/.github/ISSUE_TEMPLATE/bug_report.yml
@@ -0,0 +1,37 @@
+name: Bug report
+description: Let us know if something isn't working as expected
+labels: ["bug report"]
+body:
+ - type: markdown
+ attributes:
+ value: |
+ > [!NOTE]
+ >
+ > Do not prefix your title with "[BUG]", "[Bug report]", etc., a label will be added automatically.
+
+ If you're unsure whether you're experiencing a bug or not, consider using the [Discussions](https://github.com/glanceapp/glance/discussions) or [Discord](https://discord.com/invite/7KQ7Xa9kJd) to ask for help.
+
+ Please include only the information you think is relevant to the bug:
+
+ * How did you install Glance? (Docker container, manual binary install, etc)
+ * Which version of Glance are you using?
+ * Include the relevant parts of your `glance.yml` if applicable (widget, data source, properties used, etc)
+ * Include any relevant logs or screenshots if applicable
+ * Is the issue specific to a certain browser or OS?
+ * Steps to reliably reproduce the issue
+ * Are you hosting Glance on a VPS?
+ * Anything else you think might be relevant
+
+ **No need to copy the above list into your description, it's just a guide to help you provide the most useful information.**
+
+ - type: textarea
+ id: description
+ validations:
+ required: true
+ attributes:
+ label: Description
+
+ - type: markdown
+ attributes:
+ value: |
+ Thank you for taking the time to submit a bug report.
diff --git a/.github/ISSUE_TEMPLATE/config.yml b/.github/ISSUE_TEMPLATE/config.yml
new file mode 100644
index 0000000..e8c34af
--- /dev/null
+++ b/.github/ISSUE_TEMPLATE/config.yml
@@ -0,0 +1,8 @@
+blank_issues_enabled: false
+contact_links:
+ - name: Discussions
+ url: https://github.com/glanceapp/glance/discussions
+ about: For help, feedback, guides, resources and more
+ - name: Discord
+ url: https://discord.com/invite/7KQ7Xa9kJd
+ about: Much like the discussions but more chatty
diff --git a/.github/ISSUE_TEMPLATE/feature_request.yml b/.github/ISSUE_TEMPLATE/feature_request.yml
new file mode 100644
index 0000000..d8f5343
--- /dev/null
+++ b/.github/ISSUE_TEMPLATE/feature_request.yml
@@ -0,0 +1,33 @@
+name: Feature request
+description: Share your ideas for new features or improvements
+labels: ["feature request"]
+body:
+ - type: markdown
+ attributes:
+ value: |
+ > [!NOTE]
+ >
+ > Do not prefix your title with "[REQUEST]", "[Feature request]", etc., a label will be added automatically.
+
+ Please provide a detailed description of what the feature would do and what it would look like:
+
+ * What problem would this feature solve?
+ * Are there any potential downsides to this feature?
+ * If applicable, what would the configuration for this feature look like?
+ * Are there any existing examples of this feature in other software?
+ * If applicable, include any external documentation required to implement this feature
+ * Anything else you think might be relevant
+
+ **No need to copy the above list into your description, it's just a guide to help you provide the most useful information.**
+
+ - type: textarea
+ id: description
+ validations:
+ required: true
+ attributes:
+ label: Description
+
+ - type: markdown
+ attributes:
+ value: |
+ Thank you for taking the time to submit your idea.
diff --git a/.github/PULL_REQUEST_TEMPLATE.md b/.github/PULL_REQUEST_TEMPLATE.md
index 22b3d05..690586f 100644
--- a/.github/PULL_REQUEST_TEMPLATE.md
+++ b/.github/PULL_REQUEST_TEMPLATE.md
@@ -1,7 +1 @@
-<!--
-
-If your pull request adds new features or changes existing ones please use the latest release/* branch as the base.
-
-Documentation updates (including new themes) can be submitted to the main branch.
-
--->
+<!-- If your pull request adds new features, changes existing ones or fixes any bugs, please use the dev branch as the base, otherwise use the main branch -->
diff --git a/.gitignore b/.gitignore
index e466992..2cd84fc 100644
--- a/.gitignore
+++ b/.gitignore
@@ -2,4 +2,4 @@
/build
/playground
/.idea
-glance*.yml
+/glance*.yml
diff --git a/Dockerfile b/Dockerfile
index b89541a..0c4cc63 100644
--- a/Dockerfile
+++ b/Dockerfile
@@ -1,10 +1,10 @@
-FROM golang:1.23.1-alpine3.20 AS builder
+FROM golang:1.24.2-alpine3.21 AS builder
WORKDIR /app
COPY . /app
RUN CGO_ENABLED=0 go build .
-FROM alpine:3.20
+FROM alpine:3.21
WORKDIR /app
COPY --from=builder /app/glance .
diff --git a/Dockerfile.goreleaser b/Dockerfile.goreleaser
index eaf8336..bbfa8ad 100644
--- a/Dockerfile.goreleaser
+++ b/Dockerfile.goreleaser
@@ -1,4 +1,4 @@
-FROM alpine:3.20
+FROM alpine:3.21
WORKDIR /app
COPY glance .
diff --git a/README.md b/README.md
index da6fb58..ca16c49 100644
--- a/README.md
+++ b/README.md
@@ -1,114 +1,436 @@
<p align="center"><em>What if you could see everything at a...</em></p>
<h1 align="center">Glance</h1>
-<p align="center"><a href="#installation">Install</a> • <a href="docs/configuration.md">Configuration</a> • <a href="docs/preconfigured-pages.md">Preconfigured pages</a> • <a href="docs/themes.md">Themes</a> • <a href="https://discord.com/invite/7KQ7Xa9kJd">Discord</a></p>
+<p align="center"><a href="#installation">Install</a> • <a href="docs/configuration.md">Configuration</a> • <a href="https://discord.com/invite/7KQ7Xa9kJd">Discord</a> • <a href="https://github.com/sponsors/glanceapp">Sponsor</a></p>
+<p align="center"><a href="https://github.com/glanceapp/community-widgets">Community widgets</a> • <a href="docs/preconfigured-pages.md">Preconfigured pages</a> • <a href="docs/themes.md">Themes</a></p>
-
+
-### Features
-#### Various widgets
+## Features
+### Various widgets
* RSS feeds
* Subreddit posts
-* Weather
-* Bookmarks
-* Hacker News
-* Lobsters
-* Latest YouTube videos from specific channels
-* Clock
-* Calendar
-* Stocks
-* iframe
-* Twitch channels & top games
-* GitHub releases
-* Repository overview
-* Docker containers
-* Site monitor
-* Search box
+* Hacker News posts
+* Weather forecasts
+* YouTube channel uploads
+* Twitch channels
+* Market prices
+* Docker containers status
+* Server stats
+* Custom widgets
+* [and many more...](docs/configuration.md)
-#### Themeable
-
+### Fast and lightweight
+* Low memory usage
+* Few dependencies
+* Minimal vanilla JS
+* Single <20mb binary available for multiple OSs & architectures and just as small Docker container
+* Uncached pages usually load within ~1s (depending on internet speed and number of widgets)
-#### Optimized for mobile devices
-
+### Tons of customizability
+* Different layouts
+* As many pages/tabs as you need
+* Numerous configuration options for each widget
+* Multiple styles for some widgets
+* Custom CSS
-#### Fast and lightweight
-* Minimal JS, no bloated frameworks
-* Very few dependencies
-* Single, easily distributed <15mb binary and just as small docker container
-* All requests are parallelized, uncached pages usually load within ~1s (depending on internet speed and number of widgets)
+### Optimized for mobile devices
+Because you'll want to take it with you on the go.
-### Configuration
-Checkout the [configuration docs](docs/configuration.md) to learn more. A [preconfigured page](docs/configuration.md#preconfigured-page) is also available to get you started quickly.
+
-### Installation
-> [!CAUTION]
->
-> The project is under active development, expect things to break every once in a while.
+### Themeable
+Easily create your own theme by tweaking a few numbers or choose from one of the [already available themes](docs/themes.md).
-#### Manual
-Checkout the [releases page](https://github.com/glanceapp/glance/releases) for available binaries. You can place the binary inside `/opt/glance/` and have it start with your server via a [systemd service](https://linuxhandbook.com/create-systemd-services/). To specify a different path for the config file use the `--config` option:
+
+
+<br>
+
+## Configuration
+Configuration is done through YAML files, to learn more about how the layout works, how to add more pages and how to configure widgets, visit the [configuration documentation](docs/configuration.md).
+
+<details>
+<summary><strong>Preview example configuration file</strong></summary>
+<br>
+
+```yaml
+pages:
+ - name: Home
+ columns:
+ - size: small
+ widgets:
+ - type: calendar
+ first-day-of-week: monday
+
+ - type: rss
+ limit: 10
+ collapse-after: 3
+ cache: 12h
+ feeds:
+ - url: https://selfh.st/rss/
+ title: selfh.st
+ limit: 4
+ - url: https://ciechanow.ski/atom.xml
+ - url: https://www.joshwcomeau.com/rss.xml
+ title: Josh Comeau
+ - url: https://samwho.dev/rss.xml
+ - url: https://ishadeed.com/feed.xml
+ title: Ahmad Shadeed
+
+ - type: twitch-channels
+ channels:
+ - theprimeagen
+ - j_blow
+ - piratesoftware
+ - cohhcarnage
+ - christitustech
+ - EJ_SA
+
+ - size: full
+ widgets:
+ - type: group
+ widgets:
+ - type: hacker-news
+ - type: lobsters
+
+ - type: videos
+ channels:
+ - UCXuqSBlHAE6Xw-yeJA0Tunw # Linus Tech Tips
+ - UCR-DXc1voovS8nhAvccRZhg # Jeff Geerling
+ - UCsBjURrPoezykLs9EqgamOA # Fireship
+ - UCBJycsmduvYEL83R_U4JriQ # Marques Brownlee
+ - UCHnyfMqiRRG1u-2MsSQLbXA # Veritasium
+
+ - type: group
+ widgets:
+ - type: reddit
+ subreddit: technology
+ show-thumbnails: true
+ - type: reddit
+ subreddit: selfhosted
+ show-thumbnails: true
+
+ - size: small
+ widgets:
+ - type: weather
+ location: London, United Kingdom
+ units: metric
+ hour-format: 12h
+
+ - type: markets
+ markets:
+ - symbol: SPY
+ name: S&P 500
+ - symbol: BTC-USD
+ name: Bitcoin
+ - symbol: NVDA
+ name: NVIDIA
+ - symbol: AAPL
+ name: Apple
+ - symbol: MSFT
+ name: Microsoft
+
+ - type: releases
+ cache: 1d
+ repositories:
+ - glanceapp/glance
+ - go-gitea/gitea
+ - immich-app/immich
+ - syncthing/syncthing
+```
+</details>
+
+<br>
+
+## Installation
+
+Choose one of the following methods:
+
+<details>
+<summary><strong>Docker compose using provided directory structure (recommended)</strong></summary>
+<br>
+
+Create a new directory called `glance` as well as the template files within it by running:
+
+```bash
+mkdir glance && cd glance && curl -sL https://github.com/glanceapp/docker-compose-template/archive/refs/heads/main.tar.gz | tar -xzf - --strip-components 2
+```
+
+*[click here to view the files that will be created](https://github.com/glanceapp/docker-compose-template/tree/main/root)*
+
+Then, edit the following files as desired:
+* `docker-compose.yml` to configure the port, volumes and other containery things
+* `config/home.yml` to configure the widgets or layout of the home page
+* `config/glance.yml` if you want to change the theme or add more pages
+
+<details>
+<summary>Other files you may want to edit</summary>
+
+* `.env` to configure environment variables that will be available inside configuration files
+* `assets/user.css` to add custom CSS
+</details>
+
+When ready, run:
+
+```bash
+docker compose up -d
+```
+
+If you encounter any issues, you can check the logs by running:
+
+```bash
+docker compose logs
+```
+
+<hr>
+</details>
+
+<details>
+<summary><strong>Docker compose manual</strong></summary>
+<br>
+
+Create a `docker-compose.yml` file with the following contents:
+
+```yaml
+services:
+ glance:
+ container_name: glance
+ image: glanceapp/glance
+ restart: unless-stopped
+ volumes:
+ - ./config:/app/config
+ ports:
+ - 8080:8080
+```
+
+Then, create a new directory called `config` and download the example starting [`glance.yml`](https://github.com/glanceapp/glance/blob/main/docs/glance.yml) file into it by running:
+
+```bash
+mkdir config && wget -O config/glance.yml https://raw.githubusercontent.com/glanceapp/glance/refs/heads/main/docs/glance.yml
+```
+
+Feel free to edit the `glance.yml` file to your liking, and when ready run:
+
+```bash
+docker compose up -d
+```
+
+If you encounter any issues, you can check the logs by running:
+
+```bash
+docker logs glance
+```
+
+<hr>
+</details>
+
+<details>
+<summary><strong>Manual binary installation</strong></summary>
+<br>
+
+Precompiled binaries are available for Linux, Windows and macOS (x86, x86_64, ARM and ARM64 architectures).
+
+### Linux
+
+Visit the [latest release page](https://github.com/glanceapp/glance/releases/latest) for available binaries. You can place the binary in `/opt/glance/` and have it start with your server via a [systemd service](https://linuxhandbook.com/create-systemd-services/). By default, when running the binary, it will look for a `glance.yml` file in the directory it's placed in. To specify a different path for the config file, use the `--config` option:
```bash
/opt/glance/glance --config /etc/glance.yml
```
-#### Docker
-<!-- TODO: update -->
-
-> [!IMPORTANT]
->
-> Make sure you have a valid `glance.yml` file in the same directory before running the container.
+To grab a starting template for the config file, run:
```bash
-docker run -d -p 8080:8080 \
- -v ./glance.yml:/app/glance.yml \
- -v /etc/timezone:/etc/timezone:ro \
- -v /etc/localtime:/etc/localtime:ro \
- glanceapp/glance
+wget https://raw.githubusercontent.com/glanceapp/glance/refs/heads/main/docs/glance.yml
```
-Or if you prefer docker compose:
+### Windows
+
+Download and extract the executable from the [latest release](https://github.com/glanceapp/glance/releases/latest) (most likely the file called `glance-windows-amd64.zip` if you're on a 64-bit system) and place it in a folder of your choice. Then, create a new text file called `glance.yml` in the same folder and paste the content from [here](https://raw.githubusercontent.com/glanceapp/glance/refs/heads/main/docs/glance.yml) in it. You should then be able to run the executable and access the dashboard by visiting `http://localhost:8080` in your browser.
+
+
+
+<hr>
+</details>
+
+<details>
+<summary><strong>Other</strong></summary>
+<br>
+
+Glance can also be installed through the following 3rd party channels:
+* [Proxmox VE Helper Script](https://community-scripts.github.io/ProxmoxVE/scripts?id=glance)
+* [NixOS package](https://search.nixos.org/packages?channel=unstable&show=glance)
+* [Coolify.io](https://coolify.io/docs/services/glance/)
+
+<hr>
+</details>
+
+<br>
+
+## Common issues
+<details>
+<summary><strong>Requests timing out</strong></summary>
+
+The most common cause of this is when using Pi-Hole, AdGuard Home or other ad-blocking DNS services, which by default have a fairly low rate limit. Depending on the number of widgets you have in a single page, this limit can very easily be exceeded. To fix this, increase the rate limit in the settings of your DNS service.
+
+If using Podman, in some rare cases the timeout can be caused by an unknown issue, in which case it may be resolved by adding the following to the bottom of your `docker-compose.yml` file:
+```yaml
+networks:
+ podman:
+ external: true
+```
+</details>
+
+<details>
+<summary><strong>Broken layout for markets, bookmarks or other widgets</strong></summary>
+
+This is almost always caused by the browser extension Dark Reader. To fix this, disable dark mode for the domain where Glance is hosted.
+</details>
+
+<details>
+<summary><strong>cannot unmarshal !!map into []glance.page</strong></summary>
+
+The most common cause of this is having a `pages` key in your `glance.yml` and then also having a `pages` key inside one of your included pages. To fix this, remove the `pages` key from the top of your included pages.
+
+</details>
+
+<br>
+
+## FAQ
+<details>
+<summary><strong>Does the information on the page update automatically?</strong></summary>
+No, a page refresh is required to update the information. Some things do dynamically update where it makes sense, like the clock widget and the relative time showing how long ago something happened.
+</details>
+
+<details>
+<summary><strong>How frequently do widgets update?</strong></summary>
+No requests are made periodically in the background, information is only fetched upon loading the page and then cached. The default cache lifetime is different for each widget and can be configured.
+</details>
+
+<details>
+<summary><strong>Can I create my own widgets?</strong></summary>
+
+Yes, there are multiple ways to create custom widgets:
+* `iframe` widget - allows you to embed things from other websites
+* `html` widget - allows you to insert your own static HTML
+* `extension` widget - fetch HTML from a URL
+* `custom-api` widget - fetch JSON from a URL and render it using custom HTML
+</details>
+
+<details>
+<summary><strong>Can I change the title of a widget?</strong></summary>
+
+Yes, the title of all widgets can be changed by specifying the `title` property in the widget's configuration:
```yaml
-services:
- glance:
- image: glanceapp/glance
- volumes:
- - ./glance.yml:/app/glance.yml
- - /etc/timezone:/etc/timezone:ro
- - /etc/localtime:/etc/localtime:ro
- ports:
- - 8080:8080
- restart: unless-stopped
+- type: rss
+ title: My custom title
+
+- type: markets
+ title: My custom title
+
+- type: videos
+ title: My custom title
+
+# and so on for all widgets...
```
+</details>
-### Building from source
+<br>
-Requirements: [Go](https://go.dev/dl/) >= v1.22
+## Feature requests
-To build:
+New feature suggestions are always welcome and will be considered, though please keep in mind that some of them may be out of scope for what the project is trying to achieve (or is reasonably capable of). If you have an idea for a new feature and would like to share it, you can do so [here](https://github.com/glanceapp/glance/issues/new?template=feature_request.yml).
+
+Feature requests are tagged with one of the following:
+
+* [Roadmap](https://github.com/glanceapp/glance/labels/roadmap) - will be implemented in a future release
+* [Backlog](https://github.com/glanceapp/glance/labels/backlog) - may be implemented in the future but needs further feedback or interest from the community
+* [Icebox](https://github.com/glanceapp/glance/labels/icebox) - no plans to implement as it doesn't currently align with the project's goals or capabilities, may be revised at a later date
+
+<br>
+
+## Building from source
+
+Choose one of the following methods:
+
+<details>
+<summary><strong>Build binary with Go</strong></summary>
+<br>
+
+Requirements: [Go](https://go.dev/dl/) >= v1.23
+
+To build the project for your current OS and architecture, run:
```bash
go build -o build/glance .
```
-To run:
+To build for a specific OS and architecture, run:
+
+```bash
+GOOS=linux GOARCH=amd64 go build -o build/glance .
+```
+
+[*click here for a full list of GOOS and GOARCH combinations*](https://go.dev/doc/install/source#:~:text=$GOOS%20and%20$GOARCH)
+
+Alternatively, if you just want to run the app without creating a binary, like when you're testing out changes, you can run:
```bash
go run .
```
+<hr>
+</details>
-### Building Docker image
+<details>
+<summary><strong>Build project and Docker image with Docker</strong></summary>
+<br>
-Build the image:
+Requirements: [Docker](https://docs.docker.com/engine/install/)
-**Make sure to replace "owner" with your name or organization.**
+To build the project and image using just Docker, run:
+
+*(replace `owner` with your name or organization)*
```bash
docker build -t owner/glance:latest .
```
-Push the image to your registry:
+If you wish to push the image to a registry (by default Docker Hub), run:
```bash
docker push owner/glance:latest
```
+
+<hr>
+</details>
+
+<br>
+
+## Contributing guidelines
+
+* Before working on a new feature it's preferable to submit a feature request first and state that you'd like to implement it yourself
+* Please don't submit PRs for feature requests that are either in the roadmap<sup>[1]</sup>, backlog<sup>[2]</sup> or icebox<sup>[3]</sup>
+* Use `dev` for the base branch if you're adding new features or fixing bugs, otherwise use `main`
+* Avoid introducing new dependencies
+* Avoid making backwards-incompatible configuration changes
+* Avoid introducing new colors or hard-coding colors, use the standard `primary`, `positive` and `negative`
+* For icons, try to use [heroicons](https://heroicons.com/) where applicable
+* Provide a screenshot of the changes if UI related where possible
+* No `package.json`
+
+<details>
+<summary><strong><sup>[1] [2] [3]</sup></strong></summary>
+
+[1] The feature likely already has work put into it that may conflict with your implementation
+
+[2] The demand, implementation or functionality for this feature is not yet clear
+
+[3] No plans to add this feature for the time being
+
+</details>
+
+<br>
+
+## Thank you
+
+To all the people who were generous enough to [sponsor](https://github.com/sponsors/glanceapp) the project and to everyone who has contributed in any way, be it PRs, submitting issues, helping others in the discussions or Discord server, creating guides and tools or just mentioning Glance on social media. Your support is greatly appreciated and helps keep the project going.
diff --git a/docs/configuration.md b/docs/configuration.md
index cda2fd5..f47039b 100644
--- a/docs/configuration.md
+++ b/docs/configuration.md
@@ -1,11 +1,17 @@
-# Configuration
+# Configuring Glance
-- [Intro](#intro)
- [Preconfigured page](#preconfigured-page)
+- [The config file](#the-config-file)
+ - [Auto reload](#auto-reload)
+ - [Environment variables](#environment-variables)
+ - [Other ways of providing tokens/passwords/secrets](#other-ways-of-providing-tokenspasswordssecrets)
+ - [Including other config files](#including-other-config-files)
+ - [Config schema](#config-schema)
- [Server](#server)
+- [Document](#document)
- [Branding](#branding)
- [Theme](#theme)
- - [Themes](#themes)
+ - [Available themes](#available-themes)
- [Pages & Columns](#pages--columns)
- [Widgets](#widgets)
- [RSS](#rss)
@@ -21,10 +27,13 @@
- [Weather](#weather)
- [Monitor](#monitor)
- [Releases](#releases)
+ - [Docker Containers](#docker-containers)
- [DNS Stats](#dns-stats)
+ - [Server Stats](#server-stats)
- [Repository](#repository)
- [Bookmarks](#bookmarks)
- [Calendar](#calendar)
+ - [Calendar (legacy)](#calendar-legacy)
- [ChangeDetection.io](#changedetectionio)
- [Clock](#clock)
- [Markets](#markets)
@@ -32,90 +41,151 @@
- [Twitch Top Games](#twitch-top-games)
- [iframe](#iframe)
- [HTML](#html)
- - [Docker](#docker)
-## Intro
-<!-- TODO: update -->
-Configuration is done via a single YAML file and a server restart is required in order for any changes to take effect. Trying to start the server with an invalid config file will result in an error.
## Preconfigured page
-If you don't want to spend time reading through all the available configuration options and just want something to get you going quickly you can use the following `glance.yml` and make changes as you see fit:
-
-```yaml
-pages:
- - name: Home
- columns:
- - size: small
- widgets:
- - type: calendar
-
- - type: rss
- limit: 10
- collapse-after: 3
- cache: 3h
- feeds:
- - url: https://ciechanow.ski/atom.xml
- - url: https://www.joshwcomeau.com/rss.xml
- title: Josh Comeau
- - url: https://samwho.dev/rss.xml
- - url: https://awesomekling.github.io/feed.xml
- - url: https://ishadeed.com/feed.xml
- title: Ahmad Shadeed
-
- - type: twitch-channels
- channels:
- - theprimeagen
- - cohhcarnage
- - christitustech
- - blurbs
- - asmongold
- - jembawls
-
- - size: full
- widgets:
- - type: hacker-news
-
- - type: videos
- channels:
- - UCR-DXc1voovS8nhAvccRZhg # Jeff Geerling
- - UCv6J_jJa8GJqFwQNgNrMuww # ServeTheHome
- - UCOk-gHyjcWZNj3Br4oxwh0A # Techno Tim
-
- - type: reddit
- subreddit: selfhosted
-
- - size: small
- widgets:
- - type: weather
- location: London, United Kingdom
-
- - type: markets
- markets:
- - symbol: SPY
- name: S&P 500
- - symbol: BTC-USD
- name: Bitcoin
- - symbol: NVDA
- name: NVIDIA
- - symbol: AAPL
- name: Apple
- - symbol: MSFT
- name: Microsoft
- - symbol: GOOGL
- name: Google
- - symbol: AMD
- name: AMD
- - symbol: RDDT
- name: Reddit
-```
-
-This will give you a page that looks like the following:
+If you don't want to spend time reading through all the available configuration options and just want something to get you going quickly you can use [this `glance.yml` file](glance.yml) and make changes to it as you see fit. It will give you a page that looks like the following:
Configure the widgets, add more of them, add extra pages, etc. Make it your own!
-<!-- TODO: update - add information about top level document key -->
+## The config file
+
+### Auto reload
+Automatic config reload is supported, meaning that you can make changes to the config file and have them take effect on save without having to restart the container/service. Making changes to environment variables does not trigger a reload and requires manual restart. Deleting a config file will stop that file from being watched, even if it is recreated.
+
+> [!NOTE]
+>
+> If you attempt to start Glance with an invalid config it will exit with an error outright. If you successfully started Glance with a valid config and then made changes to it which result in an error, you'll see that error in the console and Glance will continue to run with the old configuration. You can then continue to make changes and when there are no errors the new configuration will be loaded.
+
+> [!CAUTION]
+>
+> Reloading the configuration file clears your cached data, meaning that you have to request the data anew each time you do this. This can lead to rate limiting for some APIs if you do it too frequently. Having a cache that persists between reloads will be added in the future.
+
+### Environment variables
+Inserting environment variables is supported anywhere in the config. This is done via the `${ENV_VAR}` syntax. Attempting to use an environment variable that doesn't exist will result in an error and Glance will either not start or load your new config on save. Example:
+
+```yaml
+server:
+ host: ${HOST}
+ port: ${PORT}
+```
+
+Can also be in the middle of a string:
+
+```yaml
+- type: rss
+ title: ${RSS_TITLE}
+ feeds:
+ - url: http://domain.com/rss/${RSS_CATEGORY}.xml
+```
+
+Works with any type of value, not just strings:
+
+```yaml
+- type: rss
+ limit: ${RSS_LIMIT}
+```
+
+If you need to use the syntax `${NAME}` in your config without it being interpreted as an environment variable, you can escape it by prefixing with a backslash `\`:
+
+```yaml
+something: \${NOT_AN_ENV_VAR}
+```
+
+#### Other ways of providing tokens/passwords/secrets
+
+You can use [Docker secrets](https://docs.docker.com/compose/how-tos/use-secrets/) with the following syntax:
+
+```yaml
+# This will be replaced with the contents of the file /run/secrets/github_token
+# so long as the secret `github_token` is provided to the container
+token: ${secret:github_token}
+```
+
+Alternatively, you can load the contents of a file who's path is provided by an environment variable:
+
+`docker-compose.yml`
+```yaml
+services:
+ glance:
+ image: glanceapp/glance
+ environment:
+ - TOKEN_FILE=/home/user/token
+ volumes:
+ - /home/user/token:/home/user/token
+```
+
+`glance.yml`
+```yaml
+token: ${readFileFromEnv:TOKEN_FILE}
+```
+
+> [!NOTE]
+>
+> The contents of the file will be stripped of any leading/trailing whitespace before being used.
+
+### Including other config files
+Including config files from within your main config file is supported. This is done via the `$include` directive along with a relative or absolute path to the file you want to include. If the path is relative, it will be relative to the main config file. Additionally, environment variables can be used within included files, and changes to the included files will trigger an automatic reload. Example:
+
+```yaml
+pages:
+ - $include: home.yml
+ - $include: videos.yml
+ - $include: homelab.yml
+```
+
+The file you are including should not have any additional indentation, its values should be at the top level and the appropriate amount of indentation will be added automatically depending on where the file is included. Example:
+
+`glance.yml`
+
+```yaml
+pages:
+ - name: Home
+ columns:
+ - size: full
+ widgets:
+ $include: rss.yml
+ - name: News
+ columns:
+ - size: full
+ widgets:
+ - type: group
+ widgets:
+ $include: rss.yml
+ - type: reddit
+ subreddit: news
+```
+
+`rss.yml`
+
+```yaml
+- type: rss
+ title: News
+ feeds:
+ - url: ${RSS_URL}
+```
+
+The `$include` directive can be used anywhere in the config file, not just in the `pages` property, however it must be on its own line and have the appropriate indentation.
+
+If you encounter YAML parsing errors when using the `$include` directive, the reported line numbers will likely be incorrect. This is because the inclusion of files is done before the YAML is parsed, as YAML itself does not support file inclusion. To help with debugging in cases like this, you can use the `config:print` command and pipe it into `less -N` to see the full config file with includes resolved and line numbers added:
+
+```sh
+glance --config /path/to/glance.yml config:print | less -N
+```
+
+This is a bit more convoluted when running Glance inside a Docker container:
+
+```sh
+docker run --rm -v ./glance.yml:/app/config/glance.yml glanceapp/glance config:print | less -N
+```
+
+This assumes that the config you want to print is in your current working directory and is named `glance.yml`.
+
+## Config schema
+
+For property descriptions, validation and autocompletion of the config within your IDE, @not-first has kindly created a [schema](https://github.com/not-first/glance-schema). Massive thanks to them for this, go check it out and give them a star!
## Server
Server configuration is done through a top level `server` property. Example:
@@ -185,6 +255,15 @@ To be able to point to an asset from your assets path, use the `/assets/` path l
icon: /assets/gitea-icon.png
```
+## Document
+If you want to insert custom HTML into the `<head>` of the document for all pages, you can do so by using the `document` property. Example:
+
+```yaml
+document:
+ head: |
+ <script src="/assets/custom.js"></script>
+```
+
## Branding
You can adjust the various parts of the branding through a top level `branding` property. Example:
@@ -194,6 +273,9 @@ branding:
<p>Powered by <a href="https://github.com/glanceapp/glance">Glance</a></p>
logo-url: /assets/logo.png
favicon-url: /assets/logo.png
+ app-name: "My Dashboard"
+ app-icon-url: "/assets/app-icon.png"
+ app-background-color: "#151519"
```
### Properties
@@ -205,6 +287,9 @@ branding:
| logo-text | string | no | G |
| logo-url | string | no | |
| favicon-url | string | no | |
+| app-name | string | no | Glance |
+| app-icon-url | string | no | Glance's default icon |
+| app-background-color | string | no | Glance's default background color |
#### `hide-footer`
Hides the footer when set to `true`.
@@ -221,6 +306,15 @@ Specify a URL to a custom image to use instead of the "G" found in the navigatio
#### `favicon-url`
Specify a URL to a custom image to use for the favicon.
+#### `app-name`
+Specify the name of the web app shown in browser tab and PWA.
+
+#### `app-icon-url`
+Specify URL for PWA and browser tab icon (512x512 PNG).
+
+#### `app-background-color`
+Specify background color for PWA. Must be a valid CSS color.
+
## Theme
Theming is done through a top level `theme` property. Values for the colors are in [HSL](https://giggster.com/guide/basics/hue-saturation-lightness/) (hue, saturation, lightness) format. You can use a color picker [like this one](https://hslpicker.com/) to convert colors from other formats to HSL. The values are separated by a space and `%` is not required for any of the numbers.
@@ -248,7 +342,7 @@ theme:
negative-color: 347 87 44
```
-### Themes
+### Available themes
If you don't want to spend time configuring your own theme, there are [several available themes](themes.md) which you can simply copy the values for.
### Properties
@@ -351,23 +445,29 @@ pages:
### Properties
| Name | Type | Required | Default |
| ---- | ---- | -------- | ------- |
-| title | string | yes | |
+| name | string | yes | |
| slug | string | no | |
| width | string | no | |
+| desktop-navigation-width | string | no | |
| center-vertically | boolean | no | false |
| hide-desktop-navigation | boolean | no | false |
| expand-mobile-page-navigation | boolean | no | false |
| show-mobile-header | boolean | no | false |
| columns | array | yes | |
-#### `title`
+#### `name`
The name of the page which gets shown in the navigation bar.
#### `slug`
The URL friendly version of the title which is used to access the page. For example if the title of the page is "RSS Feeds" you can make the page accessible via `localhost:8080/feeds` by setting the slug to `feeds`. If not defined, it will automatically be generated from the title.
#### `width`
-The maximum width of the page on desktop. Possible values are `slim` and `wide`.
+The maximum width of the page on desktop. Possible values are `default`, `slim` and `wide`.
+
+#### `desktop-navigation-width`
+The maximum width of the desktop navigation. Useful if you have a few pages that use a different width than the rest and don't want the navigation to jump abruptly when going to and away from those pages. Possible values are `default`, `slim` and `wide`.
+
+Here are the pixel equivalents for each value:
* default: `1600px`
* slim: `1100px`
@@ -526,9 +626,22 @@ Example:
| thumbnail-height | float | no | 10 |
| card-height | float | no | 27 |
| limit | integer | no | 25 |
+| preserve-order | bool | no | false |
| single-line-titles | boolean | no | false |
| collapse-after | integer | no | 5 |
+##### `limit`
+The maximum number of articles to show.
+
+##### `collapse-after`
+How many articles are visible before the "SHOW MORE" button appears. Set to `-1` to never collapse.
+
+##### `preserve-order`
+When set to `true`, the order of the articles will be preserved as they are in the feeds. Useful if a feed uses its own sorting order which denotes the importance of the articles. If you use this property while having a lot of feeds, it's recommended to set a `limit` to each individual feed since if the first defined feed has 15 articles, the articles from the second feed will start after the 15th article in the list.
+
+##### `single-line-titles`
+When set to `true`, truncates the title of each post if it exceeds one line. Only applies when the style is set to `vertical-list`.
+
##### `style`
Used to change the appearance of the widget. Possible values are:
@@ -571,9 +684,13 @@ An array of RSS/atom feeds. The title can optionally be changed.
| title | string | no | the title provided by the feed | |
| hide-categories | boolean | no | false | Only applicable for `detailed-list` style |
| hide-description | boolean | no | false | Only applicable for `detailed-list` style |
+| limit | integer | no | | |
| item-link-prefix | string | no | | |
| headers | key (string) & value (string) | no | | |
+###### `limit`
+The maximum number of articles to show from that specific feed. Useful if you have a feed which posts a lot of articles frequently and you want to prevent it from excessively pushing down articles from other feeds.
+
###### `item-link-prefix`
If an RSS feed isn't returning item links with a base domain and Glance has failed to automatically detect the correct domain you can manually add a prefix to each link with this property.
@@ -588,15 +705,6 @@ Optionally specify the headers that will be sent with the request. Example:
User-Agent: Custom User Agent
```
-##### `limit`
-The maximum number of articles to show.
-
-##### `single-line-titles`
-When set to `true`, truncates the title of each post if it exceeds one line. Only applies when the style is set to `vertical-list`.
-
-##### `collapse-after`
-How many articles are visible before the "SHOW MORE" button appears. Set to `-1` to never collapse.
-
### Videos
Display a list of the latest videos from specific YouTube channels.
@@ -617,20 +725,16 @@ Preview:
| Name | Type | Required | Default |
| ---- | ---- | -------- | ------- |
| channels | array | yes | |
+| playlists | array | no | |
| limit | integer | no | 25 |
| style | string | no | horizontal-cards |
+| collapse-after | integer | no | 7 |
| collapse-after-rows | integer | no | 4 |
| include-shorts | boolean | no | false |
| video-url-template | string | no | https://www.youtube.com/watch?v={VIDEO-ID} |
##### `channels`
-A list of channel or playlist IDs. To specify a playlist, use the `playlist:` prefix like such:
-
-```yaml
-channels:
- - playlist:PL8mG-RkN2uTyZZ00ObwZxxoG_nJbs3qec
- - playlist:PL8mG-RkN2uTxTK4m_Vl2dYR9yE41kRdBg
-```
+A list of channels IDs.
One way of getting the ID of a channel is going to the channel's page and clicking on its description:
@@ -640,14 +744,32 @@ Then scroll down and click on "Share channel", then "Copy channel ID":
+##### `playlists`
+
+A list of playlist IDs:
+
+```yaml
+- type: videos
+ playlists:
+ - PL8mG-RkN2uTyZZ00ObwZxxoG_nJbs3qec
+ - PL8mG-RkN2uTxTK4m_Vl2dYR9yE41kRdBg
+```
+
##### `limit`
The maximum number of videos to show.
+##### `collapse-after`
+Specify the number of videos to show when using the `vertical-list` style before the "SHOW MORE" button appears.
+
##### `collapse-after-rows`
Specify the number of rows to show when using the `grid-cards` style before the "SHOW MORE" button appears.
##### `style`
-Used to change the appearance of the widget. Possible values are `horizontal-cards` and `grid-cards`.
+Used to change the appearance of the widget. Possible values are `horizontal-cards`, `vertical-list` and `grid-cards`.
+
+Preview of `vertical-list`:
+
+
Preview of `grid-cards`:
@@ -762,7 +884,10 @@ Display a list of posts from a specific subreddit.
> [!WARNING]
>
-> Reddit does not allow unauthorized API access from VPS IPs, if you're hosting Glance on a VPS you will get a 403 response. As a workaround you can route the traffic from Glance through a VPN or your own HTTP proxy using the `request-url-template` property.
+> Reddit does not allow unauthorized API access from VPS IPs, if you're hosting Glance on a VPS you will get a 403
+> response. As a workaround you can either [register an app on Reddit](https://ssl.reddit.com/prefs/apps/) and use the
+> generated ID and secret in the widget configuration to authenticate your requests (see `app-auth` property), use a proxy
+> (see `proxy` property) or route the traffic from Glance through a VPN.
Example:
@@ -782,10 +907,12 @@ Example:
| collapse-after | integer | no | 5 |
| comments-url-template | string | no | https://www.reddit.com/{POST-PATH} |
| request-url-template | string | no | |
+| proxy | string or multiple parameters | no | |
| sort-by | string | no | hot |
| top-period | string | no | day |
| search | string | no | |
| extra-sort-by | string | no | |
+| app-auth | object | no | |
##### `subreddit`
The subreddit for which to fetch the posts from.
@@ -843,7 +970,7 @@ r/selfhosted/comments/bsp01i/welcome_to_rselfhosted_please_read_this_first/
`{SUBREDDIT}` - the subreddit name
##### `request-url-template`
-A custom request url that will be used to fetch the data instead. This is useful when you're hosting Glance on a VPS and Reddit is blocking the requests, and you want to route it through an HTTP proxy.
+A custom request URL that will be used to fetch the data. This is useful when you're hosting Glance on a VPS where Reddit is blocking the requests and you want to route them through a proxy that accepts the URL as either a part of the path or a query parameter.
Placeholders:
@@ -854,6 +981,29 @@ https://proxy/{REQUEST-URL}
https://your.proxy/?url={REQUEST-URL}
```
+##### `proxy`
+A custom HTTP/HTTPS proxy URL that will be used to fetch the data. This is useful when you're hosting Glance on a VPS where Reddit is blocking the requests and you want to bypass the restriction by routing the requests through a proxy. Example:
+
+```yaml
+proxy: http://user:pass@proxy.com:8080
+proxy: https://user:pass@proxy.com:443
+```
+
+Alternatively, you can specify the proxy URL as well as additional options by using multiple parameters:
+
+```yaml
+proxy:
+ url: http://proxy.com:8080
+ allow-insecure: true
+ timeout: 10s
+```
+
+###### `allow-insecure`
+When set to `true`, allows the use of insecure connections such as when the proxy has a self-signed certificate.
+
+###### `timeout`
+The maximum time to wait for a response from the proxy. The value is a string and must be a number followed by one of s, m, h, d. Example: `10s` for 10 seconds, `1m` for 1 minute, etc
+
##### `sort-by`
Can be used to specify the order in which the posts should get returned. Possible values are `hot`, `new`, `top` and `rising`.
@@ -870,6 +1020,17 @@ Can be used to specify an additional sort which will be applied on top of the al
The `engagement` sort tries to place the posts with the most points and comments on top, also prioritizing recent over old posts.
+##### `app-auth`
+```yaml
+widgets:
+ - type: reddit
+ subreddit: technology
+ app-auth:
+ name: ${REDDIT_APP_NAME}
+ id: ${REDDIT_APP_CLIENT_ID}
+ secret: ${REDDIT_APP_SECRET}
+```
+
### Search Widget
Display a search bar that can be used to search for specific terms on various search engines.
@@ -907,6 +1068,7 @@ Preview:
| search-engine | string | no | duckduckgo |
| new-tab | boolean | no | false |
| autofocus | boolean | no | false |
+| target | string | no | _blank |
| placeholder | string | no | Type here to search… |
| bangs | array | no | |
@@ -917,6 +1079,10 @@ Either a value from the table below or a URL to a custom search engine. Use `{QU
| ---- | --- |
| duckduckgo | `https://duckduckgo.com/?q={QUERY}` |
| google | `https://www.google.com/search?q={QUERY}` |
+| bing | `https://www.bing.com/search?q={QUERY}` |
+| perplexity | `https://www.perplexity.ai/search?q={QUERY}` |
+| kagi | `https://kagi.com/search?q={QUERY}` |
+| startpage | `https://www.startpage.com/search?q={QUERY}` |
##### `new-tab`
When set to `true`, swaps the shortcuts for showing results in the same or new tab, defaulting to showing results in a new tab.
@@ -924,6 +1090,9 @@ When set to `true`, swaps the shortcuts for showing results in the same or new t
##### `autofocus`
When set to `true`, automatically focuses the search input on page load.
+##### `target`
+The target to use when opening the search results in a new tab. Possible values are `_blank`, `_self`, `_parent` and `_top`.
+
##### `placeholder`
When set, modifies the text displayed in the input field before typing.
@@ -1006,65 +1175,348 @@ Example:
```
### Split Column
-<!-- TODO: update -->
-Splits a full sized column in half, allowing you to place widgets side by side. This is converted to a single column on mobile devices or if not enough width is available. Widgets are defined using a `widgets` property exactly as you would on a page column.
+Splits a full sized column in half, allowing you to place widgets side by side horizontally. This is converted to a single column on mobile devices or if not enough width is available. Widgets are defined using a `widgets` property exactly as you would on a page column.
-Example of a full page with an effective 4 column layout using two split column widgets inside of two full sized columns:
+Two widgets side by side in a `full` column:
+
+
<details>
-<summary>View config</summary>
+<summary>View <code>glance.yml</code></summary>
+<br>
```yaml
-shared:
- - &reddit-props
- type: reddit
- collapse-after: 4
- show-thumbnails: true
+# ...
+- size: full
+ widgets:
+ - type: split-column
+ widgets:
+ - type: hacker-news
+ collapse-after: 3
+ - type: lobsters
+ collapse-after: 3
+ - type: videos
+# ...
+```
+</details>
+<br>
+
+You can also achieve a number of different full page layouts using just this widget, such as:
+
+3 column layout where all columns have equal width:
+
+
+
+<details>
+<summary>View <code>glance.yml</code></summary>
+<br>
+
+```yaml
pages:
- - name: Split Column Demo
+ - name: Home
+ columns:
+ - size: full
+ widgets:
+ - type: split-column
+ max-columns: 3
+ widgets:
+ - type: reddit
+ subreddit: selfhosted
+ collapse-after: 15
+ - type: reddit
+ subreddit: homelab
+ collapse-after: 15
+ - type: reddit
+ subreddit: sysadmin
+ collapse-after: 15
+```
+</details>
+<br>
+
+4 column layout where all columns have equal width (and the page is set to `width: wide`):
+
+
+
+<details>
+<summary>View <code>glance.yml</code></summary>
+<br>
+
+```yaml
+pages:
+ - name: Home
width: wide
columns:
- size: full
widgets:
- type: split-column
+ max-columns: 4
widgets:
- - subreddit: gaming
- <<: *reddit-props
- - subreddit: worldnews
- <<: *reddit-props
- - subreddit: lifeprotips
- <<: *reddit-props
- show-thumbnails: false
- - subreddit: askreddit
- <<: *reddit-props
- show-thumbnails: false
+ - type: reddit
+ subreddit: selfhosted
+ collapse-after: 15
+ - type: reddit
+ subreddit: homelab
+ collapse-after: 15
+ - type: reddit
+ subreddit: linux
+ collapse-after: 15
+ - type: reddit
+ subreddit: sysadmin
+ collapse-after: 15
+```
+</details>
+<br>
+Masonry layout with up to 5 columns where all columns have equal width (and the page is set to `width: wide`):
+
+
+
+<details>
+<summary>View <code>glance.yml</code></summary>
+<br>
+
+```yaml
+define:
+ - &subreddit-settings
+ type: reddit
+ collapse-after: 5
+
+pages:
+ - name: Home
+ width: wide
+ columns:
- size: full
widgets:
- type: split-column
+ max-columns: 5
widgets:
- - subreddit: todayilearned
- <<: *reddit-props
- collapse-after: 2
- - subreddit: aww
- <<: *reddit-props
- - subreddit: science
- <<: *reddit-props
- - subreddit: showerthoughts
- <<: *reddit-props
- show-thumbnails: false
+ - subreddit: selfhosted
+ <<: *subreddit-settings
+ - subreddit: homelab
+ <<: *subreddit-settings
+ - subreddit: linux
+ <<: *subreddit-settings
+ - subreddit: sysadmin
+ <<: *subreddit-settings
+ - subreddit: DevOps
+ <<: *subreddit-settings
+ - subreddit: Networking
+ <<: *subreddit-settings
+ - subreddit: DataHoarding
+ <<: *subreddit-settings
+ - subreddit: OpenSource
+ <<: *subreddit-settings
+ - subreddit: Privacy
+ <<: *subreddit-settings
+ - subreddit: FreeSoftware
+ <<: *subreddit-settings
+```
+</details>
+<br>
+
+Just like the `group` widget, you can insert any widget type, you can even insert a `group` widget inside of a `split-column` widget, but you can't insert a `split-column` widget inside of a `group` widget.
+
+
+### Custom API
+
+Display data from a JSON API using a custom template.
+
+> [!NOTE]
+>
+> The configuration of this widget requires some basic knowledge of programming, HTML, CSS, the Go template language and Glance-specific concepts.
+
+Examples:
+
+
+
+<details>
+<summary>View <code>glance.yml</code></summary>
+<br>
+
+```yaml
+- type: custom-api
+ title: Random Fact
+ cache: 6h
+ url: https://uselessfacts.jsph.pl/api/v2/facts/random
+ template: |
+ <p class="size-h4 color-paragraph">{{ .JSON.String "text" }}</p>
+```
+</details>
+<br>
+
+
+
+<details>
+<summary>View <code>glance.yml</code></summary>
+<br>
+
+```yaml
+- type: custom-api
+ title: Immich stats
+ cache: 1d
+ url: https://${IMMICH_URL}/api/server/statistics
+ headers:
+ x-api-key: ${IMMICH_API_KEY}
+ Accept: application/json
+ template: |
+ <div class="flex justify-between text-center">
+ <div>
+ <div class="color-highlight size-h3">{{ .JSON.Int "photos" | formatNumber }}</div>
+ <div class="size-h6">PHOTOS</div>
+ </div>
+ <div>
+ <div class="color-highlight size-h3">{{ .JSON.Int "videos" | formatNumber }}</div>
+ <div class="size-h6">VIDEOS</div>
+ </div>
+ <div>
+ <div class="color-highlight size-h3">{{ div (.JSON.Int "usage" | toFloat) 1073741824 | toInt | formatNumber }}GB</div>
+ <div class="size-h6">USAGE</div>
+ </div>
+ </div>
+```
+</details>
+<br>
+
+
+
+<details>
+<summary>View <code>glance.yml</code></summary>
+<br>
+
+```yaml
+- type: custom-api
+ title: Steam Specials
+ cache: 12h
+ url: https://store.steampowered.com/api/featuredcategories?cc=us
+ template: |
+ <ul class="list list-gap-10 collapsible-container" data-collapse-after="5">
+ {{ range .JSON.Array "specials.items" }}
+ <li>
+ <a class="size-h4 color-highlight block text-truncate" href="https://store.steampowered.com/app/{{ .Int "id" }}/">{{ .String "name" }}</a>
+ <ul class="list-horizontal-text">
+ <li>{{ div (.Int "final_price" | toFloat) 100 | printf "$%.2f" }}</li>
+ {{ $discount := .Int "discount_percent" }}
+ <li{{ if ge $discount 40 }} class="color-positive"{{ end }}>{{ $discount }}% off</li>
+ </ul>
+ </li>
+ {{ end }}
+ </ul>
```
</details>
-<br>
+#### Properties
+| Name | Type | Required | Default |
+| ---- | ---- | -------- | ------- |
+| url | string | yes | |
+| headers | key (string) & value (string) | no | |
+| method | string | no | GET |
+| body-type | string | no | json |
+| body | any | no | |
+| frameless | boolean | no | false |
+| allow-insecure | boolean | no | false |
+| skip-json-validation | boolean | no | false |
+| template | string | yes | |
+| parameters | key (string) & value (string|array) | no | |
+| subrequests | map of requests | no | |
-Preview:
+##### `url`
+The URL to fetch the data from. It must be accessible from the server that Glance is running on.
-
+##### `headers`
+Optionally specify the headers that will be sent with the request. Example:
-### Custom API
-<!-- TODO -->
+```yaml
+headers:
+ x-api-key: your-api-key
+ Accept: application/json
+```
+
+##### `method`
+The HTTP method to use when making the request. Possible values are `GET`, `POST`, `PUT`, `PATCH`, `DELETE`, `OPTIONS` and `HEAD`.
+
+##### `body-type`
+The type of the body that will be sent with the request. Possible values are `json`, and `string`.
+
+##### `body`
+The body that will be sent with the request. It can be a string or a map. Example:
+
+```yaml
+body-type: json
+body:
+ key1: value1
+ key2: value2
+ multiple-items:
+ - item1
+ - item2
+```
+
+```yaml
+body-type: string
+body: |
+ key1=value1&key2=value2
+```
+
+##### `frameless`
+When set to `true`, removes the border and padding around the widget.
+
+##### `allow-insecure`
+Whether to ignore invalid/self-signed certificates.
+
+##### `skip-json-validation`
+When set to `true`, skips the JSON validation step. This is useful when the API returns JSON Lines/newline-delimited JSON, which is a format that consists of several JSON objects separated by newlines.
+
+##### `template`
+The template that will be used to display the data. It relies on Go's `html/template` package so it's recommended to go through [its documentation](https://pkg.go.dev/text/template) to understand how to do basic things such as conditionals, loops, etc. In addition, it also uses [tidwall's gjson](https://github.com/tidwall/gjson) package to parse the JSON data so it's worth going through its documentation if you want to use more advanced JSON selectors. You can view additional examples with explanations and function definitions [here](custom-api.md).
+
+##### `parameters`
+A list of keys and values that will be sent to the custom-api as query paramters.
+
+##### `subrequests`
+A map of additional requests that will be executed concurrently and then made available in the template via the `.Subrequest` property. Example:
+
+```yaml
+- type: custom-api
+ cache: 2h
+ subrequests:
+ another-one:
+ url: https://uselessfacts.jsph.pl/api/v2/facts/random
+ title: Random Fact
+ url: https://uselessfacts.jsph.pl/api/v2/facts/random
+ template: |
+ <p class="size-h4 color-paragraph">{{ .JSON.String "text" }}</p>
+ <p class="size-h4 color-paragraph margin-top-15">{{ (.Subrequest "another-one").JSON.String "text" }}</p>
+```
+
+The subrequests support all the same properties as the main request, except for `subrequests` itself, so you can use `headers`, `parameters`, etc.
+
+`(.Subrequest "key")` can be a little cumbersome to write, so you can define a variable to make it easier:
+
+```yaml
+ template: |
+ {{ $anotherOne := .Subrequest "another-one" }}
+ <p>{{ $anotherOne.JSON.String "text" }}</p>
+```
+
+You can also access the `.Response` property of a subrequest as you would with the main request:
+
+```yaml
+ template: |
+ {{ $anotherOne := .Subrequest "another-one" }}
+ <p>{{ $anotherOne.Response.StatusCode }}</p>
+```
+
+> [!NOTE]
+>
+> Setting this property will override any query parameters that are already in the URL.
+
+```yaml
+parameters:
+ param1: value1
+ param2:
+ - item1
+ - item2
+```
### Extension
Display a widget provided by an external source (3rd party). If you want to learn more about developing extensions, checkout the [extensions documentation](extensions.md) (WIP).
@@ -1083,6 +1535,7 @@ Display a widget provided by an external source (3rd party). If you want to lear
| url | string | yes | |
| fallback-content-type | string | no | |
| allow-potentially-dangerous-html | boolean | no | false |
+| headers | key & value | no | |
| parameters | key & value | no | |
##### `url`
@@ -1091,6 +1544,14 @@ The URL of the extension. **Note that the query gets stripped from this URL and
##### `fallback-content-type`
Optionally specify the fallback content type of the extension if the URL does not return a valid `Widget-Content-Type` header. Currently the only supported value for this property is `html`.
+##### `headers`
+Optionally specify the headers that will be sent with the request. Example:
+
+```yaml
+headers:
+ x-api-key: ${SECRET_KEY}
+```
+
##### `allow-potentially-dangerous-html`
Whether to allow the extension to display HTML.
@@ -1224,10 +1685,12 @@ Properties for each site:
| title | string | yes | |
| url | string | yes | |
| check-url | string | no | |
+| error-url | string | no | |
| icon | string | no | |
| allow-insecure | boolean | no | false |
| same-tab | boolean | no | false |
| alt-status-codes | array | no | |
+| basic-auth | object | no | |
`title`
@@ -1235,12 +1698,16 @@ The title used to indicate the site.
`url`
-The public facing URL of a monitored service, the user will be redirected here. If `check-url` is not specified, this is used as the status check.
+The URL of the monitored service, which must be reachable by Glance, and will be used as the link to go to when clicking on the title. If `check-url` is not specified, this is used as the status check.
`check-url`
The URL which will be requested and its response will determine the status of the site. If not specified, the `url` property is used.
+`error-url`
+
+If the monitored service returns an error, the user will be redirected here. If not specified, the `url` property is used.
+
`icon`
Optional URL to an image which will be used as the icon for the site. Can be an external URL or internal via [server configured assets](#assets-path). You can also directly use [Simple Icons](https://simpleicons.org/) via a `si:` prefix or [Dashboard Icons](https://github.com/walkxcode/dashboard-icons) via a `di:` prefix:
@@ -1272,6 +1739,16 @@ alt-status-codes:
- 403
```
+`basic-auth`
+
+HTTP Basic Authentication credentials for protected sites.
+
+```yaml
+basic-auth:
+ usename: your-username
+ password: your-password
+```
+
### Releases
Display a list of latest releases for specific repositories on Github, GitLab, Codeberg or Docker Hub.
@@ -1314,7 +1791,7 @@ repositories:
- codeberg:redict/redict
```
-Official images on Docker Hub can be specified by ommiting the owner:
+Official images on Docker Hub can be specified by omitting the owner:
```yaml
repositories:
@@ -1323,7 +1800,7 @@ repositories:
- dockerhub:alpine
```
-You can also specify specific tags for Docker Hub images:
+You can also specify exact tags for Docker Hub images:
```yaml
repositories:
@@ -1331,6 +1808,17 @@ repositories:
- dockerhub:nginx:stable-alpine
```
+To include prereleases you can specify the repository as an object and use the `include-prereleases` property:
+
+**Note: This feature is currently only available for GitHub repositories.**
+
+```yaml
+repositories:
+ - gitlab:inkscape/inkscape
+ - repository: glanceapp/glance
+ include-prereleases: true
+ - codeberg:redict/redict
+```
##### `show-source-icon`
Shows an icon of the source (GitHub/GitLab/Codeberg/Docker Hub) next to the repository name when set to `true`.
@@ -1345,7 +1833,7 @@ services:
glance:
image: glanceapp/glance
environment:
- - GITHUB_TOKEN: <your token>
+ - GITHUB_TOKEN=<your token>
```
and then use it in your `glance.yml` like this:
@@ -1367,8 +1855,186 @@ The maximum number of releases to show.
#### `collapse-after`
How many releases are visible before the "SHOW MORE" button appears. Set to `-1` to never collapse.
+### Docker Containers
+
+Display the status of your Docker containers along with an icon and an optional short description.
+
+
+
+```yaml
+- type: docker-containers
+ hide-by-default: false
+```
+
+> [!NOTE]
+>
+> The widget requires access to `docker.sock`. If you're running Glance inside a container, this can be done by mounting the socket as a volume:
+>
+> ```yaml
+> services:
+> glance:
+> image: glanceapp/glance
+> volumes:
+> - /var/run/docker.sock:/var/run/docker.sock
+> ```
+
+Configuration of the containers is done via labels applied to each container:
+
+```yaml
+ jellyfin:
+ image: jellyfin/jellyfin:latest
+ labels:
+ glance.name: Jellyfin
+ glance.icon: si:jellyfin
+ glance.url: https://jellyfin.domain.com
+ glance.description: Movies & shows
+```
+
+Alternatively, you can also define the values within your `glance.yml` via the `containers` property, where the key is the container name and each value is the same as the labels but without the "glance." prefix:
+
+```yaml
+- type: docker-containers
+ containers:
+ container_name_1:
+ title: Container Name
+ description: Description of the container
+ url: https://container.domain.com
+ icon: si:container-icon
+ hide: false
+```
+
+For services with multiple containers you can specify a `glance.id` on the "main" container and `glance.parent` on each "child" container:
+
+<details>
+<summary>View <code>docker-compose.yml</code></summary>
+<br>
+
+```yaml
+services:
+ immich-server:
+ image: ghcr.io/immich-app/immich-server
+ labels:
+ glance.name: Immich
+ glance.icon: si:immich
+ glance.url: https://immich.domain.com
+ glance.description: Image & video management
+ glance.id: immich
+
+ redis:
+ image: docker.io/redis:6.2-alpine
+ labels:
+ glance.parent: immich
+ glance.name: Redis
+
+ database:
+ image: docker.io/tensorchord/pgvecto-rs:pg14-v0.2.0
+ labels:
+ glance.parent: immich
+ glance.name: DB
+
+ proxy:
+ image: nginx:stable
+ labels:
+ glance.parent: immich
+ glance.name: Proxy
+```
+</details>
+<br>
+
+This will place all child containers under the `Immich` container when hovering over its icon:
+
+
+
+If any of the child containers are down, their status will propagate up to the parent container:
+
+
+
+#### Properties
+
+| Name | Type | Required | Default |
+| ---- | ---- | -------- | ------- |
+| hide-by-default | boolean | no | false |
+| format-container-names | boolean | no | false |
+| sock-path | string | no | /var/run/docker.sock |
+| category | string | no | |
+| running-only | boolean | no | false |
+
+##### `hide-by-default`
+Whether to hide the containers by default. If set to `true` you'll have to manually add a `glance.hide: false` label to each container you want to display. By default all containers will be shown and if you want to hide a specific container you can add a `glance.hide: true` label.
+
+##### `format-container-names`
+When set to `true`, automatically converts container names such as `container_name_1` into `Container Name 1`.
+
+##### `sock-path`
+The path to the Docker socket. This can also be a [remote socket](https://docs.docker.com/engine/daemon/remote-access/) or proxied socket using something like [docker-socket-proxy](https://github.com/Tecnativa/docker-socket-proxy).
+
+###### `category`
+Filter to only the containers which have this category specified via the `glance.category` label. Useful if you want to have multiple containers widgets, each showing a different set of containers.
+
+<details>
+<summary>View example</summary>
+<br>
+
+
+```yaml
+services:
+ jellyfin:
+ image: jellyfin/jellyfin:latest
+ labels:
+ glance.name: Jellyfin
+ glance.icon: si:jellyfin
+ glance.url: https://jellyfin.domain.com
+ glance.category: media
+
+ gitea:
+ image: gitea/gitea:latest
+ labels:
+ glance.name: Gitea
+ glance.icon: si:gitea
+ glance.url: https://gitea.domain.com
+ glance.category: dev-tools
+
+ vaultwarden:
+ image: vaultwarden/server:latest
+ labels:
+ glance.name: Vaultwarden
+ glance.icon: si:vaultwarden
+ glance.url: https://vaultwarden.domain.com
+ glance.category: dev-tools
+```
+
+Then you can use the `category` property to filter the containers:
+
+```yaml
+- type: docker-containers
+ title: Dev tool containers
+ category: dev-tools
+
+- type: docker-containers
+ title: Media containers
+ category: media
+```
+
+</details>
+
+##### `running-only`
+Whether to only show running containers. If set to `true` only containers that are currently running will be displayed. If set to `false` all containers will be displayed regardless of their state.
+
+#### Labels
+| Name | Description |
+| ---- | ----------- |
+| glance.name | The name displayed in the UI. If not specified, the name of the container will be used. |
+| glance.icon | The icon displayed in the UI. Can be an external URL or an icon prefixed with si:, sh: or di: like with the bookmarks and monitor widgets |
+| glance.url | The URL that the user will be redirected to when clicking on the container. |
+| glance.same-tab | Whether to open the link in the same or a new tab. Default is `false`. |
+| glance.description | A short description displayed in the UI. Default is empty. |
+| glance.hide | Whether to hide the container. If set to `true` the container will not be displayed. Defaults to `false`. |
+| glance.id | The custom ID of the container. Used to group containers under a single parent. |
+| glance.parent | The ID of the parent container. Used to group containers under a single parent. |
+| glance.category | The category of the container. Used to filter containers by category. |
+
### DNS Stats
-Display statistics from a self-hosted ad-blocking DNS resolver such as AdGuard Home or Pi-hole.
+Display statistics from a self-hosted ad-blocking DNS resolver such as AdGuard Home, Pi-hole, or Technitium.
Example:
@@ -1386,7 +2052,7 @@ Preview:
> [!NOTE]
>
-> When using AdGuard Home the 3rd statistic on top will be the average latency and when using Pi-hole it will be the total number of blocked domains from all adlists.
+> When using AdGuard Home the 3rd statistic on top will be the average latency and when using Pi-hole or Technitium it will be the total number of blocked domains from all adlists.
#### Properties
@@ -1396,29 +2062,33 @@ Preview:
| allow-insecure | bool | no | false |
| url | string | yes | |
| username | string | when service is `adguard` | |
-| password | string | when service is `adguard` | |
+| password | string | when service is `adguard` or `pihole-v6` | |
| token | string | when service is `pihole` | |
| hide-graph | bool | no | false |
| hide-top-domains | bool | no | false |
| hour-format | string | no | 12h |
##### `service`
-Either `adguard` or `pihole`.
+Either `adguard`, `technitium`, or `pihole` (major version 5 and below) or `pihole-v6` (major version 6 and above).
##### `allow-insecure`
Whether to allow invalid/self-signed certificates when making the request to the service.
##### `url`
-The base URL of the service. Can be specified from an environment variable using the syntax `${VARIABLE_NAME}`.
+The base URL of the service.
##### `username`
-Only required when using AdGuard Home. The username used to log into the admin dashboard. Can be specified from an environment variable using the syntax `${VARIABLE_NAME}`.
+Only required when using AdGuard Home. The username used to log into the admin dashboard.
##### `password`
-Only required when using AdGuard Home. The password used to log into the admin dashboard. Can be specified from an environment variable using the syntax `${VARIABLE_NAME}`.
+Required when using AdGuard Home, where the password is the one used to log into the admin dashboard.
+
+Also required when using Pi-hole major version 6 and above, where the password is the one used to log into the admin dashboard or the application password, which can be found in `Settings -> Web Interface / API -> Configure app password`.
##### `token`
-Only required when using Pi-hole. The API token which can be found in `Settings -> API -> Show API token`. Can be specified from an environment variable using the syntax `${VARIABLE_NAME}`.
+Required when using Pi-hole major version 5 or earlier. The API token which can be found in `Settings -> API -> Show API token`.
+
+Also required when using Technitium, an API token can be generated at `Administration -> Sessions -> Create Token`.
##### `hide-graph`
Whether to hide the graph showing the number of queries over time.
@@ -1429,6 +2099,124 @@ Whether to hide the list of top blocked domains.
##### `hour-format`
Whether to display the relative time in the graph in `12h` or `24h` format.
+### Server Stats
+Display statistics such as CPU usage, memory usage and disk usage of the server Glance is running on or other servers.
+
+Example:
+
+```yaml
+- type: server-stats
+ servers:
+ - type: local
+ name: Services
+```
+
+Preview:
+
+
+
+> [!NOTE]
+>
+> This widget is currently under development, some features might not function as expected or may change.
+
+To display data from a remote server you need to have the Glance Agent running on that server. You can download the agent from [here](https://github.com/glanceapp/agent), though keep in mind that it is still in development and may not work as expected. Support for other providers such as Glances will be added in the future.
+
+In the event that the CPU temperature goes over 80°C, a flame icon will appear next to the CPU. The progress indicators will also turn red (or the equivalent of your negative color) to hopefully grab your attention if anything is unusually high:
+
+
+
+#### Properties
+| Name | Type | Required | Default |
+| ---- | ---- | -------- | ------- |
+| servers | array | no | |
+
+##### `servers`
+If not provided it will display the statistics of the server Glance is running on.
+
+##### Properties for both `local` and `remote` servers
+| Name | Type | Required | Default |
+| ---- | ---- | -------- | ------- |
+| type | string | yes | |
+| name | string | no | |
+| hide-swap | boolean | no | false |
+
+###### `type`
+Whether to display statistics for the local server or a remote server. Possible values are `local` and `remote`.
+
+###### `name`
+The name of the server which will be displayed on the widget. If not provided it will default to the server's hostname.
+
+###### `hide-swap`
+Whether to hide the swap usage.
+
+##### Properties for the `local` server
+| Name | Type | Required | Default |
+| ---- | ---- | -------- | ------- |
+| cpu-temp-sensor | string | no | |
+| hide-mountpoints-by-default | boolean | no | false |
+| mountpoints | map\[string\]object | no | |
+
+###### `cpu-temp-sensor`
+The name of the sensor to use for the CPU temperature. When not provided the widget will attempt to find the correct one, if it fails to do so the temperature will not be displayed. To view the available sensors you can use `sensors` command.
+
+###### `hide-mountpoints-by-default`
+If set to `true` you'll have to manually make each mountpoint visible by adding a `hide: false` property to it like so:
+
+```yaml
+- type: server-stats
+ servers:
+ - type: local
+ hide-mountpoints-by-default: true
+ mountpoints:
+ "/":
+ hide: false
+ "/mnt/data":
+ hide: false
+```
+
+This is useful if you're running Glance inside of a container which usually mounts a lot of irrelevant filesystems.
+
+###### `mountpoints`
+A map of mountpoints to display disk usage for. The key is the path to the mountpoint and the value is an object with optional properties. Example:
+
+```yaml
+mountpoints:
+ "/":
+ name: Root
+ "/mnt/data":
+ name: Data
+ "/boot/efi":
+ hide: true
+```
+
+##### Properties for each `mountpoint`
+| Name | Type | Required | Default |
+| ---- | ---- | -------- | ------- |
+| name | string | no | |
+| hide | boolean | no | false |
+
+###### `name`
+The name of the mountpoint which will be displayed on the widget. If not provided it will default to the mountpoint's path.
+
+###### `hide`
+Whether to hide this mountpoint from the widget.
+
+##### Properties for `remote` servers
+| Name | Type | Required | Default |
+| ---- | ---- | -------- | ------- |
+| url | string | yes | |
+| token | string | no | |
+| timeout | string | no | 3s |
+
+###### `url`
+The URL and port of the server to fetch the statistics from.
+
+###### `token`
+The authentication token to use when fetching the statistics.
+
+###### `timeout`
+The maximum time to wait for a response from the server. The value is a string and must be a number followed by one of s, m, h, d. Example: `10s` for 10 seconds, `1m` for 1 minute, etc
+
### Repository
Display general information about a repository as well as a list of the latest open pull requests and issues.
@@ -1532,19 +2320,22 @@ An array of groups which can optionally have a title and a custom color.
| links | array | yes | |
| same-tab | boolean | no | false |
| hide-arrow | boolean | no | false |
+| target | string | no | |
> [!TIP]
>
-> You can set `same-tab` and `hide-arrow` either on the group which will apply them to all links in that group, or on each individual link which will override the value set on the group.
+> You can set `same-tab`, `hide-arrow` and `target` either on the group which will apply them to all links in that group, or on each individual link which will override the value set on the group.
###### Properties for each link
| Name | Type | Required | Default |
| ---- | ---- | -------- | ------- |
| title | string | yes | |
| url | string | yes | |
+| description | string | no | |
| icon | string | no | |
| same-tab | boolean | no | false |
| hide-arrow | boolean | no | false |
+| target | string | no | |
`icon`
@@ -1568,6 +2359,10 @@ Whether to open the link in the same tab or a new one.
Whether to hide the colored arrow on each link.
+`target`
+
+Set a custom value for the link's `target` attribute. Possible values are `_blank`, `_self`, `_parent` and `_top`, you can read more about what they do [here](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a#target). This property has precedence over `same-tab`.
+
### ChangeDetection.io
Display a list watches from changedetection.io.
@@ -1667,7 +2462,7 @@ Example:
```yaml
- type: calendar
- start-sunday: false
+ first-day-of-week: monday
```
Preview:
@@ -1676,6 +2471,33 @@ Preview:
#### Properties
+| Name | Type | Required | Default |
+| ---- | ---- | -------- | ------- |
+| first-day-of-week | string | no | monday |
+
+##### `first-day-of-week`
+The day of the week that the calendar starts on. All week days are available as possible values.
+
+### Calendar (legacy)
+Display a calendar.
+
+Example:
+
+```yaml
+- type: calendar-legacy
+ start-sunday: false
+```
+
+Preview:
+
+
+
+> [!NOTE]
+>
+> This widget is deprecated and may be removed in a future version.
+
+#### Properties
+
| Name | Type | Required | Default |
| ---- | ---- | -------- | ------- |
| start-sunday | boolean | no | false |
@@ -1717,6 +2539,8 @@ Preview:
| ---- | ---- | -------- |
| markets | array | yes |
| sort-by | string | no |
+| chart-link-template | string | no |
+| symbol-link-template | string | no |
##### `markets`
An array of markets for which to display information about.
@@ -1724,7 +2548,21 @@ An array of markets for which to display information about.
##### `sort-by`
By default the markets are displayed in the order they were defined. You can customize their ordering by setting the `sort-by` property to `change` for descending order based on the stock's percentage change (e.g. 1% would be sorted higher than -1%) or `absolute-change` for descending order based on the stock's absolute price change (e.g. -1% would be sorted higher than +0.5%).
-###### Properties for each stock
+##### `chart-link-template`
+A template for the link to go to when clicking on the chart that will be applied to all markets. The value `{SYMBOL}` will be replaced with the symbol of the market. You can override this on a per-market basis by specifying a `chart-link` property. Example:
+
+```yaml
+chart-link-template: https://www.tradingview.com/chart/?symbol={SYMBOL}
+```
+
+##### `symbol-link-template`
+A template for the link to go to when clicking on the symbol that will be applied to all markets. The value `{SYMBOL}` will be replaced with the symbol of the market. You can override this on a per-market basis by specifying a `symbol-link` property. Example:
+
+```yaml
+symbol-link-template: https://www.google.com/search?tbm=nws&q={SYMBOL}
+```
+
+###### Properties for each market
| Name | Type | Required |
| ---- | ---- | -------- |
| symbol | string | yes |
@@ -1741,9 +2579,11 @@ The symbol, as seen in Yahoo Finance.
The name that will be displayed under the symbol.
`symbol-link`
+
The link to go to when clicking on the symbol.
`chart-link`
+
The link to go to when clicking on the chart.
### Twitch Channels
@@ -1857,75 +2697,3 @@ Example:
```
Note the use of `|` after `source:`, this allows you to insert a multi-line string.
-
-### Docker Containers
-<!-- TODO: update -->
-The Docker widget allows you to monitor your Docker containers.
-To enable this feature, ensure that your setup provides access to the **docker.sock** file (also you may use a TCP connection).
-
-Add the following to your `docker-compose` or `docker run` command to enable the Docker widget:
-
-**Docker Example:**
-```bash
-docker run -d -p 8080:8080 \
- -v ./glance.yml:/app/glance.yml \
- -v /etc/timezone:/etc/timezone:ro \
- -v /etc/localtime:/etc/localtime:ro \
- -v /var/run/docker.sock:/var/run/docker.sock:ro \
- glanceapp/glance
-```
-
-**Docker Compose Example:**
-```yaml
-services:
- glance:
- image: glanceapp/glance
- volumes:
- - ./glance.yml:/app/glance.yml
- - /etc/timezone:/etc/timezone:ro
- - /etc/localtime:/etc/localtime:ro
- - /var/run/docker.sock:/var/run/docker.sock:ro
- ports:
- - 8080:8080
- restart: unless-stopped
-```
-
-#### Configuration
-To integrate the Docker widget into your dashboard, include the following snippet in your `glance.yml` file:
-
-```yaml
-- type: docker
- host-url: tcp://localhost:2375
- cache: 1m
-```
-
-#### Properties
-
-| Name | Type | Required | Default |
-| ---- | ---- | -------- | ------- |
-| host-url | string | no | `unix:///var/run/docker.sock` |
-
-#### Leveraging Container Labels
-You can use container labels to control visibility, URLs, icons, and titles within the Docker widget. Add the following labels to your container configuration for enhanced customization:
-
-```yaml
-labels:
- - "glance.enable=true" # Enable or disable visibility of the container (default: true)
- - "glance.title=Glance" # Optional friendly name (defaults to container name)
- - "glance.url=https://app.example.com" # Optional URL associated with the container
- - "glance.iconUrl=si:docker" # Optional URL to an image which will be used as the icon for the site
-
-```
-
-**Default Values:**
-
-| Name | Default |
-|----------------|------------|
-| glance.enable | true |
-| glance.title | Container name |
-| glance.url | (none) |
-| glance.iconUrl | si:docker |
-
-Preview:
-
-
diff --git a/docs/custom-api.md b/docs/custom-api.md
new file mode 100644
index 0000000..3a37df2
--- /dev/null
+++ b/docs/custom-api.md
@@ -0,0 +1,416 @@
+[Jump to function definitions](#functions)
+
+## Examples
+
+The best way to get an idea of how the templates work would be with a bunch examples. Here are the most common use cases:
+
+JSON response:
+
+```json
+{
+ "title": "My Title",
+ "content": "My Content",
+}
+```
+
+To access the two fields in the JSON response, you would use the following:
+
+```html
+<div>{{ .JSON.String "title" }}</div>
+<div>{{ .JSON.String "content" }}</div>
+```
+
+Output:
+
+```html
+<div>My Title</div>
+<div>My Content</div>
+```
+
+<hr>
+
+JSON response:
+
+```json
+{
+ "author": "John Doe",
+ "posts": [
+ {
+ "title": "My Title",
+ "content": "My Content"
+ },
+ {
+ "title": "My Title 2",
+ "content": "My Content 2"
+ }
+ ]
+}
+```
+
+To loop through the array of posts, you would use the following:
+
+```html
+{{ range .JSON.Array "posts" }}
+ <div>{{ .String "title" }}</div>
+ <div>{{ .String "content" }}</div>
+{{ end }}
+```
+
+Output:
+
+```html
+<div>My Title</div>
+<div>My Content</div>
+<div>My Title 2</div>
+<div>My Content 2</div>
+```
+
+Notice the missing `.JSON` when accessing the title and content, this is because the range function sets the context to the current array element.
+
+If you want to access the top-level context within the range, you can use the following:
+
+```html
+{{ range .JSON.Array "posts" }}
+ <div>{{ .String "title" }}</div>
+ <div>{{ .String "content" }}</div>
+ <div>{{ $.JSON.String "author" }}</div>
+{{ end }}
+```
+
+Output:
+
+```html
+<div>My Title</div>
+<div>My Content</div>
+<div>John Doe</div>
+<div>My Title 2</div>
+<div>My Content 2</div>
+<div>John Doe</div>
+```
+
+<hr>
+
+JSON response:
+
+```json
+[
+ "Apple",
+ "Banana",
+ "Cherry",
+ "Watermelon"
+]
+```
+
+Somewhat awkwardly, when the current context is a basic type that isn't an object, the way you specify its type is to use an empty string as the key. So, to loop through the array of strings, you would use the following:
+
+```html
+{{ range .JSON.Array "" }}
+ <div>{{ .String "" }}</div>
+{{ end }}
+```
+
+Output:
+
+```html
+<div>Apple</div>
+<div>Banana</div>
+<div>Cherry</div>
+<div>Watermelon</div>
+```
+
+To access an item at a specific index, you could use the following:
+
+```html
+<div>{{ .JSON.String "0" }}</div>
+```
+
+Output:
+
+```html
+<div>Apple</div>
+```
+
+<hr>
+
+JSON response:
+
+```json
+{
+ "user": {
+ "address": {
+ "city": "New York",
+ "state": "NY"
+ }
+ }
+}
+```
+
+To easily access deeply nested objects, you can use the following dot notation:
+
+```html
+<div>{{ .JSON.String "user.address.city" }}</div>
+<div>{{ .JSON.String "user.address.state" }}</div>
+```
+
+Output:
+
+```html
+<div>New York</div>
+<div>NY</div>
+```
+
+Using indexes anywhere in the path is also supported:
+
+```json
+{
+ "users": [
+ {
+ "name": "John Doe"
+ },
+ {
+ "name": "Jane Doe"
+ }
+ ]
+}
+```
+
+```html
+<div>{{ .JSON.String "users.0.name" }}</div>
+<div>{{ .JSON.String "users.1.name" }}</div>
+```
+
+Output:
+
+```html
+<div>John Doe</div>
+<div>Jane Doe</div>
+```
+
+<hr>
+
+JSON response:
+
+```json
+{
+ "user": {
+ "name": "John Doe",
+ "age": 30
+ }
+}
+```
+
+To check if a field exists, you can use the following:
+
+```html
+{{ if .JSON.Exists "user.age" }}
+ <div>{{ .JSON.Int "user.age" }}</div>
+{{ else }}
+ <div>Age not provided</div>
+{{ end }}
+```
+
+Output:
+
+```html
+<div>30</div>
+```
+
+<hr>
+
+JSON response:
+
+```json
+{
+ "price": 100,
+ "discount": 10
+}
+```
+
+Calculations can be performed on either ints or floats. If both numbers are ints, an int will be returned, otherwise a float will be returned. If you try to divide by zero, 0 will be returned. If you provide non-numeric values, `NaN` will be returned.
+
+```html
+<div>{{ sub (.JSON.Int "price") (.JSON.Int "discount") }}</div>
+```
+
+Output:
+
+```html
+<div>90</div>
+```
+
+Other operations include `add`, `mul`, and `div`.
+
+<hr>
+
+JSON response:
+
+```json
+{
+ "posts": [
+ {
+ "title": "Exploring the Depths of Quantum Computing",
+ "date": "2023-10-27T10:00:00Z"
+ },
+ {
+ "title": "A Beginner's Guide to Sustainable Living",
+ "date": "2023-11-15T14:30:00+01:00"
+ },
+ {
+ "title": "The Art of Baking Sourdough Bread",
+ "date": "2023-12-03T08:45:22-08:00"
+ }
+ ]
+}
+```
+
+To parse the date and display the relative time (e.g. 2h, 1d, etc), you would use the following:
+
+```
+{{ range .JSON.Array "posts" }}
+ <div>{{ .String "title" }}</div>
+ <div {{ .String "date" | parseTime "rfc3339" | toRelativeTime }}></div>
+{{ end }}
+```
+
+The `parseTime` function takes two arguments: the layout of the date string and the date string itself. The layout can be one of the following: "RFC3339", "RFC3339Nano", "DateTime", "DateOnly", "TimeOnly" or a custom layout in Go's [date format](https://pkg.go.dev/time#pkg-constants).
+
+Output:
+
+```html
+<div>Exploring the Depths of Quantum Computing</div>
+<div data-dynamic-relative-time="1698400800"></div>
+
+<div>A Beginner's Guide to Sustainable Living</div>
+<div data-dynamic-relative-time="1700055000"></div>
+
+<div>The Art of Baking Sourdough Bread</div>
+<div data-dynamic-relative-time="1701621922"></div>
+```
+
+You don't have to worry about the internal implementation, this will then be dynamically populated by Glance on the client side to show the correct relative time.
+
+The important thing to notice here is that the return value of `toRelativeTime` must be used as an attribute in an HTML tag, be it a `div`, `li`, `span`, etc.
+
+<hr>
+
+In some instances, you may want to know the status code of the response. This can be done using the following:
+
+```html
+{{ if eq .Response.StatusCode 200 }}
+ <p>Success!</p>
+{{ else }}
+ <p>Failed to fetch data</p>
+{{ end }}
+```
+
+You can also access the response headers:
+
+```html
+<div>{{ .Response.Header.Get "Content-Type" }}</div>
+```
+
+<hr>
+
+JSON response:
+
+```json
+{"name": "Steve", "age": 30}
+{"name": "Alex", "age": 25}
+{"name": "John", "age": 35}
+```
+
+The above format is "[ndjson](https://docs.mulesoft.com/dataweave/latest/dataweave-formats-ndjson)" or "[JSON Lines](https://jsonlines.org/)", where each line is a separate JSON object. To parse this format, you must first disable the JSON validation check in your config, since by default the response is expected to be a single valid JSON object:
+
+```yaml
+- type: custom-api
+ skip-json-validation: true
+```
+
+Then, to iterate over each object you can use `.JSONLines`:
+
+```html
+{{ range .JSONLines }}
+ <p>{{ .String "name" }} is {{ .Int "age" }} years old</p>
+{{ end }}
+```
+
+Output:
+
+```html
+<p>Steve is 30 years old</p>
+<p>Alex is 25 years old</p>
+<p>John is 35 years old</p>
+```
+
+For other ways of selecting data from a JSON Lines response, have a look at the docs for [tidwall/gjson](https://github.com/tidwall/gjson/tree/master?tab=readme-ov-file#json-lines). For example, to get an array of all names, you can use the following:
+
+```html
+{{ range .JSON.Array "..#.name" }}
+ <p>{{ .String "" }}</p>
+{{ end }}
+```
+
+Output:
+
+```html
+<p>Steve</p>
+<p>Alex</p>
+<p>John</p>
+```
+
+## Functions
+
+The following functions are available on the `JSON` object:
+
+- `String(key string) string`: Returns the value of the key as a string.
+- `Int(key string) int`: Returns the value of the key as an integer.
+- `Float(key string) float`: Returns the value of the key as a float.
+- `Bool(key string) bool`: Returns the value of the key as a boolean.
+- `Array(key string) []JSON`: Returns the value of the key as an array of `JSON` objects.
+- `Exists(key string) bool`: Returns true if the key exists in the JSON object.
+
+The following helper functions provided by Glance are available:
+
+- `toFloat(i int) float`: Converts an integer to a float.
+- `toInt(f float) int`: Converts a float to an integer.
+- `toRelativeTime(t time.Time) template.HTMLAttr`: Converts Time to a relative time such as 2h, 1d, etc which dynamically updates. **NOTE:** the value of this function should be used as an attribute in an HTML tag, e.g. `<span {{ toRelativeTime .Time }}></span>`.
+- `now() time.Time`: Returns the current time.
+- `offsetNow(offset string) time.Time`: Returns the current time with an offset. The offset can be positive or negative and must be in the format "3h" "-1h" or "2h30m10s".
+- `duration(str string) time.Duration`: Parses a string such as `1h`, `24h`, `5h30m`, etc into a `time.Duration`.
+- `parseTime(layout string, s string) time.Time`: Parses a string into time.Time. The layout must be provided in Go's [date format](https://pkg.go.dev/time#pkg-constants). You can alternatively use these values instead of the literal format: "unix", "RFC3339", "RFC3339Nano", "DateTime", "DateOnly".
+- `parseLocalTime(layout string, s string) time.Time`: Same as the above, except in the absence of a timezone, it will use the local timezone instead of UTC.
+- `parseRelativeTime(layout string, s string) time.Time`: A shorthand for `{{ .String "date" | parseTime "rfc3339" | toRelativeTime }}`.
+- `add(a, b float) float`: Adds two numbers.
+- `sub(a, b float) float`: Subtracts two numbers.
+- `mul(a, b float) float`: Multiplies two numbers.
+- `div(a, b float) float`: Divides two numbers.
+- `formatApproxNumber(n int) string`: Formats a number to be more human-readable, e.g. 1000 -> 1k.
+- `formatNumber(n float|int) string`: Formats a number with commas, e.g. 1000 -> 1,000.
+- `trimPrefix(prefix string, str string) string`: Trims the prefix from a string.
+- `trimSuffix(suffix string, str string) string`: Trims the suffix from a string.
+- `trimSpace(str string) string`: Trims whitespace from a string on both ends.
+- `replaceAll(old string, new string, str string) string`: Replaces all occurrences of a string in a string.
+- `replaceMatches(pattern string, replacement string, str string) string`: Replaces all occurrences of a regular expression in a string.
+- `findMatch(pattern string, str string) string`: Finds the first match of a regular expression in a string.
+- `findSubmatch(pattern string, str string) string`: Finds the first submatch of a regular expression in a string.
+- `sortByString(key string, order string, arr []JSON): []JSON`: Sorts an array of JSON objects by a string key in either ascending or descending order.
+- `sortByInt(key string, order string, arr []JSON): []JSON`: Sorts an array of JSON objects by an integer key in either ascending or descending order.
+- `sortByFloat(key string, order string, arr []JSON): []JSON`: Sorts an array of JSON objects by a float key in either ascending or descending order.
+- `sortByTime(key string, layout string, order string, arr []JSON): []JSON`: Sorts an array of JSON objects by a time key in either ascending or descending order. The format must be provided in Go's [date format](https://pkg.go.dev/time#pkg-constants).
+- `concat(strings ...string) string`: Concatenates multiple strings together.
+- `unique(key string, arr []JSON) []JSON`: Returns a unique array of JSON objects based on the given key.
+
+The following helper functions provided by Go's `text/template` are available:
+
+- `eq(a, b any) bool`: Compares two values for equality.
+- `ne(a, b any) bool`: Compares two values for inequality.
+- `lt(a, b any) bool`: Compares two values for less than.
+- `lte(a, b any) bool`: Compares two values for less than or equal to.
+- `gt(a, b any) bool`: Compares two values for greater than.
+- `gte(a, b any) bool`: Compares two values for greater than or equal to.
+- `and(a, b bool) bool`: Returns true if both values are true.
+- `or(a, b bool) bool`: Returns true if either value is true.
+- `not(a bool) bool`: Returns the opposite of the value.
+- `index(a any, b int) any`: Returns the value at the specified index of an array.
+- `len(a any) int`: Returns the length of an array.
+- `printf(format string, a ...any) string`: Returns a formatted string.
diff --git a/docs/extensions.md b/docs/extensions.md
index b1fa4fa..b6719c1 100644
--- a/docs/extensions.md
+++ b/docs/extensions.md
@@ -26,6 +26,9 @@ If you know how to setup an HTTP server and a bit of HTML and CSS you're ready t
### `Widget-Title`
Used to specify the title of the widget. If not provided, the widget's title will be "Extension".
+### `Widget-Title-URL`
+Used to specify the URL that will be opened when the widget's title is clicked. If the user has specified a `title-url` in their config, it will take precedence over this header.
+
### `Widget-Content-Type`
Used to specify the content type that will be returned by the extension. If not provided, the content will be shown as plain text.
diff --git a/docs/glance.yml b/docs/glance.yml
new file mode 100644
index 0000000..35dc7cb
--- /dev/null
+++ b/docs/glance.yml
@@ -0,0 +1,105 @@
+pages:
+ - name: Home
+ # Optionally, if you only have a single page you can hide the desktop navigation for a cleaner look
+ # hide-desktop-navigation: true
+ columns:
+ - size: small
+ widgets:
+ - type: calendar
+ first-day-of-week: monday
+
+ - type: rss
+ limit: 10
+ collapse-after: 3
+ cache: 12h
+ feeds:
+ - url: https://selfh.st/rss/
+ title: selfh.st
+ limit: 4
+ - url: https://ciechanow.ski/atom.xml
+ - url: https://www.joshwcomeau.com/rss.xml
+ title: Josh Comeau
+ - url: https://samwho.dev/rss.xml
+ - url: https://ishadeed.com/feed.xml
+ title: Ahmad Shadeed
+
+ - type: twitch-channels
+ channels:
+ - theprimeagen
+ - j_blow
+ - piratesoftware
+ - cohhcarnage
+ - christitustech
+ - EJ_SA
+
+ - size: full
+ widgets:
+ - type: group
+ widgets:
+ - type: hacker-news
+ - type: lobsters
+
+ - type: videos
+ channels:
+ - UCXuqSBlHAE6Xw-yeJA0Tunw # Linus Tech Tips
+ - UCR-DXc1voovS8nhAvccRZhg # Jeff Geerling
+ - UCsBjURrPoezykLs9EqgamOA # Fireship
+ - UCBJycsmduvYEL83R_U4JriQ # Marques Brownlee
+ - UCHnyfMqiRRG1u-2MsSQLbXA # Veritasium
+
+ - type: group
+ widgets:
+ - type: reddit
+ subreddit: technology
+ show-thumbnails: true
+ - type: reddit
+ subreddit: selfhosted
+ show-thumbnails: true
+
+ - size: small
+ widgets:
+ - type: weather
+ location: London, United Kingdom
+ units: metric # alternatively "imperial"
+ hour-format: 12h # alternatively "24h"
+ # Optionally hide the location from being displayed in the widget
+ # hide-location: true
+
+ - type: markets
+ markets:
+ - symbol: SPY
+ name: S&P 500
+ - symbol: BTC-USD
+ name: Bitcoin
+ - symbol: NVDA
+ name: NVIDIA
+ - symbol: AAPL
+ name: Apple
+ - symbol: MSFT
+ name: Microsoft
+
+ - type: releases
+ cache: 1d
+ # Without authentication the Github API allows for up to 60 requests per hour. You can create a
+ # read-only token from your Github account settings and use it here to increase the limit.
+ # token: ...
+ repositories:
+ - glanceapp/glance
+ - go-gitea/gitea
+ - immich-app/immich
+ - syncthing/syncthing
+
+ # Add more pages here:
+ # - name: Your page name
+ # columns:
+ # - size: small
+ # widgets:
+ # # Add widgets here
+
+ # - size: full
+ # widgets:
+ # # Add widgets here
+
+ # - size: small
+ # widgets:
+ # # Add widgets here
diff --git a/docs/images/calendar-legacy-widget-preview.png b/docs/images/calendar-legacy-widget-preview.png
new file mode 100644
index 0000000..5a161bf
Binary files /dev/null and b/docs/images/calendar-legacy-widget-preview.png differ
diff --git a/docs/images/calendar-widget-preview.png b/docs/images/calendar-widget-preview.png
index 5a161bf..4922a9b 100644
Binary files a/docs/images/calendar-widget-preview.png and b/docs/images/calendar-widget-preview.png differ
diff --git a/docs/images/custom-api-preview-1.png b/docs/images/custom-api-preview-1.png
new file mode 100644
index 0000000..4cf4c30
Binary files /dev/null and b/docs/images/custom-api-preview-1.png differ
diff --git a/docs/images/custom-api-preview-2.png b/docs/images/custom-api-preview-2.png
new file mode 100644
index 0000000..481ef85
Binary files /dev/null and b/docs/images/custom-api-preview-2.png differ
diff --git a/docs/images/custom-api-preview-3.png b/docs/images/custom-api-preview-3.png
new file mode 100644
index 0000000..15d8cb2
Binary files /dev/null and b/docs/images/custom-api-preview-3.png differ
diff --git a/docs/images/docker-container-parent.png b/docs/images/docker-container-parent.png
new file mode 100644
index 0000000..479b3e8
Binary files /dev/null and b/docs/images/docker-container-parent.png differ
diff --git a/docs/images/docker-container-parent2.png b/docs/images/docker-container-parent2.png
new file mode 100644
index 0000000..4562239
Binary files /dev/null and b/docs/images/docker-container-parent2.png differ
diff --git a/docs/images/docker-containers-preview.png b/docs/images/docker-containers-preview.png
new file mode 100644
index 0000000..ba14fce
Binary files /dev/null and b/docs/images/docker-containers-preview.png differ
diff --git a/docs/images/preconfigured-page-preview.png b/docs/images/preconfigured-page-preview.png
index 0a57c14..e10084c 100644
Binary files a/docs/images/preconfigured-page-preview.png and b/docs/images/preconfigured-page-preview.png differ
diff --git a/docs/images/reddit-field-search.png b/docs/images/reddit-field-search.png
index 97ba04a..a84ee33 100644
Binary files a/docs/images/reddit-field-search.png and b/docs/images/reddit-field-search.png differ
diff --git a/docs/images/server-stats-flame-icon.png b/docs/images/server-stats-flame-icon.png
new file mode 100644
index 0000000..28cf0b8
Binary files /dev/null and b/docs/images/server-stats-flame-icon.png differ
diff --git a/docs/images/server-stats-preview.gif b/docs/images/server-stats-preview.gif
new file mode 100644
index 0000000..829679b
Binary files /dev/null and b/docs/images/server-stats-preview.gif differ
diff --git a/docs/images/split-column-widget-3-columns.png b/docs/images/split-column-widget-3-columns.png
new file mode 100644
index 0000000..88192c3
Binary files /dev/null and b/docs/images/split-column-widget-3-columns.png differ
diff --git a/docs/images/split-column-widget-4-columns.png b/docs/images/split-column-widget-4-columns.png
new file mode 100644
index 0000000..450f53e
Binary files /dev/null and b/docs/images/split-column-widget-4-columns.png differ
diff --git a/docs/images/split-column-widget-masonry.png b/docs/images/split-column-widget-masonry.png
new file mode 100644
index 0000000..145b2d6
Binary files /dev/null and b/docs/images/split-column-widget-masonry.png differ
diff --git a/docs/images/split-column-widget-preview.png b/docs/images/split-column-widget-preview.png
index f1931f8..1ee336d 100644
Binary files a/docs/images/split-column-widget-preview.png and b/docs/images/split-column-widget-preview.png differ
diff --git a/docs/images/themes/dracula.png b/docs/images/themes/dracula.png
new file mode 100644
index 0000000..8dba452
Binary files /dev/null and b/docs/images/themes/dracula.png differ
diff --git a/docs/images/themes/gruvbox.png b/docs/images/themes/gruvbox.png
new file mode 100644
index 0000000..2e5b7a9
Binary files /dev/null and b/docs/images/themes/gruvbox.png differ
diff --git a/docs/images/videos-widget-vertical-list-preview.png b/docs/images/videos-widget-vertical-list-preview.png
new file mode 100644
index 0000000..e33ce86
Binary files /dev/null and b/docs/images/videos-widget-vertical-list-preview.png differ
diff --git a/docs/themes.md b/docs/themes.md
index b4185db..fdc10b2 100644
--- a/docs/themes.md
+++ b/docs/themes.md
@@ -53,6 +53,16 @@ theme:
primary-color: 97 13 80
```
+### Gruvbox Dark
+
+```yaml
+theme:
+ background-color: 0 0 16
+ primary-color: 43 59 81
+ positive-color: 61 66 44
+ negative-color: 6 96 59
+```
+
### Kanagawa Dark
```yaml
@@ -72,6 +82,17 @@ theme:
negative-color: 209 88 54
```
+### Dracula
+
+```yaml
+theme:
+ background-color: 231 15 21
+ primary-color: 265 89 79
+ contrast-multiplier: 1.2
+ positive-color: 135 94 66
+ negative-color: 0 100 67
+```
+
## Light
### Catppuccin Latte
diff --git a/docs/v0.7.0-upgrade.md b/docs/v0.7.0-upgrade.md
new file mode 100644
index 0000000..93fa6b8
--- /dev/null
+++ b/docs/v0.7.0-upgrade.md
@@ -0,0 +1,57 @@
+## Upgrading to v0.7.0 from previous versions
+
+In essence, the `glance.yml` file has been moved from the root of the project to a `config/` directory and you now need to mount that directory to `/app/config` in the container.
+
+### Before
+
+Versions before v0.7.0 used a `docker-compose.yml` that looked like the following:
+
+```yaml
+services:
+ glance:
+ image: glanceapp/glance
+ volumes:
+ - ./glance.yml:/app/glance.yml
+ ports:
+ - 8080:8080
+```
+
+And expected you to have the following directory structure:
+
+```plaintext
+glance/
+ docker-compose.yml
+ glance.yml
+```
+
+### After
+
+With the release of v0.7.0, the recommended `docker-compose.yml` looks like the following:
+
+```yaml
+services:
+ glance:
+ container_name: glance
+ image: glanceapp/glance
+ volumes:
+ - ./config:/app/config
+ ports:
+ - 8080:8080
+```
+
+And expects you to have the following directory structure:
+
+```plaintext
+glance/
+ docker-compose.yml
+ config/
+ glance.yml
+```
+
+## Why this change was necessary
+
+1. Mounting a file rather than a directory is not common practice and leads to some issues, such as creating a directory if the file is not present, which has tripped up multiple people and caused unnecessary confusion
+2. v0.7.0 added automatic reloads when the configuration file changes, which based on testing didn't work when mounting a single file
+3. v0.7.0 added the ability to include config files, so you'd have to make this change anyways if you wanted to take advantage of that feature
+
+Taking all of these into account, it felt like the right time to implement the change.
diff --git a/go.mod b/go.mod
index aa66fa8..4c19477 100644
--- a/go.mod
+++ b/go.mod
@@ -1,24 +1,32 @@
module github.com/glanceapp/glance
-go 1.23.1
+go 1.24.2
require (
- github.com/fsnotify/fsnotify v1.8.0
+ github.com/fsnotify/fsnotify v1.9.0
github.com/mmcdole/gofeed v1.3.0
+ github.com/shirou/gopsutil/v4 v4.25.3
github.com/tidwall/gjson v1.18.0
- golang.org/x/text v0.21.0
+ golang.org/x/text v0.24.0
gopkg.in/yaml.v3 v3.0.1
)
require (
- github.com/PuerkitoBio/goquery v1.10.0 // indirect
+ github.com/PuerkitoBio/goquery v1.10.2 // indirect
github.com/andybalholm/cascadia v1.3.3 // indirect
+ github.com/ebitengine/purego v0.8.2 // indirect
+ github.com/go-ole/go-ole v1.3.0 // indirect
github.com/json-iterator/go v1.1.12 // indirect
+ github.com/lufia/plan9stats v0.0.0-20250317134145-8bc96cf8fc35 // indirect
github.com/mmcdole/goxpp v1.1.1 // indirect
github.com/modern-go/concurrent v0.0.0-20180306012644-bacd9c7ef1dd // indirect
github.com/modern-go/reflect2 v1.0.2 // indirect
+ github.com/power-devops/perfstat v0.0.0-20240221224432-82ca36839d55 // indirect
github.com/tidwall/match v1.1.1 // indirect
github.com/tidwall/pretty v1.2.1 // indirect
- golang.org/x/net v0.33.0 // indirect
- golang.org/x/sys v0.28.0 // indirect
+ github.com/tklauser/go-sysconf v0.3.15 // indirect
+ github.com/tklauser/numcpus v0.10.0 // indirect
+ github.com/yusufpapurcu/wmi v1.2.4 // indirect
+ golang.org/x/net v0.39.0 // indirect
+ golang.org/x/sys v0.32.0 // indirect
)
diff --git a/go.sum b/go.sum
index 7840f0b..9a79559 100644
--- a/go.sum
+++ b/go.sum
@@ -1,18 +1,31 @@
-github.com/PuerkitoBio/goquery v1.10.0 h1:6fiXdLuUvYs2OJSvNRqlNPoBm6YABE226xrbavY5Wv4=
-github.com/PuerkitoBio/goquery v1.10.0/go.mod h1:TjZZl68Q3eGHNBA8CWaxAN7rOU1EbDz3CWuolcO5Yu4=
-github.com/andybalholm/cascadia v1.3.2 h1:3Xi6Dw5lHF15JtdcmAHD3i1+T8plmv7BQ/nsViSLyss=
-github.com/andybalholm/cascadia v1.3.2/go.mod h1:7gtRlve5FxPPgIgX36uWBX58OdBsSS6lUvCFb+h7KvU=
+github.com/PuerkitoBio/goquery v1.10.1 h1:Y8JGYUkXWTGRB6Ars3+j3kN0xg1YqqlwvdTV8WTFQcU=
+github.com/PuerkitoBio/goquery v1.10.1/go.mod h1:IYiHrOMps66ag56LEH7QYDDupKXyo5A8qrjIx3ZtujY=
+github.com/PuerkitoBio/goquery v1.10.2 h1:7fh2BdHcG6VFZsK7toXBT/Bh1z5Wmy8Q9MV9HqT2AM8=
+github.com/PuerkitoBio/goquery v1.10.2/go.mod h1:0guWGjcLu9AYC7C1GHnpysHy056u9aEkUHwhdnePMCU=
github.com/andybalholm/cascadia v1.3.3 h1:AG2YHrzJIm4BZ19iwJ/DAua6Btl3IwJX+VI4kktS1LM=
github.com/andybalholm/cascadia v1.3.3/go.mod h1:xNd9bqTn98Ln4DwST8/nG+H0yuB8Hmgu1YHNnWw0GeA=
github.com/davecgh/go-spew v1.1.0/go.mod h1:J7Y8YcW2NihsgmVo/mv3lAwl/skON4iLHjSsI+c5H38=
github.com/davecgh/go-spew v1.1.1 h1:vj9j/u1bqnvCEfJOwUhtlOARqs3+rkHYY13jYWTU97c=
github.com/davecgh/go-spew v1.1.1/go.mod h1:J7Y8YcW2NihsgmVo/mv3lAwl/skON4iLHjSsI+c5H38=
+github.com/ebitengine/purego v0.8.2 h1:jPPGWs2sZ1UgOSgD2bClL0MJIqu58nOmIcBuXr62z1I=
+github.com/ebitengine/purego v0.8.2/go.mod h1:iIjxzd6CiRiOG0UyXP+V1+jWqUXVjPKLAI0mRfJZTmQ=
github.com/fsnotify/fsnotify v1.8.0 h1:dAwr6QBTBZIkG8roQaJjGof0pp0EeF+tNV7YBP3F/8M=
github.com/fsnotify/fsnotify v1.8.0/go.mod h1:8jBTzvmWwFyi3Pb8djgCCO5IBqzKJ/Jwo8TRcHyHii0=
+github.com/fsnotify/fsnotify v1.9.0 h1:2Ml+OJNzbYCTzsxtv8vKSFD9PbJjmhYF14k/jKC7S9k=
+github.com/fsnotify/fsnotify v1.9.0/go.mod h1:8jBTzvmWwFyi3Pb8djgCCO5IBqzKJ/Jwo8TRcHyHii0=
+github.com/go-ole/go-ole v1.2.6/go.mod h1:pprOEPIfldk/42T2oK7lQ4v4JSDwmV0As9GaiUsvbm0=
+github.com/go-ole/go-ole v1.3.0 h1:Dt6ye7+vXGIKZ7Xtk4s6/xVdGDQynvom7xCFEdWr6uE=
+github.com/go-ole/go-ole v1.3.0/go.mod h1:5LS6F96DhAwUc7C+1HLexzMXY1xGRSryjyPPKW6zv78=
+github.com/google/go-cmp v0.6.0 h1:ofyhxvXcZhMsU5ulbFiLKl/XBFqE1GSq7atu8tAmTRI=
github.com/google/go-cmp v0.6.0/go.mod h1:17dUlkBOakJ0+DkrSSNjCkIjxS6bF9zb3elmeNGIjoY=
+github.com/google/go-cmp v0.7.0 h1:wk8382ETsv4JYUZwIsn6YpYiWiBsYLSJiTsyBybVuN8=
github.com/google/gofuzz v1.0.0/go.mod h1:dBl0BpW6vV/+mYPU4Po3pmUjxk6FQPldtuIdl/M65Eg=
github.com/json-iterator/go v1.1.12 h1:PV8peI4a0ysnczrg+LtxykD8LfKY9ML6u2jnxaEnrnM=
github.com/json-iterator/go v1.1.12/go.mod h1:e30LSqwooZae/UwlEbR2852Gd8hjQvJoHmT4TnhNGBo=
+github.com/lufia/plan9stats v0.0.0-20240909124753-873cd0166683 h1:7UMa6KCCMjZEMDtTVdcGu0B1GmmC7QJKiCCjyTAWQy0=
+github.com/lufia/plan9stats v0.0.0-20240909124753-873cd0166683/go.mod h1:ilwx/Dta8jXAgpFYFvSWEMwxmbWXyiUHkd5FwyKhb5k=
+github.com/lufia/plan9stats v0.0.0-20250317134145-8bc96cf8fc35 h1:PpXWgLPs+Fqr325bN2FD2ISlRRztXibcX6e8f5FR5Dc=
+github.com/lufia/plan9stats v0.0.0-20250317134145-8bc96cf8fc35/go.mod h1:autxFIvghDt3jPTLoqZ9OZ7s9qTGNAWmYCjVFWPX/zg=
github.com/mmcdole/gofeed v1.3.0 h1:5yn+HeqlcvjMeAI4gu6T+crm7d0anY85+M+v6fIFNG4=
github.com/mmcdole/gofeed v1.3.0/go.mod h1:9TGv2LcJhdXePDzxiuMnukhV2/zb6VtnZt1mS+SjkLE=
github.com/mmcdole/goxpp v1.1.1 h1:RGIX+D6iQRIunGHrKqnA2+700XMCnNv0bAOOv5MUhx8=
@@ -24,10 +37,16 @@ github.com/modern-go/reflect2 v1.0.2 h1:xBagoLtFs94CBntxluKeaWgTMpvLxC4ur3nMaC9G
github.com/modern-go/reflect2 v1.0.2/go.mod h1:yWuevngMOJpCy52FWWMvUC8ws7m/LJsjYzDa0/r8luk=
github.com/pmezard/go-difflib v1.0.0 h1:4DBwDE0NGyQoBHbLQYPwSUPoCMWR5BEzIk/f1lZbAQM=
github.com/pmezard/go-difflib v1.0.0/go.mod h1:iKH77koFhYxTK1pcRnkKkqfTogsbg7gZNVY4sRDYZ/4=
+github.com/power-devops/perfstat v0.0.0-20240221224432-82ca36839d55 h1:o4JXh1EVt9k/+g42oCprj/FisM4qX9L3sZB3upGN2ZU=
+github.com/power-devops/perfstat v0.0.0-20240221224432-82ca36839d55/go.mod h1:OmDBASR4679mdNQnz2pUhc2G8CO2JrUAVFDRBDP/hJE=
+github.com/shirou/gopsutil/v4 v4.25.1 h1:QSWkTc+fu9LTAWfkZwZ6j8MSUk4A2LV7rbH0ZqmLjXs=
+github.com/shirou/gopsutil/v4 v4.25.1/go.mod h1:RoUCUpndaJFtT+2zsZzzmhvbfGoDCJ7nFXKJf8GqJbI=
+github.com/shirou/gopsutil/v4 v4.25.3 h1:SeA68lsu8gLggyMbmCn8cmp97V1TI9ld9sVzAUcKcKE=
+github.com/shirou/gopsutil/v4 v4.25.3/go.mod h1:xbuxyoZj+UsgnZrENu3lQivsngRR5BdjbJwf2fv4szA=
github.com/stretchr/objx v0.1.0/go.mod h1:HFkY916IF+rwdDfMAkV7OtwuqBVzrE8GR6GFx+wExME=
github.com/stretchr/testify v1.3.0/go.mod h1:M5WIy9Dh21IEIfnGCwXGc5bZfKNJtfHm1UVUgZn+9EI=
-github.com/stretchr/testify v1.8.1 h1:w7B6lhMri9wdJUVmEZPGGhZzrYTPvgJArz7wNPgYKsk=
-github.com/stretchr/testify v1.8.1/go.mod h1:w2LPCIKwWwSfY2zedu0+kehJoqGctiVI29o6fzry7u4=
+github.com/stretchr/testify v1.10.0 h1:Xv5erBjTwe/5IxqUQTdXv5kgmIvbHo3QQyRwhJsOfJA=
+github.com/stretchr/testify v1.10.0/go.mod h1:r2ic/lqez/lEtzL7wO/rwa5dbSLXVDPFyf8C91i36aY=
github.com/tidwall/gjson v1.18.0 h1:FIDeeyB800efLX89e5a8Y0BNH+LOngJyGrIWxG2FKQY=
github.com/tidwall/gjson v1.18.0/go.mod h1:/wbyibRr2FHMks5tjHJ5F8dMZh3AcwJEMf5vlfC0lxk=
github.com/tidwall/match v1.1.1 h1:+Ho715JplO36QYgwN9PGYNhgZvoUSc9X2c80KVTi+GA=
@@ -35,7 +54,17 @@ github.com/tidwall/match v1.1.1/go.mod h1:eRSPERbgtNPcGhD8UCthc6PmLEQXEWd3PRB5JT
github.com/tidwall/pretty v1.2.0/go.mod h1:ITEVvHYasfjBbM0u2Pg8T2nJnzm8xPwvNhhsoaGGjNU=
github.com/tidwall/pretty v1.2.1 h1:qjsOFOWWQl+N3RsoF5/ssm1pHmJJwhjlSbZ51I6wMl4=
github.com/tidwall/pretty v1.2.1/go.mod h1:ITEVvHYasfjBbM0u2Pg8T2nJnzm8xPwvNhhsoaGGjNU=
+github.com/tklauser/go-sysconf v0.3.14 h1:g5vzr9iPFFz24v2KZXs/pvpvh8/V9Fw6vQK5ZZb78yU=
+github.com/tklauser/go-sysconf v0.3.14/go.mod h1:1ym4lWMLUOhuBOPGtRcJm7tEGX4SCYNEEEtghGG/8uY=
+github.com/tklauser/go-sysconf v0.3.15 h1:VE89k0criAymJ/Os65CSn1IXaol+1wrsFHEB8Ol49K4=
+github.com/tklauser/go-sysconf v0.3.15/go.mod h1:Dmjwr6tYFIseJw7a3dRLJfsHAMXZ3nEnL/aZY+0IuI4=
+github.com/tklauser/numcpus v0.9.0 h1:lmyCHtANi8aRUgkckBgoDk1nHCux3n2cgkJLXdQGPDo=
+github.com/tklauser/numcpus v0.9.0/go.mod h1:SN6Nq1O3VychhC1npsWostA+oW+VOQTxZrS604NSRyI=
+github.com/tklauser/numcpus v0.10.0 h1:18njr6LDBk1zuna922MgdjQuJFjrdppsZG60sHGfjso=
+github.com/tklauser/numcpus v0.10.0/go.mod h1:BiTKazU708GQTYF4mB+cmlpT2Is1gLk7XVuEeem8LsQ=
github.com/yuin/goldmark v1.4.13/go.mod h1:6yULJ656Px+3vBD8DxQVa3kxgyrAnzto9xy5taEt/CY=
+github.com/yusufpapurcu/wmi v1.2.4 h1:zFUKzehAFReQwLys1b/iSMl+JQGSCSjtVqQn9bBrPo0=
+github.com/yusufpapurcu/wmi v1.2.4/go.mod h1:SBZ9tNy3G9/m5Oi98Zks0QjeHVDvuK0qfxQmPyzfmi0=
golang.org/x/crypto v0.0.0-20190308221718-c2843e01d9a2/go.mod h1:djNgcEr1/C05ACkg1iLfiJU5Ep61QUkGW8qpdssI0+w=
golang.org/x/crypto v0.0.0-20210921155107-089bfa567519/go.mod h1:GvvjBRRGRdwPK5ydBHafDWAxML/pGHZbMvKqRZ5+Abc=
golang.org/x/crypto v0.13.0/go.mod h1:y6Z2r+Rw4iayiXXAIxJIDAJ1zMW4yaTpebo8fPOliYc=
@@ -51,15 +80,15 @@ golang.org/x/net v0.0.0-20190620200207-3b0461eec859/go.mod h1:z5CRVTTTmAJ677TzLL
golang.org/x/net v0.0.0-20210226172049-e18ecbb05110/go.mod h1:m0MpNAwzfU5UDzcl9v0D8zg8gWTRqZa9RBIspLL5mdg=
golang.org/x/net v0.0.0-20220722155237-a158d28d115b/go.mod h1:XRhObCWvk6IyKnWLug+ECip1KBveYUHfp+8e9klMJ9c=
golang.org/x/net v0.6.0/go.mod h1:2Tu9+aMcznHK/AK1HMvgo6xiTLG5rD5rZLDS+rp2Bjs=
-golang.org/x/net v0.9.0/go.mod h1:d48xBJpPfHeWQsugry2m+kC02ZBRGRgulfHnEXEuWns=
golang.org/x/net v0.10.0/go.mod h1:0qNGK6F8kojg2nk9dLZ2mShWaEBan6FAoqfSigmmuDg=
golang.org/x/net v0.15.0/go.mod h1:idbUs1IY1+zTqbi8yxTbhexhEEk5ur9LInksu6HrEpk=
golang.org/x/net v0.21.0/go.mod h1:bIjVDfnllIU7BJ2DNgfnXvpSvtn8VRwhlsaeUTyUS44=
golang.org/x/net v0.25.0/go.mod h1:JkAGAh7GEvH74S6FOH42FLoXpXbE/aqXSrIQjXgsiwM=
-golang.org/x/net v0.31.0 h1:68CPQngjLL0r2AlUKiSxtQFKvzRVbnzLwMUn5SzcLHo=
-golang.org/x/net v0.31.0/go.mod h1:P4fl1q7dY2hnZFxEk4pPSkDHF+QqjitcnDjUQyMM+pM=
-golang.org/x/net v0.33.0 h1:74SYHlV8BIgHIFC/LrYkOGIwL19eTYXQ5wc6TBuO36I=
golang.org/x/net v0.33.0/go.mod h1:HXLR5J+9DxmrqMwG9qjGCxZ+zKXxBru04zlTvWlWuN4=
+golang.org/x/net v0.34.0 h1:Mb7Mrk043xzHgnRM88suvJFwzVrRfHEHJEl5/71CKw0=
+golang.org/x/net v0.34.0/go.mod h1:di0qlW3YNM5oh6GqDGQr92MyTozJPmybPK4Ev/Gm31k=
+golang.org/x/net v0.39.0 h1:ZCu7HMWDxpXpaiKdhzIfaltL9Lp31x/3fCP11bc6/fY=
+golang.org/x/net v0.39.0/go.mod h1:X7NRbYVEA+ewNkCNyJ513WmMdQ3BineSwVtN2zD/d+E=
golang.org/x/sync v0.0.0-20190423024810-112230192c58/go.mod h1:RxMgew5VJxzue5/jJTE5uejpjVlOe/izrB70Jof72aM=
golang.org/x/sync v0.0.0-20220722155255-886fb9371eb4/go.mod h1:RxMgew5VJxzue5/jJTE5uejpjVlOe/izrB70Jof72aM=
golang.org/x/sync v0.1.0/go.mod h1:RxMgew5VJxzue5/jJTE5uejpjVlOe/izrB70Jof72aM=
@@ -68,25 +97,27 @@ golang.org/x/sync v0.6.0/go.mod h1:Czt+wKu1gCyEFDUtn0jG5QVvpJ6rzVqr5aXyt9drQfk=
golang.org/x/sync v0.7.0/go.mod h1:Czt+wKu1gCyEFDUtn0jG5QVvpJ6rzVqr5aXyt9drQfk=
golang.org/x/sync v0.10.0/go.mod h1:Czt+wKu1gCyEFDUtn0jG5QVvpJ6rzVqr5aXyt9drQfk=
golang.org/x/sys v0.0.0-20190215142949-d0b11bdaac8a/go.mod h1:STP8DvDyc/dI5b8T5hshtkjS+E42TnysNCUPdjciGhY=
+golang.org/x/sys v0.0.0-20190916202348-b4ddaad3f8a3/go.mod h1:h1NjWce9XRLGQEsW7wpKNCjG9DtNlClVuFLEZdDNbEs=
golang.org/x/sys v0.0.0-20201119102817-f84b799fce68/go.mod h1:h1NjWce9XRLGQEsW7wpKNCjG9DtNlClVuFLEZdDNbEs=
+golang.org/x/sys v0.0.0-20201204225414-ed752295db88/go.mod h1:h1NjWce9XRLGQEsW7wpKNCjG9DtNlClVuFLEZdDNbEs=
golang.org/x/sys v0.0.0-20210615035016-665e8c7367d1/go.mod h1:oPkhp1MJrh7nUepCBck5+mAzfO9JrbApNNgaTdGDITg=
golang.org/x/sys v0.0.0-20220520151302-bc2c85ada10a/go.mod h1:oPkhp1MJrh7nUepCBck5+mAzfO9JrbApNNgaTdGDITg=
golang.org/x/sys v0.0.0-20220722155257-8c9f86f7a55f/go.mod h1:oPkhp1MJrh7nUepCBck5+mAzfO9JrbApNNgaTdGDITg=
+golang.org/x/sys v0.1.0/go.mod h1:oPkhp1MJrh7nUepCBck5+mAzfO9JrbApNNgaTdGDITg=
golang.org/x/sys v0.5.0/go.mod h1:oPkhp1MJrh7nUepCBck5+mAzfO9JrbApNNgaTdGDITg=
-golang.org/x/sys v0.7.0/go.mod h1:oPkhp1MJrh7nUepCBck5+mAzfO9JrbApNNgaTdGDITg=
golang.org/x/sys v0.8.0/go.mod h1:oPkhp1MJrh7nUepCBck5+mAzfO9JrbApNNgaTdGDITg=
golang.org/x/sys v0.12.0/go.mod h1:oPkhp1MJrh7nUepCBck5+mAzfO9JrbApNNgaTdGDITg=
golang.org/x/sys v0.17.0/go.mod h1:/VUhepiaJMQUp4+oa/7Zr1D23ma6VTLIYjOOTFZPUcA=
golang.org/x/sys v0.20.0/go.mod h1:/VUhepiaJMQUp4+oa/7Zr1D23ma6VTLIYjOOTFZPUcA=
-golang.org/x/sys v0.27.0 h1:wBqf8DvsY9Y/2P8gAfPDEYNuS30J4lPHJxXSb/nJZ+s=
-golang.org/x/sys v0.27.0/go.mod h1:/VUhepiaJMQUp4+oa/7Zr1D23ma6VTLIYjOOTFZPUcA=
-golang.org/x/sys v0.28.0 h1:Fksou7UEQUWlKvIdsqzJmUmCX3cZuD2+P3XyyzwMhlA=
golang.org/x/sys v0.28.0/go.mod h1:/VUhepiaJMQUp4+oa/7Zr1D23ma6VTLIYjOOTFZPUcA=
+golang.org/x/sys v0.30.0 h1:QjkSwP/36a20jFYWkSue1YwXzLmsV5Gfq7Eiy72C1uc=
+golang.org/x/sys v0.30.0/go.mod h1:/VUhepiaJMQUp4+oa/7Zr1D23ma6VTLIYjOOTFZPUcA=
+golang.org/x/sys v0.32.0 h1:s77OFDvIQeibCmezSnk/q6iAfkdiQaJi4VzroCFrN20=
+golang.org/x/sys v0.32.0/go.mod h1:BJP2sWEmIv4KK5OTEluFJCKSidICx8ciO85XgH3Ak8k=
golang.org/x/telemetry v0.0.0-20240228155512-f48c80bd79b2/go.mod h1:TeRTkGYfJXctD9OcfyVLyj2J3IxLnKwHJR8f4D8a3YE=
golang.org/x/term v0.0.0-20201126162022-7de9c90e9dd1/go.mod h1:bj7SfCRtBDWHUb9snDiAeCFNEtKQo2Wmx5Cou7ajbmo=
golang.org/x/term v0.0.0-20210927222741-03fcf44c2211/go.mod h1:jbD1KX2456YbFQfuXm/mYQcufACuNUgVhRMnK/tPxf8=
golang.org/x/term v0.5.0/go.mod h1:jMB1sMXY+tzblOD4FWmEbocvup2/aLOaQEp7JmGp78k=
-golang.org/x/term v0.7.0/go.mod h1:P32HKFT3hSsZrRxla30E9HqToFYAQPCMs/zFMBUFqPY=
golang.org/x/term v0.8.0/go.mod h1:xPskH00ivmX89bAKVGSKKtLOWNx2+17Eiy94tnKShWo=
golang.org/x/term v0.12.0/go.mod h1:owVbMEjm3cBLCHdkQu9b1opXd4ETQWc3BhuQGKgXgvU=
golang.org/x/term v0.17.0/go.mod h1:lLRBjIVuehSbZlaOtGMbcMncT+aqLLLmKrsjNrUguwk=
@@ -100,10 +131,11 @@ golang.org/x/text v0.9.0/go.mod h1:e1OnstbJyHTd6l/uOt8jFFHp6TRDWZR/bV3emEE/zU8=
golang.org/x/text v0.13.0/go.mod h1:TvPlkZtksWOMsz7fbANvkp4WM8x/WCo/om8BMLbz+aE=
golang.org/x/text v0.14.0/go.mod h1:18ZOQIKpY8NJVqYksKHtTdi31H5itFRjB5/qKTNYzSU=
golang.org/x/text v0.15.0/go.mod h1:18ZOQIKpY8NJVqYksKHtTdi31H5itFRjB5/qKTNYzSU=
-golang.org/x/text v0.20.0 h1:gK/Kv2otX8gz+wn7Rmb3vT96ZwuoxnQlY+HlJVj7Qug=
-golang.org/x/text v0.20.0/go.mod h1:D4IsuqiFMhST5bX19pQ9ikHC2GsaKyk/oF+pn3ducp4=
-golang.org/x/text v0.21.0 h1:zyQAAkrwaneQ066sspRyJaG9VNi/YJ1NfzcGB3hZ/qo=
golang.org/x/text v0.21.0/go.mod h1:4IBbMaMmOPCJ8SecivzSH54+73PCFmPWxNTLm+vZkEQ=
+golang.org/x/text v0.22.0 h1:bofq7m3/HAFvbF51jz3Q9wLg3jkvSPuiZu/pD1XwgtM=
+golang.org/x/text v0.22.0/go.mod h1:YRoo4H8PVmsu+E3Ou7cqLVH8oXWIHVoX0jqUWALQhfY=
+golang.org/x/text v0.24.0 h1:dd5Bzh4yt5KYA8f9CJHCP4FB4D51c2c6JvN37xJJkJ0=
+golang.org/x/text v0.24.0/go.mod h1:L8rBsPeo2pSS+xqN0d5u2ikmjtmoJbDBT1b7nHvFCdU=
golang.org/x/tools v0.0.0-20180917221912-90fa682c2a6e/go.mod h1:n7NCudcB/nEzxVGmLbDWY5pfWTLqBcC2KZ6jyYvM4mQ=
golang.org/x/tools v0.0.0-20191119224855-298f0cb1881e/go.mod h1:b+2E5dAYhXwXZwtnZ6UAqBI28+e2cm9otk0dWdXHAEo=
golang.org/x/tools v0.1.12/go.mod h1:hNGJHUnrk76NpqgfD5Aqm5Crs+Hm0VOH/i9J2+nxYbc=
diff --git a/internal/glance/cli.go b/internal/glance/cli.go
index e231706..0a76e66 100644
--- a/internal/glance/cli.go
+++ b/internal/glance/cli.go
@@ -5,23 +5,39 @@ import (
"fmt"
"os"
"strings"
+
+ "github.com/shirou/gopsutil/v4/disk"
+ "github.com/shirou/gopsutil/v4/sensors"
)
type cliIntent uint8
const (
- cliIntentServe cliIntent = iota
- cliIntentConfigValidate = iota
- cliIntentConfigPrint = iota
- cliIntentDiagnose = iota
+ cliIntentVersionPrint cliIntent = iota
+ cliIntentServe
+ cliIntentConfigValidate
+ cliIntentConfigPrint
+ cliIntentDiagnose
+ cliIntentSensorsPrint
+ cliIntentMountpointInfo
)
type cliOptions struct {
intent cliIntent
configPath string
+ args []string
}
func parseCliOptions() (*cliOptions, error) {
+ var args []string
+
+ args = os.Args[1:]
+ if len(args) == 1 && (args[0] == "--version" || args[0] == "-v" || args[0] == "version") {
+ return &cliOptions{
+ intent: cliIntentVersionPrint,
+ }, nil
+ }
+
flags := flag.NewFlagSet("", flag.ExitOnError)
flags.Usage = func() {
fmt.Println("Usage: glance [options] command")
@@ -32,6 +48,8 @@ func parseCliOptions() (*cliOptions, error) {
fmt.Println("\nCommands:")
fmt.Println(" config:validate Validate the config file")
fmt.Println(" config:print Print the parsed config file with embedded includes")
+ fmt.Println(" sensors:print List all sensors")
+ fmt.Println(" mountpoint:info Print information about a given mountpoint path")
fmt.Println(" diagnose Run diagnostic checks")
}
configPath := flags.String("config", "glance.yml", "Set config path")
@@ -41,7 +59,7 @@ func parseCliOptions() (*cliOptions, error) {
}
var intent cliIntent
- var args = flags.Args()
+ args = flags.Args()
unknownCommandErr := fmt.Errorf("unknown command: %s", strings.Join(args, " "))
if len(args) == 0 {
@@ -51,11 +69,19 @@ func parseCliOptions() (*cliOptions, error) {
intent = cliIntentConfigValidate
} else if args[0] == "config:print" {
intent = cliIntentConfigPrint
+ } else if args[0] == "sensors:print" {
+ intent = cliIntentSensorsPrint
} else if args[0] == "diagnose" {
intent = cliIntentDiagnose
} else {
return nil, unknownCommandErr
}
+ } else if len(args) == 2 {
+ if args[0] == "mountpoint:info" {
+ intent = cliIntentMountpointInfo
+ } else {
+ return nil, unknownCommandErr
+ }
} else {
return nil, unknownCommandErr
}
@@ -63,5 +89,54 @@ func parseCliOptions() (*cliOptions, error) {
return &cliOptions{
intent: intent,
configPath: *configPath,
+ args: args,
}, nil
}
+
+func cliSensorsPrint() int {
+ tempSensors, err := sensors.SensorsTemperatures()
+ if err != nil {
+ if warns, ok := err.(*sensors.Warnings); ok {
+ fmt.Printf("Could not retrieve information for some sensors (%v):\n", err)
+ for _, w := range warns.List {
+ fmt.Printf(" - %v\n", w)
+ }
+ fmt.Println()
+ } else {
+ fmt.Printf("Failed to retrieve sensor information: %v\n", err)
+ return 1
+ }
+ }
+
+ if len(tempSensors) == 0 {
+ fmt.Println("No sensors found")
+ return 0
+ }
+
+ fmt.Println("Sensors found:")
+ for _, sensor := range tempSensors {
+ fmt.Printf(" %s: %.1f°C\n", sensor.SensorKey, sensor.Temperature)
+ }
+
+ return 0
+}
+
+func cliMountpointInfo(requestedPath string) int {
+ usage, err := disk.Usage(requestedPath)
+ if err != nil {
+ fmt.Printf("Failed to retrieve info for path %s: %v\n", requestedPath, err)
+ if warns, ok := err.(*disk.Warnings); ok {
+ for _, w := range warns.List {
+ fmt.Printf(" - %v\n", w)
+ }
+ }
+
+ return 1
+ }
+
+ fmt.Println("Path:", usage.Path)
+ fmt.Println("FS type:", ternary(usage.Fstype == "", "unknown", usage.Fstype))
+ fmt.Printf("Used percent: %.1f%%\n", usage.UsedPercent)
+
+ return 0
+}
diff --git a/internal/glance/config-fields.go b/internal/glance/config-fields.go
index 6c6f0c5..1a0a701 100644
--- a/internal/glance/config-fields.go
+++ b/internal/glance/config-fields.go
@@ -1,7 +1,11 @@
package glance
import (
+ "crypto/tls"
"fmt"
+ "html/template"
+ "net/http"
+ "net/url"
"regexp"
"strconv"
"strings"
@@ -10,7 +14,7 @@ import (
"gopkg.in/yaml.v3"
)
-var hslColorFieldPattern = regexp.MustCompile(`^(?:hsla?\()?(\d{1,3})(?: |,)+(\d{1,3})%?(?: |,)+(\d{1,3})%?\)?$`)
+var hslColorFieldPattern = regexp.MustCompile(`^(?:hsla?\()?([\d\.]+)(?: |,)+([\d\.]+)%?(?: |,)+([\d\.]+)%?\)?$`)
const (
hslHueMax = 360
@@ -19,13 +23,17 @@ const (
)
type hslColorField struct {
- Hue uint16
- Saturation uint8
- Lightness uint8
+ Hue float64
+ Saturation float64
+ Lightness float64
}
func (c *hslColorField) String() string {
- return fmt.Sprintf("hsl(%d, %d%%, %d%%)", c.Hue, c.Saturation, c.Lightness)
+ return fmt.Sprintf("hsl(%.1f, %.1f%%, %.1f%%)", c.Hue, c.Saturation, c.Lightness)
+}
+
+func (c *hslColorField) ToHex() string {
+ return hslToHex(c.Hue, c.Saturation, c.Lightness)
}
func (c *hslColorField) UnmarshalYAML(node *yaml.Node) error {
@@ -41,7 +49,7 @@ func (c *hslColorField) UnmarshalYAML(node *yaml.Node) error {
return fmt.Errorf("invalid HSL color format: %s", value)
}
- hue, err := strconv.ParseUint(matches[1], 10, 16)
+ hue, err := strconv.ParseFloat(matches[1], 64)
if err != nil {
return err
}
@@ -50,7 +58,7 @@ func (c *hslColorField) UnmarshalYAML(node *yaml.Node) error {
return fmt.Errorf("HSL hue must be between 0 and %d", hslHueMax)
}
- saturation, err := strconv.ParseUint(matches[2], 10, 8)
+ saturation, err := strconv.ParseFloat(matches[2], 64)
if err != nil {
return err
}
@@ -59,7 +67,7 @@ func (c *hslColorField) UnmarshalYAML(node *yaml.Node) error {
return fmt.Errorf("HSL saturation must be between 0 and %d", hslSaturationMax)
}
- lightness, err := strconv.ParseUint(matches[3], 10, 8)
+ lightness, err := strconv.ParseFloat(matches[3], 64)
if err != nil {
return err
}
@@ -68,9 +76,9 @@ func (c *hslColorField) UnmarshalYAML(node *yaml.Node) error {
return fmt.Errorf("HSL lightness must be between 0 and %d", hslLightnessMax)
}
- c.Hue = uint16(hue)
- c.Saturation = uint8(saturation)
- c.Lightness = uint8(lightness)
+ c.Hue = hue
+ c.Saturation = saturation
+ c.Lightness = lightness
return nil
}
@@ -112,7 +120,7 @@ func (d *durationField) UnmarshalYAML(node *yaml.Node) error {
}
type customIconField struct {
- URL string
+ URL template.URL
IsFlatIcon bool
// TODO: along with whether the icon is flat, we also need to know
// whether the icon is black or white by default in order to properly
@@ -120,17 +128,23 @@ type customIconField struct {
}
func newCustomIconField(value string) customIconField {
+ const autoInvertPrefix = "auto-invert "
field := customIconField{}
prefix, icon, found := strings.Cut(value, ":")
if !found {
- field.URL = value
+ if strings.HasPrefix(value, autoInvertPrefix) {
+ field.IsFlatIcon = true
+ value = strings.TrimPrefix(value, autoInvertPrefix)
+ }
+
+ field.URL = template.URL(value)
return field
}
switch prefix {
case "si":
- field.URL = "https://cdn.jsdelivr.net/npm/simple-icons@latest/icons/" + icon + ".svg"
+ field.URL = template.URL("https://cdn.jsdelivr.net/npm/simple-icons@latest/icons/" + icon + ".svg")
field.IsFlatIcon = true
case "di", "sh":
// syntax: di:<icon_name>[.svg|.png]
@@ -149,12 +163,12 @@ func newCustomIconField(value string) customIconField {
}
if prefix == "di" {
- field.URL = "https://cdn.jsdelivr.net/gh/walkxcode/dashboard-icons@master/" + ext + "/" + basename + "." + ext
+ field.URL = template.URL("https://cdn.jsdelivr.net/gh/homarr-labs/dashboard-icons/" + ext + "/" + basename + "." + ext)
} else {
- field.URL = "https://cdn.jsdelivr.net/gh/selfhst/icons@main/" + ext + "/" + basename + "." + ext
+ field.URL = template.URL("https://cdn.jsdelivr.net/gh/selfhst/icons/" + ext + "/" + basename + "." + ext)
}
default:
- field.URL = value
+ field.URL = template.URL(value)
}
return field
@@ -169,3 +183,105 @@ func (i *customIconField) UnmarshalYAML(node *yaml.Node) error {
*i = newCustomIconField(value)
return nil
}
+
+type proxyOptionsField struct {
+ URL string `yaml:"url"`
+ AllowInsecure bool `yaml:"allow-insecure"`
+ Timeout durationField `yaml:"timeout"`
+ client *http.Client `yaml:"-"`
+}
+
+func (p *proxyOptionsField) UnmarshalYAML(node *yaml.Node) error {
+ type proxyOptionsFieldAlias proxyOptionsField
+ alias := (*proxyOptionsFieldAlias)(p)
+ var proxyURL string
+
+ if err := node.Decode(&proxyURL); err != nil {
+ if err := node.Decode(alias); err != nil {
+ return err
+ }
+ }
+
+ if proxyURL == "" && p.URL == "" {
+ return nil
+ }
+
+ if p.URL != "" {
+ proxyURL = p.URL
+ }
+
+ parsedUrl, err := url.Parse(proxyURL)
+ if err != nil {
+ return fmt.Errorf("parsing proxy URL: %v", err)
+ }
+
+ var timeout = defaultClientTimeout
+ if p.Timeout > 0 {
+ timeout = time.Duration(p.Timeout)
+ }
+
+ p.client = &http.Client{
+ Timeout: timeout,
+ Transport: &http.Transport{
+ Proxy: http.ProxyURL(parsedUrl),
+ TLSClientConfig: &tls.Config{InsecureSkipVerify: p.AllowInsecure},
+ },
+ }
+
+ return nil
+}
+
+type queryParametersField map[string][]string
+
+func (q *queryParametersField) UnmarshalYAML(node *yaml.Node) error {
+ var decoded map[string]any
+
+ if err := node.Decode(&decoded); err != nil {
+ return err
+ }
+
+ *q = make(queryParametersField)
+
+ // TODO: refactor the duplication in the switch cases if any more types get added
+ for key, value := range decoded {
+ switch v := value.(type) {
+ case string:
+ (*q)[key] = []string{v}
+ case int, int8, int16, int32, int64, float32, float64:
+ (*q)[key] = []string{fmt.Sprintf("%v", v)}
+ case bool:
+ (*q)[key] = []string{fmt.Sprintf("%t", v)}
+ case []string:
+ (*q)[key] = append((*q)[key], v...)
+ case []any:
+ for _, item := range v {
+ switch item := item.(type) {
+ case string:
+ (*q)[key] = append((*q)[key], item)
+ case int, int8, int16, int32, int64, float32, float64:
+ (*q)[key] = append((*q)[key], fmt.Sprintf("%v", item))
+ case bool:
+ (*q)[key] = append((*q)[key], fmt.Sprintf("%t", item))
+ default:
+ return fmt.Errorf("invalid query parameter value type: %T", item)
+ }
+ }
+ default:
+ return fmt.Errorf("invalid query parameter value type: %T", value)
+ }
+ }
+
+ return nil
+}
+
+func (q *queryParametersField) toQueryString() string {
+ query := url.Values{}
+
+ for key, values := range *q {
+ for _, value := range values {
+ query.Add(key, value)
+ }
+ }
+
+ return query.Encode()
+}
diff --git a/internal/glance/config.go b/internal/glance/config.go
index f110470..a778236 100644
--- a/internal/glance/config.go
+++ b/internal/glance/config.go
@@ -17,23 +17,20 @@ import (
"gopkg.in/yaml.v3"
)
-type CssProperties struct {
- BackgroundColor *hslColorField `yaml:"background-color"`
- PrimaryColor *hslColorField `yaml:"primary-color"`
- PositiveColor *hslColorField `yaml:"positive-color"`
- NegativeColor *hslColorField `yaml:"negative-color"`
- Light bool `yaml:"light"`
- ContrastMultiplier float32 `yaml:"contrast-multiplier"`
- TextSaturationMultiplier float32 `yaml:"text-saturation-multiplier"`
-}
+const CONFIG_INCLUDE_RECURSION_DEPTH_LIMIT = 20
+
+const (
+ configVarTypeEnv = "env"
+ configVarTypeSecret = "secret"
+ configVarTypeFileFromEnv = "readFileFromEnv"
+)
type config struct {
Server struct {
- Host string `yaml:"host"`
- Port uint16 `yaml:"port"`
- AssetsPath string `yaml:"assets-path"`
- BaseURL string `yaml:"base-url"`
- StartedAt time.Time `yaml:"-"` // used in custom css file
+ Host string `yaml:"host"`
+ Port uint16 `yaml:"port"`
+ AssetsPath string `yaml:"assets-path"`
+ BaseURL string `yaml:"base-url"`
} `yaml:"server"`
Document struct {
@@ -43,6 +40,7 @@ type config struct {
Theme struct {
// Todo : Find a way to use CssProperties struct to avoid duplicates
BackgroundColor *hslColorField `yaml:"background-color"`
+ BackgroundColorAsHex string `yaml:"-"`
PrimaryColor *hslColorField `yaml:"primary-color"`
PositiveColor *hslColorField `yaml:"positive-color"`
NegativeColor *hslColorField `yaml:"negative-color"`
@@ -55,20 +53,34 @@ type config struct {
} `yaml:"theme"`
Branding struct {
- HideFooter bool `yaml:"hide-footer"`
- CustomFooter template.HTML `yaml:"custom-footer"`
- LogoText string `yaml:"logo-text"`
- LogoURL string `yaml:"logo-url"`
- FaviconURL string `yaml:"favicon-url"`
+ HideFooter bool `yaml:"hide-footer"`
+ CustomFooter template.HTML `yaml:"custom-footer"`
+ LogoText string `yaml:"logo-text"`
+ LogoURL string `yaml:"logo-url"`
+ FaviconURL string `yaml:"favicon-url"`
+ AppName string `yaml:"app-name"`
+ AppIconURL string `yaml:"app-icon-url"`
+ AppBackgroundColor string `yaml:"app-background-color"`
} `yaml:"branding"`
Pages []page `yaml:"pages"`
}
+type CssProperties struct {
+ BackgroundColor *hslColorField `yaml:"background-color"`
+ PrimaryColor *hslColorField `yaml:"primary-color"`
+ PositiveColor *hslColorField `yaml:"positive-color"`
+ NegativeColor *hslColorField `yaml:"negative-color"`
+ Light bool `yaml:"light"`
+ ContrastMultiplier float32 `yaml:"contrast-multiplier"`
+ TextSaturationMultiplier float32 `yaml:"text-saturation-multiplier"`
+}
+
type page struct {
Title string `yaml:"name"`
Slug string `yaml:"slug"`
Width string `yaml:"width"`
+ DesktopNavigationWidth string `yaml:"desktop-navigation-width"`
ShowMobileHeader bool `yaml:"show-mobile-header"`
ExpandMobilePageNavigation bool `yaml:"expand-mobile-page-navigation"`
HideDesktopNavigation bool `yaml:"hide-desktop-navigation"`
@@ -82,7 +94,7 @@ type page struct {
}
func newConfigFromYAML(contents []byte) (*config, error) {
- contents, err := parseConfigEnvVariables(contents)
+ contents, err := parseConfigVariables(contents)
if err != nil {
return nil, err
}
@@ -112,22 +124,33 @@ func newConfigFromYAML(contents []byte) (*config, error) {
return config, nil
}
-var configEnvVariablePattern = regexp.MustCompile(`(^|.)\$\{([A-Z0-9_]+)\}`)
+var envVariableNamePattern = regexp.MustCompile(`^[A-Z0-9_]+$`)
+var configVariablePattern = regexp.MustCompile(`(^|.)\$\{(?:([a-zA-Z]+):)?([a-zA-Z0-9_-]+)\}`)
-func parseConfigEnvVariables(contents []byte) ([]byte, error) {
+// Parses variables defined in the config such as:
+// ${API_KEY} - gets replaced with the value of the API_KEY environment variable
+// \${API_KEY} - escaped, gets used as is without the \ in the config
+// ${secret:api_key} - value gets loaded from /run/secrets/api_key
+// ${readFileFromEnv:PATH_TO_SECRET} - value gets loaded from the file path specified in the environment variable PATH_TO_SECRET
+//
+// TODO: don't match against commented out sections, not sure exactly how since
+// variables can be placed anywhere and used to modify the YAML structure itself
+func parseConfigVariables(contents []byte) ([]byte, error) {
var err error
- replaced := configEnvVariablePattern.ReplaceAllFunc(contents, func(match []byte) []byte {
+ replaced := configVariablePattern.ReplaceAllFunc(contents, func(match []byte) []byte {
if err != nil {
return nil
}
- groups := configEnvVariablePattern.FindSubmatch(match)
- if len(groups) != 3 {
+ groups := configVariablePattern.FindSubmatch(match)
+ if len(groups) != 4 {
+ // we can't handle this match, this shouldn't happen unless the number of groups
+ // in the regex has been changed without updating the below code
return match
}
- prefix, key := string(groups[1]), string(groups[2])
+ prefix := string(groups[1])
if prefix == `\` {
if len(match) >= 2 {
return match[1:]
@@ -136,13 +159,20 @@ func parseConfigEnvVariables(contents []byte) ([]byte, error) {
}
}
- value, found := os.LookupEnv(key)
- if !found {
- err = fmt.Errorf("environment variable %s not found", key)
+ typeAsString, variableName := string(groups[2]), string(groups[3])
+ variableType := ternary(typeAsString == "", configVarTypeEnv, typeAsString)
+
+ parsedValue, returnOriginal, localErr := parseConfigVariableOfType(variableType, variableName)
+ if localErr != nil {
+ err = fmt.Errorf("parsing variable: %v", localErr)
return nil
}
- return []byte(prefix + value)
+ if returnOriginal {
+ return match
+ }
+
+ return []byte(prefix + parsedValue)
})
if err != nil {
@@ -152,33 +182,90 @@ func parseConfigEnvVariables(contents []byte) ([]byte, error) {
return replaced, nil
}
+// When the bool return value is true, it indicates that the caller should use the original value
+func parseConfigVariableOfType(variableType, variableName string) (string, bool, error) {
+ switch variableType {
+ case configVarTypeEnv:
+ if !envVariableNamePattern.MatchString(variableName) {
+ return "", true, nil
+ }
+
+ v, found := os.LookupEnv(variableName)
+ if !found {
+ return "", false, fmt.Errorf("environment variable %s not found", variableName)
+ }
+
+ return v, false, nil
+ case configVarTypeSecret:
+ secretPath := filepath.Join("/run/secrets", variableName)
+ secret, err := os.ReadFile(secretPath)
+ if err != nil {
+ return "", false, fmt.Errorf("reading secret file: %v", err)
+ }
+
+ return strings.TrimSpace(string(secret)), false, nil
+ case configVarTypeFileFromEnv:
+ if !envVariableNamePattern.MatchString(variableName) {
+ return "", true, nil
+ }
+
+ filePath, found := os.LookupEnv(variableName)
+ if !found {
+ return "", false, fmt.Errorf("readFileFromEnv: environment variable %s not found", variableName)
+ }
+
+ if !filepath.IsAbs(filePath) {
+ return "", false, fmt.Errorf("readFileFromEnv: file path %s is not absolute", filePath)
+ }
+
+ fileContents, err := os.ReadFile(filePath)
+ if err != nil {
+ return "", false, fmt.Errorf("readFileFromEnv: reading file from %s: %v", variableName, err)
+ }
+
+ return strings.TrimSpace(string(fileContents)), false, nil
+ default:
+ return "", true, nil
+ }
+}
+
func formatWidgetInitError(err error, w widget) error {
return fmt.Errorf("%s widget: %v", w.GetType(), err)
}
-var includePattern = regexp.MustCompile(`(?m)^(\s*)!include:\s*(.+)$`)
+var configIncludePattern = regexp.MustCompile(`(?m)^([ \t]*)(?:-[ \t]*)?(?:!|\$)include:[ \t]*(.+)$`)
func parseYAMLIncludes(mainFilePath string) ([]byte, map[string]struct{}, error) {
+ return recursiveParseYAMLIncludes(mainFilePath, nil, 0)
+}
+
+func recursiveParseYAMLIncludes(mainFilePath string, includes map[string]struct{}, depth int) ([]byte, map[string]struct{}, error) {
+ if depth > CONFIG_INCLUDE_RECURSION_DEPTH_LIMIT {
+ return nil, nil, fmt.Errorf("recursion depth limit of %d reached", CONFIG_INCLUDE_RECURSION_DEPTH_LIMIT)
+ }
+
mainFileContents, err := os.ReadFile(mainFilePath)
if err != nil {
- return nil, nil, fmt.Errorf("reading main YAML file: %w", err)
+ return nil, nil, fmt.Errorf("reading %s: %w", mainFilePath, err)
}
mainFileAbsPath, err := filepath.Abs(mainFilePath)
if err != nil {
- return nil, nil, fmt.Errorf("getting absolute path of main YAML file: %w", err)
+ return nil, nil, fmt.Errorf("getting absolute path of %s: %w", mainFilePath, err)
}
mainFileDir := filepath.Dir(mainFileAbsPath)
- includes := make(map[string]struct{})
+ if includes == nil {
+ includes = make(map[string]struct{})
+ }
var includesLastErr error
- mainFileContents = includePattern.ReplaceAllFunc(mainFileContents, func(match []byte) []byte {
+ mainFileContents = configIncludePattern.ReplaceAllFunc(mainFileContents, func(match []byte) []byte {
if includesLastErr != nil {
return nil
}
- matches := includePattern.FindSubmatch(match)
+ matches := configIncludePattern.FindSubmatch(match)
if len(matches) != 3 {
includesLastErr = fmt.Errorf("invalid include match: %v", matches)
return nil
@@ -193,13 +280,14 @@ func parseYAMLIncludes(mainFilePath string) ([]byte, map[string]struct{}, error)
var fileContents []byte
var err error
- fileContents, err = os.ReadFile(includeFilePath)
+ includes[includeFilePath] = struct{}{}
+
+ fileContents, includes, err = recursiveParseYAMLIncludes(includeFilePath, includes, depth+1)
if err != nil {
- includesLastErr = fmt.Errorf("reading included file %s: %w", includeFilePath, err)
+ includesLastErr = err
return nil
}
- includes[includeFilePath] = struct{}{}
return []byte(prefixStringLines(indent, string(fileContents)))
})
@@ -254,7 +342,7 @@ func configFilesWatcher(
// needed for lastContents and lastIncludes because they get updated in multiple goroutines
mu := sync.Mutex{}
- checkForContentChangesBeforeCallback := func() {
+ parseAndCompareBeforeCallback := func() {
currentContents, currentIncludes, err := parseYAMLIncludes(mainFilePath)
if err != nil {
onErr(fmt.Errorf("parsing main file contents for comparison: %w", err))
@@ -280,15 +368,22 @@ func configFilesWatcher(
const debounceDuration = 500 * time.Millisecond
var debounceTimer *time.Timer
- debouncedCallback := func() {
+ debouncedParseAndCompareBeforeCallback := func() {
if debounceTimer != nil {
debounceTimer.Stop()
debounceTimer.Reset(debounceDuration)
} else {
- debounceTimer = time.AfterFunc(debounceDuration, checkForContentChangesBeforeCallback)
+ debounceTimer = time.AfterFunc(debounceDuration, parseAndCompareBeforeCallback)
}
}
+ deleteLastInclude := func(filePath string) {
+ mu.Lock()
+ defer mu.Unlock()
+ fileAbsPath, _ := filepath.Abs(filePath)
+ delete(lastIncludes, fileAbsPath)
+ }
+
go func() {
for {
select {
@@ -297,16 +392,33 @@ func configFilesWatcher(
return
}
if event.Has(fsnotify.Write) {
- debouncedCallback()
- } else if event.Has(fsnotify.Remove) {
- func() {
- mu.Lock()
- defer mu.Unlock()
- fileAbsPath, _ := filepath.Abs(event.Name)
- delete(lastIncludes, fileAbsPath)
- }()
+ debouncedParseAndCompareBeforeCallback()
+ } else if event.Has(fsnotify.Rename) {
+ // on linux the file will no longer be watched after a rename, on windows
+ // it will continue to be watched with the new name but we have no access to
+ // the new name in this event in order to stop watching it manually and match the
+ // behavior in linux, may lead to weird unintended behaviors on windows as we're
+ // only handling renames from linux's perspective
+ // see https://github.com/fsnotify/fsnotify/issues/255
- debouncedCallback()
+ // remove the old file from our manually tracked includes, calling
+ // debouncedParseAndCompareBeforeCallback will re-add it if it's still
+ // required after it triggers
+ deleteLastInclude(event.Name)
+
+ // wait for file to maybe get created again
+ // see https://github.com/glanceapp/glance/pull/358
+ for range 10 {
+ if _, err := os.Stat(event.Name); err == nil {
+ break
+ }
+ time.Sleep(200 * time.Millisecond)
+ }
+
+ debouncedParseAndCompareBeforeCallback()
+ } else if event.Has(fsnotify.Remove) {
+ deleteLastInclude(event.Name)
+ debouncedParseAndCompareBeforeCallback()
}
case err, isOpen := <-watcher.Errors:
if !isOpen {
@@ -340,36 +452,46 @@ func isConfigStateValid(config *config) error {
}
for i := range config.Pages {
- if config.Pages[i].Title == "" {
+ page := &config.Pages[i]
+
+ if page.Title == "" {
return fmt.Errorf("page %d has no name", i+1)
}
- if config.Pages[i].Width != "" && (config.Pages[i].Width != "wide" && config.Pages[i].Width != "slim") {
+ if page.Width != "" && (page.Width != "wide" && page.Width != "slim" && page.Width != "default") {
return fmt.Errorf("page %d: width can only be either wide or slim", i+1)
}
- if len(config.Pages[i].Columns) == 0 {
+ if page.DesktopNavigationWidth != "" {
+ if page.DesktopNavigationWidth != "wide" && page.DesktopNavigationWidth != "slim" && page.DesktopNavigationWidth != "default" {
+ return fmt.Errorf("page %d: desktop-navigation-width can only be either wide or slim", i+1)
+ }
+ }
+
+ if len(page.Columns) == 0 {
return fmt.Errorf("page %d has no columns", i+1)
}
- if config.Pages[i].Width == "slim" {
- if len(config.Pages[i].Columns) > 2 {
+ if page.Width == "slim" {
+ if len(page.Columns) > 2 {
return fmt.Errorf("page %d is slim and cannot have more than 2 columns", i+1)
}
} else {
- if len(config.Pages[i].Columns) > 3 {
+ if len(page.Columns) > 3 {
return fmt.Errorf("page %d has more than 3 columns", i+1)
}
}
columnSizesCount := make(map[string]int)
- for j := range config.Pages[i].Columns {
- if config.Pages[i].Columns[j].Size != "small" && config.Pages[i].Columns[j].Size != "full" {
+ for j := range page.Columns {
+ column := &page.Columns[j]
+
+ if column.Size != "small" && column.Size != "full" {
return fmt.Errorf("column %d of page %d: size can only be either small or full", j+1, i+1)
}
- columnSizesCount[config.Pages[i].Columns[j].Size]++
+ columnSizesCount[page.Columns[j].Size]++
}
full := columnSizesCount["full"]
diff --git a/internal/glance/diagnose.go b/internal/glance/diagnose.go
index 892aa5f..1ee1bc3 100644
--- a/internal/glance/diagnose.go
+++ b/internal/glance/diagnose.go
@@ -81,7 +81,9 @@ var diagnosticSteps = []diagnosticStep{
{
name: "fetch data from Yahoo finance API",
fn: func() (string, error) {
- return testHttpRequest("GET", "https://query1.finance.yahoo.com/v8/finance/chart/NVDA", 200)
+ return testHttpRequestWithHeaders("GET", "https://query1.finance.yahoo.com/v8/finance/chart/NVDA", map[string]string{
+ "User-Agent": "Mozilla/5.0 (Windows NT 10.0; Win64; x64; rv:137.0) Gecko/20100101 Firefox/137.0",
+ }, 200)
},
},
{
@@ -103,7 +105,7 @@ func runDiagnostic() {
fmt.Println("Glance version: " + buildVersion)
fmt.Println("Go version: " + runtime.Version())
fmt.Printf("Platform: %s / %s / %d CPUs\n", runtime.GOOS, runtime.GOARCH, runtime.NumCPU())
- fmt.Println("In Docker container: " + boolToString(isRunningInsideDockerContainer(), "yes", "no"))
+ fmt.Println("In Docker container: " + ternary(isRunningInsideDockerContainer(), "yes", "no"))
fmt.Printf("\nChecking network connectivity, this may take up to %d seconds...\n\n", int(httpTestRequestTimeout.Seconds()))
@@ -129,7 +131,7 @@ func runDiagnostic() {
fmt.Printf(
"%s %s %s| %dms\n",
- boolToString(step.err == nil, "✓ Can", "✗ Can't"),
+ ternary(step.err == nil, "✓ Can", "✗ Can't"),
step.name,
extraInfo,
step.elapsed.Milliseconds(),
diff --git a/internal/glance/embed.go b/internal/glance/embed.go
index 7bb07c9..3d0db8c 100644
--- a/internal/glance/embed.go
+++ b/internal/glance/embed.go
@@ -1,13 +1,19 @@
package glance
import (
+ "bytes"
"crypto/md5"
"embed"
"encoding/hex"
+ "errors"
+ "fmt"
"io"
"io/fs"
"log"
+ "path/filepath"
+ "regexp"
"strconv"
+ "strings"
"time"
)
@@ -20,6 +26,19 @@ var _templateFS embed.FS
var staticFS, _ = fs.Sub(_staticFS, "static")
var templateFS, _ = fs.Sub(_templateFS, "templates")
+func readAllFromStaticFS(path string) ([]byte, error) {
+ // For some reason fs.FS only works with forward slashes, so in case we're
+ // running on Windows or pass paths with backslashes we need to replace them.
+ path = strings.ReplaceAll(path, "\\", "/")
+
+ file, err := staticFS.Open(path)
+ if err != nil {
+ return nil, err
+ }
+
+ return io.ReadAll(file)
+}
+
var staticFSHash = func() string {
hash, err := computeFSHash(staticFS)
if err != nil {
@@ -60,3 +79,74 @@ func computeFSHash(files fs.FS) (string, error) {
return hex.EncodeToString(hash.Sum(nil))[:10], nil
}
+
+var cssImportPattern = regexp.MustCompile(`(?m)^@import "(.*?)";$`)
+var cssSingleLineCommentPattern = regexp.MustCompile(`(?m)^\s*\/\*.*?\*\/$`)
+var whitespaceAtBeginningOfLinePattern = regexp.MustCompile(`(?m)^\s+`)
+
+// Yes, we bundle at runtime, give comptime pls
+var bundledCSSContents = func() []byte {
+ const mainFilePath = "css/main.css"
+
+ var recursiveParseImports func(path string, depth int) ([]byte, error)
+ recursiveParseImports = func(path string, depth int) ([]byte, error) {
+ if depth > 20 {
+ return nil, errors.New("maximum import depth reached, is one of your imports circular?")
+ }
+
+ mainFileContents, err := readAllFromStaticFS(path)
+ if err != nil {
+ return nil, err
+ }
+
+ // Normalize line endings, otherwise the \r's make the regex not match
+ mainFileContents = bytes.ReplaceAll(mainFileContents, []byte("\r\n"), []byte("\n"))
+
+ mainFileDir := filepath.Dir(path)
+ var importLastErr error
+
+ parsed := cssImportPattern.ReplaceAllFunc(mainFileContents, func(match []byte) []byte {
+ if importLastErr != nil {
+ return nil
+ }
+
+ matches := cssImportPattern.FindSubmatch(match)
+ if len(matches) != 2 {
+ importLastErr = fmt.Errorf(
+ "import didn't return expected number of capture groups: %s, expected 2, got %d",
+ match, len(matches),
+ )
+ return nil
+ }
+
+ importFilePath := filepath.Join(mainFileDir, string(matches[1]))
+ importContents, err := recursiveParseImports(importFilePath, depth+1)
+ if err != nil {
+ importLastErr = err
+ return nil
+ }
+
+ return importContents
+ })
+
+ if importLastErr != nil {
+ return nil, importLastErr
+ }
+
+ return parsed, nil
+ }
+
+ contents, err := recursiveParseImports(mainFilePath, 0)
+ if err != nil {
+ panic(fmt.Sprintf("building CSS bundle: %v", err))
+ }
+
+ // We could strip a bunch more unnecessary characters, but the biggest
+ // win comes from removing the whitespace at the beginning of lines
+ // since that's at least 4 bytes per property, which yielded a ~20% reduction.
+ contents = cssSingleLineCommentPattern.ReplaceAll(contents, nil)
+ contents = whitespaceAtBeginningOfLinePattern.ReplaceAll(contents, nil)
+ contents = bytes.ReplaceAll(contents, []byte("\n"), []byte(""))
+
+ return contents
+}()
diff --git a/internal/glance/glance.go b/internal/glance/glance.go
index d5c7400..52fb523 100644
--- a/internal/glance/glance.go
+++ b/internal/glance/glance.go
@@ -19,13 +19,19 @@ var (
pageTemplate = mustParseTemplate("page.html", "document.html")
pageContentTemplate = mustParseTemplate("page-content.html")
pageThemeStyleTemplate = mustParseTemplate("theme-style.gotmpl")
+ manifestTemplate = mustParseTemplate("manifest.json")
)
+const STATIC_ASSETS_CACHE_DURATION = 24 * time.Hour
+
type application struct {
Version string
+ CreatedAt time.Time
Config config
ParsedThemeStyle template.HTML
+ parsedManifest []byte
+
slugToPage map[string]*page
widgetByID map[uint64]widget
}
@@ -33,6 +39,7 @@ type application struct {
func newApplication(config *config) (*application, error) {
app := &application{
Version: buildVersion,
+ CreatedAt: time.Now(),
Config: *config,
slugToPage: make(map[string]*page),
widgetByID: make(map[uint64]widget),
@@ -41,7 +48,7 @@ func newApplication(config *config) (*application, error) {
app.slugToPage[""] = &config.Pages[0]
providers := &widgetProviders{
- assetResolver: app.AssetPath,
+ assetResolver: app.StaticAssetPath,
}
var err error
@@ -60,6 +67,14 @@ func newApplication(config *config) (*application, error) {
app.slugToPage[page.Slug] = page
+ if page.Width == "default" {
+ page.Width = ""
+ }
+
+ if page.DesktopNavigationWidth == "" && page.DesktopNavigationWidth != "default" {
+ page.DesktopNavigationWidth = page.Width
+ }
+
for c := range page.Columns {
column := &page.Columns[c]
@@ -69,7 +84,7 @@ func newApplication(config *config) (*application, error) {
for w := range column.Widgets {
widget := column.Widgets[w]
- app.widgetByID[widget.id()] = widget
+ app.widgetByID[widget.GetID()] = widget
widget.setProviders(providers)
}
@@ -79,15 +94,38 @@ func newApplication(config *config) (*application, error) {
config = &app.Config
config.Server.BaseURL = strings.TrimRight(config.Server.BaseURL, "/")
- config.Theme.CustomCSSFile = app.transformUserDefinedAssetPath(config.Theme.CustomCSSFile)
+ config.Theme.CustomCSSFile = app.resolveUserDefinedAssetPath(config.Theme.CustomCSSFile)
+ config.Branding.LogoURL = app.resolveUserDefinedAssetPath(config.Branding.LogoURL)
- if config.Branding.FaviconURL == "" {
- config.Branding.FaviconURL = app.AssetPath("favicon.png")
+ if config.Theme.BackgroundColor != nil {
+ config.Theme.BackgroundColorAsHex = config.Theme.BackgroundColor.ToHex()
} else {
- config.Branding.FaviconURL = app.transformUserDefinedAssetPath(config.Branding.FaviconURL)
+ config.Theme.BackgroundColorAsHex = "#151519"
}
- config.Branding.LogoURL = app.transformUserDefinedAssetPath(config.Branding.LogoURL)
+ if config.Branding.FaviconURL == "" {
+ config.Branding.FaviconURL = app.StaticAssetPath("favicon.png")
+ } else {
+ config.Branding.FaviconURL = app.resolveUserDefinedAssetPath(config.Branding.FaviconURL)
+ }
+
+ if config.Branding.AppName == "" {
+ config.Branding.AppName = "Glance"
+ }
+
+ if config.Branding.AppIconURL == "" {
+ config.Branding.AppIconURL = app.StaticAssetPath("app-icon.png")
+ }
+
+ if config.Branding.AppBackgroundColor == "" {
+ config.Branding.AppBackgroundColor = config.Theme.BackgroundColorAsHex
+ }
+
+ var manifestWriter bytes.Buffer
+ if err := manifestTemplate.Execute(&manifestWriter, pageTemplateData{App: app}); err != nil {
+ return nil, fmt.Errorf("parsing manifest.json: %v", err)
+ }
+ app.parsedManifest = manifestWriter.Bytes()
return app, nil
}
@@ -117,7 +155,7 @@ func (p *page) updateOutdatedWidgets() {
wg.Wait()
}
-func (a *application) transformUserDefinedAssetPath(path string) string {
+func (a *application) resolveUserDefinedAssetPath(path string) string {
if strings.HasPrefix(path, "/assets/") {
return a.Config.Server.BaseURL + path
}
@@ -223,10 +261,15 @@ func (a *application) handleWidgetRequest(w http.ResponseWriter, r *http.Request
widget.handleRequest(w, r)
}
-func (a *application) AssetPath(asset string) string {
+func (a *application) StaticAssetPath(asset string) string {
return a.Config.Server.BaseURL + "/static/" + staticFSHash + "/" + asset
}
+func (a *application) VersionedAssetPath(asset string) string {
+ return a.Config.Server.BaseURL + asset +
+ "?v=" + strconv.FormatInt(a.CreatedAt.Unix(), 10)
+}
+
func (a *application) server() (func() error, func() error) {
// TODO: add gzip support, static files must have their gzipped contents cached
// TODO: add HTTPS support
@@ -243,9 +286,29 @@ func (a *application) server() (func() error, func() error) {
mux.Handle(
fmt.Sprintf("GET /static/%s/{path...}", staticFSHash),
- http.StripPrefix("/static/"+staticFSHash, fileServerWithCache(http.FS(staticFS), 24*time.Hour)),
+ http.StripPrefix(
+ "/static/"+staticFSHash,
+ fileServerWithCache(http.FS(staticFS), STATIC_ASSETS_CACHE_DURATION),
+ ),
)
+ assetCacheControlValue := fmt.Sprintf(
+ "public, max-age=%d",
+ int(STATIC_ASSETS_CACHE_DURATION.Seconds()),
+ )
+
+ mux.HandleFunc(fmt.Sprintf("GET /static/%s/css/bundle.css", staticFSHash), func(w http.ResponseWriter, r *http.Request) {
+ w.Header().Add("Cache-Control", assetCacheControlValue)
+ w.Header().Add("Content-Type", "text/css; charset=utf-8")
+ w.Write(bundledCSSContents)
+ })
+
+ mux.HandleFunc("GET /manifest.json", func(w http.ResponseWriter, r *http.Request) {
+ w.Header().Add("Cache-Control", assetCacheControlValue)
+ w.Header().Add("Content-Type", "application/json")
+ w.Write(a.parsedManifest)
+ })
+
var absAssetsPath string
if a.Config.Server.AssetsPath != "" {
absAssetsPath, _ = filepath.Abs(a.Config.Server.AssetsPath)
@@ -259,7 +322,6 @@ func (a *application) server() (func() error, func() error) {
}
start := func() error {
- a.Config.Server.StartedAt = time.Now()
log.Printf("Starting server on %s:%d (base-url: \"%s\", assets-path: \"%s\")\n",
a.Config.Server.Host,
a.Config.Server.Port,
diff --git a/internal/glance/main.go b/internal/glance/main.go
index 35211a9..67a980c 100644
--- a/internal/glance/main.go
+++ b/internal/glance/main.go
@@ -18,6 +18,8 @@ func Main() int {
}
switch options.intent {
+ case cliIntentVersionPrint:
+ fmt.Println(buildVersion)
case cliIntentServe:
// remove in v0.10.0
if serveUpdateNoticeIfConfigLocationNotMigrated(options.configPath) {
@@ -47,6 +49,10 @@ func Main() int {
}
fmt.Println(string(contents))
+ case cliIntentSensorsPrint:
+ return cliSensorsPrint()
+ case cliIntentMountpointInfo:
+ return cliMountpointInfo(options.args[1])
case cliIntentDiagnose:
runDiagnostic()
}
@@ -56,8 +62,6 @@ func Main() int {
func serveApp(configPath string) error {
exitChannel := make(chan struct{})
- // the onChange method gets called at most once per 500ms due to debouncing so we shouldn't
- // need to use atomic.Bool here unless newConfigFromYAML is very slow for some reason
hadValidConfigOnStartup := false
var stopServer func() error
@@ -153,9 +157,9 @@ func serveUpdateNoticeIfConfigLocationNotMigrated(configPath string) bool {
templateFile, _ := templateFS.Open("v0.7-update-notice-page.html")
bodyContents, _ := io.ReadAll(templateFile)
- // TODO: update - add link
fmt.Println("!!! WARNING !!!")
- fmt.Println("The default location of glance.yml in the Docker image has changed starting from v0.7.0, please see <link> for more information.")
+ fmt.Println("The default location of glance.yml in the Docker image has changed starting from v0.7.0.")
+ fmt.Println("Please see https://github.com/glanceapp/glance/blob/main/docs/v0.7.0-upgrade.md for more information.")
mux := http.NewServeMux()
mux.Handle("/static/", http.StripPrefix("/static/", http.FileServer(http.FS(staticFS))))
diff --git a/internal/glance/static/css/forum-posts.css b/internal/glance/static/css/forum-posts.css
new file mode 100644
index 0000000..e58ac6e
--- /dev/null
+++ b/internal/glance/static/css/forum-posts.css
@@ -0,0 +1,19 @@
+.forum-post-list-thumbnail {
+ flex-shrink: 0;
+ width: 6rem;
+ height: 4.1rem;
+ border-radius: var(--border-radius);
+ object-fit: cover;
+ border: 1px solid var(--color-separator);
+ margin-top: 0.1rem;
+}
+
+.forum-post-tags-container {
+ transform: translateY(-0.15rem);
+}
+
+@container widget (max-width: 550px) {
+ .forum-post-autohide {
+ display: none;
+ }
+}
diff --git a/internal/glance/static/css/main.css b/internal/glance/static/css/main.css
new file mode 100644
index 0000000..8d0d779
--- /dev/null
+++ b/internal/glance/static/css/main.css
@@ -0,0 +1,66 @@
+@font-face {
+ font-family: 'JetBrains Mono';
+ font-style: normal;
+ font-weight: 400;
+ font-display: swap;
+ src: url('../fonts/JetBrainsMono-Regular.woff2') format('woff2');
+}
+
+:root {
+ font-size: 10px;
+
+ --scheme: ;
+ --bgh: 240;
+ --bgs: 8%;
+ --bgl: 9%;
+ --bghs: var(--bgh), var(--bgs);
+ --cm: 1;
+ --tsm: 1;
+
+ --widget-gap: 23px;
+ --widget-content-vertical-padding: 15px;
+ --widget-content-horizontal-padding: 17px;
+ --widget-content-padding: var(--widget-content-vertical-padding) var(--widget-content-horizontal-padding);
+ --content-bounds-padding: 15px;
+ --border-radius: 5px;
+ --mobile-navigation-height: 50px;
+
+ --color-primary: hsl(43, 50%, 70%);
+ --color-positive: var(--color-primary);
+ --color-negative: hsl(0, 70%, 70%);
+ --color-background: hsl(var(--bghs), var(--bgl));
+ --color-widget-background-hsl-values: var(--bghs), calc(var(--bgl) + 1%);
+ --color-widget-background: hsl(var(--color-widget-background-hsl-values));
+ --color-separator: hsl(var(--bghs), calc(var(--scheme) ((var(--scheme) var(--bgl)) + 4% * var(--cm))));
+ --color-widget-content-border: hsl(var(--bghs), calc(var(--scheme) (var(--scheme) var(--bgl) + 4%)));
+ --color-widget-background-highlight: hsl(var(--bghs), calc(var(--scheme) (var(--scheme) var(--bgl) + 4%)));
+ --color-popover-background: hsl(var(--bgh), calc(var(--bgs) + 3%), calc(var(--bgl) + 3%));
+ --color-popover-border: hsl(var(--bghs), calc(var(--scheme) (var(--scheme) var(--bgl) + 12%)));
+ --color-progress-border: hsl(var(--bghs), calc(var(--scheme) ((var(--scheme) var(--bgl)) + 10% * var(--cm))));
+ --color-progress-value: hsl(var(--bgh), calc(var(--bgs) * var(--tsm)), calc(var(--scheme) ((var(--scheme) var(--bgl)) + 26% * var(--cm))));
+ --color-vertical-progress-value: hsl(var(--bgh), calc(var(--bgs) * var(--tsm)), calc(var(--scheme) ((var(--scheme) var(--bgl)) + 28% * var(--cm))));
+ --color-graph-gridlines: hsl(var(--bghs), calc(var(--scheme) ((var(--scheme) var(--bgl)) + 6% * var(--cm))));
+
+ --ths: var(--bgh), calc(var(--bgs) * var(--tsm));
+ --color-text-highlight: hsl(var(--ths), calc(var(--scheme) var(--cm) * 85%));
+ --color-text-paragraph: hsl(var(--ths), calc(var(--scheme) var(--cm) * 73%));
+ --color-text-base: hsl(var(--ths), calc(var(--scheme) var(--cm) * 58%));
+ --color-text-base-muted: hsl(var(--ths), calc(var(--scheme) var(--cm) * 52%));
+ --color-text-subdue: hsl(var(--ths), calc(var(--scheme) var(--cm) * 35%));
+
+ --font-size-h1: 1.7rem;
+ --font-size-h2: 1.6rem;
+ --font-size-h3: 1.5rem;
+ --font-size-h4: 1.4rem;
+ --font-size-base: 1.3rem;
+ --font-size-h5: 1.2rem;
+ --font-size-h6: 1.1rem;
+}
+
+/* Do not change the order of the below imports unless you know what you're doing */
+
+@import "site.css";
+@import "widgets.css";
+@import "popover.css";
+@import "utils.css";
+@import "mobile.css";
diff --git a/internal/glance/static/css/mobile.css b/internal/glance/static/css/mobile.css
new file mode 100644
index 0000000..73b0d39
--- /dev/null
+++ b/internal/glance/static/css/mobile.css
@@ -0,0 +1,223 @@
+@media (max-width: 1190px) {
+ .header-container {
+ display: none;
+ }
+
+ .page-column-small .size-title-dynamic {
+ font-size: var(--font-size-h3);
+ }
+
+ .page-column-small {
+ width: 100%;
+ flex-shrink: 1;
+ }
+
+ .page-column {
+ display: none;
+ animation: columnEntrance .0s cubic-bezier(0.25, 1, 0.5, 1) backwards;
+ }
+
+ .page-columns-transitioned .page-column {
+ animation-duration: .3s;
+ }
+
+ @keyframes columnEntrance {
+ from {
+ opacity: 0;
+ transform: scaleX(0.95);
+ }
+ }
+
+ .mobile-navigation-offset {
+ height: var(--mobile-navigation-height);
+ flex-shrink: 0;
+ }
+
+ .mobile-navigation {
+ display: block;
+ position: fixed;
+ bottom: 0;
+ transform: translateY(calc(100% - var(--mobile-navigation-height)));
+ left: var(--content-bounds-padding);
+ right: var(--content-bounds-padding);
+ z-index: 11;
+ background-color: var(--color-widget-background);
+ border: 1px solid var(--color-widget-content-border);
+ border-bottom: 0;
+ border-radius: var(--border-radius) var(--border-radius) 0 0;
+ transition: transform .3s;
+ }
+
+ .mobile-navigation:has(.mobile-navigation-page-links-input:checked) .hamburger-icon {
+ --spacing: 7px;
+ color: var(--color-primary);
+ height: 2px;
+ }
+
+ .mobile-navigation:has(.mobile-navigation-page-links-input:checked) {
+ transform: translateY(0);
+ }
+
+ .mobile-navigation-page-links {
+ border-top: 1px solid var(--color-widget-content-border);
+ padding: 20px var(--content-bounds-padding);
+ display: flex;
+ align-items: center;
+ overflow-x: auto;
+ scrollbar-width: thin;
+ gap: 2.5rem;
+ }
+
+ .mobile-navigation-icons {
+ display: flex;
+ justify-content: space-around;
+ align-items: center;
+ }
+
+ body:has(.mobile-navigation-input[value="0"]:checked) .page-columns > :nth-child(1),
+ body:has(.mobile-navigation-input[value="1"]:checked) .page-columns > :nth-child(2),
+ body:has(.mobile-navigation-input[value="2"]:checked) .page-columns > :nth-child(3) {
+ display: block;
+ }
+
+ .mobile-navigation-label {
+ display: flex;
+ flex: 1;
+ max-width: 50px;
+ height: var(--mobile-navigation-height);
+ justify-content: center;
+ align-items: center;
+ cursor: pointer;
+ font-size: 15px;
+ line-height: var(--mobile-navigation-height);
+ }
+
+ .mobile-navigation-pill {
+ display: block;
+ background: var(--color-text-base);
+ height: 10px;
+ width: 10px;
+ border-radius: 10px;
+ transition: width .3s, background-color .3s;
+ }
+
+ .mobile-navigation-label:hover > .mobile-navigation-pill {
+ background-color: var(--color-text-highlight);
+ }
+
+ .mobile-navigation-label:hover {
+ color: var(--color-text-highlight);
+ }
+
+ .mobile-navigation-input:checked + .mobile-navigation-pill {
+ background: var(--color-primary);
+ width: 30px;
+ }
+
+ .mobile-navigation-input, .mobile-navigation-page-links-input {
+ display: none;
+ }
+
+ .hamburger-icon {
+ --spacing: 4px;
+ width: 1em;
+ height: 1px;
+ background-color: currentColor;
+ transition: color .3s, box-shadow .3s;
+ box-shadow: 0 calc(var(--spacing) * -1) 0 0 currentColor, 0 var(--spacing) 0 0 currentColor;
+ }
+
+ .expand-toggle-button.container-expanded {
+ bottom: var(--mobile-navigation-height);
+ }
+
+ .cards-grid + .expand-toggle-button.container-expanded {
+ /* hides content that peeks through the rounded borders of the mobile navigation */
+ box-shadow: 0 var(--border-radius) 0 0 var(--color-background);
+ }
+
+ .weather-column-rain::before {
+ background-size: 7px 7px;
+ }
+
+ .ios .search-input {
+ /* so that iOS Safari does not zoom the page when the input is focused */
+ font-size: 16px;
+ }
+}
+
+@media (max-width: 1190px) and (display-mode: standalone) {
+ :root {
+ --safe-area-inset-bottom: env(safe-area-inset-bottom, 0);
+ }
+
+ .ios .body-content {
+ height: 100dvh;
+ }
+
+ .expand-toggle-button.container-expanded {
+ bottom: calc(var(--mobile-navigation-height) + var(--safe-area-inset-bottom));
+ }
+
+ .mobile-navigation {
+ transform: translateY(calc(100% - var(--mobile-navigation-height) - var(--safe-area-inset-bottom)));
+ padding-bottom: var(--safe-area-inset-bottom);
+ }
+
+ .mobile-navigation-icons {
+ padding-bottom: var(--safe-area-inset-bottom);
+ transition: padding-bottom .3s;
+ }
+
+ .mobile-navigation-offset {
+ height: calc(var(--mobile-navigation-height) + var(--safe-area-inset-bottom));
+ }
+
+ .mobile-navigation-icons:has(.mobile-navigation-page-links-input:checked) {
+ padding-bottom: 0;
+ }
+}
+
+@media (display-mode: standalone) {
+ body {
+ padding-top: env(safe-area-inset-top, 0);
+ }
+}
+
+@media (max-width: 550px) {
+ :root {
+ font-size: 9.4px;
+ --widget-gap: 15px;
+ --widget-content-vertical-padding: 10px;
+ --widget-content-horizontal-padding: 10px;
+ --content-bounds-padding: 10px;
+ }
+
+ .dynamic-columns:has(> :nth-child(1)) { --columns-per-row: 1; }
+
+ .row-reverse-on-mobile {
+ flex-direction: row-reverse;
+ }
+
+ .hide-on-mobile, .thumbnail-container:has(> .hide-on-mobile) {
+ display: none
+ }
+
+ .mobile-reachability-header {
+ display: block;
+ font-size: 3rem;
+ padding: 10vh 1rem;
+ text-align: center;
+ color: var(--color-text-highlight);
+ animation: pageColumnsEntrance .3s cubic-bezier(0.25, 1, 0.5, 1) backwards;
+ }
+
+ .rss-detailed-thumbnail > * {
+ height: 6rem;
+ }
+
+ .rss-detailed-description {
+ line-clamp: 3;
+ -webkit-line-clamp: 3;
+ }
+}
diff --git a/internal/glance/static/css/popover.css b/internal/glance/static/css/popover.css
new file mode 100644
index 0000000..232f29c
--- /dev/null
+++ b/internal/glance/static/css/popover.css
@@ -0,0 +1,65 @@
+.popover-container, [data-popover-html] {
+ display: none;
+}
+
+.popover-container {
+ --triangle-size: 10px;
+ --triangle-offset: 50%;
+ --triangle-margin: calc(var(--triangle-size) + 3px);
+ --entrance-y-offset: 8px;
+ --entrance-direction: calc(var(--entrance-y-offset) * -1);
+
+ z-index: 20;
+ position: absolute;
+ padding-top: var(--triangle-margin);
+ padding-inline: var(--content-bounds-padding);
+}
+
+.popover-container.position-above {
+ --entrance-direction: var(--entrance-y-offset);
+ padding-top: 0;
+ padding-bottom: var(--triangle-margin);
+}
+
+.popover-frame {
+ --shadow-properties: 0 15px 20px -10px;
+ --shadow-color: hsla(var(--bghs), calc(var(--bgl) * 0.2), 0.5);
+ position: relative;
+ padding: 10px;
+ background: var(--color-popover-background);
+ border: 1px solid var(--color-popover-border);
+ border-radius: 5px;
+ animation: popoverFrameEntrance 0.3s backwards cubic-bezier(0.16, 1, 0.3, 1);
+ box-shadow: var(--shadow-properties) var(--shadow-color);
+}
+
+.popover-frame::before {
+ content: '';
+ position: absolute;
+ width: var(--triangle-size);
+ height: var(--triangle-size);
+ transform: rotate(45deg);
+ background-color: var(--color-popover-background);
+ border-top-left-radius: 2px;
+ border-left: 1px solid var(--color-popover-border);
+ border-top: 1px solid var(--color-popover-border);
+ left: calc(var(--triangle-offset) - (var(--triangle-size) / 2));
+ top: calc(var(--triangle-size) / 2 * -1 - 1px);
+}
+
+.popover-container.position-above .popover-frame::before {
+ transform: rotate(-135deg);
+ top: auto;
+ bottom: calc(var(--triangle-size) / 2 * -1 - 1px);
+}
+
+.popover-container.position-above .popover-frame {
+ --shadow-properties: 0 10px 20px -10px;
+}
+
+@keyframes popoverFrameEntrance {
+ from {
+ opacity: 0;
+ transform: translateY(var(--entrance-direction));
+ }
+}
diff --git a/internal/glance/static/css/site.css b/internal/glance/static/css/site.css
new file mode 100644
index 0000000..40c2c63
--- /dev/null
+++ b/internal/glance/static/css/site.css
@@ -0,0 +1,396 @@
+.dark {
+ --scheme: ;
+ --bgh: 240;
+ --bgs: 8%;
+ --bgl: 9%;
+ --bghs: var(--bgh), var(--bgs);
+ --cm: 1;
+ --tsm: 1;
+}
+
+.light {
+ --scheme: 100% -;
+ --bgh: 240;
+ --bgs: 50%;
+ --bgl: 98%;
+ --bghs: var(--bgh), var(--bgs);
+ --cm: 1;
+ --tsm: 1;
+ --color-primary: hsl(43, 50%, 70%);
+}
+
+.light-scheme {
+ --scheme: 100% -;
+}
+
+.page {
+ height: 100%;
+ padding-block: var(--widget-gap);
+}
+
+.page-content, .page.content-ready .page-loading-container {
+ display: none;
+}
+
+.page.content-ready > .page-content {
+ display: block;
+}
+
+.page-column-small .size-title-dynamic {
+ font-size: var(--font-size-h4);
+}
+
+.page-column-full .size-title-dynamic {
+ font-size: var(--font-size-h3);
+}
+
+pre {
+ font: inherit;
+}
+
+::selection {
+ background-color: hsl(var(--bghs), calc(var(--scheme) (var(--scheme) var(--bgl) + 20%)));
+ color: var(--color-text-highlight);
+}
+
+::-webkit-scrollbar-thumb {
+ background: var(--color-text-subdue);
+ border-radius: var(--border-radius);
+}
+
+::-webkit-scrollbar {
+ background: var(--color-background);
+ height: 5px;
+ width: 10px;
+}
+
+*:focus-visible {
+ outline: 2px solid var(--color-primary);
+ outline-offset: 0.1rem;
+ border-radius: var(--border-radius);
+}
+
+*, *::before, *::after {
+ box-sizing: border-box;
+}
+
+* {
+ padding: 0;
+ margin: 0;
+}
+
+hr {
+ border: 0;
+ height: 1px;
+ background-color: var(--color-separator);
+}
+
+img, svg {
+ display: block;
+ max-width: 100%;
+}
+
+img[loading=lazy].loaded:not(.finished-transition) {
+ transition: opacity .4s;
+}
+
+img[loading=lazy].cached:not(.finished-transition) {
+ transition: none;
+}
+
+img[loading=lazy]:not(.loaded, .cached) {
+ opacity: 0;
+}
+
+html {
+ scrollbar-color: var(--color-text-subdue) transparent;
+ scroll-behavior: smooth;
+}
+
+html, body, .body-content {
+ height: 100%;
+}
+
+h1, h2, h3, h4, h5 {
+ font: inherit;
+}
+
+a {
+ text-decoration: none;
+ color: inherit;
+ overflow-wrap: break-word;
+}
+
+ul {
+ list-style: none;
+}
+
+body {
+ font-size: 1.3rem;
+ font-family: 'JetBrains Mono', monospace;
+ font-variant-ligatures: none;
+ line-height: 1.6;
+ color: var(--color-text-base);
+ background-color: var(--color-background);
+ overflow-y: scroll;
+}
+
+.page-column-small {
+ width: 300px;
+ flex-shrink: 0;
+}
+
+.page-column-full {
+ width: 100%;
+ min-width: 0;
+}
+
+.page-columns {
+ display: flex;
+ gap: var(--widget-gap);
+ animation: pageColumnsEntrance .3s cubic-bezier(0.25, 1, 0.5, 1) backwards;
+}
+
+@keyframes pageColumnsEntrance {
+ from {
+ opacity: 0;
+ transform: translateY(10px);
+ }
+}
+
+.page-loading-container {
+ height: 100%;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ animation: loadingContainerEntrance 200ms backwards;
+ animation-delay: 150ms;
+ font-size: 2rem;
+}
+
+.page-loading-container > .loading-icon {
+ translate: 0 -250%;
+}
+
+@keyframes loadingContainerEntrance {
+ from {
+ opacity: 0;
+ }
+}
+
+.loading-icon {
+ min-width: 1.5em;
+ width: 1.5em;
+ height: 1.5em;
+ border: 0.25em solid hsl(var(--bghs), calc(var(--scheme) ((var(--scheme) var(--bgl)) + 12%)));
+ border-top-color: hsl(var(--bghs), calc(var(--scheme) ((var(--scheme) var(--bgl)) + 40%)));
+ border-radius: 50%;
+ animation: loadingIconSpin 800ms infinite linear;
+}
+
+@keyframes loadingIconSpin {
+ to {
+ transform: rotate(360deg);
+ }
+}
+
+.notice-icon {
+ width: 0.7rem;
+ height: 0.7rem;
+ border-radius: 50%;
+}
+
+.notice-icon-major {
+ background: var(--color-negative);
+}
+
+.notice-icon-minor {
+ border: 1px solid var(--color-negative);
+}
+
+kbd {
+ font: inherit;
+ padding: 0.1rem 0.8rem;
+ border-radius: var(--border-radius);
+ border: 2px solid var(--color-widget-background-highlight);
+ box-shadow: 0 2px 0 var(--color-widget-background-highlight);
+ user-select: none;
+ transition: transform .1s, box-shadow .1s;
+ font-size: var(--font-size-h5);
+ cursor: pointer;
+}
+
+kbd:active {
+ transform: translateY(2px);
+ box-shadow: 0 0 0 0 var(--color-widget-background-highlight);
+}
+
+.content-bounds {
+ max-width: 1600px;
+ width: 100%;
+ margin-inline: auto;
+ padding: 0 var(--content-bounds-padding);
+}
+
+.content-bounds-wide {
+ max-width: 1920px;
+}
+
+.content-bounds-slim {
+ max-width: 1100px;
+}
+
+.page-center-vertically .page {
+ display: flex;
+ justify-content: center;
+ flex-direction: column;
+}
+
+.header-container {
+ margin-top: calc(var(--widget-gap) / 2);
+ --header-height: 45px;
+ --header-items-gap: 2.5rem;
+}
+
+.header {
+ display: flex;
+ height: var(--header-height);
+ gap: var(--header-items-gap);
+}
+
+.logo {
+ height: 100%;
+ line-height: var(--header-height);
+ font-size: 2rem;
+ color: var(--color-text-highlight);
+ border-right: 1px solid var(--color-widget-content-border);
+ padding-right: var(--widget-content-horizontal-padding);
+}
+
+.logo:has(img) {
+ display: flex;
+ align-items: center;
+}
+
+.logo img {
+ max-height: 2.7rem;
+}
+
+.nav {
+ height: 100%;
+ gap: var(--header-items-gap);
+}
+
+.nav .nav-item {
+ line-height: var(--header-height);
+}
+
+.footer {
+ padding-bottom: calc(var(--widget-gap) * 1.5);
+ padding-top: calc(var(--widget-gap) / 2);
+ animation: loadingContainerEntrance 200ms backwards;
+ animation-delay: 150ms;
+}
+
+.mobile-navigation, .mobile-reachability-header {
+ display: none;
+}
+
+.nav-item {
+ display: block;
+ height: 100%;
+ border-bottom: 2px solid transparent;
+ transition: color .3s, border-color .3s;
+ font-size: var(--font-size-h3);
+ flex-shrink: 0;
+}
+
+.nav-item:not(.nav-item-current):hover {
+ border-bottom-color: var(--color-text-subdue);
+ color: var(--color-text-highlight);
+}
+
+.nav-item.nav-item-current {
+ border-bottom-color: var(--color-primary);
+ color: var(--color-text-highlight);
+}
+
+/*
+### Theme Dropdown ###
+*/
+.theme-dropdown {
+ position: relative;
+ display: inline-block;
+ right: 0;
+}
+
+.dropdown-button {
+ padding: 10px 15px;
+ background: var(--color-widget-background);
+ border: 1px solid var(--color-widget-content-border);
+ border-radius: 4px;
+ cursor: pointer;
+ display: flex;
+ align-items: center;
+ gap: 8px;
+ min-width: 150px;
+ transition: border-color .2s;
+ color: var(--color-text-highlight);
+}
+
+.dropdown-button:hover {
+ border-color: var(--color-text-subdue);
+}
+
+.dropdown-content {
+ display: none;
+ position: absolute;
+ top: 100%;
+ left: 0;
+ background: var(--color-widget-content-border);
+ min-width: 150px;
+ box-shadow: 0 2px 5px rgba(0,0,0,0.2);
+ border-radius: 4px;
+ z-index: 1000;
+}
+
+.mobile-navigation-page-links .dropdown-content {
+ top: unset;
+ bottom: 38px;
+}
+
+.dropdown-content.show {
+ display: block;
+}
+
+.theme-option {
+ padding: 10px 15px;
+ cursor: pointer;
+ transition: background-color 0.2s;
+}
+
+.theme-option:hover {
+ background-color: #f8f9fa;
+}
+
+.separator {
+ height: 1px;
+ background-color: #dee2e6;
+ margin: 5px 0;
+}
+
+.arrow {
+ border: solid #666;
+ border-width: 0 2px 2px 0;
+ display: inline-block;
+ padding: 3px;
+ transform: rotate(45deg);
+ transition: transform 0.2s ease;
+ margin-left: auto;
+ position: relative;
+ top: -1px;
+}
+
+.dropdown-button.active .arrow {
+ transform: rotate(-135deg);
+}
diff --git a/internal/glance/static/css/utils.css b/internal/glance/static/css/utils.css
new file mode 100644
index 0000000..fbc3bad
--- /dev/null
+++ b/internal/glance/static/css/utils.css
@@ -0,0 +1,562 @@
+.masonry {
+ display: flex;
+ gap: var(--widget-gap);
+}
+
+.masonry-column {
+ flex: 1;
+ display: flex;
+ flex-direction: column;
+}
+
+.widget-small-content-bounds {
+ max-width: 350px;
+ margin: 0 auto;
+}
+
+.visually-hidden {
+ clip-path: inset(50%);
+ height: 1px;
+ overflow: hidden;
+ position: absolute;
+ white-space: nowrap;
+ width: 1px;
+}
+
+.list-horizontal-text {
+ display: flex;
+ list-style: none;
+ flex-wrap: wrap;
+ align-items: center;
+}
+
+.list-horizontal-text > *:not(:last-child)::after {
+ content: '•' / "";
+ color: var(--color-text-subdue);
+ margin: 0 0.4rem;
+ position: relative;
+ top: 0.1rem;
+}
+
+.summary {
+ width: 100%;
+ cursor: pointer;
+ word-spacing: -0.18em;
+ user-select: none;
+ list-style: none;
+ position: relative;
+ display: flex;
+ z-index: 1;
+}
+
+.summary::-webkit-details-marker {
+ display: none;
+}
+
+.details[open] .summary {
+ margin-bottom: .8rem;
+}
+
+.summary::before {
+ content: "";
+ position: absolute;
+ inset: -.3rem -.8rem;
+ border-radius: var(--border-radius);
+ background-color: var(--color-widget-background-highlight);
+ opacity: 0;
+ transition: opacity 0.2s;
+ z-index: -1;
+}
+
+.details[open] .summary::before, .summary:hover::before {
+ opacity: 1;
+}
+
+.details:not([open]) .list-with-transition {
+ display: none;
+}
+
+.summary::after {
+ content: "◀" / "";
+ font-size: 1.2em;
+ position: absolute;
+ top: 0;
+ bottom: 0;
+ line-height: 1.3em;
+ right: 0;
+ transition: rotate .5s cubic-bezier(0.22, 1, 0.36, 1);
+}
+
+details[open] .summary::after {
+ rotate: -90deg;
+}
+
+/* TODO: refactor, otherwise I hope I never have to change dynamic columns again */
+.dynamic-columns {
+ --list-half-gap: 0.5rem;
+ gap: var(--widget-content-vertical-padding) var(--widget-content-horizontal-padding);
+ display: grid;
+ grid-template-columns: repeat(var(--columns-per-row), 1fr);
+}
+
+.dynamic-columns > * {
+ padding-left: var(--widget-content-horizontal-padding);
+ border-left: 1px solid var(--color-separator);
+ min-width: 0;
+}
+
+.dynamic-columns > *:first-child {
+ padding-top: 0;
+ border-top: none;
+ border-left: none;
+}
+
+.dynamic-columns:has(> :nth-child(1)) { --columns-per-row: 1; }
+.dynamic-columns:has(> :nth-child(2)) { --columns-per-row: 2; }
+.dynamic-columns:has(> :nth-child(3)) { --columns-per-row: 3; }
+.dynamic-columns:has(> :nth-child(4)) { --columns-per-row: 4; }
+.dynamic-columns:has(> :nth-child(5)) { --columns-per-row: 5; }
+
+@container widget (max-width: 599px) {
+ .dynamic-columns { gap: 0; }
+ .dynamic-columns:has(> :nth-child(1)) { --columns-per-row: 1; }
+ .dynamic-columns > * {
+ border-left: none;
+ padding-left: 0;
+ }
+ .dynamic-columns > *:not(:first-child) {
+ margin-top: calc(var(--list-half-gap) * 2);
+ }
+ .dynamic-columns.list-with-separator > *:not(:first-child) {
+ margin-top: var(--list-half-gap);
+ border-top: 1px solid var(--color-separator);
+ padding-top: var(--list-half-gap);
+ }
+}
+@container widget (min-width: 600px) and (max-width: 849px) {
+ .dynamic-columns:has(> :nth-child(2)) { --columns-per-row: 2; }
+ .dynamic-columns > :nth-child(2n-1) {
+ border-left: none;
+ padding-left: 0;
+ }
+}
+@container widget (min-width: 850px) and (max-width: 1249px) {
+ .dynamic-columns:has(> :nth-child(3)) { --columns-per-row: 3; }
+ .dynamic-columns > :nth-child(3n+1) {
+ border-left: none;
+ padding-left: 0;
+ }
+}
+@container widget (min-width: 1250px) and (max-width: 1499px) {
+ .dynamic-columns:has(> :nth-child(4)) { --columns-per-row: 4; }
+ .dynamic-columns > :nth-child(4n+1) {
+ border-left: none;
+ padding-left: 0;
+ }
+}
+@container widget (min-width: 1500px) {
+ .dynamic-columns:has(> :nth-child(5)) { --columns-per-row: 5; }
+ .dynamic-columns > :nth-child(5n+1) {
+ border-left: none;
+ padding-left: 0;
+ }
+}
+
+.cards-vertical {
+ flex-direction: column;
+}
+
+.cards-horizontal {
+ --cards-per-row: 6.5;
+}
+
+.cards-horizontal, .cards-vertical {
+ --cards-gap: calc(var(--widget-content-vertical-padding) * 0.7);
+ display: flex;
+ gap: var(--cards-gap);
+}
+
+.card {
+ display: flex;
+ flex-direction: column;
+}
+
+.cards-horizontal .card {
+ flex-shrink: 0;
+ width: calc(100% / var(--cards-per-row) - var(--cards-gap) * (var(--cards-per-row) - 1) / var(--cards-per-row));
+}
+
+.cards-grid .card {
+ min-width: 0;
+}
+
+.cards-horizontal {
+ overflow-x: auto;
+ scrollbar-width: thin;
+ padding-bottom: 1rem;
+}
+
+.cards-grid {
+ --cards-per-row: 6;
+ display: grid;
+ grid-template-columns: repeat(var(--cards-per-row), 1fr);
+ gap: calc(var(--widget-content-vertical-padding) * 0.7);
+}
+
+@container widget (max-width: 1300px) { .cards-horizontal { --cards-per-row: 5.5; } }
+@container widget (max-width: 1100px) { .cards-horizontal { --cards-per-row: 4.5; } }
+@container widget (max-width: 850px) { .cards-horizontal { --cards-per-row: 3.5; } }
+@container widget (max-width: 750px) { .cards-horizontal { --cards-per-row: 3.5; } }
+@container widget (max-width: 650px) { .cards-horizontal { --cards-per-row: 2.5; } }
+@container widget (max-width: 450px) { .cards-horizontal { --cards-per-row: 2.3; } }
+
+@container widget (max-width: 1300px) { .cards-grid { --cards-per-row: 5; } }
+@container widget (max-width: 1100px) { .cards-grid { --cards-per-row: 4; } }
+@container widget (max-width: 850px) { .cards-grid { --cards-per-row: 3; } }
+@container widget (max-width: 750px) { .cards-grid { --cards-per-row: 3; } }
+@container widget (max-width: 650px) { .cards-grid { --cards-per-row: 2; } }
+
+.text-truncate,
+.single-line-titles .title
+{
+ overflow: hidden;
+ text-overflow: ellipsis;
+ white-space: nowrap;
+}
+
+.single-line-titles .title {
+ display: block;
+}
+
+.text-truncate-2-lines, .text-truncate-3-lines {
+ overflow: hidden;
+ text-overflow: ellipsis;
+ display: -webkit-box;
+ -webkit-box-orient: vertical;
+}
+
+.text-truncate-3-lines { line-clamp: 3; -webkit-line-clamp: 3; }
+.text-truncate-2-lines { line-clamp: 2; -webkit-line-clamp: 2; }
+
+.visited-indicator:not(.text-truncate)::after,
+.visited-indicator.text-truncate::before {
+ content: '↗' / "";
+ margin-left: 0.5em;
+ display: inline-block;
+ position: relative;
+ top: 0.15em;
+ color: var(--color-text-base);
+}
+
+.visited-indicator.text-truncate {
+ direction: rtl;
+ text-align: left;
+}
+
+.visited-indicator:not(:visited)::before, .visited-indicator:not(:visited)::after {
+ color: var(--color-primary);
+}
+
+.page-columns-transitioned .list-with-transition > * { animation: collapsibleItemReveal .25s backwards; }
+.list-with-transition > *:nth-child(2) { animation-delay: 30ms; }
+.list-with-transition > *:nth-child(3) { animation-delay: 60ms; }
+.list-with-transition > *:nth-child(4) { animation-delay: 90ms; }
+.list-with-transition > *:nth-child(5) { animation-delay: 120ms; }
+.list-with-transition > *:nth-child(6) { animation-delay: 150ms; }
+.list-with-transition > *:nth-child(7) { animation-delay: 180ms; }
+.list-with-transition > *:nth-child(8) { animation-delay: 210ms; }
+
+.list > *:not(:first-child) {
+ margin-top: calc(var(--list-half-gap) * 2);
+}
+
+.list.list-with-separator > *:not(:first-child) {
+ margin-top: var(--list-half-gap);
+ border-top: 1px solid var(--color-separator);
+ padding-top: var(--list-half-gap);
+}
+
+.collapsible-container:not(.container-expanded) > .collapsible-item {
+ display: none;
+}
+
+.collapsible-item {
+ animation: collapsibleItemReveal .25s backwards;
+}
+
+@keyframes collapsibleItemReveal {
+ from {
+ opacity: 0;
+ transform: translateY(10px);
+ }
+}
+
+.expand-toggle-button {
+ font: inherit;
+ border: 0;
+ cursor: pointer;
+ display: block;
+ width: 100%;
+ text-align: left;
+ color: var(--color-text-base);
+ text-transform: uppercase;
+ font-size: var(--font-size-h4);
+ padding: var(--widget-content-vertical-padding) 0;
+ background: var(--color-widget-background);
+}
+
+.expand-toggle-button.container-expanded {
+ position: sticky;
+ /* -1px to hide 1px gap on chrome */
+ bottom: -1px;
+}
+
+.expand-toggle-button-icon {
+ display: inline-block;
+ margin-left: 1rem;
+ position: relative;
+ top: -.2rem;
+}
+
+.expand-toggle-button-icon::before {
+ content: '' / "";
+ font-size: 0.8rem;
+ transform: rotate(90deg);
+ line-height: 1;
+ display: inline-block;
+ transition: transform 0.3s;
+}
+
+.expand-toggle-button.container-expanded .expand-toggle-button-icon::before {
+ transform: rotate(-90deg);
+}
+
+.cards-grid.collapsible-container + .expand-toggle-button {
+ text-align: center;
+ margin-top: 0.5rem;
+ background-color: var(--color-background);
+}
+
+.widget-content:has(.expand-toggle-button:last-child) {
+ padding-bottom: 0;
+}
+
+.carousel-container {
+ position: relative;
+}
+
+.carousel-container::before, .carousel-container::after {
+ content: '';
+ position: absolute;
+ width: 2rem;
+ top: 0;
+ bottom: 1rem;
+ z-index: 10;
+ opacity: 0;
+ pointer-events: none;
+ transition-duration: 0.2s;
+}
+
+.carousel-container::before {
+ background: linear-gradient(to right, var(--color-background), transparent);
+}
+
+.carousel-container::after {
+ right: 0;
+ background: linear-gradient(to left, var(--color-background), transparent);
+}
+
+.carousel-container.show-left-cutoff::before, .carousel-container.show-right-cutoff::after {
+ opacity: 1;
+}
+
+.attachments {
+ display: flex;
+ flex-wrap: wrap;
+ gap: 0.5rem;
+}
+
+:root:not(.light-scheme) .flat-icon {
+ filter: invert(1);
+}
+
+.attachments > * {
+ border-radius: var(--border-radius);
+ padding: 0.1rem 0.5rem;
+ font-size: var(--font-size-h6);
+ background-color: var(--color-separator);
+}
+
+.progress-bar {
+ border: 1px solid var(--color-progress-border);
+ border-radius: var(--border-radius);
+ display: flex;
+ flex-direction: column;
+ gap: 2px;
+ padding: 2px;
+ height: 1.5rem;
+ /* naughty, but oh so beautiful */
+ margin-inline: -3px;
+}
+
+.progress-bar-combined {
+ height: 3rem;
+}
+
+.popover-active > .progress-bar {
+ transition: border-color .3s;
+ border-color: var(--color-text-subdue);
+}
+
+.progress-value {
+ --half-border-radius: calc(var(--border-radius) / 2);
+ border-radius: 0 var(--half-border-radius) var(--half-border-radius) 0;
+ background: var(--color-progress-value);
+ width: calc(var(--percent) * 1%);
+ min-width: 1px;
+ flex: 1;
+}
+
+.progress-value:first-child {
+ border-top-left-radius: var(--half-border-radius);
+}
+
+.progress-value:last-child {
+ border-bottom-left-radius: var(--half-border-radius);
+}
+
+.progress-value-notice {
+ background: linear-gradient(to right, var(--color-progress-value) 65%, var(--color-negative));
+}
+
+.value-separator {
+ min-width: 2rem;
+ margin-inline: 0.8rem;
+ flex: 1;
+ height: calc(1em * 1.1);
+ border-bottom: 1px dotted var(--color-text-subdue);
+}
+
+.thumbnail {
+ filter: grayscale(0.2) contrast(0.9);
+ opacity: 0.8;
+ transition: filter 0.2s, opacity .2s;
+}
+
+.thumbnail-container {
+ flex-shrink: 0;
+ border: 1px solid var(--color-separator);
+ border-radius: var(--border-radius);
+}
+
+.thumbnail-container > * {
+ border-radius: var(--border-radius);
+ object-fit: cover;
+}
+
+.thumbnail-parent:hover .thumbnail {
+ opacity: 1;
+ filter: none;
+}
+
+.size-h1 { font-size: var(--font-size-h1); }
+.size-h2 { font-size: var(--font-size-h2); }
+.size-h3 { font-size: var(--font-size-h3); }
+.size-h4 { font-size: var(--font-size-h4); }
+.size-base { font-size: var(--font-size-base); }
+.size-h5 { font-size: var(--font-size-h5); }
+.size-h6 { font-size: var(--font-size-h6); }
+
+.color-highlight { color: var(--color-text-highlight); }
+.color-paragraph { color: var(--color-text-paragraph); }
+.color-base { color: var(--color-text-base); }
+.color-subdue { color: var(--color-text-subdue); }
+.color-negative { color: var(--color-negative); }
+.color-positive { color: var(--color-positive); }
+.color-primary { color: var(--color-primary); }
+
+.color-primary-if-not-visited:not(:visited) {
+ color: var(--color-primary);
+}
+
+.cursor-help { cursor: help; }
+.rounded { border-radius: var(--border-radius); }
+.break-all { word-break: break-all; }
+.text-left { text-align: left; }
+.text-right { text-align: right; }
+.text-center { text-align: center; }
+.text-elevate { margin-top: -0.2em; }
+.text-compact { word-spacing: -0.18em; }
+.text-very-compact { word-spacing: -0.35em; }
+.rtl { direction: rtl; }
+.shrink { flex-shrink: 1; }
+.shrink-0 { flex-shrink: 0; }
+.min-width-0 { min-width: 0; }
+.max-width-100 { max-width: 100%; }
+.block { display: block; }
+.inline-block { display: inline-block; }
+.overflow-hidden { overflow: hidden; }
+.relative { position: relative; }
+.flex { display: flex; }
+.flex-1 { flex: 1; }
+.flex-wrap { flex-wrap: wrap; }
+.flex-nowrap { flex-wrap: nowrap; }
+.justify-between { justify-content: space-between; }
+.justify-stretch { justify-content: stretch; }
+.justify-evenly { justify-content: space-evenly; }
+.justify-center { justify-content: center; }
+.justify-end { justify-content: end; }
+.uppercase { text-transform: uppercase; }
+.grow { flex-grow: 1; }
+.flex-column { flex-direction: column; }
+.items-center { align-items: center; }
+.items-start { align-items: start; }
+.items-end { align-items: end; }
+.gap-5 { gap: 0.5rem; }
+.gap-7 { gap: 0.7rem; }
+.gap-10 { gap: 1rem; }
+.gap-12 { gap: 1.2rem; }
+.gap-15 { gap: 1.5rem; }
+.gap-20 { gap: 2rem; }
+.gap-25 { gap: 2.5rem; }
+.gap-35 { gap: 3.5rem; }
+.gap-45 { gap: 4.5rem; }
+.gap-55 { gap: 5.5rem; }
+.margin-left-auto { margin-left: auto; }
+.margin-top-3 { margin-top: 0.3rem; }
+.margin-top-5 { margin-top: 0.5rem; }
+.margin-top-7 { margin-top: 0.7rem; }
+.margin-top-10 { margin-top: 1rem; }
+.margin-top-15 { margin-top: 1.5rem; }
+.margin-top-20 { margin-top: 2rem; }
+.margin-top-25 { margin-top: 2.5rem; }
+.margin-top-35 { margin-top: 3.5rem; }
+.margin-top-40 { margin-top: 4rem; }
+.margin-top-auto { margin-top: auto; }
+.margin-block-3 { margin-block: 0.3rem; }
+.margin-block-5 { margin-block: 0.5rem; }
+.margin-block-7 { margin-block: 0.7rem; }
+.margin-block-8 { margin-block: 0.8rem; }
+.margin-block-10 { margin-block: 1rem; }
+.margin-block-15 { margin-block: 1.5rem; }
+.margin-bottom-3 { margin-bottom: 0.3rem; }
+.margin-bottom-5 { margin-bottom: 0.5rem; }
+.margin-bottom-7 { margin-bottom: 0.7rem; }
+.margin-bottom-10 { margin-bottom: 1rem; }
+.margin-bottom-15 { margin-bottom: 1.5rem; }
+.margin-bottom-auto { margin-bottom: auto; }
+.margin-bottom-widget { margin-bottom: var(--widget-content-vertical-padding); }
+.padding-widget { padding: var(--widget-content-padding); }
+.padding-block-widget { padding-block: var(--widget-content-vertical-padding); }
+.padding-inline-widget { padding-inline: var(--widget-content-horizontal-padding); }
+.padding-block-5 { padding-block: 0.5rem; }
+.scale-half { transform: scale(0.5); }
+.list { --list-half-gap: 0rem; }
+.list-gap-2 { --list-half-gap: 0.1rem; }
+.list-gap-4 { --list-half-gap: 0.2rem; }
+.list-gap-8 { --list-half-gap: 0.4rem; }
+.list-gap-10 { --list-half-gap: 0.5rem; }
+.list-gap-14 { --list-half-gap: 0.7rem; }
+.list-gap-20 { --list-half-gap: 1rem; }
+.list-gap-24 { --list-half-gap: 1.2rem; }
+.list-gap-34 { --list-half-gap: 1.7rem; }
diff --git a/internal/glance/static/css/widget-bookmarks.css b/internal/glance/static/css/widget-bookmarks.css
new file mode 100644
index 0000000..7f2dabd
--- /dev/null
+++ b/internal/glance/static/css/widget-bookmarks.css
@@ -0,0 +1,31 @@
+.bookmarks-group {
+ --bookmarks-group-color: var(--color-primary);
+}
+
+.bookmarks-group-title {
+ color: var(--bookmarks-group-color);
+}
+
+.bookmarks-link:not(.bookmarks-link-no-arrow)::after {
+ content: '↗' / "";
+ margin-left: 0.5em;
+ display: inline-block;
+ position: relative;
+ top: 0.15em;
+ color: var(--bookmarks-group-color);
+}
+
+.bookmarks-icon-container {
+ margin-block: 0.1rem;
+ background-color: var(--color-widget-background-highlight);
+ border-radius: var(--border-radius);
+ padding: 0.5rem;
+ opacity: 0.7;
+ flex-shrink: 0;
+}
+
+.bookmarks-icon {
+ width: 20px;
+ height: 20px;
+ opacity: 0.8;
+}
diff --git a/internal/glance/static/css/widget-calendar.css b/internal/glance/static/css/widget-calendar.css
new file mode 100644
index 0000000..f9b0d9d
--- /dev/null
+++ b/internal/glance/static/css/widget-calendar.css
@@ -0,0 +1,71 @@
+.old-calendar-day {
+ width: calc(100% / 7);
+ text-align: center;
+ padding: 0.6rem 0;
+}
+
+.old-calendar-day-today {
+ border-radius: var(--border-radius);
+ background-color: hsl(var(--bghs), calc(var(--scheme) (var(--scheme) (var(--bgl)) + 6%)));
+ color: var(--color-text-highlight);
+}
+
+.calendar-dates {
+ text-align: center;
+ display: grid;
+ grid-template-columns: repeat(7, 1fr);
+ gap: 2px;
+}
+
+.calendar-date {
+ padding: 0.4rem 0;
+ color: var(--color-text-base);
+ position: relative;
+ border-radius: var(--border-radius);
+ background: none;
+ border: none;
+ font: inherit;
+}
+
+.calendar-current-date {
+ border-radius: var(--border-radius);
+ background-color: var(--color-popover-border);
+ color: var(--color-text-highlight);
+}
+
+.calendar-spillover-date {
+ color: var(--color-text-subdue);
+}
+
+.calendar-header-button {
+ position: relative;
+ cursor: pointer;
+ width: 2rem;
+ height: 2rem;
+ z-index: 1;
+ background: none;
+ border: none;
+}
+
+.calendar-header-button::before {
+ content: '';
+ position: absolute;
+ inset: -0.2rem;
+ border-radius: var(--border-radius);
+ background-color: var(--color-text-subdue);
+ opacity: 0;
+ transition: opacity 0.2s;
+ z-index: -1;
+}
+
+.calendar-header-button:hover::before {
+ opacity: 0.4;
+}
+
+.calendar-undo-button {
+ display: inline-block;
+ vertical-align: text-top;
+ width: 2rem;
+ height: 2rem;
+ margin-left: 0.7rem;
+}
diff --git a/internal/glance/static/css/widget-clock.css b/internal/glance/static/css/widget-clock.css
new file mode 100644
index 0000000..47a1a2f
--- /dev/null
+++ b/internal/glance/static/css/widget-clock.css
@@ -0,0 +1,7 @@
+.clock-time {
+ min-width: 8ch;
+}
+
+.clock-time span {
+ color: var(--color-text-highlight);
+}
diff --git a/internal/glance/static/css/widget-dns-stats.css b/internal/glance/static/css/widget-dns-stats.css
new file mode 100644
index 0000000..15a1d42
--- /dev/null
+++ b/internal/glance/static/css/widget-dns-stats.css
@@ -0,0 +1,120 @@
+.dns-stats-totals {
+ transition: opacity .3s;
+ transition-delay: 50ms;
+}
+
+.dns-stats:has(.dns-stats-graph .popover-active) .dns-stats-totals {
+ opacity: 0.1;
+ transition-delay: 0s;
+}
+
+.dns-stats-graph {
+ --graph-height: 70px;
+ height: var(--graph-height);
+ position: relative;
+ margin-bottom: 2.5rem;
+}
+
+.dns-stats-graph-gridlines-container {
+ position: absolute;
+ inset: 0;
+}
+
+.dns-stats-graph-gridlines {
+ height: 100%;
+ width: 100%;
+}
+
+.dns-stats-graph-columns {
+ display: flex;
+ height: 100%;
+}
+
+.dns-stats-graph-column {
+ display: flex;
+ justify-content: flex-end;
+ align-items: center;
+ flex-direction: column;
+ width: calc(100% / 8);
+ position: relative;
+}
+
+.dns-stats-graph-column::before {
+ content: '';
+ position: absolute;
+ inset: 1px 0;
+ opacity: 0;
+ background: var(--color-text-base);
+ transition: opacity .2s;
+}
+
+.dns-stats-graph-column:hover::before {
+ opacity: 0.05;
+}
+
+.dns-stats-graph-bar {
+ width: 14px;
+ height: calc((var(--bar-height) / 100) * var(--graph-height));
+ border: 1px solid var(--color-progress-border);
+ border-radius: var(--border-radius) var(--border-radius) 0 0;
+ display: flex;
+ background: var(--color-widget-background);
+ padding: 2px 2px 0 2px;
+ flex-direction: column;
+ gap: 2px;
+ transition: border-color .2s;
+ min-height: 10px;
+}
+
+.dns-stats-graph-column.popover-active .dns-stats-graph-bar {
+ border-color: var(--color-text-subdue);
+ border-bottom-color: var(--color-progress-border);
+}
+
+.dns-stats-graph-bar > * {
+ border-radius: 2px;
+ background: var(--color-vertical-progress-value);
+ min-height: 1px;
+}
+
+.dns-stats-graph-bar > .queries {
+ flex-grow: 1;
+}
+
+.dns-stats-graph-bar > *:last-child {
+ border-bottom-right-radius: 0;
+ border-bottom-left-radius: 0;
+}
+
+.dns-stats-graph-bar > .blocked {
+ background-color: var(--color-negative);
+ flex-basis: calc(var(--percent) - 1px);
+}
+
+.dns-stats-graph-column:nth-child(even) .dns-stats-graph-time {
+ opacity: 1;
+ transform: translateY(0);
+}
+
+.dns-stats-graph-time, .dns-stats-graph-columns:hover .dns-stats-graph-time {
+ position: absolute;
+ font-size: var(--font-size-h6);
+ inset-inline: 0;
+ text-align: center;
+ height: 2.5rem;
+ line-height: 2.5rem;
+ top: 100%;
+ user-select: none;
+ opacity: 0;
+ transform: translateY(-0.5rem);
+ transition: opacity .2s, transform .2s;
+}
+
+.dns-stats-graph-column:hover .dns-stats-graph-time {
+ opacity: 1;
+ transform: translateY(0);
+}
+
+.dns-stats-graph-columns:hover .dns-stats-graph-column:not(:hover) .dns-stats-graph-time {
+ opacity: 0;
+}
diff --git a/internal/glance/static/css/widget-docker-containers.css b/internal/glance/static/css/widget-docker-containers.css
new file mode 100644
index 0000000..ae08788
--- /dev/null
+++ b/internal/glance/static/css/widget-docker-containers.css
@@ -0,0 +1,26 @@
+.docker-container-icon {
+ display: block;
+ filter: grayscale(0.4);
+ object-fit: contain;
+ aspect-ratio: 1 / 1;
+ width: 2.7rem;
+ opacity: 0.8;
+ transition: filter 0.3s, opacity 0.3s;
+}
+
+.docker-container-icon.flat-icon {
+ opacity: 0.7;
+}
+
+.docker-container:hover .docker-container-icon {
+ opacity: 1;
+}
+
+.docker-container:hover .docker-container-icon:not(.flat-icon) {
+ filter: grayscale(0);
+}
+
+.docker-container-status-icon {
+ width: 2rem;
+ height: 2rem;
+}
diff --git a/internal/glance/static/css/widget-group.css b/internal/glance/static/css/widget-group.css
new file mode 100644
index 0000000..378853b
--- /dev/null
+++ b/internal/glance/static/css/widget-group.css
@@ -0,0 +1,49 @@
+.widget-group-header {
+ overflow-x: auto;
+ scrollbar-width: thin;
+}
+
+.widget-group-title {
+ background: none;
+ font: inherit;
+ border: none;
+ text-transform: uppercase;
+ border-bottom: 1px dotted transparent;
+ cursor: pointer;
+ flex-shrink: 0;
+ transition: color .3s, border-color .3s;
+ color: var(--color-text-subdue);
+ line-height: calc(1.6em - 1px);
+}
+
+.widget-group-title:hover:not(.widget-group-title-current) {
+ color: var(--color-text-base);
+}
+
+.widget-group-title-current {
+ border-bottom-color: var(--color-text-base-muted);
+ color: var(--color-text-base);
+}
+
+.widget-group-content {
+ animation: widgetGroupContentEntrance .3s cubic-bezier(0.25, 1, 0.5, 1) backwards;
+}
+
+.widget-group-content[data-direction="right"] {
+ --direction: 5px;
+}
+
+.widget-group-content[data-direction="left"] {
+ --direction: -5px;
+}
+
+@keyframes widgetGroupContentEntrance {
+ from {
+ opacity: 0;
+ transform: translateX(var(--direction));
+ }
+}
+
+.widget-group-content:not(.widget-group-content-current) {
+ display: none;
+}
diff --git a/internal/glance/static/css/widget-markets.css b/internal/glance/static/css/widget-markets.css
new file mode 100644
index 0000000..f670a25
--- /dev/null
+++ b/internal/glance/static/css/widget-markets.css
@@ -0,0 +1,13 @@
+.market-chart {
+ margin-left: auto;
+ width: 6.5rem;
+ flex-shrink: 0;
+}
+
+.market-chart svg {
+ width: 100%;
+}
+
+.market-values {
+ min-width: 8rem;
+}
diff --git a/internal/glance/static/css/widget-monitor.css b/internal/glance/static/css/widget-monitor.css
new file mode 100644
index 0000000..8bc629b
--- /dev/null
+++ b/internal/glance/static/css/widget-monitor.css
@@ -0,0 +1,36 @@
+.monitor-site-icon {
+ display: block;
+ opacity: 0.8;
+ filter: grayscale(0.4);
+ object-fit: contain;
+ aspect-ratio: 1 / 1;
+ width: 3.2rem;
+ position: relative;
+ top: -0.1rem;
+ transition: filter 0.3s, opacity 0.3s;
+}
+
+.monitor-site-icon.flat-icon {
+ opacity: 0.7;
+}
+
+.monitor-site:hover .monitor-site-icon {
+ opacity: 1;
+}
+
+.monitor-site:hover .monitor-site-icon:not(.flat-icon) {
+ filter: grayscale(0);
+}
+
+.monitor-site-status-icon {
+ flex-shrink: 0;
+ margin-left: auto;
+ width: 2rem;
+ height: 2rem;
+}
+
+.monitor-site-status-icon-compact {
+ width: 1.8rem;
+ height: 1.8rem;
+ flex-shrink: 0;
+}
diff --git a/internal/glance/static/css/widget-reddit.css b/internal/glance/static/css/widget-reddit.css
new file mode 100644
index 0000000..5b62e0e
--- /dev/null
+++ b/internal/glance/static/css/widget-reddit.css
@@ -0,0 +1,22 @@
+.reddit-card-thumbnail {
+ width: 100%;
+ height: 100%;
+ object-fit: cover;
+ object-position: 0% 20%;
+ opacity: 0.15;
+ filter: blur(1px);
+}
+
+.reddit-card-thumbnail-container {
+ position: absolute;
+ inset: 0;
+ overflow: hidden;
+ border-radius: var(--border-radius);
+}
+
+.reddit-card-thumbnail-container::after {
+ content: '';
+ position: absolute;
+ inset: 0;
+ background: linear-gradient(0deg, var(--color-widget-background) 10%, transparent);
+}
diff --git a/internal/glance/static/css/widget-releases.css b/internal/glance/static/css/widget-releases.css
new file mode 100644
index 0000000..7def4cf
--- /dev/null
+++ b/internal/glance/static/css/widget-releases.css
@@ -0,0 +1,6 @@
+.release-source-icon {
+ width: 16px;
+ height: 16px;
+ flex-shrink: 0;
+ opacity: 0.4;
+}
diff --git a/internal/glance/static/css/widget-rss.css b/internal/glance/static/css/widget-rss.css
new file mode 100644
index 0000000..34b7114
--- /dev/null
+++ b/internal/glance/static/css/widget-rss.css
@@ -0,0 +1,56 @@
+.rss-card-image {
+ height: var(--rss-thumbnail-height, 10rem);
+ object-fit: cover;
+ border-radius: var(--border-radius) var(--border-radius) 0 0;
+}
+
+.rss-card-2 {
+ position: relative;
+ height: var(--rss-card-height, 27rem);
+ overflow: hidden;
+}
+
+.rss-card-2::before {
+ content: '';
+ position: absolute;
+ inset: 0;
+ pointer-events: none;
+ background-image: linear-gradient(
+ 0deg,
+ var(--color-widget-background),
+ hsla(var(--color-widget-background-hsl-values), 0.8) 6rem, transparent 14rem
+ );
+ z-index: 2;
+}
+
+.rss-card-2-image {
+ position: absolute;
+ width: 100%;
+ height: 100%;
+ object-fit: cover;
+ /* +1px is required to fix some weird graphical bug where the image overflows on the bottom in firefox */
+ border-radius: calc(var(--border-radius) + 1px);
+ opacity: 0.9;
+ z-index: 1;
+}
+
+.rss-card-2-content {
+ position: absolute;
+ inset-inline: 0;
+ bottom: var(--widget-content-vertical-padding);
+ z-index: 3;
+}
+
+.rss-detailed-description {
+ max-width: 55rem;
+ color: var(--color-text-base-muted);
+}
+
+.rss-detailed-thumbnail {
+ margin-top: 0.3rem;
+}
+
+.rss-detailed-thumbnail > * {
+ aspect-ratio: 3 / 2;
+ height: 8.7rem;
+}
diff --git a/internal/glance/static/css/widget-search.css b/internal/glance/static/css/widget-search.css
new file mode 100644
index 0000000..ebf5cbb
--- /dev/null
+++ b/internal/glance/static/css/widget-search.css
@@ -0,0 +1,79 @@
+.search-icon {
+ width: 2.3rem;
+}
+
+.search-icon-container {
+ position: relative;
+ flex-shrink: 0;
+}
+
+/* gives a wider hit area for the 3 people that will notice the animation : ) */
+.search-icon-container::before {
+ content: '';
+ position: absolute;
+ inset: -1rem;
+}
+
+.search-icon-container:hover > .search-icon {
+ animation: searchIconHover 2.9s forwards;
+}
+
+@keyframes searchIconHover {
+ 0%, 39% { translate: 0 0; }
+ 20% { scale: 1.3; }
+ 40% { scale: 1; }
+ 50% { translate: -30% 30%; }
+ 70% { translate: 30% -30%; }
+ 90% { translate: -30% -30%; }
+ 100% { translate: 0 0; }
+}
+
+.search {
+ transition: border-color .2s;
+ position: relative;
+}
+
+.search:hover {
+ border-color: var(--color-text-subdue);
+}
+
+.search:focus-within {
+ border-color: var(--color-primary);
+}
+
+.search-input {
+ border: 0;
+ background: none;
+ width: 100%;
+ height: 6rem;
+ font: inherit;
+ outline: none;
+ color: var(--color-text-highlight);
+}
+
+.search-input::placeholder {
+ color: var(--color-text-base-muted);
+ opacity: 1;
+}
+
+.search-bangs { display: none; }
+
+.search-bang {
+ border-radius: calc(var(--border-radius) * 2);
+ background: var(--color-widget-background-highlight);
+ padding: 0.3rem 1rem;
+ flex-shrink: 0;
+ font-size: var(--font-size-h5);
+ animation: searchBangsEntrance .3s cubic-bezier(0.25, 1, 0.5, 1) backwards;
+}
+
+@keyframes searchBangsEntrance {
+ 0% {
+ opacity: 0;
+ transform: translateX(-10px);
+ }
+}
+
+.search-bang:empty {
+ display: none;
+}
diff --git a/internal/glance/static/css/widget-server-stats.css b/internal/glance/static/css/widget-server-stats.css
new file mode 100644
index 0000000..11f9ab5
--- /dev/null
+++ b/internal/glance/static/css/widget-server-stats.css
@@ -0,0 +1,81 @@
+.widget-type-server-info {
+ position: relative;
+}
+
+.server + .server {
+ margin-top: 3rem;
+}
+
+.server {
+ gap: 1rem;
+ display: flex;
+ flex-direction: column;
+}
+
+.server-info {
+ align-items: center;
+ display: flex;
+ justify-content: space-between;
+ gap: 1.5rem;
+ flex-shrink: 1;
+ min-width: 0;
+}
+
+.server-details {
+ min-width: 0;
+}
+
+.server-icon {
+ height: 3rem;
+ width: 3rem;
+}
+
+.server-spicy-cpu-icon {
+ height: 1em;
+ align-self: center;
+ margin-left: 0.4em;
+ margin-bottom: 0.2rem;
+}
+
+.server-stats {
+ display: flex;
+ gap: 1.5rem;
+ margin-top: 0.5rem;
+}
+
+.server-stat-unavailable {
+ opacity: 0.5;
+}
+
+@container widget (min-width: 650px) {
+ .server {
+ gap: 2rem;
+ flex-direction: row;
+ align-items: center;
+ }
+
+ .server + .server {
+ margin-top: 1rem;
+ }
+
+ .server-info {
+ flex-direction: row-reverse;
+ justify-content: unset;
+ margin-right: auto;
+ z-index: 1;
+ }
+
+ .server-stats {
+ flex-direction: row;
+ justify-content: right;
+ min-width: 450px;
+ margin-top: 0;
+ gap: 2rem;
+ padding-bottom: 0.8rem;
+ z-index: 1;
+ }
+
+ .server-stats > * {
+ max-width: 200px;
+ }
+}
diff --git a/internal/glance/static/css/widget-twitch.css b/internal/glance/static/css/widget-twitch.css
new file mode 100644
index 0000000..d109756
--- /dev/null
+++ b/internal/glance/static/css/widget-twitch.css
@@ -0,0 +1,47 @@
+.twitch-category-thumbnail {
+ width: 5rem;
+ aspect-ratio: 3 / 4;
+ border-radius: var(--border-radius);
+}
+
+.twitch-channel-avatar {
+ aspect-ratio: 1;
+ border-radius: 50%;
+}
+
+.twitch-channel-avatar-container {
+ width: 4.4rem;
+ height: 4.4rem;
+ border: 2px solid var(--color-text-subdue);
+ padding: 2px;
+ border-radius: 50%;
+ position: relative;
+ flex-shrink: 0;
+}
+
+.twitch-channel-live .twitch-channel-avatar-container {
+ border: 2px solid var(--color-positive);
+ margin-bottom: 1rem;
+}
+
+.twitch-channel-live .twitch-channel-avatar-container::after {
+ content: 'LIVE';
+ position: absolute;
+ background: var(--color-positive);
+ color: var(--color-widget-background);
+ font-size: var(--font-size-h6);
+ left: 50%;
+ bottom: -35%;
+ border-radius: var(--border-radius);
+ padding-inline: 0.3rem;
+ transform: translate(-50%);
+ border: 2px solid var(--color-widget-background);
+}
+
+.twitch-stream-preview {
+ max-width: 100%;
+ width: 400px;
+ aspect-ratio: 16 / 9;
+ border-radius: var(--border-radius);
+ object-fit: cover;
+}
diff --git a/internal/glance/static/css/widget-videos.css b/internal/glance/static/css/widget-videos.css
new file mode 100644
index 0000000..8d07801
--- /dev/null
+++ b/internal/glance/static/css/widget-videos.css
@@ -0,0 +1,13 @@
+.video-thumbnail {
+ width: 100%;
+ aspect-ratio: 16 / 8.9;
+ object-fit: cover;
+ border-radius: var(--border-radius) var(--border-radius) 0 0;
+}
+
+.video-horizontal-list-thumbnail {
+ height: 4rem;
+ aspect-ratio: 16 / 8.9;
+ object-fit: cover;
+ border-radius: var(--border-radius);
+}
diff --git a/internal/glance/static/css/widget-weather.css b/internal/glance/static/css/widget-weather.css
new file mode 100644
index 0000000..84d50ba
--- /dev/null
+++ b/internal/glance/static/css/widget-weather.css
@@ -0,0 +1,139 @@
+.weather-column {
+ position: relative;
+ display: flex;
+ align-items: center;
+ justify-content: end;
+ flex-direction: column;
+ width: calc(100% / 12);
+ padding-top: 3px;
+}
+
+.weather-column-value, .weather-columns:hover .weather-column-value {
+ font-size: 13px;
+ color: var(--color-text-highlight);
+ letter-spacing: -0.1rem;
+ margin-right: 0.1rem;
+ position: relative;
+ margin-bottom: 0.3rem;
+ opacity: 0;
+ transform: translateY(0.5rem);
+ transition: opacity .2s, transform .2s;
+ user-select: none;
+}
+
+.weather-column-current .weather-column-value, .weather-column:hover .weather-column-value {
+ opacity: 1;
+ transform: translateY(0);
+}
+
+.weather-column-value::after {
+ position: absolute;
+ content: '°';
+ left: 100%;
+ color: var(--color-text-subdue);
+}
+
+.weather-column-value.weather-column-value-negative::before {
+ position: absolute;
+ content: '-';
+ right: 100%;
+}
+
+.weather-bar, .weather-columns:hover .weather-bar {
+ height: calc(20px + var(--weather-bar-height) * 40px);
+ width: 6px;
+ background-color: hsl(var(--ths), calc(var(--scheme) ((var(--scheme) var(--bgl)) + 18%)));
+ border: 1px solid hsl(var(--ths), calc(var(--scheme) ((var(--scheme) var(--bgl)) + 24%)));
+ border-bottom: 0;
+ border-radius: 6px 6px 0 0;
+ mask-image: linear-gradient(0deg, transparent 0, #000 10px);
+ -webkit-mask-image: linear-gradient(0deg, transparent 0, #000 10px);
+ transition: background-color .2s, border-color .2s, width .2s;
+}
+
+.weather-column-current .weather-bar, .weather-column:hover .weather-bar {
+ width: 10px;
+ background-color: hsl(var(--ths), calc(var(--scheme) ((var(--scheme) var(--bgl)) + 40%)));
+ border: 1px solid hsl(var(--ths), calc(var(--scheme) ((var(--scheme) var(--bgl)) + 50%)));
+}
+
+.weather-column-rain {
+ position: absolute;
+ inset: 0;
+ bottom: 20%;
+ overflow: hidden;
+ mask-image: linear-gradient(0deg, transparent 40%, #000);
+ -webkit-mask-image: linear-gradient(0deg, transparent 40%, #000);
+}
+
+.weather-column-rain::before {
+ content: '';
+ position: absolute;
+ /* TODO: figure out a way to make it look continuous between columns, right now */
+ /* depending on the width of the page the rain inside two columns next to each other */
+ /* can overlap and look bad */
+ background: radial-gradient(circle at 4px 4px, hsl(200, 90%, 70%, 0.4) 1px, transparent 0);
+ background-size: 8px 8px;
+ transform: rotate(45deg) translate(-50%, 25%);
+ height: 130%;
+ aspect-ratio: 1;
+ left: 55%;
+}
+
+.weather-column:nth-child(3) .weather-column-time,
+.weather-column:nth-child(7) .weather-column-time,
+.weather-column:nth-child(11) .weather-column-time {
+ opacity: 1;
+ transform: translateY(0);
+}
+
+.weather-column-time, .weather-columns:hover .weather-column-time {
+ margin-top: 0.3rem;
+ font-size: var(--font-size-h6);
+ opacity: 0;
+ transform: translateY(-0.5rem);
+ transition: opacity .2s, transform .2s;
+ user-select: none;
+}
+
+.weather-column:hover .weather-column-time {
+ opacity: 1;
+ transform: translateY(0);
+}
+
+.weather-column-daylight {
+ position: absolute;
+ inset: 0;
+ background: linear-gradient(0deg, transparent 30px, hsl(50, 50%, 30%, 0.2));
+}
+
+.weather-column-daylight-sunrise {
+ border-radius: 20px 0 0 0;
+}
+
+.weather-column-daylight-sunset {
+ border-radius: 0 20px 0 0;
+}
+
+.location-icon {
+ width: 0.8em;
+ height: 0.8em;
+ border-radius: 0 50% 50% 50%;
+ background-color: currentColor;
+ transform: rotate(225deg) translate(.1em, .1em);
+ position: relative;
+ flex-shrink: 0;
+}
+
+.location-icon::after {
+ content: '';
+ position: absolute;
+ z-index: 2;
+ width: .4em;
+ height: .4em;
+ border-radius: 50%;
+ background-color: var(--color-widget-background);
+ top: 50%;
+ left: 50%;
+ transform: translate(-50%, -50%);
+}
diff --git a/internal/glance/static/css/widgets.css b/internal/glance/static/css/widgets.css
new file mode 100644
index 0000000..9c9e8ee
--- /dev/null
+++ b/internal/glance/static/css/widgets.css
@@ -0,0 +1,88 @@
+@import "widget-bookmarks.css";
+@import "widget-calendar.css";
+@import "widget-clock.css";
+@import "widget-dns-stats.css";
+@import "widget-docker-containers.css";
+@import "widget-group.css";
+@import "widget-markets.css";
+@import "widget-monitor.css";
+@import "widget-reddit.css";
+@import "widget-releases.css";
+@import "widget-rss.css";
+@import "widget-search.css";
+@import "widget-server-stats.css";
+@import "widget-twitch.css";
+@import "widget-videos.css";
+@import "widget-weather.css";
+
+@import "forum-posts.css";
+
+.widget-error-header {
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ position: relative;
+ margin-bottom: 1.8rem;
+ z-index: 1;
+}
+
+.widget-error-header::before {
+ content: '';
+ position: absolute;
+ inset: calc(0rem - (var(--widget-content-vertical-padding) / 2)) calc(0rem - (var(--widget-content-horizontal-padding) / 2));
+ background: var(--color-negative);
+ opacity: 0.05;
+ border-radius: var(--border-radius);
+ z-index: -1;
+}
+
+.widget-error-icon {
+ width: 2.4rem;
+ height: 2.4rem;
+ flex-shrink: 0;
+ stroke: var(--color-negative);
+ opacity: 0.6;
+}
+
+.widget-content {
+ container-type: inline-size;
+ container-name: widget;
+}
+
+.widget-content:not(.widget-content-frameless) {
+ padding: var(--widget-content-padding);
+}
+
+.widget-content:not(.widget-content-frameless), .widget-content-frame {
+ background: var(--color-widget-background);
+ border-radius: var(--border-radius);
+ border: 1px solid var(--color-widget-content-border);
+ box-shadow: 0px 3px 0px 0px hsl(var(--bghs), calc(var(--scheme) (var(--scheme) var(--bgl)) - 0.5%));
+}
+
+.widget-header {
+ padding: 0 calc(var(--widget-content-horizontal-padding) + 1px);
+ font-size: var(--font-size-h4);
+ margin-bottom: 0.9rem;
+ display: flex;
+ align-items: center;
+ gap: 1rem;
+}
+
+.widget-beta-icon {
+ width: 1.6rem;
+ height: 1.6rem;
+ flex-shrink: 0;
+ transition: transform .45s, opacity .45s, stroke .45s;
+ opacity: 0.7;
+}
+
+.widget-beta-icon:hover, .widget-header .popover-active > .widget-beta-icon {
+ fill: var(--color-text-highlight);
+ transform: translateY(-10%) scale(1.3);
+ opacity: 1;
+}
+
+.widget + .widget {
+ margin-top: var(--widget-gap);
+}
diff --git a/internal/glance/static/js/animations.js b/internal/glance/static/js/animations.js
new file mode 100644
index 0000000..db5b0aa
--- /dev/null
+++ b/internal/glance/static/js/animations.js
@@ -0,0 +1,33 @@
+export const easeOutQuint = 'cubic-bezier(0.22, 1, 0.36, 1)';
+
+export function directions(anim, opt, ...dirs) {
+ return dirs.map(dir => anim({ direction: dir, ...opt }));
+}
+
+export function slideFade({
+ direction = 'left',
+ fill = 'backwards',
+ duration = 200,
+ distance = '1rem',
+ easing = 'ease',
+ offset = 0,
+}) {
+ const axis = direction === 'left' || direction === 'right' ? 'X' : 'Y';
+ const negative = direction === 'left' || direction === 'up' ? '-' : '';
+ const amount = negative + distance;
+
+ return {
+ keyframes: [
+ {
+ offset: offset,
+ opacity: 0,
+ transform: `translate${axis}(${amount})`,
+ }
+ ],
+ options: {
+ duration: duration,
+ easing: easing,
+ fill: fill,
+ },
+ };
+}
diff --git a/internal/glance/static/js/calendar.js b/internal/glance/static/js/calendar.js
new file mode 100644
index 0000000..fb6602e
--- /dev/null
+++ b/internal/glance/static/js/calendar.js
@@ -0,0 +1,212 @@
+import { directions, easeOutQuint, slideFade } from "./animations.js";
+import { elem, repeat, text } from "./templating.js";
+
+const FULL_MONTH_SLOTS = 7*6;
+const WEEKDAY_ABBRS = ["Su", "Mo", "Tu", "We", "Th", "Fr", "Sa"];
+const MONTH_NAMES = ["January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December"];
+
+const leftArrowSvg = `<svg stroke="var(--color-text-base)" fill="none" viewBox="0 0 24 24" stroke-width="1.5" xmlns="http://www.w3.org/2000/svg">
+ <path stroke-linecap="round" stroke-linejoin="round" d="M15.75 19.5 8.25 12l7.5-7.5" />
+</svg>`;
+
+const rightArrowSvg = `<svg stroke="var(--color-text-base)" fill="none" viewBox="0 0 24 24" stroke-width="1.5" xmlns="http://www.w3.org/2000/svg">
+ <path stroke-linecap="round" stroke-linejoin="round" d="m8.25 4.5 7.5 7.5-7.5 7.5" />
+</svg>`;
+
+const undoArrowSvg = `<svg stroke="var(--color-text-base)" fill="none" viewBox="0 0 24 24" stroke-width="1.5" xmlns="http://www.w3.org/2000/svg">
+ <path stroke-linecap="round" stroke-linejoin="round" d="M9 15 3 9m0 0 6-6M3 9h12a6 6 0 0 1 0 12h-3" />
+</svg>`;
+
+const [datesExitLeft, datesExitRight] = directions(
+ slideFade, { distance: "2rem", duration: 120, offset: 1 },
+ "left", "right"
+);
+
+const [datesEntranceLeft, datesEntranceRight] = directions(
+ slideFade, { distance: "0.8rem", duration: 500, easing: easeOutQuint },
+ "left", "right"
+);
+
+const undoEntrance = slideFade({ direction: "left", distance: "100%", duration: 300 });
+
+export default function(element) {
+ element.swap(Calendar(
+ Number(element.dataset.firstDayOfWeek ?? 1)
+ ));
+}
+
+// TODO: when viewing the previous/next month, display the current date if it's within the spill-over days
+function Calendar(firstDay) {
+ let header, dates;
+ let advanceTimeTicker;
+ let now = new Date();
+ let activeDate;
+
+ const update = (newDate) => {
+ header.component.update(now, newDate);
+ dates.component.update(now, newDate);
+ activeDate = newDate;
+ };
+
+ const autoAdvanceNow = () => {
+ advanceTimeTicker = setTimeout(() => {
+ // TODO: don't auto advance if looking at a different month
+ update(now = new Date());
+ autoAdvanceNow();
+ }, msTillNextDay());
+ };
+
+ const adjacentMonth = (dir) => new Date(activeDate.getFullYear(), activeDate.getMonth() + dir, 1);
+ const nextClicked = () => update(adjacentMonth(1));
+ const prevClicked = () => update(adjacentMonth(-1));
+ const undoClicked = () => update(now);
+
+ const calendar = elem().classes("calendar").append(
+ header = Header(nextClicked, prevClicked, undoClicked),
+ dates = Dates(firstDay)
+ );
+
+ update(now);
+ autoAdvanceNow();
+
+ return calendar.component({
+ suspend: () => clearTimeout(advanceTimeTicker)
+ });
+}
+
+function Header(nextClicked, prevClicked, undoClicked) {
+ let month, monthNumber, year, undo;
+ const button = () => elem("button").classes("calendar-header-button");
+
+ const monthAndYear = elem().classes("size-h2", "color-highlight").append(
+ month = text(),
+ " ",
+ year = elem("span").classes("size-h3"),
+ undo = button()
+ .hide()
+ .classes("calendar-undo-button")
+ .attr("title", "Back to current month")
+ .on("click", undoClicked)
+ .html(undoArrowSvg)
+ );
+
+ const monthSwitcher = elem()
+ .classes("flex", "gap-7", "items-center")
+ .append(
+ button()
+ .attr("title", "Previous month")
+ .on("click", prevClicked)
+ .html(leftArrowSvg),
+ monthNumber = elem()
+ .classes("color-highlight")
+ .styles({ marginTop: "0.1rem" }),
+ button()
+ .attr("title", "Next month")
+ .on("click", nextClicked)
+ .html(rightArrowSvg),
+ );
+
+ return elem().classes("flex", "justify-between", "items-center").append(
+ monthAndYear,
+ monthSwitcher
+ ).component({
+ update: function (now, newDate) {
+ month.text(MONTH_NAMES[newDate.getMonth()]);
+ year.text(newDate.getFullYear());
+ const m = newDate.getMonth() + 1;
+ monthNumber.text((m < 10 ? "0" : "") + m);
+
+ if (!datesWithinSameMonth(now, newDate)) {
+ if (undo.isHidden()) undo.show().animate(undoEntrance);
+ } else {
+ undo.hide();
+ }
+
+ return this;
+ }
+ });
+}
+
+function Dates(firstDay) {
+ let dates, lastRenderedDate;
+
+ const updateFullMonth = function(now, newDate) {
+ const firstWeekday = new Date(newDate.getFullYear(), newDate.getMonth(), 1).getDay();
+ const previousMonthSpilloverDays = (firstWeekday - firstDay + 7) % 7 || 7;
+ const currentMonthDays = daysInMonth(newDate.getFullYear(), newDate.getMonth());
+ const nextMonthSpilloverDays = FULL_MONTH_SLOTS - (previousMonthSpilloverDays + currentMonthDays);
+ const previousMonthDays = daysInMonth(newDate.getFullYear(), newDate.getMonth() - 1)
+ const isCurrentMonth = datesWithinSameMonth(now, newDate);
+ const currentDate = now.getDate();
+
+ let children = dates.children;
+ let index = 0;
+
+ for (let i = 0; i < FULL_MONTH_SLOTS; i++) {
+ children[i].clearClasses("calendar-spillover-date", "calendar-current-date");
+ }
+
+ for (let i = 0; i < previousMonthSpilloverDays; i++, index++) {
+ children[index].classes("calendar-spillover-date").text(
+ previousMonthDays - previousMonthSpilloverDays + i + 1
+ )
+ }
+
+ for (let i = 1; i <= currentMonthDays; i++, index++) {
+ children[index]
+ .classesIf(isCurrentMonth && i === currentDate, "calendar-current-date")
+ .text(i);
+ }
+
+ for (let i = 0; i < nextMonthSpilloverDays; i++, index++) {
+ children[index].classes("calendar-spillover-date").text(i + 1);
+ }
+
+ lastRenderedDate = newDate;
+ };
+
+ const update = function(now, newDate) {
+ if (lastRenderedDate === undefined || datesWithinSameMonth(newDate, lastRenderedDate)) {
+ updateFullMonth(now, newDate);
+ return;
+ }
+
+ const next = newDate > lastRenderedDate;
+ dates.animateUpdate(
+ () => updateFullMonth(now, newDate),
+ next ? datesExitLeft : datesExitRight,
+ next ? datesEntranceRight : datesEntranceLeft,
+ );
+ }
+
+ return elem().append(
+ elem().classes("calendar-dates", "margin-top-15").append(
+ ...repeat(7, (i) => elem().classes("size-h6", "color-subdue").text(
+ WEEKDAY_ABBRS[(firstDay + i) % 7]
+ ))
+ ),
+
+ dates = elem().classes("calendar-dates", "margin-top-3").append(
+ ...elem().classes("calendar-date").duplicate(FULL_MONTH_SLOTS)
+ )
+ ).component({ update });
+}
+
+function datesWithinSameMonth(d1, d2) {
+ return d1.getFullYear() === d2.getFullYear() && d1.getMonth() === d2.getMonth();
+}
+
+function daysInMonth(year, month) {
+ return new Date(year, month + 1, 0).getDate();
+}
+
+function msTillNextDay(now) {
+ now = now || new Date();
+
+ return 86_400_000 - (
+ now.getMilliseconds() +
+ now.getSeconds() * 1000 +
+ now.getMinutes() * 60_000 +
+ now.getHours() * 3_600_000
+ );
+}
diff --git a/internal/glance/static/js/main.js b/internal/glance/static/js/main.js
index b644676..b86b4eb 100644
--- a/internal/glance/static/js/main.js
+++ b/internal/glance/static/js/main.js
@@ -128,6 +128,7 @@ function setupSearchBoxes() {
for (let i = 0; i < searchWidgets.length; i++) {
const widget = searchWidgets[i];
const defaultSearchUrl = widget.dataset.defaultSearchUrl;
+ const target = widget.dataset.target || "_blank";
const newTab = widget.dataset.newTab === "true";
const inputElement = widget.getElementsByClassName("search-input")[0];
const bangElement = widget.getElementsByClassName("search-bang")[0];
@@ -167,7 +168,7 @@ function setupSearchBoxes() {
const url = searchUrlTemplate.replace("!QUERY!", encodeURIComponent(query));
if (newTab && !event.ctrlKey || !newTab && event.ctrlKey) {
- window.open(url, '_blank').focus();
+ window.open(url, target).focus();
} else {
window.location.href = url;
}
@@ -308,7 +309,9 @@ function setupGroups() {
for (let i = 0; i < titles.length; i++) {
titles[i].classList.remove("widget-group-title-current");
+ titles[i].setAttribute("aria-selected", "false");
tabs[i].classList.remove("widget-group-content-current");
+ tabs[i].setAttribute("aria-hidden", "true");
}
if (current < t) {
@@ -320,7 +323,9 @@ function setupGroups() {
current = t;
title.classList.add("widget-group-title-current");
+ title.setAttribute("aria-selected", "true");
tabs[t].classList.add("widget-group-content-current");
+ tabs[t].setAttribute("aria-hidden", "false");
});
}
}
@@ -463,7 +468,7 @@ function setupCollapsibleGrids() {
let cardsPerRow;
- const resolveCollapsibleItems = () => {
+ const resolveCollapsibleItems = () => requestAnimationFrame(() => {
const hideItemsAfterIndex = cardsPerRow * collapseAfterRows;
if (hideItemsAfterIndex >= gridElement.children.length) {
@@ -489,7 +494,7 @@ function setupCollapsibleGrids() {
child.style.removeProperty("animation-delay");
}
}
- };
+ });
const observer = new ResizeObserver(() => {
if (!isElementVisible(gridElement)) {
@@ -649,6 +654,17 @@ function setupClocks() {
updateClocks();
}
+async function setupCalendars() {
+ const elems = document.getElementsByClassName("calendar");
+ if (elems.length == 0) return;
+
+ // TODO: implement prefetching, currently loads as a nasty waterfall of requests
+ const calendar = await import ('./calendar.js');
+
+ for (let i = 0; i < elems.length; i++)
+ calendar.default(elems[i]);
+}
+
function setupTruncatedElementTitles() {
const elements = document.querySelectorAll(".text-truncate, .single-line-titles .title, .text-truncate-2-lines, .text-truncate-3-lines");
@@ -658,7 +674,7 @@ function setupTruncatedElementTitles() {
for (let i = 0; i < elements.length; i++) {
const element = elements[i];
- if (element.title === "") element.title = element.textContent;
+ if (element.getAttribute("title") === null) element.title = element.textContent;
}
}
@@ -768,6 +784,7 @@ async function setupPage() {
setupThemeSwitcher();
setupPopovers();
setupClocks()
+ await setupCalendars();
setupCarousels();
setupSearchBoxes();
setupCollapsibleLists();
@@ -778,6 +795,7 @@ async function setupPage() {
setupLazyImages();
} finally {
pageElement.classList.add("content-ready");
+ pageElement.setAttribute("aria-busy", "false");
for (let i = 0; i < contentReadyCallbacks.length; i++) {
contentReadyCallbacks[i]();
diff --git a/internal/glance/static/js/popover.js b/internal/glance/static/js/popover.js
index 26d1850..331ee26 100644
--- a/internal/glance/static/js/popover.js
+++ b/internal/glance/static/js/popover.js
@@ -25,7 +25,8 @@ frameElement.append(contentElement);
containerElement.append(frameElement);
document.body.append(containerElement);
-const observer = new ResizeObserver(repositionContainer);
+const queueRepositionContainer = () => requestAnimationFrame(repositionContainer);
+const observer = new ResizeObserver(queueRepositionContainer);
function handleMouseEnter(event) {
clearTogglePopoverTimeout();
@@ -97,14 +98,15 @@ function showPopover() {
}
contentElement.style.maxWidth = contentMaxWidth;
- containerElement.style.display = "block";
activeTarget.classList.add("popover-active");
document.addEventListener("keydown", handleHidePopoverOnEscape);
- window.addEventListener("resize", repositionContainer);
+ window.addEventListener("resize", queueRepositionContainer);
observer.observe(containerElement);
}
function repositionContainer() {
+ containerElement.style.display = "block";
+
const targetBounds = activeTarget.dataset.popoverAnchor !== undefined
? activeTarget.querySelector(activeTarget.dataset.popoverAnchor).getBoundingClientRect()
: activeTarget.getBoundingClientRect();
@@ -156,7 +158,7 @@ function hidePopover() {
activeTarget.classList.remove("popover-active");
containerElement.style.display = "none";
document.removeEventListener("keydown", handleHidePopoverOnEscape);
- window.removeEventListener("resize", repositionContainer);
+ window.removeEventListener("resize", queueRepositionContainer);
observer.unobserve(containerElement);
if (cleanupOnHidePopover !== null) {
diff --git a/internal/glance/static/js/templating.js b/internal/glance/static/js/templating.js
new file mode 100644
index 0000000..05824bc
--- /dev/null
+++ b/internal/glance/static/js/templating.js
@@ -0,0 +1,190 @@
+export function elem(tag = "div") {
+ return document.createElement(tag);
+}
+
+export function fragment(...children) {
+ const f = document.createDocumentFragment();
+ if (children) f.append(...children);
+ return f;
+}
+
+export function text(str = "") {
+ return document.createTextNode(str);
+}
+
+export function repeat(n, fn) {
+ const elems = Array(n);
+
+ for (let i = 0; i < n; i++)
+ elems[i] = fn(i);
+
+ return elems;
+}
+
+export function find(selector) {
+ return document.querySelector(selector);
+}
+
+export function findAll(selector) {
+ return document.querySelectorAll(selector);
+}
+
+const ep = HTMLElement.prototype;
+const fp = DocumentFragment.prototype;
+const tp = Text.prototype;
+
+ep.classes = function(...classes) {
+ this.classList.add(...classes);
+ return this;
+}
+
+ep.find = function(selector) {
+ return this.querySelector(selector);
+}
+
+ep.findAll = function(selector) {
+ return this.querySelectorAll(selector);
+}
+
+ep.classesIf = function(cond, ...classes) {
+ cond ? this.classList.add(...classes) : this.classList.remove(...classes);
+ return this;
+}
+
+ep.hide = function() {
+ this.style.display = "none";
+ return this;
+}
+
+ep.show = function() {
+ this.style.removeProperty("display");
+ return this;
+}
+
+ep.showIf = function(cond) {
+ cond ? this.show() : this.hide();
+ return this;
+}
+
+ep.isHidden = function() {
+ return this.style.display === "none";
+}
+
+ep.clearClasses = function(...classes) {
+ classes.length ? this.classList.remove(...classes) : this.className = "";
+ return this;
+}
+
+ep.hasClass = function(className) {
+ return this.classList.contains(className);
+}
+
+ep.attr = function(name, value) {
+ this.setAttribute(name, value);
+ return this;
+}
+
+ep.attrs = function(attrs) {
+ for (const [name, value] of Object.entries(attrs))
+ this.setAttribute(name, value);
+ return this;
+}
+
+ep.tap = function(fn) {
+ fn(this);
+ return this;
+}
+
+ep.text = function(text) {
+ this.innerText = text;
+ return this;
+}
+
+ep.html = function(html) {
+ this.innerHTML = html;
+ return this;
+}
+
+ep.appendTo = function(parent) {
+ parent.appendChild(this);
+ return this;
+}
+
+ep.swap = function(element) {
+ this.replaceWith(element);
+ return element;
+}
+
+ep.on = function(event, callback, options) {
+ if (typeof event === "string") {
+ this.addEventListener(event, callback, options);
+ return this;
+ }
+
+ for (let i = 0; i < event.length; i++)
+ this.addEventListener(event[i], callback, options);
+
+ return this;
+}
+
+const epAppend = ep.append;
+ep.append = function(...children) {
+ epAppend.apply(this, children);
+ return this;
+}
+
+ep.duplicate = function(n) {
+ const elems = Array(n);
+
+ for (let i = 0; i < n; i++)
+ elems[i] = this.cloneNode(true);
+
+ return elems;
+}
+
+ep.styles = function(s) {
+ Object.assign(this.style, s);
+ return this;
+}
+
+const epAnimate = ep.animate;
+ep.animate = function(anim, callback) {
+ const a = epAnimate.call(this, anim.keyframes, anim.options);
+ if (callback) a.onfinish = () => callback(this, a);
+ return this;
+}
+
+ep.animateUpdate = function(update, exit, entrance) {
+ this.animate(exit, () => {
+ update(this);
+ this.animate(entrance);
+ });
+
+ return this;
+}
+
+ep.styleVar = function(name, value) {
+ this.style.setProperty(`--${name}`, value);
+ return this;
+}
+
+ep.component = function (methods) {
+ this.component = methods;
+ return this;
+}
+
+const fpAppend = fp.append;
+fp.append = function(...children) {
+ fpAppend.apply(this, children);
+ return this;
+}
+
+fp.appendTo = function(parent) {
+ parent.appendChild(this);
+ return this;
+}
+
+tp.text = function(text) {
+ this.nodeValue = text;
+ return this;
+}
diff --git a/internal/glance/static/main.css b/internal/glance/static/main.css
deleted file mode 100644
index 1128963..0000000
--- a/internal/glance/static/main.css
+++ /dev/null
@@ -1,1975 +0,0 @@
-@font-face {
- font-family: 'JetBrains Mono';
- font-style: normal;
- font-weight: 400;
- font-display: swap;
- src: url('fonts/JetBrainsMono-Regular.woff2') format('woff2');
-}
-
-:root {
- font-size: 10px;
-
- --scheme: ;
- --bgh: 240;
- --bgs: 8%;
- --bgl: 9%;
- --bghs: var(--bgh), var(--bgs);
- --cm: 1;
- --tsm: 1;
-
- --widget-gap: 25px;
- --widget-content-vertical-padding: 15px;
- --widget-content-horizontal-padding: 17px;
- --widget-content-padding: var(--widget-content-vertical-padding) var(--widget-content-horizontal-padding);
- --content-bounds-padding: 15px;
- --border-radius: 5px;
- --mobile-navigation-height: 50px;
-
- --color-primary: hsl(43, 50%, 70%);
- --color-positive: var(--color-primary);
- --color-negative: hsl(0, 70%, 70%);
- --color-background: hsl(var(--bghs), var(--bgl));
- --color-widget-background-hsl-values: var(--bghs), calc(var(--bgl) + 1%);
- --color-widget-background: hsl(var(--color-widget-background-hsl-values));
- --color-separator: hsl(var(--bghs), calc(var(--scheme) ((var(--scheme) var(--bgl)) + 4% * var(--cm))));
- --color-widget-content-border: hsl(var(--bghs), calc(var(--scheme) (var(--scheme) var(--bgl) + 4%)));
- --color-widget-background-highlight: hsl(var(--bghs), calc(var(--scheme) (var(--scheme) var(--bgl) + 4%)));
- --color-popover-background: hsl(var(--bgh), calc(var(--bgs) + 3%), calc(var(--bgl) + 3%));
- --color-popover-border: hsl(var(--bghs), calc(var(--scheme) (var(--scheme) var(--bgl) + 12%)));
- --color-progress-border: hsl(var(--bghs), calc(var(--scheme) ((var(--scheme) var(--bgl)) + 10% * var(--cm))));
- --color-progress-value: hsl(var(--bgh), calc(var(--bgs) * var(--tsm)), calc(var(--scheme) ((var(--scheme) var(--bgl)) + 27% * var(--cm))));
- --color-graph-gridlines: hsl(var(--bghs), calc(var(--scheme) ((var(--scheme) var(--bgl)) + 6% * var(--cm))));
-
- --ths: var(--bgh), calc(var(--bgs) * var(--tsm));
- --color-text-base: hsl(var(--ths), calc(var(--scheme) var(--cm) * 58%));
- --color-text-base-muted: hsl(var(--ths), calc(var(--scheme) var(--cm) * 52%));
- --color-text-highlight: hsl(var(--ths), calc(var(--scheme) var(--cm) * 85%));
- --color-text-subdue: hsl(var(--ths), calc(var(--scheme) var(--cm) * 35%));
-
- --font-size-h1: 1.7rem;
- --font-size-h2: 1.6rem;
- --font-size-h3: 1.5rem;
- --font-size-h4: 1.4rem;
- --font-size-base: 1.3rem;
- --font-size-h5: 1.2rem;
- --font-size-h6: 1.1rem;
-}
-
-.dark {
- --scheme: ;
- --bgh: 240;
- --bgs: 8%;
- --bgl: 9%;
- --bghs: var(--bgh), var(--bgs);
- --cm: 1;
- --tsm: 1;
-}
-
-.light {
- --scheme: 100% -;
- --bgh: 240;
- --bgs: 50%;
- --bgl: 98%;
- --bghs: var(--bgh), var(--bgs);
- --cm: 1;
- --tsm: 1;
- --color-primary: hsl(43, 50%, 70%);
-}
-
-
-.light-scheme {
- --scheme: 100% -;
-}
-
-.page {
- height: 100%;
- padding-block: var(--widget-gap);
-}
-
-.page-content, .page.content-ready .page-loading-container {
- display: none;
-}
-
-.page.content-ready > .page-content {
- display: block;
-}
-
-.page-column-small .size-title-dynamic {
- font-size: var(--font-size-h4);
-}
-
-.page-column-full .size-title-dynamic {
- font-size: var(--font-size-h3);
-}
-
-.color-primary-if-not-visited:not(:visited) {
- color: var(--color-primary);
-}
-
-.text-truncate,
-.single-line-titles .title
-{
- overflow: hidden;
- text-overflow: ellipsis;
- white-space: nowrap;
-}
-
-.single-line-titles .title {
- display: block;
-}
-
-.text-truncate-2-lines, .text-truncate-3-lines {
- overflow: hidden;
- text-overflow: ellipsis;
- display: -webkit-box;
- -webkit-box-orient: vertical;
-}
-
-.text-truncate-3-lines { line-clamp: 3; -webkit-line-clamp: 3; }
-.text-truncate-2-lines { line-clamp: 2; -webkit-line-clamp: 2; }
-
-.visited-indicator:not(.text-truncate)::after,
-.visited-indicator.text-truncate::before,
-.bookmarks-link:not(.bookmarks-link-no-arrow)::after {
- content: '↗';
- margin-left: 0.5em;
- display: inline-block;
- position: relative;
- top: 0.15em;
- color: var(--color-text-base);
-}
-
-.visited-indicator.text-truncate {
- direction: rtl;
- text-align: left;
-}
-
-.visited-indicator:not(:visited)::before, .visited-indicator:not(:visited)::after {
- color: var(--color-primary);
-}
-
-.page-columns-transitioned .list-with-transition > * { animation: collapsibleItemReveal .25s backwards; }
-.list-with-transition > *:nth-child(2) { animation-delay: 30ms; }
-.list-with-transition > *:nth-child(3) { animation-delay: 60ms; }
-.list-with-transition > *:nth-child(4) { animation-delay: 90ms; }
-.list-with-transition > *:nth-child(5) { animation-delay: 120ms; }
-.list-with-transition > *:nth-child(6) { animation-delay: 150ms; }
-.list-with-transition > *:nth-child(7) { animation-delay: 180ms; }
-.list-with-transition > *:nth-child(8) { animation-delay: 210ms; }
-
-.list > *:not(:first-child) {
- margin-top: calc(var(--list-half-gap) * 2);
-}
-
-.list.list-with-separator > *:not(:first-child) {
- margin-top: var(--list-half-gap);
- border-top: 1px solid var(--color-separator);
- padding-top: var(--list-half-gap);
-}
-
-.collapsible-container:not(.container-expanded) > .collapsible-item {
- display: none;
-}
-
-.collapsible-item {
- animation: collapsibleItemReveal .25s backwards;
-}
-
-@keyframes collapsibleItemReveal {
- from {
- opacity: 0;
- transform: translateY(10px);
- }
-}
-
-.expand-toggle-button {
- font: inherit;
- border: 0;
- cursor: pointer;
- display: block;
- width: 100%;
- text-align: left;
- color: var(--color-text-base);
- text-transform: uppercase;
- font-size: var(--font-size-h4);
- padding: var(--widget-content-vertical-padding) 0;
- background: var(--color-widget-background);
-}
-
-.expand-toggle-button.container-expanded {
- position: sticky;
- /* -1px to hide 1px gap on chrome */
- bottom: -1px;
-}
-
-.expand-toggle-button-icon {
- display: inline-block;
- margin-left: 1rem;
- position: relative;
- top: -.2rem;
-}
-
-.expand-toggle-button-icon::before {
- content: '';
- font-size: 0.8rem;
- transform: rotate(90deg);
- line-height: 1;
- display: inline-block;
- transition: transform 0.3s;
-}
-
-.expand-toggle-button.container-expanded .expand-toggle-button-icon::before {
- transform: rotate(-90deg);
-}
-
-.widget-group-header {
- overflow-x: auto;
- scrollbar-width: thin;
-}
-
-.widget-group-title {
- background: none;
- font: inherit;
- border: none;
- text-transform: uppercase;
- border-bottom: 1px dotted transparent;
- cursor: pointer;
- flex-shrink: 0;
- transition: color .3s, border-color .3s;
- color: var(--color-text-subdue);
- line-height: calc(1.6em - 1px);
-}
-
-.widget-group-title:hover:not(.widget-group-title-current) {
- color: var(--color-text-base);
-}
-
-.widget-group-title-current {
- border-bottom-color: var(--color-text-base-muted);
- color: var(--color-text-base);
-}
-
-.widget-group-content {
- animation: widgetGroupContentEntrance .3s cubic-bezier(0.25, 1, 0.5, 1) backwards;
-}
-
-.widget-group-content[data-direction="right"] {
- --direction: 5px;
-}
-
-.widget-group-content[data-direction="left"] {
- --direction: -5px;
-}
-
-@keyframes widgetGroupContentEntrance {
- from {
- opacity: 0;
- transform: translateX(var(--direction));
- }
-}
-
-.widget-group-content:not(.widget-group-content-current) {
- display: none;
-}
-
-.widget-content:has(.expand-toggle-button:last-child) {
- padding-bottom: 0;
-}
-
-.cards-grid.collapsible-container + .expand-toggle-button {
- text-align: center;
- margin-top: 0.5rem;
- background-color: var(--color-background);
-}
-
-.attachments {
- display: flex;
- flex-wrap: wrap;
- gap: 0.5rem;
-}
-
-.attachments > * {
- border-radius: var(--border-radius);
- padding: 0.1rem 0.5rem;
- font-size: var(--font-size-h6);
- background-color: var(--color-separator);
-}
-
-pre {
- font: inherit;
-}
-
-::selection {
- background-color: hsl(var(--bghs), calc(var(--scheme) (var(--scheme) var(--bgl) + 20%)));
- color: var(--color-text-highlight);
-}
-
-::-webkit-scrollbar-thumb {
- background: var(--color-text-subdue);
- border-radius: var(--border-radius);
-}
-
-::-webkit-scrollbar {
- background: var(--color-background);
- height: 5px;
- width: 10px;
-}
-
-*, *::before, *::after {
- box-sizing: border-box;
-}
-
-* {
- padding: 0;
- margin: 0;
-}
-
-hr {
- border: 0;
- height: 1px;
- background-color: var(--color-separator);
-}
-
-img, svg {
- display: block;
- max-width: 100%;
-}
-
-img[loading=lazy].loaded:not(.finished-transition) {
- transition: opacity .4s;
-}
-
-img[loading=lazy].cached:not(.finished-transition) {
- transition: none;
-}
-
-img[loading=lazy]:not(.loaded, .cached) {
- opacity: 0;
-}
-
-html {
- scrollbar-color: var(--color-text-subdue) transparent;
- scroll-behavior: smooth;
-}
-
-html, body, .body-content {
- height: 100%;
-}
-
-a {
- text-decoration: none;
- color: inherit;
- overflow-wrap: break-word;
-}
-
-ul {
- list-style: none;
-}
-
-body {
- font-size: 1.3rem;
- font-family: 'JetBrains Mono', monospace;
- font-variant-ligatures: none;
- line-height: 1.6;
- color: var(--color-text-base);
- background-color: var(--color-background);
- overflow-y: scroll;
-}
-
-.page-column-small {
- width: 300px;
- flex-shrink: 0;
-}
-
-.page-column-full {
- width: 100%;
- min-width: 0;
-}
-
-.page-columns {
- display: flex;
- gap: var(--widget-gap);
- animation: pageColumnsEntrance .3s cubic-bezier(0.25, 1, 0.5, 1) backwards;
-}
-
-@keyframes pageColumnsEntrance {
- from {
- opacity: 0;
- transform: translateY(10px);
- }
-}
-
-.page-loading-container {
- height: 100%;
- display: flex;
- align-items: center;
- justify-content: center;
- animation: loadingContainerEntrance 200ms backwards;
- animation-delay: 150ms;
- font-size: 2rem;
-}
-
-.page-loading-container > .loading-icon {
- translate: 0 -250%;
-}
-
-@keyframes loadingContainerEntrance {
- from {
- opacity: 0;
- }
-}
-
-.loading-icon {
- min-width: 1.5em;
- width: 1.5em;
- height: 1.5em;
- border: 0.25em solid hsl(var(--bghs), calc(var(--scheme) ((var(--scheme) var(--bgl)) + 12%)));
- border-top-color: hsl(var(--bghs), calc(var(--scheme) ((var(--scheme) var(--bgl)) + 40%)));
- border-radius: 50%;
- animation: loadingIconSpin 800ms infinite linear;
-}
-
-@keyframes loadingIconSpin {
- to {
- transform: rotate(360deg);
- }
-}
-
-.notice-icon {
- width: 0.7rem;
- height: 0.7rem;
- border-radius: 50%;
-}
-
-.notice-icon-major {
- background: var(--color-negative);
-}
-
-.notice-icon-minor {
- border: 1px solid var(--color-negative);
-}
-
-kbd {
- font: inherit;
- padding: 0.1rem 0.8rem;
- border-radius: var(--border-radius);
- border: 2px solid var(--color-widget-background-highlight);
- box-shadow: 0 2px 0 var(--color-widget-background-highlight);
- user-select: none;
- transition: transform .1s, box-shadow .1s;
- font-size: var(--font-size-h5);
- cursor: pointer;
-}
-
-kbd:active {
- transform: translateY(2px);
- box-shadow: 0 0 0 0 var(--color-widget-background-highlight);
-}
-
-.masonry {
- display: flex;
- gap: var(--widget-gap);
-}
-
-.masonry-column {
- flex: 1;
- display: flex;
- flex-direction: column;
-}
-
-.popover-container, [data-popover-html] {
- display: none;
-}
-
-.popover-container {
- --triangle-size: 10px;
- --triangle-offset: 50%;
- --triangle-margin: calc(var(--triangle-size) + 3px);
- --entrance-y-offset: 8px;
- --entrance-direction: calc(var(--entrance-y-offset) * -1);
-
- z-index: 20;
- position: absolute;
- padding-top: var(--triangle-margin);
- padding-inline: var(--content-bounds-padding);
-}
-
-.popover-container.position-above {
- --entrance-direction: var(--entrance-y-offset);
- padding-top: 0;
- padding-bottom: var(--triangle-margin);
-}
-
-.popover-frame {
- --shadow-properties: 0 15px 20px -10px;
- --shadow-color: hsla(var(--bghs), calc(var(--bgl) * 0.2), 0.5);
- position: relative;
- padding: 10px;
- background: var(--color-popover-background);
- border: 1px solid var(--color-popover-border);
- border-radius: 5px;
- animation: popoverFrameEntrance 0.3s backwards cubic-bezier(0.16, 1, 0.3, 1);
- box-shadow: var(--shadow-properties) var(--shadow-color);
-}
-
-.popover-frame::before {
- content: '';
- position: absolute;
- width: var(--triangle-size);
- height: var(--triangle-size);
- transform: rotate(45deg);
- background-color: var(--color-popover-background);
- border-top-left-radius: 2px;
- border-left: 1px solid var(--color-popover-border);
- border-top: 1px solid var(--color-popover-border);
- left: calc(var(--triangle-offset) - (var(--triangle-size) / 2));
- top: calc(var(--triangle-size) / 2 * -1 - 1px);
-}
-
-.popover-container.position-above .popover-frame::before {
- transform: rotate(-135deg);
- top: auto;
- bottom: calc(var(--triangle-size) / 2 * -1 - 1px);
-}
-
-.popover-container.position-above .popover-frame {
- --shadow-properties: 0 10px 20px -10px;
-}
-
-@keyframes popoverFrameEntrance {
- from {
- opacity: 0;
- transform: translateY(var(--entrance-direction));
- }
-}
-
-.summary {
- width: 100%;
- cursor: pointer;
- word-spacing: -0.18em;
- user-select: none;
- list-style: none;
- position: relative;
- display: flex;
- z-index: 1;
-}
-
-.details[open] .summary {
- margin-bottom: .8rem;
-}
-
-.summary::before {
- content: "";
- position: absolute;
- inset: -.3rem -.8rem;
- border-radius: var(--border-radius);
- background-color: var(--color-widget-background-highlight);
- opacity: 0;
- transition: opacity 0.2s;
- z-index: -1;
-}
-
-.details[open] .summary::before, .summary:hover::before {
- opacity: 1;
-}
-
-.details:not([open]) .list-with-transition {
- display: none;
-}
-
-.summary::after {
- content: "◀";
- font-size: 1.2em;
- position: absolute;
- top: 0;
- bottom: 0;
- line-height: 1.3em;
- right: 0;
- transition: rotate .5s cubic-bezier(0.22, 1, 0.36, 1);
-}
-
-details[open] .summary::after {
- rotate: -90deg;
-}
-
-.content-bounds {
- max-width: 1600px;
- width: 100%;
- margin-inline: auto;
- padding: 0 var(--content-bounds-padding);
-}
-
-.page-width-wide .content-bounds {
- max-width: 1920px;
-}
-
-.page-width-slim .content-bounds {
- max-width: 1100px;
-}
-
-.page-center-vertically .page {
- display: flex;
- justify-content: center;
- flex-direction: column;
-}
-
-/* TODO: refactor, otherwise I hope I never have to change dynamic columns again */
-.dynamic-columns {
- --list-half-gap: 0.5rem;
- gap: var(--widget-content-vertical-padding) var(--widget-content-horizontal-padding);
- display: grid;
- grid-template-columns: repeat(var(--columns-per-row), 1fr);
-}
-
-.dynamic-columns > * {
- padding-left: var(--widget-content-horizontal-padding);
- border-left: 1px solid var(--color-separator);
- min-width: 0;
-}
-
-.dynamic-columns > *:first-child {
- padding-top: 0;
- border-top: none;
- border-left: none;
-}
-
-.dynamic-columns:has(> :nth-child(1)) { --columns-per-row: 1; }
-.dynamic-columns:has(> :nth-child(2)) { --columns-per-row: 2; }
-.dynamic-columns:has(> :nth-child(3)) { --columns-per-row: 3; }
-.dynamic-columns:has(> :nth-child(4)) { --columns-per-row: 4; }
-.dynamic-columns:has(> :nth-child(5)) { --columns-per-row: 5; }
-
-@container widget (max-width: 599px) {
- .dynamic-columns { gap: 0; }
- .dynamic-columns:has(> :nth-child(1)) { --columns-per-row: 1; }
- .dynamic-columns > * {
- border-left: none;
- padding-left: 0;
- }
- .dynamic-columns > *:not(:first-child) {
- margin-top: calc(var(--list-half-gap) * 2);
- }
- .dynamic-columns.list-with-separator > *:not(:first-child) {
- margin-top: var(--list-half-gap);
- border-top: 1px solid var(--color-separator);
- padding-top: var(--list-half-gap);
- }
-}
-@container widget (min-width: 600px) and (max-width: 849px) {
- .dynamic-columns:has(> :nth-child(2)) { --columns-per-row: 2; }
- .dynamic-columns > :nth-child(2n-1) {
- border-left: none;
- padding-left: 0;
- }
-}
-@container widget (min-width: 850px) and (max-width: 1249px) {
- .dynamic-columns:has(> :nth-child(3)) { --columns-per-row: 3; }
- .dynamic-columns > :nth-child(3n+1) {
- border-left: none;
- padding-left: 0;
- }
-}
-@container widget (min-width: 1250px) and (max-width: 1499px) {
- .dynamic-columns:has(> :nth-child(4)) { --columns-per-row: 4; }
- .dynamic-columns > :nth-child(4n+1) {
- border-left: none;
- padding-left: 0;
- }
-}
-@container widget (min-width: 1500px) {
- .dynamic-columns:has(> :nth-child(5)) { --columns-per-row: 5; }
- .dynamic-columns > :nth-child(5n+1) {
- border-left: none;
- padding-left: 0;
- }
-}
-
-.cards-vertical {
- flex-direction: column;
-}
-
-.cards-horizontal {
- --cards-per-row: 6.5;
-}
-
-.cards-horizontal, .cards-vertical {
- --cards-gap: calc(var(--widget-content-vertical-padding) * 0.7);
- display: flex;
- gap: var(--cards-gap);
-}
-
-.card {
- display: flex;
- flex-direction: column;
-}
-
-.cards-horizontal .card {
- flex-shrink: 0;
- width: calc(100% / var(--cards-per-row) - var(--cards-gap) * (var(--cards-per-row) - 1) / var(--cards-per-row));
-}
-
-.cards-grid .card {
- min-width: 0;
-}
-
-.cards-horizontal {
- overflow-x: auto;
- scrollbar-width: thin;
- padding-bottom: 1rem;
-}
-
-.cards-grid {
- --cards-per-row: 6;
- display: grid;
- grid-template-columns: repeat(var(--cards-per-row), 1fr);
- gap: calc(var(--widget-content-vertical-padding) * 0.7);
-}
-
-@container widget (max-width: 1300px) { .cards-horizontal { --cards-per-row: 5.5; } }
-@container widget (max-width: 1100px) { .cards-horizontal { --cards-per-row: 4.5; } }
-@container widget (max-width: 850px) { .cards-horizontal { --cards-per-row: 3.5; } }
-@container widget (max-width: 750px) { .cards-horizontal { --cards-per-row: 3.5; } }
-@container widget (max-width: 650px) { .cards-horizontal { --cards-per-row: 2.5; } }
-@container widget (max-width: 450px) { .cards-horizontal { --cards-per-row: 2.3; } }
-
-@container widget (max-width: 1300px) { .cards-grid { --cards-per-row: 5; } }
-@container widget (max-width: 1100px) { .cards-grid { --cards-per-row: 4; } }
-@container widget (max-width: 850px) { .cards-grid { --cards-per-row: 3; } }
-@container widget (max-width: 750px) { .cards-grid { --cards-per-row: 3; } }
-@container widget (max-width: 650px) { .cards-grid { --cards-per-row: 2; } }
-
-.widget-small-content-bounds {
- max-width: 350px;
- margin: 0 auto;
-}
-
-.widget-error-header {
- display: flex;
- align-items: center;
- justify-content: space-between;
- position: relative;
- margin-bottom: 1.8rem;
- z-index: 1;
-}
-
-.widget-error-header::before {
- content: '';
- position: absolute;
- inset: calc(0rem - (var(--widget-content-vertical-padding) / 2)) calc(0rem - (var(--widget-content-horizontal-padding) / 2));
- background: var(--color-negative);
- opacity: 0.05;
- border-radius: var(--border-radius);
- z-index: -1;
-}
-
-.widget-error-icon {
- width: 2.4rem;
- height: 2.4rem;
- flex-shrink: 0;
- stroke: var(--color-negative);
- opacity: 0.6;
-}
-
-.widget-content {
- container-type: inline-size;
- container-name: widget;
-}
-
-.widget-content:not(.widget-content-frameless) {
- padding: var(--widget-content-padding);
-}
-
-.widget-content:not(.widget-content-frameless), .widget-content-frame {
- background: var(--color-widget-background);
- border-radius: var(--border-radius);
- border: 1px solid var(--color-widget-content-border);
- box-shadow: 0px 3px 0px 0px hsl(var(--bghs), calc(var(--scheme) (var(--scheme) var(--bgl)) - 0.5%));
-}
-
-.padding-widget {
- padding: var(--widget-content-padding);
-}
-
-.margin-bottom-widget {
- margin-bottom: var(--widget-content-vertical-padding);
-}
-
-.padding-block-widget {
- padding-block: var(--widget-content-vertical-padding);
-}
-
-.padding-inline-widget {
- padding-inline: var(--widget-content-horizontal-padding);
-}
-
-.widget-header {
- padding: 0 calc(var(--widget-content-horizontal-padding) + 1px);
- font-size: var(--font-size-h4);
- margin-bottom: 0.9rem;
- display: flex;
- align-items: center;
- gap: 1rem;
-}
-
-.widget + .widget {
- margin-top: var(--widget-gap);
-}
-
-.list-horizontal-text {
- display: flex;
- list-style: none;
- flex-wrap: wrap;
- align-items: center;
-}
-
-.list-horizontal-text > *:not(:last-child)::after {
- content: '•';
- color: var(--color-text-subdue);
- margin: 0 0.5rem;
- position: relative;
- top: 0.1rem;
-}
-
-.header-container {
- margin-top: calc(var(--widget-gap) / 2);
- --header-height: 45px;
- --header-items-gap: 2.5rem;
-}
-
-.header {
- display: flex;
- height: var(--header-height);
- gap: var(--header-items-gap);
-}
-
-.logo {
- height: 100%;
- line-height: var(--header-height);
- font-size: 2rem;
- color: var(--color-text-highlight);
- border-right: 1px solid var(--color-widget-content-border);
- padding-right: var(--widget-content-horizontal-padding);
-}
-
-.logo:has(img) {
- display: flex;
- align-items: center;
-}
-
-.logo img {
- max-height: 2.7rem;
-}
-
-.nav {
- height: 100%;
- gap: var(--header-items-gap);
-}
-
-.nav .nav-item {
- line-height: var(--header-height);
-}
-
-.footer {
- padding-bottom: calc(var(--widget-gap) * 1.5);
- padding-top: calc(var(--widget-gap) / 2);
- animation: loadingContainerEntrance 200ms backwards;
- animation-delay: 150ms;
-}
-
-.mobile-navigation, .mobile-reachability-header {
- display: none;
-}
-
-.nav-item {
- display: block;
- height: 100%;
- border-bottom: 2px solid transparent;
- transition: color .3s, border-color .3s;
- font-size: var(--font-size-h3);
- flex-shrink: 0;
-}
-
-.nav-item:not(.nav-item-current):hover {
- border-bottom-color: var(--color-text-subdue);
- color: var(--color-text-highlight);
-}
-
-.nav-item.nav-item-current {
- border-bottom-color: var(--color-primary);
- color: var(--color-text-highlight);
-}
-
-.release-source-icon {
- width: 16px;
- height: 16px;
- flex-shrink: 0;
- opacity: 0.4;
-}
-
-.market-chart {
- margin-left: auto;
- width: 6.5rem;
- flex-shrink: 0;
-}
-
-.market-chart svg {
- width: 100%;
-}
-
-.market-values {
- min-width: 8rem;
-}
-
-.carousel-container {
- position: relative;
-}
-
-.carousel-container::before, .carousel-container::after {
- content: '';
- position: absolute;
- width: 2rem;
- top: 0;
- bottom: 1rem;
- z-index: 10;
- opacity: 0;
- pointer-events: none;
- transition-duration: 0.2s;
-}
-
-.carousel-container::before {
- left: 0;
- background: linear-gradient(to right, var(--color-background), transparent);
-}
-
-.carousel-container::after {
- right: 0;
- background: linear-gradient(to left, var(--color-background), transparent);
-}
-
-.carousel-container.show-left-cutoff::before, .carousel-container.show-right-cutoff::after {
- opacity: 1;
-}
-
-.video-thumbnail {
- width: 100%;
- aspect-ratio: 16 / 8.9;
- object-fit: cover;
- border-radius: var(--border-radius) var(--border-radius) 0 0;
-}
-
-.search-icon {
- width: 2.3rem;
-}
-
-.search-icon-container {
- position: relative;
- flex-shrink: 0;
-}
-
-/* gives a wider hit area for the 3 people that will notice the animation : ) */
-.search-icon-container::before {
- content: '';
- position: absolute;
- inset: -1rem;
-}
-
-.search-icon-container:hover > .search-icon {
- animation: searchIconHover 2.9s forwards;
-}
-
-@keyframes searchIconHover {
- 0%, 39% { translate: 0 0; }
- 20% { scale: 1.3; }
- 40% { scale: 1; }
- 50% { translate: -30% 30%; }
- 70% { translate: 30% -30%; }
- 90% { translate: -30% -30%; }
- 100% { translate: 0 0; }
-}
-
-.search {
- transition: border-color .2s;
- position: relative;
-}
-
-.search:hover {
- border-color: var(--color-text-subdue);
-}
-
-.search:focus-within {
- border-color: var(--color-primary);
-}
-
-.search-input {
- border: 0;
- background: none;
- width: 100%;
- height: 6rem;
- font: inherit;
- outline: none;
- color: var(--color-text-highlight);
-}
-
-.search-input::placeholder {
- color: var(--color-text-base-muted);
- opacity: 1;
-}
-
-.search-bangs { display: none; }
-
-.search-bang {
- border-radius: calc(var(--border-radius) * 2);
- background: var(--color-widget-background-highlight);
- padding: 0.3rem 1rem;
- flex-shrink: 0;
- font-size: var(--font-size-h5);
- animation: searchBangsEntrance .3s cubic-bezier(0.25, 1, 0.5, 1) backwards;
-}
-
-@keyframes searchBangsEntrance {
- 0% {
- opacity: 0;
- transform: translateX(-10px);
- }
-}
-
-.search-bang:empty {
- display: none;
-}
-
-.forum-post-list-item {
- display: flex;
- gap: 1.2rem;
-}
-
-.forum-post-list-thumbnail {
- flex-shrink: 0;
- width: 6rem;
- height: 4.1rem;
- border-radius: var(--border-radius);
- object-fit: cover;
- border: 1px solid var(--color-separator);
- margin-top: 0.1rem;
-}
-
-.forum-post-tags-container {
- transform: translateY(-0.15rem);
-}
-
-.bookmarks-group {
- --bookmarks-group-color: var(--color-primary);
-}
-
-.bookmarks-group-title {
- color: var(--bookmarks-group-color);
-}
-
-.bookmarks-group .bookmarks-link::after {
- color: var(--bookmarks-group-color);
-}
-
-.bookmarks-icon-container {
- margin-block: 0.1rem;
- background-color: var(--color-widget-background-highlight);
- border-radius: var(--border-radius);
- padding: 0.5rem;
- opacity: 0.7;
- flex-shrink: 0;
-}
-
-.bookmarks-icon {
- width: 20px;
- height: 20px;
- opacity: 0.8;
-}
-
-:root:not(.light-scheme) .flat-icon {
- filter: invert(1);
-}
-
-.calendar-day {
- width: calc(100% / 7);
- text-align: center;
- padding: 0.6rem 0;
-}
-
-
-.calendar-day-today {
- border-radius: var(--border-radius);
- background-color: hsl(var(--bghs), calc(var(--scheme) (var(--scheme) (var(--bgl)) + 6%)));
- color: var(--color-text-highlight);
-}
-
-.dns-stats-totals {
- transition: opacity .3s;
- transition-delay: 50ms;
-}
-
-.dns-stats:has(.dns-stats-graph .popover-active) .dns-stats-totals {
- opacity: 0.1;
- transition-delay: 0s;
-}
-
-.dns-stats-graph {
- --graph-height: 70px;
- height: var(--graph-height);
- position: relative;
- margin-bottom: 2.5rem;
-}
-
-.dns-stats-graph-gridlines-container {
- position: absolute;
- inset: 0;
-}
-
-.dns-stats-graph-gridlines {
- height: 100%;
- width: 100%;
-}
-
-.dns-stats-graph-columns {
- display: flex;
- height: 100%;
-}
-
-.dns-stats-graph-column {
- display: flex;
- justify-content: flex-end;
- align-items: center;
- flex-direction: column;
- width: calc(100% / 8);
- position: relative;
-}
-
-.dns-stats-graph-column::before {
- content: '';
- position: absolute;
- inset: 1px 0;
- opacity: 0;
- background: var(--color-text-base);
- transition: opacity .2s;
-}
-
-.dns-stats-graph-column:hover::before {
- opacity: 0.05;
-}
-
-.dns-stats-graph-bar {
- width: 14px;
- height: calc((var(--bar-height) / 100) * var(--graph-height));
- border: 1px solid var(--color-progress-border);
- border-radius: var(--border-radius) var(--border-radius) 0 0;
- display: flex;
- background: var(--color-widget-background);
- padding: 2px 2px 0 2px;
- flex-direction: column;
- gap: 2px;
- transition: border-color .2s;
- min-height: 10px;
-}
-
-.dns-stats-graph-column.popover-active .dns-stats-graph-bar {
- border-color: var(--color-text-subdue);
- border-bottom-color: var(--color-progress-border);
-}
-
-.dns-stats-graph-bar > * {
- border-radius: 2px;
- background: var(--color-progress-value);
- min-height: 1px;
-}
-
-.dns-stats-graph-bar > .queries {
- flex-grow: 1;
-}
-
-.dns-stats-graph-bar > *:last-child {
- border-bottom-right-radius: 0;
- border-bottom-left-radius: 0;
-}
-
-.dns-stats-graph-bar > .blocked {
- background-color: var(--color-negative);
-}
-
-.dns-stats-graph-column:nth-child(even) .dns-stats-graph-time {
- opacity: 1;
- transform: translateY(0);
-}
-
-.dns-stats-graph-time, .dns-stats-graph-columns:hover .dns-stats-graph-time {
- position: absolute;
- font-size: var(--font-size-h6);
- inset-inline: 0;
- text-align: center;
- height: 2.5rem;
- line-height: 2.5rem;
- top: 100%;
- user-select: none;
- opacity: 0;
- transform: translateY(-0.5rem);
- transition: opacity .2s, transform .2s;
-}
-
-.dns-stats-graph-column:hover .dns-stats-graph-time {
- opacity: 1;
- transform: translateY(0);
-}
-
-.dns-stats-graph-columns:hover .dns-stats-graph-column:not(:hover) .dns-stats-graph-time {
- opacity: 0;
-}
-
-.weather-column {
- position: relative;
- display: flex;
- align-items: center;
- justify-content: end;
- flex-direction: column;
- width: calc(100% / 12);
- padding-top: 3px;
-}
-
-.weather-column-value, .weather-columns:hover .weather-column-value {
- font-size: 13px;
- color: var(--color-text-highlight);
- letter-spacing: -0.1rem;
- margin-right: 0.1rem;
- position: relative;
- margin-bottom: 0.3rem;
- opacity: 0;
- transform: translateY(0.5rem);
- transition: opacity .2s, transform .2s;
- user-select: none;
-}
-
-.weather-column-current .weather-column-value, .weather-column:hover .weather-column-value {
- opacity: 1;
- transform: translateY(0);
-}
-
-.weather-column-value::after {
- position: absolute;
- content: '°';
- left: 100%;
- color: var(--color-text-subdue);
-}
-
-.weather-column-value.weather-column-value-negative::before {
- position: absolute;
- content: '-';
- right: 100%;
-}
-
-.weather-bar, .weather-columns:hover .weather-bar {
- height: calc(20px + var(--weather-bar-height) * 40px);
- width: 6px;
- background-color: hsl(var(--ths), calc(var(--scheme) ((var(--scheme) var(--bgl)) + 18%)));
- border: 1px solid hsl(var(--ths), calc(var(--scheme) ((var(--scheme) var(--bgl)) + 24%)));
- border-bottom: 0;
- border-radius: 6px 6px 0 0;
- mask-image: linear-gradient(0deg, transparent 0, #000 10px);
- -webkit-mask-image: linear-gradient(0deg, transparent 0, #000 10px);
- transition: background-color .2s, border-color .2s, width .2s;
-}
-
-.weather-column-current .weather-bar, .weather-column:hover .weather-bar {
- width: 10px;
- background-color: hsl(var(--ths), calc(var(--scheme) ((var(--scheme) var(--bgl)) + 40%)));
- border: 1px solid hsl(var(--ths), calc(var(--scheme) ((var(--scheme) var(--bgl)) + 50%)));
-}
-
-.weather-column-rain {
- position: absolute;
- inset: 0;
- bottom: 20%;
- overflow: hidden;
- mask-image: linear-gradient(0deg, transparent 40%, #000);
- -webkit-mask-image: linear-gradient(0deg, transparent 40%, #000);
-}
-
-.weather-column-rain::before {
- content: '';
- position: absolute;
- /* TODO: figure out a way to make it look continuous between columns, right now
- depending on the width of the page the rain inside two columns next to each other
- can overlap and look bad */
- background: radial-gradient(circle at 4px 4px, hsl(200, 90%, 70%, 0.4) 1px, transparent 0);
- background-size: 8px 8px;
- transform: rotate(45deg) translate(-50%, 25%);
- height: 130%;
- aspect-ratio: 1;
- left: 55%;
-}
-
-.weather-column:nth-child(3) .weather-column-time,
-.weather-column:nth-child(7) .weather-column-time,
-.weather-column:nth-child(11) .weather-column-time {
- opacity: 1;
- transform: translateY(0);
-}
-
-.weather-column-time, .weather-columns:hover .weather-column-time {
- margin-top: 0.3rem;
- font-size: var(--font-size-h6);
- opacity: 0;
- transform: translateY(-0.5rem);
- transition: opacity .2s, transform .2s;
- user-select: none;
-}
-
-.weather-column:hover .weather-column-time {
- opacity: 1;
- transform: translateY(0);
-}
-
-.weather-column-daylight {
- position: absolute;
- inset: 0;
- background: linear-gradient(0deg, transparent 30px, hsl(50, 50%, 30%, 0.2));
-}
-
-.weather-column-daylight-sunrise {
- border-radius: 20px 0 0 0;
-}
-
-.weather-column-daylight-sunset {
- border-radius: 0 20px 0 0;
-}
-
-.location-icon {
- width: 0.8em;
- height: 0.8em;
- border-radius: 0 50% 50% 50%;
- background-color: currentColor;
- transform: rotate(225deg) translate(.1em, .1em);
- position: relative;
- flex-shrink: 0;
-}
-
-.location-icon::after {
- content: '';
- position: absolute;
- z-index: 2;
- width: .4em;
- height: .4em;
- border-radius: 50%;
- background-color: var(--color-widget-background);
- top: 50%;
- left: 50%;
- transform: translate(-50%, -50%);
-}
-
-.clock-time {
- min-width: 8ch;
-}
-
-.clock-time span {
- color: var(--color-text-highlight);
-}
-
-.monitor-site-icon {
- display: block;
- opacity: 0.8;
- filter: grayscale(0.4);
- object-fit: contain;
- aspect-ratio: 1 / 1;
- width: 3.2rem;
- position: relative;
- top: -0.1rem;
- transition: filter 0.3s, opacity 0.3s;
-}
-
-.monitor-site-icon.flat-icon {
- opacity: 0.7;
-}
-
-.monitor-site:hover .monitor-site-icon {
- opacity: 1;
-}
-
-.monitor-site:hover .monitor-site-icon:not(.flat-icon) {
- filter: grayscale(0);
-}
-
-.monitor-site-status-icon {
- flex-shrink: 0;
- margin-left: auto;
- width: 2rem;
- height: 2rem;
-}
-
-.monitor-site-status-icon-compact {
- width: 1.8rem;
- height: 1.8rem;
- flex-shrink: 0;
-}
-
-.docker-container-icon {
- display: block;
- filter: grayscale(0.4);
- object-fit: contain;
- aspect-ratio: 1 / 1;
- width: 2.7rem;
- opacity: 0.8;
- transition: filter 0.3s, opacity 0.3s;
-}
-
-.docker-container-icon.flat-icon {
- opacity: 0.7;
-}
-
-.docker-container:hover .docker-container-icon {
- opacity: 1;
-}
-
-.docker-container:hover .docker-container-icon:not(.flat-icon) {
- filter: grayscale(0);
-}
-
-.docker-container-status-icon {
- width: 2rem;
- height: 2rem;
-}
-
-.thumbnail {
- filter: grayscale(0.2) contrast(0.9);
- opacity: 0.8;
- transition: filter 0.2s, opacity .2s;
-}
-
-.thumbnail-container {
- flex-shrink: 0;
- border: 1px solid var(--color-separator);
- border-radius: var(--border-radius);
-}
-
-.thumbnail-container > * {
- border-radius: var(--border-radius);
- object-fit: cover;
-}
-
-.thumbnail-parent:hover .thumbnail {
- opacity: 1;
- filter: none;
-}
-
-.rss-card-image {
- height: var(--rss-thumbnail-height, 10rem);
- object-fit: cover;
- border-radius: var(--border-radius) var(--border-radius) 0 0;
-}
-
-.rss-card-2 {
- position: relative;
- height: var(--rss-card-height, 27rem);
- overflow: hidden;
-}
-
-.rss-card-2::before {
- content: '';
- position: absolute;
- inset: 0;
- pointer-events: none;
- background-image: linear-gradient(
- 0deg,
- var(--color-widget-background),
- hsla(var(--color-widget-background-hsl-values), 0.8) 6rem, transparent 14rem
- );
- z-index: 2;
-}
-
-.rss-card-2-image {
- position: absolute;
- width: 100%;
- height: 100%;
- object-fit: cover;
- /* +1px is required to fix some weird graphical bug where the image overflows on the bottom in firefox */
- border-radius: calc(var(--border-radius) + 1px);
- opacity: 0.9;
- z-index: 1;
-}
-
-.rss-card-2-content {
- position: absolute;
- inset-inline: 0;
- bottom: var(--widget-content-vertical-padding);
- z-index: 3;
-}
-
-.rss-detailed-description {
- max-width: 55rem;
- color: var(--color-text-base-muted);
-}
-
-.rss-detailed-thumbnail {
- margin-top: 0.3rem;
-}
-
-.rss-detailed-thumbnail > * {
- aspect-ratio: 3 / 2;
- height: 8.7rem;
-}
-
-.twitch-category-thumbnail {
- width: 5rem;
- aspect-ratio: 3 / 4;
- border-radius: var(--border-radius);
-}
-
-.twitch-channel-avatar {
- aspect-ratio: 1;
- border-radius: 50%;
-}
-
-.twitch-channel-avatar-container {
- width: 4.4rem;
- height: 4.4rem;
- border: 2px solid var(--color-text-subdue);
- padding: 2px;
- border-radius: 50%;
- position: relative;
- flex-shrink: 0;
-}
-
-.twitch-channel-live .twitch-channel-avatar-container {
- border: 2px solid var(--color-positive);
- margin-bottom: 1rem;
-}
-
-.twitch-channel-live .twitch-channel-avatar-container::after {
- content: 'LIVE';
- position: absolute;
- background: var(--color-positive);
- color: var(--color-widget-background);
- font-size: var(--font-size-h6);
- left: 50%;
- bottom: -35%;
- border-radius: var(--border-radius);
- padding-inline: 0.3rem;
- transform: translate(-50%);
- border: 2px solid var(--color-widget-background);
-}
-
-.twitch-stream-preview {
- max-width: 100%;
- width: 400px;
- aspect-ratio: 16 / 9;
- border-radius: var(--border-radius);
- object-fit: cover;
-}
-
-.reddit-card-thumbnail {
- width: 100%;
- height: 100%;
- object-fit: cover;
- object-position: 0% 20%;
- opacity: 0.15;
- filter: blur(1px);
-}
-
-.reddit-card-thumbnail-container {
- position: absolute;
- inset: 0;
- overflow: hidden;
- border-radius: var(--border-radius);
-}
-
-.reddit-card-thumbnail-container::after {
- content: '';
- position: absolute;
- inset: 0;
- background: linear-gradient(0deg, var(--color-widget-background) 10%, transparent);
-}
-
-@media (max-width: 1190px) {
- .header-container {
- display: none;
- }
-
- .page-column-small .size-title-dynamic {
- font-size: var(--font-size-h3);
- }
-
- .page-column-small {
- width: 100%;
- flex-shrink: 1;
- }
-
- .page-column {
- display: none;
- animation: columnEntrance .0s cubic-bezier(0.25, 1, 0.5, 1) backwards;
- }
-
- .page-columns-transitioned .page-column {
- animation-duration: .3s;
- }
-
- @keyframes columnEntrance {
- from {
- opacity: 0;
- transform: scaleX(0.95);
- }
- }
-
- .mobile-navigation-offset {
- height: var(--mobile-navigation-height);
- flex-shrink: 0;
- }
-
- .mobile-navigation {
- display: block;
- position: fixed;
- bottom: 0;
- transform: translateY(calc(100% - var(--mobile-navigation-height)));
- left: var(--content-bounds-padding);
- right: var(--content-bounds-padding);
- z-index: 10;
- background-color: var(--color-widget-background);
- border: 1px solid var(--color-widget-content-border);
- border-bottom: 0;
- border-radius: var(--border-radius) var(--border-radius) 0 0;
- transition: transform .3s;
- }
-
- .mobile-navigation:has(.mobile-navigation-page-links-input:checked) .hamburger-icon {
- --spacing: 7px;
- color: var(--color-primary);
- height: 2px;
- }
-
- .mobile-navigation:has(.mobile-navigation-page-links-input:checked) {
- transform: translateY(0);
- }
-
- .mobile-navigation-page-links {
- border-top: 1px solid var(--color-widget-content-border);
- padding: 15px var(--content-bounds-padding);
- display: flex;
- align-items: center;
- scrollbar-width: thin;
- gap: 2.5rem;
- }
-
- .mobile-navigation-icons {
- display: flex;
- justify-content: space-around;
- align-items: center;
- }
-
- body:has(.mobile-navigation-input[value="0"]:checked) .page-columns > :nth-child(1),
- body:has(.mobile-navigation-input[value="1"]:checked) .page-columns > :nth-child(2),
- body:has(.mobile-navigation-input[value="2"]:checked) .page-columns > :nth-child(3) {
- display: block;
- }
-
- .mobile-navigation-label {
- display: flex;
- flex: 1;
- max-width: 50px;
- height: var(--mobile-navigation-height);
- justify-content: center;
- align-items: center;
- cursor: pointer;
- font-size: 15px;
- line-height: var(--mobile-navigation-height);
- }
-
- .mobile-navigation-pill {
- display: block;
- background: var(--color-text-base);
- height: 10px;
- width: 10px;
- border-radius: 10px;
- transition: width .3s, background-color .3s;
- }
-
- .mobile-navigation-label:hover > .mobile-navigation-pill {
- background-color: var(--color-text-highlight);
- }
-
- .mobile-navigation-label:hover {
- color: var(--color-text-highlight);
- }
-
- .mobile-navigation-input:checked + .mobile-navigation-pill {
- background: var(--color-primary);
- width: 30px;
- }
-
- .mobile-navigation-input, .mobile-navigation-page-links-input {
- display: none;
- }
-
- .hamburger-icon {
- --spacing: 4px;
- width: 1em;
- height: 1px;
- background-color: currentColor;
- transition: color .3s, box-shadow .3s;
- box-shadow: 0 calc(var(--spacing) * -1) 0 0 currentColor, 0 var(--spacing) 0 0 currentColor;
- }
-
- .expand-toggle-button.container-expanded {
- bottom: var(--mobile-navigation-height);
- }
-
- .cards-grid + .expand-toggle-button.container-expanded {
- /* hides content that peeks through the rounded borders of the mobile navigation */
- box-shadow: 0 var(--border-radius) 0 0 var(--color-background);
- }
-
- .weather-column-rain::before {
- background-size: 7px 7px;
- }
-
- .ios .search-input {
- /* so that iOS Safari does not zoom the page when the input is focused */
- font-size: 16px;
- }
-}
-
-@media (max-width: 1190px) and (display-mode: standalone) {
- :root {
- --safe-area-inset-bottom: env(safe-area-inset-bottom, 0);
- }
-
- .ios .body-content {
- height: 100dvh;
- }
-
- .expand-toggle-button.container-expanded {
- bottom: calc(var(--mobile-navigation-height) + var(--safe-area-inset-bottom));
- }
-
- .mobile-navigation {
- transform: translateY(calc(100% - var(--mobile-navigation-height) - var(--safe-area-inset-bottom)));
- padding-bottom: var(--safe-area-inset-bottom);
- }
-
- .mobile-navigation-icons {
- padding-bottom: var(--safe-area-inset-bottom);
- transition: padding-bottom .3s;
- }
-
- .mobile-navigation-offset {
- height: calc(var(--mobile-navigation-height) + var(--safe-area-inset-bottom));
- }
-
- .mobile-navigation-icons:has(.mobile-navigation-page-links-input:checked) {
- padding-bottom: 0;
- }
-}
-
-@media (display-mode: standalone) {
- body {
- padding-top: env(safe-area-inset-top, 0);
- }
-}
-
-@media (max-width: 550px) {
- :root {
- font-size: 9px;
- --widget-gap: 15px;
- --widget-content-vertical-padding: 10px;
- --widget-content-horizontal-padding: 10px;
- --content-bounds-padding: 10px;
- }
-
- .dynamic-columns:has(> :nth-child(1)) { --columns-per-row: 1; }
-
- .row-reverse-on-mobile {
- flex-direction: row-reverse;
- }
-
- .hide-on-mobile, .thumbnail-container:has(> .hide-on-mobile) {
- display: none
- }
-
- .mobile-reachability-header {
- display: block;
- font-size: 3rem;
- padding: 10vh 1rem;
- text-align: center;
- color: var(--color-text-highlight);
- animation: pageColumnsEntrance .3s cubic-bezier(0.25, 1, 0.5, 1) backwards;
- }
-
- .rss-detailed-thumbnail > * {
- height: 6rem;
- }
-
- .rss-detailed-description {
- line-clamp: 3;
- -webkit-line-clamp: 3;
- }
-}
-
-.size-h1 { font-size: var(--font-size-h1); }
-.size-h2 { font-size: var(--font-size-h2); }
-.size-h3 { font-size: var(--font-size-h3); }
-.size-h4 { font-size: var(--font-size-h4); }
-.size-base { font-size: var(--font-size-base); }
-.size-h5 { font-size: var(--font-size-h5); }
-.size-h6 { font-size: var(--font-size-h6); }
-
-.color-highlight { color: var(--color-text-highlight); }
-.color-base { color: var(--color-text-base); }
-.color-subdue { color: var(--color-text-subdue); }
-.color-negative { color: var(--color-negative); }
-.color-positive { color: var(--color-positive); }
-.color-primary { color: var(--color-primary); }
-
-.cursor-help { cursor: help; }
-.break-all { word-break: break-all; }
-.text-left { text-align: left; }
-.text-right { text-align: right; }
-.text-center { text-align: center; }
-.text-elevate { margin-top: -0.2em; }
-.text-compact { word-spacing: -0.18em; }
-.rtl { direction: rtl; }
-.shrink { flex-shrink: 1; }
-.shrink-0 { flex-shrink: 0; }
-.min-width-0 { min-width: 0; }
-.max-width-100 { max-width: 100%; }
-.block { display: block; }
-.inline-block { display: inline-block; }
-.overflow-hidden { overflow: hidden; }
-.relative { position: relative; }
-.flex { display: flex; }
-.flex-wrap { flex-wrap: wrap; }
-.flex-nowrap { flex-wrap: nowrap; }
-.justify-between { justify-content: space-between; }
-.justify-stretch { justify-content: stretch; }
-.justify-evenly { justify-content: space-evenly; }
-.justify-center { justify-content: center; }
-.justify-end { justify-content: end; }
-.uppercase { text-transform: uppercase; }
-.grow { flex-grow: 1; }
-.flex-column { flex-direction: column; }
-.items-center { align-items: center; }
-.items-start { align-items: start; }
-.gap-5 { gap: 0.5rem; }
-.gap-7 { gap: 0.7rem; }
-.gap-10 { gap: 1rem; }
-.gap-12 { gap: 1.2rem; }
-.gap-15 { gap: 1.5rem; }
-.gap-20 { gap: 2rem; }
-.gap-25 { gap: 2.5rem; }
-.gap-35 { gap: 3.5rem; }
-.gap-45 { gap: 4.5rem; }
-.gap-55 { gap: 5.5rem; }
-.margin-left-auto { margin-left: auto; }
-.margin-top-3 { margin-top: 0.3rem; }
-.margin-top-5 { margin-top: 0.5rem; }
-.margin-top-7 { margin-top: 0.7rem; }
-.margin-top-10 { margin-top: 1rem; }
-.margin-top-15 { margin-top: 1.5rem; }
-.margin-top-20 { margin-top: 2rem; }
-.margin-top-25 { margin-top: 2.5rem; }
-.margin-top-35 { margin-top: 3.5rem; }
-.margin-top-40 { margin-top: 4rem; }
-.margin-top-auto { margin-top: auto; }
-.margin-block-3 { margin-block: 0.3rem; }
-.margin-block-5 { margin-block: 0.5rem; }
-.margin-block-7 { margin-block: 0.7rem; }
-.margin-block-8 { margin-block: 0.8rem; }
-.margin-block-10 { margin-block: 1rem; }
-.margin-block-15 { margin-block: 1.5rem; }
-.margin-bottom-3 { margin-bottom: 0.3rem; }
-.margin-bottom-5 { margin-bottom: 0.5rem; }
-.margin-bottom-7 { margin-bottom: 0.7rem; }
-.margin-bottom-10 { margin-bottom: 1rem; }
-.margin-bottom-15 { margin-bottom: 1.5rem; }
-.margin-bottom-auto { margin-bottom: auto; }
-.padding-block-5 { padding-block: 0.5rem; }
-.scale-half { transform: scale(0.5); }
-.list { --list-half-gap: 0rem; }
-.list-gap-2 { --list-half-gap: 0.1rem; }
-.list-gap-4 { --list-half-gap: 0.2rem; }
-.list-gap-8 { --list-half-gap: 0.4rem; }
-.list-gap-10 { --list-half-gap: 0.5rem; }
-.list-gap-14 { --list-half-gap: 0.7rem; }
-.list-gap-20 { --list-half-gap: 1rem; }
-.list-gap-24 { --list-half-gap: 1.2rem; }
-.list-gap-34 { --list-half-gap: 1.7rem; }
-
-/*
-### Theme Dropdown ###
-*/
-.theme-dropdown {
- position: relative;
- display: inline-block;
- right: 0;
-}
-
-.dropdown-button {
- padding: 10px 15px;
- background: var(--color-widget-background);
- border: 1px solid var(--color-widget-content-border);
- border-radius: 4px;
- cursor: pointer;
- display: flex;
- align-items: center;
- gap: 8px;
- min-width: 150px;
- transition: border-color .2s;
- color: var(--color-text-highlight);
-}
-
-.dropdown-button:hover {
- border-color: var(--color-text-subdue);
-}
-
-.dropdown-content {
- display: none;
- position: absolute;
- top: 100%;
- left: 0;
- background: var(--color-widget-content-border);
- min-width: 150px;
- box-shadow: 0 2px 5px rgba(0,0,0,0.2);
- border-radius: 4px;
- z-index: 1000;
-}
-
-.mobile-navigation-page-links .dropdown-content {
- top: unset;
- bottom: 38px;
-}
-
-.dropdown-content.show {
- display: block;
-}
-
-.theme-option {
- padding: 10px 15px;
- cursor: pointer;
- transition: background-color 0.2s;
-}
-
-.theme-option:hover {
- background-color: #f8f9fa;
-}
-
-.separator {
- height: 1px;
- background-color: #dee2e6;
- margin: 5px 0;
-}
-
-.arrow {
- border: solid #666;
- border-width: 0 2px 2px 0;
- display: inline-block;
- padding: 3px;
- transform: rotate(45deg);
- transition: transform 0.2s ease;
- margin-left: auto;
- position: relative;
- top: -1px;
-}
-
-.dropdown-button.active .arrow {
- transform: rotate(-135deg);
-}
\ No newline at end of file
diff --git a/internal/glance/static/manifest.json b/internal/glance/static/manifest.json
deleted file mode 100644
index 42e8213..0000000
--- a/internal/glance/static/manifest.json
+++ /dev/null
@@ -1,14 +0,0 @@
-{
- "name": "Glance",
- "display": "standalone",
- "background_color": "#151519",
- "scope": "/",
- "start_url": "/",
- "icons": [
- {
- "src": "app-icon.png",
- "type": "image/png",
- "sizes": "512x512"
- }
- ]
-}
diff --git a/internal/glance/templates.go b/internal/glance/templates.go
index d9b1a6c..8164eb0 100644
--- a/internal/glance/templates.go
+++ b/internal/glance/templates.go
@@ -5,7 +5,7 @@ import (
"html/template"
"math"
"strconv"
- "time"
+ "strings"
"golang.org/x/text/language"
"golang.org/x/text/message"
@@ -14,8 +14,8 @@ import (
var intl = message.NewPrinter(language.English)
var globalTemplateFunctions = template.FuncMap{
- "formatViewerCount": formatViewerCount,
- "formatNumber": intl.Sprint,
+ "formatApproxNumber": formatApproxNumber,
+ "formatNumber": intl.Sprint,
"safeCSS": func(str string) template.CSS {
return template.CSS(str)
},
@@ -28,9 +28,33 @@ var globalTemplateFunctions = template.FuncMap{
"formatPrice": func(price float64) string {
return intl.Sprintf("%.2f", price)
},
- "dynamicRelativeTimeAttrs": func(t time.Time) template.HTMLAttr {
- return template.HTMLAttr(`data-dynamic-relative-time="` + strconv.FormatInt(t.Unix(), 10) + `"`)
+ "formatPriceWithPrecision": func(precision int, price float64) string {
+ return intl.Sprintf("%."+strconv.Itoa(precision)+"f", price)
},
+ "dynamicRelativeTimeAttrs": dynamicRelativeTimeAttrs,
+ "formatServerMegabytes": func(mb uint64) template.HTML {
+ var value string
+ var label string
+
+ if mb < 1_000 {
+ value = strconv.FormatUint(mb, 10)
+ label = "MB"
+ } else if mb < 1_000_000 {
+ if mb < 10_000 {
+ value = fmt.Sprintf("%.1f", float64(mb)/1_000)
+ } else {
+ value = strconv.FormatUint(mb/1_000, 10)
+ }
+
+ label = "GB"
+ } else {
+ value = fmt.Sprintf("%.1f", float64(mb)/1_000_000)
+ label = "TB"
+ }
+
+ return template.HTML(value + ` <span class="color-base size-h5">` + label + `</span>`)
+ },
+ "hasPrefix": strings.HasPrefix,
}
func mustParseTemplate(primary string, dependencies ...string) *template.Template {
@@ -45,18 +69,22 @@ func mustParseTemplate(primary string, dependencies ...string) *template.Templat
return t
}
-func formatViewerCount(count int) string {
+func formatApproxNumber(count int) string {
if count < 1_000 {
return strconv.Itoa(count)
}
if count < 10_000 {
- return fmt.Sprintf("%.1fk", float64(count)/1_000)
+ return strconv.FormatFloat(float64(count)/1_000, 'f', 1, 64) + "k"
}
if count < 1_000_000 {
- return fmt.Sprintf("%dk", count/1_000)
+ return strconv.Itoa(count/1_000) + "k"
}
- return fmt.Sprintf("%.1fm", float64(count)/1_000_000)
+ return strconv.FormatFloat(float64(count)/1_000_000, 'f', 1, 64) + "m"
+}
+
+func dynamicRelativeTimeAttrs(t interface{ Unix() int64 }) template.HTMLAttr {
+ return template.HTMLAttr(`data-dynamic-relative-time="` + strconv.FormatInt(t.Unix(), 10) + `"`)
}
diff --git a/internal/glance/templates/bookmarks.html b/internal/glance/templates/bookmarks.html
index 1e8bfc7..1952cdb 100644
--- a/internal/glance/templates/bookmarks.html
+++ b/internal/glance/templates/bookmarks.html
@@ -2,22 +2,29 @@
{{ define "widget-content" }}
<div class="dynamic-columns list-gap-24 list-with-separator">
- {{ range .Groups }}
+ {{- range .Groups }}
<div class="bookmarks-group"{{ if .Color }} style="--bookmarks-group-color: {{ .Color.String | safeCSS }}"{{ end }}>
- {{ if ne .Title "" }}<div class="bookmarks-group-title size-h3 margin-bottom-3">{{ .Title }}</div>{{ end }}
+ {{- if ne .Title "" }}
+ <div class="bookmarks-group-title size-h3 margin-bottom-3">{{ .Title }}</div>
+ {{- end }}
<ul class="list list-gap-2">
- {{ range .Links }}
- <li class="flex items-center gap-10">
- {{ if ne "" .Icon.URL }}
- <div class="bookmarks-icon-container">
- <img class="bookmarks-icon{{ if .Icon.IsFlatIcon }} flat-icon{{ end }}" src="{{ .Icon.URL }}" alt="" loading="lazy">
+ {{- range .Links }}
+ <li>
+ <div class="flex items-center gap-10">
+ {{- if ne "" .Icon.URL }}
+ <div class="bookmarks-icon-container">
+ <img class="bookmarks-icon{{ if .Icon.IsFlatIcon }} flat-icon{{ end }}" src="{{ .Icon.URL }}" alt="" loading="lazy">
+ </div>
+ {{- end }}
+ <a href="{{ .URL | safeURL }}" class="bookmarks-link {{ if .HideArrow }}bookmarks-link-no-arrow {{ end }}color-highlight size-h4" {{ if .Target }}target="{{ .Target }}"{{ end }} rel="noreferrer">{{ .Title }}</a>
</div>
- {{ end }}
- <a href="{{ .URL | safeURL }}" class="bookmarks-link {{ if .HideArrow }}bookmarks-link-no-arrow {{ end }}color-highlight size-h4" {{ if not .SameTab }}target="_blank"{{ end }} rel="noreferrer">{{ .Title }}</a>
+ {{- if .Description }}
+ <div class="margin-bottom-5">{{ .Description }}</div>
+ {{- end }}
</li>
- {{ end }}
+ {{- end }}
</ul>
</div>
- {{ end }}
+ {{- end }}
</div>
{{ end }}
diff --git a/internal/glance/templates/calendar.html b/internal/glance/templates/calendar.html
index 020d6ac..b3c4a69 100644
--- a/internal/glance/templates/calendar.html
+++ b/internal/glance/templates/calendar.html
@@ -2,33 +2,6 @@
{{ define "widget-content" }}
<div class="widget-small-content-bounds">
- <div class="flex justify-between items-center">
- <div class="color-highlight size-h1">{{ .Calendar.CurrentMonthName }}</div>
- <ul class="list-horizontal-text color-highlight size-h4">
- <li>Week {{ .Calendar.CurrentWeekNumber }}</li>
- <li>{{ .Calendar.CurrentYear }}</li>
- </ul>
- </div>
-
- <div class="flex flex-wrap size-h6 margin-top-10 color-subdue">
- {{ if .StartSunday }}
- <div class="calendar-day">Su</div>
- {{ end }}
- <div class="calendar-day">Mo</div>
- <div class="calendar-day">Tu</div>
- <div class="calendar-day">We</div>
- <div class="calendar-day">Th</div>
- <div class="calendar-day">Fr</div>
- <div class="calendar-day">Sa</div>
- {{ if not .StartSunday }}
- <div class="calendar-day">Su</div>
- {{ end }}
- </div>
-
- <div class="flex flex-wrap">
- {{ range .Calendar.Days }}
- <div class="calendar-day{{ if eq . $.Calendar.CurrentDay }} calendar-day-today{{ end }}">{{ . }}</div>
- {{ end }}
- </div>
+ <div class="calendar" data-first-day-of-week="{{ .FirstDay }}"></div>
</div>
{{ end }}
diff --git a/internal/glance/templates/dns-stats.html b/internal/glance/templates/dns-stats.html
index 7938038..bb4222c 100644
--- a/internal/glance/templates/dns-stats.html
+++ b/internal/glance/templates/dns-stats.html
@@ -18,7 +18,7 @@
</div>
{{ else }}
<div class="cursor-help" data-popover-type="text" data-popover-text="Total number of blocked domains from all adlists" data-popover-max-width="200px" data-popover-text-align="center">
- <div class="color-highlight size-h3">{{ .Stats.DomainsBlocked | formatViewerCount }}</div>
+ <div class="color-highlight size-h3">{{ .Stats.DomainsBlocked | formatApproxNumber }}</div>
<div class="size-h6">DOMAINS</div>
</div>
{{ end }}
@@ -59,8 +59,8 @@
{{ if ne $column.Queries $column.Blocked }}
<div class="queries"></div>
{{ end }}
- {{ if or (gt $column.Blocked 0) (and (lt $column.PercentTotal 15) (lt $column.PercentBlocked 10)) }}
- <div class="blocked" style="flex-basis: {{ $column.PercentBlocked }}%"></div>
+ {{ if gt $column.PercentBlocked 0 }}
+ <div class="blocked" style="--percent: {{ $column.PercentBlocked }}%"></div>
{{ end }}
</div>
{{ end }}
@@ -76,7 +76,7 @@
<summary class="summary">Top blocked domains</summary>
<ul class="list list-gap-4 list-with-transition size-h5">
{{ range .Stats.TopBlockedDomains }}
- <li class="flex justify-between">
+ <li class="flex justify-between gap-10">
<div class="text-truncate rtl">{{ .Domain }}</div>
<div class="text-right" style="width: 4rem;"><span class="color-highlight">{{ .PercentBlocked }}</span>%</div>
</li>
diff --git a/internal/glance/templates/docker-containers.html b/internal/glance/templates/docker-containers.html
index d9ff2d8..afbbb17 100644
--- a/internal/glance/templates/docker-containers.html
+++ b/internal/glance/templates/docker-containers.html
@@ -1,64 +1,66 @@
{{ template "widget-base.html" . }}
-{{ define "widget-content" }}
-<div class="dynamic-columns list-gap-20 list-with-separator">
- {{ range .Containers }}
- <div class="docker-container flex items-center gap-15">
- <div class="shrink-0" data-popover-type="html" data-popover-position="above" data-popover-offset="0.25" data-popover-margin="0.1rem">
+{{- define "widget-content" }}
+<ul class="dynamic-columns list-gap-20 list-with-separator">
+ {{- range .Containers }}
+ <li class="docker-container flex items-center gap-15">
+ <div class="shrink-0" data-popover-type="html" data-popover-position="above" data-popover-offset="0.25" data-popover-margin="0.1rem" data-popover-max-width="400px" aria-hidden="true">
<img class="docker-container-icon{{ if .Icon.IsFlatIcon }} flat-icon{{ end }}" src="{{ .Icon.URL }}" alt="" loading="lazy">
<div data-popover-html>
<div class="color-highlight text-truncate block">{{ .Image }}</div>
<div>{{ .StateText }}</div>
- {{ if .Children }}
+ {{- if .Children }}
<ul class="list list-gap-4 margin-top-10">
- {{ range .Children }}
+ {{- range .Children }}
<li class="flex gap-7 items-center">
<div class="margin-bottom-3">{{ template "state-icon" .StateIcon }}</div>
- <div class="color-highlight">{{ .Title }} <span class="size-h5 color-base">{{ .StateText }}</span></div>
+ <div class="color-highlight">{{ .Name }} <span class="size-h5 color-base">{{ .StateText }}</span></div>
</li>
- {{ end }}
+ {{- end }}
</ul>
- {{ end }}
+ {{- end }}
</div>
</div>
- <div class="min-width-0">
- {{ if .URL }}
- <a href="{{ .URL | safeURL }}" class="color-highlight size-title-dynamic block text-truncate" {{ if not .SameTab }}target="_blank"{{ end }} rel="noreferrer">{{ .Title }}</a>
- {{ else }}
- <div class="color-highlight text-truncate size-title-dynamic">{{ .Title }}</div>
- {{ end }}
- {{ if .Description }}
+ <div class="min-width-0 grow">
+ {{- if .URL }}
+ <a href="{{ .URL | safeURL }}" class="color-highlight size-title-dynamic block text-truncate" {{ if not .SameTab }}target="_blank"{{ end }} rel="noreferrer">{{ .Name }}</a>
+ {{- else }}
+ <div class="color-highlight text-truncate size-title-dynamic">{{ .Name }}</div>
+ {{- end }}
+ {{- if .Description }}
<div class="text-truncate">{{ .Description }}</div>
- {{ end }}
+ {{- end }}
</div>
- <div class="margin-left-auto shrink-0" data-popover-type="text" data-popover-position="above" data-popover-text="{{ .State }}">
+ <div class="margin-left-auto shrink-0" data-popover-type="text" data-popover-position="above" data-popover-text="{{ .State }}" aria-label="{{ .State }}">
{{ template "state-icon" .StateIcon }}
</div>
- </div>
- {{ else }}
- <div class="text-center">No containers available to show.</div>
- {{ end }}
-</div>
-{{ end }}
-{{ define "state-icon" }}
-{{ if eq . "ok" }}
-<svg class="docker-container-status-icon" fill="var(--color-positive)" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20">
+ <div class="visually-hidden" aria-label="{{ .StateText }}"></div>
+ </li>
+ {{- else }}
+ <div class="text-center">No containers available to show.</div>
+ {{- end }}
+</ul>
+{{- end }}
+
+{{- define "state-icon" }}
+{{- if eq . "ok" }}
+<svg class="docker-container-status-icon" fill="var(--color-positive)" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" aria-hidden="true">
<path fill-rule="evenodd" d="M10 18a8 8 0 1 0 0-16 8 8 0 0 0 0 16Zm3.857-9.809a.75.75 0 0 0-1.214-.882l-3.483 4.79-1.88-1.88a.75.75 0 1 0-1.06 1.061l2.5 2.5a.75.75 0 0 0 1.137-.089l4-5.5Z" clip-rule="evenodd" />
</svg>
-{{ else if eq . "warn" }}
-<svg class="docker-container-status-icon" fill="var(--color-negative)" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20">
+{{- else if eq . "warn" }}
+<svg class="docker-container-status-icon" fill="var(--color-negative)" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" aria-hidden="true">
<path fill-rule="evenodd" d="M8.485 2.495c.673-1.167 2.357-1.167 3.03 0l6.28 10.875c.673 1.167-.17 2.625-1.516 2.625H3.72c-1.347 0-2.189-1.458-1.515-2.625L8.485 2.495ZM10 5a.75.75 0 0 1 .75.75v3.5a.75.75 0 0 1-1.5 0v-3.5A.75.75 0 0 1 10 5Zm0 9a1 1 0 1 0 0-2 1 1 0 0 0 0 2Z" clip-rule="evenodd" />
</svg>
-{{ else if eq . "paused" }}
-<svg class="docker-container-status-icon" fill="var(--color-text-base)" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20">
+{{- else if eq . "paused" }}
+<svg class="docker-container-status-icon" fill="var(--color-text-base)" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" aria-hidden="true">
<path fill-rule="evenodd" d="M2 10a8 8 0 1 1 16 0 8 8 0 0 1-16 0Zm5-2.25A.75.75 0 0 1 7.75 7h.5a.75.75 0 0 1 .75.75v4.5a.75.75 0 0 1-.75.75h-.5a.75.75 0 0 1-.75-.75v-4.5Zm4 0a.75.75 0 0 1 .75-.75h.5a.75.75 0 0 1 .75.75v4.5a.75.75 0 0 1-.75.75h-.5a.75.75 0 0 1-.75-.75v-4.5Z" clip-rule="evenodd" />
</svg>
-{{ else }}
-<svg class="docker-container-status-icon" fill="var(--color-text-base)" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20">
+{{- else }}
+<svg class="docker-container-status-icon" fill="var(--color-text-base)" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" aria-hidden="true">
<path fill-rule="evenodd" d="M18 10a8 8 0 1 1-16 0 8 8 0 0 1 16 0ZM8.94 6.94a.75.75 0 1 1-1.061-1.061 3 3 0 1 1 2.871 5.026v.345a.75.75 0 0 1-1.5 0v-.5c0-.72.57-1.172 1.081-1.287A1.5 1.5 0 1 0 8.94 6.94ZM10 15a1 1 0 1 0 0-2 1 1 0 0 0 0 2Z" clip-rule="evenodd" />
</svg>
-{{ end }}
-{{ end }}
+{{- end }}
+{{- end }}
diff --git a/internal/glance/templates/document.html b/internal/glance/templates/document.html
index e28c85e..a1592e2 100644
--- a/internal/glance/templates/document.html
+++ b/internal/glance/templates/document.html
@@ -10,13 +10,13 @@
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="black-translucent">
- <meta name="apple-mobile-web-app-title" content="Glance">
- <meta name="theme-color" content="{{ if ne nil .App.Config.Theme.BackgroundColor }}{{ .App.Config.Theme.BackgroundColor }}{{ else }}hsl(240, 8%, 9%){{ end }}">
- <link rel="apple-touch-icon" sizes="512x512" href="{{ .App.AssetPath "app-icon.png" }}">
- <link rel="manifest" href="{{ .App.AssetPath "manifest.json" }}">
+ <meta name="apple-mobile-web-app-title" content="{{ .App.Config.Branding.AppName }}">
+ <meta name="theme-color" content="{{ .App.Config.Theme.BackgroundColorAsHex }}">
+ <link rel="apple-touch-icon" sizes="512x512" href='{{ .App.Config.Branding.AppIconURL }}'>
+ <link rel="manifest" href='{{ .App.VersionedAssetPath "manifest.json" }}'>
<link rel="icon" type="image/png" href="{{ .App.Config.Branding.FaviconURL }}" />
- <link rel="stylesheet" href="{{ .App.AssetPath "main.css" }}">
- <script type="module" src="{{ .App.AssetPath "js/main.js" }}"></script>
+ <link rel="stylesheet" href='{{ .App.StaticAssetPath "css/bundle.css" }}'>
+ <script type="module" src='{{ .App.StaticAssetPath "js/main.js" }}'></script>
{{ block "document-head-after" . }}{{ end }}
</head>
<body>
diff --git a/internal/glance/templates/forum-posts.html b/internal/glance/templates/forum-posts.html
index ae1ca44..05a57d8 100644
--- a/internal/glance/templates/forum-posts.html
+++ b/internal/glance/templates/forum-posts.html
@@ -1,49 +1,49 @@
{{ template "widget-base.html" . }}
-{{ define "widget-content" }}
+{{- define "widget-content" }}
<ul class="list list-gap-14 collapsible-container" data-collapse-after="{{ .CollapseAfter }}">
- {{ range .Posts }}
+ {{- range .Posts }}
<li>
<div class="flex gap-10 row-reverse-on-mobile thumbnail-parent">
- {{ if $.ShowThumbnails }}
- {{ if .IsCrosspost }}
- <svg class="forum-post-list-thumbnail hide-on-mobile" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="-9 -8 40 40" stroke-width="1.5" stroke="var(--color-text-subdue)">
- <path stroke-linecap="round" stroke-linejoin="round" d="M7.5 21 3 16.5m0 0L7.5 12M3 16.5h13.5m0-13.5L21 7.5m0 0L16.5 12M21 7.5H7.5" />
- </svg>
- {{ else if ne .ThumbnailUrl "" }}
- <img class="forum-post-list-thumbnail thumbnail" src="{{ .ThumbnailUrl }}" alt="" loading="lazy">
- {{ else if ne "" .TargetUrl }}
- <svg class="forum-post-list-thumbnail hide-on-mobile" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="-9 -8 40 40" stroke-width="1.5" stroke="var(--color-text-subdue)">
- <path stroke-linecap="round" stroke-linejoin="round" d="M13.19 8.688a4.5 4.5 0 0 1 1.242 7.244l-4.5 4.5a4.5 4.5 0 0 1-6.364-6.364l1.757-1.757m13.35-.622 1.757-1.757a4.5 4.5 0 0 0-6.364-6.364l-4.5 4.5a4.5 4.5 0 0 0 1.242 7.244" />
- </svg>
- {{ else }}
- <svg class="forum-post-list-thumbnail hide-on-mobile" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="-9 -8 40 40" stroke-width="1.5" stroke="var(--color-text-subdue)">
- <path stroke-linecap="round" stroke-linejoin="round" d="M7.5 8.25h9m-9 3H12m-9.75 1.51c0 1.6 1.123 2.994 2.707 3.227 1.129.166 2.27.293 3.423.379.35.026.67.21.865.501L12 21l2.755-4.133a1.14 1.14 0 0 1 .865-.501 48.172 48.172 0 0 0 3.423-.379c1.584-.233 2.707-1.626 2.707-3.228V6.741c0-1.602-1.123-2.995-2.707-3.228A48.394 48.394 0 0 0 12 3c-2.392 0-4.744.175-7.043.513C3.373 3.746 2.25 5.14 2.25 6.741v6.018Z" />
- </svg>
- {{ end }}
- {{ end }}
+ {{- if $.ShowThumbnails }}
+ {{- if .IsCrosspost }}
+ <svg class="forum-post-list-thumbnail hide-on-mobile" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="-9 -8 40 40" stroke-width="1.5" stroke="var(--color-text-subdue)">
+ <path stroke-linecap="round" stroke-linejoin="round" d="M7.5 21 3 16.5m0 0L7.5 12M3 16.5h13.5m0-13.5L21 7.5m0 0L16.5 12M21 7.5H7.5" />
+ </svg>
+ {{- else if .ThumbnailUrl }}
+ <img class="forum-post-list-thumbnail thumbnail" src="{{ .ThumbnailUrl }}" alt="" loading="lazy">
+ {{- else if .TargetUrl }}
+ <svg class="forum-post-list-thumbnail hide-on-mobile" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="-9 -8 40 40" stroke-width="1.5" stroke="var(--color-text-subdue)">
+ <path stroke-linecap="round" stroke-linejoin="round" d="M13.19 8.688a4.5 4.5 0 0 1 1.242 7.244l-4.5 4.5a4.5 4.5 0 0 1-6.364-6.364l1.757-1.757m13.35-.622 1.757-1.757a4.5 4.5 0 0 0-6.364-6.364l-4.5 4.5a4.5 4.5 0 0 0 1.242 7.244" />
+ </svg>
+ {{- else }}
+ <svg class="forum-post-list-thumbnail hide-on-mobile" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="-9 -8 40 40" stroke-width="1.5" stroke="var(--color-text-subdue)">
+ <path stroke-linecap="round" stroke-linejoin="round" d="M7.5 8.25h9m-9 3H12m-9.75 1.51c0 1.6 1.123 2.994 2.707 3.227 1.129.166 2.27.293 3.423.379.35.026.67.21.865.501L12 21l2.755-4.133a1.14 1.14 0 0 1 .865-.501 48.172 48.172 0 0 0 3.423-.379c1.584-.233 2.707-1.626 2.707-3.228V6.741c0-1.602-1.123-2.995-2.707-3.228A48.394 48.394 0 0 0 12 3c-2.392 0-4.744.175-7.043.513C3.373 3.746 2.25 5.14 2.25 6.741v6.018Z" />
+ </svg>
+ {{- end }}
+ {{- end }}
<div class="grow min-width-0">
<a href="{{ .DiscussionUrl }}" class="size-title-dynamic color-primary-if-not-visited" target="_blank" rel="noreferrer">{{ .Title }}</a>
- {{ if gt (len .Tags) 0 }}
+ {{- if .Tags }}
<div class="inline-block forum-post-tags-container">
<ul class="attachments">
- {{ range .Tags }}
- <li>{{ . }}</li>
- {{ end }}
+ {{- range .Tags }}
+ <li>{{ . }}</li>
+ {{- end }}
</ul>
</div>
- {{ end }}
- <ul class="list-horizontal-text">
+ {{- end }}
+ <ul class="list-horizontal-text flex-nowrap text-compact">
<li {{ dynamicRelativeTimeAttrs .TimePosted }}></li>
- <li>{{ .Score | formatNumber }} points</li>
- <li>{{ .CommentCount | formatNumber }} comments</li>
- {{ if ne "" .TargetUrl }}
+ <li class="shrink-0">{{ .Score | formatApproxNumber }} points</li>
+ <li class="shrink-0{{ if .TargetUrl }} forum-post-autohide{{ end }}">{{ .CommentCount | formatApproxNumber }} comments</li>
+ {{- if .TargetUrl }}
<li class="min-width-0"><a class="visited-indicator text-truncate block" href="{{ .TargetUrl }}" target="_blank" rel="noreferrer">{{ .TargetUrlDomain }}</a></li>
- {{ end }}
+ {{- end }}
</ul>
</div>
</div>
</li>
- {{ end }}
+ {{- end }}
</ul>
-{{ end }}
+{{- end }}
diff --git a/internal/glance/templates/group.html b/internal/glance/templates/group.html
index 646df2f..3a1fb79 100644
--- a/internal/glance/templates/group.html
+++ b/internal/glance/templates/group.html
@@ -4,17 +4,18 @@
{{ define "widget-content" }}
<div class="widget-group-header">
- <div class="widget-header gap-20">
- {{ range $i, $widget := .Widgets }}
- <button class="widget-group-title{{ if eq $i 0 }} widget-group-title-current{{ end }}"{{ if ne "" .TitleURL }} data-title-url="{{ .TitleURL }}"{{ end }}>{{ $widget.Title }}</button>
- {{ end }}
+ <div class="widget-header gap-20" role="tablist">
+ {{- range $i, $widget := .Widgets }}
+ <button class="widget-group-title{{ if eq $i 0 }} widget-group-title-current{{ end }}"{{ if ne "" .TitleURL }} data-title-url="{{ .TitleURL }}"{{ end }} aria-selected="{{ if eq $i 0 }}true{{ else }}false{{ end }}" arial-level="2" role="tab" aria-controls="widget-{{ .GetID }}-tabpanel-{{ $i }}" id="widget-{{ .GetID }}-tab-{{ $i }}">{{ $widget.Title }}</button>
+ {{- end }}
</div>
</div>
<div class="widget-group-contents">
-{{ range $i, $widget := .Widgets }}
- <div class="widget-group-content{{ if eq $i 0 }} widget-group-content-current{{ end }}">{{ .Render }}</div>
-{{ end }}
+{{- range $i, $widget := .Widgets }}
+ <div class="widget-group-content{{ if eq $i 0 }} widget-group-content-current{{ end }}" id="widget-{{ .GetID }}-tabpanel-{{ $i }}" role="tabpanel" aria-labelledby="widget-{{ .GetID }}-tab-{{ $i }}" aria-hidden="{{ if eq $i 0 }}false{{ else }}true{{ end }}">
+ {{- .Render -}}
+ </div>
+{{- end }}
</div>
-
{{ end }}
diff --git a/internal/glance/templates/manifest.json b/internal/glance/templates/manifest.json
new file mode 100644
index 0000000..124f330
--- /dev/null
+++ b/internal/glance/templates/manifest.json
@@ -0,0 +1,15 @@
+{
+ "name": "{{ .App.Config.Branding.AppName }}",
+ "display": "standalone",
+ "background_color": "{{ .App.Config.Branding.AppBackgroundColor }}",
+ "theme_color": "{{ .App.Config.Branding.AppBackgroundColor }}",
+ "scope": "/",
+ "start_url": "/",
+ "icons": [
+ {
+ "src": "{{ .App.Config.Branding.AppIconURL }}",
+ "type": "image/png",
+ "sizes": "512x512"
+ }
+ ]
+}
diff --git a/internal/glance/templates/markets.html b/internal/glance/templates/markets.html
index a979321..cd47cab 100644
--- a/internal/glance/templates/markets.html
+++ b/internal/glance/templates/markets.html
@@ -11,13 +11,13 @@
<a class="market-chart" {{ if ne "" .ChartLink }} href="{{ .ChartLink }}" target="_blank" rel="noreferrer"{{ end }}>
<svg class="market-chart shrink-0" viewBox="0 0 100 50">
- <polyline fill="none" stroke="var(--color-text-subdue)" stroke-width="1.5px" points="{{ .SvgChartPoints }}" vector-effect="non-scaling-stroke"></polyline>
+ <polyline fill="none" stroke="var(--color-text-subdue)" stroke-linejoin="round" stroke-width="1.5px" points="{{ .SvgChartPoints }}" vector-effect="non-scaling-stroke"></polyline>
</svg>
</a>
<div class="market-values shrink-0">
<div class="size-h3 text-right {{ if eq .PercentChange 0.0 }}{{ else if gt .PercentChange 0.0 }}color-positive{{ else }}color-negative{{ end }}">{{ printf "%+.2f" .PercentChange }}%</div>
- <div class="text-right">{{ .Currency }}{{ .Price | formatPrice }}</div>
+ <div class="text-right">{{ .Currency }}{{ .Price | formatPriceWithPrecision .PriceHint }}</div>
</div>
</div>
{{ end }}
diff --git a/internal/glance/templates/monitor.html b/internal/glance/templates/monitor.html
index 7e95b99..6398921 100644
--- a/internal/glance/templates/monitor.html
+++ b/internal/glance/templates/monitor.html
@@ -24,7 +24,7 @@
{{ if .Icon.URL }}
<img class="monitor-site-icon{{ if .Icon.IsFlatIcon }} flat-icon{{ end }}" src="{{ .Icon.URL }}" alt="" loading="lazy">
{{ end }}
-<div class="min-width-0">
+<div class="grow min-width-0">
<a class="size-h3 color-highlight text-truncate block" href="{{ .URL | safeURL }}" {{ if not .SameTab }}target="_blank"{{ end }} rel="noreferrer">{{ .Title }}</a>
<ul class="list-horizontal-text">
{{ if not .Status.Error }}
diff --git a/internal/glance/templates/old-calendar.html b/internal/glance/templates/old-calendar.html
new file mode 100644
index 0000000..b43d43d
--- /dev/null
+++ b/internal/glance/templates/old-calendar.html
@@ -0,0 +1,34 @@
+{{ template "widget-base.html" . }}
+
+{{ define "widget-content" }}
+<div class="widget-small-content-bounds">
+ <div class="flex justify-between items-center">
+ <div class="color-highlight size-h1">{{ .Calendar.CurrentMonthName }}</div>
+ <ul class="list-horizontal-text color-highlight size-h4">
+ <li>Week {{ .Calendar.CurrentWeekNumber }}</li>
+ <li>{{ .Calendar.CurrentYear }}</li>
+ </ul>
+ </div>
+
+ <div class="flex flex-wrap size-h6 margin-top-10 color-subdue">
+ {{ if .StartSunday }}
+ <div class="old-calendar-day">Su</div>
+ {{ end }}
+ <div class="old-calendar-day">Mo</div>
+ <div class="old-calendar-day">Tu</div>
+ <div class="old-calendar-day">We</div>
+ <div class="old-calendar-day">Th</div>
+ <div class="old-calendar-day">Fr</div>
+ <div class="old-calendar-day">Sa</div>
+ {{ if not .StartSunday }}
+ <div class="old-calendar-day">Su</div>
+ {{ end }}
+ </div>
+
+ <div class="flex flex-wrap">
+ {{ range .Calendar.Days }}
+ <div class="old-calendar-day{{ if eq . $.Calendar.CurrentDay }} old-calendar-day-today{{ end }}">{{ . }}</div>
+ {{ end }}
+ </div>
+</div>
+{{ end }}
diff --git a/internal/glance/templates/page.html b/internal/glance/templates/page.html
index 5b48520..b95d28a 100644
--- a/internal/glance/templates/page.html
+++ b/internal/glance/templates/page.html
@@ -16,13 +16,13 @@
</script>
{{ end }}
-{{ define "document-root-attrs" }}class="{{ if .App.Config.Theme.Light }}light-scheme {{ end }}{{ if ne "" .Page.Width }}page-width-{{ .Page.Width }} {{ end }}{{ if .Page.CenterVertically }}page-center-vertically{{ end }}"{{ end }}
+{{ define "document-root-attrs" }}class="{{ if .App.Config.Theme.Light }}light-scheme {{ end }}{{ if .Page.CenterVertically }}page-center-vertically{{ end }}"{{ end }}
{{ define "document-head-after" }}
{{ .App.ParsedThemeStyle }}
{{ if ne "" .App.Config.Theme.CustomCSSFile }}
-<link rel="stylesheet" href="{{ .App.Config.Theme.CustomCSSFile }}?v={{ .App.Config.Server.StartedAt.Unix }}">
+<link rel="stylesheet" href="{{ .App.Config.Theme.CustomCSSFile }}?v={{ .App.CreatedAt.Unix }}">
{{ end }}
{{ if ne "" .App.Config.Document.Head }}{{ .App.Config.Document.Head }}{{ end }}
@@ -30,7 +30,7 @@
{{ define "navigation-links" }}
{{ range .App.Config.Pages }}
-<a href="{{ $.App.Config.Server.BaseURL }}/{{ .Slug }}" class="nav-item{{ if eq .Slug $.Page.Slug }} nav-item-current{{ end }}">{{ .Title }}</a>
+<a href="{{ $.App.Config.Server.BaseURL }}/{{ .Slug }}" class="nav-item{{ if eq .Slug $.Page.Slug }} nav-item-current{{ end }}"{{ if eq .Slug $.Page.Slug }} aria-current="page"{{ end }}>{{ .Title }}</a>
{{ end }}
{{ end }}
@@ -54,13 +54,13 @@
{{ define "document-body" }}
<div class="flex flex-column body-content">
{{ if not .Page.HideDesktopNavigation }}
- <div class="header-container content-bounds">
+ <div class="header-container content-bounds{{ if ne "" .Page.DesktopNavigationWidth }} content-bounds-{{ .Page.DesktopNavigationWidth }} {{ end }}">
<div class="header flex padding-inline-widget widget-content-frame">
<!-- TODO: Replace G with actual logo, first need an actual logo -->
- <div class="logo">{{ if ne "" .App.Config.Branding.LogoURL }}<img src="{{ .App.Config.Branding.LogoURL }}" alt="">{{ else if ne "" .App.Config.Branding.LogoText }}{{ .App.Config.Branding.LogoText }}{{ else }}G{{ end }}</div>
- <div class="nav flex grow">
+ <div class="logo" aria-hidden="true">{{ if ne "" .App.Config.Branding.LogoURL }}<img src="{{ .App.Config.Branding.LogoURL }}" alt="">{{ else if ne "" .App.Config.Branding.LogoText }}{{ .App.Config.Branding.LogoText }}{{ else }}G{{ end }}</div>
+ <nav class="nav flex grow">
{{ template "navigation-links" . }}
- </div>
+ </nav>
<div class="flex items-center">
{{ template "theme-switcher" . }}
</div>
@@ -86,18 +86,20 @@
</div>
</div>
- <div class="content-bounds grow">
- <div class="page" id="page">
+ <div class="content-bounds grow{{ if ne "" .Page.Width }} content-bounds-{{ .Page.Width }} {{ end }}">
+ <main class="page" id="page" aria-live="polite" aria-busy="true">
+ <h1 class="visually-hidden">{{ .Page.Title }}</h1>
<div class="page-content" id="page-content"></div>
<div class="page-loading-container">
<!-- TODO: add a bigger/better loading indicator -->
- <div class="loading-icon"></div>
+ <div class="visually-hidden">Loading</div>
+ <div class="loading-icon" aria-hidden="true"></div>
</div>
- </div>
+ </main>
</div>
{{ if not .App.Config.Branding.HideFooter }}
- <div class="footer flex items-center flex-column">
+ <footer class="footer flex items-center flex-column">
{{ if eq "" .App.Config.Branding.CustomFooter }}
<div>
<a class="size-h3" href="https://github.com/glanceapp/glance" target="_blank" rel="noreferrer">Glance</a> {{ if ne "dev" .App.Version }}<a class="visited-indicator" title="Release notes" href="https://github.com/glanceapp/glance/releases/tag/{{ .App.Version }}" target="_blank" rel="noreferrer">{{ .App.Version }}</a>{{ else }}({{ .App.Version }}){{ end }}
@@ -105,7 +107,7 @@
{{ else }}
{{ .App.Config.Branding.CustomFooter }}
{{ end }}
- </div>
+ </footer>
{{ end }}
<div class="mobile-navigation-offset"></div>
diff --git a/internal/glance/templates/reddit-horizontal-cards.html b/internal/glance/templates/reddit-horizontal-cards.html
index 6961216..9ee31b3 100644
--- a/internal/glance/templates/reddit-horizontal-cards.html
+++ b/internal/glance/templates/reddit-horizontal-cards.html
@@ -21,7 +21,7 @@
<a href="{{ .DiscussionUrl }}" class="text-truncate-3-lines color-primary-if-not-visited margin-top-7 margin-bottom-auto" target="_blank" rel="noreferrer">{{ .Title }}</a>
<ul class="list-horizontal-text margin-top-7">
<li {{ dynamicRelativeTimeAttrs .TimePosted }}></li>
- <li>{{ .Score | formatNumber }} points</li>
+ <li>{{ .Score | formatApproxNumber }} points</li>
</ul>
</div>
</div>
diff --git a/internal/glance/templates/reddit-vertical-cards.html b/internal/glance/templates/reddit-vertical-cards.html
index 94c8b94..747cc7e 100644
--- a/internal/glance/templates/reddit-vertical-cards.html
+++ b/internal/glance/templates/reddit-vertical-cards.html
@@ -20,7 +20,7 @@
<a href="{{ .DiscussionUrl }}" class="text-truncate-3-lines color-primary-if-not-visited margin-top-7" target="_blank" rel="noreferrer">{{ .Title }}</a>
<ul class="list-horizontal-text margin-top-7">
<li {{ dynamicRelativeTimeAttrs .TimePosted }}></li>
- <li>{{ .Score | formatNumber }} points</li>
+ <li>{{ .Score | formatApproxNumber }} points</li>
</ul>
</div>
</div>
diff --git a/internal/glance/templates/search.html b/internal/glance/templates/search.html
index 6e8fc43..ae981c6 100644
--- a/internal/glance/templates/search.html
+++ b/internal/glance/templates/search.html
@@ -3,7 +3,7 @@
{{ define "widget-content-classes" }}widget-content-frameless{{ end }}
{{ define "widget-content" }}
-<div class="search widget-content-frame padding-inline-widget flex gap-15 items-center" data-default-search-url="{{ .SearchEngine }}" data-new-tab="{{ .NewTab }}">
+<div class="search widget-content-frame padding-inline-widget flex gap-15 items-center" data-default-search-url="{{ .SearchEngine }}" data-new-tab="{{ .NewTab }}" data-target="{{ .Target }}">
<div class="search-bangs">
{{ range .Bangs }}
<input type="hidden" data-shortcut="{{ .Shortcut }}" data-title="{{ .Title }}" data-url="{{ .URL }}">
diff --git a/internal/glance/templates/server-stats.html b/internal/glance/templates/server-stats.html
new file mode 100644
index 0000000..4eaa434
--- /dev/null
+++ b/internal/glance/templates/server-stats.html
@@ -0,0 +1,140 @@
+{{ template "widget-base.html" . }}
+
+{{- define "widget-content" }}
+{{- range .Servers }}
+<div class="server">
+ <div class="server-info">
+ <div class="server-details">
+ <div class="server-name color-highlight size-h3">{{ if .Name }}{{ .Name }}{{ else }}{{ .Info.Hostname }}{{ end }}</div>
+ <div>
+ {{- if .IsReachable }}
+ {{ if .Info.HostInfoIsAvailable }}<span {{ dynamicRelativeTimeAttrs .Info.BootTime }}></span>{{ else }}unknown{{ end }} uptime
+ {{- else }}
+ unreachable
+ {{- end }}
+ </div>
+ </div>
+ <div class="shrink-0"{{ if .IsReachable }} data-popover-type="html" data-popover-margin="0.2rem" data-popover-max-width="400px"{{ end }}>
+ {{- if .IsReachable }}
+ <div data-popover-html>
+ <div class="size-h5 text-compact">PLATFORM</div>
+ <div class="color-highlight">{{ if .Info.HostInfoIsAvailable }}{{ .Info.Platform }}{{ else }}Unknown{{ end }}</div>
+ </div>
+ {{- end }}
+ <svg class="server-icon" stroke="var(--color-{{ if .IsReachable }}positive{{ else }}negative{{ end }})" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5">
+ <path stroke-linecap="round" stroke-linejoin="round" d="M21.75 17.25v-.228a4.5 4.5 0 0 0-.12-1.03l-2.268-9.64a3.375 3.375 0 0 0-3.285-2.602H7.923a3.375 3.375 0 0 0-3.285 2.602l-2.268 9.64a4.5 4.5 0 0 0-.12 1.03v.228m19.5 0a3 3 0 0 1-3 3H5.25a3 3 0 0 1-3-3m19.5 0a3 3 0 0 0-3-3H5.25a3 3 0 0 0-3 3m16.5 0h.008v.008h-.008v-.008Zm-3 0h.008v.008h-.008v-.008Z" />
+ </svg>
+ </div>
+ </div>
+ <div class="server-stats">
+ <div class="flex-1{{ if not .Info.CPU.LoadIsAvailable }} server-stat-unavailable{{ end }}">
+ <div class="flex items-end size-h5">
+ <div>CPU</div>
+ {{- if and .Info.CPU.TemperatureIsAvailable (ge .Info.CPU.TemperatureC 80) }}
+ <svg class="server-spicy-cpu-icon" fill="var(--color-negative)" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" >
+ <path fill-rule="evenodd" d="M8.074.945A4.993 4.993 0 0 0 6 5v.032c.004.6.114 1.176.311 1.709.16.428-.204.91-.61.7a5.023 5.023 0 0 1-1.868-1.677c-.202-.304-.648-.363-.848-.058a6 6 0 1 0 8.017-1.901l-.004-.007a4.98 4.98 0 0 1-2.18-2.574c-.116-.31-.477-.472-.744-.28Zm.78 6.178a3.001 3.001 0 1 1-3.473 4.341c-.205-.365.215-.694.62-.59a4.008 4.008 0 0 0 1.873.03c.288-.065.413-.386.321-.666A3.997 3.997 0 0 1 8 8.999c0-.585.126-1.14.351-1.641a.42.42 0 0 1 .503-.235Z" clip-rule="evenodd" />
+ </svg>
+ {{- end }}
+ <div class="color-highlight margin-left-auto text-very-compact">{{ if .Info.CPU.LoadIsAvailable }}{{ .Info.CPU.Load1Percent }} <span class="color-base">%</span>{{ else }}n/a{{ end }}</div>
+ </div>
+ <div{{ if .Info.CPU.LoadIsAvailable }} data-popover-type="html"{{ end }}>
+ {{- if .Info.CPU.LoadIsAvailable }}
+ <div data-popover-html>
+ <div class="flex">
+ <div class="size-h5">1M AVG</div>
+ <div class="value-separator"></div>
+ <div class="color-highlight text-very-compact">{{ .Info.CPU.Load1Percent }} <span class="color-base size-h5">%</span></div>
+ </div>
+ <div class="flex margin-top-3">
+ <div class="size-h5">15M AVG</div>
+ <div class="value-separator"></div>
+ <div class="color-highlight text-very-compact">{{ .Info.CPU.Load15Percent }} <span class="color-base size-h5">%</span></div>
+ </div>
+ {{- if .Info.CPU.TemperatureIsAvailable }}
+ <div class="flex margin-top-3">
+ <div class="size-h5">TEMP C</div>
+ <div class="value-separator"></div>
+ <div class="color-highlight text-very-compact">{{ .Info.CPU.TemperatureC }} <span class="color-base size-h5">°</span></div>
+ </div>
+ {{- end }}
+ </div>
+ {{- end }}
+ <div class="progress-bar progress-bar-combined">
+ {{- if .Info.CPU.LoadIsAvailable }}
+ <div class="progress-value{{ if ge .Info.CPU.Load1Percent 85 }} progress-value-notice{{ end }}" style="--percent: {{ .Info.CPU.Load1Percent }}"></div>
+ <div class="progress-value{{ if ge .Info.CPU.Load15Percent 85 }} progress-value-notice{{ end }}" style="--percent: {{ .Info.CPU.Load15Percent }}"></div>
+ {{- end }}
+ </div>
+ </div>
+ </div>
+ <div class="flex-1{{ if not .Info.Memory.IsAvailable }} server-stat-unavailable{{ end }}">
+ <div class="flex justify-between items-end size-h5">
+ <div>RAM</div>
+ <div class="color-highlight text-very-compact">{{ if .Info.Memory.IsAvailable }}{{ .Info.Memory.UsedPercent }} <span class="color-base">%</span>{{ else }}n/a{{ end }}</div>
+ </div>
+ <div{{ if .Info.Memory.IsAvailable }} data-popover-type="html"{{ end }}>
+ {{- if .Info.Memory.IsAvailable }}
+ <div data-popover-html>
+ <div class="flex">
+ <div class="size-h5">RAM</div>
+ <div class="value-separator"></div>
+ <div class="color-highlight text-very-compact">
+ {{ .Info.Memory.UsedMB | formatServerMegabytes }} <span class="color-base size-h5">/</span> {{ .Info.Memory.TotalMB | formatServerMegabytes }}
+ </div>
+ </div>
+ {{- if and (not .HideSwap) .Info.Memory.SwapIsAvailable }}
+ <div class="flex margin-top-3">
+ <div class="size-h5">SWAP</div>
+ <div class="value-separator"></div>
+ <div class="color-highlight text-very-compact">
+ {{ .Info.Memory.SwapUsedMB | formatServerMegabytes }} <span class="color-base size-h5">/</span> {{ .Info.Memory.SwapTotalMB | formatServerMegabytes }}
+ </div>
+ </div>
+ {{- end }}
+ </div>
+ {{- end }}
+ <div class="progress-bar progress-bar-combined">
+ {{- if .Info.Memory.IsAvailable }}
+ <div class="progress-value{{ if ge .Info.Memory.UsedPercent 85 }} progress-value-notice{{ end }}" style="--percent: {{ .Info.Memory.UsedPercent }}"></div>
+ {{- if and (not .HideSwap) .Info.Memory.SwapIsAvailable }}
+ <div class="progress-value{{ if ge .Info.Memory.SwapUsedPercent 85 }} progress-value-notice{{ end }}" style="--percent: {{ .Info.Memory.SwapUsedPercent }}"></div>
+ {{- end }}
+ {{- end }}
+ </div>
+ </div>
+ </div>
+ <div class="flex-1{{ if not .Info.Mountpoints }} server-stat-unavailable{{ end }}">
+ <div class="flex justify-between items-end size-h5">
+ <div>DISK</div>
+ <div class="color-highlight text-very-compact">{{ if .Info.Mountpoints }}{{ (index .Info.Mountpoints 0).UsedPercent }} <span class="color-base">%</span>{{ else }}n/a{{ end }}</div>
+ </div>
+ <div{{ if .Info.Mountpoints }} data-popover-type="html"{{ end }}>
+ {{- if .Info.Mountpoints }}
+ <div data-popover-html>
+ <ul class="list list-gap-2">
+ {{- range .Info.Mountpoints }}
+ <li class="flex">
+ <div class="size-h5">{{ if .Name }}{{ .Name }}{{ else }}{{ .Path }}{{ end }}</div>
+ <div class="value-separator"></div>
+ <div class="color-highlight text-very-compact">
+ {{ .UsedMB | formatServerMegabytes }} <span class="color-base size-h5">/</span> {{ .TotalMB | formatServerMegabytes }}
+ </div>
+ </li>
+ {{- end }}
+ </ul>
+ </div>
+ {{- end }}
+ <div class="progress-bar progress-bar-combined">
+ {{- if .Info.Mountpoints }}
+ <div class="progress-value{{ if ge ((index .Info.Mountpoints 0).UsedPercent) 85 }} progress-value-notice{{ end }}" style="--percent: {{ (index .Info.Mountpoints 0).UsedPercent }}"></div>
+ {{- if ge (len .Info.Mountpoints) 2 }}
+ <div class="progress-value{{ if ge ((index .Info.Mountpoints 1).UsedPercent) 85 }} progress-value-notice{{ end }}" style="--percent: {{ (index .Info.Mountpoints 1).UsedPercent }}"></div>
+ {{- end }}
+ {{- end }}
+ </div>
+ </div>
+ </div>
+ </div>
+</div>
+{{- end }}
+{{- end }}
diff --git a/internal/glance/templates/twitch-channels.html b/internal/glance/templates/twitch-channels.html
index 30529c5..021a17a 100644
--- a/internal/glance/templates/twitch-channels.html
+++ b/internal/glance/templates/twitch-channels.html
@@ -31,7 +31,7 @@
{{ end }}
<ul class="list-horizontal-text">
<li {{ dynamicRelativeTimeAttrs .LiveSince }}></li>
- <li>{{ .ViewersCount | formatViewerCount }} viewers</li>
+ <li>{{ .ViewersCount | formatApproxNumber }} viewers</li>
</ul>
{{ else }}
<div>Offline</div>
diff --git a/internal/glance/templates/twitch-games-list.html b/internal/glance/templates/twitch-games-list.html
index 38ce758..94fc400 100644
--- a/internal/glance/templates/twitch-games-list.html
+++ b/internal/glance/templates/twitch-games-list.html
@@ -9,7 +9,7 @@
<div class="min-width-0">
<a class="size-h3 color-highlight text-truncate block" href="https://www.twitch.tv/directory/category/{{ .Slug }}" target="_blank" rel="noreferrer">{{ .Name }}</a>
<ul class="list-horizontal-text">
- <li>{{ .ViewersCount | formatViewerCount }} viewers</li>
+ <li>{{ .ViewersCount | formatApproxNumber }} viewers</li>
{{ if .IsNew }}
<li class="color-primary">NEW</li>
{{ end }}
diff --git a/internal/glance/templates/v0.7-update-notice-page.html b/internal/glance/templates/v0.7-update-notice-page.html
index 1f3f524..fa976fb 100644
--- a/internal/glance/templates/v0.7-update-notice-page.html
+++ b/internal/glance/templates/v0.7-update-notice-page.html
@@ -24,15 +24,13 @@
</head>
<body>
-<!-- TODO: update - add links -->
-
-<div class="content-bounds color-highlight">
+<div class="content-bounds color-paragraph">
<p class="uppercase size-h5 color-negative padding-inline-widget">UPDATE NOTICE</p>
<div class="widget-content-frame margin-top-10 padding-widget">
<p class="comfy-line-height">
The default location of glance.yml in the Docker image has
- changed since v0.7.0, please see the <a class="color-primary" href="#">migration guide</a>
- for instructions or visit the <a class="color-primary" href="#">release notes</a>
+ changed since v0.7.0, please see the <a class="color-primary" href="https://github.com/glanceapp/glance/blob/main/docs/v0.7.0-upgrade.md" target="_blank">migration guide</a>
+ for instructions or visit the <a class="color-primary" href="https://github.com/glanceapp/glance/releases/tag/v0.7.0" target="_blank">release notes</a>
to find out more about why this change was necessary. Sorry for the inconvenience.
</p>
diff --git a/internal/glance/templates/videos-vertical-list.html b/internal/glance/templates/videos-vertical-list.html
new file mode 100644
index 0000000..a735a74
--- /dev/null
+++ b/internal/glance/templates/videos-vertical-list.html
@@ -0,0 +1,20 @@
+{{ template "widget-base.html" . }}
+
+{{- define "widget-content" }}
+<ul class="list list-gap-14 collapsible-container" data-collapse-after="{{ .CollapseAfter }}">
+ {{- range .Videos }}
+ <li class="flex thumbnail-parent gap-10 items-center">
+ <img class="video-horizontal-list-thumbnail thumbnail" loading="lazy" src="{{ .ThumbnailUrl }}" alt="">
+ <div class="min-width-0">
+ <a class="block text-truncate color-primary-if-not-visited" href="{{ .Url }}" target="_blank" rel="noreferrer">{{ .Title }}</a>
+ <ul class="list-horizontal-text flex-nowrap">
+ <li class="shrink-0" {{ dynamicRelativeTimeAttrs .TimePosted }}></li>
+ <li class="min-width-0">
+ <a class="block text-truncate" href="{{ .AuthorUrl }}" target="_blank" rel="noreferrer">{{ .Author }}</a>
+ </li>
+ </ul>
+ </div>
+ </li>
+ {{- end }}
+</ul>
+{{- end }}
diff --git a/internal/glance/templates/widget-base.html b/internal/glance/templates/widget-base.html
index 0a8e3f2..b6fd9bc 100644
--- a/internal/glance/templates/widget-base.html
+++ b/internal/glance/templates/widget-base.html
@@ -1,18 +1,34 @@
<div class="widget widget-type-{{ .GetType }}{{ if ne "" .CSSClass }} {{ .CSSClass }}{{ end }}">
- {{ if not .HideHeader}}
+ {{- if not .HideHeader}}
<div class="widget-header">
- {{ if ne "" .TitleURL }}<a href="{{ .TitleURL | safeURL }}" target="_blank" rel="noreferrer" class="uppercase">{{ .Title }}</a>{{ else }}<div class="uppercase">{{ .Title }}</div>{{ end }}
- {{ if and .Error .ContentAvailable }}
+ {{- if ne "" .TitleURL }}
+ <h2><a href="{{ .TitleURL | safeURL }}" target="_blank" rel="noreferrer" class="uppercase">{{ .Title }}</a></h2>
+ {{- else }}
+ <h2 class="uppercase">{{ .Title }}</h2>
+ {{- end }}
+ {{- if .IsWIP }}
+ <div data-popover-type="html" data-popover-position="above">
+ <div data-popover-html>
+ <p class="size-h5">WORK IN PROGRESS</p>
+ <p class="margin-block-10 color-paragraph">This widget is still in development, certain features may not work as expected or may change drastically.</p>
+ <a class="color-primary visited-indicator" href="https://github.com/glanceapp/glance/issues" target="_blank" rel="noreferrer">Report issue</a>
+ </div>
+ <svg class="widget-beta-icon cursor-help" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" fill="currentColor">
+ <path fill-rule="evenodd" d="M19 5.5a4.5 4.5 0 0 1-4.791 4.49c-.873-.055-1.808.128-2.368.8l-6.024 7.23a2.724 2.724 0 1 1-3.837-3.837L9.21 8.16c.672-.56.855-1.495.8-2.368a4.5 4.5 0 0 1 5.873-4.575c.324.105.39.51.15.752L13.34 4.66a.455.455 0 0 0-.11.494 3.01 3.01 0 0 0 1.617 1.617c.17.07.363.02.493-.111l2.692-2.692c.241-.241.647-.174.752.15.14.435.216.9.216 1.382ZM4 17a1 1 0 1 0 0-2 1 1 0 0 0 0 2Z" clip-rule="evenodd" />
+ </svg>
+ </div>
+ {{- end }}
+ {{- if and .Error .ContentAvailable }}
<div class="notice-icon notice-icon-major" title="{{ .Error }}"></div>
- {{ else if .Notice }}
+ {{- else if .Notice }}
<div class="notice-icon notice-icon-minor" title="{{ .Notice }}"></div>
- {{ end }}
+ {{- end }}
</div>
- {{ end }}
+ {{- end }}
<div class="widget-content{{ if .ContentAvailable }} {{ block "widget-content-classes" . }}{{ end }}{{ end }}">
- {{ if .ContentAvailable }}
- {{ block "widget-content" . }}{{ end }}
- {{ else }}
+ {{- if .ContentAvailable }}
+ {{ block "widget-content" . }}{{ end }}
+ {{- else }}
<div class="widget-error-header">
<div class="color-negative size-h3">ERROR</div>
<svg class="widget-error-icon" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5">
@@ -20,6 +36,6 @@
</svg>
</div>
<p class="break-all">{{ if .Error }}{{ .Error }}{{ else }}No error information provided{{ end }}</p>
- {{ end}}
+ {{- end}}
</div>
</div>
diff --git a/internal/glance/utils.go b/internal/glance/utils.go
index 105cd0d..2f76965 100644
--- a/internal/glance/utils.go
+++ b/internal/glance/utils.go
@@ -4,6 +4,7 @@ import (
"bytes"
"fmt"
"html/template"
+ "math"
"net/http"
"net/url"
"os"
@@ -119,14 +120,6 @@ func parseRFC3339Time(t string) time.Time {
return parsed
}
-func boolToString(b bool, trueValue, falseValue string) string {
- if b {
- return trueValue
- }
-
- return falseValue
-}
-
func normalizeVersionFormat(version string) string {
version = strings.ToLower(strings.TrimSpace(version))
@@ -178,3 +171,70 @@ func itemAtIndexOrDefault[T any](items []T, index int, def T) T {
return items[index]
}
+
+func ternary[T any](condition bool, a, b T) T {
+ if condition {
+ return a
+ }
+
+ return b
+}
+
+// Having compile time errors about unused variables is cool and all, but I don't want to
+// have to constantly comment out my code while I'm working on it and testing things out
+func ItsUsedTrustMeBro(...any) {}
+
+func hslToHex(h, s, l float64) string {
+ s /= 100.0
+ l /= 100.0
+
+ var r, g, b float64
+
+ if s == 0 {
+ r, g, b = l, l, l
+ } else {
+ hueToRgb := func(p, q, t float64) float64 {
+ if t < 0 {
+ t += 1
+ }
+ if t > 1 {
+ t -= 1
+ }
+ if t < 1.0/6.0 {
+ return p + (q-p)*6.0*t
+ }
+ if t < 1.0/2.0 {
+ return q
+ }
+ if t < 2.0/3.0 {
+ return p + (q-p)*(2.0/3.0-t)*6.0
+ }
+ return p
+ }
+
+ q := 0.0
+ if l < 0.5 {
+ q = l * (1 + s)
+ } else {
+ q = l + s - l*s
+ }
+
+ p := 2*l - q
+
+ h /= 360.0
+
+ r = hueToRgb(p, q, h+1.0/3.0)
+ g = hueToRgb(p, q, h)
+ b = hueToRgb(p, q, h-1.0/3.0)
+ }
+
+ ir := int(math.Round(r * 255.0))
+ ig := int(math.Round(g * 255.0))
+ ib := int(math.Round(b * 255.0))
+
+ ir = int(math.Max(0, math.Min(255, float64(ir))))
+ ig = int(math.Max(0, math.Min(255, float64(ig))))
+ ib = int(math.Max(0, math.Min(255, float64(ib))))
+
+ return fmt.Sprintf("#%02x%02x%02x", ir, ig, ib)
+}
diff --git a/internal/glance/widget-bookmarks.go b/internal/glance/widget-bookmarks.go
index d55b818..2245e2e 100644
--- a/internal/glance/widget-bookmarks.go
+++ b/internal/glance/widget-bookmarks.go
@@ -14,19 +14,22 @@ type bookmarksWidget struct {
Color *hslColorField `yaml:"color"`
SameTab bool `yaml:"same-tab"`
HideArrow bool `yaml:"hide-arrow"`
+ Target string `yaml:"target"`
Links []struct {
- Title string `yaml:"title"`
- URL string `yaml:"url"`
- Icon customIconField `yaml:"icon"`
+ Title string `yaml:"title"`
+ URL string `yaml:"url"`
+ Description string `yaml:"description"`
+ Icon customIconField `yaml:"icon"`
// we need a pointer to bool to know whether a value was provided,
// however there's no way to dereference a pointer in a template so
// {{ if not .SameTab }} would return true for any non-nil pointer
// which leaves us with no way of checking if the value is true or
// false, hence the duplicated fields below
- SameTabRaw *bool `yaml:"same-tab"`
- SameTab bool `yaml:"-"`
- HideArrowRaw *bool `yaml:"hide-arrow"`
- HideArrow bool `yaml:"-"`
+ SameTabRaw *bool `yaml:"same-tab"`
+ SameTab bool `yaml:"-"`
+ HideArrowRaw *bool `yaml:"hide-arrow"`
+ HideArrow bool `yaml:"-"`
+ Target string `yaml:"target"`
} `yaml:"links"`
} `yaml:"groups"`
}
@@ -49,6 +52,18 @@ func (widget *bookmarksWidget) initialize() error {
} else {
link.HideArrow = *link.HideArrowRaw
}
+
+ if link.Target == "" {
+ if group.Target != "" {
+ link.Target = group.Target
+ } else {
+ if link.SameTab {
+ link.Target = ""
+ } else {
+ link.Target = "_blank"
+ }
+ }
+ }
}
}
diff --git a/internal/glance/widget-calendar.go b/internal/glance/widget-calendar.go
index 518bc22..9537e53 100644
--- a/internal/glance/widget-calendar.go
+++ b/internal/glance/widget-calendar.go
@@ -1,86 +1,45 @@
package glance
import (
- "context"
+ "errors"
"html/template"
"time"
)
var calendarWidgetTemplate = mustParseTemplate("calendar.html", "widget-base.html")
+var calendarWeekdaysToInt = map[string]time.Weekday{
+ "sunday": time.Sunday,
+ "monday": time.Monday,
+ "tuesday": time.Tuesday,
+ "wednesday": time.Wednesday,
+ "thursday": time.Thursday,
+ "friday": time.Friday,
+ "saturday": time.Saturday,
+}
+
type calendarWidget struct {
- widgetBase `yaml:",inline"`
- Calendar *calendar
- StartSunday bool `yaml:"start-sunday"`
+ widgetBase `yaml:",inline"`
+ FirstDayOfWeek string `yaml:"first-day-of-week"`
+ FirstDay int `yaml:"-"`
+ cachedHTML template.HTML `yaml:"-"`
}
func (widget *calendarWidget) initialize() error {
- widget.withTitle("Calendar").withCacheOnTheHour()
+ widget.withTitle("Calendar").withError(nil)
+
+ if widget.FirstDayOfWeek == "" {
+ widget.FirstDayOfWeek = "monday"
+ } else if _, ok := calendarWeekdaysToInt[widget.FirstDayOfWeek]; !ok {
+ return errors.New("invalid first day of week")
+ }
+
+ widget.FirstDay = int(calendarWeekdaysToInt[widget.FirstDayOfWeek])
+ widget.cachedHTML = widget.renderTemplate(widget, calendarWidgetTemplate)
return nil
}
-func (widget *calendarWidget) update(ctx context.Context) {
- widget.Calendar = newCalendar(time.Now(), widget.StartSunday)
- widget.withError(nil).scheduleNextUpdate()
-}
-
func (widget *calendarWidget) Render() template.HTML {
- return widget.renderTemplate(widget, calendarWidgetTemplate)
-}
-
-type calendar struct {
- CurrentDay int
- CurrentWeekNumber int
- CurrentMonthName string
- CurrentYear int
- Days []int
-}
-
-// TODO: very inflexible, refactor to allow more customizability
-// TODO: allow changing between showing the previous and next week and the entire month
-func newCalendar(now time.Time, startSunday bool) *calendar {
- year, week := now.ISOWeek()
- weekday := now.Weekday()
- if !startSunday {
- weekday = (weekday + 6) % 7 // Shift Monday to 0
- }
-
- currentMonthDays := daysInMonth(now.Month(), year)
-
- var previousMonthDays int
-
- if previousMonthNumber := now.Month() - 1; previousMonthNumber < 1 {
- previousMonthDays = daysInMonth(12, year-1)
- } else {
- previousMonthDays = daysInMonth(previousMonthNumber, year)
- }
-
- startDaysFrom := now.Day() - int(weekday) - 7
-
- days := make([]int, 21)
-
- for i := 0; i < 21; i++ {
- day := startDaysFrom + i
-
- if day < 1 {
- day = previousMonthDays + day
- } else if day > currentMonthDays {
- day = day - currentMonthDays
- }
-
- days[i] = day
- }
-
- return &calendar{
- CurrentDay: now.Day(),
- CurrentWeekNumber: week,
- CurrentMonthName: now.Month().String(),
- CurrentYear: year,
- Days: days,
- }
-}
-
-func daysInMonth(m time.Month, year int) int {
- return time.Date(year, m+1, 0, 0, 0, 0, 0, time.UTC).Day()
+ return widget.cachedHTML
}
diff --git a/internal/glance/widget-custom-api.go b/internal/glance/widget-custom-api.go
index b7acce3..3c58b7e 100644
--- a/internal/glance/widget-custom-api.go
+++ b/internal/glance/widget-custom-api.go
@@ -3,12 +3,19 @@ package glance
import (
"bytes"
"context"
+ "encoding/json"
"errors"
"fmt"
"html/template"
"io"
"log/slog"
+ "math"
"net/http"
+ "regexp"
+ "sort"
+ "strconv"
+ "strings"
+ "sync"
"time"
"github.com/tidwall/gjson"
@@ -16,22 +23,41 @@ import (
var customAPIWidgetTemplate = mustParseTemplate("custom-api.html", "widget-base.html")
+// Needs to be exported for the YAML unmarshaler to work
+type CustomAPIRequest struct {
+ URL string `yaml:"url"`
+ AllowInsecure bool `yaml:"allow-insecure"`
+ Headers map[string]string `yaml:"headers"`
+ Parameters queryParametersField `yaml:"parameters"`
+ Method string `yaml:"method"`
+ BodyType string `yaml:"body-type"`
+ Body any `yaml:"body"`
+ SkipJSONValidation bool `yaml:"skip-json-validation"`
+ bodyReader io.ReadSeeker `yaml:"-"`
+ httpRequest *http.Request `yaml:"-"`
+}
+
type customAPIWidget struct {
- widgetBase `yaml:",inline"`
- URL string `yaml:"url"`
- Template string `yaml:"template"`
- Frameless bool `yaml:"frameless"`
- Headers map[string]string `yaml:"headers"`
- APIRequest *http.Request `yaml:"-"`
- compiledTemplate *template.Template `yaml:"-"`
- CompiledHTML template.HTML `yaml:"-"`
+ widgetBase `yaml:",inline"`
+ *CustomAPIRequest `yaml:",inline"` // the primary request
+ Subrequests map[string]*CustomAPIRequest `yaml:"subrequests"`
+ Template string `yaml:"template"`
+ Frameless bool `yaml:"frameless"`
+ compiledTemplate *template.Template `yaml:"-"`
+ CompiledHTML template.HTML `yaml:"-"`
}
func (widget *customAPIWidget) initialize() error {
widget.withTitle("Custom API").withCacheDuration(1 * time.Hour)
- if widget.URL == "" {
- return errors.New("URL is required")
+ if err := widget.CustomAPIRequest.initialize(); err != nil {
+ return fmt.Errorf("initializing primary request: %v", err)
+ }
+
+ for key := range widget.Subrequests {
+ if err := widget.Subrequests[key].initialize(); err != nil {
+ return fmt.Errorf("initializing subrequest %q: %v", key, err)
+ }
}
if widget.Template == "" {
@@ -45,22 +71,11 @@ func (widget *customAPIWidget) initialize() error {
widget.compiledTemplate = compiledTemplate
- req, err := http.NewRequest(http.MethodGet, widget.URL, nil)
- if err != nil {
- return err
- }
-
- for key, value := range widget.Headers {
- req.Header.Add(key, value)
- }
-
- widget.APIRequest = req
-
return nil
}
func (widget *customAPIWidget) update(ctx context.Context) {
- compiledHTML, err := fetchAndParseCustomAPI(widget.APIRequest, widget.compiledTemplate)
+ compiledHTML, err := fetchAndParseCustomAPI(widget.CustomAPIRequest, widget.Subrequests, widget.compiledTemplate)
if !widget.canContinueUpdateAfterHandlingErr(err) {
return
}
@@ -72,39 +87,212 @@ func (widget *customAPIWidget) Render() template.HTML {
return widget.renderTemplate(widget, customAPIWidgetTemplate)
}
-func fetchAndParseCustomAPI(req *http.Request, tmpl *template.Template) (template.HTML, error) {
- emptyBody := template.HTML("")
+func (req *CustomAPIRequest) initialize() error {
+ if req.URL == "" {
+ return errors.New("URL is required")
+ }
- resp, err := defaultHTTPClient.Do(req)
+ if req.Body != nil {
+ if req.Method == "" {
+ req.Method = http.MethodPost
+ }
+
+ if req.BodyType == "" {
+ req.BodyType = "json"
+ }
+
+ if req.BodyType != "json" && req.BodyType != "string" {
+ return errors.New("invalid body type, must be either 'json' or 'string'")
+ }
+
+ switch req.BodyType {
+ case "json":
+ encoded, err := json.Marshal(req.Body)
+ if err != nil {
+ return fmt.Errorf("marshaling body: %v", err)
+ }
+
+ req.bodyReader = bytes.NewReader(encoded)
+ case "string":
+ bodyAsString, ok := req.Body.(string)
+ if !ok {
+ return errors.New("body must be a string when body-type is 'string'")
+ }
+
+ req.bodyReader = strings.NewReader(bodyAsString)
+ }
+
+ } else if req.Method == "" {
+ req.Method = http.MethodGet
+ }
+
+ httpReq, err := http.NewRequest(strings.ToUpper(req.Method), req.URL, req.bodyReader)
if err != nil {
- return emptyBody, err
+ return err
+ }
+
+ if len(req.Parameters) > 0 {
+ httpReq.URL.RawQuery = req.Parameters.toQueryString()
+ }
+
+ if req.BodyType == "json" {
+ httpReq.Header.Set("Content-Type", "application/json")
+ }
+
+ for key, value := range req.Headers {
+ httpReq.Header.Add(key, value)
+ }
+
+ req.httpRequest = httpReq
+
+ return nil
+}
+
+type customAPIResponseData struct {
+ JSON decoratedGJSONResult
+ Response *http.Response
+}
+
+type customAPITemplateData struct {
+ *customAPIResponseData
+ subrequests map[string]*customAPIResponseData
+}
+
+func (data *customAPITemplateData) JSONLines() []decoratedGJSONResult {
+ result := make([]decoratedGJSONResult, 0, 5)
+
+ gjson.ForEachLine(data.JSON.Raw, func(line gjson.Result) bool {
+ result = append(result, decoratedGJSONResult{line})
+ return true
+ })
+
+ return result
+}
+
+func (data *customAPITemplateData) Subrequest(key string) *customAPIResponseData {
+ req, exists := data.subrequests[key]
+ if !exists {
+ // We have to panic here since there's nothing sensible we can return and the
+ // lack of an error would cause requested data to return zero values which
+ // would be confusing from the user's perspective. Go's template module
+ // handles recovering from panics and will return the panic message as an
+ // error during template execution.
+ panic(fmt.Sprintf("subrequest with key %q has not been defined", key))
+ }
+
+ return req
+}
+
+func fetchCustomAPIRequest(ctx context.Context, req *CustomAPIRequest) (*customAPIResponseData, error) {
+ if req.bodyReader != nil {
+ req.bodyReader.Seek(0, io.SeekStart)
+ }
+
+ client := ternary(req.AllowInsecure, defaultInsecureHTTPClient, defaultHTTPClient)
+ resp, err := client.Do(req.httpRequest.WithContext(ctx))
+ if err != nil {
+ return nil, err
}
defer resp.Body.Close()
bodyBytes, err := io.ReadAll(resp.Body)
if err != nil {
- return emptyBody, err
+ return nil, err
}
- body := string(bodyBytes)
+ body := strings.TrimSpace(string(bodyBytes))
- if !gjson.Valid(body) {
- truncatedBody, isTruncated := limitStringLength(body, 100)
- if isTruncated {
- truncatedBody += "... <truncated>"
+ if !req.SkipJSONValidation && body != "" && !gjson.Valid(body) {
+ if 200 <= resp.StatusCode && resp.StatusCode < 300 {
+ truncatedBody, isTruncated := limitStringLength(body, 100)
+ if isTruncated {
+ truncatedBody += "... <truncated>"
+ }
+
+ slog.Error("Invalid response JSON in custom API widget", "url", req.httpRequest.URL.String(), "body", truncatedBody)
+ return nil, errors.New("invalid response JSON")
}
- slog.Error("Invalid response JSON in custom API widget", "url", req.URL.String(), "body", truncatedBody)
- return emptyBody, errors.New("invalid response JSON")
+ return nil, errors.New(fmt.Sprintf("%d %s", resp.StatusCode, http.StatusText(resp.StatusCode)))
+
}
- var templateBuffer bytes.Buffer
-
- data := CustomAPITemplateData{
+ data := &customAPIResponseData{
JSON: decoratedGJSONResult{gjson.Parse(body)},
Response: resp,
}
+ return data, nil
+}
+
+func fetchAndParseCustomAPI(
+ primaryReq *CustomAPIRequest,
+ subReqs map[string]*CustomAPIRequest,
+ tmpl *template.Template,
+) (template.HTML, error) {
+ var primaryData *customAPIResponseData
+ subData := make(map[string]*customAPIResponseData, len(subReqs))
+ var err error
+
+ if len(subReqs) == 0 {
+ // If there are no subrequests, we can fetch the primary request in a much simpler way
+ primaryData, err = fetchCustomAPIRequest(context.Background(), primaryReq)
+ } else {
+ // If there are subrequests, we need to fetch them concurrently
+ // and cancel all requests if any of them fail. There's probably
+ // a more elegant way to do this, but this works for now.
+ ctx, cancel := context.WithCancel(context.Background())
+ defer cancel()
+
+ var wg sync.WaitGroup
+ var mu sync.Mutex // protects subData and err
+
+ wg.Add(1)
+ go func() {
+ defer wg.Done()
+ var localErr error
+ primaryData, localErr = fetchCustomAPIRequest(ctx, primaryReq)
+ mu.Lock()
+ if localErr != nil && err == nil {
+ err = localErr
+ cancel()
+ }
+ mu.Unlock()
+ }()
+
+ for key, req := range subReqs {
+ wg.Add(1)
+ go func() {
+ defer wg.Done()
+ var localErr error
+ var data *customAPIResponseData
+ data, localErr = fetchCustomAPIRequest(ctx, req)
+ mu.Lock()
+ if localErr == nil {
+ subData[key] = data
+ } else if err == nil {
+ err = localErr
+ cancel()
+ }
+ mu.Unlock()
+ }()
+ }
+
+ wg.Wait()
+ }
+
+ emptyBody := template.HTML("")
+
+ if err != nil {
+ return emptyBody, err
+ }
+
+ data := customAPITemplateData{
+ customAPIResponseData: primaryData,
+ subrequests: subData,
+ }
+
+ var templateBuffer bytes.Buffer
err = tmpl.Execute(&templateBuffer, &data)
if err != nil {
return emptyBody, err
@@ -117,11 +305,6 @@ type decoratedGJSONResult struct {
gjson.Result
}
-type CustomAPITemplateData struct {
- JSON decoratedGJSONResult
- Response *http.Response
-}
-
func gJsonResultArrayToDecoratedResultArray(results []gjson.Result) []decoratedGJSONResult {
decoratedResults := make([]decoratedGJSONResult, len(results))
@@ -132,12 +315,16 @@ func gJsonResultArrayToDecoratedResultArray(results []gjson.Result) []decoratedG
return decoratedResults
}
+func (r *decoratedGJSONResult) Exists(key string) bool {
+ return r.Result.Get(key).Exists()
+}
+
func (r *decoratedGJSONResult) Array(key string) []decoratedGJSONResult {
if key == "" {
return gJsonResultArrayToDecoratedResultArray(r.Result.Array())
}
- return gJsonResultArrayToDecoratedResultArray(r.Get(key).Array())
+ return gJsonResultArrayToDecoratedResultArray(r.Result.Get(key).Array())
}
func (r *decoratedGJSONResult) String(key string) string {
@@ -145,15 +332,15 @@ func (r *decoratedGJSONResult) String(key string) string {
return r.Result.String()
}
- return r.Get(key).String()
+ return r.Result.Get(key).String()
}
-func (r *decoratedGJSONResult) Int(key string) int64 {
+func (r *decoratedGJSONResult) Int(key string) int {
if key == "" {
- return r.Result.Int()
+ return int(r.Result.Int())
}
- return r.Get(key).Int()
+ return int(r.Result.Get(key).Int())
}
func (r *decoratedGJSONResult) Float(key string) float64 {
@@ -161,7 +348,7 @@ func (r *decoratedGJSONResult) Float(key string) float64 {
return r.Result.Float()
}
- return r.Get(key).Float()
+ return r.Result.Get(key).Float()
}
func (r *decoratedGJSONResult) Bool(key string) bool {
@@ -169,40 +356,253 @@ func (r *decoratedGJSONResult) Bool(key string) bool {
return r.Result.Bool()
}
- return r.Get(key).Bool()
+ return r.Result.Get(key).Bool()
+}
+
+func (r *decoratedGJSONResult) Get(key string) *decoratedGJSONResult {
+ return &decoratedGJSONResult{r.Result.Get(key)}
+}
+
+func customAPIDoMathOp[T int | float64](a, b T, op string) T {
+ switch op {
+ case "add":
+ return a + b
+ case "sub":
+ return a - b
+ case "mul":
+ return a * b
+ case "div":
+ if b == 0 {
+ return 0
+ }
+ return a / b
+ }
+ return 0
}
var customAPITemplateFuncs = func() template.FuncMap {
+ var regexpCacheMu sync.Mutex
+ var regexpCache = make(map[string]*regexp.Regexp)
+
+ getCachedRegexp := func(pattern string) *regexp.Regexp {
+ regexpCacheMu.Lock()
+ defer regexpCacheMu.Unlock()
+
+ regex, exists := regexpCache[pattern]
+ if !exists {
+ regex = regexp.MustCompile(pattern)
+ regexpCache[pattern] = regex
+ }
+
+ return regex
+ }
+
+ doMathOpWithAny := func(a, b any, op string) any {
+ switch at := a.(type) {
+ case int:
+ switch bt := b.(type) {
+ case int:
+ return customAPIDoMathOp(at, bt, op)
+ case float64:
+ return customAPIDoMathOp(float64(at), bt, op)
+ default:
+ return math.NaN()
+ }
+ case float64:
+ switch bt := b.(type) {
+ case int:
+ return customAPIDoMathOp(at, float64(bt), op)
+ case float64:
+ return customAPIDoMathOp(at, bt, op)
+ default:
+ return math.NaN()
+ }
+ default:
+ return math.NaN()
+ }
+ }
+
funcs := template.FuncMap{
- "toFloat": func(a int64) float64 {
+ "toFloat": func(a int) float64 {
return float64(a)
},
- "toInt": func(a float64) int64 {
- return int64(a)
+ "toInt": func(a float64) int {
+ return int(a)
},
- "mathexpr": func(left float64, op string, right float64) float64 {
- if right == 0 {
+ "add": func(a, b any) any {
+ return doMathOpWithAny(a, b, "add")
+ },
+ "sub": func(a, b any) any {
+ return doMathOpWithAny(a, b, "sub")
+ },
+ "mul": func(a, b any) any {
+ return doMathOpWithAny(a, b, "mul")
+ },
+ "div": func(a, b any) any {
+ return doMathOpWithAny(a, b, "div")
+ },
+ "now": func() time.Time {
+ return time.Now()
+ },
+ "offsetNow": func(offset string) time.Time {
+ d, err := time.ParseDuration(offset)
+ if err != nil {
+ return time.Now()
+ }
+ return time.Now().Add(d)
+ },
+ "duration": func(str string) time.Duration {
+ d, err := time.ParseDuration(str)
+ if err != nil {
return 0
}
- switch op {
- case "+":
- return left + right
- case "-":
- return left - right
- case "*":
- return left * right
- case "/":
- return left / right
- default:
- return 0
+ return d
+ },
+ "parseTime": func(layout, value string) time.Time {
+ return customAPIFuncParseTimeInLocation(layout, value, time.UTC)
+ },
+ "parseLocalTime": func(layout, value string) time.Time {
+ return customAPIFuncParseTimeInLocation(layout, value, time.Local)
+ },
+ "toRelativeTime": dynamicRelativeTimeAttrs,
+ "parseRelativeTime": func(layout, value string) template.HTMLAttr {
+ // Shorthand to do both of the above with a single function call
+ return dynamicRelativeTimeAttrs(customAPIFuncParseTimeInLocation(layout, value, time.UTC))
+ },
+ // The reason we flip the parameter order is so that you can chain multiple calls together like this:
+ // {{ .JSON.String "foo" | trimPrefix "bar" | doSomethingElse }}
+ // instead of doing this:
+ // {{ trimPrefix (.JSON.String "foo") "bar" | doSomethingElse }}
+ // since the piped value gets passed as the last argument to the function.
+ "trimPrefix": func(prefix, s string) string {
+ return strings.TrimPrefix(s, prefix)
+ },
+ "trimSuffix": func(suffix, s string) string {
+ return strings.TrimSuffix(s, suffix)
+ },
+ "trimSpace": strings.TrimSpace,
+ "replaceAll": func(old, new, s string) string {
+ return strings.ReplaceAll(s, old, new)
+ },
+ "replaceMatches": func(pattern, replacement, s string) string {
+ if s == "" {
+ return ""
}
+
+ return getCachedRegexp(pattern).ReplaceAllString(s, replacement)
+ },
+ "findMatch": func(pattern, s string) string {
+ if s == "" {
+ return ""
+ }
+
+ return getCachedRegexp(pattern).FindString(s)
+ },
+ "findSubmatch": func(pattern, s string) string {
+ if s == "" {
+ return ""
+ }
+
+ regex := getCachedRegexp(pattern)
+ return itemAtIndexOrDefault(regex.FindStringSubmatch(s), 1, "")
+ },
+ "sortByString": func(key, order string, results []decoratedGJSONResult) []decoratedGJSONResult {
+ sort.Slice(results, func(a, b int) bool {
+ if order == "asc" {
+ return results[a].String(key) < results[b].String(key)
+ }
+
+ return results[a].String(key) > results[b].String(key)
+ })
+
+ return results
+ },
+ "sortByInt": func(key, order string, results []decoratedGJSONResult) []decoratedGJSONResult {
+ sort.Slice(results, func(a, b int) bool {
+ if order == "asc" {
+ return results[a].Int(key) < results[b].Int(key)
+ }
+
+ return results[a].Int(key) > results[b].Int(key)
+ })
+
+ return results
+ },
+ "sortByFloat": func(key, order string, results []decoratedGJSONResult) []decoratedGJSONResult {
+ sort.Slice(results, func(a, b int) bool {
+ if order == "asc" {
+ return results[a].Float(key) < results[b].Float(key)
+ }
+
+ return results[a].Float(key) > results[b].Float(key)
+ })
+
+ return results
+ },
+ "sortByTime": func(key, layout, order string, results []decoratedGJSONResult) []decoratedGJSONResult {
+ sort.Slice(results, func(a, b int) bool {
+ timeA := customAPIFuncParseTimeInLocation(layout, results[a].String(key), time.UTC)
+ timeB := customAPIFuncParseTimeInLocation(layout, results[b].String(key), time.UTC)
+
+ if order == "asc" {
+ return timeA.Before(timeB)
+ }
+
+ return timeA.After(timeB)
+ })
+
+ return results
+ },
+ "concat": func(items ...string) string {
+ return strings.Join(items, "")
+ },
+ "unique": func(key string, results []decoratedGJSONResult) []decoratedGJSONResult {
+ seen := make(map[string]struct{})
+ out := make([]decoratedGJSONResult, 0, len(results))
+ for _, result := range results {
+ val := result.String(key)
+ if _, ok := seen[val]; !ok {
+ seen[val] = struct{}{}
+ out = append(out, result)
+ }
+ }
+ return out
},
}
for key, value := range globalTemplateFunctions {
- funcs[key] = value
+ if _, exists := funcs[key]; !exists {
+ funcs[key] = value
+ }
}
return funcs
}()
+
+func customAPIFuncParseTimeInLocation(layout, value string, loc *time.Location) time.Time {
+ switch strings.ToLower(layout) {
+ case "unix":
+ asInt, err := strconv.ParseInt(value, 10, 64)
+ if err != nil {
+ return time.Unix(0, 0)
+ }
+
+ return time.Unix(asInt, 0)
+ case "rfc3339":
+ layout = time.RFC3339
+ case "rfc3339nano":
+ layout = time.RFC3339Nano
+ case "datetime":
+ layout = time.DateTime
+ case "dateonly":
+ layout = time.DateOnly
+ }
+
+ parsed, err := time.ParseInLocation(layout, value, loc)
+ if err != nil {
+ return time.Unix(0, 0)
+ }
+
+ return parsed
+}
diff --git a/internal/glance/widget-dns-stats.go b/internal/glance/widget-dns-stats.go
index 833a80d..7311b1b 100644
--- a/internal/glance/widget-dns-stats.go
+++ b/internal/glance/widget-dns-stats.go
@@ -1,24 +1,35 @@
package glance
import (
+ "bytes"
"context"
"encoding/json"
"errors"
+ "fmt"
"html/template"
+ "io"
"log/slog"
"net/http"
"sort"
"strings"
+ "sync"
"time"
)
var dnsStatsWidgetTemplate = mustParseTemplate("dns-stats.html", "widget-base.html")
+const (
+ dnsStatsBars = 8
+ dnsStatsHoursSpan = 24
+ dnsStatsHoursPerBar int = dnsStatsHoursSpan / dnsStatsBars
+)
+
type dnsStatsWidget struct {
widgetBase `yaml:",inline"`
- TimeLabels [8]string `yaml:"-"`
- Stats *dnsStats `yaml:"-"`
+ TimeLabels [8]string `yaml:"-"`
+ Stats *dnsStats `yaml:"-"`
+ piholeSessionID string `yaml:"-"`
HourFormat string `yaml:"hour-format"`
HideGraph bool `yaml:"hide-graph"`
@@ -31,11 +42,18 @@ type dnsStatsWidget struct {
Password string `yaml:"password"`
}
+const (
+ dnsServiceAdguard = "adguard"
+ dnsServicePihole = "pihole"
+ dnsServiceTechnitium = "technitium"
+ dnsServicePiholeV6 = "pihole-v6"
+)
+
func makeDNSWidgetTimeLabels(format string) [8]string {
now := time.Now()
- var labels [8]string
+ var labels [dnsStatsBars]string
- for h := 24; h > 0; h -= 3 {
+ for h := dnsStatsHoursSpan; h > 0; h -= dnsStatsHoursPerBar {
labels[7-(h/3-1)] = strings.ToLower(now.Add(-time.Duration(h) * time.Hour).Format(format))
}
@@ -43,13 +61,24 @@ func makeDNSWidgetTimeLabels(format string) [8]string {
}
func (widget *dnsStatsWidget) initialize() error {
+ titleURL := strings.TrimRight(widget.URL, "/")
+ switch widget.Service {
+ case dnsServicePihole, dnsServicePiholeV6:
+ titleURL = titleURL + "/admin"
+ }
+
widget.
withTitle("DNS Stats").
- withTitleURL(string(widget.URL)).
+ withTitleURL(titleURL).
withCacheDuration(10 * time.Minute)
- if widget.Service != "adguard" && widget.Service != "pihole" {
- return errors.New("service must be either 'adguard' or 'pihole'")
+ switch widget.Service {
+ case dnsServiceAdguard:
+ case dnsServicePiholeV6:
+ case dnsServicePihole:
+ case dnsServiceTechnitium:
+ default:
+ return fmt.Errorf("service must be one of: %s, %s, %s, %s", dnsServiceAdguard, dnsServicePihole, dnsServicePiholeV6, dnsServiceTechnitium)
}
return nil
@@ -59,10 +88,26 @@ func (widget *dnsStatsWidget) update(ctx context.Context) {
var stats *dnsStats
var err error
- if widget.Service == "adguard" {
+ switch widget.Service {
+ case dnsServiceAdguard:
stats, err = fetchAdguardStats(widget.URL, widget.AllowInsecure, widget.Username, widget.Password, widget.HideGraph)
- } else {
- stats, err = fetchPiholeStats(widget.URL, widget.AllowInsecure, widget.Token, widget.HideGraph)
+ case dnsServicePihole:
+ stats, err = fetchPihole5Stats(widget.URL, widget.AllowInsecure, widget.Token, widget.HideGraph)
+ case dnsServiceTechnitium:
+ stats, err = fetchTechnitiumStats(widget.URL, widget.AllowInsecure, widget.Token, widget.HideGraph)
+ case dnsServicePiholeV6:
+ var newSessionID string
+ stats, newSessionID, err = fetchPiholeStats(
+ widget.URL,
+ widget.AllowInsecure,
+ widget.Password,
+ widget.piholeSessionID,
+ !widget.HideGraph,
+ !widget.HideTopDomains,
+ )
+ if err == nil {
+ widget.piholeSessionID = newSessionID
+ }
}
if !widget.canContinueUpdateAfterHandlingErr(err) {
@@ -84,11 +129,11 @@ func (widget *dnsStatsWidget) Render() template.HTML {
type dnsStats struct {
TotalQueries int
- BlockedQueries int
+ BlockedQueries int // we don't actually use this anywhere in templates, maybe remove it later?
BlockedPercent int
ResponseTime int
DomainsBlocked int
- Series [8]dnsStatsSeries
+ Series [dnsStatsBars]dnsStatsSeries
TopBlockedDomains []dnsStatsBlockedDomain
}
@@ -123,13 +168,7 @@ func fetchAdguardStats(instanceURL string, allowInsecure bool, username, passwor
request.SetBasicAuth(username, password)
- var client requestDoer
- if !allowInsecure {
- client = defaultHTTPClient
- } else {
- client = defaultInsecureHTTPClient
- }
-
+ var client = ternary(allowInsecure, defaultInsecureHTTPClient, defaultHTTPClient)
responseJson, err := decodeJsonFromRequest[adguardStatsResponse](client, request)
if err != nil {
return nil, err
@@ -150,7 +189,7 @@ func fetchAdguardStats(instanceURL string, allowInsecure bool, username, passwor
stats.BlockedPercent = int(float64(responseJson.BlockedQueries) / float64(responseJson.TotalQueries) * 100)
- for i := 0; i < topBlockedDomainsCount; i++ {
+ for i := range topBlockedDomainsCount {
domain := responseJson.TopBlockedDomains[i]
var firstDomain string
@@ -179,31 +218,27 @@ func fetchAdguardStats(instanceURL string, allowInsecure bool, username, passwor
queriesSeries := responseJson.QueriesSeries
blockedSeries := responseJson.BlockedSeries
- const bars = 8
- const hoursSpan = 24
- const hoursPerBar int = hoursSpan / bars
-
- if len(queriesSeries) > hoursSpan {
- queriesSeries = queriesSeries[len(queriesSeries)-hoursSpan:]
- } else if len(queriesSeries) < hoursSpan {
- queriesSeries = append(make([]int, hoursSpan-len(queriesSeries)), queriesSeries...)
+ if len(queriesSeries) > dnsStatsHoursSpan {
+ queriesSeries = queriesSeries[len(queriesSeries)-dnsStatsHoursSpan:]
+ } else if len(queriesSeries) < dnsStatsHoursSpan {
+ queriesSeries = append(make([]int, dnsStatsHoursSpan-len(queriesSeries)), queriesSeries...)
}
- if len(blockedSeries) > hoursSpan {
- blockedSeries = blockedSeries[len(blockedSeries)-hoursSpan:]
- } else if len(blockedSeries) < hoursSpan {
- blockedSeries = append(make([]int, hoursSpan-len(blockedSeries)), blockedSeries...)
+ if len(blockedSeries) > dnsStatsHoursSpan {
+ blockedSeries = blockedSeries[len(blockedSeries)-dnsStatsHoursSpan:]
+ } else if len(blockedSeries) < dnsStatsHoursSpan {
+ blockedSeries = append(make([]int, dnsStatsHoursSpan-len(blockedSeries)), blockedSeries...)
}
maxQueriesInSeries := 0
- for i := 0; i < bars; i++ {
+ for i := range dnsStatsBars {
queries := 0
blocked := 0
- for j := 0; j < hoursPerBar; j++ {
- queries += queriesSeries[i*hoursPerBar+j]
- blocked += blockedSeries[i*hoursPerBar+j]
+ for j := range dnsStatsHoursPerBar {
+ queries += queriesSeries[i*dnsStatsHoursPerBar+j]
+ blocked += blockedSeries[i*dnsStatsHoursPerBar+j]
}
stats.Series[i] = dnsStatsSeries{
@@ -220,35 +255,36 @@ func fetchAdguardStats(instanceURL string, allowInsecure bool, username, passwor
}
}
- for i := 0; i < bars; i++ {
+ for i := range dnsStatsBars {
stats.Series[i].PercentTotal = int(float64(stats.Series[i].Queries) / float64(maxQueriesInSeries) * 100)
}
return stats, nil
}
-type piholeStatsResponse struct {
- TotalQueries int `json:"dns_queries_today"`
- QueriesSeries piholeQueriesSeries `json:"domains_over_time"`
- BlockedQueries int `json:"ads_blocked_today"`
- BlockedSeries map[int64]int `json:"ads_over_time"`
- BlockedPercentage float64 `json:"ads_percentage_today"`
- TopBlockedDomains piholeTopBlockedDomains `json:"top_ads"`
- DomainsBlocked int `json:"domains_being_blocked"`
+// Legacy Pi-hole stats response (before v6)
+type pihole5StatsResponse struct {
+ TotalQueries int `json:"dns_queries_today"`
+ QueriesSeries pihole5QueriesSeries `json:"domains_over_time"`
+ BlockedQueries int `json:"ads_blocked_today"`
+ BlockedSeries map[int64]int `json:"ads_over_time"`
+ BlockedPercentage float64 `json:"ads_percentage_today"`
+ TopBlockedDomains pihole5TopBlockedDomains `json:"top_ads"`
+ DomainsBlocked int `json:"domains_being_blocked"`
}
// If the user has query logging disabled it's possible for domains_over_time to be returned as an
// empty array rather than a map which will prevent unmashalling the rest of the data so we use
// custom unmarshal behavior to fallback to an empty map.
// See https://github.com/glanceapp/glance/issues/289
-type piholeQueriesSeries map[int64]int
+type pihole5QueriesSeries map[int64]int
-func (p *piholeQueriesSeries) UnmarshalJSON(data []byte) error {
+func (p *pihole5QueriesSeries) UnmarshalJSON(data []byte) error {
temp := make(map[int64]int)
err := json.Unmarshal(data, &temp)
if err != nil {
- *p = make(piholeQueriesSeries)
+ *p = make(pihole5QueriesSeries)
} else {
*p = temp
}
@@ -258,16 +294,16 @@ func (p *piholeQueriesSeries) UnmarshalJSON(data []byte) error {
// If user has some level of privacy enabled on Pihole, `json:"top_ads"` is an empty array
// Use custom unmarshal behavior to avoid not getting the rest of the valid data when unmarshalling
-type piholeTopBlockedDomains map[string]int
+type pihole5TopBlockedDomains map[string]int
-func (p *piholeTopBlockedDomains) UnmarshalJSON(data []byte) error {
+func (p *pihole5TopBlockedDomains) UnmarshalJSON(data []byte) error {
// NOTE: do not change to piholeTopBlockedDomains type here or it will cause a stack overflow
// because of the UnmarshalJSON method getting called recursively
temp := make(map[string]int)
err := json.Unmarshal(data, &temp)
if err != nil {
- *p = make(piholeTopBlockedDomains)
+ *p = make(pihole5TopBlockedDomains)
} else {
*p = temp
}
@@ -275,7 +311,7 @@ func (p *piholeTopBlockedDomains) UnmarshalJSON(data []byte) error {
return nil
}
-func fetchPiholeStats(instanceURL string, allowInsecure bool, token string, noGraph bool) (*dnsStats, error) {
+func fetchPihole5Stats(instanceURL string, allowInsecure bool, token string, noGraph bool) (*dnsStats, error) {
if token == "" {
return nil, errors.New("missing API token")
}
@@ -288,14 +324,8 @@ func fetchPiholeStats(instanceURL string, allowInsecure bool, token string, noGr
return nil, err
}
- var client requestDoer
- if !allowInsecure {
- client = defaultHTTPClient
- } else {
- client = defaultInsecureHTTPClient
- }
-
- responseJson, err := decodeJsonFromRequest[piholeStatsResponse](client, request)
+ var client = ternary(allowInsecure, defaultInsecureHTTPClient, defaultHTTPClient)
+ responseJson, err := decodeJsonFromRequest[pihole5StatsResponse](client, request)
if err != nil {
return nil, err
}
@@ -339,7 +369,6 @@ func fetchPiholeStats(instanceURL string, allowInsecure bool, token string, noGr
}
var lowestTimestamp int64 = 0
-
for timestamp := range responseJson.QueriesSeries {
if lowestTimestamp == 0 || timestamp < lowestTimestamp {
lowestTimestamp = timestamp
@@ -348,11 +377,11 @@ func fetchPiholeStats(instanceURL string, allowInsecure bool, token string, noGr
maxQueriesInSeries := 0
- for i := 0; i < 8; i++ {
+ for i := range dnsStatsBars {
queries := 0
blocked := 0
- for j := 0; j < 18; j++ {
+ for j := range 18 {
index := lowestTimestamp + int64(i*10800+j*600)
queries += responseJson.QueriesSeries[index]
@@ -373,7 +402,417 @@ func fetchPiholeStats(instanceURL string, allowInsecure bool, token string, noGr
}
}
- for i := 0; i < 8; i++ {
+ for i := range dnsStatsBars {
+ stats.Series[i].PercentTotal = int(float64(stats.Series[i].Queries) / float64(maxQueriesInSeries) * 100)
+ }
+
+ return stats, nil
+}
+
+func fetchPiholeStats(
+ instanceURL string,
+ allowInsecure bool,
+ password string,
+ sessionID string,
+ includeGraph bool,
+ includeTopDomains bool,
+) (*dnsStats, string, error) {
+ instanceURL = strings.TrimRight(instanceURL, "/")
+ var client = ternary(allowInsecure, defaultInsecureHTTPClient, defaultHTTPClient)
+
+ fetchNewSessionID := func() error {
+ newSessionID, err := fetchPiholeSessionID(instanceURL, client, password)
+ if err != nil {
+ return err
+ }
+ sessionID = newSessionID
+ return nil
+ }
+
+ if sessionID == "" {
+ if err := fetchNewSessionID(); err != nil {
+ slog.Error("Failed to fetch Pihole v6 session ID", "error", err)
+ return nil, "", fmt.Errorf("fetching session ID: %v", err)
+ }
+ } else {
+ isValid, err := checkPiholeSessionIDIsValid(instanceURL, client, sessionID)
+ if err != nil {
+ slog.Error("Failed to check Pihole v6 session ID validity", "error", err)
+ return nil, "", fmt.Errorf("checking session ID: %v", err)
+ }
+
+ if !isValid {
+ if err := fetchNewSessionID(); err != nil {
+ slog.Error("Failed to renew Pihole v6 session ID", "error", err)
+ return nil, "", fmt.Errorf("renewing session ID: %v", err)
+ }
+ }
+ }
+
+ var wg sync.WaitGroup
+ ctx, cancel := context.WithCancel(context.Background())
+ defer cancel()
+
+ type statsResponseJson struct {
+ Queries struct {
+ Total int `json:"total"`
+ Blocked int `json:"blocked"`
+ PercentBlocked float64 `json:"percent_blocked"`
+ } `json:"queries"`
+ Gravity struct {
+ DomainsBlocked int `json:"domains_being_blocked"`
+ } `json:"gravity"`
+ }
+
+ statsRequest, _ := http.NewRequestWithContext(ctx, "GET", instanceURL+"/api/stats/summary", nil)
+ statsRequest.Header.Set("x-ftl-sid", sessionID)
+
+ var statsResponse statsResponseJson
+ var statsErr error
+
+ wg.Add(1)
+ go func() {
+ defer wg.Done()
+ statsResponse, statsErr = decodeJsonFromRequest[statsResponseJson](client, statsRequest)
+ if statsErr != nil {
+ cancel()
+ }
+ }()
+
+ type seriesResponseJson struct {
+ History []struct {
+ Timestamp int64 `json:"timestamp"`
+ Total int `json:"total"`
+ Blocked int `json:"blocked"`
+ } `json:"history"`
+ }
+
+ var seriesResponse seriesResponseJson
+ var seriesErr error
+
+ if includeGraph {
+ seriesRequest, _ := http.NewRequestWithContext(ctx, "GET", instanceURL+"/api/history", nil)
+ seriesRequest.Header.Set("x-ftl-sid", sessionID)
+
+ wg.Add(1)
+ go func() {
+ defer wg.Done()
+ seriesResponse, seriesErr = decodeJsonFromRequest[seriesResponseJson](client, seriesRequest)
+ }()
+ }
+
+ type topDomainsResponseJson struct {
+ Domains []struct {
+ Domain string `json:"domain"`
+ Count int `json:"count"`
+ } `json:"domains"`
+ TotalQueries int `json:"total_queries"`
+ BlockedQueries int `json:"blocked_queries"`
+ Took float64 `json:"took"`
+ }
+
+ var topDomainsResponse topDomainsResponseJson
+ var topDomainsErr error
+
+ if includeTopDomains {
+ topDomainsRequest, _ := http.NewRequestWithContext(ctx, "GET", instanceURL+"/api/stats/top_domains?blocked=true", nil)
+ topDomainsRequest.Header.Set("x-ftl-sid", sessionID)
+
+ wg.Add(1)
+ go func() {
+ defer wg.Done()
+ topDomainsResponse, topDomainsErr = decodeJsonFromRequest[topDomainsResponseJson](client, topDomainsRequest)
+ }()
+ }
+
+ wg.Wait()
+ partialContent := false
+
+ if statsErr != nil {
+ return nil, "", fmt.Errorf("fetching stats: %v", statsErr)
+ }
+
+ if includeGraph && seriesErr != nil {
+ slog.Error("Failed to fetch Pihole v6 graph data", "error", seriesErr)
+ partialContent = true
+ }
+
+ if includeTopDomains && topDomainsErr != nil {
+ slog.Error("Failed to fetch Pihole v6 top domains", "error", topDomainsErr)
+ partialContent = true
+ }
+
+ stats := &dnsStats{
+ TotalQueries: statsResponse.Queries.Total,
+ BlockedQueries: statsResponse.Queries.Blocked,
+ BlockedPercent: int(statsResponse.Queries.PercentBlocked),
+ DomainsBlocked: statsResponse.Gravity.DomainsBlocked,
+ }
+
+ if includeGraph && seriesErr == nil {
+ if len(seriesResponse.History) != 145 {
+ slog.Error(
+ "Pihole v6 graph data has unexpected length",
+ "length", len(seriesResponse.History),
+ "expected", 145,
+ )
+ partialContent = true
+ } else {
+ // The API from v5 used to return 144 data points, but v6 returns 145.
+ // We only show data from the last 24 hours hours, Pihole returns data
+ // points in a 10 minute interval, 24*(60/10) = 144. Why is there an extra
+ // data point? I don't know, but we'll just ignore the first one since it's
+ // the oldest data point.
+ history := seriesResponse.History[1:]
+
+ const interval = 10
+ const dataPointsPerBar = dnsStatsHoursPerBar * (60 / interval)
+
+ maxQueriesInSeries := 0
+
+ for i := range dnsStatsBars {
+ queries := 0
+ blocked := 0
+ for j := range dataPointsPerBar {
+ index := i*dataPointsPerBar + j
+ queries += history[index].Total
+ blocked += history[index].Blocked
+ }
+ if queries > maxQueriesInSeries {
+ maxQueriesInSeries = queries
+ }
+ stats.Series[i] = dnsStatsSeries{
+ Queries: queries,
+ Blocked: blocked,
+ }
+ if queries > 0 {
+ stats.Series[i].PercentBlocked = int(float64(blocked) / float64(queries) * 100)
+ }
+ }
+
+ for i := range dnsStatsBars {
+ stats.Series[i].PercentTotal = int(float64(stats.Series[i].Queries) / float64(maxQueriesInSeries) * 100)
+ }
+ }
+ }
+
+ if includeTopDomains && topDomainsErr == nil && len(topDomainsResponse.Domains) > 0 {
+ domains := make([]dnsStatsBlockedDomain, 0, len(topDomainsResponse.Domains))
+ for i := range topDomainsResponse.Domains {
+ d := &topDomainsResponse.Domains[i]
+ domains = append(domains, dnsStatsBlockedDomain{
+ Domain: d.Domain,
+ PercentBlocked: int(float64(d.Count) / float64(statsResponse.Queries.Blocked) * 100),
+ })
+ }
+
+ sort.Slice(domains, func(a, b int) bool {
+ return domains[a].PercentBlocked > domains[b].PercentBlocked
+ })
+ stats.TopBlockedDomains = domains[:min(len(domains), 5)]
+ }
+
+ return stats, sessionID, ternary(partialContent, errPartialContent, nil)
+}
+
+func fetchPiholeSessionID(instanceURL string, client *http.Client, password string) (string, error) {
+ requestBody := []byte(`{"password":"` + password + `"}`)
+
+ request, err := http.NewRequest("POST", instanceURL+"/api/auth", bytes.NewBuffer(requestBody))
+ if err != nil {
+ return "", fmt.Errorf("creating authentication request: %v", err)
+ }
+ request.Header.Set("Content-Type", "application/json")
+
+ response, err := client.Do(request)
+ if err != nil {
+ return "", fmt.Errorf("sending authentication request: %v", err)
+ }
+ defer response.Body.Close()
+
+ body, err := io.ReadAll(response.Body)
+ if err != nil {
+ return "", fmt.Errorf("reading authentication response: %v", err)
+ }
+
+ var jsonResponse struct {
+ Session struct {
+ SID string `json:"sid"`
+ Message string `json:"message"`
+ } `json:"session"`
+ }
+
+ if err := json.Unmarshal(body, &jsonResponse); err != nil {
+ return "", fmt.Errorf("parsing authentication response: %v", err)
+ }
+
+ if response.StatusCode != http.StatusOK {
+ return "", fmt.Errorf(
+ "authentication request returned status %s with message '%s'",
+ response.Status, jsonResponse.Session.Message,
+ )
+ }
+
+ if jsonResponse.Session.SID == "" {
+ return "", fmt.Errorf(
+ "authentication response returned empty session ID, status code %d, message '%s'",
+ response.StatusCode, jsonResponse.Session.Message,
+ )
+ }
+
+ return jsonResponse.Session.SID, nil
+}
+
+func checkPiholeSessionIDIsValid(instanceURL string, client *http.Client, sessionID string) (bool, error) {
+ request, err := http.NewRequest("GET", instanceURL+"/api/auth", nil)
+ if err != nil {
+ return false, fmt.Errorf("creating session ID check request: %v", err)
+ }
+ request.Header.Set("x-ftl-sid", sessionID)
+
+ response, err := client.Do(request)
+ if err != nil {
+ return false, err
+ }
+ defer response.Body.Close()
+
+ if response.StatusCode != http.StatusOK && response.StatusCode != http.StatusUnauthorized {
+ return false, fmt.Errorf("session ID check request returned status %s", response.Status)
+ }
+
+ return response.StatusCode == http.StatusOK, nil
+}
+
+type technitiumStatsResponse struct {
+ Response struct {
+ Stats struct {
+ TotalQueries int `json:"totalQueries"`
+ BlockedQueries int `json:"totalBlocked"`
+ BlockedZones int `json:"blockedZones"`
+ BlockListZones int `json:"blockListZones"`
+ } `json:"stats"`
+ MainChartData struct {
+ Datasets []struct {
+ Label string `json:"label"`
+ Data []int `json:"data"`
+ } `json:"datasets"`
+ } `json:"mainChartData"`
+ TopBlockedDomains []struct {
+ Domain string `json:"name"`
+ Count int `json:"hits"`
+ }
+ } `json:"response"`
+}
+
+func fetchTechnitiumStats(instanceUrl string, allowInsecure bool, token string, noGraph bool) (*dnsStats, error) {
+ if token == "" {
+ return nil, errors.New("missing API token")
+ }
+
+ requestURL := strings.TrimRight(instanceUrl, "/") + "/api/dashboard/stats/get?token=" + token + "&type=LastDay"
+
+ request, err := http.NewRequest("GET", requestURL, nil)
+ if err != nil {
+ return nil, err
+ }
+
+ var client requestDoer
+ if !allowInsecure {
+ client = defaultHTTPClient
+ } else {
+ client = defaultInsecureHTTPClient
+ }
+
+ responseJson, err := decodeJsonFromRequest[technitiumStatsResponse](client, request)
+ if err != nil {
+ return nil, err
+ }
+
+ var topBlockedDomainsCount = min(len(responseJson.Response.TopBlockedDomains), 5)
+
+ stats := &dnsStats{
+ TotalQueries: responseJson.Response.Stats.TotalQueries,
+ BlockedQueries: responseJson.Response.Stats.BlockedQueries,
+ TopBlockedDomains: make([]dnsStatsBlockedDomain, 0, topBlockedDomainsCount),
+ DomainsBlocked: responseJson.Response.Stats.BlockedZones + responseJson.Response.Stats.BlockListZones,
+ }
+
+ if stats.TotalQueries <= 0 {
+ return stats, nil
+ }
+
+ stats.BlockedPercent = int(float64(responseJson.Response.Stats.BlockedQueries) / float64(responseJson.Response.Stats.TotalQueries) * 100)
+
+ for i := 0; i < topBlockedDomainsCount; i++ {
+ domain := responseJson.Response.TopBlockedDomains[i]
+ firstDomain := domain.Domain
+
+ if firstDomain == "" {
+ continue
+ }
+
+ stats.TopBlockedDomains = append(stats.TopBlockedDomains, dnsStatsBlockedDomain{
+ Domain: firstDomain,
+ })
+
+ if stats.BlockedQueries > 0 {
+ stats.TopBlockedDomains[i].PercentBlocked = int(float64(domain.Count) / float64(responseJson.Response.Stats.BlockedQueries) * 100)
+ }
+ }
+
+ if noGraph {
+ return stats, nil
+ }
+
+ var queriesSeries, blockedSeries []int
+
+ for _, label := range responseJson.Response.MainChartData.Datasets {
+ switch label.Label {
+ case "Total":
+ queriesSeries = label.Data
+ case "Blocked":
+ blockedSeries = label.Data
+ }
+ }
+
+ if len(queriesSeries) > dnsStatsHoursSpan {
+ queriesSeries = queriesSeries[len(queriesSeries)-dnsStatsHoursSpan:]
+ } else if len(queriesSeries) < dnsStatsHoursSpan {
+ queriesSeries = append(make([]int, dnsStatsHoursSpan-len(queriesSeries)), queriesSeries...)
+ }
+
+ if len(blockedSeries) > dnsStatsHoursSpan {
+ blockedSeries = blockedSeries[len(blockedSeries)-dnsStatsHoursSpan:]
+ } else if len(blockedSeries) < dnsStatsHoursSpan {
+ blockedSeries = append(make([]int, dnsStatsHoursSpan-len(blockedSeries)), blockedSeries...)
+ }
+
+ maxQueriesInSeries := 0
+
+ for i := 0; i < dnsStatsBars; i++ {
+ queries := 0
+ blocked := 0
+
+ for j := 0; j < dnsStatsHoursPerBar; j++ {
+ queries += queriesSeries[i*dnsStatsHoursPerBar+j]
+ blocked += blockedSeries[i*dnsStatsHoursPerBar+j]
+ }
+
+ stats.Series[i] = dnsStatsSeries{
+ Queries: queries,
+ Blocked: blocked,
+ }
+
+ if queries > 0 {
+ stats.Series[i].PercentBlocked = int(float64(blocked) / float64(queries) * 100)
+ }
+
+ if queries > maxQueriesInSeries {
+ maxQueriesInSeries = queries
+ }
+ }
+
+ for i := 0; i < dnsStatsBars; i++ {
stats.Series[i].PercentTotal = int(float64(stats.Series[i].Queries) / float64(maxQueriesInSeries) * 100)
}
diff --git a/internal/glance/widget-docker-containers.go b/internal/glance/widget-docker-containers.go
index e133dd8..702a34b 100644
--- a/internal/glance/widget-docker-containers.go
+++ b/internal/glance/widget-docker-containers.go
@@ -7,6 +7,7 @@ import (
"html/template"
"net"
"net/http"
+ "net/url"
"sort"
"strings"
"time"
@@ -15,10 +16,14 @@ import (
var dockerContainersWidgetTemplate = mustParseTemplate("docker-containers.html", "widget-base.html")
type dockerContainersWidget struct {
- widgetBase `yaml:",inline"`
- HideByDefault bool `yaml:"hide-by-default"`
- SockPath string `yaml:"sock-path"`
- Containers dockerContainerList `yaml:"-"`
+ widgetBase `yaml:",inline"`
+ HideByDefault bool `yaml:"hide-by-default"`
+ RunningOnly bool `yaml:"running-only"`
+ Category string `yaml:"category"`
+ SockPath string `yaml:"sock-path"`
+ FormatContainerNames bool `yaml:"format-container-names"`
+ Containers dockerContainerList `yaml:"-"`
+ LabelOverrides map[string]map[string]string `yaml:"containers"`
}
func (widget *dockerContainersWidget) initialize() error {
@@ -32,7 +37,14 @@ func (widget *dockerContainersWidget) initialize() error {
}
func (widget *dockerContainersWidget) update(ctx context.Context) {
- containers, err := fetchDockerContainers(widget.SockPath, widget.HideByDefault)
+ containers, err := fetchDockerContainers(
+ widget.SockPath,
+ widget.HideByDefault,
+ widget.Category,
+ widget.RunningOnly,
+ widget.FormatContainerNames,
+ widget.LabelOverrides,
+ )
if !widget.canContinueUpdateAfterHandlingErr(err) {
return
}
@@ -47,13 +59,14 @@ func (widget *dockerContainersWidget) Render() template.HTML {
const (
dockerContainerLabelHide = "glance.hide"
- dockerContainerLabelTitle = "glance.title"
+ dockerContainerLabelName = "glance.name"
dockerContainerLabelURL = "glance.url"
dockerContainerLabelDescription = "glance.description"
dockerContainerLabelSameTab = "glance.same-tab"
dockerContainerLabelIcon = "glance.icon"
dockerContainerLabelID = "glance.id"
dockerContainerLabelParent = "glance.parent"
+ dockerContainerLabelCategory = "glance.category"
)
const (
@@ -98,7 +111,7 @@ func (l *dockerContainerLabels) getOrDefault(label, def string) string {
}
type dockerContainer struct {
- Title string
+ Name string
URL string
SameTab bool
Image string
@@ -120,7 +133,7 @@ func (containers dockerContainerList) sortByStateIconThenTitle() {
return (*p)[containers[a].StateIcon] < (*p)[containers[b].StateIcon]
}
- return strings.ToLower(containers[a].Title) < strings.ToLower(containers[b].Title)
+ return strings.ToLower(containers[a].Name) < strings.ToLower(containers[b].Name)
})
}
@@ -137,8 +150,15 @@ func dockerContainerStateToStateIcon(state string) string {
}
}
-func fetchDockerContainers(socketPath string, hideByDefault bool) (dockerContainerList, error) {
- containers, err := fetchAllDockerContainersFromSock(socketPath)
+func fetchDockerContainers(
+ socketPath string,
+ hideByDefault bool,
+ category string,
+ runningOnly bool,
+ formatNames bool,
+ labelOverrides map[string]map[string]string,
+) (dockerContainerList, error) {
+ containers, err := fetchDockerContainersFromSource(socketPath, category, runningOnly, labelOverrides)
if err != nil {
return nil, fmt.Errorf("fetching containers: %w", err)
}
@@ -150,7 +170,7 @@ func fetchDockerContainers(socketPath string, hideByDefault bool) (dockerContain
container := &containers[i]
dc := dockerContainer{
- Title: deriveDockerContainerTitle(container),
+ Name: deriveDockerContainerName(container, formatNames),
URL: container.Labels.getOrDefault(dockerContainerLabelURL, ""),
Description: container.Labels.getOrDefault(dockerContainerLabelDescription, ""),
SameTab: stringToBool(container.Labels.getOrDefault(dockerContainerLabelSameTab, "false")),
@@ -165,7 +185,7 @@ func fetchDockerContainers(socketPath string, hideByDefault bool) (dockerContain
for i := range children {
child := &children[i]
dc.Children = append(dc.Children, dockerContainer{
- Title: deriveDockerContainerTitle(child),
+ Name: deriveDockerContainerName(child, formatNames),
StateText: child.Status,
StateIcon: dockerContainerStateToStateIcon(strings.ToLower(child.State)),
})
@@ -193,12 +213,31 @@ func fetchDockerContainers(socketPath string, hideByDefault bool) (dockerContain
return dockerContainers, nil
}
-func deriveDockerContainerTitle(container *dockerContainerJsonResponse) string {
- if v := container.Labels.getOrDefault(dockerContainerLabelTitle, ""); v != "" {
+func deriveDockerContainerName(container *dockerContainerJsonResponse, formatNames bool) string {
+ if v := container.Labels.getOrDefault(dockerContainerLabelName, ""); v != "" {
return v
}
- return strings.TrimLeft(itemAtIndexOrDefault(container.Names, 0, "n/a"), "/")
+ if len(container.Names) == 0 || container.Names[0] == "" {
+ return "n/a"
+ }
+
+ name := strings.TrimLeft(container.Names[0], "/")
+
+ if formatNames {
+ name = strings.ReplaceAll(name, "_", " ")
+ name = strings.ReplaceAll(name, "-", " ")
+
+ words := strings.Split(name, " ")
+ for i := range words {
+ if len(words[i]) > 0 {
+ words[i] = strings.ToUpper(words[i][:1]) + words[i][1:]
+ }
+ }
+ name = strings.Join(words, " ")
+ }
+
+ return name
}
func groupDockerContainerChildren(
@@ -239,17 +278,46 @@ func isDockerContainerHidden(container *dockerContainerJsonResponse, hideByDefau
return hideByDefault
}
-func fetchAllDockerContainersFromSock(socketPath string) ([]dockerContainerJsonResponse, error) {
- client := &http.Client{
- Timeout: 3 * time.Second,
- Transport: &http.Transport{
- DialContext: func(_ context.Context, _, _ string) (net.Conn, error) {
- return net.Dial("unix", socketPath)
+
+func fetchDockerContainersFromSource(
+ source string,
+ category string,
+ runningOnly bool,
+ labelOverrides map[string]map[string]string,
+) ([]dockerContainerJsonResponse, error) {
+ var hostname string
+
+ var client *http.Client
+ if strings.HasPrefix(source, "tcp://") || strings.HasPrefix(source, "http://") {
+ client = &http.Client{}
+ parsed, err := url.Parse(source)
+ if err != nil {
+ return nil, fmt.Errorf("parsing URL: %w", err)
+ }
+
+ port := parsed.Port()
+ if port == "" {
+ port = "80"
+ }
+
+ hostname = parsed.Hostname() + ":" + port
+ } else {
+ hostname = "docker"
+ client = &http.Client{
+ Transport: &http.Transport{
+ DialContext: func(_ context.Context, _, _ string) (net.Conn, error) {
+ return net.Dial("unix", source)
+ },
},
- },
+ }
}
- request, err := http.NewRequest("GET", "http://docker/containers/json?all=true", nil)
+
+ fetchAll := ternary(runningOnly, "false", "true")
+ ctx, cancel := context.WithTimeout(context.Background(), 5*time.Second)
+ defer cancel()
+
+ request, err := http.NewRequestWithContext(ctx, "GET", "http://"+hostname+"/containers/json?all="+fetchAll, nil)
if err != nil {
return nil, fmt.Errorf("creating request: %w", err)
}
@@ -269,5 +337,43 @@ func fetchAllDockerContainersFromSock(socketPath string) ([]dockerContainerJsonR
return nil, fmt.Errorf("decoding response: %w", err)
}
+ for i := range containers {
+ container := &containers[i]
+ name := strings.TrimLeft(itemAtIndexOrDefault(container.Names, 0, ""), "/")
+
+ if name == "" {
+ continue
+ }
+
+ overrides, ok := labelOverrides[name]
+ if !ok {
+ continue
+ }
+
+ if container.Labels == nil {
+ container.Labels = make(dockerContainerLabels)
+ }
+
+ for label, value := range overrides {
+ container.Labels["glance."+label] = value
+ }
+ }
+
+ // We have to filter here instead of using the `filters` parameter of Docker's API
+ // because the user may define a category override within their config
+ if category != "" {
+ filtered := make([]dockerContainerJsonResponse, 0, len(containers))
+
+ for i := range containers {
+ container := &containers[i]
+
+ if container.Labels.getOrDefault(dockerContainerLabelCategory, "") == category {
+ filtered = append(filtered, *container)
+ }
+ }
+
+ containers = filtered
+ }
+
return containers, nil
}
diff --git a/internal/glance/widget-extension.go b/internal/glance/widget-extension.go
index 72a4a09..c2b11f5 100644
--- a/internal/glance/widget-extension.go
+++ b/internal/glance/widget-extension.go
@@ -19,12 +19,13 @@ const extensionWidgetDefaultTitle = "Extension"
type extensionWidget struct {
widgetBase `yaml:",inline"`
- URL string `yaml:"url"`
- FallbackContentType string `yaml:"fallback-content-type"`
- Parameters map[string]string `yaml:"parameters"`
- AllowHtml bool `yaml:"allow-potentially-dangerous-html"`
- Extension extension `yaml:"-"`
- cachedHTML template.HTML `yaml:"-"`
+ URL string `yaml:"url"`
+ FallbackContentType string `yaml:"fallback-content-type"`
+ Parameters queryParametersField `yaml:"parameters"`
+ Headers map[string]string `yaml:"headers"`
+ AllowHtml bool `yaml:"allow-potentially-dangerous-html"`
+ Extension extension `yaml:"-"`
+ cachedHTML template.HTML `yaml:"-"`
}
func (widget *extensionWidget) initialize() error {
@@ -46,6 +47,7 @@ func (widget *extensionWidget) update(ctx context.Context) {
URL: widget.URL,
FallbackContentType: widget.FallbackContentType,
Parameters: widget.Parameters,
+ Headers: widget.Headers,
AllowHtml: widget.AllowHtml,
})
@@ -57,6 +59,10 @@ func (widget *extensionWidget) update(ctx context.Context) {
widget.Title = extension.Title
}
+ if widget.TitleURL == "" && extension.TitleURL != "" {
+ widget.TitleURL = extension.TitleURL
+ }
+
widget.cachedHTML = widget.renderTemplate(widget, extensionWidgetTemplate)
}
@@ -67,8 +73,8 @@ func (widget *extensionWidget) Render() template.HTML {
type extensionType int
const (
- extensionContentHTML extensionType = iota
- extensionContentUnknown = iota
+ extensionContentHTML extensionType = iota
+ extensionContentUnknown
)
var extensionStringToType = map[string]extensionType{
@@ -77,19 +83,22 @@ var extensionStringToType = map[string]extensionType{
const (
extensionHeaderTitle = "Widget-Title"
+ extensionHeaderTitleURL = "Widget-Title-URL"
extensionHeaderContentType = "Widget-Content-Type"
extensionHeaderContentFrameless = "Widget-Content-Frameless"
)
type extensionRequestOptions struct {
- URL string `yaml:"url"`
- FallbackContentType string `yaml:"fallback-content-type"`
- Parameters map[string]string `yaml:"parameters"`
- AllowHtml bool `yaml:"allow-potentially-dangerous-html"`
+ URL string `yaml:"url"`
+ FallbackContentType string `yaml:"fallback-content-type"`
+ Parameters queryParametersField `yaml:"parameters"`
+ Headers map[string]string `yaml:"headers"`
+ AllowHtml bool `yaml:"allow-potentially-dangerous-html"`
}
type extension struct {
Title string
+ TitleURL string
Content template.HTML
Frameless bool
}
@@ -109,14 +118,13 @@ func convertExtensionContent(options extensionRequestOptions, content []byte, co
func fetchExtension(options extensionRequestOptions) (extension, error) {
request, _ := http.NewRequest("GET", options.URL, nil)
-
- query := url.Values{}
-
- for key, value := range options.Parameters {
- query.Set(key, value)
+ if len(options.Parameters) > 0 {
+ request.URL.RawQuery = options.Parameters.toQueryString()
}
- request.URL.RawQuery = query.Encode()
+ for key, value := range options.Headers {
+ request.Header.Add(key, value)
+ }
response, err := http.DefaultClient.Do(request)
if err != nil {
@@ -140,6 +148,10 @@ func fetchExtension(options extensionRequestOptions) (extension, error) {
extension.Title = response.Header.Get(extensionHeaderTitle)
}
+ if response.Header.Get(extensionHeaderTitleURL) != "" {
+ extension.TitleURL = response.Header.Get(extensionHeaderTitleURL)
+ }
+
contentType, ok := extensionStringToType[response.Header.Get(extensionHeaderContentType)]
if !ok {
diff --git a/internal/glance/widget-markets.go b/internal/glance/widget-markets.go
index 48df6fc..b53b10a 100644
--- a/internal/glance/widget-markets.go
+++ b/internal/glance/widget-markets.go
@@ -8,17 +8,20 @@ import (
"math"
"net/http"
"sort"
+ "strings"
"time"
)
var marketsWidgetTemplate = mustParseTemplate("markets.html", "widget-base.html")
type marketsWidget struct {
- widgetBase `yaml:",inline"`
- StocksRequests []marketRequest `yaml:"stocks"`
- MarketRequests []marketRequest `yaml:"markets"`
- Sort string `yaml:"sort-by"`
- Markets marketList `yaml:"-"`
+ widgetBase `yaml:",inline"`
+ StocksRequests []marketRequest `yaml:"stocks"`
+ MarketRequests []marketRequest `yaml:"markets"`
+ ChartLinkTemplate string `yaml:"chart-link-template"`
+ SymbolLinkTemplate string `yaml:"symbol-link-template"`
+ Sort string `yaml:"sort-by"`
+ Markets marketList `yaml:"-"`
}
func (widget *marketsWidget) initialize() error {
@@ -29,6 +32,18 @@ func (widget *marketsWidget) initialize() error {
widget.MarketRequests = widget.StocksRequests
}
+ for i := range widget.MarketRequests {
+ m := &widget.MarketRequests[i]
+
+ if widget.ChartLinkTemplate != "" && m.ChartLink == "" {
+ m.ChartLink = strings.ReplaceAll(widget.ChartLinkTemplate, "{SYMBOL}", m.Symbol)
+ }
+
+ if widget.SymbolLinkTemplate != "" && m.SymbolLink == "" {
+ m.SymbolLink = strings.ReplaceAll(widget.SymbolLinkTemplate, "{SYMBOL}", m.Symbol)
+ }
+ }
+
return nil
}
@@ -41,9 +56,7 @@ func (widget *marketsWidget) update(ctx context.Context) {
if widget.Sort == "absolute-change" {
markets.sortByAbsChange()
- }
-
- if widget.Sort == "change" {
+ } else if widget.Sort == "change" {
markets.sortByChange()
}
@@ -55,7 +68,7 @@ func (widget *marketsWidget) Render() template.HTML {
}
type marketRequest struct {
- Name string `yaml:"name"`
+ CustomName string `yaml:"name"`
Symbol string `yaml:"symbol"`
ChartLink string `yaml:"chart-link"`
SymbolLink string `yaml:"symbol-link"`
@@ -63,8 +76,10 @@ type marketRequest struct {
type market struct {
marketRequest
+ Name string
Currency string
Price float64
+ PriceHint int
PercentChange float64
SvgChartPoints string
}
@@ -91,6 +106,8 @@ type marketResponseJson struct {
Symbol string `json:"symbol"`
RegularMarketPrice float64 `json:"regularMarketPrice"`
ChartPreviousClose float64 `json:"chartPreviousClose"`
+ ShortName string `json:"shortName"`
+ PriceHint int `json:"priceHint"`
} `json:"meta"`
Indicators struct {
Quote []struct {
@@ -109,6 +126,7 @@ func fetchMarketsDataFromYahoo(marketRequests []marketRequest) (marketList, erro
for i := range marketRequests {
request, _ := http.NewRequest("GET", fmt.Sprintf("https://query1.finance.yahoo.com/v8/finance/chart/%s?range=1mo&interval=1d", marketRequests[i].Symbol), nil)
+ setBrowserUserAgentHeader(request)
requests = append(requests, request)
}
@@ -136,13 +154,14 @@ func fetchMarketsDataFromYahoo(marketRequests []marketRequest) (marketList, erro
continue
}
- prices := response.Chart.Result[0].Indicators.Quote[0].Close
+ result := &response.Chart.Result[0]
+ prices := result.Indicators.Quote[0].Close
if len(prices) > marketChartDays {
prices = prices[len(prices)-marketChartDays:]
}
- previous := response.Chart.Result[0].Meta.RegularMarketPrice
+ previous := result.Meta.RegularMarketPrice
if len(prices) >= 2 && prices[len(prices)-2] != 0 {
previous = prices[len(prices)-2]
@@ -150,18 +169,22 @@ func fetchMarketsDataFromYahoo(marketRequests []marketRequest) (marketList, erro
points := svgPolylineCoordsFromYValues(100, 50, maybeCopySliceWithoutZeroValues(prices))
- currency, exists := currencyToSymbol[response.Chart.Result[0].Meta.Currency]
-
+ currency, exists := currencyToSymbol[strings.ToUpper(result.Meta.Currency)]
if !exists {
- currency = response.Chart.Result[0].Meta.Currency
+ currency = result.Meta.Currency
}
markets = append(markets, market{
marketRequest: marketRequests[i],
- Price: response.Chart.Result[0].Meta.RegularMarketPrice,
+ Price: result.Meta.RegularMarketPrice,
Currency: currency,
+ PriceHint: result.Meta.PriceHint,
+ Name: ternary(marketRequests[i].CustomName == "",
+ result.Meta.ShortName,
+ marketRequests[i].CustomName,
+ ),
PercentChange: percentChange(
- response.Chart.Result[0].Meta.RegularMarketPrice,
+ result.Meta.RegularMarketPrice,
previous,
),
SvgChartPoints: points,
diff --git a/internal/glance/widget-monitor.go b/internal/glance/widget-monitor.go
index e5f7919..e42a710 100644
--- a/internal/glance/widget-monitor.go
+++ b/internal/glance/widget-monitor.go
@@ -20,6 +20,8 @@ type monitorWidget struct {
Sites []struct {
*SiteStatusRequest `yaml:",inline"`
Status *siteStatus `yaml:"-"`
+ URL string `yaml:"-"`
+ ErrorURL string `yaml:"error-url"`
Title string `yaml:"title"`
Icon customIconField `yaml:"icon"`
SameTab bool `yaml:"same-tab"`
@@ -58,14 +60,18 @@ func (widget *monitorWidget) update(ctx context.Context) {
status := &statuses[i]
site.Status = status
- if !slices.Contains(site.AltStatusCodes, status.Code) && (status.Code >= 400 || status.TimedOut || status.Error != nil) {
+ if !slices.Contains(site.AltStatusCodes, status.Code) && (status.Code >= 400 || status.Error != nil) {
widget.HasFailing = true
}
- if !status.TimedOut {
- site.StatusText = statusCodeToText(status.Code, site.AltStatusCodes)
- site.StatusStyle = statusCodeToStyle(status.Code, site.AltStatusCodes)
+ if status.Error != nil && site.ErrorURL != "" {
+ site.URL = site.ErrorURL
+ } else {
+ site.URL = site.DefaultURL
}
+
+ site.StatusText = statusCodeToText(status.Code, site.AltStatusCodes)
+ site.StatusStyle = statusCodeToStyle(status.Code, site.AltStatusCodes)
}
}
@@ -90,12 +96,12 @@ func statusCodeToText(status int, altStatusCodes []int) string {
if status == 401 {
return "Unauthorized"
}
- if status >= 400 {
- return "Client Error"
- }
if status >= 500 {
return "Server Error"
}
+ if status >= 400 {
+ return "Client Error"
+ }
return strconv.Itoa(status)
}
@@ -109,9 +115,13 @@ func statusCodeToStyle(status int, altStatusCodes []int) string {
}
type SiteStatusRequest struct {
- URL string `yaml:"url"`
+ DefaultURL string `yaml:"url"`
CheckURL string `yaml:"check-url"`
AllowInsecure bool `yaml:"allow-insecure"`
+ BasicAuth struct {
+ Username string `yaml:"username"`
+ Password string `yaml:"password"`
+ } `yaml:"basic-auth"`
}
type siteStatus struct {
@@ -126,7 +136,7 @@ func fetchSiteStatusTask(statusRequest *SiteStatusRequest) (siteStatus, error) {
if statusRequest.CheckURL != "" {
url = statusRequest.CheckURL
} else {
- url = statusRequest.URL
+ url = statusRequest.DefaultURL
}
request, err := http.NewRequest(http.MethodGet, url, nil)
if err != nil {
@@ -135,6 +145,10 @@ func fetchSiteStatusTask(statusRequest *SiteStatusRequest) (siteStatus, error) {
}, nil
}
+ if statusRequest.BasicAuth.Username != "" || statusRequest.BasicAuth.Password != "" {
+ request.SetBasicAuth(statusRequest.BasicAuth.Username, statusRequest.BasicAuth.Password)
+ }
+
ctx, cancel := context.WithTimeout(context.Background(), time.Second*3)
defer cancel()
request = request.WithContext(ctx)
diff --git a/internal/glance/widget-old-calendar.go b/internal/glance/widget-old-calendar.go
new file mode 100644
index 0000000..e4fbe74
--- /dev/null
+++ b/internal/glance/widget-old-calendar.go
@@ -0,0 +1,86 @@
+package glance
+
+import (
+ "context"
+ "html/template"
+ "time"
+)
+
+var oldCalendarWidgetTemplate = mustParseTemplate("old-calendar.html", "widget-base.html")
+
+type oldCalendarWidget struct {
+ widgetBase `yaml:",inline"`
+ Calendar *calendar
+ StartSunday bool `yaml:"start-sunday"`
+}
+
+func (widget *oldCalendarWidget) initialize() error {
+ widget.withTitle("Calendar").withCacheOnTheHour()
+
+ return nil
+}
+
+func (widget *oldCalendarWidget) update(ctx context.Context) {
+ widget.Calendar = newCalendar(time.Now(), widget.StartSunday)
+ widget.withError(nil).scheduleNextUpdate()
+}
+
+func (widget *oldCalendarWidget) Render() template.HTML {
+ return widget.renderTemplate(widget, oldCalendarWidgetTemplate)
+}
+
+type calendar struct {
+ CurrentDay int
+ CurrentWeekNumber int
+ CurrentMonthName string
+ CurrentYear int
+ Days []int
+}
+
+// TODO: very inflexible, refactor to allow more customizability
+// TODO: allow changing between showing the previous and next week and the entire month
+func newCalendar(now time.Time, startSunday bool) *calendar {
+ year, week := now.ISOWeek()
+ weekday := now.Weekday()
+ if !startSunday {
+ weekday = (weekday + 6) % 7 // Shift Monday to 0
+ }
+
+ currentMonthDays := daysInMonth(now.Month(), year)
+
+ var previousMonthDays int
+
+ if previousMonthNumber := now.Month() - 1; previousMonthNumber < 1 {
+ previousMonthDays = daysInMonth(12, year-1)
+ } else {
+ previousMonthDays = daysInMonth(previousMonthNumber, year)
+ }
+
+ startDaysFrom := now.Day() - int(weekday) - 7
+
+ days := make([]int, 21)
+
+ for i := 0; i < 21; i++ {
+ day := startDaysFrom + i
+
+ if day < 1 {
+ day = previousMonthDays + day
+ } else if day > currentMonthDays {
+ day = day - currentMonthDays
+ }
+
+ days[i] = day
+ }
+
+ return &calendar{
+ CurrentDay: now.Day(),
+ CurrentWeekNumber: week,
+ CurrentMonthName: now.Month().String(),
+ CurrentYear: year,
+ Days: days,
+ }
+}
+
+func daysInMonth(m time.Month, year int) int {
+ return time.Date(year, m+1, 0, 0, 0, 0, 0, time.UTC).Day()
+}
diff --git a/internal/glance/widget-reddit.go b/internal/glance/widget-reddit.go
index 1ef1147..a2cb5d9 100644
--- a/internal/glance/widget-reddit.go
+++ b/internal/glance/widget-reddit.go
@@ -8,6 +8,7 @@ import (
"html/template"
"net/http"
"net/url"
+ "strconv"
"strings"
"time"
)
@@ -19,19 +20,30 @@ var (
type redditWidget struct {
widgetBase `yaml:",inline"`
- Posts forumPostList `yaml:"-"`
- Subreddit string `yaml:"subreddit"`
- Style string `yaml:"style"`
- ShowThumbnails bool `yaml:"show-thumbnails"`
- ShowFlairs bool `yaml:"show-flairs"`
- SortBy string `yaml:"sort-by"`
- TopPeriod string `yaml:"top-period"`
- Search string `yaml:"search"`
- ExtraSortBy string `yaml:"extra-sort-by"`
- CommentsUrlTemplate string `yaml:"comments-url-template"`
- Limit int `yaml:"limit"`
- CollapseAfter int `yaml:"collapse-after"`
- RequestUrlTemplate string `yaml:"request-url-template"`
+ Posts forumPostList `yaml:"-"`
+ Subreddit string `yaml:"subreddit"`
+ Proxy proxyOptionsField `yaml:"proxy"`
+ Style string `yaml:"style"`
+ ShowThumbnails bool `yaml:"show-thumbnails"`
+ ShowFlairs bool `yaml:"show-flairs"`
+ SortBy string `yaml:"sort-by"`
+ TopPeriod string `yaml:"top-period"`
+ Search string `yaml:"search"`
+ ExtraSortBy string `yaml:"extra-sort-by"`
+ CommentsURLTemplate string `yaml:"comments-url-template"`
+ Limit int `yaml:"limit"`
+ CollapseAfter int `yaml:"collapse-after"`
+ RequestURLTemplate string `yaml:"request-url-template"`
+
+ AppAuth struct {
+ Name string `yaml:"name"`
+ ID string `yaml:"id"`
+ Secret string `yaml:"secret"`
+
+ enabled bool
+ accessToken string
+ tokenExpiresAt time.Time
+ } `yaml:"app-auth"`
}
func (widget *redditWidget) initialize() error {
@@ -47,56 +59,40 @@ func (widget *redditWidget) initialize() error {
widget.CollapseAfter = 5
}
- if !isValidRedditSortType(widget.SortBy) {
+ s := widget.SortBy
+ if s != "hot" && s != "new" && s != "top" && s != "rising" {
widget.SortBy = "hot"
}
- if !isValidRedditTopPeriod(widget.TopPeriod) {
+ p := widget.TopPeriod
+ if p != "hour" && p != "day" && p != "week" && p != "month" && p != "year" && p != "all" {
widget.TopPeriod = "day"
}
- if widget.RequestUrlTemplate != "" {
- if !strings.Contains(widget.RequestUrlTemplate, "{REQUEST-URL}") {
+ if widget.RequestURLTemplate != "" {
+ if !strings.Contains(widget.RequestURLTemplate, "{REQUEST-URL}") {
return errors.New("no `{REQUEST-URL}` placeholder specified")
}
}
+ a := &widget.AppAuth
+ if a.Name != "" || a.ID != "" || a.Secret != "" {
+ if a.Name == "" || a.ID == "" || a.Secret == "" {
+ return errors.New("application name, client ID and client secret are required")
+ }
+ a.enabled = true
+ }
+
widget.
- withTitle("/r/" + widget.Subreddit).
+ withTitle("r/" + widget.Subreddit).
withTitleURL("https://www.reddit.com/r/" + widget.Subreddit + "/").
withCacheDuration(30 * time.Minute)
return nil
}
-func isValidRedditSortType(sortBy string) bool {
- return sortBy == "hot" ||
- sortBy == "new" ||
- sortBy == "top" ||
- sortBy == "rising"
-}
-
-func isValidRedditTopPeriod(period string) bool {
- return period == "hour" ||
- period == "day" ||
- period == "week" ||
- period == "month" ||
- period == "year" ||
- period == "all"
-}
-
func (widget *redditWidget) update(ctx context.Context) {
- // TODO: refactor, use a struct to pass all of these
- posts, err := fetchSubredditPosts(
- widget.Subreddit,
- widget.SortBy,
- widget.TopPeriod,
- widget.Search,
- widget.CommentsUrlTemplate,
- widget.RequestUrlTemplate,
- widget.ShowFlairs,
- )
-
+ posts, err := widget.fetchSubredditPosts()
if !widget.canContinueUpdateAfterHandlingErr(err) {
return
}
@@ -153,45 +149,70 @@ type subredditResponseJson struct {
} `json:"data"`
}
-func templateRedditCommentsURL(template, subreddit, postId, postPath string) string {
- template = strings.ReplaceAll(template, "{SUBREDDIT}", subreddit)
+func (widget *redditWidget) parseCustomCommentsURL(subreddit, postId, postPath string) string {
+ template := strings.ReplaceAll(widget.CommentsURLTemplate, "{SUBREDDIT}", subreddit)
template = strings.ReplaceAll(template, "{POST-ID}", postId)
template = strings.ReplaceAll(template, "{POST-PATH}", strings.TrimLeft(postPath, "/"))
return template
}
-func fetchSubredditPosts(subreddit, sort, topPeriod, search, commentsUrlTemplate, requestUrlTemplate string, showFlairs bool) (forumPostList, error) {
+func (widget *redditWidget) fetchSubredditPosts() (forumPostList, error) {
+ var client requestDoer = defaultHTTPClient
+ var baseURL string
+ var requestURL string
+ var headers http.Header
query := url.Values{}
- var requestUrl string
+ app := &widget.AppAuth
- if search != "" {
- query.Set("q", search+" subreddit:"+subreddit)
- query.Set("sort", sort)
- }
-
- if sort == "top" {
- query.Set("t", topPeriod)
- }
-
- if search != "" {
- requestUrl = fmt.Sprintf("https://www.reddit.com/search.json?%s", query.Encode())
+ if !app.enabled {
+ baseURL = "https://www.reddit.com"
+ headers = http.Header{
+ "User-Agent": []string{getBrowserUserAgentHeader()},
+ }
} else {
- requestUrl = fmt.Sprintf("https://www.reddit.com/r/%s/%s.json?%s", subreddit, sort, query.Encode())
+ baseURL = "https://oauth.reddit.com"
+
+ if app.accessToken == "" || time.Now().Add(time.Minute).After(app.tokenExpiresAt) {
+ if err := widget.fetchNewAppAccessToken(); err != nil {
+ return nil, fmt.Errorf("fetching new app access token: %v", err)
+ }
+ }
+
+ headers = http.Header{
+ "Authorization": []string{"Bearer " + app.accessToken},
+ "User-Agent": []string{app.Name + "/1.0"},
+ }
}
- if requestUrlTemplate != "" {
- requestUrl = strings.ReplaceAll(requestUrlTemplate, "{REQUEST-URL}", requestUrl)
+ if widget.Limit > 25 {
+ query.Set("limit", strconv.Itoa(widget.Limit))
}
- request, err := http.NewRequest("GET", requestUrl, nil)
+ if widget.Search != "" {
+ query.Set("q", widget.Search+" subreddit:"+widget.Subreddit)
+ query.Set("sort", widget.SortBy)
+ requestURL = fmt.Sprintf("%s/search.json?%s", baseURL, query.Encode())
+ } else {
+ if widget.SortBy == "top" {
+ query.Set("t", widget.TopPeriod)
+ }
+ requestURL = fmt.Sprintf("%s/r/%s/%s.json?%s", baseURL, widget.Subreddit, widget.SortBy, query.Encode())
+ }
+
+ if widget.RequestURLTemplate != "" {
+ requestURL = strings.ReplaceAll(widget.RequestURLTemplate, "{REQUEST-URL}", requestURL)
+ } else if widget.Proxy.client != nil {
+ client = widget.Proxy.client
+ }
+
+ request, err := http.NewRequest("GET", requestURL, nil)
if err != nil {
return nil, err
}
+ request.Header = headers
- // Required to increase rate limit, otherwise Reddit randomly returns 429 even after just 2 requests
- setBrowserUserAgentHeader(request)
- responseJson, err := decodeJsonFromRequest[subredditResponseJson](defaultHTTPClient, request)
+ responseJson, err := decodeJsonFromRequest[subredditResponseJson](client, request)
if err != nil {
return nil, err
}
@@ -211,10 +232,10 @@ func fetchSubredditPosts(subreddit, sort, topPeriod, search, commentsUrlTemplate
var commentsUrl string
- if commentsUrlTemplate == "" {
+ if widget.CommentsURLTemplate == "" {
commentsUrl = "https://www.reddit.com" + post.Permalink
} else {
- commentsUrl = templateRedditCommentsURL(commentsUrlTemplate, subreddit, post.Id, post.Permalink)
+ commentsUrl = widget.parseCustomCommentsURL(widget.Subreddit, post.Id, post.Permalink)
}
forumPost := forumPost{
@@ -234,7 +255,7 @@ func fetchSubredditPosts(subreddit, sort, topPeriod, search, commentsUrlTemplate
forumPost.TargetUrl = post.Url
}
- if showFlairs && post.Flair != "" {
+ if widget.ShowFlairs && post.Flair != "" {
forumPost.Tags = append(forumPost.Tags, post.Flair)
}
@@ -242,11 +263,10 @@ func fetchSubredditPosts(subreddit, sort, topPeriod, search, commentsUrlTemplate
forumPost.IsCrosspost = true
forumPost.TargetUrlDomain = "r/" + post.ParentList[0].Subreddit
- if commentsUrlTemplate == "" {
+ if widget.CommentsURLTemplate == "" {
forumPost.TargetUrl = "https://www.reddit.com" + post.ParentList[0].Permalink
} else {
- forumPost.TargetUrl = templateRedditCommentsURL(
- commentsUrlTemplate,
+ forumPost.TargetUrl = widget.parseCustomCommentsURL(
post.ParentList[0].Subreddit,
post.ParentList[0].Id,
post.ParentList[0].Permalink,
@@ -259,3 +279,32 @@ func fetchSubredditPosts(subreddit, sort, topPeriod, search, commentsUrlTemplate
return posts, nil
}
+
+func (widget *redditWidget) fetchNewAppAccessToken() error {
+ body := strings.NewReader("grant_type=client_credentials")
+ req, err := http.NewRequest("POST", "https://www.reddit.com/api/v1/access_token", body)
+ if err != nil {
+ return fmt.Errorf("creating request for app access token: %v", err)
+ }
+
+ app := &widget.AppAuth
+ req.SetBasicAuth(app.ID, app.Secret)
+ req.Header.Add("User-Agent", app.Name+"/1.0")
+ req.Header.Add("Content-Type", "application/x-www-form-urlencoded")
+
+ type tokenResponse struct {
+ AccessToken string `json:"access_token"`
+ ExpiresIn int `json:"expires_in"`
+ }
+
+ client := ternary(widget.Proxy.client != nil, widget.Proxy.client, defaultHTTPClient)
+ response, err := decodeJsonFromRequest[tokenResponse](client, req)
+ if err != nil {
+ return err
+ }
+
+ app.accessToken = response.AccessToken
+ app.tokenExpiresAt = time.Now().Add(time.Duration(response.ExpiresIn) * time.Second)
+
+ return nil
+}
diff --git a/internal/glance/widget-releases.go b/internal/glance/widget-releases.go
index 0b47783..de56bc5 100644
--- a/internal/glance/widget-releases.go
+++ b/internal/glance/widget-releases.go
@@ -11,20 +11,21 @@ import (
"sort"
"strings"
"time"
+
+ "gopkg.in/yaml.v3"
)
var releasesWidgetTemplate = mustParseTemplate("releases.html", "widget-base.html")
type releasesWidget struct {
- widgetBase `yaml:",inline"`
- Releases appReleaseList `yaml:"-"`
- releaseRequests []*releaseRequest `yaml:"-"`
- Repositories []string `yaml:"repositories"`
- Token string `yaml:"token"`
- GitLabToken string `yaml:"gitlab-token"`
- Limit int `yaml:"limit"`
- CollapseAfter int `yaml:"collapse-after"`
- ShowSourceIcon bool `yaml:"show-source-icon"`
+ widgetBase `yaml:",inline"`
+ Releases appReleaseList `yaml:"-"`
+ Repositories []*releaseRequest `yaml:"repositories"`
+ Token string `yaml:"token"`
+ GitLabToken string `yaml:"gitlab-token"`
+ Limit int `yaml:"limit"`
+ CollapseAfter int `yaml:"collapse-after"`
+ ShowSourceIcon bool `yaml:"show-source-icon"`
}
func (widget *releasesWidget) initialize() error {
@@ -38,51 +39,21 @@ func (widget *releasesWidget) initialize() error {
widget.CollapseAfter = 5
}
- for _, repository := range widget.Repositories {
- parts := strings.SplitN(repository, ":", 2)
- var request *releaseRequest
- if len(parts) == 1 {
- request = &releaseRequest{
- source: releaseSourceGithub,
- repository: repository,
- }
+ for i := range widget.Repositories {
+ r := widget.Repositories[i]
- if widget.Token != "" {
- request.token = &widget.Token
- }
- } else if len(parts) == 2 {
- if parts[0] == string(releaseSourceGitlab) {
- request = &releaseRequest{
- source: releaseSourceGitlab,
- repository: parts[1],
- }
-
- if widget.GitLabToken != "" {
- request.token = &widget.GitLabToken
- }
- } else if parts[0] == string(releaseSourceDockerHub) {
- request = &releaseRequest{
- source: releaseSourceDockerHub,
- repository: parts[1],
- }
- } else if parts[0] == string(releaseSourceCodeberg) {
- request = &releaseRequest{
- source: releaseSourceCodeberg,
- repository: parts[1],
- }
- } else {
- return errors.New("invalid repository source " + parts[0])
- }
+ if r.source == releaseSourceGithub && widget.Token != "" {
+ r.token = &widget.Token
+ } else if r.source == releaseSourceGitlab && widget.GitLabToken != "" {
+ r.token = &widget.GitLabToken
}
-
- widget.releaseRequests = append(widget.releaseRequests, request)
}
return nil
}
func (widget *releasesWidget) update(ctx context.Context) {
- releases, err := fetchLatestReleases(widget.releaseRequests)
+ releases, err := fetchLatestReleases(widget.Repositories)
if !widget.canContinueUpdateAfterHandlingErr(err) {
return
@@ -133,9 +104,53 @@ func (r appReleaseList) sortByNewest() appReleaseList {
}
type releaseRequest struct {
- source releaseSource
- repository string
- token *string
+ IncludePreleases bool `yaml:"include-prereleases"`
+ Repository string `yaml:"repository"`
+
+ source releaseSource
+ token *string
+}
+
+func (r *releaseRequest) UnmarshalYAML(node *yaml.Node) error {
+ type releaseRequestAlias releaseRequest
+ alias := (*releaseRequestAlias)(r)
+ var repository string
+
+ if err := node.Decode(&repository); err != nil {
+ if err := node.Decode(alias); err != nil {
+ return fmt.Errorf("could not umarshal repository into string or struct: %v", err)
+ }
+ }
+
+ if r.Repository == "" {
+ if repository == "" {
+ return errors.New("repository is required")
+ } else {
+ r.Repository = repository
+ }
+ }
+
+ parts := strings.SplitN(repository, ":", 2)
+ if len(parts) == 1 {
+ r.source = releaseSourceGithub
+ } else if len(parts) == 2 {
+ r.Repository = parts[1]
+
+ switch parts[0] {
+ case string(releaseSourceGithub):
+ r.source = releaseSourceGithub
+ case string(releaseSourceGitlab):
+ r.source = releaseSourceGitlab
+ case string(releaseSourceDockerHub):
+ r.source = releaseSourceDockerHub
+ case string(releaseSourceCodeberg):
+ r.source = releaseSourceCodeberg
+ default:
+ return errors.New("invalid source")
+ }
+ }
+
+ return nil
}
func fetchLatestReleases(requests []*releaseRequest) (appReleaseList, error) {
@@ -152,7 +167,7 @@ func fetchLatestReleases(requests []*releaseRequest) (appReleaseList, error) {
for i := range results {
if errs[i] != nil {
failed++
- slog.Error("Failed to fetch release", "source", requests[i].source, "repository", requests[i].repository, "error", errs[i])
+ slog.Error("Failed to fetch release", "source", requests[i].source, "repository", requests[i].Repository, "error", errs[i])
continue
}
@@ -187,7 +202,7 @@ func fetchLatestReleaseTask(request *releaseRequest) (*appRelease, error) {
return nil, errors.New("unsupported source")
}
-type githubReleaseLatestResponseJson struct {
+type githubReleaseResponseJson struct {
TagName string `json:"tag_name"`
PublishedAt string `json:"published_at"`
HtmlUrl string `json:"html_url"`
@@ -197,12 +212,14 @@ type githubReleaseLatestResponseJson struct {
}
func fetchLatestGithubRelease(request *releaseRequest) (*appRelease, error) {
- httpRequest, err := http.NewRequest(
- "GET",
- fmt.Sprintf("https://api.github.com/repos/%s/releases/latest", request.repository),
- nil,
- )
+ var requestURL string
+ if !request.IncludePreleases {
+ requestURL = fmt.Sprintf("https://api.github.com/repos/%s/releases/latest", request.Repository)
+ } else {
+ requestURL = fmt.Sprintf("https://api.github.com/repos/%s/releases", request.Repository)
+ }
+ httpRequest, err := http.NewRequest("GET", requestURL, nil)
if err != nil {
return nil, err
}
@@ -211,14 +228,29 @@ func fetchLatestGithubRelease(request *releaseRequest) (*appRelease, error) {
httpRequest.Header.Add("Authorization", "Bearer "+(*request.token))
}
- response, err := decodeJsonFromRequest[githubReleaseLatestResponseJson](defaultHTTPClient, httpRequest)
- if err != nil {
- return nil, err
+ var response githubReleaseResponseJson
+
+ if !request.IncludePreleases {
+ response, err = decodeJsonFromRequest[githubReleaseResponseJson](defaultHTTPClient, httpRequest)
+ if err != nil {
+ return nil, err
+ }
+ } else {
+ responses, err := decodeJsonFromRequest[[]githubReleaseResponseJson](defaultHTTPClient, httpRequest)
+ if err != nil {
+ return nil, err
+ }
+
+ if len(responses) == 0 {
+ return nil, fmt.Errorf("no releases found for repository %s", request.Repository)
+ }
+
+ response = responses[0]
}
return &appRelease{
Source: releaseSourceGithub,
- Name: request.repository,
+ Name: request.Repository,
Version: normalizeVersionFormat(response.TagName),
NotesUrl: response.HtmlUrl,
TimeReleased: parseRFC3339Time(response.PublishedAt),
@@ -241,17 +273,15 @@ const dockerHubTagsURLFormat = "https://hub.docker.com/v2/namespaces/%s/reposito
const dockerHubSpecificTagURLFormat = "https://hub.docker.com/v2/namespaces/%s/repositories/%s/tags/%s"
func fetchLatestDockerHubRelease(request *releaseRequest) (*appRelease, error) {
-
- nameParts := strings.Split(request.repository, "/")
+ nameParts := strings.Split(request.Repository, "/")
if len(nameParts) > 2 {
- return nil, fmt.Errorf("invalid repository name: %s", request.repository)
+ return nil, fmt.Errorf("invalid repository name: %s", request.Repository)
} else if len(nameParts) == 1 {
nameParts = []string{"library", nameParts[0]}
}
tagParts := strings.SplitN(nameParts[1], ":", 2)
-
var requestURL string
if len(tagParts) == 2 {
@@ -278,7 +308,7 @@ func fetchLatestDockerHubRelease(request *releaseRequest) (*appRelease, error) {
}
if len(response.Results) == 0 {
- return nil, fmt.Errorf("no tags found for repository: %s", request.repository)
+ return nil, fmt.Errorf("no tags found for repository: %s", request.Repository)
}
tag = &response.Results[0]
@@ -331,7 +361,7 @@ func fetchLatestGitLabRelease(request *releaseRequest) (*appRelease, error) {
"GET",
fmt.Sprintf(
"https://gitlab.com/api/v4/projects/%s/releases/permalink/latest",
- url.QueryEscape(request.repository),
+ url.QueryEscape(request.Repository),
),
nil,
)
@@ -350,7 +380,7 @@ func fetchLatestGitLabRelease(request *releaseRequest) (*appRelease, error) {
return &appRelease{
Source: releaseSourceGitlab,
- Name: request.repository,
+ Name: request.Repository,
Version: normalizeVersionFormat(response.TagName),
NotesUrl: response.Links.Self,
TimeReleased: parseRFC3339Time(response.ReleasedAt),
@@ -368,7 +398,7 @@ func fetchLatestCodebergRelease(request *releaseRequest) (*appRelease, error) {
"GET",
fmt.Sprintf(
"https://codeberg.org/api/v1/repos/%s/releases/latest",
- request.repository,
+ request.Repository,
),
nil,
)
@@ -383,7 +413,7 @@ func fetchLatestCodebergRelease(request *releaseRequest) (*appRelease, error) {
return &appRelease{
Source: releaseSourceCodeberg,
- Name: request.repository,
+ Name: request.Repository,
Version: normalizeVersionFormat(response.TagName),
NotesUrl: response.HtmlUrl,
TimeReleased: parseRFC3339Time(response.PublishedAt),
diff --git a/internal/glance/widget-rss.go b/internal/glance/widget-rss.go
index f24d828..add5796 100644
--- a/internal/glance/widget-rss.go
+++ b/internal/glance/widget-rss.go
@@ -12,6 +12,7 @@ import (
"regexp"
"sort"
"strings"
+ "sync"
"time"
"github.com/mmcdole/gofeed"
@@ -25,21 +26,28 @@ var (
rssWidgetHorizontalCards2Template = mustParseTemplate("rss-horizontal-cards-2.html", "widget-base.html")
)
+var feedParser = gofeed.NewParser()
+
type rssWidget struct {
widgetBase `yaml:",inline"`
FeedRequests []rssFeedRequest `yaml:"feeds"`
Style string `yaml:"style"`
ThumbnailHeight float64 `yaml:"thumbnail-height"`
CardHeight float64 `yaml:"card-height"`
- Items rssFeedItemList `yaml:"-"`
Limit int `yaml:"limit"`
CollapseAfter int `yaml:"collapse-after"`
SingleLineTitles bool `yaml:"single-line-titles"`
- NoItemsMessage string `yaml:"-"`
+ PreserveOrder bool `yaml:"preserve-order"`
+
+ Items rssFeedItemList `yaml:"-"`
+ NoItemsMessage string `yaml:"-"`
+
+ feedCacheMutex sync.Mutex
+ cachedFeeds map[string]*cachedRSSFeed `yaml:"-"`
}
func (widget *rssWidget) initialize() error {
- widget.withTitle("RSS Feed").withCacheDuration(1 * time.Hour)
+ widget.withTitle("RSS Feed").withCacheDuration(2 * time.Hour)
if widget.Limit <= 0 {
widget.Limit = 25
@@ -64,17 +72,22 @@ func (widget *rssWidget) initialize() error {
}
widget.NoItemsMessage = "No items were returned from the feeds."
+ widget.cachedFeeds = make(map[string]*cachedRSSFeed)
return nil
}
func (widget *rssWidget) update(ctx context.Context) {
- items, err := fetchItemsFromRSSFeeds(widget.FeedRequests)
+ items, err := widget.fetchItemsFromFeeds()
if !widget.canContinueUpdateAfterHandlingErr(err) {
return
}
+ if !widget.PreserveOrder {
+ items.sortByNewest()
+ }
+
if len(items) > widget.Limit {
items = items[:widget.Limit]
}
@@ -98,6 +111,12 @@ func (widget *rssWidget) Render() template.HTML {
return widget.renderTemplate(widget, rssWidgetTemplate)
}
+type cachedRSSFeed struct {
+ etag string
+ lastModified string
+ items []rssFeedItem
+}
+
type rssFeedItem struct {
ChannelName string
ChannelURL string
@@ -109,40 +128,12 @@ type rssFeedItem struct {
PublishedAt time.Time
}
-// doesn't cover all cases but works the vast majority of the time
-var htmlTagsWithAttributesPattern = regexp.MustCompile(`<\/?[a-zA-Z0-9-]+ *(?:[a-zA-Z-]+=(?:"|').*?(?:"|') ?)* *\/?>`)
-
-func sanitizeFeedDescription(description string) string {
- if description == "" {
- return ""
- }
-
- description = strings.ReplaceAll(description, "\n", " ")
- description = htmlTagsWithAttributesPattern.ReplaceAllString(description, "")
- description = sequentialWhitespacePattern.ReplaceAllString(description, " ")
- description = strings.TrimSpace(description)
- description = html.UnescapeString(description)
-
- return description
-}
-
-func shortenFeedDescriptionLen(description string, maxLen int) string {
- description, _ = limitStringLength(description, 1000)
- description = sanitizeFeedDescription(description)
- description, limited := limitStringLength(description, maxLen)
-
- if limited {
- description += "…"
- }
-
- return description
-}
-
type rssFeedRequest struct {
URL string `yaml:"url"`
Title string `yaml:"title"`
HideCategories bool `yaml:"hide-categories"`
HideDescription bool `yaml:"hide-description"`
+ Limit int `yaml:"limit"`
ItemLinkPrefix string `yaml:"item-link-prefix"`
Headers map[string]string `yaml:"headers"`
IsDetailed bool `yaml:"-"`
@@ -158,16 +149,68 @@ func (f rssFeedItemList) sortByNewest() rssFeedItemList {
return f
}
-var feedParser = gofeed.NewParser()
+func (widget *rssWidget) fetchItemsFromFeeds() (rssFeedItemList, error) {
+ requests := widget.FeedRequests
-func fetchItemsFromRSSFeedTask(request rssFeedRequest) ([]rssFeedItem, error) {
+ job := newJob(widget.fetchItemsFromFeedTask, requests).withWorkers(30)
+ feeds, errs, err := workerPoolDo(job)
+ if err != nil {
+ return nil, fmt.Errorf("%w: %v", errNoContent, err)
+ }
+
+ failed := 0
+ entries := make(rssFeedItemList, 0, len(feeds)*10)
+ seen := make(map[string]struct{})
+
+ for i := range feeds {
+ if errs[i] != nil {
+ failed++
+ slog.Error("Failed to get RSS feed", "url", requests[i].URL, "error", errs[i])
+ continue
+ }
+
+ for _, item := range feeds[i] {
+ if _, exists := seen[item.Link]; exists {
+ continue
+ }
+ entries = append(entries, item)
+ seen[item.Link] = struct{}{}
+ }
+ }
+
+ if failed == len(requests) {
+ return nil, errNoContent
+ }
+
+ if failed > 0 {
+ return entries, fmt.Errorf("%w: missing %d RSS feeds", errPartialContent, failed)
+ }
+
+ return entries, nil
+}
+
+func (widget *rssWidget) fetchItemsFromFeedTask(request rssFeedRequest) ([]rssFeedItem, error) {
req, err := http.NewRequest("GET", request.URL, nil)
if err != nil {
return nil, err
}
+ req.Header.Add("User-Agent", glanceUserAgentString)
+
+ widget.feedCacheMutex.Lock()
+ cache, isCached := widget.cachedFeeds[request.URL]
+ if isCached {
+ if cache.etag != "" {
+ req.Header.Add("If-None-Match", cache.etag)
+ }
+ if cache.lastModified != "" {
+ req.Header.Add("If-Modified-Since", cache.lastModified)
+ }
+ }
+ widget.feedCacheMutex.Unlock()
+
for key, value := range request.Headers {
- req.Header.Add(key, value)
+ req.Header.Set(key, value)
}
resp, err := defaultHTTPClient.Do(req)
@@ -176,6 +219,10 @@ func fetchItemsFromRSSFeedTask(request rssFeedRequest) ([]rssFeedItem, error) {
}
defer resp.Body.Close()
+ if resp.StatusCode == http.StatusNotModified && isCached {
+ return cache.items, nil
+ }
+
if resp.StatusCode != http.StatusOK {
return nil, fmt.Errorf("unexpected status code %d from %s", resp.StatusCode, request.URL)
}
@@ -190,6 +237,10 @@ func fetchItemsFromRSSFeedTask(request rssFeedRequest) ([]rssFeedItem, error) {
return nil, err
}
+ if request.Limit > 0 && len(feed.Items) > request.Limit {
+ feed.Items = feed.Items[:request.Limit]
+ }
+
items := make(rssFeedItemList, 0, len(feed.Items))
for i := range feed.Items {
@@ -279,9 +330,29 @@ func fetchItemsFromRSSFeedTask(request rssFeedRequest) ([]rssFeedItem, error) {
items = append(items, rssItem)
}
+ if resp.Header.Get("ETag") != "" || resp.Header.Get("Last-Modified") != "" {
+ widget.feedCacheMutex.Lock()
+ widget.cachedFeeds[request.URL] = &cachedRSSFeed{
+ etag: resp.Header.Get("ETag"),
+ lastModified: resp.Header.Get("Last-Modified"),
+ items: items,
+ }
+ widget.feedCacheMutex.Unlock()
+ }
+
return items, nil
}
+func findThumbnailInItemExtensions(item *gofeed.Item) string {
+ media, ok := item.Extensions["media"]
+
+ if !ok {
+ return ""
+ }
+
+ return recursiveFindThumbnailInExtensions(media)
+}
+
func recursiveFindThumbnailInExtensions(extensions map[string][]gofeedext.Extension) string {
for _, exts := range extensions {
for _, ext := range exts {
@@ -302,46 +373,30 @@ func recursiveFindThumbnailInExtensions(extensions map[string][]gofeedext.Extens
return ""
}
-func findThumbnailInItemExtensions(item *gofeed.Item) string {
- media, ok := item.Extensions["media"]
+var htmlTagsWithAttributesPattern = regexp.MustCompile(`<\/?[a-zA-Z0-9-]+ *(?:[a-zA-Z-]+=(?:"|').*?(?:"|') ?)* *\/?>`)
- if !ok {
+func sanitizeFeedDescription(description string) string {
+ if description == "" {
return ""
}
- return recursiveFindThumbnailInExtensions(media)
+ description = strings.ReplaceAll(description, "\n", " ")
+ description = htmlTagsWithAttributesPattern.ReplaceAllString(description, "")
+ description = sequentialWhitespacePattern.ReplaceAllString(description, " ")
+ description = strings.TrimSpace(description)
+ description = html.UnescapeString(description)
+
+ return description
}
-func fetchItemsFromRSSFeeds(requests []rssFeedRequest) (rssFeedItemList, error) {
- job := newJob(fetchItemsFromRSSFeedTask, requests).withWorkers(30)
- feeds, errs, err := workerPoolDo(job)
- if err != nil {
- return nil, fmt.Errorf("%w: %v", errNoContent, err)
+func shortenFeedDescriptionLen(description string, maxLen int) string {
+ description, _ = limitStringLength(description, 1000)
+ description = sanitizeFeedDescription(description)
+ description, limited := limitStringLength(description, maxLen)
+
+ if limited {
+ description += "…"
}
- failed := 0
-
- entries := make(rssFeedItemList, 0, len(feeds)*10)
-
- for i := range feeds {
- if errs[i] != nil {
- failed++
- slog.Error("Failed to get RSS feed", "url", requests[i].URL, "error", errs[i])
- continue
- }
-
- entries = append(entries, feeds[i]...)
- }
-
- if failed == len(requests) {
- return nil, errNoContent
- }
-
- entries.sortByNewest()
-
- if failed > 0 {
- return entries, fmt.Errorf("%w: missing %d RSS feeds", errPartialContent, failed)
- }
-
- return entries, nil
+ return description
}
diff --git a/internal/glance/widget-search.go b/internal/glance/widget-search.go
index 9d2b600..300361d 100644
--- a/internal/glance/widget-search.go
+++ b/internal/glance/widget-search.go
@@ -20,6 +20,7 @@ type searchWidget struct {
SearchEngine string `yaml:"search-engine"`
Bangs []SearchBang `yaml:"bangs"`
NewTab bool `yaml:"new-tab"`
+ Target string `yaml:"target"`
Autofocus bool `yaml:"autofocus"`
Placeholder string `yaml:"placeholder"`
}
@@ -33,6 +34,10 @@ func convertSearchUrl(url string) string {
var searchEngines = map[string]string{
"duckduckgo": "https://duckduckgo.com/?q={QUERY}",
"google": "https://www.google.com/search?q={QUERY}",
+ "bing": "https://www.bing.com/search?q={QUERY}",
+ "perplexity": "https://www.perplexity.ai/search?q={QUERY}",
+ "kagi": "https://kagi.com/search?q={QUERY}",
+ "startpage": "https://www.startpage.com/search?q={QUERY}",
}
func (widget *searchWidget) initialize() error {
diff --git a/internal/glance/widget-server-stats.go b/internal/glance/widget-server-stats.go
new file mode 100644
index 0000000..90bf8db
--- /dev/null
+++ b/internal/glance/widget-server-stats.go
@@ -0,0 +1,117 @@
+package glance
+
+import (
+ "context"
+ "html/template"
+ "log/slog"
+ "net/http"
+ "strconv"
+ "strings"
+ "sync"
+ "time"
+
+ "github.com/glanceapp/glance/pkg/sysinfo"
+)
+
+var serverStatsWidgetTemplate = mustParseTemplate("server-stats.html", "widget-base.html")
+
+type serverStatsWidget struct {
+ widgetBase `yaml:",inline"`
+ Servers []serverStatsRequest `yaml:"servers"`
+}
+
+func (widget *serverStatsWidget) initialize() error {
+ widget.withTitle("Server Stats").withCacheDuration(15 * time.Second)
+ widget.widgetBase.WIP = true
+
+ if len(widget.Servers) == 0 {
+ widget.Servers = []serverStatsRequest{{Type: "local"}}
+ }
+
+ for i := range widget.Servers {
+ widget.Servers[i].URL = strings.TrimRight(widget.Servers[i].URL, "/")
+
+ if widget.Servers[i].Timeout == 0 {
+ widget.Servers[i].Timeout = durationField(3 * time.Second)
+ }
+ }
+
+ return nil
+}
+
+func (widget *serverStatsWidget) update(context.Context) {
+ // Refactor later, most of it may change depending on feedback
+ var wg sync.WaitGroup
+
+ for i := range widget.Servers {
+ serv := &widget.Servers[i]
+
+ if serv.Type == "local" {
+ info, errs := sysinfo.Collect(serv.SystemInfoRequest)
+
+ if len(errs) > 0 {
+ for i := range errs {
+ slog.Warn("Getting system info: " + errs[i].Error())
+ }
+ }
+
+ serv.IsReachable = true
+ serv.Info = info
+ } else {
+ wg.Add(1)
+ go func() {
+ defer wg.Done()
+ info, err := fetchRemoteServerInfo(serv)
+ if err != nil {
+ slog.Warn("Getting remote system info: " + err.Error())
+ serv.IsReachable = false
+ serv.Info = &sysinfo.SystemInfo{
+ Hostname: "Unnamed server #" + strconv.Itoa(i+1),
+ }
+ } else {
+ serv.IsReachable = true
+ serv.Info = info
+ }
+ }()
+ }
+ }
+
+ wg.Wait()
+ widget.withError(nil).scheduleNextUpdate()
+}
+
+func (widget *serverStatsWidget) Render() template.HTML {
+ return widget.renderTemplate(widget, serverStatsWidgetTemplate)
+}
+
+type serverStatsRequest struct {
+ *sysinfo.SystemInfoRequest `yaml:",inline"`
+ Info *sysinfo.SystemInfo `yaml:"-"`
+ IsReachable bool `yaml:"-"`
+ StatusText string `yaml:"-"`
+ Name string `yaml:"name"`
+ HideSwap bool `yaml:"hide-swap"`
+ Type string `yaml:"type"`
+ URL string `yaml:"url"`
+ Token string `yaml:"token"`
+ Timeout durationField `yaml:"timeout"`
+ // Support for other agents
+ // Provider string `yaml:"provider"`
+}
+
+func fetchRemoteServerInfo(infoReq *serverStatsRequest) (*sysinfo.SystemInfo, error) {
+ ctx, cancel := context.WithTimeout(context.Background(), time.Duration(infoReq.Timeout))
+ defer cancel()
+
+ request, _ := http.NewRequestWithContext(ctx, "GET", infoReq.URL+"/api/sysinfo/all", nil)
+ if infoReq.Token != "" {
+ request.Header.Set("Authorization", "Bearer "+infoReq.Token)
+ }
+
+ info, err := decodeJsonFromRequest[*sysinfo.SystemInfo](defaultHTTPClient, request)
+ if err != nil {
+ return nil, err
+ }
+
+ return info, nil
+}
diff --git a/internal/glance/widget-twitch-channels.go b/internal/glance/widget-twitch-channels.go
index f3ab206..1290a26 100644
--- a/internal/glance/widget-twitch-channels.go
+++ b/internal/glance/widget-twitch-channels.go
@@ -196,6 +196,10 @@ func fetchChannelFromTwitchTask(channel string) (twitchChannel, error) {
slog.Warn("Failed to parse Twitch stream started at", "error", err, "started_at", streamMetadata.UserOrNull.Stream.StartedAt)
}
}
+ } else {
+ // This prevents live channels with 0 viewers from being
+ // incorrectly sorted lower than offline channels
+ result.ViewersCount = -1
}
return result, nil
diff --git a/internal/glance/widget-utils.go b/internal/glance/widget-utils.go
index 77a9d5c..fa2fad5 100644
--- a/internal/glance/widget-utils.go
+++ b/internal/glance/widget-utils.go
@@ -8,8 +8,11 @@ import (
"errors"
"fmt"
"io"
+ "math/rand/v2"
"net/http"
+ "strconv"
"sync"
+ "sync/atomic"
"time"
)
@@ -21,6 +24,9 @@ var (
const defaultClientTimeout = 5 * time.Second
var defaultHTTPClient = &http.Client{
+ Transport: &http.Transport{
+ MaxIdleConnsPerHost: 10,
+ },
Timeout: defaultClientTimeout,
}
@@ -35,8 +41,20 @@ type requestDoer interface {
Do(*http.Request) (*http.Response, error)
}
+var glanceUserAgentString = "Glance/" + buildVersion + " +https://github.com/glanceapp/glance"
+var userAgentPersistentVersion atomic.Int32
+
+func getBrowserUserAgentHeader() string {
+ if rand.IntN(2000) == 0 {
+ userAgentPersistentVersion.Store(rand.Int32N(5))
+ }
+
+ version := strconv.Itoa(130 + int(userAgentPersistentVersion.Load()))
+ return "Mozilla/5.0 (Windows NT 10.0; Win64; x64; rv:" + version + ".0) Gecko/20100101 Firefox/" + version + ".0"
+}
+
func setBrowserUserAgentHeader(request *http.Request) {
- request.Header.Set("User-Agent", "Mozilla/5.0 (Windows NT 10.0; Win64; x64; rv:123.0) Gecko/20100101 Firefox/123.0")
+ request.Header.Set("User-Agent", getBrowserUserAgentHeader())
}
func decodeJsonFromRequest[T any](client requestDoer, request *http.Request) (T, error) {
@@ -57,7 +75,7 @@ func decodeJsonFromRequest[T any](client requestDoer, request *http.Request) (T,
truncatedBody, _ := limitStringLength(string(body), 256)
return result, fmt.Errorf(
- "unexpected status code %d for %s, response: %s",
+ "unexpected status code %d from %s, response: %s",
response.StatusCode,
request.URL,
truncatedBody,
@@ -137,10 +155,8 @@ const defaultNumWorkers = 10
func (job *workerPoolJob[I, O]) withWorkers(workers int) *workerPoolJob[I, O] {
if workers == 0 {
job.workers = defaultNumWorkers
- } else if workers > len(job.data) {
- job.workers = len(job.data)
} else {
- job.workers = workers
+ job.workers = min(workers, len(job.data))
}
return job
@@ -171,6 +187,11 @@ func workerPoolDo[I any, O any](job *workerPoolJob[I, O]) ([]O, []error, error)
return results, errs, nil
}
+ if len(job.data) == 1 {
+ results[0], errs[0] = job.task(job.data[0])
+ return results, errs, nil
+ }
+
tasksQueue := make(chan *workerPoolTask[I, O])
resultsQueue := make(chan *workerPoolTask[I, O])
diff --git a/internal/glance/widget-videos.go b/internal/glance/widget-videos.go
index 398989f..ff79864 100644
--- a/internal/glance/widget-videos.go
+++ b/internal/glance/widget-videos.go
@@ -15,8 +15,9 @@ import (
const videosWidgetPlaylistPrefix = "playlist:"
var (
- videosWidgetTemplate = mustParseTemplate("videos.html", "widget-base.html", "video-card-contents.html")
- videosWidgetGridTemplate = mustParseTemplate("videos-grid.html", "widget-base.html", "video-card-contents.html")
+ videosWidgetTemplate = mustParseTemplate("videos.html", "widget-base.html", "video-card-contents.html")
+ videosWidgetGridTemplate = mustParseTemplate("videos-grid.html", "widget-base.html", "video-card-contents.html")
+ videosWidgetVerticalListTemplate = mustParseTemplate("videos-vertical-list.html", "widget-base.html")
)
type videosWidget struct {
@@ -24,8 +25,10 @@ type videosWidget struct {
Videos videoList `yaml:"-"`
VideoUrlTemplate string `yaml:"video-url-template"`
Style string `yaml:"style"`
+ CollapseAfter int `yaml:"collapse-after"`
CollapseAfterRows int `yaml:"collapse-after-rows"`
Channels []string `yaml:"channels"`
+ Playlists []string `yaml:"playlists"`
Limit int `yaml:"limit"`
IncludeShorts bool `yaml:"include-shorts"`
}
@@ -41,6 +44,22 @@ func (widget *videosWidget) initialize() error {
widget.CollapseAfterRows = 4
}
+ if widget.CollapseAfter == 0 || widget.CollapseAfter < -1 {
+ widget.CollapseAfter = 7
+ }
+
+ // A bit cheeky, but from a user's perspective it makes more sense when channels and
+ // playlists are separate things rather than specifying a list of channels and some of
+ // them awkwardly have a "playlist:" prefix
+ if len(widget.Playlists) > 0 {
+ initialLen := len(widget.Channels)
+ widget.Channels = append(widget.Channels, make([]string, len(widget.Playlists))...)
+
+ for i := range widget.Playlists {
+ widget.Channels[initialLen+i] = videosWidgetPlaylistPrefix + widget.Playlists[i]
+ }
+ }
+
return nil
}
@@ -59,11 +78,18 @@ func (widget *videosWidget) update(ctx context.Context) {
}
func (widget *videosWidget) Render() template.HTML {
- if widget.Style == "grid-cards" {
- return widget.renderTemplate(widget, videosWidgetGridTemplate)
+ var template *template.Template
+
+ switch widget.Style {
+ case "grid-cards":
+ template = videosWidgetGridTemplate
+ case "vertical-list":
+ template = videosWidgetVerticalListTemplate
+ default:
+ template = videosWidgetTemplate
}
- return widget.renderTemplate(widget, videosWidgetTemplate)
+ return widget.renderTemplate(widget, template)
}
type youtubeFeedResponseXml struct {
diff --git a/internal/glance/widget-weather.go b/internal/glance/widget-weather.go
index 9d53cd6..79861d0 100644
--- a/internal/glance/widget-weather.go
+++ b/internal/glance/widget-weather.go
@@ -170,7 +170,7 @@ func parsePlaceName(name string) (string, string) {
func fetchOpenMeteoPlaceFromName(location string) (*openMeteoPlaceResponseJson, error) {
location, area := parsePlaceName(location)
- requestUrl := fmt.Sprintf("https://geocoding-api.open-meteo.com/v1/search?name=%s&count=10&language=en&format=json", url.QueryEscape(location))
+ requestUrl := fmt.Sprintf("https://geocoding-api.open-meteo.com/v1/search?name=%s&count=20&language=en&format=json", url.QueryEscape(location))
request, _ := http.NewRequest("GET", requestUrl, nil)
responseJson, err := decodeJsonFromRequest[openMeteoPlacesResponseJson](defaultHTTPClient, request)
if err != nil {
diff --git a/internal/glance/widget.go b/internal/glance/widget.go
index 7e8a618..7c30183 100644
--- a/internal/glance/widget.go
+++ b/internal/glance/widget.go
@@ -18,11 +18,17 @@ import (
var widgetIDCounter atomic.Uint64
func newWidget(widgetType string) (widget, error) {
+ if widgetType == "" {
+ return nil, errors.New("widget 'type' property is empty or not specified")
+ }
+
var w widget
switch widgetType {
case "calendar":
w = &calendarWidget{}
+ case "calendar-legacy":
+ w = &oldCalendarWidget{}
case "clock":
w = &clockWidget{}
case "weather":
@@ -71,6 +77,8 @@ func newWidget(widgetType string) (widget, error) {
w = &customAPIWidget{}
case "docker-containers":
w = &dockerContainersWidget{}
+ case "server-stats":
+ w = &serverStatsWidget{}
default:
return nil, fmt.Errorf("unknown widget type: %s", widgetType)
}
@@ -100,7 +108,7 @@ func (w *widgets) UnmarshalYAML(node *yaml.Node) error {
widget, err := newWidget(meta.Type)
if err != nil {
- return err
+ return fmt.Errorf("line %d: %w", node.Line, err)
}
if err = node.Decode(widget); err != nil {
@@ -117,13 +125,13 @@ type widget interface {
// These need to be exported because they get called in templates
Render() template.HTML
GetType() string
+ GetID() uint64
initialize() error
requiresUpdate(*time.Time) bool
setProviders(*widgetProviders)
update(context.Context)
setID(uint64)
- id() uint64
handleRequest(w http.ResponseWriter, r *http.Request)
setHideHeader(bool)
}
@@ -145,6 +153,7 @@ type widgetBase struct {
CSSClass string `yaml:"css-class"`
CustomCacheDuration durationField `yaml:"cache"`
ContentAvailable bool `yaml:"-"`
+ WIP bool `yaml:"-"`
Error error `yaml:"-"`
Notice error `yaml:"-"`
templateBuffer bytes.Buffer `yaml:"-"`
@@ -171,11 +180,15 @@ func (w *widgetBase) requiresUpdate(now *time.Time) bool {
return now.After(w.nextUpdate)
}
+func (w *widgetBase) IsWIP() bool {
+ return w.WIP
+}
+
func (w *widgetBase) update(ctx context.Context) {
}
-func (w *widgetBase) id() uint64 {
+func (w *widgetBase) GetID() uint64 {
return w.ID
}
diff --git a/pkg/sysinfo/sysinfo.go b/pkg/sysinfo/sysinfo.go
new file mode 100644
index 0000000..ed20318
--- /dev/null
+++ b/pkg/sysinfo/sysinfo.go
@@ -0,0 +1,298 @@
+package sysinfo
+
+import (
+ "fmt"
+ "math"
+ "os"
+ "runtime"
+ "sort"
+ "strconv"
+ "time"
+
+ "github.com/shirou/gopsutil/v4/cpu"
+ "github.com/shirou/gopsutil/v4/disk"
+ "github.com/shirou/gopsutil/v4/host"
+ "github.com/shirou/gopsutil/v4/load"
+ "github.com/shirou/gopsutil/v4/mem"
+ "github.com/shirou/gopsutil/v4/sensors"
+)
+
+type timestampJSON struct {
+ time.Time
+}
+
+func (t timestampJSON) MarshalJSON() ([]byte, error) {
+ return []byte(strconv.FormatInt(t.Unix(), 10)), nil
+}
+
+func (t *timestampJSON) UnmarshalJSON(data []byte) error {
+ i, err := strconv.ParseInt(string(data), 10, 64)
+ if err != nil {
+ return err
+ }
+
+ t.Time = time.Unix(i, 0)
+ return nil
+}
+
+type SystemInfo struct {
+ HostInfoIsAvailable bool `json:"host_info_is_available"`
+ BootTime timestampJSON `json:"boot_time"`
+ Hostname string `json:"hostname"`
+ Platform string `json:"platform"`
+
+ CPU struct {
+ LoadIsAvailable bool `json:"load_is_available"`
+ Load1Percent uint8 `json:"load1_percent"`
+ Load15Percent uint8 `json:"load15_percent"`
+
+ TemperatureIsAvailable bool `json:"temperature_is_available"`
+ TemperatureC uint8 `json:"temperature_c"`
+ } `json:"cpu"`
+
+ Memory struct {
+ IsAvailable bool `json:"memory_is_available"`
+ TotalMB uint64 `json:"total_mb"`
+ UsedMB uint64 `json:"used_mb"`
+ UsedPercent uint8 `json:"used_percent"`
+
+ SwapIsAvailable bool `json:"swap_is_available"`
+ SwapTotalMB uint64 `json:"swap_total_mb"`
+ SwapUsedMB uint64 `json:"swap_used_mb"`
+ SwapUsedPercent uint8 `json:"swap_used_percent"`
+ } `json:"memory"`
+
+ Mountpoints []MountpointInfo `json:"mountpoints"`
+}
+
+type MountpointInfo struct {
+ Path string `json:"path"`
+ Name string `json:"name"`
+ TotalMB uint64 `json:"total_mb"`
+ UsedMB uint64 `json:"used_mb"`
+ UsedPercent uint8 `json:"used_percent"`
+}
+
+type SystemInfoRequest struct {
+ CPUTempSensor string `yaml:"cpu-temp-sensor"`
+ HideMountpointsByDefault bool `yaml:"hide-mountpoints-by-default"`
+ Mountpoints map[string]MointpointRequest `yaml:"mountpoints"`
+}
+
+type MointpointRequest struct {
+ Name string `yaml:"name"`
+ Hide *bool `yaml:"hide"`
+}
+
+// Currently caches hostname indefinitely which isn't ideal
+// Potential issue with caching boot time as it may not initially get reported correctly:
+// https://github.com/shirou/gopsutil/issues/842#issuecomment-1908972344
+type cacheableHostInfo struct {
+ available bool
+ hostname string
+ platform string
+ bootTime timestampJSON
+}
+
+var cachedHostInfo cacheableHostInfo
+
+func getHostInfo() (cacheableHostInfo, error) {
+ var err error
+ info := cacheableHostInfo{}
+
+ info.hostname, err = os.Hostname()
+ if err != nil {
+ return info, err
+ }
+
+ info.platform, _, _, err = host.PlatformInformation()
+ if err != nil {
+ return info, err
+ }
+
+ bootTime, err := host.BootTime()
+ if err != nil {
+ return info, err
+ }
+
+ info.bootTime = timestampJSON{time.Unix(int64(bootTime), 0)}
+ info.available = true
+
+ return info, nil
+}
+
+func Collect(req *SystemInfoRequest) (*SystemInfo, []error) {
+ if req == nil {
+ req = &SystemInfoRequest{}
+ }
+
+ var errs []error
+
+ addErr := func(err error) {
+ errs = append(errs, err)
+ }
+
+ info := &SystemInfo{
+ Mountpoints: []MountpointInfo{},
+ }
+
+ applyCachedHostInfo := func() {
+ info.HostInfoIsAvailable = true
+ info.BootTime = cachedHostInfo.bootTime
+ info.Hostname = cachedHostInfo.hostname
+ info.Platform = cachedHostInfo.platform
+ }
+
+ if cachedHostInfo.available {
+ applyCachedHostInfo()
+ } else {
+ hostInfo, err := getHostInfo()
+ if err == nil {
+ cachedHostInfo = hostInfo
+ applyCachedHostInfo()
+ } else {
+ addErr(fmt.Errorf("getting host info: %v", err))
+ }
+ }
+
+ coreCount, err := cpu.Counts(true)
+ if err == nil {
+ loadAvg, err := load.Avg()
+ if err == nil {
+ info.CPU.LoadIsAvailable = true
+ if runtime.GOOS == "windows" {
+ // The numbers returned here seem unreliable on Windows. Even with the CPU pegged
+ // at close to 50% for multiple minutes, load1 is sometimes way under or way over
+ // with no clear pattern. Dividing by core count gives numbers that are way too
+ // low so that's likely not necessary as it is with unix.
+ info.CPU.Load1Percent = uint8(math.Min(loadAvg.Load1*100, 100))
+ info.CPU.Load15Percent = uint8(math.Min(loadAvg.Load15*100, 100))
+ } else {
+ info.CPU.Load1Percent = uint8(math.Min((loadAvg.Load1/float64(coreCount))*100, 100))
+ info.CPU.Load15Percent = uint8(math.Min((loadAvg.Load15/float64(coreCount))*100, 100))
+ }
+ } else {
+ addErr(fmt.Errorf("getting load avg: %v", err))
+ }
+ } else {
+ addErr(fmt.Errorf("getting core count: %v", err))
+ }
+
+ memory, err := mem.VirtualMemory()
+ if err == nil {
+ info.Memory.IsAvailable = true
+ info.Memory.TotalMB = memory.Total / 1024 / 1024
+ info.Memory.UsedMB = memory.Used / 1024 / 1024
+ info.Memory.UsedPercent = uint8(math.Min(memory.UsedPercent, 100))
+ } else {
+ addErr(fmt.Errorf("getting memory info: %v", err))
+ }
+
+ swapMemory, err := mem.SwapMemory()
+ if err == nil {
+ info.Memory.SwapIsAvailable = true
+ info.Memory.SwapTotalMB = swapMemory.Total / 1024 / 1024
+ info.Memory.SwapUsedMB = swapMemory.Used / 1024 / 1024
+ info.Memory.SwapUsedPercent = uint8(math.Min(swapMemory.UsedPercent, 100))
+ } else {
+ addErr(fmt.Errorf("getting swap memory info: %v", err))
+ }
+
+ // currently disabled on Windows because it requires elevated privilidges, otherwise
+ // keeps returning a single sensor with key "ACPI\\ThermalZone\\TZ00_0" which
+ // doesn't seem to be the CPU sensor or correspond to anything useful when
+ // compared against the temperatures Libre Hardware Monitor reports.
+ // Also disabled on the bsd's because it's not implemented by go-psutil for them
+ if runtime.GOOS != "windows" && runtime.GOOS != "openbsd" && runtime.GOOS != "netbsd" && runtime.GOOS != "freebsd" {
+ sensorReadings, err := sensors.SensorsTemperatures()
+ _, errIsWarning := err.(*sensors.Warnings)
+ if err == nil || errIsWarning {
+ if req.CPUTempSensor != "" {
+ for i := range sensorReadings {
+ if sensorReadings[i].SensorKey == req.CPUTempSensor {
+ info.CPU.TemperatureIsAvailable = true
+ info.CPU.TemperatureC = uint8(sensorReadings[i].Temperature)
+ break
+ }
+ }
+
+ if !info.CPU.TemperatureIsAvailable {
+ addErr(fmt.Errorf("CPU temperature sensor %s not found", req.CPUTempSensor))
+ }
+ } else if cpuTempSensor := inferCPUTempSensor(sensorReadings); cpuTempSensor != nil {
+ info.CPU.TemperatureIsAvailable = true
+ info.CPU.TemperatureC = uint8(cpuTempSensor.Temperature)
+ }
+ } else {
+ addErr(fmt.Errorf("getting sensor readings: %v", err))
+ }
+ }
+
+ addedMountpoints := map[string]struct{}{}
+ addMountpointInfo := func(requestedPath string, mpReq MointpointRequest) {
+ if _, exists := addedMountpoints[requestedPath]; exists {
+ return
+ }
+
+ isHidden := req.HideMountpointsByDefault
+ if mpReq.Hide != nil {
+ isHidden = *mpReq.Hide
+ }
+ if isHidden {
+ return
+ }
+
+ usage, err := disk.Usage(requestedPath)
+ if err == nil {
+ mpInfo := MountpointInfo{
+ Path: requestedPath,
+ Name: mpReq.Name,
+ TotalMB: usage.Total / 1024 / 1024,
+ UsedMB: usage.Used / 1024 / 1024,
+ UsedPercent: uint8(math.Min(usage.UsedPercent, 100)),
+ }
+
+ info.Mountpoints = append(info.Mountpoints, mpInfo)
+ addedMountpoints[requestedPath] = struct{}{}
+ } else {
+ addErr(fmt.Errorf("getting filesystem usage for %s: %v", requestedPath, err))
+ }
+ }
+
+ if !req.HideMountpointsByDefault {
+ filesystems, err := disk.Partitions(false)
+ if err == nil {
+ for _, fs := range filesystems {
+ addMountpointInfo(fs.Mountpoint, req.Mountpoints[fs.Mountpoint])
+ }
+ } else {
+ addErr(fmt.Errorf("getting filesystems: %v", err))
+ }
+ }
+
+ for mountpoint, mpReq := range req.Mountpoints {
+ addMountpointInfo(mountpoint, mpReq)
+ }
+
+ sort.Slice(info.Mountpoints, func(a, b int) bool {
+ return info.Mountpoints[a].UsedPercent > info.Mountpoints[b].UsedPercent
+ })
+
+ return info, errs
+}
+
+func inferCPUTempSensor(sensors []sensors.TemperatureStat) *sensors.TemperatureStat {
+ for i := range sensors {
+ switch sensors[i].SensorKey {
+ case
+ "coretemp_package_id_0", // intel / linux
+ "coretemp", // intel / linux
+ "k10temp", // amd / linux
+ "zenpower", // amd / linux
+ "cpu_thermal": // raspberry pi / linux
+ return &sensors[i]
+ }
+ }
+
+ return nil
+}