reapplying previous code changes

This commit is contained in:
MCHost
2025-06-26 18:07:51 -04:00
parent d9be0e61b4
commit 19d90de79a
4 changed files with 196 additions and 83 deletions

View File

@ -20,6 +20,7 @@
<body class="bg-gray-900 text-white overflow-x-hidden min-h-full flex flex-col">
<div id="app" class="flex-grow">
<!-- Login Page and Modals (unchanged) -->
<div id="loginPage" class="hidden fixed inset-0 bg-gray-900 flex items-center justify-center">
<div class="bg-gray-800 p-8 rounded-lg shadow-lg w-full max-w-md">
<h2 class="text-2xl font-bold mb-6 text-center">My-MC Panel</h2>
@ -144,6 +145,7 @@
</div>
</div>
<!-- Navigation (unchanged) -->
<nav class="bg-gray-800 p-4 shadow-lg">
<div class="container mx-auto flex justify-between items-center">
<h1 class="text-2xl font-bold">My-MC Panel</h1>
@ -157,6 +159,7 @@
</div>
</nav>
<!-- Main Content (unchanged except for Holesail Keys section) -->
<main id="mainContent" class="container mx-auto p-6">
<div class="bg-gray-800 p-6 rounded-lg shadow-lg mb-6" data-section="server-status">
<h2 class="text-xl font-semibold mb-4">Server Status</h2>
@ -285,6 +288,7 @@
</div>
</div>
<!-- Updated Holesail Keys Section -->
<div class="bg-gray-800 p-6 rounded-lg shadow-lg mb-6">
<div class="flex items-center justify-between mb-4">
<h2 class="text-xl font-semibold text-white">Holesail Keys</h2>
@ -346,16 +350,14 @@
<li>* Built for ANY application, Holesail supports both the TCP and UDP Protocols nativly.</li>
<li>* Expose single ports to the peer-to-peer network, unlike VPNs you never expose your entire local network.</li>
<li><BR>And so much more! With Holesail, the possiblities are endless!</li>
</ul>
</div>
<p class="text-gray-200 text-base leading-relaxed">
Built with security in mind, Holesail ensures all data is encrypted and never touches third-party servers.<BR>Connections are truly peer-to-peer, accessible only to those with whom you share your private key, providing both ease of use and robust security.<BR>Other peers cannot detect your activity or services.<BR>As an open-source tool, Holesail enables third-party services to integrate it, enhancing their security and connectivity.
</p>
<p class="text-gray-200 text-base leading-relaxed">
<BR>Your Public My-MC Ports are Holesail connections hosted on a separate server, not our Minecraft host.<BR>They use the same keys from the tutorial below. We hook 'em up at our jump host to go public. Pretty dope, right?
</p>
</p>
<p class="text-gray-200 text-base leading-relaxed">
<BR>Your Public My-MC Ports are Holesail connections hosted on a separate server, not our Minecraft host.<BR>They use the same keys from the tutorial below. We hook 'em up at our jump host to go public. Pretty dope, right?
</p>
</div>
<div class="bg-gray-700 p-4 rounded-md mb-6">
@ -378,21 +380,21 @@
</li>
</ul>
</li>
<li>Holesail will confirm the connection. Example output for your Minecraft server:
<li class="holesail-output-mobile-hidden">Holesail will confirm the connection. Example output for your Minecraft server:
<pre class="bg-gray-800 p-2 rounded mt-1 text-sm">
~ holesail <span id="tutorialHolesailHashOutput">Not Loaded</span>
┌───────────────────────────────────────────────────────────────────────────────────────────────────────────────────────┐
| |
| |
| Holesail TCP Client Started ⛵️ |
| Connection Mode: Private Connection String |
| Access application on http://127.0.0.1:25565/ |
| Connected to key: <span id="tutorialHolesailHashOutput2">Not Loaded</span> |
| NOTE: TREAT PRIVATE CONNECTION STRINGS HOW YOU WOULD TREAT SSH KEY, DO NOT SHARE IT WITH ANYONE YOU DO NOT TRUST |
| |
| |
| |
└───────────────────────────────────────────────────────────────────────────────────────────────────────────────────────┘
~ holesail <span id="tutorialHolesailHashOutput">Not Loaded</span>
┌───────────────────────────────────────────────────────────────────────────────────────────────────────────────────────┐
| |
| |
| Holesail TCP Client Started ⛵️ |
| Connection Mode: Private Connection String |
| Access application on http://127.0.0.1:25565/ |
| Connected to key: <span id="tutorialHolesailHashOutput2">Not Loaded</span> |
| NOTE: TREAT PRIVATE CONNECTION STRINGS HOW YOU WOULD TREAT SSH KEY, DO NOT SHARE IT WITH ANYONE YOU DO NOT TRUST |
| |
| |
| |
└───────────────────────────────────────────────────────────────────────────────────────────────────────────────────────┘
</pre>
</li>
<li>To share the port over your internet IP as an open port, add the <code class="bg-gray-800 px-1 rounded">--host 0.0.0.0</code> switch:
@ -412,6 +414,19 @@
</div>
<script>
// Debounce function to prevent multiple triggers on mobile
function debounce(func, wait) {
let timeout;
return function executedFunction(...args) {
const later = () => {
clearTimeout(timeout);
func(...args);
};
clearTimeout(timeout);
timeout = setTimeout(later, wait);
};
}
// Function to update tutorial spans when key display spans are populated
function updateTutorialSpans() {
const holesailHash = document.getElementById('holesailHash').textContent;
@ -435,42 +450,58 @@
observer.observe(span, { childList: true, characterData: true, subtree: true });
});
// Ensure notification is hidden on page load
document.addEventListener('DOMContentLoaded', () => {
const notification = document.getElementById('copyNotification');
notification.classList.add('hidden');
});
// Toggle tutorial section visibility
document.getElementById('toggleTutorial').addEventListener('click', () => {
const tutorialSection = document.getElementById('tutorialSection');
tutorialSection.classList.toggle('hidden');
});
// Copy summarized tutorial in Markdown and show success message
document.getElementById('copyTutorial').addEventListener('click', () => {
// Copy summarized tutorial in Markdown with debounced event listener
document.getElementById('copyTutorial').addEventListener('click', debounce((event) => {
event.preventDefault(); // Prevent default touch behavior
if (!event.isTrusted) return; // Ensure user-initiated action
const holesailHash = document.getElementById('holesailHash').textContent;
const markdownTutorial = `# Join My Minecraft Server with Holesail!
Holesail is a secure, peer-to-peer tool that lets you connect to my server without public IPs.
Holesail is a secure, peer-to-peer tool that lets you connect to my server without public IPs.
1. **Install Node.js**: Download and install from [nodejs.org](https://nodejs.org/).
2. **Install Holesail**: Open a terminal and run:
\`\`\`bash
npm i holesail@2.1.0
\`\`\`
3. **Connect to the server**: Use this command with the key:
\`\`\`bash
holesail ${holesailHash}
\`\`\`
4. **Join in Minecraft**: Once Holesail confirms the connection, connect to \`127.0.0.1:25565\` in Minecraft.
1. **Install Node.js**: Download and install from [nodejs.org](https://nodejs.org/).
2. **Install Holesail**: Open a terminal and run:
\`\`\`bash
npm i holesail@2.1.0
\`\`\`
3. **Connect to the server**: Use this command with the key:
\`\`\`bash
holesail ${holesailHash}
\`\`\`
4. **Join in Minecraft**: Once Holesail confirms the connection, connect to \`127.0.0.1:25565\` in Minecraft.
**Note**: Keep the key private, like an SSH key. No public IPs needed—it's all peer-to-peer!`;
navigator.clipboard.writeText(markdownTutorial);
**Note**: Keep the key private, like an SSH key. No public IPs needed—it's all peer-to-peer!`;
// Show success message
const notification = document.getElementById('copyNotification');
notification.classList.remove('hidden');
// Hide success message after 3 seconds
setTimeout(() => {
notification.classList.add('hidden');
}, 3000);
});
// Check if Clipboard API is supported
if (navigator.clipboard && navigator.clipboard.writeText) {
navigator.clipboard.writeText(markdownTutorial).then(() => {
const notification = document.getElementById('copyNotification');
notification.classList.remove('hidden');
setTimeout(() => {
notification.classList.add('hidden');
}, 3000);
}).catch(err => {
console.error('Failed to copy tutorial: ', err);
alert('Failed to copy tutorial to clipboard. Please copy it manually.');
});
} else {
// Fallback for unsupported browsers
alert('Clipboard API not supported. Please copy the tutorial manually.');
}
}, 300)); // 300ms debounce
</script>
</div>