v0.5.0

You can discuss this release here.

Complete information about each new widget and property can be found in the configuration docs.

New

Search widget

- type: search
  search-engine: duckduckgo
  bangs:
    - title: YouTube
      shortcut: "!yt"
      url: https://www.youtube.com/results?search_query={QUERY}

Yes, there's support for custom bangs! If you don't know what bangs are, you can learn about them here. In short, you can easily specify where to search depending on how your query starts. With the above configuration, the query "!yt good mythical morning" will search in YouTube.

You can also use a custom search engine:

- type: search
  search-engine: https://whoogle.your-domain.com/search?q={QUERY}

Tip

Pressing S anywhere on the page will focus the search input.

Pressing Enter will show search results in the same tab.

Pressing Ctrl + Enter will show search results in a new tab.

(thanks for contributing @chand1012)

Clock widget

- type: clock
  hour-format: 24h
  timezones:
    - timezone: Europe/Paris
      label: Paris
    - timezone: America/New_York
      label: New York
    - timezone: Asia/Tokyo
      label: Tokyo

The timezones are optional.

(thanks for contributing @yardenshoham)

Lobsters widget

- type: lobsters
  sort-by: hot

(thanks for contributing @jonasknobloch)

changedetection.io widget

- type: change-detection
  instance-url: changedetection.your-domain.com
  token: <your API token>

(thanks for contributing @knhash)

Extension widget

While I will continue adding new widgets, I won't be able to add every single requested widget. To alleviate this, if you know how to setup an HTTP server and a bit of HTML and CSS, you can now develop your own widgets:

- type: extension
  url: http://localhost:9001
  allow-potentially-dangerous-html: true
  parameters:
    name: David

Regardless of whether you know PHP:

<?php
header('Widget-Title: My first extension');
header('Widget-Content-Type: html');
?>

<p>Hello, <span class="color-primary"><?= $_GET['name'] ?>!</span></p>

JavaScript:

const express = require('express');
const app = express();

app.get('/', (req, res) => {
  res.set('Widget-Title', 'My first extension');
  res.set('Widget-Content-Type', 'html');

  res.send(`<p>Hello, <span class="color-primary">${req.query.name}!</span></p>`);
});

app.listen(9001);

Or any other programming language. You can learn more about building your own extensions here.

Note that the API for this is not set in stone and may change in the future.

What's with the scary looking allow-potentially-dangerous-html?

In its current state, the extension widget is meant to be used by developers who want to add their own widgets to Glance but may not want to build and deploy their own fork (or may not know/want to learn Go). As we know, with great power comes great responsibility and being able to insert any HTML into your dashboard means you can also run any JavaScript. Do not use this widget with this property enabled and point to random URLs you may find online.

The long-term goal is to have extensions return generic content types such as videos, forum-posts, markets, streams, etc. in JSON format and then displayed by Glance using existing styles and functionality, allowing extension developers to achieve a native look while only focusing on providing data from their preferred source. This will allow for safe use of publicly hosted extensions.

HTML widget

For when you want to insert something a little more custom:

- type: html
  source: |
    <p>Hello, <span class="color-primary">World</span>!</p>

(thanks for the suggestion @yefoenix)

Glance can now be installed as a PWA

There are currently no major benefits to installing Glance as a PWA, however it does give you a dedicated app icon as well as remove the URL bar for a cleaner look.

(thanks for contributing @medinnna)

detailed-list style for the RSS widget

moving a little closer towards being worthy of being called an RSS reader

- type: rss
  style: detailed-list

(thanks for the suggestion @carlyman)

collapse-after-rows for Videos widget when using grid-cards style

You can now choose how many rows of videos are visible when using the grid-cards style, defaulting to 4:

- type: videos
  style: grid-cards
  collapse-after-rows: 2

(thanks for the suggestion @MKwareContributions)

Simple icons for the monitor widget

Just like with the bookmarks widget, you can now use simple icons for your monitored sites using the si: prefix:

- type: monitor
  sites:
    - title: Jellyfin
      url: https://jellyfin.your-domain.com/
      icon: si:jellyfin

(thanks for the suggestion @github-random-827495)

Insecure requests for the monitor widget

You can now make insecure requests to your monitored sites which is helpful for those who use self-signed certificates:

- type: monitor
  sites:
    - title: Jellyfin
      url: https://localhost:8080/
      icon: si:jellyfin
      allow-insecure: true

(thanks for the suggestion @Petbotson)

24-hour format for the weather widget

- type: weather
  hour-format: 24h
  location: London, UK

(thanks for contributing @tarikcoskun)

item-link-prefix for RSS feeds

