show multiple record types
This commit is contained in:
parent
fa45842f9f
commit
7a36e5f685
|
@ -31,7 +31,78 @@
|
||||||
</ul>
|
</ul>
|
||||||
|
|
||||||
<ul class="js-record-tpl">
|
<ul class="js-record-tpl">
|
||||||
<li><span class="js-record-type">record-type</span> <span class="js-record-name">record-name</span></li>
|
<li class="js-record-soa">
|
||||||
|
<span class="js-record-type">SOA</span>
|
||||||
|
<span class="js-record-name">example.com</span>
|
||||||
|
<span class="js-record-primary">{{ primary }}</span>
|
||||||
|
<span class="js-record-admin">admin.example.com</span>
|
||||||
|
<span class="js-record-expiration">{{ seconds until expiration }}</span>
|
||||||
|
<span class="js-record-minimum">{{ minimum }}</span>
|
||||||
|
<span class="js-record-serial">{{ serial }}</span>
|
||||||
|
<span class="js-record-retry">{{ retry }}</span>
|
||||||
|
<span class="js-record-refresh">{{ refresh }}</span>
|
||||||
|
<span class="js-record-ttl">{{ ttl }}</span>
|
||||||
|
</li>
|
||||||
|
<li class="js-record-custom">
|
||||||
|
<span class="js-record-type">type000</span>
|
||||||
|
<span class="js-record-name">example.com</span>
|
||||||
|
<span class="js-record-rr">{{ hex }}</span>
|
||||||
|
<span class="js-record-ttl">{{ ttl }}</span>
|
||||||
|
</li>
|
||||||
|
<li class="">
|
||||||
|
<span class="js-record-type">NS</span>
|
||||||
|
<span class="js-record-name">example.com</span>
|
||||||
|
<span class="js-record-ttl">{{ ttl }}</span>
|
||||||
|
</li>
|
||||||
|
<li class="js-record-any">
|
||||||
|
<span class="js-record-type">ANY</span>
|
||||||
|
<span class="js-record-name">example.com</span>
|
||||||
|
<span class="js-record-ttl">{{ ttl }}</span>
|
||||||
|
</li>
|
||||||
|
<li class="js-record-a js-record-aaaa">
|
||||||
|
<span class="js-record-type">A / AAAA</span>
|
||||||
|
<span class="js-record-name">example.com</span>
|
||||||
|
<span class="js-record-address">{{ addr }}</span>
|
||||||
|
<span class="js-record-ttl">{{ ttl }}</span>
|
||||||
|
</li>
|
||||||
|
<li class="js-record-aname js-record-cname js-record-ns">
|
||||||
|
<span class="js-record-type">ANAME / CNAME</span>
|
||||||
|
<span class="js-record-name">example.com</span>
|
||||||
|
<span class="js-record-data">{{ target }}</span>
|
||||||
|
<span class="js-record-ttl">{{ ttl }}</span>
|
||||||
|
</li>
|
||||||
|
<li class="js-record-caa">
|
||||||
|
<span class="js-record-type">CAA</span>
|
||||||
|
<span class="js-record-name">example.com</span>
|
||||||
|
<span class="js-record-flag">{{ flag }}</span>
|
||||||
|
<span class="js-record-value">{{ value }}</span>
|
||||||
|
<span class="js-record-ttl">{{ ttl }}</span>
|
||||||
|
</li>
|
||||||
|
<li class="js-record-mx">
|
||||||
|
<span class="js-record-type">MX</span>
|
||||||
|
<span class="js-record-name">example.com</span>
|
||||||
|
<span class="js-record-exchange">{{ target }}</span>
|
||||||
|
<span class="js-record-priority">{{ priority }}</span>
|
||||||
|
<span class="js-record-ttl">{{ ttl }}</span>
|
||||||
|
</li>
|
||||||
|
<li class="js-record-ptr">
|
||||||
|
<span class="js-record-type">PTR</span>
|
||||||
|
<span class="js-record-name">example.com</span>
|
||||||
|
<span class="js-record-ttl">{{ ttl }}</span>
|
||||||
|
</li>
|
||||||
|
<li class="js-record-srv">
|
||||||
|
<span class="js-record-type">SRV</span>
|
||||||
|
<span class="js-record-name">example.com</span>
|
||||||
|
<span class="js-record-port">{{ port }}</span>
|
||||||
|
<span class="js-record-priority">{{ priority }}</span>
|
||||||
|
<span class="js-record-ttl">{{ ttl }}</span>
|
||||||
|
</li>
|
||||||
|
<li class="js-record-txt">
|
||||||
|
<span class="js-record-type">TXT</span>
|
||||||
|
<span class="js-record-name">example.com</span>
|
||||||
|
<span class="js-record-data">{{ text data }}</span>
|
||||||
|
<span class="js-record-ttl">{{ ttl }}</span>
|
||||||
|
</li>
|
||||||
</ul>
|
</ul>
|
||||||
|
|
||||||
<script src="/js/app.js"></script>
|
<script src="/js/app.js"></script>
|
||||||
|
|
|
@ -7,6 +7,9 @@
|
||||||
function $qs(qs, el) {
|
function $qs(qs, el) {
|
||||||
return (el||document).querySelector(qs);
|
return (el||document).querySelector(qs);
|
||||||
}
|
}
|
||||||
|
function $qsa(qs, el) {
|
||||||
|
return (el||document).querySelectorAll(qs);
|
||||||
|
}
|
||||||
function $on(selector, eventname, cb) {
|
function $on(selector, eventname, cb) {
|
||||||
if (!$on._events[eventname]) {
|
if (!$on._events[eventname]) {
|
||||||
$on._events[eventname] = $on._dispatcher(eventname);
|
$on._events[eventname] = $on._dispatcher(eventname);
|
||||||
|
@ -130,16 +133,42 @@
|
||||||
return resp.json().then(function (data) {
|
return resp.json().then(function (data) {
|
||||||
var tpl = '';
|
var tpl = '';
|
||||||
var el;
|
var el;
|
||||||
if (!tpls.record) {
|
if (!tpls.recordsMap) {
|
||||||
tpls.record = $qs('.js-record-tpl').innerHTML;
|
//tpls.recordTypes = Array.prototype.slice.call($qsa('.js-record-tpl li'));
|
||||||
|
//.innerHTML;
|
||||||
|
tpls.recordsMap = {};
|
||||||
|
tpls.recordsMap.soa = $qs('.js-record-soa').outerHTML;
|
||||||
|
tpls.recordsMap.any = $qs('.js-record-any').outerHTML;
|
||||||
|
tpls.recordsMap.ns = $qs('.js-record-ns').outerHTML;
|
||||||
|
tpls.recordsMap.a = $qs('.js-record-a').outerHTML;
|
||||||
|
tpls.recordsMap.aaaa = $qs('.js-record-aaaa').outerHTML;
|
||||||
|
tpls.recordsMap.aname = $qs('.js-record-aname').outerHTML;
|
||||||
|
tpls.recordsMap.cname = $qs('.js-record-cname').outerHTML;
|
||||||
|
tpls.recordsMap.caa = $qs('.js-record-caa').outerHTML;
|
||||||
|
tpls.recordsMap.ptr = $qs('.js-record-ptr').outerHTML;
|
||||||
|
tpls.recordsMap.mx = $qs('.js-record-mx').outerHTML;
|
||||||
|
tpls.recordsMap.txt = $qs('.js-record-txt').outerHTML;
|
||||||
|
tpls.recordsMap.srv = $qs('.js-record-srv').outerHTML;
|
||||||
}
|
}
|
||||||
|
console.log('tpls.recordsMap:');
|
||||||
|
console.log(tpls.recordsMap);
|
||||||
data.records.forEach(function (record) {
|
data.records.forEach(function (record) {
|
||||||
el = document.createElement('div');
|
el = document.createElement('div');
|
||||||
el.innerHTML = tpls.record;
|
console.log('record.type:');
|
||||||
|
console.log(record.type);
|
||||||
|
el.innerHTML = tpls.recordsMap[record.type.toLowerCase()];
|
||||||
console.log(el);
|
console.log(el);
|
||||||
console.log($qs('.js-record-name', el));
|
console.log($qs('.js-record-name', el));
|
||||||
$qs('.js-record-type', el).innerText = record.type;
|
Object.keys(record).forEach(function (key) {
|
||||||
$qs('.js-record-name', el).innerText = record.name;
|
var x = $qs('.js-record-' + key, el);
|
||||||
|
if (x) {
|
||||||
|
x.innerText = record[key];
|
||||||
|
}
|
||||||
|
});
|
||||||
|
//$qs('.js-record-type', el).innerText = record.type;
|
||||||
|
//$qs('.js-record-name', el).innerText = record.name;
|
||||||
|
//$qs('.js-record-address', el).innerText = record.address;
|
||||||
|
console.log('el.innerHTML:');
|
||||||
console.log(el.innerHTML);
|
console.log(el.innerHTML);
|
||||||
tpl += el.innerHTML;
|
tpl += el.innerHTML;
|
||||||
console.log(tpl);
|
console.log(tpl);
|
||||||
|
|
Loading…
Reference in New Issue