v0.05 pre-release

When installing an app, Environment variables and labels are unchecked by default.
Added 'update' option to container drop down.
Fixed App Uninstall
Updated container_stats to ignore DweebUI and DweebCache
Updated main.js to fix javascript errors

components/appCard.js

@@ -166,7 +166,7 @@ function appCard(data) {
     // Get environment details
     try {
       let env = data.env[i];
-      let env_check = env ? "checked" : "";
+      let env_check = "";
       let env_default = env.default ? env.default : "";
       let env_description = env.description ? env.description : "";
       let env_label = env.label ? env.label : "";
@@ -193,7 +193,7 @@ function appCard(data) {
 
     try {
       let label = data.labels[i];
-      let label_check = label ? "checked" : "";
+      let label_check = "";
       let label_name = label.name ? label.name : "";
       let label_value = label.value ? label.value : "";
 

components/dashCard.js

@@ -117,12 +117,10 @@ module.exports.dashCard = function dashCard(data) {
           <div class="card-stamp card-stamp-sm">
             <img heigh="150px" width="150px" src="https://raw.githubusercontent.com/lllllllillllllillll/DweebUI-Icons/main/${service}.png" onerror="this.onerror=null;this.src='https://raw.githubusercontent.com/lllllllillllllillll/DweebUI-Icons/main/dweebui.png';"></img>
           </div>
-          
           <div class="d-flex align-items-center">
             <div class="subheader text-yellow">${external_port}:${internal_port}</div>
             <div class="ms-auto lh-1">
               <div class="card-actions btn-actions">
-                
                 <div class="card-actions btn-actions">
                   <button onclick="buttonAction(this)" name="${name}" value="start" id="${state}" class="btn-action" title="Start" ${enabled}><!-- player-play -->
                     <svg xmlns="http://www.w3.org/2000/svg" class="icon-tabler icon-tabler-player-play" width="24" height="24" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"></path><path d="M7 4v16l13 -8z"></path></svg>
@@ -142,13 +140,13 @@ module.exports.dashCard = function dashCard(data) {
                     </a>
                     <div class="dropdown-menu dropdown-menu-end">
                       <a class="dropdown-item" data-bs-toggle="modal" data-bs-target="#${name}_modal-details" href="#">Details</a>
-                      <a class="dropdown-item" href="#">Logs</a>
+                      <a class="dropdown-item" onclick="viewLogs(this)" name="${name}" data-bs-toggle="modal" data-bs-target="#${name}_logs" href="#">Logs</a>
                       <a class="dropdown-item" href="#">Edit</a>
+                      <a class="dropdown-item text-primary" href="#">Update</a>
                       <a class="dropdown-item text-danger" data-bs-toggle="modal" data-bs-target="#${name}_modal-danger" href="#">Remove</a>
                     </div>
                   </div>
                 </div>
-
               </div>
             </div>
           </div>
@@ -170,84 +168,168 @@ module.exports.dashCard = function dashCard(data) {
       </div>
     </div>
     
-    <div class="modal modal-blur fade deleteme" id="${name}_modal-danger" tabindex="-1" style="display: none;" aria-hidden="true">
-                <div class="modal-dialog modal-sm modal-dialog-centered" role="document">
-                  <div class="modal-content">
-                    <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
-                    <div class="modal-status bg-danger"></div>
-                    <div class="modal-body text-center py-3">
-                      <!-- Download SVG icon from http://tabler-icons.io/i/alert-triangle -->
-                      <svg xmlns="http://www.w3.org/2000/svg" class="icon mb-2 text-danger icon-lg" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"></path><path d="M12 9v2m0 4v.01"></path><path d="M5 19h14a2 2 0 0 0 1.84 -2.75l-7.1 -12.25a2 2 0 0 0 -3.5 0l-7.1 12.25a2 2 0 0 0 1.75 2.75"></path></svg>
-                      <h3>Remove ${name}?</h3>
-                      <form action="/uninstall" id="uninstall" method="POST">
-                      <input type="text" class="form-control" name="service_name" value="${app_name}" hidden/>
-                      <div class="mb-3"> </div>
-                      
-                      <div class="mb-2">
-                        <div class="divide-y">
-                          <div class="row">
-                            <div class="col-9">
-                              <label class="row text-start">
-                                <span class="col">Remove Volumes</span>
-                              </label>
-                            </div>
-                            <div class="col-3">
-                              <label class="form-check form-check-single form-switch text-end">
-                                <input class="form-check-input" type="checkbox" checked="" name="remove_volumes">
-                              </label>
-                            </div>
-                          </div>
-                          <div class="row">
-                            <div class="col-9">
-                              <label class="row text-start">
-                                <span class="col">Remove Image</span>
-                              </label>
-                            </div>
-                            <div class="col-3">
-                              <label class="form-check form-check-single form-switch text-end">
-                                <input class="form-check-input" type="checkbox" checked="" name="remove_image">
-                              </label>
-                            </div>
-                          </div>
-                          <div class="row">
-                            <div class="col-9">
-                              <label class="row text-start">
-                                <span class="col">Remove Backups</span>
-                              </label>
-                            </div>
-                            <div class="col-3">
-                              <label class="form-check form-check-single form-switch text-end">
-                                <input class="form-check-input" type="checkbox" checked="" name="remove_backups">
-                              </label>
-                            </div>
-                          </div>
-                        </div>
-                      </div>
-                      
-                      <div class="mt-1"> </div>
-                      <div class="text-muted">Enter "Yes" below to remove the container.</div>
-                      <input type="text" class="form-control mb-2" name="confirm">
 
-                      </form>
 
-                    </div>
-                    <div class="modal-footer">
-                      <div class="w-100">
-                        <div class="row">
-                          <div class="col">
-                            <a href="#" class="btn w-100" data-bs-dismiss="modal">
-                              Cancel
-                            </a>
-                          </div>
-                          <div class="col">
-                            <input type="submit" form="uninstall" class="btn btn-danger w-100" value="Uninstall"/>
-                          </div>
-                        </div>
-                      </div>
-                    </div>
+
+
+    
+
+
+    <div class="modal modal-blur fade deleteme" id="${name}_modal-danger" tabindex="-1" style="display: none;" aria-hidden="true">
+      <div class="modal-dialog modal-sm modal-dialog-centered" role="document">
+        <div class="modal-content">
+          <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
+          <div class="modal-status bg-danger"></div>
+          <div class="modal-body text-center py-3">
+            <!-- Download SVG icon from http://tabler-icons.io/i/alert-triangle -->
+            <svg xmlns="http://www.w3.org/2000/svg" class="icon mb-2 text-danger icon-lg" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"></path><path d="M12 9v2m0 4v.01"></path><path d="M5 19h14a2 2 0 0 0 1.84 -2.75l-7.1 -12.25a2 2 0 0 0 -3.5 0l-7.1 12.25a2 2 0 0 0 1.75 2.75"></path></svg>
+            <h3>Remove ${name}?</h3>
+            <form action="/uninstall" id="uninstall" method="POST">
+            <input type="text" class="form-control" name="service_name" value="${app_name}" hidden/>
+            <div class="mb-3"> </div>
+            
+            <div class="mb-2">
+              <div class="divide-y">
+                <div class="row">
+                  <div class="col-9">
+                    <label class="row text-start">
+                      <span class="col">Remove Volumes</span>
+                    </label>
+                  </div>
+                  <div class="col-3">
+                    <label class="form-check form-check-single form-switch text-end">
+                      <input class="form-check-input" type="checkbox" checked="" name="remove_volumes">
+                    </label>
+                  </div>
+                </div>
+                <div class="row">
+                  <div class="col-9">
+                    <label class="row text-start">
+                      <span class="col">
+                        Remove Image
+                      </span>
+                    </label>
+                  </div>
+                  <div class="col-3">
+                    <label class="form-check form-check-single form-switch text-end">
+                      <input class="form-check-input" type="checkbox" checked="" name="remove_image">
+                    </label>
+                  </div>
+                </div>
+                <div class="row">
+                  <div class="col-9">
+                    <label class="row text-start">
+                      <span class="col">
+                        Remove Backups
+                      </span>
+                    </label>
+                  </div>
+                  <div class="col-3">
+                    <label class="form-check form-check-single form-switch text-end">
+                      <input class="form-check-input" type="checkbox" checked="" name="remove_backups">
+                    </label>
                   </div>
                 </div>
               </div>
+            </div>
+            <div class="mt-1"> </div>
+            <div class="text-muted">Enter "Yes" below to remove the container.</div>
+            <input type="text" class="form-control mb-2" name="confirm" autocomplete="off">
+            </form>
+          </div>
+          <div class="modal-footer">
+            <div class="w-100">
+              <div class="row">
+                <div class="col">
+                  <a href="#" class="btn w-100" data-bs-dismiss="modal">
+                    Cancel
+                  </a>
+                </div>
+                <div class="col">
+                  <input type="submit" form="uninstall" class="btn btn-danger w-100" value="Uninstall"/>
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+    
+    
+
+
+
+
+
+
+
+
+
+
+    <div class="modal modal-blur fade" id="${name}_logs" tabindex="-1" style="display: none;" aria-hidden="true">
+      <div class="modal-dialog modal-dialog-centered modal-dialog-scrollable" role="document">
+        <div class="modal-content">
+          <div class="modal-header">
+            <h5 class="modal-title">Scrollable modal</h5>
+            <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
+          </div>
+          <div class="modal-body">
+            <p>Cras mattis consectetur purus sit amet fermentum. Cras justo odio, dapibus ac facilisis in, egestas
+              eget quam. Morbi leo risus, porta ac consectetur ac, vestibulum at eros.</p>
+            <p>Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Vivamus sagittis lacus vel augue
+              laoreet rutrum faucibus dolor auctor.</p>
+            <p>Aenean lacinia bibendum nulla sed consectetur. Praesent commodo cursus magna, vel scelerisque nisl
+              consectetur et. Donec sed odio dui. Donec ullamcorper nulla non metus auctor fringilla.</p>
+            <p>Cras mattis consectetur purus sit amet fermentum. Cras justo odio, dapibus ac facilisis in, egestas
+              eget quam. Morbi leo risus, porta ac consectetur ac, vestibulum at eros.</p>
+            <p>Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Vivamus sagittis lacus vel augue
+              laoreet rutrum faucibus dolor auctor.</p>
+            <p>Aenean lacinia bibendum nulla sed consectetur. Praesent commodo cursus magna, vel scelerisque nisl
+              consectetur et. Donec sed odio dui. Donec ullamcorper nulla non metus auctor fringilla.</p>
+            <p>Cras mattis consectetur purus sit amet fermentum. Cras justo odio, dapibus ac facilisis in, egestas
+              eget quam. Morbi leo risus, porta ac consectetur ac, vestibulum at eros.</p>
+            <p>Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Vivamus sagittis lacus vel augue
+              laoreet rutrum faucibus dolor auctor.</p>
+            <p>Aenean lacinia bibendum nulla sed consectetur. Praesent commodo cursus magna, vel scelerisque nisl
+              consectetur et. Donec sed odio dui. Donec ullamcorper nulla non metus auctor fringilla.</p>
+            <p>Cras mattis consectetur purus sit amet fermentum. Cras justo odio, dapibus ac facilisis in, egestas
+              eget quam. Morbi leo risus, porta ac consectetur ac, vestibulum at eros.</p>
+            <p>Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Vivamus sagittis lacus vel augue
+              laoreet rutrum faucibus dolor auctor.</p>
+            <p>Aenean lacinia bibendum nulla sed consectetur. Praesent commodo cursus magna, vel scelerisque nisl
+              consectetur et. Donec sed odio dui. Donec ullamcorper nulla non metus auctor fringilla.</p>
+            <p>Cras mattis consectetur purus sit amet fermentum. Cras justo odio, dapibus ac facilisis in, egestas
+              eget quam. Morbi leo risus, porta ac consectetur ac, vestibulum at eros.</p>
+            <p>Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Vivamus sagittis lacus vel augue
+              laoreet rutrum faucibus dolor auctor.</p>
+            <p>Aenean lacinia bibendum nulla sed consectetur. Praesent commodo cursus magna, vel scelerisque nisl
+              consectetur et. Donec sed odio dui. Donec ullamcorper nulla non metus auctor fringilla.</p>
+            <p>Cras mattis consectetur purus sit amet fermentum. Cras justo odio, dapibus ac facilisis in, egestas
+              eget quam. Morbi leo risus, porta ac consectetur ac, vestibulum at eros.</p>
+            <p>Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Vivamus sagittis lacus vel augue
+              laoreet rutrum faucibus dolor auctor.</p>
+            <p>Aenean lacinia bibendum nulla sed consectetur. Praesent commodo cursus magna, vel scelerisque nisl
+              consectetur et. Donec sed odio dui. Donec ullamcorper nulla non metus auctor fringilla.</p>
+          </div>
+          <div class="modal-footer">
+            <button type="button" class="btn me-auto" data-bs-dismiss="modal">Close</button>
+            <button type="button" class="btn btn-primary" data-bs-dismiss="modal">Save changes</button>
+          </div>
+        </div>
+      </div>
+    </div>
+    
+    
+    
+    
+    
+    
+    
+    
+    
+    
+    
+    
     
     
     <div class="modal modal-blur fade" id="${name}_modal-details" tabindex="-1" role="dialog" aria-hidden="true">

controllers/site_actions.js

@@ -21,7 +21,7 @@ exports.AddSite = async function (req, res) {
         caddyfile += `\n}`
 
         // save caddyfile
-        writeFileSync(`/home/docker/caddy/sites/${domain}.Caddyfile`, caddyfile, function (err) { console.log(err) });
+        writeFileSync(`./caddyfiles/sites/${domain}.Caddyfile`, caddyfile, function (err) { console.log(err) });
         
 
         // format caddyfile

functions/package_manager.js

@@ -154,16 +154,16 @@ module.exports.uninstall = async function (data) {
             var containerName = docker.getContainer(`${data.service_name}`);
 
             try {
-                containerName.stop(function (err, data) {
-                });
-            } catch { console.log('unable to stop container') }
-
-
-            try {
-                containerName.remove(function (err, data) {
-                });
-            } catch { console.log('unable to remove container') }
-
+                    containerName.stop(function (err, data) {
+                        if (data) {
+                            containerName.remove(function (err, data) {
+                            });
+                        }
+                    });
+                } catch { 
+                    containerName.remove(function (err, data) {
+                    });
+                }
 
         }
 

functions/system_information.js

@@ -40,10 +40,7 @@ module.exports.containerList = async function () {
             let containerId = docker.getContainer(container.Id);
             let containerInfo = await containerId.inspect();
 
-            let external_port = 0;
-            let internal_port = 0;
-
-            // Get ports
+            // Get ports //////////////////////////
             let ports_list = [];
             for (const [key, value] of Object.entries(containerInfo.HostConfig.PortBindings)) {
                 let ports = {
@@ -64,10 +61,10 @@ module.exports.containerList = async function () {
                     }
                     ports_list[i] = ports;
                 }
-            }
+            } /////////////////////////////////////
 
 
-            // Get volumes.
+            // Get volumes ////////////////////////
             let volumes_list = [];
             for (const [key, value] of Object.entries(containerInfo.HostConfig.Binds)) {
                 let volumes = {
@@ -88,7 +85,7 @@ module.exports.containerList = async function () {
                     }
                     volumes_list[i] = volumes;
                 }
-            }
+            } /////////////////////////////////////
 
 
             // Get environment variables.
@@ -140,8 +137,8 @@ module.exports.containerList = async function () {
                 id: container.Id,
                 state: container.State,
                 image: container.Image,
-                external_port: external_port,
-                internal_port: internal_port, 
+                external_port: ports_list[0].external || 0,
+                internal_port: ports_list[0].internal || 0, 
                 ports: ports_list,
                 volumes: volumes_list,
                 environment_variables: environment_variables,
@@ -172,15 +169,17 @@ module.exports.containerStats = async function () {
 
     for (const container of data) {
 
-        const stats = await dockerContainerStats(container.Id);
-        let container_stat = {
-            name: container.Names[0].slice(1),
-            cpu: Math.round(stats[0].cpuPercent),
-            ram: Math.round(stats[0].memPercent)
-        }
+        if ((container.Names[0].slice(1) != 'DweebUI') && (container.Names[0].slice(1) != 'DweebCache')) {
+            const stats = await dockerContainerStats(container.Id);
+            let container_stat = {
+                name: container.Names[0].slice(1),
+                cpu: Math.round(stats[0].cpuPercent),
+                ram: Math.round(stats[0].memPercent)
+            }
 
-        //push stats to an array
-        container_stats.push(container_stat);
+            //push stats to an array
+            container_stats.push(container_stat);
+        }
     }
     return container_stats;
 }

public/js/main.js

@@ -115,6 +115,10 @@ function buttonAction(button) {
   socket.emit('clicked', {container: button.name, state: button.id, action: button.value});
 }
 
+function viewLogs(button) {
+  console.log(`trying to view logs for ${button.name}`);
+}
+
 socket.on('cards', (data) => {
 
   console.log('cards deleted');
@@ -143,31 +147,31 @@ socket.on('container_stats', (data) => {
 
   let {name, cpu, ram} = data;
 
-  // get cpu and ram array of the container from local storage
   var cpu_array = JSON.parse(localStorage.getItem(`${name}_cpu`));
   var ram_array = JSON.parse(localStorage.getItem(`${name}_ram`));
 
-  // if the cpu and ram arrays are null, create both arrays with 30 values of 0
   if (cpu_array == null) { cpu_array = Array(30).fill(0); }
   if (ram_array == null) { ram_array = Array(30).fill(0); }
 
-  // add the new cpu and ram values to the arrays, but limit the array to 30 values
   cpu_array.push(cpu);
   ram_array.push(ram);
-
+  
   cpu_array = cpu_array.slice(-30);
   ram_array = ram_array.slice(-30);
 
-  // save the arrays to local storage
   localStorage.setItem(`${name}_cpu`, JSON.stringify(cpu_array));
   localStorage.setItem(`${name}_ram`, JSON.stringify(ram_array));
 
   // replace the old chart with the new one
   let chart = document.getElementById(`${name}_chart`);
-  let newChart = document.createElement('div');
-  newChart.id = `${name}_chart`;
-  chart.parentNode.replaceChild(newChart, chart);
-  drawCharts(`#${name}_chart`, cpu_array, ram_array);  
+  if (chart) {
+    let newChart = document.createElement('div');
+    newChart.id = `${name}_chart`;
+    chart.parentNode.replaceChild(newChart, chart);
+    drawCharts(`#${name}_chart`, cpu_array, ram_array);
+  } else {
+    console.log(`Chart element with id ${name}_chart not found in the DOM`);
+  }
 });
 
 socket.on('install', (data) => {

views/partials/footer.ejs

@@ -24,7 +24,7 @@
           </li>
           <li class="list-inline-item">
             <a href="#" class="link-secondary" rel="noopener">
-              v0.04
+              v0.05
             </a>
           </li>
         </ul>