From b71f03f9a490d6a9e57ea096a633196ccaf5e924 Mon Sep 17 00:00:00 2001 From: Paulo Truta Date: Sun, 8 Dec 2024 20:38:21 +0100 Subject: [PATCH] Added usage of collapse card block --- src/templates/pages/settings/index.html.twig | 460 ++++++++++--------- 1 file changed, 232 insertions(+), 228 deletions(-) diff --git a/src/templates/pages/settings/index.html.twig b/src/templates/pages/settings/index.html.twig index 1169654..6c86929 100644 --- a/src/templates/pages/settings/index.html.twig +++ b/src/templates/pages/settings/index.html.twig @@ -144,8 +144,7 @@
External Access
-
-
+

Click any of the titles below to see its option details.

{% if (alert is not empty and alert.alert == 'remove_custom_domain') %} @@ -164,209 +163,192 @@
{% endif %} - -

Click any of the titles below to see its option details.

- -
-
- - ▼ Domain Name Configuration - -
-

Configure 1-click internet access to your apps and dashboard. Logging in with a Cloudflare account gives your a frictionless experience. Manual Setup requires you to configure a connection yourself.

-
-
- -
-
-
- {% if show_form and domain_name_config_step == '0' %} -

- Configure Edgebox to allow receiving connections through Cloudflare. Edgebox connects seamlessly with CloudFlare and your domain name, and will be running a secure connection in seconds, and making sure it is available. You can buy a domain name or use one you already own. You must have a domain configured with Cloudflare before continuing. -

-

-

- - -
- - -

- {% elseif (domain_name_config_step == "1" or domain_name_config_step == "2") %} - -

-
-
-

- -

Custom Domain is Active

-

To use a Cloudflare Tunnel to access your edgebox from the internet, you cannot be using a custom domain name. Remove it first and try again.

-
-
-
-

+
+
- {% else %} -

Connection status: {{ connection_status }}

-

Connection details:

-

-

    - {% for key,item in connection_details %} - {% if key != "login_link" %}
  • {{ key }}: {{ item }}
    • {% endif %} - {% endfor %} -
-

- {% if task_status < 2 %} - {% if tunnel_status_code == "waiting" and connection_details.status != "expired" %} -

- Login with CloudFlare -

-

- {% endif %} - {% if connection_details.status == "expired" %} -

{{connection_details.details}}

- {% endif %} - {% if tunnel_status_code == "error" or connection_details.status == "expired" %} -

-

- - -
- - -

- {% endif %} -
- {% if tunnel_status_code == "connected" %} - - - - {% endif %} + {% embed 'blocks/_collapse_card.html.twig' with { + 'title': 'Domain Name Configuration', + 'collapse_id': 'collapseDomainOptions', + 'is_collapsed': (tunnel_status_code != "waiting" and tunnel_status_code != "starting") or app.request.query.get('option_changed') != 'external_access', + } %} + {% block card_header %} +

+ Configure 1-click internet access to your apps and dashboard. Logging in with a Cloudflare account gives your a frictionless experience. Manual Setup requires you to configure a connection yourself. +

+ {% endblock %} + {% block card_content %} +
+ +
+
+
+ {% if show_form and domain_name_config_step == '0' %} +

+ Configure Edgebox to allow receiving connections through Cloudflare. Edgebox connects seamlessly with CloudFlare and your domain name, and will be running a secure connection in seconds, and making sure it is available. You can buy a domain name or use one you already own. You must have a domain configured with Cloudflare before continuing. +

+

+

+ + +
+ + +

- {% if tunnel_status_code == "stopped" %} - - + {% elseif (domain_name_config_step == "1" or domain_name_config_step == "2") %} - {% endif %} - - {% endif %} - {% endif %} +

+
+
+

+ +

Custom Domain is Active

+

To use a Cloudflare Tunnel to access your edgebox from the internet, you cannot be using a custom domain name. Remove it first and try again.

+
+
+
+

-
-
-
- {% if tunnel_status_code == "not_configured" %} -

- Configure Edgebox to allow receiving connections through a custom domain name you own. This is an advanced setting and requires you to know how to setup a domain name and potentially how to configure security certificates. -

-
+ {% else %} +

Connection status: {{ connection_status }}

+

