wizard spa
This commit is contained in:
shocknet-justin
parent
3ab8898b21
commit
e3487e8e46
6 changed files with 281 additions and 372 deletions
|
|
@ -1,146 +0,0 @@
|
||||||
<!DOCTYPE html>
|
|
||||||
<html>
|
|
||||||
|
|
||||||
<head>
|
|
||||||
<meta charset="UTF-8" />
|
|
||||||
<title></title>
|
|
||||||
<meta charset="UTF-8" />
|
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
|
||||||
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Montserrat" />
|
|
||||||
<link rel="stylesheet" href="css/styles.css" />
|
|
||||||
<link rel="stylesheet" href="css/backup.css" />
|
|
||||||
<!-- HTML Meta Tags -->
|
|
||||||
<title>Lightning.Pub</title>
|
|
||||||
<meta name="description" content="Lightning for Everyone" />
|
|
||||||
<link rel="icon" type="image/png" href="img/pub_logo.png" />
|
|
||||||
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
|
|
||||||
</head>
|
|
||||||
|
|
||||||
<body>
|
|
||||||
<header>
|
|
||||||
<img src="img/pub_logo.png" width="38px" height="auto" alt="Lightning Pub logo" />
|
|
||||||
<img src="img/LightningPub.png" height="33px" alt="Lightning Pub logo" />
|
|
||||||
</header>
|
|
||||||
|
|
||||||
<main>
|
|
||||||
<section class="setup-header">
|
|
||||||
<button class="icon-button back-button" onclick="history.back()">
|
|
||||||
<img src="img/back.svg" alt="" />
|
|
||||||
</button>
|
|
||||||
<h2>Choose a Recovery Method</h2>
|
|
||||||
<p class="header-title">
|
|
||||||
<span style="font-weight: bold">New Node! 🎉</span> It's important
|
|
||||||
to backup your keys.
|
|
||||||
</p>
|
|
||||||
</section>
|
|
||||||
|
|
||||||
<div class="line"></div>
|
|
||||||
|
|
||||||
<section class="setup-content">
|
|
||||||
<div class="description-box">
|
|
||||||
<div class="description">
|
|
||||||
In addition to your seed phrase, you also need channel details to recover funds should your node experience a
|
|
||||||
hardware failure.
|
|
||||||
</div>
|
|
||||||
<br />
|
|
||||||
<div class="description">
|
|
||||||
It's important always to have the latest version of this file. Fortunately, it's small enough to automatically
|
|
||||||
store on the Nostr relay.
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="warning-text">
|
|
||||||
If you did not choose the developers relay, be sure your relay has
|
|
||||||
adequate storage policies to hold NIP78 events.
|
|
||||||
</div>
|
|
||||||
<div class="checkbox-container">
|
|
||||||
<div class="checkbox" style="margin-top: 12px">
|
|
||||||
<input type="radio" id="backup" name="backup-option" />
|
|
||||||
<label for="backup">
|
|
||||||
Encrypted Backup to Nostr Relay
|
|
||||||
</label>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="checkbox-container">
|
|
||||||
<div class="checkbox manual-checkbox" style="margin-top: 12px">
|
|
||||||
<input type="radio" id="manual-backup" name="backup-option" />
|
|
||||||
<label for="manual-backup">
|
|
||||||
DO NOT store on relay (Manual Backups)
|
|
||||||
</label>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div>
|
|
||||||
<p id="errorText" style="color:red"></p>
|
|
||||||
</div>
|
|
||||||
<button class="push-button hidden-button" style="margin-top: 60px;" id="next-button">
|
|
||||||
Next
|
|
||||||
</button>
|
|
||||||
</section>
|
|
||||||
</main>
|
|
||||||
|
|
||||||
<footer>
|
|
||||||
<div class="footer-text">
|
|
||||||
<div>By proceeding you acknowledge that this is</div>
|
|
||||||
<div>bleeding-edge software, and agree to the providers</div>
|
|
||||||
<div>
|
|
||||||
<span style="color: #c434e0">terms</span> regarding any services
|
|
||||||
herein.
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="line"></div>
|
|
||||||
<a href="https://docs.shock.network" class="marked need-help">Need Help?</a>
|
|
||||||
</footer>
|
|
||||||
|
|
||||||
<script src="js/backup.js"></script>
|
|
||||||
<script>
|
|
||||||
fetch("/wizard/service-state").then(res => res.json()).then(state => {
|
|
||||||
if (state.push_backups_to_nostr) {
|
|
||||||
document.getElementById('backup').checked = true;
|
|
||||||
} else {
|
|
||||||
document.getElementById('manual-backup').checked = true;
|
|
||||||
}
|
|
||||||
document.getElementById('next-button').classList.remove('hidden-button');
|
|
||||||
});
|
|
||||||
|
|
||||||
const sendConfig = async () => {
|
|
||||||
const req = {
|
|
||||||
source_name: localStorage.getItem("wizard/nodeName"),
|
|
||||||
relay_url: localStorage.getItem("wizard/relayUrl"),
|
|
||||||
automate_liquidity: localStorage.getItem("wizard/liquidity") === 'automate',
|
|
||||||
push_backups_to_nostr: localStorage.getItem("wizard/backup") === 'backup',
|
|
||||||
}
|
|
||||||
const res = await fetch("/wizard/config", {
|
|
||||||
method: 'POST',
|
|
||||||
headers: {
|
|
||||||
'Content-Type': 'application/json',
|
|
||||||
},
|
|
||||||
body: JSON.stringify(req)
|
|
||||||
})
|
|
||||||
if (res.status !== 200) {
|
|
||||||
document.getElementById('errorText').innerText = "failed to start service"
|
|
||||||
return
|
|
||||||
}
|
|
||||||
const j = await res.json()
|
|
||||||
if (j.status !== 'OK') {
|
|
||||||
document.getElementById('errorText').innerText = "failed to start service" + j.reason
|
|
||||||
return
|
|
||||||
}
|
|
||||||
location.href = 'connect.html'
|
|
||||||
}
|
|
||||||
document.getElementById("next-button").onclick = (e) => {
|
|
||||||
const backup = document.getElementById('backup').checked
|
|
||||||
const manual = document.getElementById('manual-backup').checked
|
|
||||||
if (!backup && !manual) {
|
|
||||||
document.getElementById('errorText').innerText = 'Please select an option'
|
|
||||||
return
|
|
||||||
}
|
|
||||||
if (backup) {
|
|
||||||
localStorage.setItem('wizard/backup', 'backup')
|
|
||||||
} else {
|
|
||||||
localStorage.setItem('wizard/backup', 'manual')
|
|
||||||
}
|
|
||||||
sendConfig()
|
|
||||||
}
|
|
||||||
</script>
|
|
||||||
</body>
|
|
||||||
|
|
||||||
</html>
|
|
||||||
|
|
@ -8,6 +8,8 @@
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||||
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Montserrat" />
|
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Montserrat" />
|
||||||
<link rel="stylesheet" href="css/styles.css" />
|
<link rel="stylesheet" href="css/styles.css" />
|
||||||
|
<link rel="stylesheet" href="css/liquidity.css" />
|
||||||
|
<link rel="stylesheet" href="css/backup.css" />
|
||||||
<!-- HTML Meta Tags -->
|
<!-- HTML Meta Tags -->
|
||||||
<title>Lightning.Pub</title>
|
<title>Lightning.Pub</title>
|
||||||
<meta name="description" content="Lightning for Everyone" />
|
<meta name="description" content="Lightning for Everyone" />
|
||||||
|
|
@ -21,41 +23,144 @@
|
||||||
</header>
|
</header>
|
||||||
|
|
||||||
<main>
|
<main>
|
||||||
<section class="setup-header">
|
<section id="page-node">
|
||||||
<h2>Setup your Pub</h2>
|
<div class="setup-header">
|
||||||
<p class="header-title">
|
<h2>Setup your Pub</h2>
|
||||||
</p>
|
<p class="header-title">
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="line"></div>
|
||||||
|
|
||||||
|
<div class="setup-content">
|
||||||
|
<div class="input-group">
|
||||||
|
<span>Give this node a name that wallet users will see:</span>
|
||||||
|
<input type="text" placeholder="Nodey McNodeFace" value="" style="width: 100%" id="nodeName" />
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="input-group" style="margin-top: 38px">
|
||||||
|
<span>If you want to use a specific Nostr relay, enter it now:</span>
|
||||||
|
<input type="text" placeholder="wss://relay.lightning.pub" style="width: 100%" id="relayUrl" />
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="checkbox" style="margin-top: 12px">
|
||||||
|
<input type="checkbox" id="customCheckbox" />
|
||||||
|
<div class="checkbox-shape"></div>
|
||||||
|
<label for="customCheckbox">
|
||||||
|
Use the default managed relay service and auto-pay 1000 sats
|
||||||
|
per month to support developers
|
||||||
|
</label>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div>
|
||||||
|
<p id="errorText" style="color:red"></p>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<button class="push-button" style="margin-top: 60px" id="liquidityBtn">
|
||||||
|
Next
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
</section>
|
</section>
|
||||||
|
|
||||||
<div class="line"></div>
|
<section id="page-liquidity" style="display: none;">
|
||||||
|
<div class="setup-header">
|
||||||
<section class="setup-content">
|
<button class="icon-button back-button" id="back-to-node">
|
||||||
<div class="input-group">
|
<img src="img/back.svg" alt="" />
|
||||||
<span>Give this node a name that wallet users will see:</span>
|
</button>
|
||||||
<input type="text" placeholder="Nodey McNodeFace" value="" style="width: 100%" id="nodeName" />
|
<h2>Manage Node Liquidity</h2>
|
||||||
|
<p class="header-title">
|
||||||
|
How do you want to manage Lightning channels?
|
||||||
|
</p>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="input-group" style="margin-top: 38px">
|
<div class="line"></div>
|
||||||
<span>If you want to use a specific Nostr relay, enter it now:</span>
|
|
||||||
<input type="text" placeholder="wss://relay.lightning.pub" style="width: 100%" id="relayUrl" />
|
<div class="setup-content">
|
||||||
|
<div class="checkbox" style="margin-top: 60px">
|
||||||
|
<input type="radio" id="automate" name="service" data-group="service" />
|
||||||
|
<label for="automate" class="automate">
|
||||||
|
Use Automation Service
|
||||||
|
<div class="question-box">
|
||||||
|
<button class="icon-button" id="show-question">
|
||||||
|
<img src="img/question.svg" />
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
<div class="question-content" id="question-content">
|
||||||
|
Automation helps reduce the fees you pay by trusting peers temporarily until your node balance is sufficient
|
||||||
|
to open a balanced Lightning channel.
|
||||||
|
<button class="icon-button close-button" id="close-question">
|
||||||
|
<img src="img/close.svg" alt="" />
|
||||||
|
</button>
|
||||||
|
<a href="https://docs.shock.network/" target="_blank" class="marked question-more">Learn More</a>
|
||||||
|
</div>
|
||||||
|
</label>
|
||||||
|
</div>
|
||||||
|
<div class="checkbox" style="margin-top: 30px">
|
||||||
|
<input type="radio" id="manual" name="service" data-group="service" />
|
||||||
|
<label for="manual">Manage my channels manually</label>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p id="errorTextLiquidity" style="color:red"></p>
|
||||||
|
</div>
|
||||||
|
<button class="push-button" style="margin-top: 60px" id="backupBtn">
|
||||||
|
Next
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<section id="page-backup" style="display: none;">
|
||||||
|
<div class="setup-header">
|
||||||
|
<button class="icon-button back-button" id="back-to-liquidity">
|
||||||
|
<img src="img/back.svg" alt="" />
|
||||||
|
</button>
|
||||||
|
<h2>Choose a Recovery Method</h2>
|
||||||
|
<p class="header-title">
|
||||||
|
<span style="font-weight: bold">New Node! 🎉</span> It's important
|
||||||
|
to backup your keys.
|
||||||
|
</p>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="checkbox" style="margin-top: 12px">
|
<div class="line"></div>
|
||||||
<input type="checkbox" id="customCheckbox" />
|
|
||||||
<div class="checkbox-shape"></div>
|
|
||||||
<label for="customCheckbox">
|
|
||||||
Use the default managed relay service and auto-pay 1000 sats
|
|
||||||
per month to support developers
|
|
||||||
</label>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div>
|
<div class="setup-content">
|
||||||
<p id="errorText" style="color:red"></p>
|
<div class="description-box">
|
||||||
|
<div class="description">
|
||||||
|
In addition to your seed phrase, you also need channel details to recover funds should your node experience a
|
||||||
|
hardware failure.
|
||||||
|
</div>
|
||||||
|
<br />
|
||||||
|
<div class="description">
|
||||||
|
It's important always to have the latest version of this file. Fortunately, it's small enough to automatically
|
||||||
|
store on the Nostr relay.
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="warning-text">
|
||||||
|
If you did not choose the developers relay, be sure your relay has
|
||||||
|
adequate storage policies to hold NIP78 events.
|
||||||
|
</div>
|
||||||
|
<div class="checkbox-container">
|
||||||
|
<div class="checkbox" style="margin-top: 12px">
|
||||||
|
<input type="radio" id="backup" name="backup-option" />
|
||||||
|
<label for="backup">
|
||||||
|
Encrypted Backup to Nostr Relay
|
||||||
|
</label>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="checkbox-container">
|
||||||
|
<div class="checkbox manual-checkbox" style="margin-top: 12px">
|
||||||
|
<input type="radio" id="manual-backup" name="backup-option" />
|
||||||
|
<label for="manual-backup">
|
||||||
|
DO NOT store on relay (Manual Backups)
|
||||||
|
</label>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p id="errorTextBackup" style="color:red"></p>
|
||||||
|
</div>
|
||||||
|
<button class="push-button" style="margin-top: 60px;" id="next-button">
|
||||||
|
Finish Setup
|
||||||
|
</button>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<button class="push-button" style="margin-top: 60px" id="liquidityBtn">
|
|
||||||
Next
|
|
||||||
</button>
|
|
||||||
</section>
|
</section>
|
||||||
</main>
|
</main>
|
||||||
|
|
||||||
|
|
@ -71,75 +176,8 @@
|
||||||
<div class="line"></div>
|
<div class="line"></div>
|
||||||
<a href="https://docs.shock.network" class="marked need-help">Need Help?</a>
|
<a href="https://docs.shock.network" class="marked need-help">Need Help?</a>
|
||||||
</footer>
|
</footer>
|
||||||
<script>
|
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
|
||||||
|
<script src="js/wizard.js"></script>
|
||||||
document.getElementById("liquidityBtn").onclick = (e) => {
|
|
||||||
const nodeName = document.getElementById("nodeName").value;
|
|
||||||
const relayUrl = document.getElementById("relayUrl").value;
|
|
||||||
const checked = document.getElementById("customCheckbox").checked;
|
|
||||||
if (!nodeName) {
|
|
||||||
document.getElementById("errorText").innerText = "Please enter a node name";
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
if (!checked && !relayUrl) {
|
|
||||||
document.getElementById("errorText").innerText = "Please enter a relay URL or check the default relay box";
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
localStorage.setItem("wizard/nodeName", nodeName);
|
|
||||||
if (checked) {
|
|
||||||
localStorage.setItem("wizard/relayUrl", "wss://relay.lightning.pub");
|
|
||||||
} else {
|
|
||||||
localStorage.setItem("wizard/relayUrl", relayUrl);
|
|
||||||
}
|
|
||||||
location.href = 'liquidity.html'
|
|
||||||
}
|
|
||||||
|
|
||||||
const nodeNameInput = document.getElementById("nodeName");
|
|
||||||
const relayUrlInput = document.getElementById("relayUrl");
|
|
||||||
const customCheckbox = document.getElementById("customCheckbox");
|
|
||||||
|
|
||||||
const syncRelayState = () => {
|
|
||||||
if (customCheckbox.checked) {
|
|
||||||
relayUrlInput.value = '';
|
|
||||||
relayUrlInput.disabled = true;
|
|
||||||
} else {
|
|
||||||
relayUrlInput.disabled = false;
|
|
||||||
}
|
|
||||||
};
|
|
||||||
|
|
||||||
customCheckbox.addEventListener('change', syncRelayState);
|
|
||||||
|
|
||||||
relayUrlInput.addEventListener('input', () => {
|
|
||||||
if (relayUrlInput.value) {
|
|
||||||
customCheckbox.checked = false;
|
|
||||||
syncRelayState();
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
fetch("/wizard/state").then((res) => {
|
|
||||||
if (res.status === 200) {
|
|
||||||
res.json().then((data) => {
|
|
||||||
if (data.admin_linked) {
|
|
||||||
location.href = 'status.html'
|
|
||||||
} else if (data.config_sent) {
|
|
||||||
location.href = 'connect.html'
|
|
||||||
} else {
|
|
||||||
console.log("ready to initialize")
|
|
||||||
// Pre-populate from service state if not configured
|
|
||||||
fetch("/wizard/service-state").then(res => res.json()).then(state => {
|
|
||||||
nodeNameInput.value = state.source_name;
|
|
||||||
if (state.relay_url === 'wss://relay.lightning.pub') {
|
|
||||||
customCheckbox.checked = true;
|
|
||||||
} else {
|
|
||||||
relayUrlInput.value = state.relay_url;
|
|
||||||
}
|
|
||||||
syncRelayState();
|
|
||||||
});
|
|
||||||
}
|
|
||||||
});
|
|
||||||
}
|
|
||||||
});
|
|
||||||
</script>
|
|
||||||
</body>
|
</body>
|
||||||
|
|
||||||
</html>
|
</html>
|
||||||
|
|
@ -1,10 +0,0 @@
|
||||||
$(() => {
|
|
||||||
$('input[name="backup-option"]').change(() => {
|
|
||||||
const nextButton = $("#next-button");
|
|
||||||
if ($('input[name="backup-option"]:checked').length > 0) {
|
|
||||||
nextButton.removeClass("hidden-button");
|
|
||||||
} else {
|
|
||||||
nextButton.addClass("hidden-button");
|
|
||||||
}
|
|
||||||
});
|
|
||||||
});
|
|
||||||
|
|
@ -1,9 +0,0 @@
|
||||||
$(() => {
|
|
||||||
$("#show-question").click(() => {
|
|
||||||
$("#question-content").show();
|
|
||||||
});
|
|
||||||
|
|
||||||
$("#close-question").click(() => {
|
|
||||||
$("#question-content").hide();
|
|
||||||
});
|
|
||||||
});
|
|
||||||
147
static/js/wizard.js
Normal file
147
static/js/wizard.js
Normal file
|
|
@ -0,0 +1,147 @@
|
||||||
|
$(() => {
|
||||||
|
// Page sections
|
||||||
|
const pages = {
|
||||||
|
node: $('#page-node'),
|
||||||
|
liquidity: $('#page-liquidity'),
|
||||||
|
backup: $('#page-backup')
|
||||||
|
};
|
||||||
|
|
||||||
|
// Inputs
|
||||||
|
const nodeNameInput = $("#nodeName");
|
||||||
|
const relayUrlInput = $("#relayUrl");
|
||||||
|
const customCheckbox = $("#customCheckbox");
|
||||||
|
const automateLiquidityRadio = $("#automate");
|
||||||
|
const manualLiquidityRadio = $("#manual");
|
||||||
|
const backupNostrRadio = $("#backup");
|
||||||
|
const manualBackupRadio = $("#manual-backup");
|
||||||
|
|
||||||
|
// Buttons
|
||||||
|
const toLiquidityBtn = $("#liquidityBtn");
|
||||||
|
const toBackupBtn = $("#backupBtn");
|
||||||
|
const finishBtn = $("#next-button");
|
||||||
|
const backToNodeBtn = $("#back-to-node");
|
||||||
|
const backToLiquidityBtn = $("#back-to-liquidity");
|
||||||
|
|
||||||
|
// Error text
|
||||||
|
const errorTextNode = $("#errorText");
|
||||||
|
const errorTextLiquidity = $("#errorTextLiquidity");
|
||||||
|
const errorTextBackup = $("#errorTextBackup");
|
||||||
|
|
||||||
|
// Liquidity question mark
|
||||||
|
$("#show-question").click(() => $("#question-content").show());
|
||||||
|
$("#close-question").click(() => $("#question-content").hide());
|
||||||
|
|
||||||
|
const showPage = (pageToShow) => {
|
||||||
|
Object.values(pages).forEach(page => page.hide());
|
||||||
|
pageToShow.show();
|
||||||
|
};
|
||||||
|
|
||||||
|
// Navigation
|
||||||
|
toLiquidityBtn.click(() => {
|
||||||
|
const nodeName = nodeNameInput.val();
|
||||||
|
const relayUrl = relayUrlInput.val();
|
||||||
|
const useDefaultRelay = customCheckbox.prop('checked');
|
||||||
|
if (!nodeName) {
|
||||||
|
errorTextNode.text("Please enter a node name");
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
if (!useDefaultRelay && !relayUrl) {
|
||||||
|
errorTextNode.text("Please enter a relay URL or check the default relay box");
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
errorTextNode.text("");
|
||||||
|
showPage(pages.liquidity);
|
||||||
|
});
|
||||||
|
|
||||||
|
toBackupBtn.click(() => {
|
||||||
|
if (!automateLiquidityRadio.prop('checked') && !manualLiquidityRadio.prop('checked')) {
|
||||||
|
errorTextLiquidity.text('Please select an option');
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
errorTextLiquidity.text("");
|
||||||
|
showPage(pages.backup);
|
||||||
|
});
|
||||||
|
|
||||||
|
backToNodeBtn.click(() => showPage(pages.node));
|
||||||
|
backToLiquidityBtn.click(() => showPage(pages.liquidity));
|
||||||
|
|
||||||
|
// Final submission
|
||||||
|
finishBtn.click(async () => {
|
||||||
|
if (!backupNostrRadio.prop('checked') && !manualBackupRadio.prop('checked')) {
|
||||||
|
errorTextBackup.text('Please select an option');
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
errorTextBackup.text("");
|
||||||
|
|
||||||
|
const relayUrl = customCheckbox.prop('checked') ? 'wss://relay.lightning.pub' : relayUrlInput.val();
|
||||||
|
|
||||||
|
const req = {
|
||||||
|
source_name: nodeNameInput.val(),
|
||||||
|
relay_url: relayUrl,
|
||||||
|
automate_liquidity: automateLiquidityRadio.prop('checked'),
|
||||||
|
push_backups_to_nostr: backupNostrRadio.prop('checked'),
|
||||||
|
};
|
||||||
|
|
||||||
|
try {
|
||||||
|
const res = await fetch("/wizard/config", {
|
||||||
|
method: 'POST',
|
||||||
|
headers: { 'Content-Type': 'application/json' },
|
||||||
|
body: JSON.stringify(req)
|
||||||
|
});
|
||||||
|
if (!res.ok) {
|
||||||
|
const j = await res.json();
|
||||||
|
throw new Error(j.reason || "Failed to start service");
|
||||||
|
}
|
||||||
|
location.href = 'connect.html';
|
||||||
|
} catch (err) {
|
||||||
|
errorTextBackup.text(err.message);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
const syncRelayState = () => {
|
||||||
|
relayUrlInput.prop('disabled', customCheckbox.prop('checked'));
|
||||||
|
if (customCheckbox.prop('checked')) {
|
||||||
|
relayUrlInput.val('');
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
customCheckbox.on('change', syncRelayState);
|
||||||
|
relayUrlInput.on('input', () => {
|
||||||
|
if (relayUrlInput.val()) {
|
||||||
|
customCheckbox.prop('checked', false);
|
||||||
|
syncRelayState();
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
// Initial state load
|
||||||
|
fetch("/wizard/state").then(res => res.json()).then(data => {
|
||||||
|
if (data.admin_linked) {
|
||||||
|
location.href = 'status.html';
|
||||||
|
} else if (data.config_sent) {
|
||||||
|
location.href = 'connect.html';
|
||||||
|
} else {
|
||||||
|
// Pre-populate from service state
|
||||||
|
fetch("/wizard/service-state").then(res => res.json()).then(state => {
|
||||||
|
nodeNameInput.val(state.source_name);
|
||||||
|
if (state.relay_url === 'wss://relay.lightning.pub') {
|
||||||
|
customCheckbox.prop('checked', true);
|
||||||
|
} else {
|
||||||
|
relayUrlInput.val(state.relay_url);
|
||||||
|
}
|
||||||
|
syncRelayState();
|
||||||
|
|
||||||
|
if (state.automate_liquidity) {
|
||||||
|
automateLiquidityRadio.prop('checked', true);
|
||||||
|
} else {
|
||||||
|
manualLiquidityRadio.prop('checked', true);
|
||||||
|
}
|
||||||
|
|
||||||
|
if (state.push_backups_to_nostr) {
|
||||||
|
backupNostrRadio.prop('checked', true);
|
||||||
|
} else {
|
||||||
|
manualBackupRadio.prop('checked', true);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
@ -1,111 +0,0 @@
|
||||||
<!DOCTYPE html>
|
|
||||||
<html>
|
|
||||||
|
|
||||||
<head>
|
|
||||||
<meta charset="UTF-8" />
|
|
||||||
<title></title>
|
|
||||||
<meta charset="UTF-8" />
|
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
|
||||||
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Montserrat" />
|
|
||||||
<link rel="stylesheet" href="css/styles.css" />
|
|
||||||
<link rel="stylesheet" href="css/liquidity.css" />
|
|
||||||
<!-- HTML Meta Tags -->
|
|
||||||
<title>Lightning.Pub</title>
|
|
||||||
<meta name="description" content="Lightning for Everyone" />
|
|
||||||
<link rel="icon" type="image/png" href="img/pub_logo.png" />
|
|
||||||
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
|
|
||||||
</head>
|
|
||||||
|
|
||||||
<body>
|
|
||||||
<header>
|
|
||||||
<img src="img/pub_logo.png" width="38px" height="auto" alt="Lightning Pub logo" />
|
|
||||||
<img src="img/LightningPub.png" height="33px" alt="Lightning Pub logo" />
|
|
||||||
</header>
|
|
||||||
|
|
||||||
<main>
|
|
||||||
<section class="setup-header">
|
|
||||||
<button class="icon-button back-button" onclick="history.back()">
|
|
||||||
<img src="img/back.svg" alt="" />
|
|
||||||
</button>
|
|
||||||
<h2>Manage Node Liquidity</h2>
|
|
||||||
<p class="header-title">
|
|
||||||
How do you want to manage Lightning channels?
|
|
||||||
</p>
|
|
||||||
</section>
|
|
||||||
|
|
||||||
<div class="line"></div>
|
|
||||||
|
|
||||||
<section class="setup-content">
|
|
||||||
<div class="checkbox" style="margin-top: 60px">
|
|
||||||
<input type="radio" id="automate" name="service" data-group="service" />
|
|
||||||
<label for="automate" class="automate">
|
|
||||||
Use Automation Service
|
|
||||||
<div class="question-box">
|
|
||||||
<button class="icon-button" id="show-question">
|
|
||||||
<img src="img/question.svg" />
|
|
||||||
</button>
|
|
||||||
</div>
|
|
||||||
<div class="question-content" id="question-content">
|
|
||||||
Automation helps reduce the fees you pay by trusting peers temporarily until your node balance is sufficient
|
|
||||||
to open a balanced Lightning channel.
|
|
||||||
<button class="icon-button close-button" id="close-question">
|
|
||||||
<img src="img/close.svg" alt="" />
|
|
||||||
</button>
|
|
||||||
<a href="https://docs.shock.network/" target="_blank" class="marked question-more">Learn More</a>
|
|
||||||
</div>
|
|
||||||
</label>
|
|
||||||
</div>
|
|
||||||
<div class="checkbox" style="margin-top: 30px">
|
|
||||||
<input type="radio" id="manual" name="service" data-group="service" />
|
|
||||||
<label for="manual">Manage my channels manually</label>
|
|
||||||
</div>
|
|
||||||
<div>
|
|
||||||
<p id="errorText" style="color:red"></p>
|
|
||||||
</div>
|
|
||||||
<button class="push-button" style="margin-top: 60px" id="backupBtn">
|
|
||||||
Next
|
|
||||||
</button>
|
|
||||||
</section>
|
|
||||||
</main>
|
|
||||||
|
|
||||||
<footer>
|
|
||||||
<div class="footer-text">
|
|
||||||
<div>By proceeding you acknowledge that this is</div>
|
|
||||||
<div>bleeding-edge software, and agree to the providers</div>
|
|
||||||
<div>
|
|
||||||
<span style="color: #c434e0">terms</span> regarding any services
|
|
||||||
herein.
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="line"></div>
|
|
||||||
<a href="https://docs.shock.network" class="marked need-help">Need Help?</a>
|
|
||||||
</footer>
|
|
||||||
<script src="js/liquidity.js"></script>
|
|
||||||
<script>
|
|
||||||
fetch("/wizard/service-state").then(res => res.json()).then(state => {
|
|
||||||
if (state.automate_liquidity) {
|
|
||||||
document.getElementById('automate').checked = true;
|
|
||||||
} else {
|
|
||||||
document.getElementById('manual').checked = true;
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
document.getElementById("backupBtn").onclick = (e) => {
|
|
||||||
const automate = document.getElementById('automate').checked
|
|
||||||
const manual = document.getElementById('manual').checked
|
|
||||||
if (!automate && !manual) {
|
|
||||||
document.getElementById('errorText').innerText = 'Please select an option'
|
|
||||||
return
|
|
||||||
}
|
|
||||||
if (automate) {
|
|
||||||
localStorage.setItem('wizard/liquidity', 'automate')
|
|
||||||
} else {
|
|
||||||
localStorage.setItem('wizard/liquidity', 'manual')
|
|
||||||
}
|
|
||||||
location.href = 'backup.html'
|
|
||||||
}
|
|
||||||
|
|
||||||
</script>
|
|
||||||
</body>
|
|
||||||
|
|
||||||
</html>
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue