jostreff/nsedit
1
0
Fork 0
mirror of https://github.com/tuxis-ie/nsedit.git synced 2025-04-19 20:09:14 +03:00
Code Issues Projects Releases Packages Wiki Activity Actions

Improve UI

Browse source 
* add CSS classes to fields
* use monospace font for field values
* min-width for record content edit field, stretch label and content
  to dialog width
* max-width for record content table cell, explicit (percent) column
  sizes
* text-align: right numbers
* display raw data in cells with $('<span>').text(...)
* add DNSSEC info and masters for slave zones
* add some RR types and disable distinction from address .arpa zone;
  show all types for every field
This commit is contained in:
Stefan Bühler 2014-10-04 14:13:37 +02:00
parent 54fb62b471
commit 922642005d
2 changed files with 222 additions and 89 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

28
css/base.css
View file

@ -139,3 +139,31 @@ pre {
.ui-dialog { .ui-dialog {
max-width: 80%; max-width: 80%;
} }
tr.jtable-data-row td {
font-family: monospace;
font-size: 16px;
vertical-align: top;
white-space: pre-wrap; /* css-3 */
white-space: -moz-pre-wrap; /* Mozilla, since 1999 */
white-space: -pre-wrap; /* Opera 4-6 */
white-space: -o-pre-wrap; /* Opera 7 */
word-wrap: break-word;
}
tr.jtable-data-row td.ttl, tr.jtable-data-row td.priority,
.jtable-input input.ttl, .jtable-input input.priority {
text-align: right;
}
tr.jtable-data-row td.content {
max-width: 800px;
}
.jtable-input input {
font-family: monospace;
font-size: 16px;
}
.jtable-input input.name {
width: 100%;
}
.jtable-input input.content {
min-width: 600px;
width: 100%;
}

271
index.php
View file

@ -113,21 +113,45 @@ exit(0);
<? } ?> <? } ?>
</div> </div>
<script type="text/javascript"> <script type="text/javascript">
var entityMap = {
"&": "&amp;",
"<": "&lt;",
">": "&gt;",
'"': '&quot;',
"'": '&#39;',
"/": '&#x2F;'
};
function escapeHtml(string) { function displayDnssecIcon(zone) {
return String(string).replace(/[&<>"'\/]/g, function (s) { if (zone.record.dnssec == true) {
return entityMap[s]; var $img = $('<img class="list" src="img/lock.png" title="DNSSec Info" />');
$img.click(function () {
$("#dnssecinfo").html("");
$.each(zone.record.keyinfo, function ( i, val) {
if (val.dstxt) {
$("#dnssecinfo").append("<p><h2>"+val.keytype+"</h2><pre>"+val.dstxt+"</pre></p>");
}
}); });
}; $("#dnssecinfo").dialog({
modal: true,
title: "DS-records for "+zone.record.name,
width: 'auto',
buttons: {
Ok: function() {
$( this ).dialog( "close" );
}
}
});
});
return $img;
} else {
return '<img src="img/lock_open.png" title="DNSSec Disabled" />';
}
}
function displayContent(fieldName) {
return function(data) {
var value = data.record[fieldName];
switch (fieldName) {
case 'priority':
value = (value === 0) ? '' : value;
break;
}
return $('<span>').text(value);
}
}
$(document).ready(function () { $(document).ready(function () {
$('#SlaveZones').jtable({ $('#SlaveZones').jtable({
@ -142,13 +166,11 @@ $(document).ready(function () {
openChildAsAccordion: true, openChildAsAccordion: true,
actions: { actions: {
listAction: 'zones.php?action=listslaves', listAction: 'zones.php?action=listslaves',
updateAction: 'zones.php?action=update',
<? if (is_adminuser() or $allowzoneadd === TRUE) { ?> <? if (is_adminuser() or $allowzoneadd === TRUE) { ?>
createAction: 'zones.php?action=create', createAction: 'zones.php?action=create',
deleteAction: 'zones.php?action=delete', deleteAction: 'zones.php?action=delete',
<? } ?> <? } ?>
<? if (is_adminuser()) { ?>
updateAction: 'zones.php?action=update'
<? } ?>
}, },
fields: { fields: {
id: { id: {
@ -156,15 +178,32 @@ $(document).ready(function () {
type: 'hidden' type: 'hidden'
}, },
name: { name: {
title: 'Domain' title: 'Domain',
width: '8%',
display: displayContent('name'),
edit: false,
inputClass: 'domain',
listClass: 'domain'
},
dnssec: {
title: 'DNSSEC',
width: '3%',
create: false,
edit: false,
display: displayDnssecIcon,
listClass: 'dnssec'
}, },
<? if (is_adminuser()) { ?> <? if (is_adminuser()) { ?>
owner: { owner: {
title: 'Owner', title: 'Owner',
width: '8%',
display: displayContent('owner'),
options: function(data) { options: function(data) {
return 'users.php?action=listoptions'; return 'users.php?action=listoptions';
}, },
defaultValue: 'admin' defaultValue: 'admin',
inputClass: 'owner',
listClass: 'owner'
}, },
<? } ?> <? } ?>
kind: { kind: {
@ -173,9 +212,30 @@ $(document).ready(function () {
list: false, list: false,
defaultValue: 'Slave' defaultValue: 'Slave'
}, },
masters: {
title: 'Masters',
width: '20%',
display: function(data) {
return $('<span>').text(data.record.masters.join('\n'));
},
input: function(data) {
var elem = $('<input type="text" name="masters">');
if (data && data.record) {
elem.attr('value', data.record.masters.join(','));
}
return elem;
},
inputClass: 'masters',
listClass: 'masters'
},
serial: { serial: {
title: 'Serial', title: 'Serial',
create: false width: '10%',
display: displayContent('serial'),
create: false,
edit: false,
inputClass: 'serial',
listClass: 'serial'
}, },
records: { records: {
width: '5%', width: '5%',
@ -196,22 +256,34 @@ $(document).ready(function () {
}, },
fields: { fields: {
name: { name: {
title: 'Label' title: 'Label',
width: '7%',
display: displayContent('name'),
listClass: 'name'
}, },
type: { type: {
title: 'Type' title: 'Type',
width: '2%',
display: displayContent('type'),
listClass: 'type'
}, },
prio: { priority: {
title: 'Prio' title: 'Prio',
width: '1%',
display: displayContent('priority'),
listClass: 'priority'
}, },
content: { content: {
title: 'Content', title: 'Content',
display: function (data) { width: '30%',
return escapeHtml(data.record.content); display: displayContent('content'),
} listClass: 'content'
}, },
ttl: { ttl: {
title: 'TTL' title: 'TTL',
width: '2%',
display: displayContent('ttl'),
listClass: 'ttl'
} }
} }
}, function (data) { }, function (data) {
@ -263,79 +335,76 @@ $(document).ready(function () {
type: 'hidden' type: 'hidden'
}, },
name: { name: {
title: 'Domain' title: 'Domain',
width: '8%',
display: displayContent('name'),
edit: false,
inputClass: 'domain',
listClass: 'domain'
}, },
dnssec: { dnssec: {
title: 'DNSSEC', title: 'DNSSEC',
width: '3%',
create: false, create: false,
edit: false, edit: false,
display: function (zone) { display: displayDnssecIcon,
if (zone.record.dnssec == true) { listClass: 'dnssec'
var $img = $('<img class="list" src="img/lock.png" title="DNSSec Info" />');
$img.click(function () {
$("#dnssecinfo").html("");
$.each(zone.record.keyinfo, function ( i, val) {
if (val.dstxt) {
$("#dnssecinfo").append("<p><h2>"+val.keytype+"</h2><pre>"+val.dstxt+"</pre></p>");
}
});
$("#dnssecinfo").dialog({
modal: true,
title: "DS-records for "+zone.record.name,
width: 'auto',
buttons: {
Ok: function() {
$( this ).dialog( "close" );
}
}
});
});
return $img;
} else {
return '<img src="img/lock_open.png" title="DNSSec Disabled" />';
}
}
}, },
<? if (is_adminuser()) { ?> <? if (is_adminuser()) { ?>
owner: { owner: {
title: 'Owner', title: 'Owner',
width: '8%',
display: displayContent('owner'),
options: function(data) { options: function(data) {
return 'users.php?action=listoptions'; return 'users.php?action=listoptions';
}, },
defaultValue: 'admin' defaultValue: 'admin',
inputClass: 'owner',
listClass: 'owner'
}, },
<? } ?> <? } ?>
kind: { kind: {
title: 'Type', title: 'Type',
width: '20%',
display: displayContent('kind'),
options: {'Native': 'Native', 'Master': 'Master'}, options: {'Native': 'Native', 'Master': 'Master'},
defaultValue: '<? echo $defaults['defaulttype']; ?>', defaultValue: '<? echo $defaults['defaulttype']; ?>',
edit: false edit: false,
inputClass: 'kind',
listClass: 'kind'
}, },
template: { template: {
title: 'Template', title: 'Template',
options: <? echo json_encode(user_template_names()); ?>, options: <? echo json_encode(user_template_names()); ?>,
list: false, list: false,
create: true, create: true,
edit: false edit: false,
inputClass: 'template'
}, },
nameserver1: { nameserver1: {
title: 'Pri. Nameserver', title: 'Pri. Nameserver',
create: true, create: true,
list: false, list: false,
edit: false, edit: false,
defaultValue: '<? echo $defaults['primaryns']; ?>' defaultValue: '<? echo $defaults['primaryns']; ?>',
inputClass: 'nameserver nameserver1'
}, },
nameserver2: { nameserver2: {
title: 'Sec. Nameserver', title: 'Sec. Nameserver',
create: true, create: true,
list: false, list: false,
edit: false, edit: false,
defaultValue: '<? echo $defaults['secondaryns']; ?>' defaultValue: '<? echo $defaults['secondaryns']; ?>',
inputClass: 'nameserver nameserver2'
}, },
serial: { serial: {
title: 'Serial', title: 'Serial',
width: '10%',
display: displayContent('serial'),
create: false, create: false,
edit: false edit: false,
inputClass: 'serial',
listClass: 'serial'
}, },
records: { records: {
width: '5%', width: '5%',
@ -369,6 +438,7 @@ $(document).ready(function () {
}, },
id: { id: {
key: true, key: true,
type: 'hidden',
create: false, create: false,
edit: false, edit: false,
list: false list: false
@ -380,10 +450,17 @@ $(document).ready(function () {
}, },
name: { name: {
title: 'Label', title: 'Label',
create: true width: '7%',
create: true,
display: displayContent('name'),
inputClass: 'name',
listClass: 'name'
}, },
type: { type: {
title: 'Type',
width: '2%',
options: function() { options: function() {
/*
zonename = new String(zone.record.name); zonename = new String(zone.record.name);
if (zonename.match(/(\.in-addr|\.ip6)\.arpa/)) { if (zonename.match(/(\.in-addr|\.ip6)\.arpa/)) {
return { return {
@ -393,38 +470,53 @@ $(document).ready(function () {
'TXT':'TXT', 'TXT':'TXT',
'SOA':'SOA' 'SOA':'SOA'
}; };
} else { }
*/
return { return {
'AAAA': 'AAAA',
'A': 'A', 'A': 'A',
'AAAA': 'AAAA',
'CNAME': 'CNAME', 'CNAME': 'CNAME',
'MX': 'MX', 'MX': 'MX',
'PTR': 'PTR', 'NAPTR': 'NAPTR',
'SRV': 'SRV',
'TXT': 'TXT',
'NS': 'NS', 'NS': 'NS',
'SOA': 'SOA' 'PTR': 'PTR',
'SOA': 'SOA',
'SPF': 'SPF',
'SRV': 'SRV',
'TLSA': 'TLSA',
'TXT': 'TXT',
}; };
}
}, },
create: true display: displayContent('type'),
create: true,
inputClass: 'type',
listClass: 'type'
}, },
priority: { priority: {
title: 'Prio', title: 'Prio',
width: '1%',
create: true, create: true,
defaultValue: '<? echo $defaults['priority']; ?>' display: displayContent('priority'),
defaultValue: '<? echo $defaults['priority']; ?>',
inputClass: 'priority',
listClass: 'priority'
}, },
content: { content: {
title: 'Content', title: 'Content',
width: '30%',
create: true, create: true,
display: function (data) { display: displayContent('content'),
return escapeHtml(data.record.content); inputClass: 'content',
} listClass: 'content'
}, },
ttl: { ttl: {
title: 'TTL', title: 'TTL',
width: '2%',
create: true, create: true,
defaultValue: '<? echo $defaults['ttl']; ?>' display: displayContent('ttl'),
defaultValue: '<? echo $defaults['ttl']; ?>',
inputClass: 'ttl',
listClass: 'ttl'
} }
} }
}, function (data) { }, function (data) {
@ -447,7 +539,8 @@ $(document).ready(function () {
type: 'hidden' type: 'hidden'
}, },
name: { name: {
title: 'Domain' title: 'Domain',
inputClass: 'domain'
}, },
<? if (is_adminuser()) { ?> <? if (is_adminuser()) { ?>
owner: { owner: {
@ -455,38 +548,44 @@ $(document).ready(function () {
options: function(data) { options: function(data) {
return 'users.php?action=listoptions'; return 'users.php?action=listoptions';
}, },
defaultValue: 'admin' defaultValue: 'admin',
inputClass: 'owner'
}, },
<? } ?> <? } ?>
kind: { kind: {
title: 'Type', title: 'Type',
options: {'Native': 'Native', 'Master': 'Master'}, options: {'Native': 'Native', 'Master': 'Master'},
defaultValue: '<? echo $defaults['defaulttype']; ?>', defaultValue: '<? echo $defaults['defaulttype']; ?>',
edit: false edit: false,
inputClass: 'type'
}, },
zone: { zone: {
title: 'Zonedata', title: 'Zonedata',
type: 'textarea' type: 'textarea',
inputClass: 'zonedata'
}, },
owns: { owns: {
title: 'Overwrite Nameservers', title: 'Overwrite Nameservers',
type: 'checkbox', type: 'checkbox',
values: {'0': 'No', '1': 'Yes'}, values: {'0': 'No', '1': 'Yes'},
defaultValue: 1 defaultValue: 1,
inputClass: 'overwrite_namerserver'
}, },
nameserver1: { nameserver1: {
title: 'Pri. Nameserver', title: 'Pri. Nameserver',
create: true, create: true,
list: false, list: false,
edit: false, edit: false,
defaultValue: '<? echo $defaults['primaryns']; ?>' defaultValue: '<? echo $defaults['primaryns']; ?>',
inputClass: 'nameserver nameserver1'
}, },
nameserver2: { nameserver2: {
title: 'Sec. Nameserver', title: 'Sec. Nameserver',
create: true, create: true,
list: false, list: false,
edit: false, edit: false,
defaultValue: '<? echo $defaults['secondaryns']; ?>' defaultValue: '<? echo $defaults['secondaryns']; ?>',
inputClass: 'nameserver nameserver2'
}, },
}, },
recordAdded: function() { recordAdded: function() {
@ -539,17 +638,23 @@ $(document).ready(function () {
type: 'hidden' type: 'hidden'
}, },
emailaddress: { emailaddress: {
title: 'User' title: 'User',
display: displayContent('emailaddress'),
inputClass: 'emailaddress',
listClass: 'emailaddress'
}, },
password: { password: {
title: 'Password', title: 'Password',
type: 'password', type: 'password',
list: false list: false,
inputClass: 'password',
}, },
isadmin: { isadmin: {
title: 'Admin', title: 'Admin',
type: 'checkbox', type: 'checkbox',
values: {'0': 'No', '1': 'Yes'} values: {'0': 'No', '1': 'Yes'},
inputClass: 'isadmin',
listClass: 'isadmin'
} }
}, },
recordAdded: function() { recordAdded: function() {