diff --git a/.dockerignore b/.dockerignore new file mode 100644 index 0000000..5d3dae0 --- /dev/null +++ b/.dockerignore @@ -0,0 +1,5 @@ +**/db.sqlite +**/node_modules +**/appdata +.gitignore +**/screenshots \ No newline at end of file diff --git a/.gitignore b/.gitignore index 7631158..c6bc597 100644 --- a/.gitignore +++ b/.gitignore @@ -1,8 +1,3 @@ -**/node_modules/ -**/database.sqlite -**/appdata/ -.github -test -.dockerignore -.gitignore -docker-compose.yaml \ No newline at end of file +**/db.sqlite +**/node_modules +**/appdata \ No newline at end of file diff --git a/CHANGELOG.md b/CHANGELOG.md index 718c750..e844b8c 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,3 +1,27 @@ +## v0.40 (Feb 26th 2024) - HTMX rewrite +* Pages rewritten to use HTMX. +* Removed Socket.io. +* Changed view files to *.HTML instead of *.EJS. +* Removed "USER root" from Dockerfile. +* Express sessions configured to use memorystore. +* Improved chart rendering. +* Improvements to container charts. +* Created Variables page. +* Created Supporters page. +* Ability to remove images, volumes, or networks. +* Fixed list.js sorting. +* Fixed apps.js page navigation. +* Removed stackfiles from templates.json and updated some icons. +* New logo. +* Improved handling of Docker events. +* Improved dashboard responsiveness. +* Updated server metrics styles. +* Container cards display pending action. +* Container charts only rendered if container running. +* Created permissions modal. +* Podman support (untested). +* Started a new template for FOSS apps. + ## v0.20 (Jan 20th 2024) - The rewrite. Jumping all the way to v0.20. * Changed to ES6 imports. * Cleaned up file structure and code layout. diff --git a/Dockerfile b/Dockerfile index 47f4b4e..cbc3500 100644 --- a/Dockerfile +++ b/Dockerfile @@ -1,19 +1,7 @@ FROM node:21-alpine - ENV NODE_ENV=production - WORKDIR /app - -RUN --mount=type=bind,source=package.json,target=package.json \ - --mount=type=bind,source=package-lock.json,target=package-lock.json \ - --mount=type=cache,target=/root/.npm \ - npm ci --omit=dev - - -USER root - -COPY . . - +COPY . /app +RUN npm install EXPOSE 8000 - -CMD ["node", "server.js"] +CMD node server.js \ No newline at end of file diff --git a/README.md b/README.md index dd3b37c..fd3fb1b 100644 --- a/README.md +++ b/README.md @@ -1,7 +1,7 @@ # DweebUI DweebUI is a web interface for managing Docker, with a zero-config dashboard for controlling and monitoring your containers. -Alpha v0.20 ( :fire: Experimental :fire: ) +Alpha v0.40 ( :fire: Experimental :fire: ) [:warning: DweebUI is a management interface and should not be directly exposed to the internet :warning:](https://github.com/lllllllillllllillll/DweebUI/wiki/Exposing-DweebUI-to-the-Internet) @@ -10,7 +10,7 @@ Alpha v0.20 ( :fire: Experimental :fire: ) [![GitHub Activity](https://img.shields.io/github/commit-activity/y/lllllllillllllillll/DweebUI)](https://github.com/lllllllillllllillll) [![Docker Pulls](https://img.shields.io/docker/pulls/lllllllillllllillll/dweebui)](https://hub.docker.com/repository/docker/lllllllillllllillll/dweebui) [![GitHub License](https://img.shields.io/github/license/lllllllillllllillll/DweebUI)](https://github.com/lllllllillllllillll/DweebUI/blob/main/LICENSE) -[![GitHub License](https://img.shields.io/badge/-buy_me_a%C2%A0coffee-gray?logo=buy-me-a-coffee)](https://www.buymeacoffee.com/lllllllillllllillll) +[![Coffee](https://img.shields.io/badge/-buy_me_a%C2%A0coffee-gray?logo=buy-me-a-coffee)](https://www.buymeacoffee.com/lllllllillllllillll) * This is a personal project I started to get more familiar with Javascript and Node.js. * Some UI elements are placeholders and every version may have breaking changes. @@ -31,8 +31,9 @@ Alpha v0.20 ( :fire: Experimental :fire: ) * [x] Dashboard provides server metrics, container metrics, and container controls, on a single page. * [x] View container logs. * [ ] Update containers (planned). -* [ ] Manage your Docker networks, images, and volumes (in development). +* [x] Manage your Docker networks, images, and volumes. * [x] Light/Dark Mode. +* [x] Mobile Friendly. * [x] Easy to install app templates. * [x] Multi-User built-in. * [ ] Permissions system (in development). @@ -41,6 +42,7 @@ Alpha v0.20 ( :fire: Experimental :fire: ) * [x] Templates.json maintains compatability with Portainer, allowing you to use the template without needing to use DweebUI. * [x] Automatically persists data in docker volumes if bind mount isn't used. * [ ] Preset variables (planned). +* [ ] Themes (planned). ## Setup @@ -51,9 +53,8 @@ version: "3.9" services: dweebui: container_name: dweebui - image: lllllllillllllillll/dweebui:v0.20 + image: lllllllillllllillll/dweebui:v0.40 environment: - NODE_ENV: production PORT: 8000 SECRET: MrWiskers restart: unless-stopped @@ -61,7 +62,11 @@ services: - 8000:8000 volumes: - dweebui:/app + # Docker socket - /var/run/docker.sock:/var/run/docker.sock + # Podman socket + #- /run/podman/podman.sock:/var/run/docker.sock + networks: - dweebui_net @@ -91,4 +96,5 @@ Compose setup: ## Supporters -* MM (Patreon) \ No newline at end of file +* MM (Patreon) +* PD (Buymeacoffee) \ No newline at end of file diff --git a/components/containerCard.js b/components/containerCard.js index fcd9690..5637d08 100644 --- a/components/containerCard.js +++ b/components/containerCard.js @@ -1,32 +1,29 @@ -// export for app.js export const containerCard = (data) => { let { name, service, state, external_port, internal_port, ports, link } = data; let wrapped = name; - let chart = name; + let disable = ""; + let chartName = name.replace(/-/g, ''); - if (name.length > 13) { - wrapped = name.slice(0, 10) + '...'; - } - - //disable controls for a docker container depending on its name - let actions = ""; - if (name.startsWith('dweebui')) { - actions = 'disabled=""'; - } + // shorten long names + if (name.length > 13) { wrapped = name.slice(0, 10) + '...'; } + // disable buttons for dweebui + if (name.startsWith('dweebui')) { disable = 'disabled=""'; } if ( external_port == undefined ) { external_port = 0; } if ( internal_port == undefined ) { internal_port = 0; } - let state_indicator = 'green'; if (state == 'exited') { - state = 'stopped'; - state_indicator = 'red'; + state = 'stopped'; + state_indicator = 'red'; } else if (state == 'paused') { - state_indicator = 'orange'; + state_indicator = 'orange'; } + let noChart = 'hx-swap="none"'; + if (state == 'running') { noChart = ''; } + let ports_data = []; if (ports) { ports_data = ports; @@ -49,7 +46,7 @@ export const containerCard = (data) => { return ` -
+
@@ -60,16 +57,16 @@ export const containerCard = (data) => {
- - - -
@@ -77,11 +74,11 @@ export const containerCard = (data) => {
- - - - - + + + + +
@@ -89,9 +86,9 @@ export const containerCard = (data) => {
- - - + + +
@@ -105,13 +102,27 @@ export const containerCard = (data) => {
- - - ${state} - +
-
+ + + +
+
+ +
+ +
@@ -206,18 +217,35 @@ export const containerCard = (data) => {
+ +
+
+
+ User: + +
+
+
+
+
+
diff --git a/views/dashboard.ejs b/views/dashboard.ejs deleted file mode 100644 index 7973d2f..0000000 --- a/views/dashboard.ejs +++ /dev/null @@ -1,1011 +0,0 @@ - - - - - - - DweebUI - Dashboard - - - - - - -
- - <%- include('navbar.ejs') %> -
- -
-
-
- -
-
- -
-
-
-
-
- - - -
-
-
- -
-
- -
-
-
-
-
-
- -
-
-
-
-
- - - -
-
-
- -
-
- -
-
-
-
-
-
- -
-
-
-
-
- - - -
-
-
- -
-
- -
-
-
-
-
-
- -
-
-
-
-
- - - -
-
-
- -
-
- -
-
-
-
-
-
- - -
-
- - - - - - - - - - - -
-
-
- - <%- include('footer.ejs') %> - -
-
- - - - - - - - - - - - - - diff --git a/views/dashboard.html b/views/dashboard.html new file mode 100644 index 0000000..a149286 --- /dev/null +++ b/views/dashboard.html @@ -0,0 +1,282 @@ + + + + + + + DweebUI - Dashboard + + + + + + + + + +
+ + <%- include('navbar.html') %> + +
+ +
+
+
+ +
+
+ +
+
+
+
+
+ + + +
+ + +
+
+ +
+
+ +
+
+ +
+
+
+
+ +
+
+
+
+
+ + + +
+ + +
+
+ +
+
+ +
+
+ +
+
+
+
+ +
+
+
+
+
+ + + +
+ + +
+
+ +
+
+ +
+
+ +
+
+
+
+ +
+
+
+
+
+ + + +
+ + +
+
+ +
+
+ +
+
+ +
+
+
+
+ + +
+
+ + + + +
+
+ +
+
+ + + + + + + + + + + + +
+
+
+ + <%- include('footer.html') %> + +
+
+ + + + + + + + + + diff --git a/views/footer.ejs b/views/footer.html similarity index 93% rename from views/footer.ejs rename to views/footer.html index 48f3f6e..127502b 100644 --- a/views/footer.ejs +++ b/views/footer.html @@ -23,8 +23,8 @@ All rights reserved.
  • - - v0.10 + + v0.40
    • diff --git a/views/images.ejs b/views/images.ejs deleted file mode 100644 index a811352..0000000 --- a/views/images.ejs +++ /dev/null @@ -1,188 +0,0 @@ - - - - - - - DweebUI - Images - - - - - -
    - - <%- include('navbar.ejs') %> -
    - - - -
    -
    -
    - -
    -
    -
    -

    Docker Images

    -
    - - - Refresh - - - - New Image - -
    -
    - - - - -
    - - - <%- image_list %> - -
    -
    - -
    - - - -
    - - - -
    -     - - - -

    <%- image_count %> Images

    - -
    -
    -
    - -
    -
    -
    - - <%- include('footer.ejs') %> - -
    -
    - - - - - - - - - - - - - \ No newline at end of file diff --git a/views/images.html b/views/images.html new file mode 100644 index 0000000..4e386fe --- /dev/null +++ b/views/images.html @@ -0,0 +1,116 @@ + + + + + + + DweebUI - Images + + + + + +
    + + <%- include('navbar.html') %> +
    + + + +
    +
    +
    + +
    +
    +
    +
    +

    Docker Images

    +
    + + + Refresh + + + + New Image + +
    +
    + + +
    + + + <%- image_list %> + +
    +
    + +
    + + + + + +

    <%- image_count %> Images

    + +
    + +
    +
    + +
    +
    +
    + + <%- include('footer.html') %> + +
    +
    + + + + + + + + + + + + + \ No newline at end of file diff --git a/views/login.ejs b/views/login.html similarity index 79% rename from views/login.ejs rename to views/login.html index 1fc5dc5..db41639 100644 --- a/views/login.ejs +++ b/views/login.html @@ -9,7 +9,7 @@ - - -
    - - <%- include('navbar.ejs') %> -
    - - - -
    -
    -
    - -
    -
    -
    -

    Docker Networks

    -
    - - - Refresh - - - - New Network - -
    -
    - - - - -
    - - - <%- network_list %> - -
    -
    - -
    - - - -
    - - - -
    -     - - - -

    <%- network_count %> Networks

    - -
    -
    -
    - -
    -
    -
    - - <%- include('footer.ejs') %> - -
    -
    - - - - - - - - - - - - - \ No newline at end of file diff --git a/views/networks.html b/views/networks.html new file mode 100644 index 0000000..09a9aae --- /dev/null +++ b/views/networks.html @@ -0,0 +1,131 @@ + + + + + + + DweebUI - Networks + + + + + +
    + + <%- include('navbar.html') %> +
    + + + +
    +
    +
    + +
    +
    +
    +
    +

    Docker Networks

    +
    + + + Refresh + + + + New Network + +
    +
    + +
    + + + <%- network_list %> + +
    +
    + +
    + + + + + + + + +

    <%- network_count %> Networks

    + +
    +
    +
    +
    + +
    +
    +
    + + <%- include('footer.html') %> + +
    +
    + + + + + + + + + + + + + \ No newline at end of file diff --git a/views/portal.ejs b/views/portal.html similarity index 99% rename from views/portal.ejs rename to views/portal.html index e70d29b..473851f 100644 --- a/views/portal.ejs +++ b/views/portal.html @@ -21,7 +21,7 @@
    - <%- include('navbar.ejs') %> + <%- include('navbar.html') %>
    @@ -131,7 +131,7 @@
    - <%- include('footer.ejs') %> + <%- include('footer.html') %>
    diff --git a/views/register.ejs b/views/register.html similarity index 86% rename from views/register.ejs rename to views/register.html index 6b139df..6d14088 100644 --- a/views/register.ejs +++ b/views/register.html @@ -9,7 +9,7 @@ - - -
    - - <%- include('navbar.ejs') %> -
    - -
    -
    -
    -
    -

    - Account Settings -

    -
    -
    -
    -
    - -
    -
    -
    -
    -
    -
    -

    Business settings

    -
    - Account - - Settings - -
    -

    Experience

    -
    - Credits -
    -
    -
    -
    - -
    -

    Settings

    -

    Configure server below

    - -
    -
    - - - - Windows QuickConnect - -
    -
    - -
    -
    -
    Full Name
    - -
    -
    -
    First Name
    - -
    -
    -
    Last Name
    - -
    -
    -

    Email

    -

    This contact will be shown to others publicly, so choose it carefully.

    -
    -
    -
    - -
    -
    - Change -
    -
    -
    -

    Password

    -

    You can set a permanent password if you don't want to use temporary login codes.

    - -

    Public profile

    -

    Making your profile public means that anyone on the Dashkit network will be able to find - you.

    -
    - -
    -
    - -
    - -
    -
    -
    -
    - - <%- include('footer.ejs') %> -
    -
    - - - - - - \ No newline at end of file diff --git a/views/settings.html b/views/settings.html new file mode 100644 index 0000000..bc64b60 --- /dev/null +++ b/views/settings.html @@ -0,0 +1,120 @@ + + + + + + + DweebUI - Settings + + + + + + +
    + + <%- include('navbar.html') %> +
    + +
    +
    +
    +
    +

    + Settings +

    +
    +
    +
    +
    + +
    +
    +
    +
    + <%- include('sidebar.html') %> +
    + +
    +

    Settings

    +

    Configure server below

    + +
    +
    + +
    +
    + +
    +
    +
    Full Name
    + +
    +
    +
    First Name
    + +
    +
    +
    Last Name
    + +
    +
    +

    Email

    +

    This contact will be shown to others publicly, so choose it carefully.

    +
    +
    +
    + +
    +
    + Change +
    +
    +
    +

    Password

    +

    You can set a permanent password if you don't want to use temporary login codes.

    + +

    Public profile

    +

    Making your profile public means that anyone on the Dashkit network will be able to find + you.

    +
    + +
    +
    + +
    + +
    +
    +
    +
    + + <%- include('footer.html') %> +
    +
    + + + + + + \ No newline at end of file diff --git a/views/sidebar.html b/views/sidebar.html new file mode 100644 index 0000000..ba71002 --- /dev/null +++ b/views/sidebar.html @@ -0,0 +1,14 @@ +
    +
    +

    Menu

    +
    + Accounts + Variables + Settings +
    +

    Other

    +
    + Supporters +
    +
    +
    \ No newline at end of file diff --git a/views/supporters.html b/views/supporters.html new file mode 100644 index 0000000..173c041 --- /dev/null +++ b/views/supporters.html @@ -0,0 +1,85 @@ + + + + + + + DweebUI - Settings + + + + + + + +
    + + <%- include('navbar.html') %> +
    + +
    +
    +
    +
    +

    + Settings +

    +
    +
    +
    +
    + +
    +
    +
    +
    + <%- include('sidebar.html') %> +
    + +
    +

    Supporters

    +

    [Click to Thank]

    +
    +
    + + mm + + pd + + +
    +
    +
    +
    +

    Thanks counter:

    +
    +
    + + 0 + +
    +
    +
    +
    +
    +
    +
    +
    + + <%- include('footer.html') %> +
    +
    + + + + + + \ No newline at end of file diff --git a/views/syslogs.ejs b/views/syslogs.html similarity index 97% rename from views/syslogs.ejs rename to views/syslogs.html index 1f79c6a..fdae274 100644 --- a/views/syslogs.ejs +++ b/views/syslogs.html @@ -21,7 +21,7 @@
    - <%- include('navbar.ejs') %> + <%- include('navbar.html') %>
    @@ -68,7 +68,7 @@

    - <%- include('footer.ejs') %> + <%- include('footer.html') %>
    diff --git a/views/users.ejs b/views/users.html similarity index 96% rename from views/users.ejs rename to views/users.html index a5d1e19..e70a46a 100644 --- a/views/users.ejs +++ b/views/users.html @@ -21,7 +21,7 @@
    - <%- include('navbar.ejs') %> + <%- include('navbar.html') %>
    @@ -59,7 +59,7 @@

    - <%- include('footer.ejs') %> + <%- include('footer.html') %> diff --git a/views/variables.html b/views/variables.html new file mode 100644 index 0000000..4798e93 --- /dev/null +++ b/views/variables.html @@ -0,0 +1,120 @@ + + + + + + + DweebUI - Settings + + + + + + +
    + + <%- include('navbar.html') %> +
    + +
    +
    +
    +
    +

    + Settings +

    +
    +
    +
    +
    + +
    +
    +
    +
    + <%- include('sidebar.html') %> +
    + +
    +

    Variables

    +

    Configure default variables below.

    + + + +
    +
    +
    Match 1
    + +
    +
    +
    Match 2
    + +
    +
    +
    Default
    + +
    +
    + + +
    +
    +
    Match 1
    + +
    +
    +
    Match 2
    + +
    +
    +
    Default
    + +
    +
    + + +
    +
    +
    Match 1
    + +
    +
    +
    Match 2
    + +
    +
    +
    Default
    + +
    +
    + + +
    + +
    + +
    +
    +
    +
    + + <%- include('footer.html') %> +
    +
    + + + + + + \ No newline at end of file diff --git a/views/volumes.ejs b/views/volumes.ejs deleted file mode 100644 index 3dd812c..0000000 --- a/views/volumes.ejs +++ /dev/null @@ -1,188 +0,0 @@ - - - - - - - DweebUI - Volumes - - - - - -
    - - <%- include('navbar.ejs') %> -
    - - - -
    -
    -
    - -
    -
    -
    -

    Docker Volumes

    -
    - - - Refresh - - - - New Volume - -
    -
    - - - - -
    - - - <%- volume_list %> - -
    -
    - -
    - - - -
    - - - -
    -     - - - -

    <%- volume_count %> Volumes

    - -
    -
    -
    - -
    -
    -
    - - <%- include('footer.ejs') %> - -
    -
    - - - - - - - - - - - - - \ No newline at end of file diff --git a/views/volumes.html b/views/volumes.html new file mode 100644 index 0000000..5e0a480 --- /dev/null +++ b/views/volumes.html @@ -0,0 +1,130 @@ + + + + + + + DweebUI - Volumes + + + + + +
    + + <%- include('navbar.html') %> +
    + + + +
    +
    +
    + +
    +
    +
    +
    +

    Docker Volumes

    +
    + + + Refresh + + + + New Volume + +
    +
    + + +
    + + + <%- volume_list %> + +
    +
    + +
    + + + + + + +

    <%- volume_count %> Volumes

    + +
    +
    +
    +
    + +
    +
    +
    + + <%- include('footer.html') %> + +
    +
    + + + + + + + + + + + + + \ No newline at end of file