todo: fom data to json

This commit is contained in:
Askill 2019-11-01 16:08:37 +01:00
parent 1a1b351427
commit eb712716a6
5 changed files with 95 additions and 30 deletions

View File

@ -1,21 +1,21 @@
www.jpmatz.de { ares-mon.jopa.dev {
proxy link1:80 link/1 proxy / link1:80
tls dfasfasfsafdsafsd tls ofj@gmail.com
}
{
proxy
tls
}
{
proxy
tls
} }
www.jpmatz.de { www.jpmatz.de {
proxy link1:80 link/1 proxy / link1:80
tls dfasfasfsafdsafsd tls ofj@gmail.com
} }
www.jpmatz.de { ares.jopa.dev {
proxy link1:80 link/1 proxy /site link1:80
tls dfasfasfsafdsafsd tls ofj@gmail.com
}
www.jpmatz.de {
proxy link1:80 link/1
tls dfasfasfsafdsafsd
}
www.jpmatz.de {
proxy link1:80 link/1
tls dfasfasfsafdsafsd
} }

View File

@ -15,18 +15,40 @@
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" integrity="sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm" crossorigin="anonymous"> <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" integrity="sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm" crossorigin="anonymous">
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootswatch/4.3.1/solar/bootstrap.min.css" crossorigin="anonymous">
<script src="static/js/vendor/modernizr-3.7.1.min.js"></script> <script src="static/js/vendor/modernizr-3.7.1.min.js"></script>
<script src="https://code.jquery.com/jquery-3.4.1.min.js" integrity="sha256-CSXorXvZcTkaix6Yvo6HppcZGetbYMGWSFlBw8HfCJo=" crossorigin="anonymous"></script> <script src="https://code.jquery.com/jquery-3.4.1.min.js" integrity="sha256-CSXorXvZcTkaix6Yvo6HppcZGetbYMGWSFlBw8HfCJo=" crossorigin="anonymous"></script>
<script src="static/js/main.js"></script>
</head> </head>
<body onload="loadSites();"> <body onload="loadSites();">
<div class="container " id="main" style="margin-top: 300px"> <div class="container " id="main" style="margin-top: 300px">
<div id="input" class="card float-sm-left border-success lg-3 md-4 sm-2" >
<div class="card-header"><input type="text" class="form-control" id="domain" placeholder="Domain"></div>
<div class="card-body">
<h5 class="card-title">
<input type="text" class="form-control" id="title" placeholder="Title">
</h4>
<h6 class="card-text">
<input type="text" class="form-control" id="target" placeholder="/test">
<input type="text" class="form-control" id="source" placeholder="to:8080">
</h6>
<h6 class="card-text">tls:
<input type="text" class="form-control" id="email" value="email@example.com">
</h6>
<p class="card-text">
<input type="text" class="form-control" id="description" placeholder="description">
</p>
<button class="btn btn-primary" onClick="newSite()" id="send">Submit</button>
</div>
</div> </div>
</div>
<script src="static/js/main.js"></script>
<script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous"></script> <script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.9/umd/popper.min.js" integrity="sha384-ApNbgh9B+Y1QKtv3Rn7W3mgPxhU9K/ScQsAP7hUibX39j7fakFPskvXusvfa0b4Q" crossorigin="anonymous"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.9/umd/popper.min.js" integrity="sha384-ApNbgh9B+Y1QKtv3Rn7W3mgPxhU9K/ScQsAP7hUibX39j7fakFPskvXusvfa0b4Q" crossorigin="anonymous"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js" integrity="sha384-JZR6Spejh4U02d8jOt6vLEHfe/JQGiRRSQQxSfFWpi1MquVdAyjUar5+76PVCmYl" crossorigin="anonymous"></script> <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js" integrity="sha384-JZR6Spejh4U02d8jOt6vLEHfe/JQGiRRSQQxSfFWpi1MquVdAyjUar5+76PVCmYl" crossorigin="anonymous"></script>

View File

