added particles and some code for recent block listing
This commit is contained in:
Kevin
parent
c9a6769be7
commit
c81df9093d
9 changed files with 1789 additions and 30 deletions
|
|
@ -15,10 +15,12 @@
|
|||
<script defer src="/shared/node_modules/pnotify/dist/iife/PNotify.js"></script>
|
||||
<script defer src="/shared/node_modules/pnotify/dist/iife/PNotifyButtons.js"></script>
|
||||
<script defer src="/shared/eventsource.js"></script>
|
||||
<script defer src="/shared/main/particles.js"></script>
|
||||
<script defer src="/shared/loadabout.js"></script>
|
||||
<script defer src="/shared/misc.js"></script>
|
||||
<script defer src="/shared/getos.js"></script>
|
||||
<script defer src="/shared/main/stats.js"></script>
|
||||
<script defer src="/shared/main/recent.js"></script>
|
||||
<script defer src="/shared/main/torstats.js"></script>
|
||||
<script defer src="/shared/panel.js"></script>
|
||||
<script defer src="/shared/configeditor.js"></script>
|
||||
|
|
@ -118,8 +120,9 @@
|
|||
|
||||
<br>
|
||||
|
||||
|
||||
<!--Start of content-->
|
||||
<div class="container">
|
||||
<div class="container mainCont">
|
||||
<div class="columns">
|
||||
<div class="column">
|
||||
<!--Onionr Card-->
|
||||
|
|
@ -262,6 +265,18 @@
|
|||
Blocks to download: <span id="blockQueue"></span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="columns">
|
||||
<div class="column">
|
||||
<p class="buttons">
|
||||
<button class="button is-small">
|
||||
<span class="icon is-small">
|
||||
<i class="fas fa-stream"></i>
|
||||
</span>
|
||||
<span>Recent blocks</span>
|
||||
</button>
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<h4>Process</h4>
|
||||
<div class="columns">
|
||||
<div class="column">
|
||||
|
|
@ -300,6 +315,8 @@
|
|||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div id="particles-js"></div>
|
||||
<br>
|
||||
<div class="modal aboutModal">
|
||||
<div class="modal-background"></div>
|
||||
|
|
@ -311,7 +328,18 @@
|
|||
Loading... <i class="fas fa-spinner fa-spin"></i>
|
||||
</section>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="modal recentModal">
|
||||
<div class="modal-background"></div>
|
||||
<div class="modal-card">
|
||||
<header class="modal-card-head">
|
||||
<button class="closeRecentModal delete" aria-label="close"></button>
|
||||
</header>
|
||||
<section class="modal-card-body recentBody">
|
||||
Loading... <i class="fas fa-spinner fa-spin"></i>
|
||||
</section>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
|
||||
</html>
|
||||
|
|
@ -32,4 +32,28 @@
|
|||
|
||||
.torStats{
|
||||
color: red;
|
||||
}
|
||||
}
|
||||
|
||||
/* ---- reset ---- */
|
||||
|
||||
|
||||
canvas {
|
||||
display: block;
|
||||
vertical-align: bottom;
|
||||
}
|
||||
|
||||
/* ---- particles.js container ---- */
|
||||
|
||||
#particles-js {
|
||||
position:absolute;
|
||||
width:100%;
|
||||
height:100%;
|
||||
top:0;
|
||||
z-index:-1;
|
||||
}
|
||||
|
||||
.mainCont{
|
||||
z-index: 2;
|
||||
position: fixed;
|
||||
|
||||
}
|
||||
1541
static-data/www/shared/main/particles.js
Normal file
1541
static-data/www/shared/main/particles.js
Normal file
File diff suppressed because it is too large
Load diff
110
static-data/www/shared/main/particles.json
Normal file
110
static-data/www/shared/main/particles.json
Normal file
|
|
@ -0,0 +1,110 @@
|
|||
{
|
||||
"particles": {
|
||||
"number": {
|
||||
"value": 10,
|
||||
"density": {
|
||||
"enable": true,
|
||||
"value_area": 800
|
||||
}
|
||||
},
|
||||
"color": {
|
||||
"value": "#ffffff"
|
||||
},
|
||||
"shape": {
|
||||
"type": "circle",
|
||||
"stroke": {
|
||||
"width": 0,
|
||||
"color": "#000000"
|
||||
},
|
||||
"polygon": {
|
||||
"nb_sides": 5
|
||||
},
|
||||
"image": {
|
||||
"src": "img/github.svg",
|
||||
"width": 100,
|
||||
"height": 100
|
||||
}
|
||||
},
|
||||
"opacity": {
|
||||
"value": 0.5,
|
||||
"random": true,
|
||||
"anim": {
|
||||
"enable": false,
|
||||
"speed": 1,
|
||||
"opacity_min": 0.1,
|
||||
"sync": false
|
||||
}
|
||||
},
|
||||
"size": {
|
||||
"value": 10,
|
||||
"random": true,
|
||||
"anim": {
|
||||
"enable": false,
|
||||
"speed": 80,
|
||||
"size_min": 0.1,
|
||||
"sync": false
|
||||
}
|
||||
},
|
||||
"line_linked": {
|
||||
"enable": true,
|
||||
"distance": 300,
|
||||
"color": "#ffffff",
|
||||
"opacity": 0.4,
|
||||
"width": 2
|
||||
},
|
||||
"move": {
|
||||
"enable": true,
|
||||
"speed": 1,
|
||||
"direction": "none",
|
||||
"random": true,
|
||||
"straight": false,
|
||||
"out_mode": "out",
|
||||
"bounce": false,
|
||||
"attract": {
|
||||
"enable": false,
|
||||
"rotateX": 600,
|
||||
"rotateY": 1200
|
||||
}
|
||||
}
|
||||
},
|
||||
"interactivity": {
|
||||
"detect_on": "canvas",
|
||||
"events": {
|
||||
"onhover": {
|
||||
"enable": false,
|
||||
"mode": "repulse"
|
||||
},
|
||||
"onclick": {
|
||||
"enable": false,
|
||||
"mode": "push"
|
||||
},
|
||||
"resize": true
|
||||
},
|
||||
"modes": {
|
||||
"grab": {
|
||||
"distance": 800,
|
||||
"line_linked": {
|
||||
"opacity": 1
|
||||
}
|
||||
},
|
||||
"bubble": {
|
||||
"distance": 800,
|
||||
"size": 80,
|
||||
"duration": 2,
|
||||
"opacity": 0.8,
|
||||
"speed": 3
|
||||
},
|
||||
"repulse": {
|
||||
"distance": 400,
|
||||
"duration": 0.4
|
||||
},
|
||||
"push": {
|
||||
"particles_nb": 4
|
||||
},
|
||||
"remove": {
|
||||
"particles_nb": 2
|
||||
}
|
||||
}
|
||||
},
|
||||
"retina_detect": true
|
||||
}
|
||||
10
static-data/www/shared/main/recent.js
Normal file
10
static-data/www/shared/main/recent.js
Normal file
|
|
@ -0,0 +1,10 @@
|
|||
var recentSource = new EventSourcePolyfill('/recentblocks', {
|
||||
headers: {
|
||||
"token": webpass
|
||||
}
|
||||
})
|
||||
|
||||
|
||||
recentSource.onmessage = function(e){
|
||||
console.debug(e)
|
||||
}
|
||||
|
|
@ -143,4 +143,10 @@ document.addEventListener("visibilitychange", function() {
|
|||
})
|
||||
|
||||
getStats()
|
||||
setInterval(function(){getStats()}, 1000)
|
||||
setInterval(function(){getStats()}, 1000)
|
||||
|
||||
|
||||
/* particlesJS.load(@dom-id, @path-json, @callback (optional)); */
|
||||
particlesJS.load('particles-js', '/shared/main/particles.json', function() {
|
||||
console.log('callback - particles.js config loaded');
|
||||
});
|
||||
|
|
@ -1,27 +1,41 @@
|
|||
var torSource = new EventSourcePolyfill('/torcircuits', {
|
||||
fetch('/config/get/transports.tor', {
|
||||
headers: {
|
||||
"token": webpass
|
||||
}
|
||||
})
|
||||
var displays = document.getElementsByClassName('torInfo')
|
||||
|
||||
for (x = 0; x < displays.length; x++){
|
||||
displays[x].style.whiteSpace = 'pre'
|
||||
}
|
||||
|
||||
torSource.onmessage = function(e){
|
||||
let data = JSON.parse(e.data)
|
||||
let i = 0
|
||||
let displaying = true
|
||||
for (x = 0; x < displays.length; x++){
|
||||
let circuitCount = Object.keys(data).length
|
||||
let node = Object.keys(data)[0]
|
||||
if (circuitCount > 0){
|
||||
displays[x].innerText = "Using " + circuitCount + " Tor circuits with " + data[node]['nodes'][0]['finger'] + " as guard.\nGuard nick: " + data[node]['nodes'][0]['nick']
|
||||
}
|
||||
else{
|
||||
displays[x].innerText = "Using 0 Tor circuits."
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
}})
|
||||
.then((resp) => resp.text()) // Transform the data into text
|
||||
.then(function(resp) {
|
||||
var displays = document.getElementsByClassName('torInfo')
|
||||
if (resp == true){
|
||||
var torSource = new EventSourcePolyfill('/torcircuits', {
|
||||
headers: {
|
||||
"token": webpass
|
||||
}
|
||||
})
|
||||
displays = document.getElementsByClassName('torInfo')
|
||||
|
||||
for (x = 0; x < displays.length; x++){
|
||||
displays[x].style.whiteSpace = 'pre'
|
||||
}
|
||||
|
||||
torSource.onmessage = function(e){
|
||||
let data = JSON.parse(e.data)
|
||||
let i = 0
|
||||
let displaying = true
|
||||
for (x = 0; x < displays.length; x++){
|
||||
let circuitCount = Object.keys(data).length
|
||||
let node = Object.keys(data)[0]
|
||||
if (circuitCount > 0){
|
||||
displays[x].innerText = "Using " + circuitCount + " Tor circuits with " + data[node]['nodes'][0]['finger'] + " as guard.\nGuard nick: " + data[node]['nodes'][0]['nick']
|
||||
}
|
||||
else{
|
||||
displays[x].innerText = "Using 0 Tor circuits."
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
}
|
||||
else{
|
||||
console.debug("No tor enabled, not getting tor stats")
|
||||
displays[0].innerHTML = "<i class=\"fas fa-plug\"></i> Tor is disabled"
|
||||
}
|
||||
})
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue