Skip to content

Commit

Permalink
Rewised domains interface a lot.
Browse files Browse the repository at this point in the history
  • Loading branch information
Revertron committed Apr 28, 2021
1 parent d9e9d53 commit cefb1eb
Show file tree
Hide file tree
Showing 4 changed files with 93 additions and 53 deletions.
2 changes: 1 addition & 1 deletion Cargo.toml
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
[package]
name = "alfis"
version = "0.4.32"
version = "0.4.33"
authors = ["Revertron <[email protected]>"]
edition = "2018"
build = "build.rs"
Expand Down
106 changes: 58 additions & 48 deletions src/webview/index.html
Original file line number Diff line number Diff line change
Expand Up @@ -75,55 +75,11 @@
</div>

<!-- Domain mining -->
<div class="tab row page is-hidden" id="tab_domains">
<div class="field is-grouped is-fullwidth">
<div class="control field has-addons is-expanded">
<div class="control is-expanded has-icons-left">
<input class="input is-expanded" type="text" placeholder="domain" id="new_domain" oninput="onDomainChange(this)" title="Just a name of desired domain, like mail, facehook, etc.">
<span class="icon is-small is-left">
<svg viewBox="0 0 24 24" style="width: 20px; height: 20px;"><path d="M17.9,17.39C17.64,16.59 16.89,16 16,16H15V13A1,1 0 0,0 14,12H8V10H10A1,1 0 0,0 11,9V7H13A2,2 0 0,0 15,5V4.59C17.93,5.77 20,8.64 20,12C20,14.08 19.2,15.97 17.9,17.39M11,19.93C7.05,19.44 4,16.08 4,12C4,11.38 4.08,10.78 4.21,10.21L9,15V16A2,2 0 0,0 11,18M12,2A10,10 0 0,0 2,12A10,10 0 0,0 12,22A10,10 0 0,0 22,12A10,10 0 0,0 12,2Z"></path></svg>
</span>
</div>

<!-- Zones -->
<div class="control">
<div class="dropdown" id="zones-dropdown" onclick="toggle(this, event);" title="Select your TLD - Top Level Domain">
<div class="dropdown-trigger">
<button class="button" aria-haspopup="true" aria-controls="zones-menu" onblur="closeZonesDropdown()">
<span id="zones-current-name">Select zone</span>
<span class="icon is-small">
<svg viewBox="0 0 24 24" style="width: 20px; height: 20px;"><path d="M7.41,8.58L12,13.17L16.59,8.58L18,10L12,16L6,10L7.41,8.58Z"></path></svg>
</span>
</button>
</div>
<div class="dropdown-menu" id="zones-menu" role="menu">
<div class="dropdown-content" id="zones-links">
</div>
</div>
</div>
</div>
</div>

<div class="control">
<div class="buttons has-addons">
<button id="add_record_button" class="button is-info is-light" onclick="showNewRecordDialog();" title="Domain is nothing without good DNS records">Add record</button>
<button disabled id="owners_button" class="button is-info is-light" onclick="showOwnersDialog();" title="You can change domain owners. Leave empty to be yours only.">
<span>Set owners</span><span id="owners_count" class="tag is-info is-hidden ml-2">0</span>
</button>
<button disabled id="add_contacts_button" class="button is-info is-light" onclick="showContactsDialog();" title="You can add contact information to your domain, if you wish">Set contacts</button>
<button id="new_domain_button" class="button is-info" onclick="createDomain();" title="Start mining">Mine domain</button>
</div>
</div>
</div>
<p class="help">Enter domain name, add some DNS-records, then hit the "Mine domain" button!</p>

<div class="list pb-3" id="domain_records">
<!-- Here will be our domain records, added by dialog -->
</div>

<div id="my_domains" class="container is-fluid cards-container">
<div class="tab row page is-hidden" id="tab_domains" style="align-items: center;">
<div id="my_domains" class="container is-fluid cards-container mt-0">
<!-- Here will be our domains -->
</div>
<button class="button is-info mt-2" onclick="showNewDomainDialog()" style="max-width: 200px;">New domain</button>
</div>

