Update manifest version to 3.0.1 [▶️]

.github/workflows/release_build.yml

@@ -1,240 +0,0 @@
-name: Build, Push, Publish
-
-on:
-  push:
-    branches:
-      - main
-  workflow_dispatch:
-  schedule:
-    - cron: '28 5 * * *'
-  workflow_run:
-    workflows: ["Sync Repo"]
-    types:
-      - completed
-
-jobs:
-  release:
-    name: Build & Release
-    runs-on: ubuntu-latest
-    permissions:
-      contents: write
-      packages: write
-
-    steps:
-      - name: 📥 Checkout code with full history and tags
-        uses: actions/checkout@v4
-        with:
-          fetch-depth: 0
-
-      - name: Check if any tags exist
-        id: check_tags_exist
-        run: |
-          git fetch --tags
-          TAG_COUNT=$(git tag | wc -l)
-          if [ "$TAG_COUNT" -eq 0 ]; then
-            echo "has_tags=false" >> "$GITHUB_OUTPUT"
-            echo "latest_tag=v0.0.0" >> "$GITHUB_OUTPUT"
-          else
-            echo "has_tags=true" >> "$GITHUB_OUTPUT"
-            LATEST_TAG=$(git describe --tags --abbrev=0)
-            echo "latest_tag=$LATEST_TAG" >> "$GITHUB_OUTPUT"
-          fi
-
-      - name: Check if meaningful commits exist since latest tag
-        id: check_commits
-        run: |
-          if [ "${{ steps.check_tags_exist.outputs.has_tags }}" = "false" ]; then
-            # No tags exist, so we should create first release
-            echo "commit_count=1" >> "$GITHUB_OUTPUT"
-            CHANGED_FILES=$(git ls-files | grep -v '^manifest.json$' || true)
-            if [ -n "$CHANGED_FILES" ]; then
-              echo "changed_files<<EOF" >> "$GITHUB_OUTPUT"
-              printf '%s\n' "$CHANGED_FILES" >> "$GITHUB_OUTPUT"
-              echo "EOF" >> "$GITHUB_OUTPUT"
-            else
-              echo "changed_files=Initial release" >> "$GITHUB_OUTPUT"
-            fi
-          else
-            LATEST_TAG="${{ steps.check_tags_exist.outputs.latest_tag }}"
-            CHANGED_FILES="$(git diff --name-only "${LATEST_TAG}..HEAD" | grep -v '^manifest.json$' || true)"
-            if [ -n "$CHANGED_FILES" ]; then
-              echo "commit_count=1" >> "$GITHUB_OUTPUT"
-              echo "changed_files<<EOF" >> "$GITHUB_OUTPUT"
-              printf '%s\n' "$CHANGED_FILES" >> "$GITHUB_OUTPUT"
-              echo "EOF" >> "$GITHUB_OUTPUT"
-            else
-              echo "commit_count=0" >> "$GITHUB_OUTPUT"
-            fi
-          fi
-
-      - name: Get latest release tag (from GitHub API)
-        id: get_latest_release
-        run: |
-          LATEST_RELEASE_TAG=$(curl -sL -H "Accept: application/vnd.github+json" \
-            -H "Authorization: Bearer ${{ secrets.GITHUB_TOKEN }}" \
-            "https://api.github.com/repos/${GITHUB_REPOSITORY}/releases/latest" | jq -r .tag_name)
-          if [ -z "$LATEST_RELEASE_TAG" ] || [ "$LATEST_RELEASE_TAG" = "null" ]; then
-            LATEST_RELEASE_TAG="v1.0.0"
-          fi
-          echo "latest_release_tag=$LATEST_RELEASE_TAG" >> "$GITHUB_OUTPUT"
-          echo "latest_release_version=${LATEST_RELEASE_TAG#v}" >> "$GITHUB_OUTPUT"
-
-      # -------------------------------
-      # Sync manifest.json to last release version if behind (only when no meaningful commits)
-      # -------------------------------
-      - name: 🛠 Ensure manifest.json matches latest release version
-        if: steps.check_commits.outputs.commit_count == '0'
-        run: |
-          if [ -f manifest.json ]; then
-            MANIFEST_VERSION=$(jq -r '.version // empty' manifest.json)
-          else
-            MANIFEST_VERSION=""
-          fi
-          LATEST_RELEASE_VERSION="${{ steps.get_latest_release.outputs.latest_release_version }}"
-          PYTHON_CODE="from packaging import version; \
-            print(version.parse('$LATEST_RELEASE_VERSION') > version.parse('$MANIFEST_VERSION') if '$MANIFEST_VERSION' else True)"
-          NEED_UPDATE=$(python3 -c "$PYTHON_CODE")
-          if [ "$NEED_UPDATE" = "True" ]; then
-            echo "Updating manifest.json to version $LATEST_RELEASE_VERSION (sync with release)"
-            jq --arg v "$LATEST_RELEASE_VERSION" '.version = $v' manifest.json > tmp.json && mv tmp.json manifest.json
-            git config user.name "github-actions"
-            git config user.email "github-actions@github.com"
-            git add manifest.json
-            git commit -m "Sync manifest.json to release $LATEST_RELEASE_VERSION [🔄]" || echo "Nothing to commit"
-            git push origin main || true
-          else
-            echo "Manifest.json is already up-to-date with the latest release."
-          fi
-
-      # -------------------------------
-      # Continue normal workflow if commits exist
-      # -------------------------------
-      - name: 📃 Get list of changed files (Markdown bullet list)
-        if: steps.check_commits.outputs.commit_count != '0'
-        id: changed_files
-        run: |
-          BULLET_LIST="$(printf '%s\n' "${{ steps.check_commits.outputs.changed_files }}" | sed 's/^/- /')"
-          echo "CHANGED<<EOF" >> "$GITHUB_OUTPUT"
-          printf '%s\n' "$BULLET_LIST" >> "$GITHUB_OUTPUT"
-          echo "EOF" >> "$GITHUB_OUTPUT"
-          COUNT="$(printf '%s\n' "${{ steps.check_commits.outputs.changed_files }}" | wc -l)"
-          echo "COUNT=$COUNT" >> "$GITHUB_OUTPUT"
-
-      - name: Get manifest version
-        if: steps.check_commits.outputs.commit_count != '0'
-        id: get_manifest_version
-        run: |
-          if [ -f manifest.json ]; then
-            MANIFEST_VERSION=$(jq -r '.version // empty' manifest.json)
-            if [ -z "$MANIFEST_VERSION" ] || [ "$MANIFEST_VERSION" = "null" ]; then
-              MANIFEST_VERSION="1.0.0"
-            fi
-          else
-            MANIFEST_VERSION="1.0.0"
-          fi
-          echo "manifest_version=$MANIFEST_VERSION" >> "$GITHUB_OUTPUT"
-
-      - name: Pick base version
-        if: steps.check_commits.outputs.commit_count != '0'
-        id: pick_base_version
-        run: |
-          LATEST_RELEASE="${{ steps.get_latest_release.outputs.latest_release_version }}"
-          MANIFEST="${{ steps.get_manifest_version.outputs.manifest_version }}"
-          BASE_VERSION=$(python3 -c "from packaging import version; \
-            print(str(max(version.parse('$LATEST_RELEASE'), version.parse('$MANIFEST'))))")
-          echo "base_version=$BASE_VERSION" >> "$GITHUB_OUTPUT"
-
-      - name: 🔢 Determine version
-        if: steps.check_commits.outputs.commit_count != '0'
-        id: version
-        run: |
-          BASE_VERSION="${{ steps.pick_base_version.outputs.base_version }}"
-          IFS='.' read -r MAJOR MINOR PATCH <<< "$BASE_VERSION"
-          COUNT="${{ steps.changed_files.outputs.COUNT }}"
-          if [ "$COUNT" -ge 5 ]; then
-            MAJOR=$((MAJOR + 1))
-            MINOR=0
-            PATCH=0
-          elif [ "$COUNT" -ge 3 ]; then
-            MINOR=$((MINOR + 1))
-            PATCH=0
-          else
-            PATCH=$((PATCH + 1))
-          fi
-          NEW_VERSION="${MAJOR}.${MINOR}.${PATCH}"
-          REPO_NAME="$(basename "$GITHUB_REPOSITORY")"
-          ZIP_NAME="${REPO_NAME}-${NEW_VERSION}.zip"
-          echo "VERSION=$NEW_VERSION" >> "$GITHUB_OUTPUT"
-          echo "ZIP_NAME=$ZIP_NAME" >> "$GITHUB_OUTPUT"
-          echo "REPO_NAME=$REPO_NAME" >> "$GITHUB_OUTPUT"
-
-      - name: 🛠 Update or create manifest.json
-        if: steps.check_commits.outputs.commit_count != '0'
-        run: |
-          VERSION="${{ steps.version.outputs.VERSION }}"
-          AUTHOR="Ivan Carlos"
-          VERSION_FILE="manifest.json"
-          if [ -f "$VERSION_FILE" ]; then
-            jq --arg v "$VERSION" --arg a "$AUTHOR" \
-               '.version = $v | .author = $a' "$VERSION_FILE" > tmp.json && mv tmp.json "$VERSION_FILE"
-          else
-            echo "{ \"version\": \"$VERSION\", \"author\": \"$AUTHOR\" }" > "$VERSION_FILE"
-          fi
-
-      - name: 💾 Commit and push updated manifest.json
-        if: steps.check_commits.outputs.commit_count != '0'
-        run: |
-          git config user.name "github-actions"
-          git config user.email "github-actions@github.com"
-          git add manifest.json
-          git commit -m "Update manifest version to ${{ steps.version.outputs.VERSION }} [▶️]" || echo "Nothing to commit"
-          git push origin main
-
-      - name: 📦 Create ZIP package (excluding certain files)
-        if: steps.check_commits.outputs.commit_count != '0'
-        run: |
-          ZIP_NAME="${{ steps.version.outputs.ZIP_NAME }}"
-          zip -r "$ZIP_NAME" . -x ".git/*" ".github/*" "docker/*" ".dockerignore" "CNAME" "Dockerfile" "README.md" "LICENSE"
-
-      - name: 🚀 Create GitHub Release
-        if: steps.check_commits.outputs.commit_count != '0'
-        uses: softprops/action-gh-release@v2
-        with:
-          tag_name: "v${{ steps.version.outputs.VERSION }}"
-          name: "${{ steps.version.outputs.REPO_NAME }} v${{ steps.version.outputs.VERSION }}"
-          body: |
-            ### Changelog
-            Files changed in this release:
-            ${{ steps.changed_files.outputs.CHANGED }}
-          files: ${{ steps.version.outputs.ZIP_NAME }}
-
-      # ----- Docker steps -----
-      - name: 🔍 Check if Dockerfile exists
-        if: steps.check_commits.outputs.commit_count != '0'
-        id: dockerfile_check
-        run: |
-          if [ -f Dockerfile ]; then
-            echo "exists=true" >> "$GITHUB_OUTPUT"
-          else
-            echo "exists=false" >> "$GITHUB_OUTPUT"
-          fi
-
-      - name: 🛠 Set up Docker Buildx
-        if: steps.check_commits.outputs.commit_count != '0' && steps.dockerfile_check.outputs.exists == 'true'
-        uses: docker/setup-buildx-action@v3
-
-      - name: 🔐 Login to GitHub Container Registry
-        if: steps.check_commits.outputs.commit_count != '0' && steps.dockerfile_check.outputs.exists == 'true'
-        uses: docker/login-action@v3
-        with:
-          registry: ghcr.io
-          username: ${{ github.actor }}
-          password: ${{ secrets.GITHUB_TOKEN }}
-
-      - name: 🐳 Build and Push Docker image
-        if: steps.check_commits.outputs.commit_count != '0' && steps.dockerfile_check.outputs.exists == 'true'
-        uses: docker/build-push-action@v5
-        with:
-          context: .
-          push: true
-          tags: ghcr.io/${{ github.repository }}:latest

