wire localhost screen

This commit is contained in:
boufni95 2024-07-16 22:08:31 +02:00
parent 671875e67f
commit c2cab40a2e
21 changed files with 1553 additions and 590 deletions

View file

@ -1,102 +1,117 @@
<!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" />
<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>
<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" />
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
</head>
<div class="line"></div>
<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>
<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="checkbox" id="backup" />
<div class="checkbox-shape"></div>
<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="checkbox" id="manual-backup" />
<div class="checkbox-shape"></div>
<label for="manual-backup" >
DO NOT store on relay (Manual Backups)
</label>
</div>
</div>
<button
class="push-button hidden-button"
onclick="location.href='seed.html'"
style="margin-top: 60px;"
id="next-button"
>
Next
</button>
</section>
</main>
<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>
<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 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="line"></div>
<a href="https://docs.shock.network" class="marked need-help">Need Help?</a>
</footer>
<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="checkbox" id="backup" />
<div class="checkbox-shape"></div>
<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="checkbox" id="manual-backup" />
<div class="checkbox-shape"></div>
<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>
<script src="js/backup.js"></script>
</body>
</html>
<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>
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 && manual) {
document.getElementById('errorText').innerText = 'Please select only one option'
return
}
if (backup) {
localStorage.setItem('wizard/backup', 'backup')
} else {
localStorage.setItem('wizard/backup', 'manual')
}
location.href = 'seed.html'
}
</script>
</body>
</html>

View file

@ -1,89 +1,111 @@
<!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" />
<!-- HTML Meta Tags -->
<title>Lightning.Pub</title>
<meta name="description" content="Lightning for Everyone" />
</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">
<h2>Setup your Pub</h2>
<p class="header-title">
</p>
</section>
<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" />
<!-- HTML Meta Tags -->
<title>Lightning.Pub</title>
<meta name="description" content="Lightning for Everyone" />
</head>
<div class="line"></div>
<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>
<section 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%"
/>
</div>
<main>
<section class="setup-header">
<h2>Setup your Pub</h2>
<p class="header-title">
</p>
</section>
<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%"
/>
</div>
<div class="line"></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>
<button
class="push-button"
onclick="location.href='liquidity.html'"
style="margin-top: 60px"
>
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>
<section 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="line"></div>
<a href="https://docs.shock.network" class="marked need-help">Need Help?</a>
</footer>
</body>
</html>
<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>
</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>
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'
}
fetch("/wizard/state").then((res) => {
if (res.status === 200) {
res.json().then((data) => {
if (data.already_initialized) {
location.href = 'status.html'
console.log("already init")
} else {
console.log("ready to initialize")
}
});
}
});
</script>
</body>
</html>

View file

@ -1,93 +1,108 @@
<!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" />
<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>
<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" />
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
</head>
<div class="line"></div>
<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>
<section class="setup-content">
<div class="checkbox" style="margin-top: 60px">
<input type="checkbox" id="automate" data-group="service" />
<div class="checkbox-shape"></div>
<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="checkbox" id="manual" data-group="service" />
<div class="checkbox-shape"></div>
<label for="manual">Manage my channels manually</label>
</div>
<button
class="push-button"
onclick="location.href='backup.html'"
style="margin-top: 60px"
>
Next
</button>
</section>
</main>
<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>
<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 class="line"></div>
<section class="setup-content">
<div class="checkbox" style="margin-top: 60px">
<input type="checkbox" id="automate" data-group="service" />
<div class="checkbox-shape"></div>
<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="line"></div>
<a href="https://docs.shock.network" class="marked need-help">Need Help?</a>
</footer>
<div class="checkbox" style="margin-top: 30px">
<input type="checkbox" id="manual" data-group="service" />
<div class="checkbox-shape"></div>
<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>
<script src="js/liquidity.js"></script>
</body>
</html>
<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>
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 && manual) {
document.getElementById('errorText').innerText = 'Please select only one option'
return
}
if (automate) {
localStorage.setItem('wizard/liquidity', 'automate')
} else {
localStorage.setItem('wizard/liquidity', 'manual')
}
location.href = 'backup.html'
}
</script>
</body>
</html>

View file

