Rename Notice

Yes, this repository was renamed from glance-micro-scripts to glance-addon-scripts.

This repository started with only a few scripts like HTML Script Loader and Swipe Left and Right hence why it's previously named glance-micro-scripts. Then I started adding Modal, Glimpse and Responsive Table which quickly made the previous name irrelevant.

Rewrite Notice

With how the scripts got larger hence the need to rename this repository, I have rewritten the method of loading the scripts. Previously with the $include, everything is loaded to the DOM and not cached by default. If you still need the $include method:

• see the include-method-script-loading branch, but just know that I will no longer be updating that.
• or check below.

⚠️ Disclaimer

This repository provides an unofficial addon script for Glance.
It is not affiliated with, endorsed by, or connected to it or its maintainers.

Warning

These scripts are unofficial and intended for users who are comfortable exploring and modifying their dashboard. Review the code before use.

Provided under the terms of the GPL-3.0 license

Check the Widget Repository that uses some of these scripts.

Addon Scripts

Script	Short Description	Tested Version
HTML Script Loader	Adds the ability to load <script> inside custom-api	v0.8.4 | dev@784bf53
Swipe Left and Right	Swipe left/right on Mobile	v0.8.4 | dev@784bf53
Modal	A modal popup	v0.8.4 | dev@784bf53
Tab Notification	Show notification count on group tabs	v0.8.4 | dev@784bf53
Glimpse	A Quick Launch for Glance	v0.8.4 | dev@784bf53
Responsive Table	A table widget	v0.8.4 | dev@784bf53
Lazy Unloader	Unloads image when not in view	v0.8.4 | dev@784bf53
Custom Menu	Menu grid for Addon Script	v0.8.4 | dev@784bf53
Toast Message	Custom notification message display	v0.8.4 | dev@784bf53
Custom Settings	Custom settings manager for Addon Script	v0.8.4 | dev@784bf53
Theming	Theme editor/manager for Glance	v0.8.4 | dev@784bf53
Mobile Vertical Navigation	Replaces horizontal navigation	v0.8.4 | dev@784bf53
Custom Dialog	A basic dialog box	v0.8.4 | dev@784bf53
Navigation Shortcuts	Navigation shortcut using Ctrl+Shift+#	v0.8.4 | dev@784bf53
Iframe Bookmarks Nav	Turning bookmarks into navigation, paired with iframe	v0.8.4 | dev@784bf53

Limitations

Scripts that provide GUI itself like Modal can only be used with widgets that allows custom html like custom-api, html, extension and the like.

Loading Script

We will use the Glance's served assets path at /assets/.

in the document config:

document:
  head: | #gohtml
    <script async src="/assets/glance-addon-scripts/global-functions/CREATE_ELEMENT.js?v=1"></script>
    
    <link rel="preload" href="/assets/glance-addon-scripts/toast-message/style.css?v=1" as="style" onload="this.onload=null;this.rel='stylesheet'">
    <script defer src="/assets/glance-addon-scripts/toast-message/script.js?v=1"></script>

Cloned Project

You can clone this project inside the /assets/ and load all of them using load-addons.html. Let's assume your assets folder is /home/user/glance-assets:

cd /home/user/glance-assets
git clone https://github.com/ralphocdol/glance-addon-scripts.git

Then on your glance.yml

server:
  assets-path: /home/user/glance-assets
  
document:
  head: | #gohtml
    $include: /home/user/glance-assets/glance-addon-scripts/load-addons.html

Still want to use $include?

Click to expand

If for some reason you really want to use the $include method, I will not be supporting it but you should be able to:

  head: | #gohtml
    <script>
      $include: /app/assets/glance-addon-scripts/global-functions/CREATE_ELEMENT.js
    </script>
    <script>
      $include: /app/assets/glance-addon-scripts/toast-message/style.css
    </script>

you can retain the css in import url or copy the one above

Know issue

Loading the scripts this way will have a Cache Busting Issue. I have a reopened issue at glanceapp/glance #550 if you'd like to upvote it. For now, you, the user, will have to do things manually.

Here are several approach to do so:

• By force reloading your browser while Glance is open, there are plenty of tutorial out there on how to do it but typically it's just Ctrl+Shift+R.
• By updating all the instance of ?v=1 to ?v=2 and so on each addon-script update.
• By modifying the Glance's Docker Compose entrypoint. By default, as of v0.8.4, it's /app/glance --config /app/config/glance.yml and is omitted.

    services:
      glance:
        image: glanceapp/glance:v0.8.4
        container_name: glance
        environment:
          - MY_ENV_VAR=test-value
        entrypoint: sh -c 'export LAST_RESTART=$(date +%s); exec /app/glance --config /app/config/glance.yml'

  This will now append an Environment Variable called LAST_RESTART which can be used to replace ?v=1 to ?v=${LAST_RESTART}. The only downside is that, this only works if the Docker Compose of Glance is restarted and not when Glance gets reloaded.
• If you want to disable caching entirely and don't care about bandwidth or any other issue that may come with it (careful, this is for those who knows what they are doing). You can do so by disabling the caching. If you are using Nginx to proxy Glance, you can add this location block

    location /assets/glance-addon-scripts/ {
      add_header Cache-Control 'no-store, no-cache, must-revalidate, proxy-revalidate, max-age=0';
      add_header Pragma 'no-cache';
      add_header Expires 0;
    }