.github/workflows/update_readme.yml

@@ -1,78 +0,0 @@
-name: Update README
-
-# Allow GitHub Actions to commit and push changes
-permissions:
-  contents: write
-
-on:
-  workflow_dispatch:
-  schedule:
-    - cron: '0 4 * * *'  # Every day at 4 AM UTC
-
-jobs:
-  update-readme:
-    runs-on: ubuntu-latest
-
-    env:
-      SOURCE_REPO: ivancarlosti/.github
-      SOURCE_BRANCH: main
-
-    steps:
-      - name: Checkout current repository
-        uses: actions/checkout@v4
-
-      - name: Checkout source README template
-        uses: actions/checkout@v4
-        with:
-          repository: ${{ env.SOURCE_REPO }}
-          ref: ${{ env.SOURCE_BRANCH }}
-          path: source_readme
-
-      - name: Update README.md (buttons and footer)
-        run: |
-          set -e
-          REPO_NAME="${GITHUB_REPOSITORY##*/}"
-
-          # --- Extract buttons block from source ---
-          BUTTONS=$(awk '/<!-- buttons -->/{flag=1;next}/<!-- endbuttons -->/{flag=0}flag' source_readme/README.md)
-          BUTTONS_UPDATED=$(echo "$BUTTONS" | sed "s/\.github/${REPO_NAME}/g")
-
-          # --- Extract footer block from source (everything from <!-- footer --> onward) ---
-          FOOTER=$(awk '/<!-- footer -->/{flag=1}flag' source_readme/README.md)
-
-          # --- Replace buttons section in README.md ---
-          UPDATED=$(awk -v buttons="$BUTTONS_UPDATED" '
-            BEGIN { skip=0 }
-            /<!-- buttons -->/ {
-              print
-              print buttons
-              skip=1
-              next
-            }
-            /<!-- endbuttons -->/ && skip {
-              print
-              skip=0
-              next
-            }
-            !skip { print }
-          ' README.md)
-
-          # --- Replace everything after <!-- footer --> with FOOTER ---
-          echo "$UPDATED" | awk -v footer="$FOOTER" '
-            /<!-- footer -->/ {
-              print footer
-              found=1
-              exit
-            }
-            { print }
-          ' > README.tmp && mv README.tmp README.md
-
-      - name: Remove source_readme from git index
-        run: git rm --cached -r source_readme || true
-
-      - name: Commit and push changes
-        uses: stefanzweifel/git-auto-commit-action@v5
-        with:
-          file_pattern: README.md
-          commit_message: "Sync README from template [▶️]"
-          branch: ${{ github.ref_name }}

CNAME

@@ -1 +0,0 @@
-teste.git.icc.gg

Dockerfile

@@ -0,0 +1,3 @@
+FROM nginx:alpine
+
+COPY public/ /usr/share/nginx/html

manifest.json

@@ -1,4 +1,4 @@
 {
-  "version": "2.0.0",
+  "version": "3.0.1",
   "author": "Ivan Carlos"
 }

public/index.html

@@ -1,9 +1,9 @@
 <!DOCTYPE html>
-<html lang="pt-BR">
+<html lang="en">
 
 <head>
   <meta charset="UTF-8" />
-  <title>Teste de Dispositivos Pro</title>
+  <title>Device Tester Pro</title>
   <meta name="viewport" content="width=device-width, initial-scale=1" />
   <link rel="preconnect" href="https://fonts.googleapis.com">
   <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
@@ -45,10 +45,65 @@
     }
 
     header {
+      display: flex;
+      flex-direction: column;
+      gap: 15px;
+      margin-bottom: 30px;
+    }
+
+    /* Shared styles for header buttons */
+    .theme-toggle,
+    .icon-btn {
+      background: none;
+      border: 2px solid var(--border-color);
+      color: var(--text-color);
+      padding: 0 12px;
+      border-radius: 8px;
+      cursor: pointer;
+      font-weight: 600;
+      transition: all 0.2s;
+      font-family: inherit;
+      font-size: 1.2rem;
+      /* Larger emoji */
+      display: inline-flex;
+      align-items: center;
+      justify-content: center;
+      height: 40px;
+      /* Enforce consistent height */
+      box-sizing: border-box;
+      min-width: 44px;
+    }
+
+    .theme-toggle {
+      font-size: 0.9rem;
+      /* Restore font size for theme text */
+      gap: 6px;
+    }
+
+    .theme-toggle:hover,
+    .icon-btn:hover {
+      background-color: var(--border-color);
+    }
+
+    .icon-btn.active {
+      background-color: var(--primary);
+      color: white;
+      border-color: var(--primary);
+    }
+
+    .header-top {
       display: flex;
       justify-content: space-between;
       align-items: center;
-      margin-bottom: 30px;
+      width: 100%;
+      flex-wrap: wrap;
+      gap: 10px;
+    }
+
+    .header-controls {
+      display: flex;
+      align-items: center;
+      gap: 8px;
     }
 
     h1 {
@@ -60,20 +115,7 @@
       -webkit-text-fill-color: transparent;
     }
 
-    .theme-toggle {
-      background: none;
-      border: 2px solid var(--border-color);
-      color: var(--text-color);
-      padding: 8px 12px;
-      border-radius: 8px;
-      cursor: pointer;
-      font-weight: 600;
-      transition: all 0.2s;
-    }
 
-    .theme-toggle:hover {
-      background-color: var(--border-color);
-    }
 
     .test-card {
       background-color: var(--card-bg);
@@ -104,7 +146,7 @@
       font-size: 0.9rem;
     }
 
-    select,
+    select.device-select,
     textarea {
       width: 100%;
       padding: 10px;
@@ -209,80 +251,88 @@
 
   <div class="container">
     <header>
-      <h1>Teste de Dispositivos</h1>
+      <div class="header-top">
-      <button class="theme-toggle" onclick="toggleTheme()">🌓 Tema</button>
+        <h1 data-i18n="app_title">Device Tester Pro</h1>
+        <div class="header-controls">
+          <button class="icon-btn" onclick="changeLanguage('en')" id="btn-en" aria-label="English">🇺🇸</button>
+          <button class="icon-btn" onclick="changeLanguage('pt')" id="btn-pt" aria-label="Português">🇧🇷</button>
+          <button class="icon-btn" onclick="changeLanguage('es')" id="btn-es" aria-label="Español">🇲🇽</button>
+          <div style="width: 1px; height: 24px; background: var(--border-color); margin: 0 4px;"></div>
+          <button class="theme-toggle" onclick="toggleTheme()" data-i18n="theme_toggle">🌓 Theme</button>
+        </div>
+      </div>
     </header>
 
-    <!-- Rede -->
+    <!-- Network -->
     <div class="test-card">
-      <h2>📡 Rede e Navegador</h2>
+      <h2 data-i18n="network_title">📡 Network & Browser</h2>
       <p>IPv4: <strong id="ipv4">...</strong> <span class="status-text" id="geo-ipv4"></span></p>
       <p class="status-text" id="isp-label-ipv4"></p>
       <p>IPv6: <strong id="ipv6">...</strong> <span class="status-text" id="geo-ipv6"></span></p>
       <p class="status-text" id="isp-label-ipv6"></p>
-      <label>User Agent:</label>
+      <label data-i18n="user_agent_label">User Agent:</label>
       <textarea id="user-agent" rows="2" readonly></textarea>
     </div>
 
-    <!-- Bateria -->
+    <!-- Battery -->
     <div class="test-card">
-      <h2>🔋 Bateria</h2>
+      <h2 data-i18n="battery_title">🔋 Battery</h2>
-      <p id="battery-status">Detectando...</p>
+      <p id="battery-status" data-i18n="detecting">Detecting...</p>
       <div class="bar-container">
         <div id="battery-bar" class="bar-fill" style="background-color: var(--primary);"></div>
       </div>
     </div>
 
-    <!-- Tela -->
+    <!-- Screen -->
     <div class="test-card">
-      <h2>🖥️ Tela & Dead Pixel</h2>
+      <h2 data-i18n="screen_title">🖥️ Screen & Dead Pixel</h2>
-      <p class="status-text">Cicla entre cores primárias para identificar pixels mortos.</p>
+      <p class="status-text" data-i18n="screen_desc">Cycles through primary colors to identify dead pixels.</p>
-      <button onclick="startScreenTest()">Iniciar Teste de Tela</button>
+      <button onclick="startScreenTest()" data-i18n="start_screen_test">Start Screen Test</button>
     </div>
 
-    <!-- Vibração -->
+    <!-- Vibration -->
     <div class="test-card">
-      <h2>📳 Vibração</h2>
+      <h2 data-i18n="vibration_title">📳 Vibration</h2>
-      <p class="status-text">Funciona apenas em dispositivos móveis compatíveis.</p>
+      <p class="status-text" data-i18n="vibration_desc">Works only on compatible mobile devices.</p>
-      <button onclick="testVibration()">Vibrar Dispositivo</button>
+      <button onclick="testVibration()" data-i18n="vibrate_device">Vibrate Device</button>
     </div>
 
     <!-- Webcam -->
     <div class="test-card">
-      <h2>📷 Webcam</h2>
+      <h2 data-i18n="webcam_title">📷 Webcam</h2>
-      <select id="webcam-select"></select>
+      <select id="webcam-select" class="device-select"></select>
       <div>
-        <button onclick="startWebcam()">Ligar</button>
+        <button onclick="startWebcam()" data-i18n="turn_on">Turn On</button>
-        <button onclick="stopWebcam()" class="stop">Desligar</button>
+        <button onclick="stopWebcam()" class="stop" data-i18n="turn_off">Turn Off</button>
       </div>
       <video id="webcam" autoplay playsinline></video>
-      <p id="webcam-status" class="status-text">Status: Aguardando...</p>
+      <p id="webcam-status" class="status-text" data-i18n="status_waiting">Status: Waiting...</p>
     </div>
 
-    <!-- Microfone -->
+    <!-- Microphone -->
     <div class="test-card">
-      <h2>🎤 Microfone</h2>
+      <h2 data-i18n="mic_title">🎤 Microphone</h2>
-      <select id="mic-select"></select>
+      <select id="mic-select" class="device-select"></select>
       <div>
-        <button onclick="startMic()">Monitorar Ao Vivo</button>
+        <button onclick="startMic()" data-i18n="monitor_live">Monitor Live</button>
-        <button onclick="stopMic()" class="stop">Parar</button>
+        <button onclick="stopMic()" class="stop" data-i18n="stop">Stop</button>
-        <button onclick="recordMicFor10s()">Gravar 10s</button>
+        <button onclick="recordMicFor10s()" data-i18n="record_10s">Record 10s</button>
       </div>
       <div class="bar-container">
         <div id="mic-bar" class="bar-fill"></div>
       </div>
-      <p id="mic-status" class="status-text">Status: Aguardando...</p>
+      <p id="mic-status" class="status-text" data-i18n="status_waiting">Status: Waiting...</p>
       <audio id="mic-playback" controls style="width: 100%; margin-top: 10px; display: none;"></audio>
     </div>
 
-    <!-- Som -->
+    <!-- Sound -->
     <div class="test-card">
-      <h2>🔊 Saída de Som</h2>
+      <h2 data-i18n="sound_title">🔊 Sound Output</h2>
-      <select id="spk-select"></select>
+      <select id="spk-select" class="device-select"></select>
       <audio id="audio-test" src="test-sound.mp3" preload="auto"></audio>
       <div>
-        <button id="playBtn" onclick="playSound()">Tocar Música</button>
+        <button id="playBtn" onclick="playSound()" data-i18n="play_music">Play Music</button>
-        <button onclick="stopSound()" class="stop">Parar</button>
+        <button onclick="stopSound()" class="stop" data-i18n="stop">Stop</button>
       </div>
       <div class="bar-container">
         <div id="speaker-bar" class="bar-fill" style="background-color: #f59e0b;"></div>
@@ -293,10 +343,169 @@
 
   <!-- Overlay para teste de tela -->
   <div id="screen-overlay" onclick="nextScreenColor()">
-    <div id="screen-instruction">Clique para trocar a cor. Escura para sair.</div>
+    <div id="screen-instruction" data-i18n="screen_instruction">Click to change color. Esc to exit.</div>
   </div>
 
   <script>
+    // i18n Dictionary
+    const dictionary = {
+      en: {
+        app_title: "Device Tester Pro",
+        theme_toggle: "🌓 Theme",
+        network_title: "📡 Network & Browser",
+        user_agent_label: "User Agent:",
+        battery_title: "🔋 Battery",
+        detecting: "Detecting...",
+        charging: "⚡ Charging",
+        disconnected: "Disconnected",
+        battery_unsupported: "Battery API not supported in this browser.",
+        screen_title: "🖥️ Screen & Dead Pixel",
+        screen_desc: "Cycles through primary colors to identify dead pixels.",
+        start_screen_test: "Start Screen Test",
+        screen_instruction: "Click to change color. Dark to exit.",
+        vibration_title: "📳 Vibration",
+        vibration_desc: "Works only on compatible mobile devices.",
+        vibrate_device: "Vibrate Device",
+        vibration_unsupported: "Your device does not support vibration via web API.",
+        webcam_title: "📷 Webcam",
+        turn_on: "Turn On",
+        turn_off: "Turn Off",
+        status_waiting: "Status: Waiting...",
+        webcam_ok: "Webcam: Working (OK)",
+        status_stopped: "Status: Stopped",
+        mic_title: "🎤 Microphone",
+        monitor_live: "Monitor Live",
+        stop: "Stop",
+        record_10s: "Record 10s",
+        capturing_audio: "Capturing audio...",
+        starting_capture: "Starting capture...",
+        recording: "Recording...",
+        playing_recording: "Playing recording...",
+        sound_title: "🔊 Sound Output",
+        play_music: "Play Music",
+        device_unknown: "Unknown Device",
+        default_output: "Default Output",
+        ipv4_unavailable: "Unavailable",
+        ipv6_not_detected: "Not detected"
+      },
+      pt: {
+        app_title: "Teste de Dispositivos",
+        theme_toggle: "🌓 Tema",
+        network_title: "📡 Rede e Navegador",
+        user_agent_label: "Agente de Usuário:",
+        battery_title: "🔋 Bateria",
+        detecting: "Detectando...",
+        charging: "⚡ Carregando",
+        disconnected: "Desconectado",
+        battery_unsupported: "API de Bateria não suportada neste navegador.",
+        screen_title: "🖥️ Tela & Dead Pixel",
+        screen_desc: "Cicla entre cores primárias para identificar pixels mortos.",
+        start_screen_test: "Iniciar Teste de Tela",
+        screen_instruction: "Clique para trocar a cor. Escura para sair.",
+        vibration_title: "📳 Vibração",
+        vibration_desc: "Funciona apenas em dispositivos móveis compatíveis.",
+        vibrate_device: "Vibrar Dispositivo",
+        vibration_unsupported: "Seu dispositivo não suporta vibração via API web.",
+        webcam_title: "📷 Webcam",
+        turn_on: "Ligar",
+        turn_off: "Desligar",
+        status_waiting: "Status: Aguardando...",
+        webcam_ok: "Webcam: Funcionando (OK)",
+        status_stopped: "Status: Parado",
+        mic_title: "🎤 Microfone",
+        monitor_live: "Monitorar Ao Vivo",
+        stop: "Parar",
+        record_10s: "Gravar 10s",
+        capturing_audio: "Capturando áudio...",
+        starting_capture: "Iniciando captura...",
+        recording: "Gravando...",
+        playing_recording: "Reproduzindo gravação...",
+        sound_title: "🔊 Saída de Som",
+        play_music: "Tocar Música",
+        device_unknown: "Dispositivo não identificado",
+        default_output: "Saída Padrão",
+        ipv4_unavailable: "Indisponível",
+        ipv6_not_detected: "Não detectado"
+      },
+      es: {
+        app_title: "Prueba de Dispositivos",
+        theme_toggle: "🌓 Tema",
+        network_title: "📡 Red y Navegador",
+        user_agent_label: "Agente de Usuario:",
+        battery_title: "🔋 Batería",
+        detecting: "Detectando...",
+        charging: "⚡ Cargando",
+        disconnected: "Desconectado",
+        battery_unsupported: "API de batería no soportada en este navegador.",
+        screen_title: "🖥️ Pantalla y Píxeles Muertos",
+        screen_desc: "Alterna entre colores primarios para identificar píxeles muertos.",
+        start_screen_test: "Iniciar Prueba de Pantalla",
+        screen_instruction: "Haga clic para cambiar de color. Oscuro para salir.",
+        vibration_title: "📳 Vibración",
+        vibration_desc: "Funciona solo en dispositivos móviles compatibles.",
+        vibrate_device: "Vibrar Dispositivo",
+        vibration_unsupported: "Su dispositivo no admite vibración a través de la API web.",
+        webcam_title: "📷 Cámara Web",
+        turn_on: "Encender",
+        turn_off: "Apagar",
+        status_waiting: "Estado: Esperando...",
+        webcam_ok: "Cámara: Funcionando (OK)",
+        status_stopped: "Estado: Detenido",
+        mic_title: "🎤 Micrófono",
+        monitor_live: "Monitorear en Vivo",
+        stop: "Parar",
+        record_10s: "Grabar 10s",
+        capturing_audio: "Capturando audio...",
+        starting_capture: "Iniciando captura...",
+        recording: "Grabando...",
+        playing_recording: "Reproduciendo grabación...",
+        sound_title: "🔊 Salida de Sonido",
+        play_music: "Reproducir Música",
+        device_unknown: "Dispositivo desconocido",
+        default_output: "Salida Predeterminada",
+        ipv4_unavailable: "No disponible",
+        ipv6_not_detected: "No detectado"
+      }
+    };
+
+    let currentLang = localStorage.getItem('deviceTesterLang') || 'en';
+
+    function changeLanguage(lang) {
+      currentLang = lang;
+      localStorage.setItem('deviceTesterLang', lang);
+
+      // Update active button state
+      document.querySelectorAll('.icon-btn').forEach(btn => btn.classList.remove('active'));
+      const activeBtn = document.getElementById(`btn-${lang}`);
+      if (activeBtn) activeBtn.classList.add('active');
+
+      document.documentElement.lang = lang === 'pt' ? 'pt-BR' : (lang === 'es' ? 'es-MX' : 'en-US'); // Set html tag lang
+      applyTranslations();
+      // Refresh dynamic content that depends on language (like IP detection messages if needed, though they are mostly dynamic data)
+      // Re-listing devices to update "Unknown Device" text
+      listDevices();
+      // Trigger battery update to refresh text
+      if (navigator.getBattery) {
+        navigator.getBattery().then(b => b.dispatchEvent(new Event('levelchange')));
+      } else {
+        document.getElementById("battery-status").textContent = dictionary[currentLang].battery_unsupported;
+      }
+    }
+
+    function applyTranslations() {
+      const elements = document.querySelectorAll('[data-i18n]');
+      elements.forEach(el => {
+        const key = el.getAttribute('data-i18n');
+        if (dictionary[currentLang] && dictionary[currentLang][key]) {
+          el.textContent = dictionary[currentLang][key];
+        }
+      });
+    }
+
+    // Initialize Language
+    changeLanguage(currentLang);
+
+
     // Theme
     function toggleTheme() {
       document.body.classList.toggle('dark-mode');
@@ -365,6 +574,10 @@
     function listDevices() {
       navigator.mediaDevices.enumerateDevices().then(devices => {
         // Preserve selection if possible? For now simple rebuild
+        const oldWebcam = webcamSelect.value;
+        const oldMic = micSelect.value;
+        const oldSpk = spkSelect.value;
+
         webcamSelect.innerHTML = "";
         micSelect.innerHTML = "";
         spkSelect.innerHTML = "";
@@ -372,7 +585,7 @@
         devices.forEach(device => {
           const option = document.createElement("option");
           option.value = device.deviceId;
-          option.text = device.label || "Dispositivo não identificado";
+          option.text = device.label || dictionary[currentLang].device_unknown;
           if (device.kind === "videoinput") webcamSelect.appendChild(option.cloneNode(true));
           if (device.kind === "audioinput") micSelect.appendChild(option.cloneNode(true));
           if (device.kind === "audiooutput" && typeof spkSelect.setSinkId === "function")
@@ -382,9 +595,14 @@
         if (spkSelect.options.length === 0) {
           const option = document.createElement("option");
           option.value = "";
-          option.text = "Saída Padrão";
+          option.text = dictionary[currentLang].default_output;
           spkSelect.appendChild(option);
         }
+
+        // Try to restore selection
+        if (oldWebcam) webcamSelect.value = oldWebcam;
+        if (oldMic) micSelect.value = oldMic;
+        if (oldSpk) spkSelect.value = oldSpk;
       });
     }
 
@@ -397,7 +615,7 @@
         .then(stream => {
           webcamStream = stream;
           video.srcObject = stream;
-          document.getElementById("webcam-status").textContent = "Webcam: Funcionando (OK)";
+          document.getElementById("webcam-status").textContent = dictionary[currentLang].webcam_ok;
           document.getElementById("webcam-status").style.color = "var(--success)";
         })
         .catch((e) => {
@@ -410,7 +628,7 @@
         webcamStream.getTracks().forEach(t => t.stop());
         video.srcObject = null;
         webcamStream = null;
-        document.getElementById("webcam-status").textContent = "Status: Parado";
+        document.getElementById("webcam-status").textContent = dictionary[currentLang].status_stopped;
         document.getElementById("webcam-status").style.color = "var(--text-color)";
       }
     }
@@ -432,14 +650,14 @@
           micBar.style.width = pct + "%";
           if (pct > 5) {
             const st = document.getElementById("mic-status");
-            if (st.textContent !== "Capturando áudio...") {
+            if (st.textContent !== dictionary[currentLang].capturing_audio) {
-              st.textContent = "Capturando áudio...";
+              st.textContent = dictionary[currentLang].capturing_audio;
               st.style.color = "var(--success)";
             }
           }
         };
         source.connect(micWorkletNode);
-        document.getElementById("mic-status").textContent = "Iniciando captura...";
+        document.getElementById("mic-status").textContent = dictionary[currentLang].starting_capture;
       } catch (e) {
         document.getElementById("mic-status").textContent = "Erro: " + e.message;
         document.getElementById("mic-status").style.color = "var(--danger)";
@@ -455,7 +673,7 @@
       micStream = null;
       micBar.style.width = "0%";
       const st = document.getElementById("mic-status");
-      st.textContent = "Status: Parado";
+      st.textContent = dictionary[currentLang].status_stopped;
       st.style.color = "var(--text-color)";
     }
 
@@ -493,18 +711,18 @@
         let remaining = 10;
         const status = document.getElementById("mic-status");
         status.style.color = "var(--primary)";
-        status.textContent = `Gravando... ${remaining}s`;
+        status.textContent = `${dictionary[currentLang].recording} ${remaining}s`;
 
         const countdown = setInterval(() => {
           remaining--;
-          if (remaining > 0) status.textContent = `Gravando... ${remaining}s`;
+          if (remaining > 0) status.textContent = `${dictionary[currentLang].recording} ${remaining}s`;
         }, 1000);
 
         setTimeout(() => {
           clearInterval(countdown);
           micRecorder.stop();
           stream.getTracks().forEach(t => t.stop());
-          status.textContent = "Reproduzindo gravação...";
+          status.textContent = dictionary[currentLang].playing_recording;
           status.style.color = "var(--text-color)";
         }, 10000);
       } catch (err) {
@@ -559,25 +777,31 @@
 
     // IPs
     function getIPv4AndISP() {
-      fetch("https://ipwhois.app/json/?lang=pt")
+      fetch("https://ipwhois.app/json/?lang=en") // Using 'en' for consistency, can be improved to use currentLang but ISP data might be mix
         .then(res => res.json())
         .then(data => {
-          document.getElementById("ipv4").textContent = data.ip || "Indisponível";
+          document.getElementById("ipv4").textContent = data.ip || dictionary[currentLang].ipv4_unavailable;
           const geo = [data.city, data.region, data.country].filter(Boolean);
           document.getElementById("geo-ipv4").textContent = geo.length ? "(" + geo.join(", ") + ")" : "";
           document.getElementById("isp-label-ipv4").textContent = data.isp ? "ISP: " + decodeURIComponent(escape(data.isp)) : "";
         })
         .catch(() => { });
     }
+
     function getIPv6AndISP() {
-      fetch("https://api64.ipify.org?format=json")
+      // Use IPv6 specific endpoint to force IPv6 usage
-        .then(res => res.json())
+      fetch("https://api6.ipify.org?format=json")
+        .then(res => {
+          if (!res.ok) throw new Error("IPv6 Fetch Failed");
+          return res.json();
+        })
         .then(ip => {
           if (ip.ip && ip.ip.includes(":")) {
             document.getElementById("ipv6").textContent = ip.ip;
-            return fetch(`https://ipwhois.app/json/${ip.ip}?lang=pt`);
+            // Fetch validation/Geo for IPv6
+            return fetch(`https://ipwhois.app/json/${ip.ip}?lang=en`);
           } else {
-            document.getElementById("ipv6").textContent = "Não detectado";
+            throw new Error("No IPv6 detected");
           }
         })
         .then(res => res.json())
@@ -587,7 +811,10 @@
           document.getElementById("geo-ipv6").textContent = geo.length ? "(" + geo.join(", ") + ")" : "";
           document.getElementById("isp-label-ipv6").textContent = data.isp ? "ISP: " + decodeURIComponent(escape(data.isp)) : "";
         })
-        .catch(() => { });
+        .catch((e) => {
+          console.log("IPv6 Check Failed:", e);
+          document.getElementById("ipv6").textContent = dictionary[currentLang].ipv6_not_detected;
+        });
     }
 
     // NEW FEATURES
@@ -597,7 +824,7 @@
       navigator.getBattery().then(battery => {
         function updateBattery() {
           const level = Math.round(battery.level * 100);
-          const charging = battery.charging ? "⚡ Carregando" : "Desconectado";
+          const charging = battery.charging ? dictionary[currentLang].charging : dictionary[currentLang].disconnected;
           document.getElementById("battery-status").textContent = `${level}% - ${charging}`;
           document.getElementById("battery-bar").style.width = level + "%";
 
@@ -610,8 +837,11 @@
         updateBattery();
       });
     } else {
-      document.getElementById("battery-status").textContent = "API de Bateria não suportada neste navegador.";
+      // Wait for dictionary to be ready or just set it
+      setTimeout(() => {
+        document.getElementById("battery-status").textContent = dictionary[currentLang].battery_unsupported;
         document.getElementById("battery-bar").style.width = "0%";
+      }, 100);
     }
 
     // Vibration
@@ -619,7 +849,7 @@
       if (navigator.vibrate) {
         navigator.vibrate([200, 100, 200]); // Vibrate twice
       } else {
-        alert("Seu dispositivo não suporta vibração via API web.");
+        alert(dictionary[currentLang].vibration_unsupported);
       }
     }
 
@@ -656,6 +886,9 @@
       }).catch(() => listDevices());
       getIPv4AndISP();
       getIPv6AndISP();
+
+      // Ensure initial text is correct
+      applyTranslations();
     };
     navigator.mediaDevices.addEventListener("devicechange", listDevices);
     audio.addEventListener("ended", () => {