@ -1,180 +1,128 @@
<!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/seed.css" />
<!-- HTML Meta Tags -->
<title>Lightning.Pub</title>
<meta name="description" content="Lightning for Everyone" />
<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>Seed Phrase</h2>
<p class="header-title">
Store your seed phrase somewhere safe, you will need it if something ever goes wrong with your node hard drive.
</p>
</section>
<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/seed.css" />
<!-- HTML Meta Tags -->
<title>Lightning.Pub</title>
<meta name="description" content="Lightning for Everyone" />
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
</head>
<div class="line"></div>
<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>
<section class="setup-content">
<div class="seed-box-container blur-filter" id="seed-box-container">
<div class="seed-box">
<span>1</span>
<span>albert</span>
</div>
<div class="seed-box">
<span>1</span>
<span>albert</span>
</div>
<div class="seed-box">
<span>1</span>
<span>albert</span>
</div>
<div class="seed-box">
<span>1</span>
<span>albert</span>
</div>
<div class="seed-box">
<span>1</span>
<span>albert</span>
</div>
<div class="seed-box">
<span>1</span>
<span>albert</span>
</div>
<div class="seed-box">
<span>1</span>
<span>albert</span>
</div>
<div class="seed-box">
<span>1</span>
<span>albert</span>
</div>
<div class="seed-box">
<span>1</span>
<span>albert</span>
</div>
<div class="seed-box">
<span>1</span>
<span>albert</span>
</div>
<div class="seed-box">
<span>1</span>
<span>albert</span>
</div>
<div class="seed-box">
<span>1</span>
<span>albert</span>
</div>
<div class="seed-box">
<span>1</span>
<span>albert</span>
</div>
<div class="seed-box">
<span>1</span>
<span>albert</span>
</div>
<div class="seed-box">
<span>1</span>
<span>albert</span>
</div>
<div class="seed-box">
<span>1</span>
<span>albert</span>
</div>
<div class="seed-box">
<span>1</span>
<span>albert</span>
</div>
<div class="seed-box">
<span>1</span>
<span>albert</span>
</div>
<div class="seed-box">
<span>1</span>
<span>albert</span>
</div>
<div class="seed-box">
<span>1</span>
<span>albert</span>
</div>
<div class="seed-box">
<span>1</span>
<span>albert</span>
</div>
<div class="seed-box">
<span>1</span>
<span>albert</span>
</div>
<div class="seed-box">
<span>1</span>
<span>albert</span>
</div>
<div class="seed-box">
<span>1</span>
<span>albert</span>
</div>
</div>
<main>
<section class="setup-header">
<button class="icon-button back-button" onclick="history.back()">
<img src="img/back.svg" alt="" />
</button>
<h2>Seed Phrase</h2>
<p class="header-title">
Store your seed phrase somewhere safe, you will need it if something ever goes wrong with your node hard drive.
</p>
</section>
<button class="reveal-button" id="reveal-button">Click To Reveal</button>
<div class="line"></div>
<div class="checkbox-container">
<div class="checkbox" style="margin-top: 12px">
<input type="checkbox" id="copied" />
<div class="checkbox-shape"></div>
<label for="copied">
I have copied this somewhere safe
</label>
</div>
</div>
<button
id="next-button"
class="push-button hidden-button"
onclick="location.href='connect.html'"
style="margin-top: 60px"
>
Next
</button>
</section>
</main>
<section class="setup-content">
<div class="seed-box-container blur-filter" id="seed-box-container">
</div>
<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.
<button class="reveal-button" id="reveal-button">Click To Reveal</button>
<div class="checkbox-container">
<div class="checkbox" style="margin-top: 12px">
<input type="checkbox" id="copied" />
<div class="checkbox-shape"></div>
<label for="copied">
I have copied this somewhere safe
</label>
</div>
</div>
<div class="line"></div>
<a href="https://docs.shock.network" class="marked need-help">Need Help?</a>
</footer>
<button id="next-button" class="push-button hidden-button" style="margin-top: 60px">
Next
</button>
</section>
</main>
<script src="js/seed.js"></script>
</body>
</html>
<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/seed.js"></script>
<script>
let latestConfirmationId = ""
document.getElementById("next-button").onclick = (e) => {
if (!latestConfirmationId) {
return
}
fetch("/wizard/confirm", {
method: 'POST',
headers: {
'Content-Type': 'application/json',
},
body: JSON.stringify({
confirmation_id: latestConfirmationId,
})
}).then((res) => {
if (res.status === 200) {
location.href = 'connect.html'
}
})
}
fetch("/wizard/config", {
method: 'POST',
headers: {
'Content-Type': 'application/json',
},
body: JSON.stringify({
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',
})
}).then((res) => {
if (res.status === 200) {
res.json().then((data) => {
if (data.already_initialized) {
location.href = 'status.html'
return
}
const seedContainer = document.getElementById("seed-box-container")
latestConfirmationId = data.confirmation_id
console.log(latestConfirmationId)
data.seed.forEach((word, index) => {
const seedBox = document.createElement('div')
seedBox.classList.add('seed-box')
seedBox.innerHTML = `
<span>${index + 1}</span>
<span>${word}</span>
`
seedContainer.appendChild(seedBox)
})
})
}
})
</script>
</body>
</html>

