422 lines
14 KiB
HTML
422 lines
14 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
|
<meta data-n-head="true" data-hid="description" name="description" content="Tera - Fast block generation, High transaction throughput, User-friendly">
|
|
<!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->
|
|
|
|
<title>Tera Foundation: The fastest block generation blockchain in decentralized blockchains</title>
|
|
|
|
<!-- Google font -->
|
|
<link href="https://fonts.googleapis.com/css?family=Montserrat:400,700%7CVarela+Round" rel="stylesheet">
|
|
|
|
<!-- Bootstrap -->
|
|
<link type="text/css" rel="stylesheet" href="CSS/bootstrap.min.css" />
|
|
|
|
<!-- Font Awesome Icon -->
|
|
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.6.3/css/all.css" integrity="sha384-UHRtZLI+pbxtHCWp1t77Bi1L4ZtiqrqD80Kn4Z8NTSRyMA2Fd33n5dQ8lWUE00s/" crossorigin="anonymous">
|
|
|
|
<!-- Custom stlylesheet -->
|
|
<link type="text/css" rel="stylesheet" href="CSS/style.min.css" />
|
|
|
|
<script type="text/javascript" src="../HTML/JS/client.js"></script>
|
|
<style>
|
|
@media all
|
|
{
|
|
.nav .open>a, .nav .open>a:focus, .nav .open>a:hover
|
|
{
|
|
background-color: rgba(250, 250, 250, .1);
|
|
border-color: #337ab7;
|
|
}
|
|
|
|
/*.dropdown2 li*/
|
|
/*{*/
|
|
/*background-color: rgba(250, 250, 250, .01);*/
|
|
/*opacity: 1;*/
|
|
/*}*/
|
|
/*.dropdown2 li a*/
|
|
/*{*/
|
|
/*background-color: rgba(250, 250, 250, .01);*/
|
|
/*opacity: 1;*/
|
|
/*}*/
|
|
|
|
|
|
|
|
#nav.nav-transparent:not(.fixed-nav) .main-nav>li>a
|
|
{
|
|
color:white;
|
|
}
|
|
}
|
|
|
|
</style>
|
|
<script>
|
|
var WasMapDisplay=0;
|
|
var PointC;
|
|
var glMouse,glMoveMouse;
|
|
var NodesMap={};
|
|
function DrawMap()
|
|
{
|
|
var obj = $("idMap");
|
|
var ctx = obj.getContext('2d');
|
|
ctx.fillStyle = "#030a29";
|
|
ctx.fillRect(0, 0, obj.width, obj.height);
|
|
|
|
var KX=1050/1000;
|
|
var KY=490/500;
|
|
PointC={x:556,y:380};
|
|
|
|
//PointC={x:obj.width/2,y:obj.height/2};
|
|
// if(glMouse)
|
|
// PointC=glMouse;
|
|
// if(glMouse)
|
|
// KX=glMouse.x/1000;
|
|
// if(glMouse)
|
|
// KY=glMouse.y/500;
|
|
|
|
var wasname=0;
|
|
|
|
var map={};
|
|
var Count=0;
|
|
for(var key in NodesMap)
|
|
{
|
|
Count++;
|
|
var Item=NodesMap[key];
|
|
var y=Math.floor(obj.height-(obj.height-PointC.y+KY*obj.height*(Item.latitude/10000-90)/180));
|
|
var x=Math.floor(PointC.x+KX*obj.width*(Item.longitude/10000-180)/360);
|
|
if(Item.longitude/10000-180<-20)
|
|
x+=25;
|
|
|
|
var strxy=""+x+":"+y;
|
|
if(!map[strxy])
|
|
map[strxy]={count:0,name:"-"};
|
|
var point=map[strxy];
|
|
point.count++;
|
|
point.x=x;
|
|
point.y=y;
|
|
if(Item.name)
|
|
point.name=Item.name;
|
|
|
|
|
|
}
|
|
|
|
|
|
//arc
|
|
ctx.textAlign = "center";
|
|
ctx.textBaseline = "middle";
|
|
ctx.strokeStyle = "#ffe238";
|
|
ctx.fillStyle=ctx.strokeStyle;
|
|
for(var key in map)
|
|
{
|
|
var point=map[key];
|
|
ctx.beginPath();
|
|
ctx.arc(point.x,point.y,Math.sqrt(point.count),0,2 * Math.PI);
|
|
// ctx.fillText(point.count,point.x,point.y);
|
|
ctx.stroke();
|
|
ctx.fill();
|
|
}
|
|
|
|
//name
|
|
ctx.fillStyle="#1b9031";
|
|
for(var key in map)
|
|
{
|
|
var point=map[key];
|
|
if(!wasname && glMoveMouse)
|
|
{
|
|
var dx=point.x-glMoveMouse.x;
|
|
var dy=point.y-glMoveMouse.y;
|
|
var dl2=dx*dx+dy*dy;
|
|
if(dl2<17+point.count)
|
|
{
|
|
ctx.beginPath();
|
|
ctx.fillText(point.name+":"+point.count,point.x,point.y-20);
|
|
ctx.stroke();
|
|
wasname=1;
|
|
}
|
|
}
|
|
}
|
|
|
|
|
|
if(0 && glMouse)
|
|
{
|
|
ctx.beginPath();
|
|
ctx.arc(glMouse.x,glMouse.y,4,0,2 * Math.PI);
|
|
ctx.fillText("x="+glMouse.x+" y="+glMouse.y,glMouse.x,glMouse.y-20);
|
|
ctx.stroke();
|
|
}
|
|
|
|
SetStatus("Nodes count: "+Count);
|
|
|
|
if(!WasMapDisplay)
|
|
SetVisibleBlock("idMapAll",true);
|
|
WasMapDisplay=1;
|
|
}
|
|
function $(id)
|
|
{
|
|
return document.getElementById(id);
|
|
}
|
|
function SetVisibleBlock(name,bSet)
|
|
{
|
|
var Item=$(name);
|
|
if(bSet && typeof bSet==="string")
|
|
Item.style.display = bSet;
|
|
else
|
|
if(bSet)
|
|
{
|
|
Item.style.display = 'block';
|
|
DoStableScroll();
|
|
}
|
|
else
|
|
{
|
|
Item.style.display = 'none';
|
|
}
|
|
return Item;
|
|
}
|
|
|
|
function SetStatus(Str)
|
|
{
|
|
var id = $("idStatus");
|
|
id.innerHTML=Str;
|
|
}
|
|
|
|
function GetNodeListAll()
|
|
{
|
|
GetData("GetNodeList",{All:1,Geo:1}, function (Data)
|
|
{
|
|
if(Data && Data.result)
|
|
{
|
|
for(var i=0;i<Data.arr.length;i++)
|
|
{
|
|
var Item=Data.arr[i];
|
|
NodesMap[Item.ip]=Item;
|
|
}
|
|
|
|
DrawMap();
|
|
}
|
|
});
|
|
}
|
|
|
|
window.onload=function ()
|
|
{
|
|
DrawMap();
|
|
setInterval(GetNodeListAll,1000);
|
|
|
|
window.addEventListener('mousedown',function (event)
|
|
{
|
|
SetDiagramMouseX(event,"down");
|
|
}, false);
|
|
window.addEventListener('mouseup',function (event)
|
|
{
|
|
SetDiagramMouseX(event,"up");
|
|
}, false);
|
|
|
|
window.onmousemove = function(event)
|
|
{
|
|
SetDiagramMouseX(event);
|
|
}
|
|
}
|
|
|
|
|
|
var LMouseOn=false;
|
|
function SetDiagramMouseX(event,mode)
|
|
{
|
|
if(event.srcElement && event.srcElement.className.indexOf("map")>=0)
|
|
{
|
|
if(mode==="down")
|
|
LMouseOn=true;
|
|
else
|
|
if(mode==="up")
|
|
LMouseOn=false;
|
|
|
|
event.preventDefault();
|
|
var obj = event.srcElement;
|
|
glMoveMouse=getMouse(obj,event);
|
|
if(LMouseOn===true)
|
|
{
|
|
glMouse=glMoveMouse;
|
|
DrawMap();
|
|
}
|
|
}
|
|
}
|
|
|
|
|
|
//LIB
|
|
//LIB
|
|
//LIB
|
|
//LIB
|
|
|
|
function getMouse(canvas,e)
|
|
{
|
|
|
|
var x = e.clientX - getTrueOffsetLeft(canvas);
|
|
if(window.pageXOffset)
|
|
x=x+window.pageXOffset;
|
|
|
|
var y = e.clientY - getTrueOffsetTop(canvas);
|
|
if(window.pageYOffset)
|
|
y=y+window.pageYOffset
|
|
var coord= {x:x,y:y};
|
|
return coord;
|
|
};
|
|
function getTrueOffsetLeft(ele)
|
|
{
|
|
var n = 0;
|
|
while (ele)
|
|
{
|
|
n += ele.offsetLeft || 0;
|
|
ele = ele.offsetParent;
|
|
}
|
|
return n;
|
|
}
|
|
|
|
function getTrueOffsetTop(ele)
|
|
{
|
|
var n = 0;
|
|
while (ele)
|
|
{
|
|
n += ele.offsetTop || 0;
|
|
ele = ele.offsetParent;
|
|
}
|
|
return n;
|
|
}
|
|
|
|
</script>
|
|
<style>
|
|
.basemap
|
|
{
|
|
width:1244px;
|
|
background:url('./PIC/world.jpg') no-repeat;
|
|
border:1px solid rgba(204, 198, 198, 0.97);
|
|
}
|
|
#idMap
|
|
{
|
|
z-index: 100;
|
|
opacity: 0.7;
|
|
}
|
|
|
|
#idStatus
|
|
{
|
|
height: 20px;
|
|
color: white;
|
|
}
|
|
body
|
|
{
|
|
background-color: #030a29;
|
|
}
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<!-- Header -->
|
|
<header id="home" style="background: #1C1D21; height: 80px;">
|
|
|
|
<!-- Nav -->
|
|
<nav id="nav" class="navbar nav-transparent">
|
|
<div class="container">
|
|
|
|
<div class="navbar-header">
|
|
<!-- Logo -->
|
|
<div class="navbar-brand">
|
|
<a href="index.html">
|
|
<img class="logo" src="PIC/Tera_Text_gray.svg" alt="logo">
|
|
<img class="logo-alt" src="PIC/Tera_Text.svg" alt="logo">
|
|
</a>
|
|
</div>
|
|
<!-- /Logo -->
|
|
|
|
<!-- Collapse nav button -->
|
|
<div class="nav-collapse">
|
|
<span></span>
|
|
</div>
|
|
<!-- /Collapse nav button -->
|
|
</div>
|
|
|
|
<!-- Main navigation -->
|
|
<ul class="main-nav nav navbar-nav navbar-right white_menu">
|
|
<li><a href="index.html">HOME</a></li>
|
|
<li><a href="/changelog.html">CHANGELOG</a></li>
|
|
<li><a href="http://teraminer.org/" target="_blank">MINING</a></li>
|
|
<li><a href="/explorer.html">EXPLORER</a></li>
|
|
<li><a href="/web-wallet.html">WALLET</a></li>
|
|
<li><a href="/map.html">NETWORK MAP</a></li>
|
|
|
|
<!-- Documentation -->
|
|
<li class="dropdown2">
|
|
<a href="#" class="dropdown-toggle" data-toggle="dropdown">HELP<span class="caret"></span></a>
|
|
<ul class="dropdown-menu">
|
|
<li>
|
|
WHITE PAPER
|
|
<ul>
|
|
<li><a href="https://docs.google.com/document/d/1EaqFg1ncIxsrNE2M9xJOSzQu8z3ANwMuNyTX0z_A1ow/edit?usp=sharing/" target="_blank">ENG</a></li>
|
|
<li><a href="https://docs.google.com/document/d/1B6_qlAp2xs4aHkqOwyvRMCDJTjgeNiOJiGpIeT0VAzY/edit?usp=sharing/" target="_blank">RUS</a></li>
|
|
<li><a href="https://sourceforge.net/p/tera/code/ci/master/tree/Doc/Chinese/WP_chinese.pdf?format=raw" target="_blank">CHINESE</a></li>
|
|
</ul>
|
|
</li>
|
|
<li role="separator" class="divider"></li>
|
|
<li>
|
|
DAPP PAPER
|
|
<ul>
|
|
<li><a href="https://docs.google.com/document/d/1PXVBbMKdpsAKPkO9UNB5B-LMwIDjylWoHvAAzzrXjvU/edit?usp=sharing/" target="_blank">ENG</a></li>
|
|
<li><a href="https://docs.google.com/document/d/1SkD4yc_POaGRMJRC6yGkDfdJUuKbcyq3JpG0cBXeYGM/edit?usp=sharing/" target="_blank">RUS</a></li>
|
|
<li><a href="https://docs.google.com/document/d/10yXAKxaU7YgrQnbdXu_L7WWovUoRtdJwo3tXXaGZGSQ/edit?usp=sharing/" target="_blank">FAQ</a></li>
|
|
|
|
</ul>
|
|
</li>
|
|
<li role="separator" class="divider"></li>
|
|
<li>
|
|
OTHER
|
|
<ul>
|
|
<li><a href="https://sourceforge.net/p/tera/code/ci/master/tree/Doc/Eng/API.md" target="_blank">API</a></li>
|
|
<li><a href="https://docs.google.com/document/d/18DtASGhrbRwXCAkQR1hQG0lVdrStp4CgA-pd6hicwfo/edit?usp=sharing/" target="_blank">TERAHASH (mining algo)</a></li>
|
|
<!--li><a href="changelog.html">Changelog</a></li-->
|
|
<!--li><a href="faq.html">FAQ</a></li-->
|
|
<!--li><a href="legal.html">Legal</a></li-->
|
|
</ul>
|
|
</li>
|
|
</ul>
|
|
</li>
|
|
|
|
|
|
</ul>
|
|
<!-- /Main navigation -->
|
|
|
|
</div>
|
|
</nav>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<!-- /Nav -->
|
|
|
|
<!-- Social Header -->
|
|
<div class="home-wrapper">
|
|
<div class="container">
|
|
|
|
<!-- Row -->
|
|
<div class="row">
|
|
|
|
|
|
</div>
|
|
<!-- /Row -->
|
|
|
|
</div>
|
|
</div>
|
|
<!-- /About Tera -->
|
|
|
|
</header>
|
|
<!-- /Header -->
|
|
<DIV align='center'>
|
|
<DIV id="idStatus"></DIV>
|
|
<DIV id="idMapAll" style="display: none">
|
|
<DIV class="basemap">
|
|
<canvas class="map" width="1244" height="658" id='idMap'></canvas>
|
|
</DIV>
|
|
<DIV style="color: gray; text-align: center">The location of the nodes on the map is very approximate...</DIV>
|
|
</DIV>
|
|
</DIV>
|
|
</body>
|
|
</html>
|