Duke Leto
3 years ago
4 changed files with 494 additions and 0 deletions
@ -0,0 +1,98 @@ |
|||||
|
<html lang="en"> |
||||
|
<head> |
||||
|
<title>HUSH Smart Chain Creator</title> |
||||
|
<meta name="viewport" content="width=device-width, initial-scale=1" /> |
||||
|
<link rel="shortcut icon" href="https://hush.is/favicon.ico"> |
||||
|
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/normalize/5.0.0/normalize.min.css"> |
||||
|
<link rel='stylesheet prefetch' href='https://cdnjs.cloudflare.com/ajax/libs/milligram/1.1.0/milligram.min.css'> |
||||
|
<link rel='stylesheet prefetch' href='https://fonts.googleapis.com/css?family=Poppins:300,400,500,700'> |
||||
|
<link rel='stylesheet prefetch' href='https://cdnjs.cloudflare.com/ajax/libs/animate.css/3.5.2/animate.min.css'> |
||||
|
<link rel="stylesheet" href="style.css"> |
||||
|
</head> |
||||
|
<body> |
||||
|
<div id="app"> |
||||
|
<div class="jumbo text-center"> |
||||
|
<div class="logo"> |
||||
|
<img src="logo.jpg" /> |
||||
|
</div> |
||||
|
<h1>Hush Smart Chain Creator</h1> |
||||
|
<h4>Select your flavor</h4> |
||||
|
<ul id="flavor"> |
||||
|
<li><button class="button-white button-outline" v-on:click="setFlavor('z2z')">Full Privacy (z2z)</button></li> |
||||
|
<li><button class="button-white button-outline" v-on:click="setFlavor('hybrid')">Hybrid Privacy (Smart contracts)</button></li> |
||||
|
</ul> |
||||
|
</div> |
||||
|
<div id="build" class="content text-center"> |
||||
|
<h3>Let's build your HSC CLI command</h3> |
||||
|
<h5>Update your settings, your command will update on the right.</h5> |
||||
|
<div class="row"> |
||||
|
<div class="column"> |
||||
|
<form class="center"> |
||||
|
|
||||
|
<fieldset> |
||||
|
<h4>Options</h4> |
||||
|
<div class="row"> |
||||
|
<div class="column"> |
||||
|
<h5>General</h5> |
||||
|
<p>Customize general Hush settings</p> |
||||
|
<ul class="toggles"> |
||||
|
<li class="animated fadeInRight" id="minerAddress" v-on:click="showMinerAddress"> |
||||
|
<label>Specific Address</label> |
||||
|
<label class="switch"> |
||||
|
<input type="checkbox" v-model="customMinerToAddress" v-on:click="showMinerAddress"> |
||||
|
<div class="slider round"></div> |
||||
|
</label> |
||||
|
</li> |
||||
|
<li> |
||||
|
<label>Fully Shielded (z2z)</label> |
||||
|
<label class="switch"> |
||||
|
<input type="checkbox" v-model="optionz2z"> |
||||
|
<div class="slider round"></div> |
||||
|
</label> |
||||
|
</li> |
||||
|
<li class="animated fadeInRight" id="nameInput" style="border-color: #2d2d2d;"> |
||||
|
<label>Name</label> |
||||
|
<input class="input" type="text" v-model="optionName" style="border-color: #2d2d2d;"> |
||||
|
</li> |
||||
|
<li class="animated fadeInRight" id="supplyInput" style="border-color: #2d2d2d;"> |
||||
|
<label>Initial Supply</label> |
||||
|
<input class="input" type="text" v-model="optionSupply" style="border-color: #2d2d2d;"> |
||||
|
</li> |
||||
|
<li class="animated fadeInRight" id="blocktimeInput" style="border-color: #2d2d2d;"> |
||||
|
<label>Block time</label> |
||||
|
<input class="input" type="text" v-model="optionBlocktime" style="border-color: #2d2d2d;"> |
||||
|
</li> |
||||
|
</ul> |
||||
|
<h5 style="margin-top: 15px;">Addnodes</h5> |
||||
|
<p>Add trusted bootstrap nodes. Remove by clicking.</p> |
||||
|
<input style="border-color: #2d2d2d;" type="text" placeholder="Enter hostname or IP address and hit enter" v-model="tempAllowlist" @keyup.enter="addAllowList(tempAllowlist)"> |
||||
|
<ul class="allowlist" v-for="item in optionAllowList" v-bind:item="item"> |
||||
|
<li v-on:click="removeAllowListItem(item)">{{ item }}</li> |
||||
|
</ul> |
||||
|
</div> |
||||
|
</div> |
||||
|
</fieldset> |
||||
|
</form> |
||||
|
<button class="compile button-dark" v-on:click="compile">Compile</button> |
||||
|
</div> |
||||
|
<div class="column"> |
||||
|
<div class="flavor-banner animated fadeInDown"> |
||||
|
You have selected <span class="bold">{{ flavor }}</span> as your flavor. A wise decision. |
||||
|
</div> |
||||
|
|
||||
|
<div id="profile" class="profile animated fadeInDown" v-html="command"> |
||||
|
</div> |
||||
|
</div> |
||||
|
</div> |
||||
|
<div class="row donate"> |
||||
|
<div class="column"> |
||||
|
Developed by <b>Duke Fucking Leto</b><br/> |
||||
|
</div> |
||||
|
</div> |
||||
|
</div> |
||||
|
</div> |
||||
|
<script src='https://unpkg.com/vue'></script> |
||||
|
<script src='https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.1/jquery.min.js'></script> |
||||
|
<script src='main.js?v=2'></script> |
||||
|
</body> |
||||
|
</html> |
After Width: | Height: | Size: 50 KiB |
@ -0,0 +1,105 @@ |
|||||
|
new Vue({ |
||||
|
el: '#app', |
||||
|
data: { |
||||
|
name: 'TUSH', |
||||
|
flavor: '', |
||||
|
path: '', |
||||
|
command: '', |
||||
|
peersList: [ |
||||
|
], |
||||
|
optionz2z: 1, |
||||
|
optionServer: 1, |
||||
|
optionTor: 0, |
||||
|
optionGen: 0, |
||||
|
optionGenProcLimit: 2, |
||||
|
optionEquihashSolver: 'tromp', |
||||
|
optionAllowList: [], |
||||
|
tempAllowlist: '', |
||||
|
customPath: 0, |
||||
|
customMinerToAddress: 0, |
||||
|
optionName: 'TUSH', |
||||
|
optionSupply: '21000000', |
||||
|
optionBlocktime: 60, |
||||
|
optionRpcAllowIp: '127.0.0.1', |
||||
|
optionRpcUser: 'rpcuser', |
||||
|
optionRpcPassword: Math.random().toString(36).slice(2), |
||||
|
optionShowMetrics: 0, |
||||
|
optionDataDir: '', |
||||
|
optionZIndex: 0, |
||||
|
optionAddrIndex: 0, |
||||
|
optionSpentIndex: 0, |
||||
|
optionTimestampIndex: 0 |
||||
|
}, |
||||
|
methods: { |
||||
|
setFlavor: function (option) { |
||||
|
this.flavor = option |
||||
|
if (this.flavor == 'Linux') { |
||||
|
this.path = '/home/user/.komodo/HUSH3.conf' |
||||
|
} else if (this.flavor == "Mac OS") { |
||||
|
this.path = '~/Library/Application Support/Komodo/HUSH3.conf' |
||||
|
} else { |
||||
|
this.path = 'C:\\Users\\your_username\\AppData\\Roaming\\Komodo\\HUSH3.conf' |
||||
|
} |
||||
|
$('.flavor-banner').show() |
||||
|
$(document.body).animate({ |
||||
|
'scrollTop': $('#build').offset().top |
||||
|
}, 1200); |
||||
|
}, |
||||
|
showPathInput: function () { |
||||
|
$('#paths').toggle() |
||||
|
}, |
||||
|
pickPath: function () { |
||||
|
|
||||
|
}, |
||||
|
showMinerInfo: function () { |
||||
|
$('#threads').toggle() |
||||
|
$('#minerAddress').toggle() |
||||
|
|
||||
|
if (this.customMinerToAddress == 1) { |
||||
|
$('#minerInput').toggle() |
||||
|
} |
||||
|
}, |
||||
|
showMinerAddress: function () { |
||||
|
$('#minerInput').toggle() |
||||
|
}, |
||||
|
decreaseThreads: function () { |
||||
|
if (this.optionGenProcLimit != 0) { |
||||
|
this.optionGenProcLimit-- |
||||
|
} |
||||
|
}, |
||||
|
increaseThreads: function () { |
||||
|
this.optionGenProcLimit++ |
||||
|
}, |
||||
|
addAllowList: function (value) { |
||||
|
this.optionAllowList.push(value) |
||||
|
this.tempAllowlist = '' |
||||
|
}, |
||||
|
removeAllowListItem: function (item) { |
||||
|
console.log(item) |
||||
|
var index = this.optionAllowList.indexOf(item) |
||||
|
this.optionAllowList.splice(index, 1) |
||||
|
}, |
||||
|
compile: function () { |
||||
|
var currentdate = new Date(); |
||||
|
var compileTime = currentdate.getDate() + "/" |
||||
|
+ (currentdate.getMonth()+1) + "/" |
||||
|
+ currentdate.getFullYear() + " @ " |
||||
|
+ currentdate.getHours() + ":" |
||||
|
+ currentdate.getMinutes() + ":" |
||||
|
+ currentdate.getSeconds() |
||||
|
this.command = "<br/>hush-smart-chain -ac_name=" + this.name; |
||||
|
/* |
||||
|
if (this.optionAllowList.length != 0) { |
||||
|
this.command = this.conf + "<br /><br />whitelist=" + this.optionAllowList |
||||
|
} |
||||
|
for (var i = 0; i< this.peersList.length; i++) { |
||||
|
if (i == 0) { |
||||
|
this.command = this.conf + "<br />" |
||||
|
} |
||||
|
this.command = this.conf + "<br />addnode=" + this.peersList[i] |
||||
|
} |
||||
|
*/ |
||||
|
$('#profile').show() |
||||
|
} |
||||
|
} |
||||
|
}); |
@ -0,0 +1,291 @@ |
|||||
|
body { |
||||
|
font-family: 'Poppins', sans-serif; |
||||
|
} |
||||
|
|
||||
|
.text-center { |
||||
|
text-align: center; |
||||
|
} |
||||
|
|
||||
|
.center { |
||||
|
margin: 0 auto; |
||||
|
} |
||||
|
|
||||
|
.button-white { |
||||
|
background-color: white; |
||||
|
border-color: white; |
||||
|
} |
||||
|
|
||||
|
.button-dark { |
||||
|
background-color: #2d2d2d; |
||||
|
border-color: #2d2d2d; |
||||
|
} |
||||
|
|
||||
|
.button-white.button-clear, |
||||
|
.button-white.button-outline { |
||||
|
background-color: transparent; |
||||
|
color: white; |
||||
|
} |
||||
|
|
||||
|
.button-white.button-outline:hover { |
||||
|
background-color: transparent; |
||||
|
color: white; |
||||
|
} |
||||
|
|
||||
|
.button-white.button-clear { |
||||
|
border-color: transparent; |
||||
|
} |
||||
|
|
||||
|
code.dark { |
||||
|
background-color: #2d2d2d; |
||||
|
color: #fff; |
||||
|
} |
||||
|
|
||||
|
code.light { |
||||
|
color: #2d2d2d; |
||||
|
} |
||||
|
|
||||
|
.jumbo { |
||||
|
padding: 20px 20px 75px 20px; |
||||
|
background-color: #2d2d2d; |
||||
|
color: #ffffff; |
||||
|
} |
||||
|
|
||||
|
.jumbo .logo { |
||||
|
max-width: 1024px; |
||||
|
margin: 0 auto; |
||||
|
} |
||||
|
|
||||
|
.jumbo .logo img { |
||||
|
height: 30%; |
||||
|
max-width: 80%; |
||||
|
} |
||||
|
|
||||
|
.jumbo #flavor { |
||||
|
margin: 40px 0px 0px 0px; |
||||
|
text-align: center; |
||||
|
} |
||||
|
.jumbo #flavor li { |
||||
|
display: inline; |
||||
|
margin: 0px 5px 0px 5px; |
||||
|
} |
||||
|
|
||||
|
.content { |
||||
|
max-width: 1024px; |
||||
|
margin: 0 auto; |
||||
|
padding: 50px 50px 50px 50px; |
||||
|
} |
||||
|
.content form { |
||||
|
text-align: left; |
||||
|
} |
||||
|
.content form h4 { |
||||
|
margin-top: 25px; |
||||
|
text-align: center; |
||||
|
} |
||||
|
.content form h5 { |
||||
|
clear: both; |
||||
|
margin-bottom: 0px; |
||||
|
} |
||||
|
|
||||
|
.content form p { |
||||
|
margin: 0px 0px 15px 0px; |
||||
|
} |
||||
|
.content .toggles li { |
||||
|
float: left; |
||||
|
display: inline; |
||||
|
margin: 0px 10px 20px 0px; |
||||
|
} |
||||
|
.content .toggles #threads { |
||||
|
display: none; |
||||
|
float: left; |
||||
|
list-style-type: none; |
||||
|
} |
||||
|
.content .toggles .thread-count { |
||||
|
position: relative; |
||||
|
font-size: 150%; |
||||
|
top: 4px; |
||||
|
cursor: pointer; |
||||
|
cursor: hand; |
||||
|
-webkit-touch-callout: none; |
||||
|
/* iOS Safari */ |
||||
|
-webkit-user-select: none; |
||||
|
/* Safari */ |
||||
|
-khtml-user-select: none; |
||||
|
/* Konqueror HTML */ |
||||
|
-moz-user-select: none; |
||||
|
/* Firefox */ |
||||
|
-ms-user-select: none; |
||||
|
/* Internet Explorer/Edge */ |
||||
|
user-select: none; |
||||
|
} |
||||
|
.content .profile { |
||||
|
display: none; |
||||
|
margin-top: 50px; |
||||
|
text-align: left; |
||||
|
border: 1px solid #cccccc; |
||||
|
border-radius: 5px; |
||||
|
padding: 5px 10px 5px 10px; |
||||
|
word-wrap: none; |
||||
|
} |
||||
|
.content .flavor-banner { |
||||
|
display: none; |
||||
|
width: 75%; |
||||
|
margin: 25px auto; |
||||
|
padding: 10px; |
||||
|
background: #333; |
||||
|
color: #fff; |
||||
|
border-radius: 5px; |
||||
|
} |
||||
|
|
||||
|
.content .flavor-banner .path { |
||||
|
margin: 5px 0px 0px 0px; |
||||
|
font-size: 13px; |
||||
|
font-weight: bold; |
||||
|
word-wrap: break-word; |
||||
|
} |
||||
|
|
||||
|
/* The switch - the box around the slider */ |
||||
|
.switch { |
||||
|
position: relative; |
||||
|
display: inline-block; |
||||
|
width: 60px; |
||||
|
height: 34px; |
||||
|
} |
||||
|
|
||||
|
/* Hide default HTML checkbox */ |
||||
|
.switch input { |
||||
|
display: none; |
||||
|
} |
||||
|
|
||||
|
/* The slider */ |
||||
|
.slider { |
||||
|
position: absolute; |
||||
|
clear: left; |
||||
|
cursor: pointer; |
||||
|
top: 0; |
||||
|
left: 0; |
||||
|
right: 0; |
||||
|
bottom: 0; |
||||
|
background-color: #ccc; |
||||
|
-webkit-transition: .4s; |
||||
|
transition: .4s; |
||||
|
} |
||||
|
|
||||
|
.slider:before { |
||||
|
position: absolute; |
||||
|
content: ""; |
||||
|
height: 26px; |
||||
|
width: 26px; |
||||
|
left: 4px; |
||||
|
bottom: 4px; |
||||
|
background-color: white; |
||||
|
-webkit-transition: .4s; |
||||
|
transition: .4s; |
||||
|
} |
||||
|
|
||||
|
input:checked + .slider { |
||||
|
background-color: #2d2d2d; |
||||
|
} |
||||
|
|
||||
|
input:focus + .slider { |
||||
|
box-shadow: 0 0 1px #2d2d2d; |
||||
|
} |
||||
|
|
||||
|
input:checked + .slider:before { |
||||
|
-webkit-transform: translateX(26px); |
||||
|
-ms-transform: translateX(26px); |
||||
|
transform: translateX(26px); |
||||
|
} |
||||
|
|
||||
|
/* Rounded sliders */ |
||||
|
.slider.round { |
||||
|
border-radius: 34px; |
||||
|
} |
||||
|
|
||||
|
.slider.round:before { |
||||
|
border-radius: 50%; |
||||
|
} |
||||
|
|
||||
|
.whitelist { |
||||
|
position: relative; |
||||
|
list-style-type: none; |
||||
|
float: left; |
||||
|
left: -5px; |
||||
|
right: -5px; |
||||
|
} |
||||
|
.whitelist li { |
||||
|
position: relative; |
||||
|
float: left; |
||||
|
font-size: 125%; |
||||
|
top: 0px; |
||||
|
margin: 0px 5px -15px 5px; |
||||
|
padding: 3px 10px 3px 10px; |
||||
|
border-radius: 5px; |
||||
|
background: #2d2d2d; |
||||
|
color: #FFF; |
||||
|
} |
||||
|
|
||||
|
#paths { |
||||
|
display: none; |
||||
|
} |
||||
|
|
||||
|
#miner, #minerAddress, #minerInput { |
||||
|
display: none; |
||||
|
list-style-type: none; |
||||
|
} |
||||
|
|
||||
|
input { |
||||
|
color: #606060; |
||||
|
} |
||||
|
|
||||
|
.compile { |
||||
|
width: 50%; |
||||
|
margin: 20px auto; |
||||
|
} |
||||
|
|
||||
|
.donate { |
||||
|
position: relative; |
||||
|
margin: 50 auto; |
||||
|
margin-bottom: 0px; |
||||
|
word-wrap: break-word; |
||||
|
font-weight: lighter; |
||||
|
} |
||||
|
|
||||
|
.donate span { |
||||
|
position: relative; |
||||
|
top: 5px; |
||||
|
} |
||||
|
|
||||
|
.tooltip { |
||||
|
position: relative; |
||||
|
display: inline; |
||||
|
} |
||||
|
.tooltip span { |
||||
|
position: absolute; |
||||
|
width:140px; |
||||
|
color: #2D2D2D; |
||||
|
background: #FFF; |
||||
|
height: 40px; |
||||
|
line-height: 40px; |
||||
|
text-align: center; |
||||
|
visibility: hidden; |
||||
|
border-radius: 6px; |
||||
|
} |
||||
|
.tooltip span:after { |
||||
|
content: ''; |
||||
|
position: absolute; |
||||
|
bottom: 100%; |
||||
|
left: 50%; |
||||
|
margin-left: -8px; |
||||
|
width: 0; height: 0; |
||||
|
border-bottom: 8px solid #FFF; |
||||
|
border-right: 8px solid transparent; |
||||
|
border-left: 8px solid transparent; |
||||
|
} |
||||
|
#tooltip1:hover.tooltip span { |
||||
|
visibility: visible; |
||||
|
opacity: 0.8; |
||||
|
top: 50px; |
||||
|
left: 50%; |
||||
|
margin-left: -76px; |
||||
|
z-index: 999; |
||||
|
} |
Loading…
Reference in new issue