RTUdroid/index.html at main · Securebugs/RTUdroid · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
<!doctype html>
<html lang="en">
<head>
  <meta charset="utf-8" />
  <title>RTUdroid — File Viewer</title>
  <meta name="viewport" content="width=device-width,initial-scale=1" />
  <!-- Prism.js for syntax highlighting -->
  <link href="https://cdnjs.cloudflare.com/ajax/libs/prism/1.29.0/themes/prism.min.css" rel="stylesheet" />
  <style>
    body { font-family: Inter, system-ui, sans-serif; padding: 32px; background:#f7f8fb; color:#111; }
    .container { max-width: 1000px; margin: 0 auto; }
    pre { padding: 20px; border-radius: 8px; box-shadow: 0 2px 12px rgba(2,6,23,.06); overflow:auto; background:white; }
    header { display:flex; align-items:center; justify-content:space-between; margin-bottom:16px; flex-wrap:wrap; }
    h1 { font-size:20px; margin:0; }
    small { color:#666; }
    select { padding:6px 10px; border-radius:6px; }
  </style>
</head>
<body>
  <div class="container">
    <header>
      <div>
        <h1>RTUdroid — <small id="filename">app.py</small></h1>
        <small id="status">Loading file...</small>
      </div>
      <div>
        <label for="fileSelect">Choose file: </label>
        <select id="fileSelect"></select>
      </div>
    </header>

    <pre><code id="source" class="language-python"></code></pre>
  </div>

  <!-- Prism.js -->
  <script src="https://cdnjs.cloudflare.com/ajax/libs/prism/1.29.0/prism.min.js"></script>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/prism/1.29.0/components/prism-python.min.js"></script>

  <script>
    const user = "securebugs";      // your GitHub username
    const repo = "RTUdroid";        // repo name
    const branch = "main";          // confirmed default branch
    const apiUrl = `https://api.github.com/repos/${user}/${repo}/contents/`;

    const fileSelect = document.getElementById('fileSelect');
    const filenameDisplay = document.getElementById('filename');
    const status = document.getElementById('status');
    const source = document.getElementById('source');

    // Load file list from GitHub API
    fetch(apiUrl)
      .then(r => r.json())
      .then(files => {
        files.filter(f => f.type === "file").forEach(f => {
          let opt = document.createElement("option");
          opt.value = f.name;
          opt.textContent = f.name;
          if (f.name === "app.py") opt.selected = true;
          fileSelect.appendChild(opt);
        });
        loadFile(fileSelect.value);
      });

    // Load selected file
    function loadFile(file) {
      filenameDisplay.textContent = file;
      status.textContent = "Loading...";
      const rawUrl = `https://raw.githubusercontent.com/${user}/${repo}/${branch}/${file}`;
      fetch(rawUrl)
        .then(r => {
          if (!r.ok) throw new Error('HTTP ' + r.status);
          return r.text();
        })
        .then(text => {
          source.textContent = text;
          Prism.highlightElement(source);
          status.textContent = "Loaded from GitHub";
        })
        .catch(err => {
          source.textContent = "# Could not fetch file: " + err;
          status.textContent = "Failed to load file.";
        });
    }

    fileSelect.addEventListener("change", e => {
      loadFile(e.target.value);
    });
  </script>
</body>
</html>