show multiple record types
This commit is contained in:
AJ ONeal
parent
fa45842f9f
commit
7a36e5f685
|
|
@ -31,7 +31,78 @@
|
|||
</ul>
|
||||
|
||||
<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>
|
||||
|
||||
<script src="/js/app.js"></script>
|
||||
|
|
|
|||
|
|
@ -7,6 +7,9 @@
|
|||
function $qs(qs, el) {
|
||||
return (el||document).querySelector(qs);
|
||||
}
|
||||
function $qsa(qs, el) {
|
||||
return (el||document).querySelectorAll(qs);
|
||||
}
|
||||
function $on(selector, eventname, cb) {
|
||||
if (!$on._events[eventname]) {
|
||||
$on._events[eventname] = $on._dispatcher(eventname);
|
||||
|
|
@ -130,16 +133,42 @@
|
|||
return resp.json().then(function (data) {
|
||||
var tpl = '';
|
||||
var el;
|
||||
if (!tpls.record) {
|
||||
tpls.record = $qs('.js-record-tpl').innerHTML;
|
||||
if (!tpls.recordsMap) {
|
||||
//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) {
|
||||
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($qs('.js-record-name', el));
|
||||
$qs('.js-record-type', el).innerText = record.type;
|
||||
$qs('.js-record-name', el).innerText = record.name;
|
||||
Object.keys(record).forEach(function (key) {
|
||||
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);
|
||||
tpl += el.innerHTML;
|
||||
console.log(tpl);
|
||||
|
|
|
|||
Loading…
Reference in New Issue