reapplying previous code changes
This commit is contained in:
@ -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>
|
||||
|
||||
|
Reference in New Issue
Block a user