Add status and restart button to app page

rootfs/standard/var/www/mynode/api.py

@@ -73,8 +73,14 @@ def api_get_service_status():
         data["status"], data["color"] = get_electrs_status_and_color()
     elif service == "bitcoin":
         data["status"], data["color"] = get_bitcoin_status_and_color()
-    elif service == "lightning":
+    elif service == "lnd":
         data["status"], data["color"] = get_lnd_status_and_color()
+    elif service == "loop":
+        data["status"], data["color"] = get_loop_status_and_color()
+    elif service == "pool":
+        data["status"], data["color"] = get_pool_status_and_color()
+    elif service == "lit":
+        data["status"], data["color"] = get_lit_status_and_color()
     elif service == "dojo":
         data["status"], data["color"], dojo_initialized = get_dojo_status()
     elif service == "rtl":
@@ -87,6 +93,8 @@ def api_get_service_status():
         data["status"], data["color"] = get_btcpayserver_status_and_color()
     elif service == "lndhub":
         data["status"], data["color"] = get_lndhub_status_and_color()
+    elif service == "lndconnect":
+        data["status"], data["color"] = get_lndconnect_status_and_color()
     elif service == "btcrpcexplorer":
         data["status"], data["color"], data["ready"] = get_btcrpcexplorer_status_and_color_and_ready()
         data["sso_token"] = get_btcrpcexplorer_sso_token()
@@ -108,6 +116,8 @@ def api_get_service_status():
         data["color"] = get_service_status_color("tor@default")
     elif service == "vpn":
         data["status"], data["color"] = get_vpn_status_and_color()
+    elif service == "webssh2":
+        data["status"], data["color"] = get_webssh2_status_and_color()
     else:
         data["status"] = "unknown service"
 

rootfs/standard/var/www/mynode/application_info.py

@@ -271,3 +271,10 @@ def get_application_log(short_name):
             return get_journalctl_log("docker_images")
         else:
             return "ERROR: App or log not found ({})".format(short_name)
+
+def restart_application(short_name):
+    try:
+        subprocess.check_output('systemctl restart {}'.format(short_name), shell=True)
+        return True
+    except Exception as e:
+        return False

rootfs/standard/var/www/mynode/device_info.py

@@ -479,6 +479,32 @@ def get_lnd_status_and_color():
     color = get_lnd_status_color()
     return status,color
 
+def get_loop_status_and_color():
+    status = "Not Displayed"
+    color = "gray"
+    if is_lnd_ready():
+        color = get_service_status_color("loop")
+    return status,color
+
+def get_pool_status_and_color():
+    status = "Not Displayed"
+    color = "gray"
+    if is_lnd_ready():
+        color = get_service_status_color("loop")
+    return status,color
+
+def get_lit_status_and_color():
+    status = "Not Displayed"
+    color = "gray"
+    if is_lnd_ready():
+        color = get_service_status_color("loop")
+    return status,color
+
+def get_lndconnect_status_and_color():
+    status = "Not Displayed"
+    color = get_service_status_color("lndconnect")
+    return status,color
+
 def get_vpn_status_and_color():
     status = ""
     color = "gray"
@@ -643,6 +669,17 @@ def get_mempool_status_and_color():
             color = get_service_status_color("mempool")
     return status,color
 
+def get_webssh2_status_and_color():
+    status = "Web SSH"
+    color = "gray"
+    if is_service_enabled("webssh2"):
+        if is_installing_docker_images():
+            color = "yellow"
+            status = "Installing..."
+        else:
+            color = get_service_status_color("webssh2")
+    return status,color
+
 
 #==================================
 # UI Functions

rootfs/standard/var/www/mynode/manage_apps.py

@@ -1,5 +1,5 @@
 
-from flask import Blueprint, render_template, redirect
+from flask import Blueprint, render_template, redirect, request
 from user_management import check_logged_in
 from device_info import *
 from application_info import *
@@ -27,3 +27,25 @@ def manage_apps_page():
         "apps": apps
     }
     return render_template('manage_apps.html', **templateData)
+
+@mynode_manage_apps.route("/apps/restart-app")
+def restart_app_page():
+    check_logged_in()
+
+    # Check application specified
+    if not request.args.get("app"):
+        flash("No application specified", category="error")
+        return redirect("/apps")
+    
+    # Check application name is valid
+    app = request.args.get("app")
+    if not is_application_valid(app):
+        flash("Application is invalid", category="error")
+        return redirect("/apps")
+
+    if not restart_application(app):
+        flash("Error restarting application!", category="error")
+        return redirect("/apps")
+
+    flash("Application restarting!", category="message")
+    return redirect("/apps")

rootfs/standard/var/www/mynode/static/css/mynode.css

@@ -689,6 +689,15 @@ a:link.ui-button, a:visited.ui-button, .ui-button {
     text-align: center;
 }
 
+.generic_status_icon {
+    display: inline-block;
+    width: 14px;
+    height: 14px;
+    border-radius: 50%;
+    -moz-border-radius: 50%;
+    -webkit-border-radius: 50%;
+}
+
 .port_forwarded_icon {
     width: 26px;
     height: 24px;

rootfs/standard/var/www/mynode/templates/main.html

@@ -210,7 +210,7 @@
                     update_status("bitcoin_status", data);
                     update_status_icon("bitcoin_status_icon", data);
                 });
-                $.getJSON("/api/get_service_status?service=lightning", function( data ) {
+                $.getJSON("/api/get_service_status?service=lnd", function( data ) {
                     update_status("lnd_status", data);
                     update_status_icon("lnd_status_icon", data);
                 });

rootfs/standard/var/www/mynode/templates/manage_apps.html

@@ -4,26 +4,61 @@
         {% include 'includes/head.html' %}
 
         <script>
+            function restart(name, short_name) {
+                if ( confirm("Are you sure you want to restart "+name+"?\n\nRestarting services like Bitcoin or LND may have side effects. If so, restart the device.") ) {
+                    $('#loading_spinner_overlay').fadeIn();
+                    window.location.href='/apps/restart-app?app='+short_name;
+                }
+            }
+
             function upgrade(name, short_name) {
                 if ( confirm("Are you sure you want to upgrade "+name+"? This will reboot your device.") ) {
+                    $('#loading_spinner_overlay').fadeIn();
                     window.location.href='/settings/reinstall-app?app='+short_name;
                 }
             }
 
             function reinstall(name, short_name) {
                 if ( confirm("Are you sure you want to re-install "+name+"? This will reboot your device.") ) {
+                    $('#loading_spinner_overlay').fadeIn();
                     window.location.href='/settings/reinstall-app?app='+short_name;
                 }
             }
 
             function uninstall(name, short_name) {
                 if ( confirm("Are you sure you want to uninstall "+name+"? This will reboot your device.") ) {
+                    $('#loading_spinner_overlay').fadeIn();
                     window.location.href='/settings/uninstall-app?app='+short_name;
                 }
             }
 
             $(document).ready(function() {
-                // TODO
+                // Functions
+                function update_status_icon(status_icon_name, data) {
+                    if (data != null && "color" in data && data["color"] != null) {
+                        $("#"+status_icon_name).removeClass("red");
+                        $("#"+status_icon_name).removeClass("yellow");
+                        $("#"+status_icon_name).removeClass("green");
+                        $("#"+status_icon_name).removeClass("gray");
+                        $("#"+status_icon_name).removeClass("blue");
+                        $("#"+status_icon_name).addClass(data["color"]);
+                    }
+                }
+
+                // Update Status
+                function update_page() {
+                    {% for app in apps %}
+                        {% if app.show_on_application_page %}
+                        $.getJSON("/api/get_service_status?service={{ app.short_name }}", function( data ) {
+                            update_status_icon("{{ app.short_name }}_status_icon", data);
+                        });
+                        {% endif %}
+                    {% endfor %}
+                }
+
+                // Update info every 60 seconds
+                const update_interval = setInterval(update_page, 60000);
+                update_page();
             });
         </script>
     </head>
@@ -34,6 +69,9 @@
         </div>
 
         <div class="main_header">Manage Applications</div>
+
+        {% include 'includes/message_display.html' %}
+
         </br>
         <!-- {{ load_time }} ms -->
         <br/><br/>
@@ -42,8 +80,8 @@
                 <td>Application</td>
                 <td>Current Version</td>
                 <td>Latest Version</td>
-                <td><!-- Enabled Icon --></td>
+                <td><!-- Status Icon --></td>
-                <td colspan="2">Actions</td>
+                <td colspan="3">Actions</td>
             </thead>
             <tbody>
                 {% for app in apps %}
@@ -54,8 +92,12 @@
                             <td>{{ app.current_version }}</td>
                             <td>{{ app.latest_version }}</td>
                             <td>
-                                {% if app.is_enabled %}<img style="width: 20px;" title="Enabled" src="{{ url_for('static', filename="images/running.png")}}"/>{% endif %}
+                                <div class="generic_status_icon" id="{{app.short_name}}_status_icon"></div>
                             </td>
+                            <td>
+                                {% if app.is_enabled %}<button class="ui-button ui-widget ui-corner-all mynode_button_small" onclick="restart('{{ app.name }}', '{{ app.short_name }}');">Restart</button>{% endif %}
+                            </td>
+                            <!-- Start action cells -->
                             <td>
                                 {% if app.is_installed %}
                                     {% if app.current_version != app.latest_version %}
@@ -64,13 +106,13 @@
                                 {% endif %}
                             </td>
                             <td>
-                                {% if app.is_installed %}
+                                {% if app.is_installed and app.can_reinstall %}
-                                    {% if app.can_reinstall %}
+                                <button class="ui-button ui-widget ui-corner-all mynode_button_small" onclick="reinstall('{{ app.name }}', '{{ app.short_name }}');">Reinstall</button>
-                                    <button class="ui-button ui-widget ui-corner-all mynode_button_small" onclick="reinstall('{{ app.name }}', '{{ app.short_name }}');">Reinstall</button>
+                                {% endif %}
-                                    {% endif %}
+                            </td>
-                                    {% if app.can_uninstall %}
+                            <td>
-                                    <button class="ui-button ui-widget ui-corner-all mynode_button_small" onclick="uninstall('{{ app.name }}', '{{ app.short_name }}');">Uninstall</button>
+                                {% if app.is_installed and app.can_uninstall %}
-                                    {% endif %}
+                                <button class="ui-button ui-widget ui-corner-all mynode_button_small" onclick="uninstall('{{ app.name }}', '{{ app.short_name }}');">Uninstall</button>
                                 {% endif %}
                             </td>
                         </tr>
@@ -80,6 +122,12 @@
             </tbody>
         </table>
 
+        <div id="loading_spinner_overlay" class="loading_spinner_overlay" style="display:none;">
+            <img id="loading_spinner" class="loading_image" src="{{ url_for('static', filename="images/loading.gif")}}"/>
+            <br/>
+            Loading...
+        </div>
+
         <br/><br/>
 
         {% include 'includes/footer.html' %}