mroxq/proxy.html at main · python-mxnt/mroxq · 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
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
<!DOCTYPE html>
<html lang="en" class="bg-black text-white">
<head>
  <meta charset="UTF-8" />
  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
  <title>Proxy – mroxq</title>
  <!-- Tailwind CDN -->
  <script src="https://cdn.tailwindcss.com"></script>
  <script>
    tailwind.config = {
      theme: {
        extend: {
          colors: {
            primary: '#7c3aed',
            accent: '#a78bfa',
            glass: 'rgba(255,255,255,0.08)'
          },
          backgroundImage: theme => ({
            'hero-gradient': 'radial-gradient(at 50% 50%, rgba(124,58,237,0.3), transparent 70%)'
          })
        }
      }
    };
  </script>
  <style>
    .bg-futuristic { background: #000; background: radial-gradient(circle at 20% 30%, rgba(124,58,237,0.2), transparent 40%),
                               radial-gradient(circle at 80% 70%, rgba(124,58,237,0.15), transparent 45%),
                               radial-gradient(circle at 50% 80%, rgba(124,58,237,0.1), transparent 50%); }
    .glow-card { backdrop-filter: blur(12px); background: rgba(255,255,255,0.05); border: 1px solid rgba(255,255,255,0.1); }
    .glow-button { background: linear-gradient(135deg, #7c3aed, #a78bfa); box-shadow: 0 0 10px rgba(124,58,237,0.6); }
  </style>
</head>
<body class="bg-futuristic font-sans antialiased">
  <!-- Nav with Settings (reuse) -->
  <nav class="flex items-center justify-between p-4 glass rounded-t-lg shadow-md">
    <button id="backBtn" class="p-2 hover:bg-white/10 rounded mr-2 cursor-pointer" aria-label="Back"><svg xmlns="http://www.w3.org/2000/svg" class="h-6 w-6" fill="none" viewBox="0 0 24 24" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15 19l-7-7 7-7"/></svg></button>
    <button id="settingsBtn" class="p-2 hover:bg-white/10 rounded" aria-label="Settings">
      <svg xmlns="http://www.w3.org/2000/svg" class="h-6 w-6" fill="none" viewBox="0 0 24 24" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 8c-1.657 0-3 .895-3 2s1.343 2 3 2 3-.895 3-2-1.343-2-3-2z"/></svg>
    </button>
  </nav>

  <!-- Settings modal (same as other pages) -->
  <div id="settingsModal" class="fixed inset-0 flex items-center justify-center bg-black/50 hidden">
    <div class="bg-gray-900 p-6 rounded glass w-80">
      <h2 class="text-xl mb-4 text-accent">Accent Color</h2>
      <div class="grid grid-cols-2 gap-4">
        <button class="accent-option py-2 px-4 rounded" data-color="#3b82f6" style="background:#3b82f6">Blue</button>
        <button class="accent-option py-2 px-4 rounded" data-color="#8b5cf6" style="background:#8b5cf6">Purple</button>
        <button class="accent-option py-2 px-4 rounded" data-color="#ef4444" style="background:#ef4444">Red</button>
        <button class="accent-option py-2 px-4 rounded" data-color="#22c55e" style="background:#22c55e">Green</button>
      </div>
      <button id="closeSettings" class="mt-4 w-full py-2 bg-gray-800 rounded hover:bg-gray-700">Close</button>
    </div>
  </div>

  <!-- Main content -->
  <section class="flex flex-col items-center justify-center min-h-screen px-4 text-center relative overflow-hidden">
    <h1 class="text-5xl md:text-6xl font-extrabold mb-4 bg-clip-text text-transparent bg-gradient-to-r from-primary to-accent">Proxy</h1>
    <p class="text-lg md:text-xl text-gray-300 mb-8 max-w-2xl">A minimalist, high‑performance stealth proxy service.</p>
    <div class="flex w-full max-w-lg bg-glass rounded-full overflow-hidden shadow-lg">
      <input id="omnibox" type="text" placeholder="Enter URL or search..." class="flex-1 px-4 py-2 bg-transparent text-white placeholder-gray-400 focus:outline-none" />
      <button id="goBtn" class="px-6 py-2 bg-primary text-white hover:bg-accent transition-colors">Go</button>
    </div>
    <div class="flex space-x-2 mt-4">
      <button class="px-3 py-1 rounded-full bg-glass text-sm text-gray-300 hover:bg-primary hover:text-white">All</button>
      <button class="px-3 py-1 rounded-full bg-glass text-sm text-gray-300 hover:bg-primary hover:text-white">Proxy</button>
      <button class="px-3 py-1 rounded-full bg-glass text-sm text-gray-300 hover:bg-primary hover:text-white">Games</button>
    </div>
  </section>
  <!-- About:Blank launcher -->
  <button id="blankBtn" class="mt-4 px-4 py-2 bg-gray-700 rounded hover:bg-gray-600">Open in About:Blank</button>
  <!-- Iframe container (hidden until navigation) -->
  <div id="loader" class="hidden fixed inset-0 flex items-center justify-center bg-black/30">
  <div class="animate-spin rounded-full border-4 border-primary border-t-transparent w-12 h-12"></div>
</div>
<div id="proxyContainer" class="w-full h-3/4 mt-6 hidden">
    <iframe id="proxyIframe" src="" class="w-full h-full border border-gray-600 rounded"></iframe>
  </div>

  <script>
    // Theme handling (same as other pages)
    const savedAccent = localStorage.getItem('mroxq_accent');
    if (savedAccent) document.documentElement.style.setProperty('--accent', savedAccent);
    const settingsBtn = document.getElementById('settingsBtn');
    const backBtn = document.getElementById('backBtn');
    const modal = document.getElementById('settingsModal');
    const closeBtn = document.getElementById('closeSettings');
    settingsBtn.addEventListener('click', () => modal.classList.remove('hidden'));
    closeBtn.addEventListener('click', () => modal.classList.add('hidden'));
    backBtn.addEventListener('click', () => history.back());
    document.querySelectorAll('.accent-option').forEach(btn => {
      btn.addEventListener('click', () => {
        const color = btn.dataset.color;
        document.documentElement.style.setProperty('--accent', color);
        localStorage.setItem('mroxq_accent', color);
      });
    });

    // Navigation buttons (All / Proxy / Games)
    document.querySelectorAll('section button').forEach(btn => {
      btn.addEventListener('click', () => {
        const lbl = btn.textContent.trim().toLowerCase();
        if (lbl === 'all') location.href='index.html';
        else if (lbl === 'proxy') location.href='proxy.html';
        else if (lbl === 'games') location.href='games.html';
      });
    });
    // Proxy handling – route through Cloudflare Worker when URL is entered
    // Removed workerBase - using client-side fetch
    const omnibox = document.getElementById('omnibox');
    const goBtn = document.getElementById('goBtn');
    const iframe = document.getElementById('proxyIframe');
    const loader = document.getElementById('loader');
    function isURL(str) {
      try { new URL(str.startsWith('http') ? str : 'https://' + str); return true; } catch { return false; }
    }
    async function handleProxyClientSide(){
      const query = omnibox.value.trim();
      if (!query) return;
      let url;
      try { url = new URL(query.startsWith('http') ? query : 'https://' + query); }
      catch {
        const encoded = encodeURIComponent(query);
        window.open(`https://duckduckgo.com/?q=${encoded}`,'_blank');
        return;
      }

      // Show loader
      loader.classList.remove('hidden');

      try {
        const resp = await fetch(url.href, {mode:'cors', redirect:'follow'});
        const contentType = resp.headers.get('content-type') || '';
        if(resp.ok && contentType.includes('text/html')){
          const html = await resp.text();
          iframe.setAttribute('srcdoc', html);
          container.classList.remove('hidden');
        } else {
          window.open(url.href,'_blank');
        }
      } catch(e){
        window.open(url.href,'_blank');
      } finally {
        loader.classList.add('hidden');
      }
    }
    goBtn.addEventListener('click', handleProxyClientSide);
    omnibox.addEventListener('keypress', e => { if (e.key === 'Enter') handleProxyClientSide(); });


    // About:Blank mode – open full‑screen iframe without chrome
    const blankBtn = document.getElementById('blankBtn');
    blankBtn.addEventListener('click', () => {
      const srcdoc = iframe.getAttribute('srcdoc');
      const win = window.open('', '_blank');
      if (srcdoc) {
        win.document.write(`<!DOCTYPE html><html><head><title>Stealth</title><style>body,html{margin:0;height:100%;background:#000}</style></head><body>${srcdoc}</body></html>`);
      } else {
        const url = iframe.src || 'about:blank';
        win.document.write(`<!DOCTYPE html><html><head><title>Stealth</title><style>body,html{margin:0;height:100%;background:#000}</style></head><body><iframe src="${url}" style="border:none;width:100%;height:100%"></iframe></body></html>`);
      }
      win.document.close();
    });

    // Panic key – Esc redirects to google.com (optional clear storage)
    document.addEventListener('keydown', e => {
      if (e.key === 'Escape') {
        // Optionally clear storage – user can enable later; for now just redirect
        window.location.href = 'https://www.google.com';
      }
    });
  </script>
</body>
</html>