<!-- Zone mining -->
Expand Down Expand Up @@ -220,6 +176,60 @@ <h4>If you want to get your own domain</h4>
</div>
</div>

<div id="new_domain_dialog" class="modal">
<div class="modal-background"></div>
<div class="modal-content">
<div class="box" id="new_domain_dialog_box">
<button class="delete" aria-label="close" onclick="closeDialog('new_domain_dialog')"></button>
<label class="label">New domain:</label>
<div class="field is-grouped is-fullwidth">
<div class="control field has-addons is-expanded">
<div class="control is-expanded has-icons-left">
<input class="input is-expanded" type="text" placeholder="domain" id="new_domain" oninput="onDomainChange(this)" title="Just a name of desired domain, like mail, facehook, etc.">
<span class="icon is-small is-left">
<svg viewBox="0 0 24 24" style="width: 20px; height: 20px;"><path d="M17.9,17.39C17.64,16.59 16.89,16 16,16H15V13A1,1 0 0,0 14,12H8V10H10A1,1 0 0,0 11,9V7H13A2,2 0 0,0 15,5V4.59C17.93,5.77 20,8.64 20,12C20,14.08 19.2,15.97 17.9,17.39M11,19.93C7.05,19.44 4,16.08 4,12C4,11.38 4.08,10.78 4.21,10.21L9,15V16A2,2 0 0,0 11,18M12,2A10,10 0 0,0 2,12A10,10 0 0,0 12,22A10,10 0 0,0 22,12A10,10 0 0,0 12,2Z"></path></svg>
</span>
</div>

<!-- Zones -->
<div class="control">
<div class="dropdown" id="zones-dropdown" onclick="toggle(this, event);" title="Select your TLD - Top Level Domain">
<div class="dropdown-trigger">
<button class="button" aria-haspopup="true" aria-controls="zones-menu" onblur="closeZonesDropdown()">
<span id="zones-current-name">Select zone</span>
<span class="icon is-small">
<svg viewBox="0 0 24 24" style="width: 20px; height: 20px;"><path d="M7.41,8.58L12,13.17L16.59,8.58L18,10L12,16L6,10L7.41,8.58Z"></path></svg>
</span>
</button>
</div>
<div class="dropdown-menu" id="zones-menu" role="menu">
<div class="dropdown-content" id="zones-links">
</div>
</div>
</div>
</div>
</div>

<div class="control">
<div class="buttons has-addons">
<button id="add_record_button" class="button is-info is-light" onclick="showNewRecordDialog();" title="Domain is nothing without good DNS records">Add record</button>
<button disabled id="owners_button" class="button is-info is-light" onclick="showOwnersDialog();" title="You can change domain owners. Leave empty to be yours only.">
<span>Set owners</span><span id="owners_count" class="tag is-info is-hidden ml-2">0</span>
</button>
<button disabled id="add_contacts_button" class="button is-info is-light" onclick="showContactsDialog();" title="You can add contact information to your domain, if you wish">Set contacts</button>
<button id="new_domain_button" class="button is-info" onclick="createDomain();" title="Start mining">Mine domain</button>
</div>
</div>
</div>
<p class="help">Enter domain name, add some DNS-records, then hit the "Mine domain" button!</p>

<div class="list mt-2" id="domain_records">
<!-- Here will be our domain records, added by dialog -->
</div>
</div>
</div>
</div>

<div id="owners_dialog" class="modal">
<div class="modal-background"></div>
<div class="modal-content">
Expand Down Expand Up @@ -317,7 +327,7 @@ <h4>If you want to get your own domain</h4>
<br/>
<div class="buttons is-grouped is-centered">
<button class="button is-info" id="new_record_positive_button">Add</button>
<button class="button is-link is-light" id="new_record_negative_button">Cancel</button>
<button class="button is-info is-light" id="new_record_negative_button">Cancel</button>
</div>
</div>
</div>
Expand Down
16 changes: 12 additions & 4 deletions src/webview/scripts.js
Original file line number Diff line number Diff line change
Expand Up @@ -107,15 +107,13 @@ function addMyDomain(name, timestamp, data) {
}