Connection details:

+

+

    + {% for key,item in connection_details %} + {% if key != "login_link" %}
  • {{ key }}: {{ item }}
    • {% endif %} + {% endfor %} +
+

+ {% if task_status < 2 %} + {% if tunnel_status_code == "waiting" and connection_details.status != "expired" %} +

+ Login with CloudFlare +

+

+ {% endif %} + {% if connection_details.status == "expired" %} +

{{connection_details.details}}

+ {% endif %} + {% if tunnel_status_code == "error" or connection_details.status == "expired" %} +

+

+ + +
+ + +

+ {% endif %} +
+ {% if tunnel_status_code == "connected" %} + + + + {% endif %} - {% if (alert is not empty and alert.alert == 'custom_domain') %} + {% if tunnel_status_code == "stopped" %} + + - + + {% endif %} + {% endif %} - {% endif %} - - {% if domain_name_config_step == "0" %} +
+
+
+ {% if tunnel_status_code == "not_configured" %}

- Step 1: Insert the domain name below (for example "mydomain.com"). Edgebox will configure itself to accept connections from this domain. + Configure Edgebox to allow receiving connections through a custom domain name you own. This is an advanced setting and requires you to know how to setup a domain name and potentially how to configure security certificates.

-
- -
- - -
-
- +
+ + {% if (alert is not empty and alert.alert == 'custom_domain') %} + + - - {% endif %} - - {% if domain_name_config_step != "0" %} -

- Step 1: Add domain name ({{domain_name}}) ✔️ -

-

- Step 2: Go to the domain name control panel of your provider, and set the following records: -

-
- - - - - - - {# #} - - - - - - - - - {# #} - - {% for appkey,appinfo in apps_list %} - {% if appinfo.status.description == 'on' or appinfo.status.description == 'off' %} + {% endif %} + + {% if domain_name_config_step == "0" %} +

+ Step 1: Insert the domain name below (for example "mydomain.com"). Edgebox will configure itself to accept connections from this domain. +

+ + +
+ + +
+
+ +
+ + {% endif %} + + {% if domain_name_config_step != "0" %} +

+ Step 1: Add domain name ({{domain_name}}) ✔️ +

+

+ Step 2: Go to the domain name control panel of your provider, and set the following records: +

+
+
TypeValueDestinationStatus
-
-
-
A
-
-
- 		-

@

- 		- {{ip_address}} - - Online -
+ + + + + + {# #} + + + + {# #} - {% endif %} - {% endfor %} - -
TypeValueDestinationStatus
@@ -376,57 +358,79 @@
-

{{appinfo.id}}.{{domain_name}}

+

@

 {{ip_address}} - Online + Online
+ {% for appkey,appinfo in apps_list %} + {% if appinfo.status.description == 'on' or appinfo.status.description == 'off' %} + + +
+
+
A
+
+
+ + +

{{appinfo.id}}.{{domain_name}}

+ + + {{ip_address}} + + {# + Online + #} + + {% endif %} + {% endfor %} + + + +
-
-
-
+
+
- Note: You only need to set A records for the EdgeApps you want to access online. When possible to setup a wildcard subdomain, you can do so as well. -

-

- 0 %}class="text-success"{% endif %}>Step 3: Go to the EdgeApps screen and switch online access to each individual app you want accessible. {% if apps_online > 0 %}✔️{% endif %} -

-
-
- -
- -
-
- {% endif %} - {% else %} -
-
-
-
-

Tunnel is Configured

-

- Please remove the tunnel configuration first to be able to do a Manual Setup -

+ Note: You only need to set A records for the EdgeApps you want to access online. When possible to setup a wildcard subdomain, you can do so as well. +

+

+ 0 %}class="text-success"{% endif %}>Step 3: Go to the EdgeApps screen and switch online access to each individual app you want accessible. {% if apps_online > 0 %}✔️{% endif %} +

+
+
+ +
+ +
+
+ {% endif %} + {% else %} +
+
+
+
+

Tunnel is Configured

+

+ Please remove the tunnel configuration first to be able to do a Manual Setup +

+
+
-
-
- {% endif %} + {% endif %} +
-
-
+ {% endblock %} + {% endembed %}
{% embed 'blocks/_collapse_card.html.twig' with {