Make the startDiscovery button work.
This commit is contained in:
Raphaël Numbus
@@ -1,5 +1,6 @@
|
||||
/config/
|
||||
web/ux/
|
||||
test*
|
||||
example*
|
||||
.DS_Store
|
||||
.env
|
||||
+2
-2
@@ -776,8 +776,8 @@ hierarchy_preparation
|
||||
until [[ -e web/signals/hw_detection_ready ]]; do
|
||||
sleep 5
|
||||
done
|
||||
LIVE_TARGET_IP="$(yq -r '.live_target_ip' ${LIVE_DATA_FILE})"
|
||||
LIVE_TARGET_PASSWORD="$(yq -r '.live_target_password' ${LIVE_DATA_FILE})"
|
||||
LIVE_TARGET_IP="$(yq -r '.live_target.ip' ${LIVE_DATA_FILE})"
|
||||
LIVE_TARGET_PASSWORD="$(yq -r '.live_target.password' ${LIVE_DATA_FILE})"
|
||||
until [[ -e web/signals/configuration_ready ]]; do
|
||||
sleep 5
|
||||
done
|
||||
|
||||
@@ -44,9 +44,6 @@ class BridgeHandler(http.server.SimpleHTTPRequestHandler):
|
||||
post_data = self.rfile.read(content_length)
|
||||
|
||||
if self.path == '/discovery':
|
||||
# Store secrets in memory-backed filesystem
|
||||
# We write to CONFIG_DIR so deploy.sh can find it easily
|
||||
os.makedirs(CONFIG_DIR, exist_ok=True)
|
||||
with open(os.path.join(CONFIG_DIR, "live.yaml"), "wb") as f:
|
||||
f.write(post_data)
|
||||
self.send_response(200)
|
||||
|
||||
+66
-75
@@ -29,9 +29,8 @@
|
||||
formData: {
|
||||
1: { language: 'French', country: 'France', timeZone: 'Europe/Paris' },
|
||||
2: { deviceType: '' },
|
||||
3: { deploymentMode: '' },
|
||||
4: { replicationHardware: '', replicationStrategy: '', replicationSecrets: '' },
|
||||
5: { liveIp: '', livePassword: '' },
|
||||
3: { deploymentMode: '', gitUrl: '', gitUsername: '', gitPassword: '' },
|
||||
4: { liveIp: '', livePassword: '' },
|
||||
},
|
||||
isStepValid() {
|
||||
const currentStepData = this.formData[this.step];
|
||||
@@ -39,7 +38,7 @@
|
||||
return Object.values(currentStepData).every(value => !!value);
|
||||
},
|
||||
goToPrevStep() {
|
||||
if (this.step === 5 && this.formData[3].deploymentMode === 'interactive') {
|
||||
if (this.step === 4 && this.formData[3].deploymentMode === 'interactive') {
|
||||
this.step--;
|
||||
}
|
||||
this.step--;
|
||||
@@ -50,9 +49,46 @@
|
||||
}
|
||||
this.step++;
|
||||
},
|
||||
startDiscovery() {
|
||||
console.log("Discovery started with:", JSON.parse(JSON.stringify(this.formData)));
|
||||
// Add your bridge communication logic here
|
||||
async startDiscovery() {
|
||||
const data = JSON.parse(JSON.stringify(this.formData));
|
||||
console.log("Discovery started with:", data);
|
||||
|
||||
const payload = {
|
||||
internationalisation: {
|
||||
language: data[1].language,
|
||||
country: data[1].country,
|
||||
time_zone: data[1].timeZone
|
||||
},
|
||||
device: {
|
||||
type: data[2].deviceType
|
||||
},
|
||||
deployment: {
|
||||
mode: data[3].deploymentMode,
|
||||
git_url: data[3].gitUrl || '',
|
||||
git_username: data[3].gitUsername || '',
|
||||
git_password: data[3].gitPassword || ''
|
||||
},
|
||||
live_target: {
|
||||
ip: data[4].liveIp,
|
||||
password: data[4].livePassword
|
||||
}
|
||||
};
|
||||
|
||||
try {
|
||||
const response = await fetch('/discovery', {
|
||||
method: 'POST',
|
||||
headers: { 'Content-Type': 'text/yaml' },
|
||||
body: jsyaml.dump(payload)
|
||||
});
|
||||
|
||||
if (response.ok) {
|
||||
console.log("Discovery signal sent successfully.");
|
||||
} else {
|
||||
console.error("Server returned an error:", response.statusText);
|
||||
}
|
||||
} catch (error) {
|
||||
console.error("Network error during discovery:", error);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -61,8 +97,8 @@
|
||||
<nav class="bg-[#1e293b] border border-slate-700 rounded-2xl relative">
|
||||
<div class="mx-auto relative flex h-16 items-center justify-between">
|
||||
<div class="absolute inset-y-0 left-0 flex items-center">
|
||||
<a href="https://numbus.eu"><img class="w-auto h-10 pr-5 pl-8" src="/media/logo.png" aria-label="The numbus logo"></a>
|
||||
<a class="font-bold text-2xl tracking-tight bg-gradient-to-r from-sky-400 to-fuchsia-500 bg-clip-text text-transparent uppercase" href="https://numbus.eu">NUMBUS</a>
|
||||
<a target="_blank" href="https://numbus.eu"><img class="w-auto h-10 pr-5 pl-8" src="/media/logo.png" aria-label="The numbus logo"></a>
|
||||
<a class="font-bold text-2xl tracking-tight bg-gradient-to-r from-sky-400 to-fuchsia-500 bg-clip-text text-transparent uppercase" target="_blank" href="https://numbus.eu">NUMBUS</a>
|
||||
</div>
|
||||
<div class="flex flex-1 items-center justify-center">
|
||||
<h1 class="sm:text-2xl sm:pr-20 lg:pr-0 text-xl text-slate-200 font-bold flex items-center">Step 1 - Preparation</h1>
|
||||
@@ -70,8 +106,8 @@
|
||||
<div class="absolute inset-y-0 right-0 flex items-center my-auto">
|
||||
<button class="h-auto mdi mdi-menu text-slate-100 text-2xl sm:hidden pr-8" aria-label="Menu with links"></button>
|
||||
<button class="h-auto mdi mdi-brightness-2 text-slate-100 text-2xl hidden sm:block sm:text-3xl pr-5" aria-label="Change theme"></button>
|
||||
<a href="https://gittea.dev/numbus" class="h-auto mdi mdi-source-repository text-slate-100 text-2xl hidden sm:block sm:text-3xl pr-5" aria-label="See the source code on Gitea"></a>
|
||||
<a href="https://gittea.dev/numbus" class="h-auto mdi mdi-text-box-search text-slate-100 text-2xl hidden sm:block sm:text-3xl pr-8" aria-label="See the full documentation"></a>
|
||||
<a target="_blank" href="https://gittea.dev/numbus" class="h-auto mdi mdi-source-repository text-slate-100 text-2xl hidden sm:block sm:text-3xl pr-5" aria-label="See the source code on Gitea"></a>
|
||||
<a target="_blank" href="https://gittea.dev/numbus" class="h-auto mdi mdi-text-box-search text-slate-100 text-2xl hidden sm:block sm:text-3xl pr-8" aria-label="See the full documentation"></a>
|
||||
</div>
|
||||
</div>
|
||||
</nav>
|
||||
@@ -169,6 +205,9 @@
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Step 1: Language & Region -->
|
||||
|
||||
|
||||
|
||||
<!-- Device Type -->
|
||||
<div x-show="step === 2" x-cloak class="pl-3 pr-3">
|
||||
@@ -270,6 +309,9 @@
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Device Type -->
|
||||
|
||||
|
||||
|
||||
<!-- Deployment Mode -->
|
||||
<div x-show="step === 3" x-cloak class="pl-3 pr-3">
|
||||
@@ -325,81 +367,29 @@
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Deployment Mode -->
|
||||
|
||||
|
||||
<!-- Replication Mode -->
|
||||
<div class="max-h-[calc(100vh-17rem)] overflow-y-auto" x-show="step === 4" x-cloak class="pl-3 pr-3">
|
||||
<h2 class="p-5 pt-6 text-4xl font-bold text-sky-400">Replication Mode</h2>
|
||||
<div class="p-0.5 bg-slate-700 rounded-3xl w-[97%] mx-auto"></div>
|
||||
<p class="p-5 text-xl text-slate-300">Select your <b>preferred</b> replication mode. It compares the current deployment to the old one.</p>
|
||||
<h3 class="text-xl font-semibold text-slate-300 text-center pb-3">Hardware</h3>
|
||||
<div class="pl-5 pr-5 grid grid-cols-2 gap-4">
|
||||
<button @click="formData[4].replicationHardware = 'exact_same'" :class="formData[4].replicationHardware === 'exact_same' ? 'bg-fuchsia-600/20 border-fuchsia-500' : 'bg-slate-900 border-slate-700'" class="flex items-center gap-4 p-6 border rounded-2xl transition-all text-left hover:bg-fuchsia-600/20 hover:border-fuchsia-500">
|
||||
<i class="mdi mdi-check-network text-5xl flex-shrink-0"></i>
|
||||
<div>
|
||||
<span class="font-bold text-2xl mb-1">Same hardware</span>
|
||||
<p class="text-sm transition-colors">The hardware listed in the configuration is exactly the same as the hardware on the machine you want to deploy.</p>
|
||||
</div>
|
||||
</button>
|
||||
<button @click="formData[4].replicationHardware = 'different'" :class="formData[4].replicationHardware === 'different' ? 'bg-fuchsia-600/20 border-fuchsia-500' : 'bg-slate-900 border-slate-700'" class="flex items-center gap-4 p-6 border rounded-2xl transition-all text-left hover:bg-fuchsia-600/20 hover:border-fuchsia-500">
|
||||
<i class="mdi mdi-close-network text-5xl flex-shrink-0"></i>
|
||||
<div>
|
||||
<span class="font-bold text-2xl mb-1">Different hardware</span>
|
||||
<p class="text-sm transition-colors">The hardware listed in the configuration is different compared to the hardware on the machine you want to deploy.</p>
|
||||
</div>
|
||||
</button>
|
||||
</div>
|
||||
<h3 class="text-xl font-semibold text-center text-slate-300 pb-3 pt-5">Strategy</h3>
|
||||
<div class="pl-5 pr-5 grid grid-cols-2 gap-4">
|
||||
<button @click="formData[4].replicationStrategy = 'exact_same'" :class="formData[4].replicationStrategy === 'exact_same' ? 'bg-fuchsia-600/20 border-fuchsia-500' : 'bg-slate-900 border-slate-700'" class="flex items-center gap-4 p-6 border rounded-2xl transition-all text-left hover:bg-fuchsia-600/20 hover:border-fuchsia-500">
|
||||
<i class="mdi mdi-file-check text-5xl flex-shrink-0"></i>
|
||||
<div>
|
||||
<span class="font-bold text-2xl mb-1">Same configuration</span>
|
||||
<p class="text-sm transition-colors">Re-deploy the exact same configuration.</p>
|
||||
</div>
|
||||
</button>
|
||||
<button @click="formData[4].replicationStrategy = 'with_tweaks'" :class="formData[4].replicationStrategy=== 'with_tweaks' ? 'bg-fuchsia-600/20 border-fuchsia-500' : 'bg-slate-900 border-slate-700'" class="flex items-center gap-4 p-6 border rounded-2xl transition-all text-left hover:bg-fuchsia-600/20 hover:border-fuchsia-500">
|
||||
<i class="mdi mdi-file-cog text-5xl flex-shrink-0"></i>
|
||||
<div>
|
||||
<span class="font-bold text-2xl mb-1">With tweaks</span>
|
||||
<p class="text-sm transition-colors">Use the configuration as a base and tweak the desired settings.</p>
|
||||
</div>
|
||||
</button>
|
||||
</div>
|
||||
<h3 class="text-xl font-semibold text-center text-slate-300 pt-5 pb-3">Secrets</h3>
|
||||
<div class="pl-5 pr-5 grid grid-cols-2 gap-4">
|
||||
<button @click="formData[4].replicationSecrets = 'exact_same'" :class="formData[4].replicationSecrets === 'exact_same' ? 'bg-fuchsia-600/20 border-fuchsia-500' : 'bg-slate-900 border-slate-700'" class="flex items-center gap-4 p-6 border rounded-2xl transition-all text-left hover:bg-fuchsia-600/20 hover:border-fuchsia-500">
|
||||
<i class="mdi mdi-key-star text-5xl flex-shrink-0"></i>
|
||||
<div>
|
||||
<span class="font-bold text-2xl mb-1">Same secrets</span>
|
||||
<p class="text-sm transition-colors">Re-use the secrets in the repository.</p>
|
||||
</div>
|
||||
</button>
|
||||
<button @click="formData[4].replicationSecrets = 'regenerate'" :class="formData[4].replicationSecrets === 'regenerate' ? 'bg-fuchsia-600/20 border-fuchsia-500' : 'bg-slate-900 border-slate-700'" class="flex items-center gap-4 p-6 border rounded-2xl transition-all text-left hover:bg-fuchsia-600/20 hover:border-fuchsia-500">
|
||||
<i class="mdi mdi-key-remove text-5xl flex-shrink-0"></i>
|
||||
<div>
|
||||
<span class="font-bold text-2xl mb-1">New secrets</span>
|
||||
<p class="text-sm transition-colors">Provide and auto-generate new secrets.</p>
|
||||
</div>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Live Setup -->
|
||||
<div x-show="step === 5" x-cloak class="pl-3 pr-3">
|
||||
<div x-show="step === 4" x-cloak class="pl-3 pr-3">
|
||||
<h2 class="p-5 pt-6 text-4xl font-bold text-sky-400">Live Setup</h2>
|
||||
<div class="p-0.5 bg-slate-700 rounded-3xl w-[97%] mx-auto"></div>
|
||||
<p class="p-5 pb-10 text-xl text-slate-300">Provide the <b>necessary information</b> to connect to the device. It needs to be in a <b>NixOS live environment</b>.</p>
|
||||
<div class="flex flex-col items-center justify-center">
|
||||
<div class="p-6 space-y-2">
|
||||
<span class="text-base font-bold text-center text-slate-300 uppercase">Live Target IP Address</span>
|
||||
<input x-model="formData[5].liveIp" class="w-full bg-slate-900 border border-slate-700 rounded-xl p-4 focus:ring-2 focus:ring-fuchsia-500 outline-none placeholder:text-slate-500/40" type="text" placeholder="192.168.1.100">
|
||||
<input x-model="formData[4].liveIp" class="w-full bg-slate-900 border border-slate-700 rounded-xl p-4 focus:ring-2 focus:ring-fuchsia-500 outline-none placeholder:text-slate-500/40" type="text" placeholder="192.168.1.100">
|
||||
</div>
|
||||
<div class="p-6 space-y-2">
|
||||
<span class="text-base font-bold text-center text-slate-300 uppercase">Temporary Password</span>
|
||||
<input x-model="formData[5].livePassword" class="w-full bg-slate-900 border border-slate-700 rounded-xl p-4 focus:ring-2 focus:ring-fuchsia-500 outline-none placeholder:text-slate-500/40" type="password" placeholder="••••••••">
|
||||
<input x-model="formData[4].livePassword" class="w-full bg-slate-900 border border-slate-700 rounded-xl p-4 focus:ring-2 focus:ring-fuchsia-500 outline-none placeholder:text-slate-500/40" type="password" placeholder="••••••••">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Live Setup -->
|
||||
|
||||
|
||||
|
||||
<!-- Footer -->
|
||||
<div class="bg-[#1e293b] border-t bottom-0 w-full rounded-3xl absolute border-slate-700 p-6 flex items-center justify-between">
|
||||
@@ -407,22 +397,23 @@
|
||||
<button @click="goToPrevStep()" x-show="step > 1" x-cloak class="px-8 py-3 text-slate-400 font-bold rounded-xl hover:text-white transition-colors duration-200">Back</button>
|
||||
|
||||
<button @click="goToNextStep()"
|
||||
x-show="step != 5"
|
||||
x-show="step != 4"
|
||||
:disabled="!isStepValid()"
|
||||
class="px-10 py-3 text-white font-bold rounded-xl scale-100 transition duration-200 ease-in bg-gradient-to-r from-fuchsia-500 via-fuchsia-600 to-fuchsia-700 hover:scale-105 hover:bg-gradient-to-br shadow-lg shadow-fuchsia-500/30 dark:shadow-lg dark:shadow-fuchsia-800/80 disabled:opacity-50 disabled:cursor-not-allowed disabled:hover:scale-100">Continue</button>
|
||||
|
||||
<button
|
||||
@click="startDiscovery()"
|
||||
x-show="step === 5"
|
||||
x-show="step === 4"
|
||||
x-cloak
|
||||
:disabled="!isStepValid()"
|
||||
class="px-10 py-3 text-white font-bold rounded-xl scale-100 transition duration-200 ease-in bg-gradient-to-r from-fuchsia-500 via-fuchsia-600 to-fuchsia-700 hover:scale-105 hover:bg-gradient-to-br shadow-lg shadow-fuchsia-500/30 dark:shadow-lg dark:shadow-fuchsia-800/80 disabled:opacity-50 disabled:cursor-not-allowed disabled:hover:scale-100">Start Discovery
|
||||
<svg aria-hidden="true" class="w-4 h-4 text-neutral-tertiary animate-spin fill-brand me-2" viewBox="0 0 100 101" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M100 50.5908C100 78.2051 77.6142 100.591 50 100.591C22.3858 100.591 0 78.2051 0 50.5908C0 22.9766 22.3858 0.59082 50 0.59082C77.6142 0.59082 100 22.9766 100 50.5908ZM9.08144 50.5908C9.08144 73.1895 27.4013 91.5094 50 91.5094C72.5987 91.5094 90.9186 73.1895 90.9186 50.5908C90.9186 27.9921 72.5987 9.67226 50 9.67226C27.4013 9.67226 9.08144 27.9921 9.08144 50.5908Z" fill="currentColor"/>
|
||||
<path d="M93.9676 39.0409C96.393 38.4038 97.8624 35.9116 97.0079 33.5539C95.2932 28.8227 92.871 24.3692 89.8167 20.348C85.8452 15.1192 80.8826 10.7238 75.2124 7.41289C69.5422 4.10194 63.2754 1.94025 56.7698 1.05124C51.7666 0.367541 46.6976 0.446843 41.7345 1.27873C39.2613 1.69328 37.813 4.19778 38.4501 6.62326C39.0873 9.04874 41.5694 10.4717 44.0505 10.1071C47.8511 9.54855 51.7191 9.52689 55.5402 10.0491C60.8642 10.7766 65.9928 12.5457 70.6331 15.2552C75.2735 17.9648 79.3347 21.5619 82.5849 25.841C84.9175 28.9121 86.7997 32.2913 88.1811 35.8758C89.083 38.2158 91.5421 39.6781 93.9676 39.0409Z" fill="currentFill"/>
|
||||
<path d="M100 50.5908C100 78.2051 77.6142 100.591 50 100.591C22.3858 100.591 0 78.2051 0 50.5908C0 22.9766 22.3858 0.59082 50 0.59082C77.6142 0.59082 100 22.9766 100 50.5908ZM9.08144 50.5908C9.08144 73.1895 27.4013 91.5094 50 91.5094C72.5987 91.5094 90.9186 73.1895 90.9186 50.5908C90.9186 27.9921 72.5987 9.67226 50 9.67226C27.4013 9.67226 9.08144 27.9921 9.08144 50.5908Z" fill="currentColor"/>
|
||||
<path d="M93.9676 39.0409C96.393 38.4038 97.8624 35.9116 97.0079 33.5539C95.2932 28.8227 92.871 24.3692 89.8167 20.348C85.8452 15.1192 80.8826 10.7238 75.2124 7.41289C69.5422 4.10194 63.2754 1.94025 56.7698 1.05124C51.7666 0.367541 46.6976 0.446843 41.7345 1.27873C39.2613 1.69328 37.813 4.19778 38.4501 6.62326C39.0873 9.04874 41.5694 10.4717 44.0505 10.1071C47.8511 9.54855 51.7191 9.52689 55.5402 10.0491C60.8642 10.7766 65.9928 12.5457 70.6331 15.2552C75.2735 17.9648 79.3347 21.5619 82.5849 25.841C84.9175 28.9121 86.7997 32.2913 88.1811 35.8758C89.083 38.2158 91.5421 39.6781 93.9676 39.0409Z" fill="currentFill"/>
|
||||
</svg>
|
||||
</button>
|
||||
</div>
|
||||
<!-- Footer -->
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
Reference in New Issue
Block a user