Materialized
This commit is contained in:
parent
3383d1b614
commit
f82aa4c734
23
css/icons.css
Normal file
23
css/icons.css
Normal file
@ -0,0 +1,23 @@
|
||||
/* fallback */
|
||||
@font-face {
|
||||
font-family: 'Material Icons';
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
src: url(../fonts/flUhRq6tzZclQEJ-Vdg-IuiaDsNc.woff2) format('woff2');
|
||||
}
|
||||
|
||||
.material-icons {
|
||||
font-family: 'Material Icons';
|
||||
font-weight: normal;
|
||||
font-style: normal;
|
||||
font-size: 24px;
|
||||
line-height: 1;
|
||||
letter-spacing: normal;
|
||||
text-transform: none;
|
||||
display: inline-block;
|
||||
white-space: nowrap;
|
||||
word-wrap: normal;
|
||||
direction: ltr;
|
||||
-moz-font-feature-settings: 'liga';
|
||||
-moz-osx-font-smoothing: grayscale;
|
||||
}
|
||||
9085
css/materialize.css
vendored
Normal file
9085
css/materialize.css
vendored
Normal file
File diff suppressed because it is too large
Load Diff
10
css/style.css
Normal file
10
css/style.css
Normal file
@ -0,0 +1,10 @@
|
||||
|
||||
.td-input {
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.td-input input[type="text"]:not(.browser-default) {
|
||||
margin: 0;
|
||||
background-repeat: no-repeat;
|
||||
background-position: right center;
|
||||
}
|
||||
BIN
fonts/flUhRq6tzZclQEJ-Vdg-IuiaDsNc.woff2
Normal file
BIN
fonts/flUhRq6tzZclQEJ-Vdg-IuiaDsNc.woff2
Normal file
Binary file not shown.
|
Before Width: | Height: | Size: 1.4 KiB After Width: | Height: | Size: 1.4 KiB |
|
Before Width: | Height: | Size: 1.4 KiB After Width: | Height: | Size: 1.4 KiB |
|
Before Width: | Height: | Size: 4.9 KiB After Width: | Height: | Size: 4.9 KiB |
16
index.php
16
index.php
@ -1,7 +1,21 @@
|
||||
<?php include "connect.php"; ?>
|
||||
<html>
|
||||
<head>
|
||||
<title>TablIP</title>
|
||||
<link rel="stylesheet" href="css/style.css"/>
|
||||
<link rel="stylesheet" href="css/icons.css"/>
|
||||
<link rel="stylesheet" href="css/materialize.css"/>
|
||||
<script type="text/javascript" src="js/script.js"></script>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
|
||||
</head>
|
||||
<body>
|
||||
<script type="text/javascript" src="js/materialize.js"></script>
|
||||
<?php
|
||||
if (isset($_GET["site"])) {
|
||||
include "siteNetworks.php";
|
||||
} else {
|
||||
include "sitesList.php";
|
||||
}
|
||||
?>
|
||||
?>
|
||||
</body>
|
||||
</html>
|
||||
12374
js/materialize.js
vendored
Normal file
12374
js/materialize.js
vendored
Normal file
File diff suppressed because it is too large
Load Diff
@ -1,5 +1,5 @@
|
||||
function updateHost(input) {
|
||||
input.style.backgroundImage = 'url(wait.gif)'
|
||||
input.style.backgroundImage = 'url(img/wait.gif)'
|
||||
input.style.fontStyle = "italic"
|
||||
fetch(new Request("updateHost.php", {
|
||||
method:"POST",
|
||||
@ -10,7 +10,7 @@ function updateHost(input) {
|
||||
input.style.backgroundImage = ''
|
||||
input.style.fontStyle = ""
|
||||
} else {
|
||||
input.style.backgroundImage = 'url(nok.png)'
|
||||
input.style.backgroundImage = 'url(img/nok.png)'
|
||||
}
|
||||
})
|
||||
}
|
||||
139
siteNetworks.php
139
siteNetworks.php
@ -1,7 +1,6 @@
|
||||
<?php
|
||||
$MAX_LINES = 2500;
|
||||
|
||||
include "connect.php";
|
||||
$siteName = $_GET["site"];
|
||||
// Check if site is known
|
||||
$site = $db->prepare('SELECT id from Sites WHERE Name=:siteName');
|
||||
@ -13,17 +12,19 @@ if (!$siteId) {
|
||||
}
|
||||
?>
|
||||
|
||||
<html>
|
||||
<head>
|
||||
<title>TablIP - <?=$siteName?></title>
|
||||
<link rel="stylesheet" href="style.css"/>
|
||||
<script src="script.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<header>
|
||||
<h1>TablIP</h1>
|
||||
<h2><?=$siteName?></h2>
|
||||
<nav>
|
||||
<div class="nav-wrapper navbar-fixed cyan lighten-2">
|
||||
<a href="." class="brand-logo center">TablIP</a>
|
||||
<div>
|
||||
<a href="." class="breadcrumb">Sites</a>
|
||||
<a href=".?Site=<?=$siteName?>" class="breadcrumb"><?=$siteName?></a>
|
||||
</div>
|
||||
</div>
|
||||
</nav>
|
||||
</header>
|
||||
<div class="container">
|
||||
<h1><?=$siteName?></h1>
|
||||
|
||||
<?php
|
||||
$networks = $db->query("SELECT * FROM `Networks` WHERE `SiteId` = $siteId");
|
||||
@ -33,71 +34,81 @@ while ($network = $networks->fetch())
|
||||
$networkAddress = (int) $network["Address"];
|
||||
$networkMask = (int) $network["Mask"];
|
||||
?>
|
||||
<table style="width:100%">
|
||||
<caption><?=$network['Name']." : ".long2ip($networkAddress)." / ".long2ip($networkMask)?><caption>
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Adresse IP</th>
|
||||
<th>Nom d'hôte</th>
|
||||
<th>FQDN</th>
|
||||
<th>Adresse MAC</th>
|
||||
<th>Commentaires</th>
|
||||
<tr>
|
||||
<td><em><?= long2ip($networkAddress)?></em></td>
|
||||
<td colspan="4"><em>Adresse réseau</em></td>
|
||||
</tr>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<div class="card">
|
||||
<div class="card-content">
|
||||
<span class="card-title"><?=$network['Name']." @ ".long2ip($networkAddress)." / ".long2ip($networkMask)?></span>
|
||||
<table class="striped responsive-table">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Adresse IP</th>
|
||||
<th>Nom d'hôte</th>
|
||||
<th>FQDN</th>
|
||||
<th>Adresse MAC</th>
|
||||
<th>Commentaires</th>
|
||||
<tr>
|
||||
<td><em><?= long2ip($networkAddress)?></em></td>
|
||||
<td colspan="4"><em>Adresse réseau</em></td>
|
||||
</tr>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<?php
|
||||
for ($ip = $networkAddress + 1; ($ip+1 & $networkMask) == $networkAddress && $ip < $networkAddress + $MAX_LINES; $ip++ ) {
|
||||
$hosts = $db->query("SELECT * from `Hosts` WHERE IPAddress=$ip AND NetworkId=$networkId");
|
||||
$host = $hosts->fetch();
|
||||
?>
|
||||
<tr>
|
||||
<form>
|
||||
<input type="hidden" name="Ip" value=<?=$ip?>/>
|
||||
<input type="hidden" name="NetworkId" value=<?=$networkId?>/>
|
||||
<td><?=long2ip($ip)?></td>
|
||||
<td><input type="text" onchange="updateHost(this)" name='Hostname' value="<?=$host["Hostname"]?>"/></td>
|
||||
<td><input type="text" onchange="updateHost(this)" name='FQDN' value="<?=$host["FQDN"]?>"/></td>
|
||||
<td><input type="text" onchange="updateHost(this)" name='MacAddress' value="<?=$host["MacAddress"]?>"/></td>
|
||||
<td><input type="text" onchange="updateHost(this)" name='Comments' value="<?=$host["Comments"]?>"/></td>
|
||||
</form>
|
||||
</tr>
|
||||
<tr>
|
||||
<form>
|
||||
<input type="hidden" name="Ip" value=<?=$ip?>/>
|
||||
<input type="hidden" name="NetworkId" value=<?=$networkId?>/>
|
||||
<td><?=long2ip($ip)?></td>
|
||||
<td class="td-input"><input type="text" onchange="updateHost(this)" name='Hostname' value="<?=$host["Hostname"]?>"/></td>
|
||||
<td class="td-input"><input type="text" onchange="updateHost(this)" name='FQDN' value="<?=$host["FQDN"]?>"/></td>
|
||||
<td class="td-input"><input type="text" onchange="updateHost(this)" name='MacAddress' value="<?=$host["MacAddress"]?>"/></td>
|
||||
<td class="td-input"><input type="text" onchange="updateHost(this)" name='Comments' value="<?=$host["Comments"]?>"/></td>
|
||||
</form>
|
||||
</tr>
|
||||
<?php
|
||||
}
|
||||
?>
|
||||
</tbody>
|
||||
<tfoot>
|
||||
<tr>
|
||||
<td><em><?= long2ip($ip)?></em></td>
|
||||
<td colspan="4"><em>Adresse de diffusion</em></td>
|
||||
</tr>
|
||||
</tfoot>
|
||||
</table>
|
||||
</tbody>
|
||||
<tfoot>
|
||||
<tr>
|
||||
<td><em><?= long2ip($ip)?></em></td>
|
||||
<td colspan="4"><em>Adresse de diffusion</em></td>
|
||||
</tr>
|
||||
</tfoot>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
<?php
|
||||
}
|
||||
$networks->closeCursor();
|
||||
?>
|
||||
|
||||
<form name="addNetwork" id="addNetwork" action="addNetwork.php" method="post">
|
||||
<fieldset class="add">
|
||||
<legend>Ajouter un réseau</legend>
|
||||
<label for="nameInput">Nom</label>
|
||||
<input type="text" id="nameInput" name="name" required/>
|
||||
<label for="gatewayInput">Passerelle</label>
|
||||
<input type="text" id="gatewayInput" name="gateway" pattern="^(25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)\.(25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)\.(25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)\.(25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)$"/>
|
||||
<label for="maskInput">Masque</label>
|
||||
<input type="text" id="maskInput" name="mask" pattern="^((0|128|192|224|240|248|252|255)\.0\.0.0|255\.(0|128|192|224|240|248|252|255)\.0\.0|255\.255\.(0|128|192|224|240|248|252|255)\.0|255\.255\.255\.(0|128|192|224|240|248|252|255))$"'/>
|
||||
<input type="hidden" name="siteId" value="<?=$siteId?>"/>
|
||||
<input type="hidden" name="siteName" value="<?=$siteName?>"/>
|
||||
<button id="addButton" type="submit">Ajouter</button>
|
||||
</fieldset>
|
||||
</form>
|
||||
<div class="card teal lighten-5">
|
||||
<div class="card-content">
|
||||
<span class="card-title">Nouveau réseau</span>
|
||||
<form name="addNetwork" id="addNetwork" action="addNetwork.php" method="post">
|
||||
<input type="hidden" name="siteId" value="<?=$siteId?>"/>
|
||||
<input type="hidden" name="siteName" value="<?=$siteName?>"/>
|
||||
<div class="input-field">
|
||||
<label for="nameInput">Nom</label>
|
||||
<input type="text" class="validate" id="nameInput" name="name" placeholder="LAN" required/>
|
||||
</div>
|
||||
<div class="input-field">
|
||||
<label for="gatewayInput">Passerelle</label>
|
||||
<input type="text" class="validate" id="gatewayInput" name="gateway" placeholder="192.168.0.1" pattern="^(25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)\.(25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)\.(25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)\.(25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)$"/>
|
||||
</div>
|
||||
<div class="input-field">
|
||||
<label for="maskInput">Masque</label>
|
||||
<input type="text" class="validate" id="maskInput" name="mask" placeholder="255.255.255.0" pattern="^((0|128|192|224|240|248|252|255)\.0\.0.0|255\.(0|128|192|224|240|248|252|255)\.0\.0|255\.255\.(0|128|192|224|240|248|252|255)\.0|255\.255\.255\.(0|128|192|224|240|248|252|255))$"'/>
|
||||
</div>
|
||||
<button type="submit" class="btn-floating halfway-fab waves-effect waves-light teal"><i class="material-icons">add</i></button>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
<footer>
|
||||
<a href=".">Accueil</a>
|
||||
</footer>
|
||||
</body>
|
||||
</html>
|
||||
@ -1,32 +1,38 @@
|
||||
<html>
|
||||
<head>
|
||||
<title>TablIP</title>
|
||||
<link rel="stylesheet" href="style.css"/>
|
||||
</head>
|
||||
<body>
|
||||
<header>
|
||||
<h1>TablIP</h1>
|
||||
<nav>
|
||||
<div class="nav-wrapper navbar-fixed teal lighten-2">
|
||||
<a href="." class="brand-logo center">TablIP</a>
|
||||
<div>
|
||||
<a href="." class="breadcrumb">Sites</a>
|
||||
</div>
|
||||
</div>
|
||||
</nav>
|
||||
</header>
|
||||
<ul>
|
||||
<div class="container">
|
||||
<h1>Sites</h1>
|
||||
<div class="collection">
|
||||
|
||||
<?php
|
||||
include "connect.php";
|
||||
$sites = $db->query('SELECT Name FROM Site ORDER BY Name');
|
||||
$sites = $db->query('SELECT Name FROM Sites ORDER BY Name');
|
||||
while ($site = $sites->fetch())
|
||||
{
|
||||
echo " <li><a href='.?site=${site['Name']}'>${site['Name']}</a></li>\n";
|
||||
echo " <a href='.?site=${site['Name']}' class='collection-item'>${site['Name']}</a>\n";
|
||||
}
|
||||
$sites->closeCursor();
|
||||
?>
|
||||
|
||||
</ul>
|
||||
<form name="addSite" id="addSite" action="addSite.php" method="post">
|
||||
<fieldset class="add">
|
||||
<legend>Ajouter un site</legend>
|
||||
<label for="siteName">Nom</label>
|
||||
<input type="text" id="siteName" name="siteName" required/>
|
||||
<button type="submit">Ajouter</button>
|
||||
</fieldset>
|
||||
</form>
|
||||
</body>
|
||||
</html>
|
||||
</div>
|
||||
<div class="card teal lighten-5">
|
||||
<div class="card-content">
|
||||
<span class="card-title">Nouveau site</span>
|
||||
<form name="addSite" id="addSite" action="addSite.php" method="post">
|
||||
<div class="input-field">
|
||||
<label for="siteName">Nom</label>
|
||||
<input type="text" class="validate" id="siteName" name="siteName" placeholder="Site" required/>
|
||||
</div>
|
||||
<button type="submit" class="btn-floating halfway-fab waves-effect waves-light teal"><i class="material-icons">add</i></button>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
45
style.css
45
style.css
@ -1,45 +0,0 @@
|
||||
body {
|
||||
margin: auto 1em;
|
||||
}
|
||||
|
||||
header {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
li {
|
||||
list-style: none;
|
||||
}
|
||||
|
||||
table {
|
||||
border-collapse: collapse;
|
||||
}
|
||||
|
||||
th, td {
|
||||
border: solid 1px;
|
||||
}
|
||||
|
||||
td {
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
td input {
|
||||
border: 0;
|
||||
background-repeat: no-repeat;
|
||||
background-position: right center;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.add {
|
||||
display: grid;
|
||||
grid-template-columns: 1fr 2fr;
|
||||
grid-gap: 1em;
|
||||
}
|
||||
.add button {
|
||||
width: 100%;
|
||||
margin: auto;
|
||||
grid-column: 1/3;
|
||||
}
|
||||
|
||||
footer {
|
||||
text-align: center;
|
||||
}
|
||||
Loading…
x
Reference in New Issue
Block a user