Some (naughty) RSS feeds don't return full links for each post, omitting the domain and only providing the path. Glance will now try to automatically correct such links by prepending the feed domain, however in cases where it gets this wrong you can override the prefix with the new item-link-prefix property:

- type: rss
  feeds:
    - url: https://www.bungie.net/en/rss/News
      item-link-prefix: https://www.bungie.net/
      title: Bungie

(thanks for reporting the issue @SapphicMoe)

Changed

Weather widget no longer prevents app startup

Previously, the weather widget would make an HTTP request to validate the provided location which occurred during app startup, meaning that if you had no internet connection you couldn't start Glance. This also meant that the --check-config option wouldn't work if you had no internet connection. This has now been changed and the validation of the location is done on page load.

(thanks for reporting this issue @msfjarvis & @Jerakin)

Stocks widget is now Markets

Initially the stocks widget was intended for, well, stocks. This quickly stopped being the case as it was being used for all kinds of different markets. To better reflect this, it will now be referred to as "Markets" within the configuration as well as the docs. To retain backwards compatibility you don't have to change anything and you can still use this in your configuration:

- type: stocks
  stocks:
    - symbol: SPY
      name: S&P 500

However the preferred way of configuring it will now be the following:

- type: markets
  markets:
    - symbol: SPY
      name: S&P 500

(thanks for the suggestion @0x3e4)

v0.5.0-beta.1

What's Changed

• Adds reporting serve errors by @brian-petersen in #74
• Add web app support by @medinnna in #49
• Add 24-hour time format support for weather by @tarikcoskun in #59
• Add custom sorting to the twitch channels widget by @fawni in #76

Full Changelog: v0.4.0...v0.5.0-beta.1

v0.4.0

New

Repository widget

For those who like keeping an eye on their open source projects:

- type: repository
  repository: glanceapp/glance
  pull-requests-limit: 3
  issues-limit: 3

Hiding the pull requests or issues is possible by setting their limit to -1.

Experimental dynamic columns style for the bookmarks, monitor and stocks widgets

The three widgets have so far been primarily built to fit inside a small column, leaving lots to be desired when placed inside of a full column. There is now an experimental dynamic-columns-experimental style for all 3, giving you more flexibility in how you build your pages:

Note

Because this is experimental, the looks or behavior of this may change in the future depending on feedback.

dynamic-columns.mp4

- size: full
  widgets:
    - type: monitor
      style: dynamic-columns-experimental
      ...

    - type: stocks
      style: dynamic-columns-experimental
      ...

    - type: bookmarks
      style: dynamic-columns-experimental
      ...

(thanks for the idea @igeekbb & @allardhs)

RSS widget: horizontal-cards-2 style

For when the thumbnail is the main attraction:

You can adjust the height of the cards (for just this style) using the new card-height property:

- type: rss
  style: horizontal-cards-2
  card-height: 25 # in rems, where 1rem = 10px, so this would be 250px tall
  feeds: ...

A similar and newly added thumbnail-height can also be used to change the height of just the thumbnail for the horizontal-cards style.

Videos widget: grid-cards style

Mobile header

Phones have gotten fairly tall, so tall in fact that trying to reach a link at the top of the page can sometimes be a pain. The new show-mobile-header property, available for each page, can help push the content down and make it easier to get to:

- name: Homelab
  show-mobile-header: true
  columns: ...

Sorting options for Reddit and Hacker News

- type: reddit
  title: Cool projects from /r/selfhosted this month
  subreddit: selfhosted
  sort-by: top
  top-period: month
  search: flair:"Release"
  show-thumbnails: true

(results are not rigged, I swear)

Hacker news is a little more limited for now, allowing you to specify just sort-by with either top, new or best:

- type: hacker-news
  sort-by: new

(thanks for the suggestion @NoxesP & @knhash)

Symbol and chart links for stocks

You can now set a custom link for when you click on either the symbol or the chart of a stock:

- type: stocks
  stocks:
    - symbol: AAPL
      name: Apple
      symbol-link: https://www.google.com/search?tbm=nws&q=apple
      chart-link: https://www.tradingview.com/chart/?symbol=NASDAQ:AAPL

(thanks for the idea @0x3e4)

Specifying URLs for the Monitor widget from environment variables

- type: monitor
  sites:
    - title: Jellyfin
      url: ${URL_TO_JELLYFIN}

(thanks for the idea @devsjc)

Changed

Sort order for Reddit and Hacker News

You've probably noticed that Glance doesn't return posts in the order you'd find them in either Reddit or Hacker news. This was undocumented bevahior which attempted to place posts with above average points and comments higher, since by default you only see up to 5 posts. This sorting behavior is no longer the default and you'll now see posts in the exact order they are found on each site.