function refreshMyDomains() {
var edit_icon = '<svg viewBox="0 0 24 24" class="tag-button" onclick="editDomain(\'{domain}\');"><path d="M21.04 12.13C21.18 12.13 21.31 12.19 21.42 12.3L22.7 13.58C22.92 13.79 22.92 14.14 22.7 14.35L21.7 15.35L19.65 13.3L20.65 12.3C20.76 12.19 20.9 12.13 21.04 12.13M19.07 13.88L21.12 15.93L15.06 22H13V19.94L19.07 13.88M11 19L9 21H5C3.9 21 3 20.1 3 19V5C3 3.9 3.9 3 5 3H9.18C9.6 1.84 10.7 1 12 1C13.3 1 14.4 1.84 14.82 3H19C20.1 3 21 3.9 21 5V9L19 11V5H17V7H7V5H5V19H11M12 3C11.45 3 11 3.45 11 4C11 4.55 11.45 5 12 5C12.55 5 13 4.55 13 4C13 3.45 12.55 3 12 3Z"></path></svg>';
var card = '<div class="card is-inline-block"><div class="card-content p-3"><div class="content is-small"><h3>{title}</h3><div class="tags">{tags}{edit}</div></div></div></div>';
var card = '<div class="card is-clickable is-inline-block" onclick="editDomain(\'{domain}\');"><div class="card-content p-3"><div class="content is-small"><h3>{title}</h3><div class="tags">{tags}</div></div></div></div>';
var tag = '<span class="tag" title="{ip}">{domain}</span>';
var cards = "";
myDomains.forEach(function(value, index, array) {
var title = value.name;
var domain_data = JSON.parse(value.data);
var tags = "";
var edit = edit_icon.replace("{domain}", title);
domain_data.records.forEach(function(v, i, a) {
if (typeof v.domain !== 'undefined') {
var buf = tag.replace("{domain}", v.domain);
Expand All @@ -127,7 +125,7 @@ function refreshMyDomains() {
tags = tags + buf;
}
});
cards = cards + card.replace("{title}", title).replace("{tags}", tags).replace("{edit}", edit);
cards = cards + card.replace("{title}", title).replace("{domain}", title).replace("{tags}", tags);
});
document.getElementById("my_domains").innerHTML = cards;
}
Expand All @@ -146,6 +144,7 @@ function editDomain(domain) {
document.getElementById("new_domain").value = title.replace("." + domain_data.zone, "");
changeZone(domain_data.zone);
refreshRecordsList();
showNewDomainDialog();
});
}

Expand Down Expand Up @@ -214,6 +213,14 @@ function recordOkay(okay) {
}
}

function showNewDomainDialog() {
document.getElementById("new_domain_dialog").className = "modal is-active";
}

function closeDialog(name) {
document.getElementById(name).className = "modal";
}

function createDomain() {
if (typeof currentZone == 'undefined') {
showWarning("Select a domain zone first");
Expand All @@ -234,6 +241,7 @@ function createDomain() {
function domainMiningStarted() {
//recordsBuffer = [];
//refreshRecordsList();
document.getElementById("new_domain_dialog").className = "modal";
document.getElementById("tab_domains").disabled = true;
document.getElementById("domain_records").disabled = true;
document.getElementById("add_record_button").disabled = true;
Expand Down
22 changes: 22 additions & 0 deletions src/webview/styles.css
Original file line number Diff line number Diff line change
Expand Up @@ -42,6 +42,28 @@ body {

/* ========================================== */

@media screen and (min-width: 769px) {
.modal-content,
.modal-card {
width: 100%;
max-width: calc(100vw - 60px);
}
}

.modal-background {
background-color: rgba(10, 10, 10, 0.76);
}

#new_domain_dialog_box {
min-height: 380px;
}

.delete {
position: absolute;
top: 1.0rem;
right: 1.25rem;
}

.container {
margin: 10pt;
}
Expand Down

0 comments on commit cefb1eb

Please sign in to comment.