@ -1 +1 @@
{"1":{"id":1,"title":"title 2","description":"desc 3452345235345","domain":"www.jpmatz.de","source":"link1:80","target":"link/1","email":"dfasfasfsafdsafsd"},"2":{"id":2,"title":"title 2","description":"desc 3452345235345","domain":"www.jpmatz.de","source":"link1:80","target":"link/1","email":"dfasfasfsafdsafsd"},"3":{"id":3,"title":"title 2","description":"desc 3452345235345","domain":"www.jpmatz.de","source":"link1:80","target":"link/1","email":"dfasfasfsafdsafsd"},"4":{"id":4,"title":"title 2","description":"desc 3452345235345","domain":"www.jpmatz.de","source":"link1:80","target":"link/1","email":"dfasfasfsafdsafsd"},"5":{"id":5,"title":"title 2","description":"desc 3452345235345","domain":"www.jpmatz.de","source":"link1:80","target":"link/1","email":"dfasfasfsafdsafsd"}} {"1":{"id":1,"title":"title 1","description":"desc 1","domain":"www.jpmatz.de","source":"/","target":"link1:80","email":"ofj@gmail.com"},"2":{"id":2,"title":"title 2","description":"desc 2","domain":"ares.jopa.dev","source":"/site","target":"link1:80","email":"ofj@gmail.com"},"4":{"id":3,"title":"title 3","description":"desc 3","domain":"ares-mon.jopa.dev","source":"/","target":"link1:80","email":"ofj@gmail.com"},"5":{"id":5,"title":"","description":"","domain":"","source":"","target":"","email":""},"6":{"id":6,"title":"","description":"","domain":"","source":"","target":"","email":""}}

View File

@ -1,5 +1,11 @@
.container{ .container{
display: flex; overflow: contain;
justify-content: center; }
align-items: center;
.card{
display: block !important;
flex: none;
float: left;
margin: 20px;
width: 25% !important;
} }

View File

@ -12,24 +12,61 @@ var getJSON = function(url, callback) {
}; };
xhr.send(); xhr.send();
}; };
var postJSON = function(url, data, callback) {
var xhr = new XMLHttpRequest();
xhr.open('POST', url, true);
xhr.responseType = 'json';
xhr.setRequestHeader('Content-Type', 'application/json');
xhr.onload = function() {
var status = xhr.status;
if (status === 200) {
callback(null, xhr.response);
} else {
callback(status, xhr.response);
}
};
xhr.send(data);
};
function loadSites(){ function loadSites(){
getJSON('http://localhost:8000/api/Sites', getJSON('http://localhost:8000/api/Sites',
function(err, data) { function(err, data) {
data = Object.values(data);
if (err !== null) { if (err !== null) {
alert('Something went wrong: ' + err); alert('Something went wrong: ' + err);
} else { } else {
for (index = 0; index < Object.keys(data).length; index++) { $(".rendered").remove();
data.forEach (function(site) {
renderSite(data[index]); renderSite(site);
} })
} }
} }
); );
} }
function renderSite(site){ function renderSite(site){
site = `` siteString = `
<div class="card float-sm-left border-success lg-3 md-4 sm-2 rendered" >
<div class="card-header"><a href="https://${site.domain}">${site.domain}</a></div>
<div class="card-body">
<h4 class="card-title">${site.title}</h4>
console.log(site); <h6 class="card-text">${site.source} -> ${site.target}</p>
<h6 class="card-text">tls: ${site.email}</p>
<p class="card-text">${site.description}</p>
</div>
</div>
`
document.getElementById("main").innerHTML += siteString;
}
function newSite(){
let json = {};
json["domain"] = document.getElementById('domain').value;
json["title"] = document.getElementById('title').value;
json["description"] = document.getElementById('description').value;
json["source"] = document.getElementById('source').value;
json["target"] = document.getElementById('target').value;
json["email"] = document.getElementById('email').value;
postJSON("http://localhost:8000/api/Sites", json, loadSites);
} }