If you liked the way posts were being ordered you can still use the same sorting algorithm via the new extra-sort-by property which is available for both the Reddit and Hacker News widgets:

extra-sort-by: engagement

Note that engagement is currently the only possible option and other sorting algorithms may get added in the future.

Images now fade in when they load

If you're a Firefox user you may have noticed the jarring way in which it loads images, where it sometimes places a white background behind the image as it gets loaded:

(connection speed throttled to exaggerate issue)

image-loading-before.mp4

To make the experience a little more pleasant, images will now be hidden until they've loaded completely and then fade in:

image-loading-after.mp4

v0.3.0

New

Custom URLs

The reddit, hacker-news and videos widgets can now have custom URLs for the comments if you prefer using, or host alternative front-ends. Example:

- type: hacker-news
  comments-url-template: https://www.hckrnws.com/stories/{POST-ID}

- type: reddit
  comments-url-template: https://old.reddit.com/{POST-PATH}

- type: videos
  video-url-template: https://invidious.your-domain.com/watch?v={VIDEO-ID}

(thanks for the idea @AlissonSantos95)

In addition, if you're hosting Glance on a VPS you may have noticed that the Reddit widget doesn't work due to Reddit blocking VPS IPs. As a workaround, you can now set a custom URL for the requests, routing them through an HTTP proxy. Example:

- type: reddit
  request-url-template: https://your-proxy.com/{REQUEST-URL}

(thanks for contributing @jarylc and for reporting the issue @Iliannnn & @imjuzcy)

Thumbnails for Reddit posts

You can now show thumbnails for Reddit posts (for the default style) using the new show-thumbnails property:

- type: reddit
  subreddit: technology
  show-thumbnails: true

Preview:

Note

Thumbnails are disabled by some subreddits and aren't available for others due to limitations in Reddit's API but should work in most cases.

More control over the Weather widget location

Previously, you could only specify the city name and country for the location, however that made it impossible to set your location if the name of your city was used across multiple US states. You can now optionally select the state as the middle value:

location: Greenville, North Carolina, United States
# or 
location: Greenville, South Carolina, United States
# or
location: Greenville, Mississippi, United States

(thanks for reporting @mikesellt)

Additionally, you can now choose to show the state in the location using the new show-area-name property.

Opening links in the same tab

The bookmarks as well as monitor widgets now have a same-tab property for each entry which allows you to specify whether to open the link in the same or a new tab. Example:

- type: bookmarks
  groups:
    - title: Entertainment
      links:
        - title: YouTube
          url: https://www.youtube.com/
          same-tab: true

- type: monitor
  sites:
    - title: Jellyfin
      url: https://your-domain.com/
      same-tab: true

(thanks for the idea @Rinnray)

Hiding the arrow of bookmark links

You can now hide the arrow for each link in the bookmarks widget using the new hide-arrow property:

- type: bookmarks
  groups:
    - title: Entertainment
      links:
        - title: YouTube
          url: https://www.youtube.com/
          hide-arrow: true

Preview:

Icons for bookmark links

You can now add icons to bookmark links using the new icon property on each link:

- type: bookmarks
  groups:
    - title: General
      links:
        - title: Gmail
          url: https://mail.google.com/mail/u/0/
          icon: /assets/path/to/icon.png

Preview, combined with hide-arrow: true:

(thanks for the idea @Rinnray)

Additionally, you can now directly use Simple Icons for each bookmark icon using the si: prefix:

icon: si:gmail
icon: si:youtube
icon: si:reddit

Warning

Simple Icons are loaded externally and are hosted on cdnjs.cloudflare.com, if you do not wish to depend on a 3rd party you are free to download the icons individually and host them locally.

Changed

Stocks widget sort order

Previously, the stocks widget would order the stocks based on their price change for the day, placing the ones with the highest % change at the top. As this was somewhat unexpected and potentially confusing, it will now display stocks in the order which they were defined by default. To go back to the old behavior, use the sort-by property:

- type: stocks
  sort-by: absolute-change

(thanks for reporting @allardhs)

Fixed

• The stocks widget now displays the proper currency symbol for prices (thanks for reporting @Iliannnn)

v0.2.0

New

Weather widget temperature units

You can now switch between Celsius and Fahrenheit using the new units property which accepts either metric or imperial:

- type: weather
  units: imperial

Custom CSS

You can add your own CSS file via the new custom-css-file property under theme:

theme:
  custom-css-file: /assets/path/style.css

Changed

Monitor widget

Previously the widget would try to make a HEAD request in order to determine the status of a site, however some servers don't support this method which lead to client errors. It will instead make a GET request now which should resolve the issues caused by this behavior.

v0.1.0

Initial commit