Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Adds a lot more customization options #28

Open
wants to merge 9 commits into
base: master
Choose a base branch
from
Open
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
180 changes: 110 additions & 70 deletions README.md
Original file line number Diff line number Diff line change
@@ -1,107 +1,147 @@
## SUI
*a startpage for your server and / or new tab page*
## SUI Extended

_A startpage for your server and / or new tab page_

![screenshot](https://i.imgur.com/J4d7Q3D.png)

[More screenshots](https://imgur.com/a/FDVRIyw)

[Extended Options](https://imgur.com/a/69CwxxW)

### Deploy with Docker compose

#### Prerequisites:
- Docker: [Linux](https://docs.docker.com/install/linux/docker-ce/debian/), [Mac](https://hub.docker.com/editions/community/docker-ce-desktop-mac), [Windows](https://hub.docker.com/editions/community/docker-ce-desktop-windows)
- [Docker-compose](https://docs.docker.com/compose/install/)

#### Install:
- Docker: [Linux](https://docs.docker.com/install/linux/docker-ce/debian/), [Mac](https://hub.docker.com/editions/community/docker-ce-desktop-mac), [Windows](https://hub.docker.com/editions/community/docker-ce-desktop-windows)
- [Docker-compose](https://docs.docker.com/compose/install/)

- `git clone` this repository
- Build and bring up with `docker-compose up -d`
- The page should be available at `http://localhost:4000`
#### Install:

To run at a different port open edit docker-compose.yml:
- `git clone` this repository
- Build and bring up with `docker compose up -d`
- The page should be available at `http://localhost:4000`

ports:
- 4000:80
To run at a different port edit the docker-compose.yml
```yaml
ports:
- 4000:80
```

#### Install pull from git variant:

- refreshs source code every 5 minutes from master branch you provided - convenience feature for lacy devs
- `git clone` this repository
- build image `docker build -f DockerfilePullFromGit -t sui:latest .`
- run image with `docker run -e GITURL='https://x:[email protected]/jeroenpardon/sui.git' -p 8081:80 sui:latest`
- can be run also with a private repository by setting username:api-key@ in the url (see above example). Otherwise remove this part of the url.


- refresh the source code every 5 minutes from master branch you provided - convenience feature for lazy devs
- `git clone` this repository
- build image `docker build -f DockerfilePullFromGit -t sui:latest .`
- run image with `docker run -e GITURL='https://x:[email protected]/jeroenpardon/sui.git' -p 8081:80 sui:latest`
- can be run also with a private repository by setting username:api-key@ in the url (see above example). Otherwise remove this part of the url.

### Customization

#### Config options

Change the config.json to your likings.

| Option | Default | Description |
| --------------------- | ---------------- | ----------------------------------------------- |
| `language` | `en-GB` | The language code for localization. |
| `greetings.morning` | `Good Morning` | Greeting text for the morning. |
| `greetings.afternoon` | `Good Afternoon` | Greeting text for the afternoon. |
| `greetings.evening` | `Good Evening` | Greeting text for the evening. |
| `greetings.night` | `Good Night` | Greeting text for the night. |
| `useOauth2` | `false` | Whether to use OAuth2 Proxy for authentication. |
| `useAppCategories` | `false` | Whether to categorize applications. |
| `oauth2UserInfoURL` | `""` | URL to call for user info. |
| `userPermissionKey` | `""` | Key used for user permissions on userinfo call. |
| `withApps` | `true` | Whether to show applications. |
| `withLinks` | `true` | Whether to show links. |
| `withSearch` | `true` | Whether to enable search functionality. |
| `hideSettings` | `false` | Whether to hide the settings option. |
| `labels.bookmarks` | `Bookmarks` | Label text for bookmarks. |
| `labels.applications` | `Applications` | Label text for applications. |
| `backgroundImage` | `""` | URL for the background image. |
| `defaultTheme` | `blackboard` | The default theme to use. |

#### Theme Configuration

Change any theme you want or at a new theme by adding a name and the 3 color values.

| Option | Default | Description |
| ------------------ | --------- | -------------------------------- |
| `color-background` | `#1a1a1a` | Background color of the theme. |
| `color-text-pri` | `#FFFDEA` | Primary text color of the theme. |
| `color-text-acc` | `#5c5c5c` | Accent text color of the theme. |

#### Changing color themes
- Click the options button on the left bottom

To change your theme click the options button on the bottom left and select your new theme. The selected theme will be stored in the local storage and loaded from there.

#### Apps
Add your apps by editing apps.json:

Add your apps by editing the `apps.json`:

```json
{
"apps": [
{ "name": "Name of app 1", "url": "sub1.example.com", "icon": "icon-name" },
{
"apps" : [
{"name":"Name of app 1","url":"sub1.example.com","icon":"icon-name"},
{"name":"Name of app 2","url":"sub2.example.com","icon":"icon-name","target":"optionals"}
]
"name": "Name of app 2",
"url": "sub2.example.com",
"icon": "icon-name",
"target": "optionals",
"groups": ["foo", "bar"], // works only if useOauth2Proxy is set to true
"category": "Test Category" // only used if useAppCategories is set to true
}
]
}
```

Please note:

- No `http://` in the URL
- No `,` at the end of the last app's line
- Find the names of icons to use at [Material Design Icons](https://materialdesignicons.com/)
- No `http://` in the URL
- No `,` at the end of the last app's line
- Find the names of the icons to use at [Material Design Icons](https://materialdesignicons.com/)

#### Bookmarks
Add your bookmarks by editing links.json:

```
Add your bookmarks by editing the `links.json`:

```json
{
"bookmarks":[
{
"category":"Category1",
"links":[
{
"name":"Link1",
"url":"http://example.com"
},
{
"name":"Link2",
"url":"http://example.com",
"target":"optionals"
}
]
},
{
"category":"Category2",
"links":[
{
"name":"Link1",
"url":"http://example.com"
},
{
"name":"Link2",
"url":"http://example.com"
}
]
}
]
"bookmarks": [
{
"category": "Category1",
"links": [
{
"name": "Link1",
"url": "http://example.com"
},
{
"name": "Link2",
"url": "http://example.com",
"target": "optionals"
}
]
},
{
"category": "Category2",
"links": [
{
"name": "Link1",
"url": "http://example.com"
},
{
"name": "Link2",
"url": "http://example.com"
}
]
}
]
}
```

Add names for the categories you wish to define and add the bookmarks for each category.

Please note:

- No `http://` in the URL
- No `,` at the end of the last bookmark in a category and at the end of the last category


#### Color themes
These can be added or customized in the themer.js file. When changing the name of a theme or adding one, make sure to edit this section in index.html accordingly:

```
<section class="themes">
```

I might add a simpler way to edit themes at some point, but adding the current ones should be pretty straight forward.
- No `http://` in the URL
- No `,` at the end of the last bookmark in a category and at the end of the last category
111 changes: 88 additions & 23 deletions apps.json
Original file line number Diff line number Diff line change
@@ -1,24 +1,89 @@
{
"apps" : [
{"name":"Bazarr","url":"subs.example.com","icon":"message-video", "target": "_blank"},
{"name":"CloudCMD","url":"files.example.com","icon":"folder-multiple-outline"},
{"name":"Cockpit","url":"cp.example.com","icon":"airplane"},
{"name":"Feedbin","url":"rss.example.com","icon":"rss"},
{"name":"Filestash","url":"cloud.example.com","icon":"package"},
{"name":"Jackett","url":"jackett.example.com","icon":"tshirt-crew-outline"},
{"name":"Lidarr","url":"music.example.com","icon":"music"},
{"name":"Minio","url":"minio.example.com","icon":"server"},
{"name":"Mylar","url":"comics.example.com","icon":"book-open-variant"},
{"name":"Nextcloud","url":"cloud.example.com","icon":"weather-cloudy"},
{"name":"Ombi","url":"request.example.com","icon":"file-find-outline"},
{"name":"Pi-hole","url":"pihole.example.com","icon":"do-not-disturb"},
{"name":"Plex","url":"play.example.com","icon":"plex"},
{"name":"Portainer","url":"port1.example.com","icon":"docker"},
{"name":"Radarr","url":"movies.example.com","icon":"filmstrip"},
{"name":"Sonarr","url":"tv.example.com","icon":"television-box"},
{"name":"Stackedit","url":"md.example.com","icon":"markdown"},
{"name":"Transmission","url":"dl.example.com","icon":"progress-download"},
{"name":"Ubooquity","url":"opds.example.com","icon":"library-shelves"},
{"name":"Youtube-DL","url":"yt.example.com","icon":"youtube"}
]
}
"apps": [
{
"name": "Bazarr",
"url": "subs.example.com",
"icon": "message-video",
"target": "_blank",
"category": "Admin"
},
{
"name": "CloudCMD",
"url": "files.example.com",
"icon": "folder-multiple-outline",
"category": "Admin"
},
{
"name": "Cockpit",
"url": "cp.example.com",
"icon": "airplane",
"category": "Admin"
},
{
"name": "Feedbin",
"url": "rss.example.com",
"icon": "rss",
"category": "Infrastructure"
},
{
"name": "Filestash",
"url": "cloud.example.com",
"icon": "package",
"category": "Infrastructure"
},
{
"name": "Jackett",
"url": "jackett.example.com",
"icon": "tshirt-crew-outline",
"category": "Infrastructure"
},
{
"name": "Lidarr",
"url": "music.example.com",
"icon": "music",
"category": "Support"
},
{
"name": "Minio",
"url": "minio.example.com",
"icon": "server",
"category": "Support"
},
{
"name": "Mylar",
"url": "comics.example.com",
"icon": "book-open-variant"
},
{
"name": "Nextcloud",
"url": "cloud.example.com",
"icon": "weather-cloudy"
},
{
"name": "Ombi",
"url": "request.example.com",
"icon": "file-find-outline"
},
{
"name": "Pi-hole",
"url": "pihole.example.com",
"icon": "do-not-disturb"
},
{ "name": "Plex", "url": "play.example.com", "icon": "plex" },
{ "name": "Portainer", "url": "port1.example.com", "icon": "docker" },
{ "name": "Radarr", "url": "movies.example.com", "icon": "filmstrip" },
{ "name": "Sonarr", "url": "tv.example.com", "icon": "television-box" },
{ "name": "Stackedit", "url": "md.example.com", "icon": "markdown" },
{
"name": "Transmission",
"url": "dl.example.com",
"icon": "progress-download"
},
{
"name": "Ubooquity",
"url": "opds.example.com",
"icon": "library-shelves"
},
{ "name": "Youtube-DL", "url": "yt.example.com", "icon": "youtube" }
]
}
Loading