diff --git a/.dev-module-state.json b/.dev-module-state.json new file mode 100644 index 0000000..55a39e2 --- /dev/null +++ b/.dev-module-state.json @@ -0,0 +1,5 @@ +{ + "srvmonitor": true, + "itassets": true, + "networkview": true +} \ No newline at end of file diff --git a/.dev-pids b/.dev-pids index 79099e7..bf49aab 100644 --- a/.dev-pids +++ b/.dev-pids @@ -1,5 +1,5 @@ -77016 -77018 -77020 -77022 -77024 +18392 +18395 +18398 +18401 +18405 diff --git a/digiserver-v2/app/templates/players/add_player.html b/digiserver-v2/app/templates/players/add_player.html index 391103a..2b5342a 100644 --- a/digiserver-v2/app/templates/players/add_player.html +++ b/digiserver-v2/app/templates/players/add_player.html @@ -7,54 +7,82 @@ .form-group { margin-bottom: 1rem; } .form-group label { font-weight: bold; display: block; margin-bottom: 0.5rem; } body.dark-mode .form-group label { color: #e2e8f0; } - + .form-control { width: 100%; padding: 0.5rem; border: 1px solid #ddd; border-radius: 4px; + box-sizing: border-box; } body.dark-mode .form-control { background: #1a202c; border-color: #4a5568; color: #e2e8f0; } body.dark-mode .form-control:focus { border-color: #7c3aed; outline: none; } - + .form-help { color: #6c757d; font-size: 0.875rem; } body.dark-mode .form-help { color: #718096; } - + .section-header { margin-top: 2rem; padding-bottom: 0.5rem; border-bottom: 2px solid; } - .section-header.blue { border-color: #007bff; } - body.dark-mode .section-header.blue { border-color: #667eea; } + .section-header.blue { border-color: #007bff; } + body.dark-mode .section-header.blue { border-color: #667eea; } .section-header.green { border-color: #28a745; } body.dark-mode .section-header.green { border-color: #48bb78; } .section-header.yellow { border-color: #ffc107; } body.dark-mode .section-header.yellow { border-color: #ecc94b; } .section-header.purple { border-color: #9b59b6; } body.dark-mode .section-header.purple { border-color: #b794f6; } - + body.dark-mode h1, body.dark-mode h3, body.dark-mode h4 { color: #e2e8f0; } body.dark-mode p { color: #a0aec0; } - + .info-box { background-color: #e7f3ff; border-left: 4px solid #007bff; padding: 1rem; margin: 2rem 0; } - body.dark-mode .info-box { - background-color: #1a365d; border-left-color: #667eea; - } + body.dark-mode .info-box { background-color: #1a365d; border-left-color: #667eea; } .info-box h4 { margin-top: 0; color: #007bff; } body.dark-mode .info-box h4 { color: #667eea; } - .info-box code { - background: #f4f4f4; padding: 2px 6px; border-radius: 3px; - } - body.dark-mode .info-box code { - background: #2d3748; color: #e2e8f0; - } + .info-box code { background: #f4f4f4; padding: 2px 6px; border-radius: 3px; } + body.dark-mode .info-box code { background: #2d3748; color: #e2e8f0; } body.dark-mode small { color: #718096; } - - .ssh-section { - background-color: #f8f9fa; padding: 1.5rem; border-radius: 4px; margin-bottom: 2rem; + + /* Mode chooser cards */ + .mode-chooser { + display: grid; grid-template-columns: 1fr 1fr; gap: 1.5rem; margin-bottom: 2rem; } - body.dark-mode .ssh-section { background-color: #2d3748; } - + @media (max-width: 700px) { .mode-chooser { grid-template-columns: 1fr; } } + + .mode-card { + border: 2px solid #ddd; border-radius: 8px; padding: 1.5rem; + cursor: pointer; transition: border-color 0.2s, box-shadow 0.2s; + background: #fff; text-align: center; + } + body.dark-mode .mode-card { background: #2d3748; border-color: #4a5568; } + + .mode-card:hover { border-color: #007bff; box-shadow: 0 4px 12px rgba(0,123,255,0.15); } + body.dark-mode .mode-card:hover { border-color: #667eea; } + + .mode-card.active { border-color: #007bff; box-shadow: 0 4px 12px rgba(0,123,255,0.2); } + body.dark-mode .mode-card.active { border-color: #667eea; box-shadow: 0 4px 12px rgba(102,126,234,0.25); } + + .mode-card.active-deploy { border-color: #28a745; box-shadow: 0 4px 12px rgba(40,167,69,0.2); } + body.dark-mode .mode-card.active-deploy { border-color: #48bb78; } + + .mode-icon { font-size: 2.5rem; margin-bottom: 0.5rem; } + .mode-title { font-size: 1.15rem; font-weight: bold; margin-bottom: 0.4rem; } + body.dark-mode .mode-title { color: #e2e8f0; } + .mode-desc { font-size: 0.875rem; color: #6c757d; } + body.dark-mode .mode-desc { color: #a0aec0; } + + /* Panel visibility */ + .mode-panel { display: none; } + .mode-panel.active { display: block; } + + /* SSH section */ + .ssh-section { + background-color: #f8f9fa; padding: 1.5rem; border-radius: 6px; margin-bottom: 2rem; + } + body.dark-mode .ssh-section { background-color: #1e2a38; } + .connection-status { padding: 1rem; border-radius: 4px; margin-top: 1rem; display: none; } @@ -64,141 +92,273 @@ .connection-status.error { background-color: #f8d7da; border: 1px solid #f5c6cb; color: #721c24; display: block; } - body.dark-mode .connection-status.success { - background-color: #22543d; border-color: #2f855a; color: #9ae6b4; - } - body.dark-mode .connection-status.error { - background-color: #742a2a; border-color: #c53030; color: #fc8181; - } - - .player-form-section { display: none; } - .player-form-section.active { display: block; } - + body.dark-mode .connection-status.success { background-color: #22543d; border-color: #2f855a; color: #9ae6b4; } + body.dark-mode .connection-status.error { background-color: #742a2a; border-color: #c53030; color: #fc8181; } + + /* Deploy-form hidden until SSH verified */ + .deploy-player-form { display: none; } + .deploy-player-form.active { display: block; } + .btn { padding: 0.5rem 1rem; margin-right: 0.5rem; margin-bottom: 0.5rem; border: none; border-radius: 4px; cursor: pointer; font-size: 0.9rem; + text-decoration: none; display: inline-block; } .btn:disabled { opacity: 0.5; cursor: not-allowed; } - - .btn-primary { background-color: #007bff; color: white; } + .btn-primary { background-color: #007bff; color: white; } .btn-primary:hover:not(:disabled) { background-color: #0056b3; } - .btn-success { background-color: #28a745; color: white; } + .btn-success { background-color: #28a745; color: white; } .btn-success:hover:not(:disabled) { background-color: #218838; } .btn-secondary { background-color: #6c757d; color: white; } .btn-secondary:hover:not(:disabled) { background-color: #5a6268; } - + .loading-spinner { display: inline-block; width: 1rem; height: 1rem; - border: 2px solid rgba(255, 255, 255, 0.3); border-radius: 50%; + border: 2px solid rgba(255,255,255,0.3); border-radius: 50%; border-top-color: white; animation: spin 1s linear infinite; margin-right: 0.5rem; } @keyframes spin { to { transform: rotate(360deg); } } - - .row { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; } - .row.full { grid-template-columns: 1fr; } - @media (max-width: 768px) { .row { grid-template-columns: 1fr; } } - - .hidden-field { display: none; } + + .row2col { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; } + @media (max-width: 768px) { .row2col { grid-template-columns: 1fr; } } -
-

Add New Player with SSH Deployment

-

- Create a new digital signage player with automatic code deployment via SSH +

+

Add New Player

+

+ Choose how you want to add the player to the system.

-
- + +
+
+
📋
+
Manual Registration
+
+ Register the player in the database and wait for the client to connect. + You configure app_config.json on the device yourself. +
+
+
+
🚀
+
Create & Deploy
+
+ Register the player and automatically push the Linux player + code to the target host via SSH. +
+
+
+ + +
+
+

Basic Information

+ +
+ + + Friendly name for the player +
+ +
+ + + + Unique identifier — must match screen_name in the player's + app_config.json + +
+ +
+ + + Physical location of the player (optional) +
+ +

Authentication

+

+ Choose one authentication method (Quick Connect recommended for easy setup) +

+ +
+ + + Secure password for player authentication (optional if using Quick Connect) +
+ +
+ + + + Easy pairing code — must match quickconnect_key in player config + +
+ +

Display Settings

+ +
+ + + Display orientation for the player +
+ +
+ + + Assign player to a playlist (optional) +
+ +
+

📋 Setup Instructions

+
    +
  1. Create the player with the form above.
    2. +
  2. Note the generated Auth Code shown after creation.
    3. +
  3. Configure the player's app_config.json: +
      +
    • server_ip — your server address
      • +
    • screen_name — same as Hostname above
      • +
    • quickconnect_key — same as Quick Connect Code above
      • +
    +
    4. +
  4. Start the player — it will authenticate automatically.
    5. +
+
+ +
+ + + Cancel + +
+
+
+ + +
+ +

- 🔌 SSH Connection Setup + 🔌 Step 1 — SSH Connection

-

First, test SSH connection to the target host for player deployment

- -
+

+ Test SSH connectivity to the target Linux host before proceeding. +

+ +
- + + placeholder="e.g., 192.168.1.100"> IP address or hostname of the target machine
- + SSH port (default: 22)
- -
+ +
- + SSH login username
- + SSH login password
- - - +
- - -
+ + +
- + - - - -

Basic Information

+ + + +

Step 2 — Basic Information

+
Friendly name for the player
+
- Unique identifier for this player + + Unique identifier — will be written to app_config.json + on the remote host automatically +
+
- Physical location of the player (optional) + placeholder="e.g., Main Office – Reception Area"> + Physical location (optional)

Authentication

-

- Quick Connect recommended for easy setup -

+
- Secure password (optional if using Quick Connect)
+
- Easy pairing code for quick setup + Easy pairing code — deployed automatically to remote config

Display Settings

+
Display orientation for the player
+
Assign player to a playlist (optional)
-

📋 What Happens Next

+

🚀 What Happens Next

    -
  1. Player Creation: Player record created with Auth Code
    2. -
  2. Code Deployment: Player code from Kiwy-Signage repository deployed to target host
    3. -
  3. Installation: Installation scripts executed on remote host
    4. -
  4. Configuration: Configure app_config.json with Auth Code provided
    5. +
  5. Player Record is created in the database with an Auth Code.
    6. +
  6. Player Code from the Kiwy-Signage repository is pushed to + the target host via SSH.
    7. +
  7. Installation Scripts run on the remote host in the background.
    8. +
  8. Config (app_config.json) is written automatically + with the server address, hostname and Quick Connect Code.
- - +
-
+
diff --git a/digiserver-v2/app/templates/players/add_player.html.bak b/digiserver-v2/app/templates/players/add_player.html.bak new file mode 100644 index 0000000..391103a --- /dev/null +++ b/digiserver-v2/app/templates/players/add_player.html.bak @@ -0,0 +1,329 @@ +{% extends "base.html" %} + +{% block title %}Add Player - DigiServer v2{% endblock %} + +{% block content %} + + +
+

Add New Player with SSH Deployment

+

+ Create a new digital signage player with automatic code deployment via SSH +

+ +
+ +
+

+ 🔌 SSH Connection Setup +

+

First, test SSH connection to the target host for player deployment

+ +
+
+ + + IP address or hostname of the target machine +
+
+ + + SSH port (default: 22) +
+
+ +
+
+ + + SSH login username +
+
+ + + SSH login password +
+
+ + + +
+
+ + +
+
+ + + + + + + +

Basic Information

+
+ + + Friendly name for the player +
+
+ + + Unique identifier for this player +
+
+ + + Physical location of the player (optional) +
+ +

Authentication

+

+ Quick Connect recommended for easy setup +

+
+ + + Secure password (optional if using Quick Connect) +
+
+ + + Easy pairing code for quick setup +
+ +

Display Settings

+
+ + + Display orientation for the player +
+
+ + + Assign player to a playlist (optional) +
+ +
+

📋 What Happens Next

+
    +
  1. Player Creation: Player record created with Auth Code
    2. +
  2. Code Deployment: Player code from Kiwy-Signage repository deployed to target host
    3. +
  3. Installation: Installation scripts executed on remote host
    4. +
  4. Configuration: Configure app_config.json with Auth Code provided
    5. +
+
+ +
+ + +
+
+
+
+
+ + + +{% endblock %} diff --git a/docker-compose.yml b/docker-compose.yml deleted file mode 100644 index 9b1b550..0000000 --- a/docker-compose.yml +++ /dev/null @@ -1,167 +0,0 @@ -services: - - # ── Portal (main dashboard & SSO) ──────────────────────────────────────────── - portal: - build: ./portal - container_name: edp-portal - expose: - - "5001" - volumes: - - portal-data:/app/data - environment: - - FLASK_ENV=production - - PORT=5001 - - SECRET_KEY=${PORTAL_SECRET_KEY:-change-this-portal-secret-in-production} - - PORTAL_JWT_SECRET=${PORTAL_JWT_SECRET:-change-this-jwt-secret-in-production} - - DATABASE_URL=sqlite:////app/data/portal.db - - ADMIN_USERNAME=${ADMIN_USERNAME:-admin} - - ADMIN_PASSWORD=${ADMIN_PASSWORD:-admin123} - - ADMIN_EMAIL=${ADMIN_EMAIL:-admin@localhost} - restart: unless-stopped - healthcheck: - test: ["CMD", "python", "-c", "import urllib.request; urllib.request.urlopen('http://localhost:5001/health').read()"] - interval: 30s - timeout: 10s - retries: 3 - start_period: 20s - networks: - - edp-network - - # ── DigiServer v2 ───────────────────────────────────────────────────────────── - digiserver-app: - build: ./digiserver-v2 - container_name: edp-digiserver - expose: - - "5000" - volumes: - - ./digiserver-v2/data/instance:/app/instance - - ./digiserver-v2/data/uploads:/app/app/static/uploads - environment: - - FLASK_ENV=production - - SECRET_KEY=${DIGISERVER_SECRET_KEY:-change-digiserver-secret} - - ADMIN_USERNAME=${ADMIN_USERNAME:-admin} - - ADMIN_PASSWORD=${ADMIN_PASSWORD:-admin123} - - PORTAL_JWT_SECRET=${PORTAL_JWT_SECRET:-change-this-jwt-secret-in-production} - restart: unless-stopped - healthcheck: - test: ["CMD", "sh", "-c", "python -c \"import urllib.request; urllib.request.urlopen('http://localhost:5000/', timeout=5)\" || true"] - interval: 30s - timeout: 10s - retries: 3 - start_period: 40s - networks: - - edp-network - - # ── IT Asset Management ─────────────────────────────────────────────────────── - itassets-app: - build: ./IT_asset_management - container_name: edp-itassets - expose: - - "5000" - volumes: - - itassets-data:/app/data - - itassets-uploads:/app/uploads - - itassets-pdfs:/app/pdfs - - itassets-docs:/app/doc_templates - - itassets-docx:/app/docx_output - environment: - - FLASK_ENV=production - - PORT=5000 - - SECRET_KEY=${ITASSETS_SECRET_KEY:-change-itassets-secret} - - SQLALCHEMY_DATABASE_URI=sqlite:////app/data/itassets.db - - PORTAL_JWT_SECRET=${PORTAL_JWT_SECRET:-change-this-jwt-secret-in-production} - - FLASK_APP=run.py - command: > - sh -c "flask db upgrade && gunicorn -b 0.0.0.0:5000 -w 4 --timeout 120 run:app" - restart: unless-stopped - networks: - - edp-network - - # ── Server Monitor (Raspberry Pi monitoring + Ansible) ──────────────────────── - srvmonitor-app: - build: ./Server_Monitorizare_v2 - container_name: edp-srvmonitor - expose: - - "5000" - volumes: - - ./Server_Monitorizare_v2/data:/app/data - - ./Server_Monitorizare_v2/logs:/app/logs - - ./Server_Monitorizare_v2/ansible/inventory:/app/ansible/inventory - - ./Server_Monitorizare_v2/ansible/ssh_keys:/app/ansible/ssh_keys - environment: - - FLASK_ENV=production - - PORT=5000 - - PORTAL_JWT_SECRET=${PORTAL_JWT_SECRET:-change-this-jwt-secret-in-production} - restart: unless-stopped - networks: - - edp-network - - # ── NetworkView Backend (Node/Express + SQLite) ─────────────────────────────── - networkview-backend: - build: - context: ./NetworkView/backend - dockerfile: Dockerfile - container_name: edp-networkview-backend - expose: - - "3001" - volumes: - - networkview-data:/data - environment: - - PORT=3001 - - PORTAL_JWT_SECRET=${PORTAL_JWT_SECRET:-change-this-jwt-secret-in-production} - - NODE_ENV=production - restart: unless-stopped - networks: - - edp-network - - # ── NetworkView Frontend (React/Vite SPA served by nginx) ──────────────────── - networkview-frontend: - build: - context: ./NetworkView/frontend - dockerfile: Dockerfile - container_name: edp-networkview-frontend - expose: - - "80" - restart: unless-stopped - networks: - - edp-network - - # ── Umbrella Nginx Reverse Proxy ────────────────────────────────────────────── - nginx: - image: nginx:alpine - container_name: edp-nginx - ports: - - "80:80" - - "443:443" - volumes: - - ./nginx/nginx.conf:/etc/nginx/nginx.conf:ro - - ./nginx/ssl:/etc/nginx/ssl:ro - - ./nginx/logs:/var/log/nginx - depends_on: - - portal - - digiserver-app - - itassets-app - - networkview-backend - - networkview-frontend - - srvmonitor-app - restart: unless-stopped - healthcheck: - test: ["CMD", "wget", "--quiet", "--tries=1", "--spider", "http://127.0.0.1:80/health"] - interval: 30s - timeout: 10s - retries: 3 - networks: - - edp-network - -volumes: - portal-data: - itassets-data: - itassets-uploads: - itassets-pdfs: - itassets-docs: - itassets-docx: - networkview-data: - -networks: - edp-network: - driver: bridge