paradizelost/visualsubnetcalculator
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Replace join gifs with a tags

Browse Source
This commit is contained in:
John Steel 2021-05-03 09:48:23 -04:00 committed by John Steel
parent 7bad568167
commit 27d9fe3515
No known key found for this signature in database
GPG Key ID: EA905C8A46530B3C
1 changed files with 26 additions and 38 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

64
subnets.html
View File

@ -93,10 +93,10 @@ function recreateTables()
for (var lock in joinLocks) { for (var lock in joinLocks) {
let joinElement = document.getElementById("join_" + lock); let joinElement = document.getElementById("join_" + lock);
if (joinElement && joinElement.onclick) { if (joinElement) {
joinElement.onclick = null; joinElement.childNodes[0].childNodes[0].onclick = null;
joinElement.classList.remove("maskSpanJoinable"); joinElement.childNodes[0].childNodes[0].removeAttribute('href');
joinElement.classList.add("maskSpan"); joinElement.childNodes[0].childNodes[0].removeAttribute('title');
} }
}; };
@ -300,18 +300,22 @@ function createRow(calcbody, node, address, mask, labels, depth)
newCell.rowSpan = (rowspan > 1 ? rowspan : 1); newCell.rowSpan = (rowspan > 1 ? rowspan : 1);
newCell.colSpan = (colspan > 1 ? colspan : 1); newCell.colSpan = (colspan > 1 ? colspan : 1);
newCell.id = "join_" + inet_ntoa(network_address(address, mask)) + "/" + mask; newCell.id = "join_" + inet_ntoa(network_address(address, mask)) + "/" + mask;
var newDivision = document.createElement('div');
var newLink = document.createElement('a');
if (i == (labels.length/3)-1 || comment != null) { if (i == (labels.length/3)-1 || comment != null) {
newCell.classList.add("maskSpan") newCell.classList.add('maskSpan');
newCell.classList.add('disabledAction');
} }
else { else {
newCell.classList.add("maskSpanJoinable") newCell.classList.add('maskSpan');
newCell.onclick = newJoin(joinnode); newLink.onclick = newJoin(joinnode);
newLink.title = "Merge this /" + mask + " subnet together";
newLink.href = "#";
} }
newLink.innerText = "/" + mask;
var newImg = document.createElement('IMG'); newDivision.appendChild(newLink);
newImg.src = 'img/'+mask+'.gif'; newCell.appendChild(newDivision);
newCell.appendChild(newImg);
newRow.appendChild(newCell); newRow.appendChild(newCell);
colspan = 1; // reset for subsequent cells colspan = 1; // reset for subsequent cells
@ -367,7 +371,6 @@ function updateDepthChildren(node)
} }
} }
var rootSubnet; var rootSubnet;
// each node is Array: // each node is Array:
@ -424,26 +427,8 @@ function subnet_netmask(mask)
return network_address(0xffffffff, mask); return network_address(0xffffffff, mask);
} }
function preloadSubnetImages()
{
if (document.images) {
if (!document.preloadedImages) {
document.preloadedImages = new Array();
}
for (var i=0; i<=32; i++) {
var img = new Image();
img.src = 'img/'+i+'.gif';
document.preloadedImages.push(img);
}
}
}
function calcOnLoad() function calcOnLoad()
{ {
preloadSubnetImages();
args = parseQueryString(); args = parseQueryString();
if (args['network'] && args['mask'] && args['division']) { if (args['network'] && args['mask'] && args['division']) {
document.forms['calc'].elements['network'].value = args['network']; document.forms['calc'].elements['network'].value = args['network'];
@ -493,7 +478,7 @@ function parseQueryString (str)
var fields = query.split('&'); var fields = query.split('&');
for (var f = 0; f < fields.length; f++) { for (var f = 0; f < fields.length; f++) {
var field = fields[f].split('='); var field = fields[f].split('=');
args[unescape(field[0].replace(/\+/g, ' '))] = args[unescape(field[0].replace(/\+/g, ' '))] =
unescape(field[1].replace(/\+/g, ' ')); unescape(field[1].replace(/\+/g, ' '));
} }
} }
@ -563,7 +548,7 @@ P {
.calc { .calc {
font-family: Arial, Verdana, sans-serif; font-family: Arial, Verdana, sans-serif;
font-size: 80%; font-size: 80%;
border-collapse: collapse; border-collapse: collapse;
} }
.calc td { .calc td {
border: 1px solid black; border: 1px solid black;
@ -583,13 +568,16 @@ P {
} }
.maskSpan { .maskSpan {
background-color: #cccccc; background-color: #cccccc;
text-align: right; text-align: right;
font-size: x-small;
font-family: monospace;
color: black;
} }
.maskSpanJoinable {
background-color: #cccccc; .maskSpan div {
text-align: right; transform: rotate(90deg);
cursor: grab; text-align: center;
} }
.maskSpanRotate { .maskSpanRotate {