145
static/status.html Normal file
View file

@ -0,0 +1,145 @@
<!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/status.css" />
<!-- HTML Meta Tags -->
<title>Lightning.Pub</title>
<meta name="description" content="Lightning for Everyone" />
<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">
<h2>Node Status</h2>
<p class="header-title"></p>
</section>
<div class="line" style="width: 100%;"></div>
<section class="node-status">
<div>
<div class="status-element" style="margin-top: 15px;">
<div style="text-align: left;">Public Node Name:</div>
<div class="fc-grey editable-content">
<div class="show-nodey" style="display: flex; flex-direction: column; display: none;">
<input type="text" value="" name="show-nodey" placeholder="Nodey McNodeFace" />
<div style="display: flex;justify-content: end;">
<button class="small-btn" id="cancel-show-nodey">Cancel</button>
<button class="small-btn" id="save-show-nodey">Save</button>
</div>
</div>
<div id="show-nodey-text">Nodey McNodeFace</div>
<div class="question-box">
<button class="icon-button" id="show-nodey">
<img src="img/pencil.svg" style="cursor: pointer;" />
</button>
</div>
</div>
</div>
<div class="status-element" style="margin-top: 15px;">
<div style="text-align: left;">Nostr Relay:</div>
<div class="fc-grey editable-content">
<div class="show-nostr" style="display: flex; flex-direction: column; display: none;">
<input type="text" value="" name="show-nostr" placeholder="wss://relay.lightning.pub" />
<div style="display: flex;justify-content: end;">
<button class="small-btn" id="cancel-show-nostr">Cancel</button>
<button class="small-btn" id="save-show-nostr">Save</button>
</div>
</div>
<div id="show-nostr-text">wss://relay.lightning.pub</div>
<div class="question-box">
<button class="icon-button" id="show-nostr">
<img src="img/pencil.svg" style="cursor: pointer;" />
</button>
</div>
</div>
</div>
<div class="status-element" style="margin-top: 15px;">
<div>Administrator:</div>
<div>
npub12334556677889990
</div>
</div>
</div>
<div style="display: flex; justify-content: end;padding-right: 12px;">
<div class="marked" id="show-reset" style="text-decoration: underline; margin-top: 5px;position: relative;">
Reset
<div class="watchdog-status">
<button class="icon-button" id="show-question">
<img src="img/question.svg" />
</button>
</div>
</div>
</div>
<div id="reset-box">
<div style="width: 100%;height: 100%;position: relative;">
<button class="icon-button close-button" id="close-reset-box">
<img src="img/close.svg" alt="">
</button>
<div class="reset-box-content" id="reset-content">
</div>
<div class="continue-button-container">
<div class="continue-button" id="">Continue</div>
</div>
</div>
</div>
<div style="margin-top: 40px;">
<div class="status-element">
<div>Relay Status:</div>
<div>
<span class="green-dot">&#9679;</span> Connected
</div>
</div>
<div class="status-element">
<div>Lightning Status:</div>
<div>
<span class="yellow-dot">&#9679;</span> Syncing
</div>
</div>
<div class="status-element">
<div style="position: relative;">
Watchdog Status:
<div class="watchdog-status">
<button class="icon-button" id="show-question">
<img src="img/question.svg" />
</button>
</div>
</div>
<div>
<span class="green-dot">&#9679;</span> No Alarms
</div>
</div>
</div>
<div style="margin-top: 20px;">
<div style="font-size: 13px; text-align: left;">Guest Invitation Link:</div>
<a href="https://my.shockwallet.app/invite/nprofile12345678899988" target="_blank" style="font-size: 11px;"
class="invite-link">
https://my.shockwallet.app/invite/nprofile12345678899988
</div>
</div>
</section>
</main>
<footer>
<div class="footer-text" style="width: 80%">
<div class="line"></div>
<a href="https://docs.shock.network" class="marked need-help">Need Help?</a>
</footer>
<script src="js/status.js"></script>
</body>
</html>

View file

@ -1,148 +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/status.css" />
<!-- HTML Meta Tags -->
<title>Lightning.Pub</title>
<meta name="description" content="Lightning for Everyone" />
<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">
<h2>Node Status</h2>
<p class="header-title"></p>
</section>
<div class="line" style="width: 100%;"></div>
<section class="node-status">
<div>
<div class="status-element" style="margin-top: 15px;">
<div style="text-align: left;">Public Node Name:</div>
<div class="fc-grey editable-content">
<div class="show-nodey" style="display: flex; flex-direction: column; display: none;">
<input type="text" value="" name="show-nodey" placeholder="Nodey McNodeFace" />
<div style="display: flex;justify-content: end;">
<button class="small-btn" id="cancel-show-nodey">Cancel</button>
<button class="small-btn" id="save-show-nodey">Save</button>
</div>
</div>
<div id="show-nodey-text">Nodey McNodeFace</div>
<div class="question-box">
<button class="icon-button" id="show-nodey">
<img src="img/pencil.svg" style="cursor: pointer;" />
</button>
</div>
</div>
</div>
<div class="status-element" style="margin-top: 15px;">
<div style="text-align: left;">Nostr Relay:</div>
<div class="fc-grey editable-content">
<div class="show-nostr" style="display: flex; flex-direction: column; display: none;">
<input type="text" value="" name="show-nostr" placeholder="wss://relay.lightning.pub" />
<div style="display: flex;justify-content: end;">
<button class="small-btn" id="cancel-show-nostr">Cancel</button>
<button class="small-btn" id="save-show-nostr">Save</button>
</div>
</div>
<div id="show-nostr-text">wss://relay.lightning.pub</div>
<div class="question-box">
<button class="icon-button" id="show-nostr">
<img src="img/pencil.svg" style="cursor: pointer;" />
</button>
</div>
</div>
</div>
<div class="status-element" style="margin-top: 15px;">
<div>Administrator:</div>
<div>
npub12334556677889990
</div>
</div>
</div>
<div style="display: flex; justify-content: end;padding-right: 12px;">
<div class="marked" id="show-reset" style="text-decoration: underline; margin-top: 5px;position: relative;">Reset
<div class="watchdog-status">
<button class="icon-button" id="show-question">
<img src="img/question.svg" />
</button>
</div>
</div>
</div>
<div id="reset-box">
<div style="width: 100%;height: 100%;position: relative;">
<button class="icon-button close-button" id="close-reset-box">
<img src="img/close.svg" alt="">
</button>
<div class="reset-box-content" id="reset-content">
</div>
<div class="continue-button-container">
<div class="continue-button" id="">Continue</div>
</div>
</div>
</div>
<div style="margin-top: 40px;">
<div class="status-element">
<div>Relay Status:</div>
<div>
<span class="green-dot">&#9679;</span> Connected
</div>
</div>
<div class="status-element">
<div>Lightning Status:</div>
<div>
<span class="yellow-dot">&#9679;</span> Syncing
</div>
</div>
<div class="status-element">
<div style="position: relative;">
Watchdog Status:
<div class="watchdog-status">
<button class="icon-button" id="show-question">
<img src="img/question.svg" />
</button>
</div>
</div>
<div>
<span class="green-dot">&#9679;</span> No Alarms
</div>
</div>
</div>
<div style="margin-top: 20px;">
<div style="font-size: 13px; text-align: left;">Guest Invitation Link:</div>
<a href="https://my.shockwallet.app/invite/nprofile12345678899988" target="_blank" style="font-size: 11px;" class="invite-link">
https://my.shockwallet.app/invite/nprofile12345678899988
</div>
</div>
</section>
</main>
<footer>
<div class="footer-text" style="width: 80%">
<div class="line"></div>
<a href="https://docs.shock.network" class="marked need-help">Need Help?</a>
</footer>
<script src="js/status.js"></script>
</body>
</html>