Implemented P2P network protocol. Refactored project structure.
This commit is contained in:
Revertron
Vendored
+10837
File diff suppressed because it is too large
Load Diff
@@ -0,0 +1,271 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<title>Wyrd</title>
|
||||
{styles}
|
||||
<script defer src="https://use.fontawesome.com/releases/v5.3.1/js/all.js"></script>
|
||||
{scripts}
|
||||
</head>
|
||||
<body onload="onLoad();">
|
||||
<div class="mining_indicator" id="mining_indicator" onclick="miningIndicatorClick(this)">
|
||||
<span></span>
|
||||
<span></span>
|
||||
</div>
|
||||
|
||||
<div id="modal_dialog" class="modal">
|
||||
<div class="modal-background"></div>
|
||||
<div class="modal-content">
|
||||
<div class="box">
|
||||
<p id="modal_text" class="is-centered">Do you really want to cancel mining?</p>
|
||||
<br/>
|
||||
<div class="buttons is-grouped is-centered">
|
||||
<button class="button is-link" id="modal_positive_button" onclick="positiveButton();">Ok</button>
|
||||
<button class="button is-link is-light" id="modal_negative_button" onclick="cancelButton();">Cancel</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="container">
|
||||
<div class="columns">
|
||||
<div class="column is-one-fifth">
|
||||
<div class="menu">
|
||||
<ul class="menu-list">
|
||||
<li><a class="is-active" onclick="openTab(this, 'main')">Main</a></li>
|
||||
</ul>
|
||||
<p class="menu-label">Key management</p>
|
||||
<ul class="menu-list">
|
||||
<li><a onclick="openTab(this, 'key_load')">Load key</a></li>
|
||||
<li><a onclick="openTab(this, 'key_create')">Create key</a></li>
|
||||
<li><a onclick="openTab(this, 'key_passwd')">Change password</a></li>
|
||||
</ul>
|
||||
<p class="menu-label">Domain management</p>
|
||||
<ul class="menu-list">
|
||||
<li><a onclick="openTab(this, 'dom_new')">Create domain</a></li>
|
||||
<li><a onclick="openTab(this, 'dom_edit')">Manage domain</a></li>
|
||||
<li><a onclick="openTab(this, 'dom_renew')">Renew domain</a></li>
|
||||
<li><a onclick="openTab(this, 'dom_transfer')">Transfer domain</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div><!--column-->
|
||||
|
||||
<div class="column auto">
|
||||
<div class="content center" id="main"><h1>Welcome to ALFIS!</h1>
|
||||
<p>ALFIS stands for Alternative Free Identity System.</p>
|
||||
<p>It gives you an opportunity to create your own domains and use them in decentralized networks, store security certificates for browsers to trust without any centralized CA.</p>
|
||||
</div>
|
||||
|
||||
<div class="content is-hidden" id="key_load">
|
||||
<form action="#">
|
||||
<div class="field">
|
||||
<label class="label">Key file name</label>
|
||||
<div class="control">
|
||||
<input class="input" type="text" placeholder="default.key" id="load_key_name">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="field">
|
||||
<label class="label">Key password</label>
|
||||
<div class="control">
|
||||
<input class="input" type="password" placeholder="123456" id="load_key_password">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="field is-grouped">
|
||||
<div class="control">
|
||||
<button class="button is-link" onclick="loadKey();">Load</button>
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="content is-hidden" id="key_create">
|
||||
<form action="#">
|
||||
<div class="field">
|
||||
<label class="label">Key file name</label>
|
||||
<div class="control">
|
||||
<input class="input" type="text" placeholder="default.key" id="create_key_name">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="field">
|
||||
<label class="label">Key password</label>
|
||||
<div class="control">
|
||||
<input class="input" type="password" placeholder="123456" id="create_key_password">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="field is-grouped">
|
||||
<div class="control">
|
||||
<button class="button is-link" onclick="createKey();">Create</button>
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="content is-hidden" id="key_passwd">
|
||||
<form action="#">
|
||||
<div class="field">
|
||||
<label class="label">Key file name</label>
|
||||
<div class="control">
|
||||
<input class="input" type="text" placeholder="default.key" id="change_key_name">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="field">
|
||||
<label class="label">Old key password</label>
|
||||
<div class="control">
|
||||
<input class="input" type="password" placeholder="123456" id="change_key_password">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="field">
|
||||
<label class="label">New key password</label>
|
||||
<div class="control">
|
||||
<input class="input" type="password" placeholder="123456" id="change_key_password_new">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="field">
|
||||
<label class="label">Repeat key password</label>
|
||||
<div class="control">
|
||||
<input class="input" type="password" placeholder="123456" id="change_key_password_repeat">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="field is-grouped">
|
||||
<div class="control">
|
||||
<button class="button is-link">Change password</button>
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
<div class="content is-hidden" id="dom_new">
|
||||
<form action="#">
|
||||
<div class="field">
|
||||
<label class="label">New domain name</label>
|
||||
<div class="control">
|
||||
<input class="input" type="text" placeholder="example.ygg" id="new_domain" oninput="onDomainChange(this)">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="field">
|
||||
<label class="label">Domain records</label>
|
||||
<div class="control">
|
||||
<textarea class="textarea" placeholder="@ IN AAAA 200:1111:2222:3333:4444:5555:6666:7777" id="new_domain_records"></textarea>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="field">
|
||||
<label class="label">Domain tags (will be used for search)</label>
|
||||
<div class="control">
|
||||
<input class="input" type="text" placeholder="blog, community, friendship" id="new_domain_tags">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="field is-grouped">
|
||||
<div class="control">
|
||||
<button class="button is-link" id="new_domain_button" onclick="createDomain();" disabled>Create domain</button>
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="content is-hidden" id="dom_edit">
|
||||
<form action="#">
|
||||
<div class="field">
|
||||
<label class="label">Your existing domain name</label>
|
||||
<div class="control">
|
||||
<input class="input" type="text" placeholder="example.ygg" id="change_domain">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="field">
|
||||
<label class="label">All new domain records</label>
|
||||
<div class="control">
|
||||
<textarea class="textarea" placeholder="@ IN AAAA 200:1111:2222:3333:4444:5555:6666:7777" id="change_domain_records"></textarea>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="field">
|
||||
<label class="label">Domain tags (will be used for search)</label>
|
||||
<div class="control">
|
||||
<input class="input" type="text" placeholder="blog, community, friendship" id="change_domain_tags">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="field is-grouped">
|
||||
<div class="control">
|
||||
<button class="button is-link" onclick="changeDomain();">Replace records</button>
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="content is-hidden" id="dom_renew">
|
||||
<form action="#">
|
||||
<div class="field">
|
||||
<label class="label">Your existing domain name</label>
|
||||
<div class="control">
|
||||
<input class="input" type="text" placeholder="example.ygg" id="renew_domain">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="field">
|
||||
<label class="label">Days to add</label>
|
||||
<div class="control">
|
||||
<input class="input" type="text" placeholder="365" value="365" id="renew_domain_extend_days" disabled>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="field is-grouped">
|
||||
<div class="control">
|
||||
<button class="button is-link" onclick="renewDomain();">Renew domain</button>
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="content is-hidden" id="dom_transfer">
|
||||
<form action="#">
|
||||
<div class="field">
|
||||
<label class="label">Your existing domain name</label>
|
||||
<div class="control">
|
||||
<input class="input" type="text" placeholder="example.ygg" id="transfer_domain">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="field">
|
||||
<label class="label">Public key of new owner</label>
|
||||
<div class="control">
|
||||
<input class="input" type="text" placeholder="3764ef954577a1815db3cc65aa3e2b18a52f12a3f6fcbd6a10d9ce8d06741ddd" id="transfer_domain_transfer_owner">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="field is-grouped">
|
||||
<div class="control">
|
||||
<button class="button is-link" onclick="transferDomain();">Transfer domain</button>
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
</div> <!-- columns -->
|
||||
</div>
|
||||
|
||||
<div class="footer is-hidden">Some footer text is here</div>
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,33 @@
|
||||
.mining_indicator {
|
||||
position:absolute;
|
||||
right:10px;
|
||||
width:30px;
|
||||
height:30px;
|
||||
display:inline-block;
|
||||
padding:0px;
|
||||
text-align:right;
|
||||
float:right;
|
||||
z-index: 10;
|
||||
}
|
||||
.mining_indicator span {
|
||||
position:absolute;
|
||||
display:inline-block;
|
||||
width:30px;
|
||||
height:30px;
|
||||
border-radius:100%;
|
||||
background:#3273dc;
|
||||
-webkit-animation:mining_indicator 1.6s linear infinite;
|
||||
animation:mining_indicator 1.6s linear infinite;
|
||||
}
|
||||
.mining_indicator span:last-child {
|
||||
animation-delay:-0.8s;
|
||||
-webkit-animation-delay:-0.8s;
|
||||
}
|
||||
@keyframes mining_indicator {
|
||||
0% {transform: scale(0, 0);opacity:0.5;}
|
||||
100% {transform: scale(1, 1);opacity:0;}
|
||||
}
|
||||
@-webkit-keyframes mining_indicator {
|
||||
0% {-webkit-transform: scale(0, 0);opacity:0.5;}
|
||||
100% {-webkit-transform: scale(1, 1);opacity:0;}
|
||||
}
|
||||
@@ -0,0 +1,118 @@
|
||||
function onLoad() {
|
||||
external.invoke(JSON.stringify({cmd: 'loaded'}));
|
||||
}
|
||||
|
||||
function openTab(element, tabName) {
|
||||
// Declare all variables
|
||||
var i, tabContent, tabLinks;
|
||||
|
||||
// Get all elements with class="content" and hide them
|
||||
tabContent = document.getElementsByClassName("content");
|
||||
for (i = 0; i < tabContent.length; i++) {
|
||||
tabContent[i].className = "context is-hidden";
|
||||
}
|
||||
|
||||
// Get all elements with class="tablinks" and remove the class "active"
|
||||
tabLinks = document.getElementsByClassName("is-active");
|
||||
for (i = 0; i < tabLinks.length; i++) {
|
||||
tabLinks[i].className = "";
|
||||
}
|
||||
|
||||
// Show the current tab, and add an "active" class to the button that opened the tab
|
||||
document.getElementById(tabName).className = "content";
|
||||
element.className = "is-active";
|
||||
}
|
||||
|
||||
function loadKey() {
|
||||
key_name = document.getElementById("load_key_name").value;
|
||||
key_pass = document.getElementById("load_key_password").value;
|
||||
external.invoke(JSON.stringify({cmd: 'loadKey', name: key_name, pass: key_pass}));
|
||||
}
|
||||
|
||||
function createKey() {
|
||||
key_name = document.getElementById("create_key_name").value;
|
||||
key_pass = document.getElementById("create_key_password").value;
|
||||
external.invoke(JSON.stringify({cmd: 'createKey', name: key_name, pass: key_pass}));
|
||||
}
|
||||
|
||||
function createDomain() {
|
||||
new_domain = document.getElementById("new_domain").value;
|
||||
new_dom_records = document.getElementById("new_domain_records").value;
|
||||
new_dom_tags = document.getElementById("new_domain_tags").value;
|
||||
external.invoke(JSON.stringify({cmd: 'createDomain', name: new_domain, records: new_dom_records, tags: new_dom_tags}));
|
||||
}
|
||||
|
||||
function changeDomain() {
|
||||
domain = document.getElementById("change_domain").value;
|
||||
dom_records = document.getElementById("change_domain_records").value;
|
||||
dom_tags = document.getElementById("change_domain_records").value;
|
||||
external.invoke(JSON.stringify({cmd: 'changeDomain', name: domain, records: dom_records, tags: dom_tags}));
|
||||
}
|
||||
|
||||
function renewDomain() {
|
||||
domain = document.getElementById("renew_domain").value;
|
||||
days = document.getElementById("renew_domain_extend_days").value;
|
||||
external.invoke(JSON.stringify({cmd: 'renewDomain', name: domain, days: days}));
|
||||
}
|
||||
|
||||
function transferDomain() {
|
||||
domain = document.getElementById("transfer_domain").value;
|
||||
new_owner = document.getElementById("transfer_domain_transfer_owner").value;
|
||||
external.invoke(JSON.stringify({cmd: 'transferDomain', name: domain, owner: new_owner}));
|
||||
}
|
||||
|
||||
function sendAction(param) {
|
||||
external.invoke(JSON.stringify(param));
|
||||
}
|
||||
|
||||
function onDomainChange(element) {
|
||||
external.invoke(JSON.stringify({cmd: 'checkDomain', name: element.value}));
|
||||
}
|
||||
|
||||
function domainAvailable(available) {
|
||||
input = document.getElementById("new_domain");
|
||||
button = document.getElementById("new_domain_button");
|
||||
if (available) {
|
||||
input.className = "input";
|
||||
button.disabled = false
|
||||
} else {
|
||||
input.className = "input is-danger";
|
||||
button.disabled = true
|
||||
}
|
||||
}
|
||||
|
||||
function showModalDialog(text, callback) {
|
||||
message = document.getElementById("modal_text");
|
||||
message.textContent = text;
|
||||
|
||||
button_positive = document.getElementById("modal_positive_button");
|
||||
button_positive.onclick = function() {
|
||||
callback();
|
||||
dialog = document.getElementById("modal_dialog");
|
||||
dialog.className = "modal";
|
||||
};
|
||||
|
||||
button_negative = document.getElementById("modal_negative_button");
|
||||
button_negative.onclick = function() {
|
||||
dialog = document.getElementById("modal_dialog");
|
||||
dialog.className = "modal";
|
||||
}
|
||||
|
||||
dialog = document.getElementById("modal_dialog");
|
||||
dialog.className = "modal is-active";
|
||||
}
|
||||
|
||||
function showMiningIndicator(visible) {
|
||||
indicator = document.getElementById("mining_indicator");
|
||||
if (visible) {
|
||||
indicator.style.visibility = 'visible';
|
||||
} else {
|
||||
indicator.style.visibility = 'hidden';
|
||||
}
|
||||
}
|
||||
|
||||
function miningIndicatorClick(element) {
|
||||
showModalDialog("Do you really want to stop mining?", function() {
|
||||
external.invoke(JSON.stringify({cmd: 'stopMining'}));
|
||||
});
|
||||
}
|
||||
Reference in New Issue
Block a user