# custom-search-bar.blueprint
name: Custom Search Bar
description: Adds a search bar to the main panel for searching servers by name, UUID, or allocation.
# Define the script section
scripts:
- name: Add Search Bar to Main Panel
script: |
# Ensure you are in the correct directory
cd /var/www/pterodactyl
# Backup the original Blade file before modification
cp resources/views/admin/servers.blade.php resources/views/admin/servers.blade.php.bak
# Inject HTML for search bar into the Blade template
sed -i '/<div class="container">/a \
<input type="text" id="search-bar" placeholder="Enter a server name, UUID, or allocation to begin searching..." style="margin: 10px; padding: 5px; width: 100%;" />\
<div id="server-list"></div>' resources/views/admin/servers.blade.php
# Inject JavaScript for search functionality
sed -i '/<\/body>/i \
<script>\
document.getElementById("search-bar").addEventListener("input", function() {\
let searchQuery = this.value;\
fetch("/api/servers/search?query=" + encodeURIComponent(searchQuery))\
.then(response => response.json())\
.then(data => {\
let serverList = document.getElementById("server-list");\
serverList.innerHTML = "";\
data.forEach(server => {\
let serverRow = document.createElement("div");\
serverRow.className = "server-row";\
serverRow.innerHTML = `<div class="server-name">${server.name}</div>\
<div class="server-id">${server.id}</div>\
<div class="server-allocation">${server.allocation}</div>`;\
serverList.appendChild(serverRow);\
});\
});\
});\
</script>' resources/views/admin/servers.blade.php
# Optionally, inject CSS styling
echo '<style>\
.server-row {\
padding: 5px;\
border-bottom: 1px solid #ccc;\
}\
</style>' >> resources/views/admin/servers.blade.php