First Update
This commit is contained in:
Erreur32
commit
d3518e0738
32 changed files with 19746 additions and 0 deletions
1
.gitignore
vendored
Normal file
1
.gitignore
vendored
Normal file
|
|
@ -0,0 +1 @@
|
|||
.DS_Store
|
||||
1
Aide.txt
Normal file
1
Aide.txt
Normal file
|
|
@ -0,0 +1 @@
|
|||
ssl-checks.sh --host echosystem.fr --end > SSL.txt
|
||||
21
LICENSE
Normal file
21
LICENSE
Normal file
|
|
@ -0,0 +1,21 @@
|
|||
The MIT License (MIT)
|
||||
|
||||
Copyright (c) 2014 p1rox
|
||||
|
||||
Permission is hereby granted, free of charge, to any person obtaining a copy
|
||||
of this software and associated documentation files (the "Software"), to deal
|
||||
in the Software without restriction, including without limitation the rights
|
||||
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
||||
copies of the Software, and to permit persons to whom the Software is
|
||||
furnished to do so, subject to the following conditions:
|
||||
|
||||
The above copyright notice and this permission notice shall be included in all
|
||||
copies or substantial portions of the Software.
|
||||
|
||||
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
||||
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
||||
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
||||
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
||||
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
||||
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
||||
SOFTWARE.
|
||||
40
README.md
Normal file
40
README.md
Normal file
|
|
@ -0,0 +1,40 @@
|
|||
# Check Server Status
|
||||
|
||||
PHP Script that check if a server is online or not.
|
||||
|
||||
Need php5.4
|
||||
|
||||
|
||||
## Installation
|
||||
- Clone this repo in your web folder.
|
||||
- Add your servers in web page !
|
||||
|
||||
|
||||
### SSL check (Optional)
|
||||
|
||||
for checking SSL information on hostname need to run the script in console
|
||||
|
||||
- Need the script bash `./ssl-checks.sh`
|
||||
- dependance needed: `apt-get install openssl`
|
||||
|
||||
Exemple:
|
||||
```bash
|
||||
cd /path/Check-Server-Status
|
||||
ssl-checks.sh --host echosystem.fr --end > SSL.txt
|
||||
```
|
||||
|
||||
## Update
|
||||
|
||||
- backup your servers.xml.
|
||||
- In the root directory make : `git pull`
|
||||
|
||||
|
||||
## Screenshot
|
||||
|
||||
|
||||
|
||||
|
||||
## Feel free to contact me
|
||||
|
||||
|
||||
#### Fork of https://github.com/MTco/Check-Server-Status
|
||||
1
SSL.txt
Normal file
1
SSL.txt
Normal file
|
|
@ -0,0 +1 @@
|
|||
2024-01-29 23:01:55 CET
|
||||
177
ServerMonitor.php
Normal file
177
ServerMonitor.php
Normal file
|
|
@ -0,0 +1,177 @@
|
|||
<?php
|
||||
|
||||
class ServerMonitor {
|
||||
|
||||
static function getCpu() {
|
||||
$obj = new stdClass();
|
||||
$cmd = "cat /proc/cpuinfo";
|
||||
exec($cmd . " 2>&1", $output, $return_val);
|
||||
if ($return_val !== 0) {
|
||||
$obj->error = "Get CPU ERROR** " . print_r($output, true);
|
||||
$obj->command = $cmd;
|
||||
} else {
|
||||
$obj->title = "";
|
||||
$obj->success = 1;
|
||||
$obj->output = $output;
|
||||
$obj->command = $cmd;
|
||||
$obj->percent = 0;
|
||||
$obj->percent = intval(self::getServerLoad());
|
||||
// find model name
|
||||
foreach ($output as $value) {
|
||||
if (preg_match("/model name.+:(.*)/i", $value, $match)) {
|
||||
$obj->title = $match[1];
|
||||
break;
|
||||
}
|
||||
}
|
||||
}
|
||||
return $obj;
|
||||
}
|
||||
|
||||
static function getMemory() {
|
||||
$obj = new stdClass();
|
||||
$cmd = "free";
|
||||
exec($cmd . " 2>&1", $output, $return_val);
|
||||
if ($return_val !== 0) {
|
||||
$obj->error = "Get Memmory ERROR** " . print_r($output, true);
|
||||
$obj->command = $cmd;
|
||||
} else {
|
||||
$obj->title = "";
|
||||
$obj->success = 1;
|
||||
$obj->output = $output;
|
||||
$obj->command = $cmd;
|
||||
$obj->memTotalBytes = 0;
|
||||
$obj->memUsedBytes = 0;
|
||||
$obj->memFreeBytes = 0;
|
||||
if (preg_match("/Mem: *([0-9]+) *([0-9]+) *([0-9]+) */i", $output[1], $match)) {
|
||||
$obj->memTotalBytes = $match[1]*1024;
|
||||
$obj->memUsedBytes = $match[2]*1024;
|
||||
$obj->memFreeBytes = $match[3]*1024;
|
||||
$onePc = $obj->memTotalBytes / 100;
|
||||
$obj->memTotal = self::humanFileSize($obj->memTotalBytes);
|
||||
$obj->memUsed = self::humanFileSize($obj->memUsedBytes);
|
||||
$obj->memFree = self::humanFileSize($obj->memFreeBytes);
|
||||
$obj->percent = intval($obj->memUsedBytes / $onePc);
|
||||
$obj->title = "Total: {$obj->memTotal} | Free: {$obj->memFree} | Used: {$obj->memUsed}";
|
||||
}
|
||||
}
|
||||
return $obj;
|
||||
}
|
||||
|
||||
static function getDisk() {
|
||||
$obj = new stdClass();
|
||||
$cmd = "df -h";
|
||||
exec($cmd . " 2>&1", $output, $return_val);
|
||||
if ($return_val !== 0) {
|
||||
$obj->error = "Get Disk ERROR** " . print_r($output, true);
|
||||
$obj->command = $cmd;
|
||||
} else {
|
||||
$obj->percent = 0;
|
||||
foreach ($output as $value) {
|
||||
if (preg_match("/([0-9]+)% \/$/i", $value, $match)) {
|
||||
$obj->percent = intval($match[1]);
|
||||
break;
|
||||
}
|
||||
}
|
||||
$obj->title = "Usage of {$obj->percent}%";
|
||||
$obj->success = 1;
|
||||
$obj->output = $output;
|
||||
$obj->command = $cmd;
|
||||
}
|
||||
return $obj;
|
||||
}
|
||||
|
||||
static function humanFileSize($size, $unit = "") {
|
||||
if ((!$unit && $size >= 1 << 30) || $unit == "GB")
|
||||
return number_format($size / (1 << 30), 2) . "GB";
|
||||
if ((!$unit && $size >= 1 << 20) || $unit == "MB")
|
||||
return number_format($size / (1 << 20), 2) . "MB";
|
||||
if ((!$unit && $size >= 1 << 10) || $unit == "KB")
|
||||
return number_format($size / (1 << 10), 2) . "KB";
|
||||
return number_format($size) . " bytes";
|
||||
}
|
||||
|
||||
static private function _getServerLoadLinuxData() {
|
||||
if (is_readable("/proc/stat")) {
|
||||
$stats = @file_get_contents("/proc/stat");
|
||||
|
||||
if ($stats !== false) {
|
||||
// Remove double spaces to make it easier to extract values with explode()
|
||||
$stats = preg_replace("/[[:blank:]]+/", " ", $stats);
|
||||
|
||||
// Separate lines
|
||||
$stats = str_replace(array("\r\n", "\n\r", "\r"), "\n", $stats);
|
||||
$stats = explode("\n", $stats);
|
||||
|
||||
// Separate values and find line for main CPU load
|
||||
foreach ($stats as $statLine) {
|
||||
$statLineData = explode(" ", trim($statLine));
|
||||
|
||||
// Found!
|
||||
if
|
||||
(
|
||||
(count($statLineData) >= 5) &&
|
||||
($statLineData[0] == "cpu")
|
||||
) {
|
||||
return array(
|
||||
$statLineData[1],
|
||||
$statLineData[2],
|
||||
$statLineData[3],
|
||||
$statLineData[4],
|
||||
);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
return null;
|
||||
}
|
||||
|
||||
// Returns server load in percent (just number, without percent sign)
|
||||
static function getServerLoad() {
|
||||
$load = null;
|
||||
|
||||
if (stristr(PHP_OS, "win")) {
|
||||
$cmd = "wmic cpu get loadpercentage /all";
|
||||
@exec($cmd, $output);
|
||||
|
||||
if ($output) {
|
||||
foreach ($output as $line) {
|
||||
if ($line && preg_match("/^[0-9]+\$/", $line)) {
|
||||
$load = $line;
|
||||
break;
|
||||
}
|
||||
}
|
||||
}
|
||||
} else {
|
||||
if (is_readable("/proc/stat")) {
|
||||
// Collect 2 samples - each with 1 second period
|
||||
// See: https://de.wikipedia.org/wiki/Load#Der_Load_Average_auf_Unix-Systemen
|
||||
$statData1 = self::_getServerLoadLinuxData();
|
||||
sleep(1);
|
||||
$statData2 = self::_getServerLoadLinuxData();
|
||||
|
||||
if
|
||||
(
|
||||
(!is_null($statData1)) &&
|
||||
(!is_null($statData2))
|
||||
) {
|
||||
// Get difference
|
||||
$statData2[0] -= $statData1[0];
|
||||
$statData2[1] -= $statData1[1];
|
||||
$statData2[2] -= $statData1[2];
|
||||
$statData2[3] -= $statData1[3];
|
||||
|
||||
// Sum up the 4 values for User, Nice, System and Idle and calculate
|
||||
// the percentage of idle time (which is part of the 4 values!)
|
||||
$cpuTime = $statData2[0] + $statData2[1] + $statData2[2] + $statData2[3];
|
||||
|
||||
// Invert percentage to get CPU time, not idle time
|
||||
$load = 100 - ($statData2[3] * 100 / $cpuTime);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
return $load;
|
||||
}
|
||||
|
||||
}
|
||||
21
api.php
Normal file
21
api.php
Normal file
|
|
@ -0,0 +1,21 @@
|
|||
<?php
|
||||
function getStatus($ip, $port) {
|
||||
$socket = @fsockopen($ip, $port, $errorNo, $errorStr, 2);
|
||||
if (!$socket) return false;
|
||||
else return true;
|
||||
}
|
||||
|
||||
function parser() {
|
||||
$servers = simplexml_load_file("servers.xml");
|
||||
foreach ($servers as $server) {
|
||||
if (getStatus((string)$server->ip, (string)$server->port)) {
|
||||
$server->online = "true";
|
||||
}
|
||||
else {
|
||||
$server->online = "false";
|
||||
}
|
||||
}
|
||||
return $servers;
|
||||
}
|
||||
echo json_encode(parser(), JSON_UNESCAPED_SLASHES | JSON_PRETTY_PRINT);
|
||||
?>
|
||||
4
cpu.json.php
Normal file
4
cpu.json.php
Normal file
|
|
@ -0,0 +1,4 @@
|
|||
<?php
|
||||
require_once 'ServerMonitor.php';
|
||||
header('Content-Type: application/json');
|
||||
echo json_encode(ServerMonitor::getCpu());
|
||||
50
css/asPieProgress.css
Normal file
50
css/asPieProgress.css
Normal file
|
|
@ -0,0 +1,50 @@
|
|||
/**
|
||||
* jQuery asPieProgress v0.4.6
|
||||
* https://github.com/amazingSurge/jquery-asPieProgress
|
||||
*
|
||||
* Copyright (c) amazingSurge
|
||||
* Released under the LGPL-3.0 license
|
||||
*/
|
||||
.pie_progress {
|
||||
position: relative;
|
||||
text-align: center;
|
||||
|
||||
-webkit-transform-style: preserve-3d;
|
||||
|
||||
transform-style: preserve-3d;
|
||||
}
|
||||
.pie_progress__svg {
|
||||
position: relative;
|
||||
display: inline-block;
|
||||
width: 100%;
|
||||
padding-bottom: 100%;
|
||||
overflow: hidden;
|
||||
vertical-align: middle;
|
||||
}
|
||||
.pie_progress__svg svg {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
display: inline-block;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
margin: 0 auto;
|
||||
}
|
||||
.pie_progress__content, .pie_progress__number, .pie_progress__label, .pie_progress__icon {
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
-webkit-transform: translateY(-50%);
|
||||
-ms-transform: translateY(-50%);
|
||||
transform: translateY(-50%);
|
||||
}
|
||||
|
||||
.pie_progress__number {
|
||||
font-size: 42px;
|
||||
}
|
||||
|
||||
.pie_progress__label {
|
||||
margin-top: 32px;
|
||||
font-size: 12px;
|
||||
}
|
||||
8
css/asPieProgress.min.css
vendored
Normal file
8
css/asPieProgress.min.css
vendored
Normal file
|
|
@ -0,0 +1,8 @@
|
|||
/**
|
||||
* jQuery asPieProgress v0.4.6
|
||||
* https://github.com/amazingSurge/jquery-asPieProgress
|
||||
*
|
||||
* Copyright (c) amazingSurge
|
||||
* Released under the LGPL-3.0 license
|
||||
*/
|
||||
.pie_progress{position:relative;text-align:center;-webkit-transform-style:preserve-3d;transform-style:preserve-3d}.pie_progress__svg{position:relative;display:inline-block;width:100%;padding-bottom:100%;overflow:hidden;vertical-align:middle}.pie_progress__svg svg{position:absolute;top:0;left:0;display:inline-block;width:100%;height:100%;margin:0 auto}.pie_progress__content,.pie_progress__icon,.pie_progress__label,.pie_progress__number{position:absolute;top:50%;left:0;width:100%;-webkit-transform:translateY(-50%);-ms-transform:translateY(-50%);transform:translateY(-50%)}.pie_progress__number{font-size:42px}.pie_progress__label{margin-top:32px;font-size:12px}
|
||||
442
css/bootstrap-theme.css
vendored
Normal file
442
css/bootstrap-theme.css
vendored
Normal file
|
|
@ -0,0 +1,442 @@
|
|||
/*!
|
||||
* Bootstrap v3.2.0 (http://getbootstrap.com)
|
||||
* Copyright 2011-2014 Twitter, Inc.
|
||||
* Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
|
||||
*/
|
||||
|
||||
.btn-default,
|
||||
.btn-primary,
|
||||
.btn-success,
|
||||
.btn-info,
|
||||
.btn-warning,
|
||||
.btn-danger {
|
||||
text-shadow: 0 -1px 0 rgba(0, 0, 0, .2);
|
||||
-webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, .15), 0 1px 1px rgba(0, 0, 0, .075);
|
||||
box-shadow: inset 0 1px 0 rgba(255, 255, 255, .15), 0 1px 1px rgba(0, 0, 0, .075);
|
||||
}
|
||||
.btn-default:active,
|
||||
.btn-primary:active,
|
||||
.btn-success:active,
|
||||
.btn-info:active,
|
||||
.btn-warning:active,
|
||||
.btn-danger:active,
|
||||
.btn-default.active,
|
||||
.btn-primary.active,
|
||||
.btn-success.active,
|
||||
.btn-info.active,
|
||||
.btn-warning.active,
|
||||
.btn-danger.active {
|
||||
-webkit-box-shadow: inset 0 3px 5px rgba(0, 0, 0, .125);
|
||||
box-shadow: inset 0 3px 5px rgba(0, 0, 0, .125);
|
||||
}
|
||||
.btn:active,
|
||||
.btn.active {
|
||||
background-image: none;
|
||||
}
|
||||
.btn-default {
|
||||
text-shadow: 0 1px 0 #fff;
|
||||
background-image: -webkit-linear-gradient(top, #fff 0%, #e0e0e0 100%);
|
||||
background-image: -o-linear-gradient(top, #fff 0%, #e0e0e0 100%);
|
||||
background-image: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#e0e0e0));
|
||||
background-image: linear-gradient(to bottom, #fff 0%, #e0e0e0 100%);
|
||||
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffffff', endColorstr='#ffe0e0e0', GradientType=0);
|
||||
filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
|
||||
background-repeat: repeat-x;
|
||||
border-color: #dbdbdb;
|
||||
border-color: #ccc;
|
||||
}
|
||||
.btn-default:hover,
|
||||
.btn-default:focus {
|
||||
background-color: #e0e0e0;
|
||||
background-position: 0 -15px;
|
||||
}
|
||||
.btn-default:active,
|
||||
.btn-default.active {
|
||||
background-color: #e0e0e0;
|
||||
border-color: #dbdbdb;
|
||||
}
|
||||
.btn-default:disabled,
|
||||
.btn-default[disabled] {
|
||||
background-color: #e0e0e0;
|
||||
background-image: none;
|
||||
}
|
||||
.btn-primary {
|
||||
background-image: -webkit-linear-gradient(top, #428bca 0%, #2d6ca2 100%);
|
||||
background-image: -o-linear-gradient(top, #428bca 0%, #2d6ca2 100%);
|
||||
background-image: -webkit-gradient(linear, left top, left bottom, from(#428bca), to(#2d6ca2));
|
||||
background-image: linear-gradient(to bottom, #428bca 0%, #2d6ca2 100%);
|
||||
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff428bca', endColorstr='#ff2d6ca2', GradientType=0);
|
||||
filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
|
||||
background-repeat: repeat-x;
|
||||
border-color: #2b669a;
|
||||
}
|
||||
.btn-primary:hover,
|
||||
.btn-primary:focus {
|
||||
background-color: #2d6ca2;
|
||||
background-position: 0 -15px;
|
||||
}
|
||||
.btn-primary:active,
|
||||
.btn-primary.active {
|
||||
background-color: #2d6ca2;
|
||||
border-color: #2b669a;
|
||||
}
|
||||
.btn-primary:disabled,
|
||||
.btn-primary[disabled] {
|
||||
background-color: #2d6ca2;
|
||||
background-image: none;
|
||||
}
|
||||
.btn-success {
|
||||
background-image: -webkit-linear-gradient(top, #5cb85c 0%, #419641 100%);
|
||||
background-image: -o-linear-gradient(top, #5cb85c 0%, #419641 100%);
|
||||
background-image: -webkit-gradient(linear, left top, left bottom, from(#5cb85c), to(#419641));
|
||||
background-image: linear-gradient(to bottom, #5cb85c 0%, #419641 100%);
|
||||
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff5cb85c', endColorstr='#ff419641', GradientType=0);
|
||||
filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
|
||||
background-repeat: repeat-x;
|
||||
border-color: #3e8f3e;
|
||||
}
|
||||
.btn-success:hover,
|
||||
.btn-success:focus {
|
||||
background-color: #419641;
|
||||
background-position: 0 -15px;
|
||||
}
|
||||
.btn-success:active,
|
||||
.btn-success.active {
|
||||
background-color: #419641;
|
||||
border-color: #3e8f3e;
|
||||
}
|
||||
.btn-success:disabled,
|
||||
.btn-success[disabled] {
|
||||
background-color: #419641;
|
||||
background-image: none;
|
||||
}
|
||||
.btn-info {
|
||||
background-image: -webkit-linear-gradient(top, #5bc0de 0%, #2aabd2 100%);
|
||||
background-image: -o-linear-gradient(top, #5bc0de 0%, #2aabd2 100%);
|
||||
background-image: -webkit-gradient(linear, left top, left bottom, from(#5bc0de), to(#2aabd2));
|
||||
background-image: linear-gradient(to bottom, #5bc0de 0%, #2aabd2 100%);
|
||||
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff5bc0de', endColorstr='#ff2aabd2', GradientType=0);
|
||||
filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
|
||||
background-repeat: repeat-x;
|
||||
border-color: #28a4c9;
|
||||
}
|
||||
.btn-info:hover,
|
||||
.btn-info:focus {
|
||||
background-color: #2aabd2;
|
||||
background-position: 0 -15px;
|
||||
}
|
||||
.btn-info:active,
|
||||
.btn-info.active {
|
||||
background-color: #2aabd2;
|
||||
border-color: #28a4c9;
|
||||
}
|
||||
.btn-info:disabled,
|
||||
.btn-info[disabled] {
|
||||
background-color: #2aabd2;
|
||||
background-image: none;
|
||||
}
|
||||
.btn-warning {
|
||||
background-image: -webkit-linear-gradient(top, #f0ad4e 0%, #eb9316 100%);
|
||||
background-image: -o-linear-gradient(top, #f0ad4e 0%, #eb9316 100%);
|
||||
background-image: -webkit-gradient(linear, left top, left bottom, from(#f0ad4e), to(#eb9316));
|
||||
background-image: linear-gradient(to bottom, #f0ad4e 0%, #eb9316 100%);
|
||||
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fff0ad4e', endColorstr='#ffeb9316', GradientType=0);
|
||||
filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
|
||||
background-repeat: repeat-x;
|
||||
border-color: #e38d13;
|
||||
}
|
||||
.btn-warning:hover,
|
||||
.btn-warning:focus {
|
||||
background-color: #eb9316;
|
||||
background-position: 0 -15px;
|
||||
}
|
||||
.btn-warning:active,
|
||||
.btn-warning.active {
|
||||
background-color: #eb9316;
|
||||
border-color: #e38d13;
|
||||
}
|
||||
.btn-warning:disabled,
|
||||
.btn-warning[disabled] {
|
||||
background-color: #eb9316;
|
||||
background-image: none;
|
||||
}
|
||||
.btn-danger {
|
||||
background-image: -webkit-linear-gradient(top, #d9534f 0%, #c12e2a 100%);
|
||||
background-image: -o-linear-gradient(top, #d9534f 0%, #c12e2a 100%);
|
||||
background-image: -webkit-gradient(linear, left top, left bottom, from(#d9534f), to(#c12e2a));
|
||||
background-image: linear-gradient(to bottom, #d9534f 0%, #c12e2a 100%);
|
||||
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffd9534f', endColorstr='#ffc12e2a', GradientType=0);
|
||||
filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
|
||||
background-repeat: repeat-x;
|
||||
border-color: #b92c28;
|
||||
}
|
||||
.btn-danger:hover,
|
||||
.btn-danger:focus {
|
||||
background-color: #c12e2a;
|
||||
background-position: 0 -15px;
|
||||
}
|
||||
.btn-danger:active,
|
||||
.btn-danger.active {
|
||||
background-color: #c12e2a;
|
||||
border-color: #b92c28;
|
||||
}
|
||||
.btn-danger:disabled,
|
||||
.btn-danger[disabled] {
|
||||
background-color: #c12e2a;
|
||||
background-image: none;
|
||||
}
|
||||
.thumbnail,
|
||||
.img-thumbnail {
|
||||
-webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, .075);
|
||||
box-shadow: 0 1px 2px rgba(0, 0, 0, .075);
|
||||
}
|
||||
.dropdown-menu > li > a:hover,
|
||||
.dropdown-menu > li > a:focus {
|
||||
background-color: #e8e8e8;
|
||||
background-image: -webkit-linear-gradient(top, #f5f5f5 0%, #e8e8e8 100%);
|
||||
background-image: -o-linear-gradient(top, #f5f5f5 0%, #e8e8e8 100%);
|
||||
background-image: -webkit-gradient(linear, left top, left bottom, from(#f5f5f5), to(#e8e8e8));
|
||||
background-image: linear-gradient(to bottom, #f5f5f5 0%, #e8e8e8 100%);
|
||||
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fff5f5f5', endColorstr='#ffe8e8e8', GradientType=0);
|
||||
background-repeat: repeat-x;
|
||||
}
|
||||
.dropdown-menu > .active > a,
|
||||
.dropdown-menu > .active > a:hover,
|
||||
.dropdown-menu > .active > a:focus {
|
||||
background-color: #357ebd;
|
||||
background-image: -webkit-linear-gradient(top, #428bca 0%, #357ebd 100%);
|
||||
background-image: -o-linear-gradient(top, #428bca 0%, #357ebd 100%);
|
||||
background-image: -webkit-gradient(linear, left top, left bottom, from(#428bca), to(#357ebd));
|
||||
background-image: linear-gradient(to bottom, #428bca 0%, #357ebd 100%);
|
||||
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff428bca', endColorstr='#ff357ebd', GradientType=0);
|
||||
background-repeat: repeat-x;
|
||||
}
|
||||
.navbar-default {
|
||||
background-image: -webkit-linear-gradient(top, #fff 0%, #f8f8f8 100%);
|
||||
background-image: -o-linear-gradient(top, #fff 0%, #f8f8f8 100%);
|
||||
background-image: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#f8f8f8));
|
||||
background-image: linear-gradient(to bottom, #fff 0%, #f8f8f8 100%);
|
||||
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffffff', endColorstr='#fff8f8f8', GradientType=0);
|
||||
filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
|
||||
background-repeat: repeat-x;
|
||||
border-radius: 4px;
|
||||
-webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, .15), 0 1px 5px rgba(0, 0, 0, .075);
|
||||
box-shadow: inset 0 1px 0 rgba(255, 255, 255, .15), 0 1px 5px rgba(0, 0, 0, .075);
|
||||
}
|
||||
.navbar-default .navbar-nav > .active > a {
|
||||
background-image: -webkit-linear-gradient(top, #ebebeb 0%, #f3f3f3 100%);
|
||||
background-image: -o-linear-gradient(top, #ebebeb 0%, #f3f3f3 100%);
|
||||
background-image: -webkit-gradient(linear, left top, left bottom, from(#ebebeb), to(#f3f3f3));
|
||||
background-image: linear-gradient(to bottom, #ebebeb 0%, #f3f3f3 100%);
|
||||
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffebebeb', endColorstr='#fff3f3f3', GradientType=0);
|
||||
background-repeat: repeat-x;
|
||||
-webkit-box-shadow: inset 0 3px 9px rgba(0, 0, 0, .075);
|
||||
box-shadow: inset 0 3px 9px rgba(0, 0, 0, .075);
|
||||
}
|
||||
.navbar-brand,
|
||||
.navbar-nav > li > a {
|
||||
text-shadow: 0 1px 0 rgba(255, 255, 255, .25);
|
||||
}
|
||||
.navbar-inverse {
|
||||
background-image: -webkit-linear-gradient(top, #3c3c3c 0%, #222 100%);
|
||||
background-image: -o-linear-gradient(top, #3c3c3c 0%, #222 100%);
|
||||
background-image: -webkit-gradient(linear, left top, left bottom, from(#3c3c3c), to(#222));
|
||||
background-image: linear-gradient(to bottom, #3c3c3c 0%, #222 100%);
|
||||
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff3c3c3c', endColorstr='#ff222222', GradientType=0);
|
||||
filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
|
||||
background-repeat: repeat-x;
|
||||
}
|
||||
.navbar-inverse .navbar-nav > .active > a {
|
||||
background-image: -webkit-linear-gradient(top, #222 0%, #282828 100%);
|
||||
background-image: -o-linear-gradient(top, #222 0%, #282828 100%);
|
||||
background-image: -webkit-gradient(linear, left top, left bottom, from(#222), to(#282828));
|
||||
background-image: linear-gradient(to bottom, #222 0%, #282828 100%);
|
||||
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff222222', endColorstr='#ff282828', GradientType=0);
|
||||
background-repeat: repeat-x;
|
||||
-webkit-box-shadow: inset 0 3px 9px rgba(0, 0, 0, .25);
|
||||
box-shadow: inset 0 3px 9px rgba(0, 0, 0, .25);
|
||||
}
|
||||
.navbar-inverse .navbar-brand,
|
||||
.navbar-inverse .navbar-nav > li > a {
|
||||
text-shadow: 0 -1px 0 rgba(0, 0, 0, .25);
|
||||
}
|
||||
.navbar-static-top,
|
||||
.navbar-fixed-top,
|
||||
.navbar-fixed-bottom {
|
||||
border-radius: 0;
|
||||
}
|
||||
.alert {
|
||||
text-shadow: 0 1px 0 rgba(255, 255, 255, .2);
|
||||
-webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, .25), 0 1px 2px rgba(0, 0, 0, .05);
|
||||
box-shadow: inset 0 1px 0 rgba(255, 255, 255, .25), 0 1px 2px rgba(0, 0, 0, .05);
|
||||
}
|
||||
.alert-success {
|
||||
background-image: -webkit-linear-gradient(top, #dff0d8 0%, #c8e5bc 100%);
|
||||
background-image: -o-linear-gradient(top, #dff0d8 0%, #c8e5bc 100%);
|
||||
background-image: -webkit-gradient(linear, left top, left bottom, from(#dff0d8), to(#c8e5bc));
|
||||
background-image: linear-gradient(to bottom, #dff0d8 0%, #c8e5bc 100%);
|
||||
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffdff0d8', endColorstr='#ffc8e5bc', GradientType=0);
|
||||
background-repeat: repeat-x;
|
||||
border-color: #b2dba1;
|
||||
}
|
||||
.alert-info {
|
||||
background-image: -webkit-linear-gradient(top, #d9edf7 0%, #b9def0 100%);
|
||||
background-image: -o-linear-gradient(top, #d9edf7 0%, #b9def0 100%);
|
||||
background-image: -webkit-gradient(linear, left top, left bottom, from(#d9edf7), to(#b9def0));
|
||||
background-image: linear-gradient(to bottom, #d9edf7 0%, #b9def0 100%);
|
||||
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffd9edf7', endColorstr='#ffb9def0', GradientType=0);
|
||||
background-repeat: repeat-x;
|
||||
border-color: #9acfea;
|
||||
}
|
||||
.alert-warning {
|
||||
background-image: -webkit-linear-gradient(top, #fcf8e3 0%, #f8efc0 100%);
|
||||
background-image: -o-linear-gradient(top, #fcf8e3 0%, #f8efc0 100%);
|
||||
background-image: -webkit-gradient(linear, left top, left bottom, from(#fcf8e3), to(#f8efc0));
|
||||
background-image: linear-gradient(to bottom, #fcf8e3 0%, #f8efc0 100%);
|
||||
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fffcf8e3', endColorstr='#fff8efc0', GradientType=0);
|
||||
background-repeat: repeat-x;
|
||||
border-color: #f5e79e;
|
||||
}
|
||||
.alert-danger {
|
||||
background-image: -webkit-linear-gradient(top, #f2dede 0%, #e7c3c3 100%);
|
||||
background-image: -o-linear-gradient(top, #f2dede 0%, #e7c3c3 100%);
|
||||
background-image: -webkit-gradient(linear, left top, left bottom, from(#f2dede), to(#e7c3c3));
|
||||
background-image: linear-gradient(to bottom, #f2dede 0%, #e7c3c3 100%);
|
||||
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fff2dede', endColorstr='#ffe7c3c3', GradientType=0);
|
||||
background-repeat: repeat-x;
|
||||
border-color: #dca7a7;
|
||||
}
|
||||
.progress {
|
||||
background-image: -webkit-linear-gradient(top, #ebebeb 0%, #f5f5f5 100%);
|
||||
background-image: -o-linear-gradient(top, #ebebeb 0%, #f5f5f5 100%);
|
||||
background-image: -webkit-gradient(linear, left top, left bottom, from(#ebebeb), to(#f5f5f5));
|
||||
background-image: linear-gradient(to bottom, #ebebeb 0%, #f5f5f5 100%);
|
||||
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffebebeb', endColorstr='#fff5f5f5', GradientType=0);
|
||||
background-repeat: repeat-x;
|
||||
}
|
||||
.progress-bar {
|
||||
background-image: -webkit-linear-gradient(top, #428bca 0%, #3071a9 100%);
|
||||
background-image: -o-linear-gradient(top, #428bca 0%, #3071a9 100%);
|
||||
background-image: -webkit-gradient(linear, left top, left bottom, from(#428bca), to(#3071a9));
|
||||
background-image: linear-gradient(to bottom, #428bca 0%, #3071a9 100%);
|
||||
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff428bca', endColorstr='#ff3071a9', GradientType=0);
|
||||
background-repeat: repeat-x;
|
||||
}
|
||||
.progress-bar-success {
|
||||
background-image: -webkit-linear-gradient(top, #5cb85c 0%, #449d44 100%);
|
||||
background-image: -o-linear-gradient(top, #5cb85c 0%, #449d44 100%);
|
||||
background-image: -webkit-gradient(linear, left top, left bottom, from(#5cb85c), to(#449d44));
|
||||
background-image: linear-gradient(to bottom, #5cb85c 0%, #449d44 100%);
|
||||
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff5cb85c', endColorstr='#ff449d44', GradientType=0);
|
||||
background-repeat: repeat-x;
|
||||
}
|
||||
.progress-bar-info {
|
||||
background-image: -webkit-linear-gradient(top, #5bc0de 0%, #31b0d5 100%);
|
||||
background-image: -o-linear-gradient(top, #5bc0de 0%, #31b0d5 100%);
|
||||
background-image: -webkit-gradient(linear, left top, left bottom, from(#5bc0de), to(#31b0d5));
|
||||
background-image: linear-gradient(to bottom, #5bc0de 0%, #31b0d5 100%);
|
||||
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff5bc0de', endColorstr='#ff31b0d5', GradientType=0);
|
||||
background-repeat: repeat-x;
|
||||
}
|
||||
.progress-bar-warning {
|
||||
background-image: -webkit-linear-gradient(top, #f0ad4e 0%, #ec971f 100%);
|
||||
background-image: -o-linear-gradient(top, #f0ad4e 0%, #ec971f 100%);
|
||||
background-image: -webkit-gradient(linear, left top, left bottom, from(#f0ad4e), to(#ec971f));
|
||||
background-image: linear-gradient(to bottom, #f0ad4e 0%, #ec971f 100%);
|
||||
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fff0ad4e', endColorstr='#ffec971f', GradientType=0);
|
||||
background-repeat: repeat-x;
|
||||
}
|
||||
.progress-bar-danger {
|
||||
background-image: -webkit-linear-gradient(top, #d9534f 0%, #c9302c 100%);
|
||||
background-image: -o-linear-gradient(top, #d9534f 0%, #c9302c 100%);
|
||||
background-image: -webkit-gradient(linear, left top, left bottom, from(#d9534f), to(#c9302c));
|
||||
background-image: linear-gradient(to bottom, #d9534f 0%, #c9302c 100%);
|
||||
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffd9534f', endColorstr='#ffc9302c', GradientType=0);
|
||||
background-repeat: repeat-x;
|
||||
}
|
||||
.progress-bar-striped {
|
||||
background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, .15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, .15) 50%, rgba(255, 255, 255, .15) 75%, transparent 75%, transparent);
|
||||
background-image: -o-linear-gradient(45deg, rgba(255, 255, 255, .15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, .15) 50%, rgba(255, 255, 255, .15) 75%, transparent 75%, transparent);
|
||||
background-image: linear-gradient(45deg, rgba(255, 255, 255, .15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, .15) 50%, rgba(255, 255, 255, .15) 75%, transparent 75%, transparent);
|
||||
}
|
||||
.list-group {
|
||||
border-radius: 4px;
|
||||
-webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, .075);
|
||||
box-shadow: 0 1px 2px rgba(0, 0, 0, .075);
|
||||
}
|
||||
.list-group-item.active,
|
||||
.list-group-item.active:hover,
|
||||
.list-group-item.active:focus {
|
||||
text-shadow: 0 -1px 0 #3071a9;
|
||||
background-image: -webkit-linear-gradient(top, #428bca 0%, #3278b3 100%);
|
||||
background-image: -o-linear-gradient(top, #428bca 0%, #3278b3 100%);
|
||||
background-image: -webkit-gradient(linear, left top, left bottom, from(#428bca), to(#3278b3));
|
||||
background-image: linear-gradient(to bottom, #428bca 0%, #3278b3 100%);
|
||||
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff428bca', endColorstr='#ff3278b3', GradientType=0);
|
||||
background-repeat: repeat-x;
|
||||
border-color: #3278b3;
|
||||
}
|
||||
.panel {
|
||||
-webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, .05);
|
||||
box-shadow: 0 1px 2px rgba(0, 0, 0, .05);
|
||||
}
|
||||
.panel-default > .panel-heading {
|
||||
background-image: -webkit-linear-gradient(top, #f5f5f5 0%, #e8e8e8 100%);
|
||||
background-image: -o-linear-gradient(top, #f5f5f5 0%, #e8e8e8 100%);
|
||||
background-image: -webkit-gradient(linear, left top, left bottom, from(#f5f5f5), to(#e8e8e8));
|
||||
background-image: linear-gradient(to bottom, #f5f5f5 0%, #e8e8e8 100%);
|
||||
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fff5f5f5', endColorstr='#ffe8e8e8', GradientType=0);
|
||||
background-repeat: repeat-x;
|
||||
}
|
||||
.panel-primary > .panel-heading {
|
||||
background-image: -webkit-linear-gradient(top, #428bca 0%, #357ebd 100%);
|
||||
background-image: -o-linear-gradient(top, #428bca 0%, #357ebd 100%);
|
||||
background-image: -webkit-gradient(linear, left top, left bottom, from(#428bca), to(#357ebd));
|
||||
background-image: linear-gradient(to bottom, #428bca 0%, #357ebd 100%);
|
||||
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff428bca', endColorstr='#ff357ebd', GradientType=0);
|
||||
background-repeat: repeat-x;
|
||||
}
|
||||
.panel-success > .panel-heading {
|
||||
background-image: -webkit-linear-gradient(top, #dff0d8 0%, #d0e9c6 100%);
|
||||
background-image: -o-linear-gradient(top, #dff0d8 0%, #d0e9c6 100%);
|
||||
background-image: -webkit-gradient(linear, left top, left bottom, from(#dff0d8), to(#d0e9c6));
|
||||
background-image: linear-gradient(to bottom, #dff0d8 0%, #d0e9c6 100%);
|
||||
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffdff0d8', endColorstr='#ffd0e9c6', GradientType=0);
|
||||
background-repeat: repeat-x;
|
||||
}
|
||||
.panel-info > .panel-heading {
|
||||
background-image: -webkit-linear-gradient(top, #d9edf7 0%, #c4e3f3 100%);
|
||||
background-image: -o-linear-gradient(top, #d9edf7 0%, #c4e3f3 100%);
|
||||
background-image: -webkit-gradient(linear, left top, left bottom, from(#d9edf7), to(#c4e3f3));
|
||||
background-image: linear-gradient(to bottom, #d9edf7 0%, #c4e3f3 100%);
|
||||
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffd9edf7', endColorstr='#ffc4e3f3', GradientType=0);
|
||||
background-repeat: repeat-x;
|
||||
}
|
||||
.panel-warning > .panel-heading {
|
||||
background-image: -webkit-linear-gradient(top, #fcf8e3 0%, #faf2cc 100%);
|
||||
background-image: -o-linear-gradient(top, #fcf8e3 0%, #faf2cc 100%);
|
||||
background-image: -webkit-gradient(linear, left top, left bottom, from(#fcf8e3), to(#faf2cc));
|
||||
background-image: linear-gradient(to bottom, #fcf8e3 0%, #faf2cc 100%);
|
||||
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fffcf8e3', endColorstr='#fffaf2cc', GradientType=0);
|
||||
background-repeat: repeat-x;
|
||||
}
|
||||
.panel-danger > .panel-heading {
|
||||
background-image: -webkit-linear-gradient(top, #f2dede 0%, #ebcccc 100%);
|
||||
background-image: -o-linear-gradient(top, #f2dede 0%, #ebcccc 100%);
|
||||
background-image: -webkit-gradient(linear, left top, left bottom, from(#f2dede), to(#ebcccc));
|
||||
background-image: linear-gradient(to bottom, #f2dede 0%, #ebcccc 100%);
|
||||
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fff2dede', endColorstr='#ffebcccc', GradientType=0);
|
||||
background-repeat: repeat-x;
|
||||
}
|
||||
.well {
|
||||
background-image: -webkit-linear-gradient(top, #e8e8e8 0%, #f5f5f5 100%);
|
||||
background-image: -o-linear-gradient(top, #e8e8e8 0%, #f5f5f5 100%);
|
||||
background-image: -webkit-gradient(linear, left top, left bottom, from(#e8e8e8), to(#f5f5f5));
|
||||
background-image: linear-gradient(to bottom, #e8e8e8 0%, #f5f5f5 100%);
|
||||
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffe8e8e8', endColorstr='#fff5f5f5', GradientType=0);
|
||||
background-repeat: repeat-x;
|
||||
border-color: #dcdcdc;
|
||||
-webkit-box-shadow: inset 0 1px 3px rgba(0, 0, 0, .05), 0 1px 0 rgba(255, 255, 255, .1);
|
||||
box-shadow: inset 0 1px 3px rgba(0, 0, 0, .05), 0 1px 0 rgba(255, 255, 255, .1);
|
||||
}
|
||||
/*# sourceMappingURL=bootstrap-theme.css.map */
|
||||
1
css/bootstrap-theme.css.map
Normal file
1
css/bootstrap-theme.css.map
Normal file
File diff suppressed because one or more lines are too long
6203
css/bootstrap.css
vendored
Normal file
6203
css/bootstrap.css
vendored
Normal file
File diff suppressed because it is too large
Load diff
1
css/bootstrap.css.map
Normal file
1
css/bootstrap.css.map
Normal file
File diff suppressed because one or more lines are too long
24
darktheme.js
Normal file
24
darktheme.js
Normal file
|
|
@ -0,0 +1,24 @@
|
|||
document.addEventListener('DOMContentLoaded', function() {
|
||||
const themeToggle = document.getElementById('theme-toggle');
|
||||
const body = document.body;
|
||||
|
||||
// Vérifiez le thème actuel au chargement de la page
|
||||
if (localStorage.getItem('theme') === 'dark-mode') {
|
||||
body.classList.add('dark-mode');
|
||||
} else {
|
||||
body.classList.add('light-mode');
|
||||
}
|
||||
|
||||
// Ajoutez un écouteur d'événements pour basculer entre les thèmes
|
||||
themeToggle.addEventListener('click', () => {
|
||||
body.classList.toggle('dark-mode');
|
||||
body.classList.toggle('light-mode');
|
||||
|
||||
// Enregistrez le thème actuel dans le stockage local
|
||||
if (body.classList.contains('dark-mode')) {
|
||||
localStorage.setItem('theme', 'dark-mode');
|
||||
} else {
|
||||
localStorage.setItem('theme', 'light-mode');
|
||||
}
|
||||
});
|
||||
});
|
||||
4
disk.json.php
Normal file
4
disk.json.php
Normal file
|
|
@ -0,0 +1,4 @@
|
|||
<?php
|
||||
require_once 'ServerMonitor.php';
|
||||
header('Content-Type: application/json');
|
||||
echo json_encode(ServerMonitor::getDisk());
|
||||
BIN
favicon.png
Normal file
BIN
favicon.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 26 KiB |
50
gauge/css/asPieProgress.css
Normal file
50
gauge/css/asPieProgress.css
Normal file
|
|
@ -0,0 +1,50 @@
|
|||
/**
|
||||
* jQuery asPieProgress v0.4.6
|
||||
* https://github.com/amazingSurge/jquery-asPieProgress
|
||||
*
|
||||
* Copyright (c) amazingSurge
|
||||
* Released under the LGPL-3.0 license
|
||||
*/
|
||||
.pie_progress {
|
||||
position: relative;
|
||||
text-align: center;
|
||||
|
||||
-webkit-transform-style: preserve-3d;
|
||||
|
||||
transform-style: preserve-3d;
|
||||
}
|
||||
.pie_progress__svg {
|
||||
position: relative;
|
||||
display: inline-block;
|
||||
width: 100%;
|
||||
padding-bottom: 100%;
|
||||
overflow: hidden;
|
||||
vertical-align: middle;
|
||||
}
|
||||
.pie_progress__svg svg {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
display: inline-block;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
margin: 0 auto;
|
||||
}
|
||||
.pie_progress__content, .pie_progress__number, .pie_progress__label, .pie_progress__icon {
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
-webkit-transform: translateY(-50%);
|
||||
-ms-transform: translateY(-50%);
|
||||
transform: translateY(-50%);
|
||||
}
|
||||
|
||||
.pie_progress__number {
|
||||
font-size: 42px;
|
||||
}
|
||||
|
||||
.pie_progress__label {
|
||||
margin-top: 32px;
|
||||
font-size: 12px;
|
||||
}
|
||||
8
gauge/css/asPieProgress.min.css
vendored
Normal file
8
gauge/css/asPieProgress.min.css
vendored
Normal file
|
|
@ -0,0 +1,8 @@
|
|||
/**
|
||||
* jQuery asPieProgress v0.4.6
|
||||
* https://github.com/amazingSurge/jquery-asPieProgress
|
||||
*
|
||||
* Copyright (c) amazingSurge
|
||||
* Released under the LGPL-3.0 license
|
||||
*/
|
||||
.pie_progress{position:relative;text-align:center;-webkit-transform-style:preserve-3d;transform-style:preserve-3d}.pie_progress__svg{position:relative;display:inline-block;width:100%;padding-bottom:100%;overflow:hidden;vertical-align:middle}.pie_progress__svg svg{position:absolute;top:0;left:0;display:inline-block;width:100%;height:100%;margin:0 auto}.pie_progress__content,.pie_progress__icon,.pie_progress__label,.pie_progress__number{position:absolute;top:50%;left:0;width:100%;-webkit-transform:translateY(-50%);-ms-transform:translateY(-50%);transform:translateY(-50%)}.pie_progress__number{font-size:42px}.pie_progress__label{margin-top:32px;font-size:12px}
|
||||
519
gauge/jquery-asPieProgress.es.js
Normal file
519
gauge/jquery-asPieProgress.es.js
Normal file
|
|
@ -0,0 +1,519 @@
|
|||
/**
|
||||
* jQuery asPieProgress v0.4.6
|
||||
* https://github.com/amazingSurge/jquery-asPieProgress
|
||||
*
|
||||
* Copyright (c) amazingSurge
|
||||
* Released under the LGPL-3.0 license
|
||||
*/
|
||||
import $ from 'jquery';
|
||||
|
||||
const SvgElement = (tag, attrs) => {
|
||||
'use strict';
|
||||
const elem = document.createElementNS('http://www.w3.org/2000/svg', tag);
|
||||
|
||||
if (!attrs) {
|
||||
return elem;
|
||||
}
|
||||
|
||||
for (let key in attrs) {
|
||||
if (!Object.hasOwnProperty.call(attrs, key)) {
|
||||
continue;
|
||||
}
|
||||
|
||||
elem.setAttribute(key, attrs[key]);
|
||||
}
|
||||
return elem;
|
||||
};
|
||||
|
||||
if (!Date.now) {
|
||||
Date.now = () => {
|
||||
'use strict';
|
||||
return new Date().getTime();
|
||||
};
|
||||
}
|
||||
|
||||
const vendors = ['webkit', 'moz'];
|
||||
for (let i = 0; i < vendors.length && !window.requestAnimationFrame; ++i) {
|
||||
const vp = vendors[i];
|
||||
window.requestAnimationFrame = window[`${vp}RequestAnimationFrame`];
|
||||
window.cancelAnimationFrame = (window[`${vp}CancelAnimationFrame`] || window[`${vp}CancelRequestAnimationFrame`]);
|
||||
}
|
||||
|
||||
if (/iP(ad|hone|od).*OS (6|7|8)/.test(window.navigator.userAgent) // iOS6 is buggy
|
||||
||
|
||||
!window.requestAnimationFrame || !window.cancelAnimationFrame) {
|
||||
let lastTime = 0;
|
||||
window.requestAnimationFrame = callback => {
|
||||
'use strict';
|
||||
const now = getTime();
|
||||
const nextTime = Math.max(lastTime + 16, now);
|
||||
return setTimeout(() => {
|
||||
callback(lastTime = nextTime);
|
||||
},
|
||||
nextTime - now);
|
||||
};
|
||||
window.cancelAnimationFrame = clearTimeout;
|
||||
}
|
||||
|
||||
const getTime = () => {
|
||||
if (typeof window.performance !== 'undefined' && window.performance.now) {
|
||||
return window.performance.now();
|
||||
}
|
||||
return Date.now();
|
||||
};
|
||||
|
||||
const isPercentage = (n) => {
|
||||
'use strict';
|
||||
|
||||
return typeof n === 'string' && n.indexOf('%') !== -1;
|
||||
};
|
||||
|
||||
const svgSupported = 'createElementNS' in document && new SvgElement('svg', {}).createSVGRect;
|
||||
|
||||
const easingBezier = (mX1, mY1, mX2, mY2) => {
|
||||
'use strict';
|
||||
|
||||
const a = (aA1, aA2) => {
|
||||
return 1.0 - 3.0 * aA2 + 3.0 * aA1;
|
||||
};
|
||||
|
||||
const b = (aA1, aA2) => {
|
||||
return 3.0 * aA2 - 6.0 * aA1;
|
||||
};
|
||||
|
||||
const c = (aA1) => {
|
||||
return 3.0 * aA1;
|
||||
};
|
||||
|
||||
// Returns x(t) given t, x1, and x2, or y(t) given t, y1, and y2.
|
||||
const calcBezier = (aT, aA1, aA2) => {
|
||||
return ((a(aA1, aA2) * aT + b(aA1, aA2)) * aT + c(aA1)) * aT;
|
||||
};
|
||||
|
||||
// Returns dx/dt given t, x1, and x2, or dy/dt given t, y1, and y2.
|
||||
const getSlope = (aT, aA1, aA2) => {
|
||||
return 3.0 * a(aA1, aA2) * aT * aT + 2.0 * b(aA1, aA2) * aT + c(aA1);
|
||||
};
|
||||
|
||||
const getTForX = (aX) => {
|
||||
// Newton raphson iteration
|
||||
let aGuessT = aX;
|
||||
for (let i = 0; i < 4; ++i) {
|
||||
let currentSlope = getSlope(aGuessT, mX1, mX2);
|
||||
if (currentSlope === 0.0) {
|
||||
return aGuessT;
|
||||
}
|
||||
let currentX = calcBezier(aGuessT, mX1, mX2) - aX;
|
||||
aGuessT -= currentX / currentSlope;
|
||||
}
|
||||
return aGuessT;
|
||||
};
|
||||
|
||||
if (mX1 === mY1 && mX2 === mY2) {
|
||||
return {
|
||||
css: 'linear',
|
||||
fn(aX) {
|
||||
return aX;
|
||||
}
|
||||
};
|
||||
}
|
||||
|
||||
return {
|
||||
css: `cubic-bezier(${mX1},${mY1},${mX2},${mY2})`,
|
||||
fn(aX) {
|
||||
return calcBezier(getTForX(aX), mY1, mY2);
|
||||
}
|
||||
};
|
||||
};
|
||||
|
||||
var EASING = {
|
||||
ease: easingBezier(0.25, 0.1, 0.25, 1.0),
|
||||
linear: easingBezier(0.00, 0.0, 1.00, 1.0),
|
||||
'ease-in': easingBezier(0.42, 0.0, 1.00, 1.0),
|
||||
'ease-out': easingBezier(0.00, 0.0, 0.58, 1.0),
|
||||
'ease-in-out': easingBezier(0.42, 0.0, 0.58, 1.0)
|
||||
};
|
||||
|
||||
var DEFAULTS = {
|
||||
namespace: 'asPieProgress',
|
||||
classes: {
|
||||
svg: 'pie_progress__svg',
|
||||
element: 'pie_progress',
|
||||
number: 'pie_progress__number',
|
||||
content: 'pie_progress__content'
|
||||
},
|
||||
min: 0,
|
||||
max: 100,
|
||||
goal: 100,
|
||||
size: 160,
|
||||
speed: 15, // speed of 1/100
|
||||
barcolor: '#ef1e25',
|
||||
barsize: '4',
|
||||
trackcolor: '#f2f2f2',
|
||||
fillcolor: 'none',
|
||||
easing: 'ease',
|
||||
numberCallback(n) {
|
||||
'use strict';
|
||||
const percentage = Math.round(this.getPercentage(n));
|
||||
return `${percentage}%`;
|
||||
},
|
||||
contentCallback: null
|
||||
};
|
||||
|
||||
const NAMESPACE$1 = 'asPieProgress';
|
||||
|
||||
class asPieProgress {
|
||||
constructor(element, options) {
|
||||
this.element = element;
|
||||
this.$element = $(element);
|
||||
|
||||
this.options = $.extend(true, {}, DEFAULTS, options, this.$element.data());
|
||||
this.namespace = this.options.namespace;
|
||||
|
||||
this.classes = this.options.classes;
|
||||
this.easing = EASING[this.options.easing] || EASING.ease;
|
||||
this.$element.addClass(this.classes.element);
|
||||
|
||||
this.min = this.$element.attr('aria-valuemin');
|
||||
this.max = this.$element.attr('aria-valuemax');
|
||||
this.min = this.min ? parseInt(this.min, 10) : this.options.min;
|
||||
this.max = this.max ? parseInt(this.max, 10) : this.options.max;
|
||||
this.first = this.$element.attr('aria-valuenow');
|
||||
this.first = this.first ? parseInt(this.first, 10) : (this.options.first ? this.options.first : this.min);
|
||||
this.now = this.first;
|
||||
this.goal = this.options.goal;
|
||||
|
||||
this._frameId = null;
|
||||
|
||||
this.initialized = false;
|
||||
|
||||
this._trigger('init');
|
||||
this.init();
|
||||
}
|
||||
|
||||
init() {
|
||||
this.$number = this.$element.find(`.${this.classes.number}`);
|
||||
this.$content = this.$element.find(`.${this.classes.content}`);
|
||||
|
||||
this.size = this.options.size;
|
||||
this.width = this.size;
|
||||
this.height = this.size;
|
||||
|
||||
this.prepare();
|
||||
|
||||
this.initialized = true;
|
||||
this._trigger('ready');
|
||||
}
|
||||
|
||||
prepare() {
|
||||
if (!svgSupported) {
|
||||
return;
|
||||
}
|
||||
|
||||
this.svg = new SvgElement('svg', {
|
||||
version: '1.1',
|
||||
preserveAspectRatio: 'xMinYMin meet',
|
||||
viewBox: `0 0 ${this.width} ${this.height}`
|
||||
});
|
||||
|
||||
this.buildTrack();
|
||||
this.buildBar();
|
||||
|
||||
$(`<div class="${this.classes.svg}"></div>`).append(this.svg).appendTo(this.$element);
|
||||
}
|
||||
|
||||
buildTrack() {
|
||||
const height = this.size,
|
||||
width = this.size;
|
||||
|
||||
const cx = width / 2,
|
||||
cy = height / 2;
|
||||
|
||||
const barsize = this.options.barsize;
|
||||
|
||||
const ellipse = new SvgElement('ellipse', {
|
||||
rx: cx - barsize / 2,
|
||||
ry: cy - barsize / 2,
|
||||
cx,
|
||||
cy,
|
||||
stroke: this.options.trackcolor,
|
||||
fill: this.options.fillcolor,
|
||||
'stroke-width': barsize
|
||||
});
|
||||
|
||||
this.svg.appendChild(ellipse);
|
||||
}
|
||||
|
||||
buildBar() {
|
||||
if (!svgSupported) {
|
||||
return;
|
||||
}
|
||||
|
||||
const path = new SvgElement('path', {
|
||||
fill: 'none',
|
||||
'stroke-width': this.options.barsize,
|
||||
stroke: this.options.barcolor
|
||||
});
|
||||
this.bar = path;
|
||||
this.svg.appendChild(path);
|
||||
|
||||
this._drawBar(this.first);
|
||||
this._updateBar();
|
||||
}
|
||||
|
||||
_drawBar(n) {
|
||||
if (!svgSupported) {
|
||||
return;
|
||||
}
|
||||
|
||||
this.barGoal = n;
|
||||
const height = this.size,
|
||||
width = this.size;
|
||||
|
||||
const cx = width / 2,
|
||||
cy = height / 2,
|
||||
startAngle = 0;
|
||||
|
||||
const barsize = this.options.barsize;
|
||||
|
||||
const r = Math.min(cx, cy) - barsize / 2;
|
||||
this.r = r;
|
||||
let percentage = this.getPercentage(n);
|
||||
|
||||
if (percentage === 100) {
|
||||
percentage -= 0.0001;
|
||||
}
|
||||
const endAngle = startAngle + percentage * Math.PI * 2 / 100;
|
||||
|
||||
const x1 = cx + r * Math.sin(startAngle),
|
||||
x2 = cx + r * Math.sin(endAngle),
|
||||
y1 = cy - r * Math.cos(startAngle),
|
||||
y2 = cy - r * Math.cos(endAngle);
|
||||
|
||||
// This is a flag for angles larger than than a half circle
|
||||
// It is required by the SVG arc drawing component
|
||||
let big = 0;
|
||||
if (endAngle - startAngle > Math.PI) {
|
||||
big = 1;
|
||||
}
|
||||
|
||||
// This string holds the path details
|
||||
const d = `M${x1},${y1} A${r},${r} 0 ${big} 1 ${x2},${y2}`;
|
||||
|
||||
this.bar.setAttribute('d', d);
|
||||
}
|
||||
|
||||
_updateBar() {
|
||||
if (!svgSupported) {
|
||||
return;
|
||||
}
|
||||
const percenage = this.getPercentage(this.now);
|
||||
|
||||
const length = this.bar.getTotalLength();
|
||||
const offset = length * (1 - percenage / this.getPercentage(this.barGoal));
|
||||
|
||||
this.bar.style.strokeDasharray = `${length} ${length}`;
|
||||
this.bar.style.strokeDashoffset = offset;
|
||||
}
|
||||
|
||||
_trigger(eventType, ...params) {
|
||||
const data = [this].concat(params);
|
||||
|
||||
// event
|
||||
this.$element.trigger(`${NAMESPACE$1}::${eventType}`, data);
|
||||
|
||||
// callback
|
||||
eventType = eventType.replace(/\b\w+\b/g, (word) => {
|
||||
return word.substring(0, 1).toUpperCase() + word.substring(1);
|
||||
});
|
||||
const onFunction = `on${eventType}`;
|
||||
|
||||
if (typeof this.options[onFunction] === 'function') {
|
||||
this.options[onFunction].apply(this, params);
|
||||
}
|
||||
}
|
||||
|
||||
// Return the percentage based on the current step
|
||||
getPercentage(n) {
|
||||
return 100 * (n - this.min) / (this.max - this.min);
|
||||
}
|
||||
|
||||
go(goal) {
|
||||
const that = this;
|
||||
this._clear();
|
||||
|
||||
if (isPercentage(goal)) {
|
||||
goal = parseInt(goal.replace('%', ''), 10);
|
||||
goal = Math.round(this.min + (goal / 100) * (this.max - this.min));
|
||||
}
|
||||
if (typeof goal === 'undefined') {
|
||||
goal = this.goal;
|
||||
}
|
||||
|
||||
if (goal > this.max) {
|
||||
goal = this.max;
|
||||
} else if (goal < this.min) {
|
||||
goal = this.min;
|
||||
}
|
||||
|
||||
if (this.barGoal < goal) {
|
||||
this._drawBar(goal);
|
||||
}
|
||||
|
||||
const start = that.now;
|
||||
const startTime = getTime();
|
||||
const endTime = startTime + Math.abs(start - goal) * 100 * that.options.speed / (that.max - that.min);
|
||||
|
||||
const animation = time => {
|
||||
let next;
|
||||
|
||||
if (time > endTime) {
|
||||
next = goal;
|
||||
} else {
|
||||
const distance = (time - startTime) / that.options.speed;
|
||||
next = Math.round(that.easing.fn(distance / 100) * (that.max - that.min));
|
||||
|
||||
if (goal > start) {
|
||||
next = start + next;
|
||||
if (next > goal) {
|
||||
next = goal;
|
||||
}
|
||||
} else {
|
||||
next = start - next;
|
||||
if (next < goal) {
|
||||
next = goal;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
that._update(next);
|
||||
if (next === goal) {
|
||||
window.cancelAnimationFrame(that._frameId);
|
||||
that._frameId = null;
|
||||
|
||||
if (that.now === that.goal) {
|
||||
that._trigger('finish');
|
||||
}
|
||||
} else {
|
||||
that._frameId = window.requestAnimationFrame(animation);
|
||||
}
|
||||
};
|
||||
|
||||
that._frameId = window.requestAnimationFrame(animation);
|
||||
}
|
||||
|
||||
_update(n) {
|
||||
this.now = n;
|
||||
|
||||
this._updateBar();
|
||||
|
||||
this.$element.attr('aria-valuenow', this.now);
|
||||
if (this.$number.length > 0 && typeof this.options.numberCallback === 'function') {
|
||||
this.$number.html(this.options.numberCallback.call(this, [this.now]));
|
||||
}
|
||||
if (this.$content.length > 0 && typeof this.options.contentCallback === 'function') {
|
||||
this.$content.html(this.options.contentCallback.call(this, [this.now]));
|
||||
}
|
||||
|
||||
this._trigger('update', n);
|
||||
}
|
||||
|
||||
_clear() {
|
||||
if (this._frameId) {
|
||||
window.cancelAnimationFrame(this._frameId);
|
||||
this._frameId = null;
|
||||
}
|
||||
}
|
||||
|
||||
get() {
|
||||
return this.now;
|
||||
}
|
||||
|
||||
start() {
|
||||
this._clear();
|
||||
this._trigger('start');
|
||||
this.go(this.goal);
|
||||
}
|
||||
|
||||
reset() {
|
||||
this._clear();
|
||||
this._drawBar(this.first);
|
||||
this._update(this.first);
|
||||
this._trigger('reset');
|
||||
}
|
||||
|
||||
stop() {
|
||||
this._clear();
|
||||
this._trigger('stop');
|
||||
}
|
||||
|
||||
finish() {
|
||||
this._clear();
|
||||
this._update(this.goal);
|
||||
this._trigger('finish');
|
||||
}
|
||||
|
||||
destroy() {
|
||||
this.$element.data(NAMESPACE$1, null);
|
||||
this._trigger('destroy');
|
||||
}
|
||||
|
||||
static registerEasing(name, ...args) {
|
||||
EASING[name] = easingBezier(...args);
|
||||
}
|
||||
|
||||
static getEasing(name) {
|
||||
return EASING[name];
|
||||
}
|
||||
|
||||
static setDefaults(options) {
|
||||
$.extend(true, DEFAULTS, $.isPlainObject(options) && options);
|
||||
}
|
||||
}
|
||||
|
||||
var info = {
|
||||
version:'0.4.6'
|
||||
};
|
||||
|
||||
const NAMESPACE = 'asPieProgress';
|
||||
const OtherAsPieProgress = $.fn.asPieProgress;
|
||||
|
||||
const jQueryAsPieProgress = function(options, ...args) {
|
||||
if (typeof options === 'string') {
|
||||
const method = options;
|
||||
|
||||
if (/^_/.test(method)) {
|
||||
return false;
|
||||
} else if ((/^(get)/.test(method))) {
|
||||
const instance = this.first().data(NAMESPACE);
|
||||
if (instance && typeof instance[method] === 'function') {
|
||||
return instance[method](...args);
|
||||
}
|
||||
} else {
|
||||
return this.each(function() {
|
||||
const instance = $.data(this, NAMESPACE);
|
||||
if (instance && typeof instance[method] === 'function') {
|
||||
instance[method](...args);
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
return this.each(function() {
|
||||
if (!$(this).data(NAMESPACE)) {
|
||||
$(this).data(NAMESPACE, new asPieProgress(this, options));
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
$.fn.asPieProgress = jQueryAsPieProgress;
|
||||
|
||||
$.asPieProgress = $.extend({
|
||||
setDefaults: asPieProgress.setDefaults,
|
||||
registerEasing: asPieProgress.registerEasing,
|
||||
getEasing: asPieProgress.getEasing,
|
||||
noConflict: function() {
|
||||
$.fn.asPieProgress = OtherAsPieProgress;
|
||||
return jQueryAsPieProgress;
|
||||
}
|
||||
}, info);
|
||||
685
gauge/jquery-asPieProgress.js
vendored
Normal file
685
gauge/jquery-asPieProgress.js
vendored
Normal file
|
|
@ -0,0 +1,685 @@
|
|||
/**
|
||||
* jQuery asPieProgress v0.4.6
|
||||
* https://github.com/amazingSurge/jquery-asPieProgress
|
||||
*
|
||||
* Copyright (c) amazingSurge
|
||||
* Released under the LGPL-3.0 license
|
||||
*/
|
||||
(function(global, factory) {
|
||||
if (typeof define === "function" && define.amd) {
|
||||
define(['jquery'], factory);
|
||||
} else if (typeof exports !== "undefined") {
|
||||
factory(require('jquery'));
|
||||
} else {
|
||||
var mod = {
|
||||
exports: {}
|
||||
};
|
||||
factory(global.jQuery);
|
||||
global.jqueryAsPieProgressEs = mod.exports;
|
||||
}
|
||||
})(this,
|
||||
|
||||
function(_jquery) {
|
||||
'use strict';
|
||||
|
||||
var _jquery2 = _interopRequireDefault(_jquery);
|
||||
|
||||
function _interopRequireDefault(obj) {
|
||||
return obj && obj.__esModule ? obj : {
|
||||
default: obj
|
||||
};
|
||||
}
|
||||
|
||||
var _typeof = typeof Symbol === "function" && typeof Symbol.iterator === "symbol" ?
|
||||
|
||||
function(obj) {
|
||||
return typeof obj;
|
||||
}
|
||||
:
|
||||
|
||||
function(obj) {
|
||||
return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj;
|
||||
};
|
||||
|
||||
function _classCallCheck(instance, Constructor) {
|
||||
if (!(instance instanceof Constructor)) {
|
||||
throw new TypeError("Cannot call a class as a function");
|
||||
}
|
||||
}
|
||||
|
||||
var _createClass = function() {
|
||||
function defineProperties(target, props) {
|
||||
for (var i = 0; i < props.length; i++) {
|
||||
var descriptor = props[i];
|
||||
descriptor.enumerable = descriptor.enumerable || false;
|
||||
descriptor.configurable = true;
|
||||
|
||||
if ("value" in descriptor)
|
||||
descriptor.writable = true;
|
||||
Object.defineProperty(target, descriptor.key, descriptor);
|
||||
}
|
||||
}
|
||||
|
||||
return function(Constructor, protoProps, staticProps) {
|
||||
if (protoProps)
|
||||
defineProperties(Constructor.prototype, protoProps);
|
||||
|
||||
if (staticProps)
|
||||
defineProperties(Constructor, staticProps);
|
||||
|
||||
return Constructor;
|
||||
};
|
||||
}();
|
||||
|
||||
var SvgElement = function SvgElement(tag, attrs) {
|
||||
'use strict';
|
||||
|
||||
var elem = document.createElementNS('http://www.w3.org/2000/svg', tag);
|
||||
|
||||
if (!attrs) {
|
||||
|
||||
return elem;
|
||||
}
|
||||
|
||||
for (var key in attrs) {
|
||||
|
||||
if (!Object.hasOwnProperty.call(attrs, key)) {
|
||||
continue;
|
||||
}
|
||||
|
||||
elem.setAttribute(key, attrs[key]);
|
||||
}
|
||||
|
||||
return elem;
|
||||
};
|
||||
|
||||
if (!Date.now) {
|
||||
Date.now = function() {
|
||||
'use strict';
|
||||
|
||||
return new Date().getTime();
|
||||
}
|
||||
;
|
||||
}
|
||||
|
||||
var vendors = ['webkit', 'moz'];
|
||||
|
||||
for (var i = 0; i < vendors.length && !window.requestAnimationFrame; ++i) {
|
||||
var vp = vendors[i];
|
||||
window.requestAnimationFrame = window[vp + 'RequestAnimationFrame'];
|
||||
window.cancelAnimationFrame = window[vp + 'CancelAnimationFrame'] || window[vp + 'CancelRequestAnimationFrame'];
|
||||
}
|
||||
|
||||
if (/iP(ad|hone|od).*OS (6|7|8)/.test(window.navigator.userAgent) // iOS6 is buggy
|
||||
|| !window.requestAnimationFrame || !window.cancelAnimationFrame) {
|
||||
(function() {
|
||||
var lastTime = 0;
|
||||
window.requestAnimationFrame = function(callback) {
|
||||
'use strict';
|
||||
|
||||
var now = getTime();
|
||||
var nextTime = Math.max(lastTime + 16, now);
|
||||
|
||||
return setTimeout(
|
||||
|
||||
function() {
|
||||
callback(lastTime = nextTime);
|
||||
}
|
||||
, nextTime - now);
|
||||
}
|
||||
;
|
||||
window.cancelAnimationFrame = clearTimeout;
|
||||
})();
|
||||
}
|
||||
|
||||
var getTime = function getTime() {
|
||||
if (typeof window.performance !== 'undefined' && window.performance.now) {
|
||||
|
||||
return window.performance.now();
|
||||
}
|
||||
|
||||
return Date.now();
|
||||
};
|
||||
|
||||
var isPercentage = function isPercentage(n) {
|
||||
'use strict';
|
||||
|
||||
return typeof n === 'string' && n.indexOf('%') !== -1;
|
||||
};
|
||||
|
||||
var svgSupported = 'createElementNS' in document && new SvgElement('svg', {}).createSVGRect;
|
||||
|
||||
var easingBezier = function easingBezier(mX1, mY1, mX2, mY2) {
|
||||
'use strict';
|
||||
|
||||
var a = function a(aA1, aA2) {
|
||||
return 1.0 - 3.0 * aA2 + 3.0 * aA1;
|
||||
};
|
||||
|
||||
var b = function b(aA1, aA2) {
|
||||
return 3.0 * aA2 - 6.0 * aA1;
|
||||
};
|
||||
|
||||
var c = function c(aA1) {
|
||||
return 3.0 * aA1;
|
||||
};
|
||||
|
||||
// Returns x(t) given t, x1, and x2, or y(t) given t, y1, and y2.
|
||||
var calcBezier = function calcBezier(aT, aA1, aA2) {
|
||||
return ((a(aA1, aA2) * aT + b(aA1, aA2)) * aT + c(aA1)) * aT;
|
||||
};
|
||||
|
||||
// Returns dx/dt given t, x1, and x2, or dy/dt given t, y1, and y2.
|
||||
var getSlope = function getSlope(aT, aA1, aA2) {
|
||||
return 3.0 * a(aA1, aA2) * aT * aT + 2.0 * b(aA1, aA2) * aT + c(aA1);
|
||||
};
|
||||
|
||||
var getTForX = function getTForX(aX) {
|
||||
// Newton raphson iteration
|
||||
var aGuessT = aX;
|
||||
|
||||
for (var _i = 0; _i < 4; ++_i) {
|
||||
var currentSlope = getSlope(aGuessT, mX1, mX2);
|
||||
|
||||
if (currentSlope === 0.0) {
|
||||
|
||||
return aGuessT;
|
||||
}
|
||||
var currentX = calcBezier(aGuessT, mX1, mX2) - aX;
|
||||
aGuessT -= currentX / currentSlope;
|
||||
}
|
||||
|
||||
return aGuessT;
|
||||
};
|
||||
|
||||
if (mX1 === mY1 && mX2 === mY2) {
|
||||
|
||||
return {
|
||||
css: 'linear',
|
||||
fn: function fn(aX) {
|
||||
return aX;
|
||||
}
|
||||
};
|
||||
}
|
||||
|
||||
return {
|
||||
css: 'cubic-bezier(' + mX1 + ',' + mY1 + ',' + mX2 + ',' + mY2 + ')',
|
||||
fn: function fn(aX) {
|
||||
return calcBezier(getTForX(aX), mY1, mY2);
|
||||
}
|
||||
};
|
||||
};
|
||||
|
||||
var EASING = {
|
||||
ease: easingBezier(0.25, 0.1, 0.25, 1.0),
|
||||
linear: easingBezier(0.00, 0.0, 1.00, 1.0),
|
||||
'ease-in': easingBezier(0.42, 0.0, 1.00, 1.0),
|
||||
'ease-out': easingBezier(0.00, 0.0, 0.58, 1.0),
|
||||
'ease-in-out': easingBezier(0.42, 0.0, 0.58, 1.0)
|
||||
};
|
||||
|
||||
var DEFAULTS = {
|
||||
namespace: 'asPieProgress',
|
||||
classes: {
|
||||
svg: 'pie_progress__svg',
|
||||
element: 'pie_progress',
|
||||
number: 'pie_progress__number',
|
||||
content: 'pie_progress__content'
|
||||
},
|
||||
min: 0,
|
||||
max: 100,
|
||||
goal: 100,
|
||||
size: 160,
|
||||
speed: 15, // speed of 1/100
|
||||
barcolor: '#ef1e25',
|
||||
barsize: '4',
|
||||
trackcolor: '#f2f2f2',
|
||||
fillcolor: 'none',
|
||||
easing: 'ease',
|
||||
numberCallback: function numberCallback(n) {
|
||||
'use strict';
|
||||
|
||||
var percentage = Math.round(this.getPercentage(n));
|
||||
|
||||
return percentage + '%';
|
||||
},
|
||||
|
||||
contentCallback: null
|
||||
};
|
||||
|
||||
var NAMESPACE$1 = 'asPieProgress';
|
||||
|
||||
var asPieProgress = function() {
|
||||
function asPieProgress(element, options) {
|
||||
_classCallCheck(this, asPieProgress);
|
||||
|
||||
this.element = element;
|
||||
this.$element = (0, _jquery2.default)(element);
|
||||
|
||||
this.options = _jquery2.default.extend(true, {}, DEFAULTS, options, this.$element.data());
|
||||
this.namespace = this.options.namespace;
|
||||
|
||||
this.classes = this.options.classes;
|
||||
this.easing = EASING[this.options.easing] || EASING.ease;
|
||||
this.$element.addClass(this.classes.element);
|
||||
|
||||
this.min = this.$element.attr('aria-valuemin');
|
||||
this.max = this.$element.attr('aria-valuemax');
|
||||
this.min = this.min ? parseInt(this.min, 10) : this.options.min;
|
||||
this.max = this.max ? parseInt(this.max, 10) : this.options.max;
|
||||
this.first = this.$element.attr('aria-valuenow');
|
||||
this.first = this.first ? parseInt(this.first, 10) : this.options.first ? this.options.first : this.min;
|
||||
this.now = this.first;
|
||||
this.goal = this.options.goal;
|
||||
|
||||
this._frameId = null;
|
||||
|
||||
this.initialized = false;
|
||||
|
||||
this._trigger('init');
|
||||
this.init();
|
||||
}
|
||||
|
||||
_createClass(asPieProgress, [{
|
||||
key: 'init',
|
||||
value: function init() {
|
||||
this.$number = this.$element.find('.' + this.classes.number);
|
||||
this.$content = this.$element.find('.' + this.classes.content);
|
||||
|
||||
this.size = this.options.size;
|
||||
this.width = this.size;
|
||||
this.height = this.size;
|
||||
|
||||
this.prepare();
|
||||
|
||||
this.initialized = true;
|
||||
this._trigger('ready');
|
||||
}
|
||||
}, {
|
||||
key: 'prepare',
|
||||
value: function prepare() {
|
||||
if (!svgSupported) {
|
||||
|
||||
return;
|
||||
}
|
||||
|
||||
this.svg = new SvgElement('svg', {
|
||||
version: '1.1',
|
||||
preserveAspectRatio: 'xMinYMin meet',
|
||||
viewBox: '0 0 ' + this.width + ' ' + this.height
|
||||
});
|
||||
|
||||
this.buildTrack();
|
||||
this.buildBar();
|
||||
|
||||
(0, _jquery2.default)('<div class="' + this.classes.svg + '"></div>').append(this.svg).appendTo(this.$element);
|
||||
}
|
||||
}, {
|
||||
key: 'buildTrack',
|
||||
value: function buildTrack() {
|
||||
var height = this.size,
|
||||
width = this.size;
|
||||
|
||||
var cx = width / 2,
|
||||
cy = height / 2;
|
||||
|
||||
var barsize = this.options.barsize;
|
||||
|
||||
var ellipse = new SvgElement('ellipse', {
|
||||
rx: cx - barsize / 2,
|
||||
ry: cy - barsize / 2,
|
||||
cx: cx,
|
||||
cy: cy,
|
||||
stroke: this.options.trackcolor,
|
||||
fill: this.options.fillcolor,
|
||||
'stroke-width': barsize
|
||||
});
|
||||
|
||||
this.svg.appendChild(ellipse);
|
||||
}
|
||||
}, {
|
||||
key: 'buildBar',
|
||||
value: function buildBar() {
|
||||
if (!svgSupported) {
|
||||
|
||||
return;
|
||||
}
|
||||
|
||||
var path = new SvgElement('path', {
|
||||
fill: 'none',
|
||||
'stroke-width': this.options.barsize,
|
||||
stroke: this.options.barcolor
|
||||
});
|
||||
this.bar = path;
|
||||
this.svg.appendChild(path);
|
||||
|
||||
this._drawBar(this.first);
|
||||
this._updateBar();
|
||||
}
|
||||
}, {
|
||||
key: '_drawBar',
|
||||
value: function _drawBar(n) {
|
||||
if (!svgSupported) {
|
||||
|
||||
return;
|
||||
}
|
||||
|
||||
this.barGoal = n;
|
||||
var height = this.size,
|
||||
width = this.size;
|
||||
|
||||
var cx = width / 2,
|
||||
cy = height / 2,
|
||||
startAngle = 0;
|
||||
|
||||
var barsize = this.options.barsize;
|
||||
|
||||
var r = Math.min(cx, cy) - barsize / 2;
|
||||
this.r = r;
|
||||
var percentage = this.getPercentage(n);
|
||||
|
||||
if (percentage === 100) {
|
||||
percentage -= 0.0001;
|
||||
}
|
||||
var endAngle = startAngle + percentage * Math.PI * 2 / 100;
|
||||
|
||||
var x1 = cx + r * Math.sin(startAngle),
|
||||
x2 = cx + r * Math.sin(endAngle),
|
||||
y1 = cy - r * Math.cos(startAngle),
|
||||
y2 = cy - r * Math.cos(endAngle);
|
||||
|
||||
// This is a flag for angles larger than than a half circle
|
||||
// It is required by the SVG arc drawing component
|
||||
var big = 0;
|
||||
|
||||
if (endAngle - startAngle > Math.PI) {
|
||||
big = 1;
|
||||
}
|
||||
|
||||
// This string holds the path details
|
||||
var d = 'M' + x1 + ',' + y1 + ' A' + r + ',' + r + ' 0 ' + big + ' 1 ' + x2 + ',' + y2;
|
||||
|
||||
this.bar.setAttribute('d', d);
|
||||
}
|
||||
}, {
|
||||
key: '_updateBar',
|
||||
value: function _updateBar() {
|
||||
if (!svgSupported) {
|
||||
|
||||
return;
|
||||
}
|
||||
var percenage = this.getPercentage(this.now);
|
||||
|
||||
var length = this.bar.getTotalLength();
|
||||
var offset = length * (1 - percenage / this.getPercentage(this.barGoal));
|
||||
|
||||
this.bar.style.strokeDasharray = length + ' ' + length;
|
||||
this.bar.style.strokeDashoffset = offset;
|
||||
}
|
||||
}, {
|
||||
key: '_trigger',
|
||||
value: function _trigger(eventType) {
|
||||
for (var _len = arguments.length, params = Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) {
|
||||
params[_key - 1] = arguments[_key];
|
||||
}
|
||||
|
||||
var data = [this].concat(params);
|
||||
|
||||
// event
|
||||
this.$element.trigger(NAMESPACE$1 + '::' + eventType, data);
|
||||
|
||||
// callback
|
||||
eventType = eventType.replace(/\b\w+\b/g,
|
||||
|
||||
function(word) {
|
||||
return word.substring(0, 1).toUpperCase() + word.substring(1);
|
||||
}
|
||||
);
|
||||
var onFunction = 'on' + eventType;
|
||||
|
||||
if (typeof this.options[onFunction] === 'function') {
|
||||
this.options[onFunction].apply(this, params);
|
||||
}
|
||||
}
|
||||
}, {
|
||||
key: 'getPercentage',
|
||||
value: function getPercentage(n) {
|
||||
return 100 * (n - this.min) / (this.max - this.min);
|
||||
}
|
||||
}, {
|
||||
key: 'go',
|
||||
value: function go(goal) {
|
||||
var that = this;
|
||||
this._clear();
|
||||
|
||||
if (isPercentage(goal)) {
|
||||
goal = parseInt(goal.replace('%', ''), 10);
|
||||
goal = Math.round(this.min + goal / 100 * (this.max - this.min));
|
||||
}
|
||||
|
||||
if (typeof goal === 'undefined') {
|
||||
goal = this.goal;
|
||||
}
|
||||
|
||||
if (goal > this.max) {
|
||||
goal = this.max;
|
||||
} else if (goal < this.min) {
|
||||
goal = this.min;
|
||||
}
|
||||
|
||||
if (this.barGoal < goal) {
|
||||
this._drawBar(goal);
|
||||
}
|
||||
|
||||
var start = that.now;
|
||||
var startTime = getTime();
|
||||
var endTime = startTime + Math.abs(start - goal) * 100 * that.options.speed / (that.max - that.min);
|
||||
|
||||
var animation = function animation(time) {
|
||||
var next = void 0;
|
||||
|
||||
if (time > endTime) {
|
||||
next = goal;
|
||||
} else {
|
||||
var distance = (time - startTime) / that.options.speed;
|
||||
next = Math.round(that.easing.fn(distance / 100) * (that.max - that.min));
|
||||
|
||||
if (goal > start) {
|
||||
next = start + next;
|
||||
|
||||
if (next > goal) {
|
||||
next = goal;
|
||||
}
|
||||
} else {
|
||||
next = start - next;
|
||||
|
||||
if (next < goal) {
|
||||
next = goal;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
that._update(next);
|
||||
|
||||
if (next === goal) {
|
||||
window.cancelAnimationFrame(that._frameId);
|
||||
that._frameId = null;
|
||||
|
||||
if (that.now === that.goal) {
|
||||
that._trigger('finish');
|
||||
}
|
||||
} else {
|
||||
that._frameId = window.requestAnimationFrame(animation);
|
||||
}
|
||||
};
|
||||
|
||||
that._frameId = window.requestAnimationFrame(animation);
|
||||
}
|
||||
}, {
|
||||
key: '_update',
|
||||
value: function _update(n) {
|
||||
this.now = n;
|
||||
|
||||
this._updateBar();
|
||||
|
||||
this.$element.attr('aria-valuenow', this.now);
|
||||
|
||||
if (this.$number.length > 0 && typeof this.options.numberCallback === 'function') {
|
||||
this.$number.html(this.options.numberCallback.call(this, [this.now]));
|
||||
}
|
||||
|
||||
if (this.$content.length > 0 && typeof this.options.contentCallback === 'function') {
|
||||
this.$content.html(this.options.contentCallback.call(this, [this.now]));
|
||||
}
|
||||
|
||||
this._trigger('update', n);
|
||||
}
|
||||
}, {
|
||||
key: '_clear',
|
||||
value: function _clear() {
|
||||
if (this._frameId) {
|
||||
window.cancelAnimationFrame(this._frameId);
|
||||
this._frameId = null;
|
||||
}
|
||||
}
|
||||
}, {
|
||||
key: 'get',
|
||||
value: function get() {
|
||||
return this.now;
|
||||
}
|
||||
}, {
|
||||
key: 'start',
|
||||
value: function start() {
|
||||
this._clear();
|
||||
this._trigger('start');
|
||||
this.go(this.goal);
|
||||
}
|
||||
}, {
|
||||
key: 'reset',
|
||||
value: function reset() {
|
||||
this._clear();
|
||||
this._drawBar(this.first);
|
||||
this._update(this.first);
|
||||
this._trigger('reset');
|
||||
}
|
||||
}, {
|
||||
key: 'stop',
|
||||
value: function stop() {
|
||||
this._clear();
|
||||
this._trigger('stop');
|
||||
}
|
||||
}, {
|
||||
key: 'finish',
|
||||
value: function finish() {
|
||||
this._clear();
|
||||
this._update(this.goal);
|
||||
this._trigger('finish');
|
||||
}
|
||||
}, {
|
||||
key: 'destroy',
|
||||
value: function destroy() {
|
||||
this.$element.data(NAMESPACE$1, null);
|
||||
this._trigger('destroy');
|
||||
}
|
||||
}], [{
|
||||
key: 'registerEasing',
|
||||
value: function registerEasing(name) {
|
||||
for (var _len2 = arguments.length, args = Array(_len2 > 1 ? _len2 - 1 : 0), _key2 = 1; _key2 < _len2; _key2++) {
|
||||
args[_key2 - 1] = arguments[_key2];
|
||||
}
|
||||
|
||||
EASING[name] = easingBezier.apply(undefined, args);
|
||||
}
|
||||
}, {
|
||||
key: 'getEasing',
|
||||
value: function getEasing(name) {
|
||||
return EASING[name];
|
||||
}
|
||||
}, {
|
||||
key: 'setDefaults',
|
||||
value: function setDefaults(options) {
|
||||
_jquery2.default.extend(true, DEFAULTS, _jquery2.default.isPlainObject(options) && options);
|
||||
}
|
||||
}]);
|
||||
|
||||
return asPieProgress;
|
||||
}();
|
||||
|
||||
var info = {
|
||||
version: '0.4.6'
|
||||
};
|
||||
|
||||
var NAMESPACE = 'asPieProgress';
|
||||
var OtherAsPieProgress = _jquery2.default.fn.asPieProgress;
|
||||
|
||||
var jQueryAsPieProgress = function jQueryAsPieProgress(options) {
|
||||
var _this = this;
|
||||
|
||||
for (var _len3 = arguments.length, args = Array(_len3 > 1 ? _len3 - 1 : 0), _key3 = 1; _key3 < _len3; _key3++) {
|
||||
args[_key3 - 1] = arguments[_key3];
|
||||
}
|
||||
|
||||
if (typeof options === 'string') {
|
||||
var _ret2 = function() {
|
||||
var method = options;
|
||||
|
||||
if (/^_/.test(method)) {
|
||||
|
||||
return {
|
||||
v: false
|
||||
};
|
||||
} else if (/^(get)/.test(method)) {
|
||||
var instance = _this.first().data(NAMESPACE);
|
||||
|
||||
if (instance && typeof instance[method] === 'function') {
|
||||
|
||||
return {
|
||||
v: instance[method].apply(instance, args)
|
||||
};
|
||||
}
|
||||
} else {
|
||||
|
||||
return {
|
||||
v: _this.each(
|
||||
|
||||
function() {
|
||||
var instance = _jquery2.default.data(this, NAMESPACE);
|
||||
|
||||
if (instance && typeof instance[method] === 'function') {
|
||||
instance[method].apply(instance, args);
|
||||
}
|
||||
}
|
||||
)
|
||||
};
|
||||
}
|
||||
}();
|
||||
|
||||
if ((typeof _ret2 === 'undefined' ? 'undefined' : _typeof(_ret2)) === "object")
|
||||
|
||||
return _ret2.v;
|
||||
}
|
||||
|
||||
return this.each(
|
||||
|
||||
function() {
|
||||
if (!(0, _jquery2.default)(this).data(NAMESPACE)) {
|
||||
(0, _jquery2.default)(this).data(NAMESPACE, new asPieProgress(this, options));
|
||||
}
|
||||
}
|
||||
);
|
||||
};
|
||||
|
||||
_jquery2.default.fn.asPieProgress = jQueryAsPieProgress;
|
||||
|
||||
_jquery2.default.asPieProgress = _jquery2.default.extend({
|
||||
setDefaults: asPieProgress.setDefaults,
|
||||
registerEasing: asPieProgress.registerEasing,
|
||||
getEasing: asPieProgress.getEasing,
|
||||
noConflict: function noConflict() {
|
||||
_jquery2.default.fn.asPieProgress = OtherAsPieProgress;
|
||||
|
||||
return jQueryAsPieProgress;
|
||||
}
|
||||
}, info);
|
||||
}
|
||||
);
|
||||
8
gauge/jquery-asPieProgress.min.js
vendored
Normal file
8
gauge/jquery-asPieProgress.min.js
vendored
Normal file
File diff suppressed because one or more lines are too long
332
index.php
Normal file
332
index.php
Normal file
|
|
@ -0,0 +1,332 @@
|
|||
<?php
|
||||
if(isset($_POST['name']) && isset($_POST['host']))
|
||||
{
|
||||
$port = 80;
|
||||
if(!empty($_POST['port'])) $port = $_POST['port'];
|
||||
addServer($_POST['name'], $_POST['host'], $port);
|
||||
header('Location: index.php');
|
||||
}
|
||||
else if(isset($_GET['del']))
|
||||
{
|
||||
$index = (int) $_GET['del'];
|
||||
if($index >= 0) deleteServer($index);
|
||||
}
|
||||
?>
|
||||
<!DOCTYPE html>
|
||||
<html class="no-js">
|
||||
<head>
|
||||
<meta name="robots" content="noindex">
|
||||
<meta charset="utf-8">
|
||||
<title>Server Status Port</title>
|
||||
<link href="css/bootstrap.css" rel="stylesheet">
|
||||
<link href="css/bootstrap-theme.css" rel="stylesheet">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<link rel="shortcut icon" type="image/x-icon" href="./favicon.png" />
|
||||
</head>
|
||||
|
||||
<body class="light-mode" onload="startTime()">
|
||||
|
||||
<style type="text/css">
|
||||
body {
|
||||
padding-top: 60px;
|
||||
}
|
||||
.pie_progress {
|
||||
width: 150px;
|
||||
margin: 10px auto;
|
||||
}
|
||||
@media all and (max-width: 968px) {
|
||||
.pie_progress {
|
||||
width: 80%;
|
||||
max-width: 810px;
|
||||
}
|
||||
}
|
||||
.title {
|
||||
height: 50px;
|
||||
}
|
||||
.Time{
|
||||
color: black;
|
||||
}
|
||||
.Time2{
|
||||
color: yellow;
|
||||
}
|
||||
|
||||
</style>
|
||||
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
|
||||
<link rel="stylesheet" href="gauge/css/asPieProgress.css">
|
||||
<link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet" integrity="sha384-wvfXpqpZZVQGK6TAh5PVlGOfQNHSoD2xbE+QkPxCAFlNEevoEH3Sl0sibVcOQVnN" crossorigin="anonymous">
|
||||
<link rel="stylesheet" href="style.css">
|
||||
|
||||
<center>
|
||||
|
||||
|
||||
<div class="container content">
|
||||
|
||||
<div class="page-title light-mode">
|
||||
<h2>Monitoring Serv. </h2>
|
||||
<!-- <div id="heure" class="Time2"></div> -->
|
||||
<img src="favicon.png" alt="Monitoring image" class="logo-image">
|
||||
<button id="theme-toggle" >Dark theme</button>
|
||||
</div>
|
||||
|
||||
<div class="col-xs-4 col-sm-4 col-lg-4" id="cpuDiv">
|
||||
<div class="pie_progress_cpu" role="progressbar" data-goal="33">
|
||||
<div class="pie_progress__number">0%</div>
|
||||
<div class="pie_progress__label">CPU</div>
|
||||
</div>
|
||||
<h1>Cpu</h1>
|
||||
<div class='title'></div>
|
||||
<pre><?php echo `lsb_release -s -d`; ?><br></pre>
|
||||
</div>
|
||||
<div class="col-xs-4 col-sm-4 col-lg-4" id="memDiv">
|
||||
<div class="pie_progress_mem" role="progressbar" data-goal="33">
|
||||
<div class="pie_progress__number">0%</div>
|
||||
<div class="pie_progress__label">Memory</div>
|
||||
</div>
|
||||
<h1>Memory</h1>
|
||||
|
||||
<div class='title'></div>
|
||||
<pre><?php echo `date`;?> <strong><span id="heure" class="Time"></span></strong></pre>
|
||||
|
||||
</div>
|
||||
<div class="col-xs-4 col-sm-4 col-lg-4" id="diskDiv">
|
||||
<div class="pie_progress_disk" role="progressbar" data-goal="33">
|
||||
<div class="pie_progress__number">0%</div>
|
||||
<div class="pie_progress__label">Disk</div>
|
||||
</div>
|
||||
<h1>Disk</h1>
|
||||
<div class='title'></div>
|
||||
|
||||
<!-- Check SSL block -->
|
||||
<pre>Validity SSL echosystem.fr
|
||||
<strong><?php $file='SSL.txt'; $contenu=file_get_contents($file); echo "$contenu"; ?></strong></pre>
|
||||
<br>
|
||||
|
||||
</div>
|
||||
<br>
|
||||
<h3>Server Status Port</h3>
|
||||
<table class="table table-bordered">
|
||||
<tr>
|
||||
<th class="text-center">Name</th>
|
||||
<th class="text-center">Domain</th>
|
||||
<th class="text-center">IP</th>
|
||||
<th class="text-center">Port</th>
|
||||
<th class="text-center">Status</th>
|
||||
<th class="text-center deleteMode" style="width:75px">Delete</th>
|
||||
</tr>
|
||||
<?php parser(); ?>
|
||||
</table>
|
||||
<input id="editMode" type="button" value="Edit Entry" checked="checked" class="btn btn-default pull-right_ btnedit" /><br><br>
|
||||
<form class="form-inline" role="form" action="index.php" method="post">
|
||||
<div class="form-group">Name service<br>
|
||||
<input type="text" class="form-control" id="name" name="name" placeholder="Name">
|
||||
</div>
|
||||
<div class="form-group">Host / Domain <br>
|
||||
<input type="text" class="form-control" onkeyup="javascript:checkForm(this)" id="host" name="host" placeholder="Domain / IP">
|
||||
</div>
|
||||
<div class="form-group">Port <br>
|
||||
<input type="text" size="5" class="form-control" id="port" name="port" placeholder="Port">
|
||||
</div>
|
||||
<button type="submit" class="btn btn-default" id="add-button" style="margin-top: 18px;">Add</button>
|
||||
</form>
|
||||
<br><br>
|
||||
<footer>
|
||||
<p><center>
|
||||
<pre style="width:292px;">By <a href="https://echosystem.fr/erreur32" style="color: unset;">🅴🆁🆁🅴🆄🆁32</a> <a href="https://echosystem.fr/" style="color: unset;">
|
||||
<img style="display: block; margin-left: auto; margin-right: auto;" src="https://echosystem.fr/home/favicon.png" alt="" width="32" height="32"> 🆓🅴🅲🅷🅾️🆂🆈🆂🆃🅴🅼 </a>
|
||||
</pre></center></p>Page Hosted on <?php $hostname = gethostname(); echo $hostname ?>
|
||||
</footer>
|
||||
</div>
|
||||
|
||||
<script src="js/jquery.js" type="text/javascript"></script>
|
||||
<script src="js/app.js" type="text/javascript"></script>
|
||||
<script src="js/bootstrap.min.js" type="text/javascript"></script>
|
||||
<script
|
||||
src="https://code.jquery.com/jquery-3.2.1.min.js"
|
||||
integrity="sha256-hwg4gsxgFZhOsEEamdOYGBf13FyQuiTwlAQgxVSNgt4="
|
||||
crossorigin="anonymous"></script>
|
||||
<script type="text/javascript" src="gauge/jquery-asPieProgress.js"></script>
|
||||
<script type="text/javascript">
|
||||
$(document).ready(function () {
|
||||
// Example with grater loading time - loads longer
|
||||
$('.pie_progress_cpu, .pie_progress_mem, .pie_progress_disk').asPieProgress({});
|
||||
getCpu();
|
||||
getMem();
|
||||
getDisk();
|
||||
});
|
||||
|
||||
function getCpu() {
|
||||
$.ajax({
|
||||
url: 'cpu.json.php',
|
||||
success: function (response) {
|
||||
update('cpu', response);
|
||||
setTimeout(function () {
|
||||
getCpu();
|
||||
}, 1000);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
function getMem() {
|
||||
$.ajax({
|
||||
url: 'memory.json.php',
|
||||
success: function (response) {
|
||||
update('mem', response);
|
||||
|
||||
setTimeout(function () {
|
||||
getMem();
|
||||
}, 1000);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
function getDisk() {
|
||||
$.ajax({
|
||||
url: 'disk.json.php',
|
||||
success: function (response) {
|
||||
update('disk', response);
|
||||
setTimeout(function () {
|
||||
getDisk();
|
||||
}, 1000);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
function update(name, response) {
|
||||
$('.pie_progress_' + name).asPieProgress('go', response.percent);
|
||||
$("#" + name + "Div div.title").text(response.title);
|
||||
// $("#" + name + "Div pre").text(response.output.join('\n'));
|
||||
}
|
||||
</script>
|
||||
|
||||
<script>
|
||||
function afficherHeure() {
|
||||
var date = new Date();
|
||||
var heures = date.getHours();
|
||||
var minutes = date.getMinutes();
|
||||
var secondes = date.getSeconds();
|
||||
|
||||
document.getElementById('heure').innerHTML = heures + ":" + minutes + ":" + secondes;
|
||||
|
||||
// Actualise l'heure chaque seconde
|
||||
setTimeout(afficherHeure, 1000);
|
||||
}
|
||||
|
||||
// Appelle la fonction pour la première fois
|
||||
afficherHeure();
|
||||
</script>
|
||||
|
||||
|
||||
<script src="darktheme.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
<?php
|
||||
|
||||
function getStatus($ip, $port)
|
||||
{
|
||||
$socket = @fsockopen($ip, $port, $errorNo, $errorStr, 2);
|
||||
if (!$socket) return false;
|
||||
else return true;
|
||||
}
|
||||
|
||||
function addServer($name, $host, $port)
|
||||
{
|
||||
// TODO : rewrite the opening part correctly (better errors management)
|
||||
$i = 0;
|
||||
$filename = 'servers.xml';
|
||||
|
||||
$servers = file_get_contents("servers.xml");
|
||||
if (trim($servers) == '')
|
||||
{
|
||||
exit();
|
||||
}
|
||||
else
|
||||
{
|
||||
$servers = simplexml_load_file("servers.xml");
|
||||
foreach ($servers as $server) $i++;
|
||||
}
|
||||
|
||||
$servers = simplexml_load_file($filename);
|
||||
$server = $servers->addChild('server');
|
||||
|
||||
$server->addAttribute('id', (string) $i);
|
||||
if(strlen($name) == 0) $name = $host;
|
||||
$server->addChild('name', (string)$name);
|
||||
$server->addChild('host', (string)$host);
|
||||
$server->addChild('port', (string)$port);
|
||||
$servers->asXML($filename);
|
||||
}
|
||||
|
||||
function parser()
|
||||
{
|
||||
//TODO : Fix errors when no valid XML content inside file.
|
||||
$file = "servers.xml";
|
||||
if(file_exists($file))
|
||||
{
|
||||
$servers = file_get_contents("servers.xml");
|
||||
if (trim($servers) == '') //File exists but empty
|
||||
{
|
||||
$content = "<?xml version=\"1.0\" encoding=\"UTF-8\"?><servers></servers>";
|
||||
file_put_contents($file, $content, FILE_APPEND | LOCK_EX);
|
||||
}
|
||||
else
|
||||
{
|
||||
$servers = simplexml_load_file("servers.xml");
|
||||
foreach ($servers as $server)
|
||||
{
|
||||
echo "<tr>";
|
||||
echo "<td>".$server->name."</td>";
|
||||
if(filter_var($server->host, FILTER_VALIDATE_IP))
|
||||
{
|
||||
echo "<td class=\"text-center\">N/A</td><td class=\"text-center\">".$server->host."</td>";
|
||||
}
|
||||
else
|
||||
{
|
||||
echo "<td class=\"text-center\">".$server->host."</td><td class=\"text-center\">".gethostbyname($server->host)."</td>";
|
||||
}
|
||||
|
||||
echo "<td class=\"text-center\">".$server->port."</td>";
|
||||
|
||||
if (getStatus((string)$server->host, (string)$server->port))
|
||||
{
|
||||
echo "<td class=\"text-center\"><span class=\"label label-success\">Online</span></td>";
|
||||
}
|
||||
else
|
||||
{
|
||||
echo "<td class=\"text-center\"><span class=\"label label-danger\">Offline</span></td>";
|
||||
}
|
||||
echo "<td class=\"text-center deleteMode\"><a href=\"index.php?del=".$server->attributes()."\" style=\"text-decoration:none\"><b style=\"color:red;\">X</b></a></td>";
|
||||
echo "</tr>";
|
||||
}
|
||||
}
|
||||
}
|
||||
else
|
||||
{
|
||||
// TODO : detect creation errors (ex : permissions)
|
||||
$content = "<?xml version=\"1.0\" encoding=\"UTF-8\"?><servers></servers>";
|
||||
file_put_contents($file, $content, FILE_APPEND | LOCK_EX);
|
||||
}
|
||||
}
|
||||
|
||||
function deleteServer($index)
|
||||
{
|
||||
$file = "servers.xml";
|
||||
|
||||
$serverFile = new DOMDocument;
|
||||
$serverFile->formatOutput = true;
|
||||
$serverFile->load($file);
|
||||
$servers = $serverFile->documentElement;
|
||||
$list = $servers->getElementsByTagName('server');
|
||||
$nodeToRemove = null;
|
||||
|
||||
foreach ($list as $server)
|
||||
{
|
||||
$attrValue = $server->getAttribute('id');
|
||||
if ((int)$attrValue == $index) $nodeToRemove = $server;
|
||||
}
|
||||
|
||||
if ($nodeToRemove != null) $servers->removeChild($nodeToRemove);
|
||||
|
||||
$serverFile->save($file);
|
||||
header('Location: index.php');
|
||||
}
|
||||
335
index.php_a_check
Normal file
335
index.php_a_check
Normal file
|
|
@ -0,0 +1,335 @@
|
|||
<?php
|
||||
if(isset($_POST['name']) && isset($_POST['host']))
|
||||
{
|
||||
$port = 80;
|
||||
|
||||
if(!empty($_POST['port'])) $port = $_POST['port'];
|
||||
|
||||
addServer($_POST['name'], $_POST['host'], $port);
|
||||
|
||||
header('Location: index.php');
|
||||
}
|
||||
else if(isset($_GET['del']))
|
||||
{
|
||||
$index = (int) $_GET['del'];
|
||||
if($index >= 0) deleteServer($index);
|
||||
}
|
||||
?>
|
||||
<!DOCTYPE html>
|
||||
<html class="no-js">
|
||||
<head>
|
||||
<meta name="robots" content="noindex">
|
||||
<meta charset="utf-8">
|
||||
<title>Server Status Port</title>
|
||||
<link href="css/bootstrap.css" rel="stylesheet">
|
||||
<link href="css/bootstrap-theme.css" rel="stylesheet">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<link rel="shortcut icon" type="image/x-icon" href="./favicon.png" />
|
||||
</head>
|
||||
|
||||
<body class="light-mode" onload="startTime()">
|
||||
|
||||
<style type="text/css">
|
||||
body {
|
||||
padding-top: 60px;
|
||||
}
|
||||
.pie_progress {
|
||||
width: 150px;
|
||||
margin: 10px auto;
|
||||
}
|
||||
@media all and (max-width: 968px) {
|
||||
.pie_progress {
|
||||
width: 80%;
|
||||
max-width: 810px;
|
||||
}
|
||||
}
|
||||
.title{
|
||||
height: 50px;
|
||||
}
|
||||
.Time{
|
||||
/* color: ;*/
|
||||
backgroung: #333333;
|
||||
}
|
||||
</style>
|
||||
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
|
||||
<link rel="stylesheet" href="gauge/css/asPieProgress.css">
|
||||
<link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet" integrity="sha384-wvfXpqpZZVQGK6TAh5PVlGOfQNHSoD2xbE+QkPxCAFlNEevoEH3Sl0sibVcOQVnN" crossorigin="anonymous">
|
||||
<link rel="stylesheet" href="style.css">
|
||||
|
||||
<center>
|
||||
|
||||
|
||||
<div class="container content">
|
||||
<div class="page-title light-mode">
|
||||
<h2>Monitoring Serv. </h2>
|
||||
<img src="favicon.png" alt="Monitoring image" class="logo-image">
|
||||
<button id="theme-toggle" >Dark theme</button>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="col-xs-4 col-sm-4 col-lg-4" id="cpuDiv">
|
||||
<div class="pie_progress_cpu" role="progressbar" data-goal="33">
|
||||
<div class="pie_progress__number">0%</div>
|
||||
<div class="pie_progress__label">CPU</div>
|
||||
</div>
|
||||
<h1>Cpu</h1>
|
||||
<div class='title'></div>
|
||||
<strong> <pre><?php echo `date`;?></strong><?php echo `lsb_release -s -d`; ?></pre>
|
||||
</div>
|
||||
<div class="col-xs-4 col-sm-4 col-lg-4" id="memDiv">
|
||||
<div class="pie_progress_mem" role="progressbar" data-goal="33">
|
||||
<div class="pie_progress__number">0%</div>
|
||||
<div class="pie_progress__label">Memory</div>
|
||||
</div>
|
||||
<h1>Memory</h1>
|
||||
<div class='title'></div>
|
||||
<pre>
|
||||
<div id="heure" class='Time_'></div>
|
||||
</pre>
|
||||
</div>
|
||||
<div class="col-xs-4 col-sm-4 col-lg-4" id="diskDiv">
|
||||
<div class="pie_progress_disk" role="progressbar" data-goal="33">
|
||||
<div class="pie_progress__number">0%</div>
|
||||
<div class="pie_progress__label">Disk</div>
|
||||
</div>
|
||||
<h1>Disk</h1>
|
||||
<div class='title'></div>
|
||||
<pre>Validity SSL echosystem.fr
|
||||
<strong><?php // ./ssl-checks.sh --host monsite.fr --end > SSL.txt
|
||||
$file='SSL.txt';
|
||||
$contenu=file_get_contents($file);
|
||||
echo "$contenu";
|
||||
?>
|
||||
</strong>
|
||||
</pre>
|
||||
<br>
|
||||
</div>
|
||||
<br>
|
||||
<h3>Server Status Port</h3>
|
||||
<table class="table table-bordered">
|
||||
<tr>
|
||||
<th class="text-center">Name</th>
|
||||
<th class="text-center">Domain</th>
|
||||
<th class="text-center">IP</th>
|
||||
<th class="text-center">Port</th>
|
||||
<th class="text-center">Status</th>
|
||||
<th class="text-center deleteMode" style="width:75px">Delete</th>
|
||||
</tr>
|
||||
<?php parser(); ?>
|
||||
</table>
|
||||
<input id="editMode" type="button" value="Edit Entry" checked="checked" class="btn btn-default pull-right_ btnedit" /><br><br>
|
||||
<form class="form-inline" role="form" action="index.php" method="post">
|
||||
<div class="form-group">Name service<br>
|
||||
<input type="text" class="form-control" id="name" name="name" placeholder="Name">
|
||||
</div>
|
||||
<div class="form-group">Host / Domain <br>
|
||||
<input type="text" class="form-control" onkeyup="javascript:checkForm(this)" id="host" name="host" placeholder="Domain / IP">
|
||||
</div>
|
||||
<div class="form-group">Port <br>
|
||||
<input type="text" size="5" class="form-control" id="port" name="port" placeholder="Port">
|
||||
</div>
|
||||
<button type="submit" class="btn btn-default" id="add-button" style="margin-top: 18px;">Add</button>
|
||||
</form>
|
||||
<br><br>
|
||||
<footer>
|
||||
<p><center>
|
||||
<pre style="width:292px;">By <a href="https://echosystem.fr/erreur32" style="color: unset;">🅴🆁🆁🅴🆄🆁32</a> <a href="https://echosystem.fr/" style="color: unset;">
|
||||
<img style="display: block; margin-left: auto; margin-right: auto;" src="https://echosystem.fr/home/favicon.png" alt="" width="32" height="32"> 🆓🅴🅲🅷🅾️🆂🆈🆂🆃🅴🅼 </a>
|
||||
</pre></center></p>Page Hosted on <?php $hostname = gethostname(); echo $hostname ?>
|
||||
</footer>
|
||||
</div>
|
||||
|
||||
<script src="js/jquery.js" type="text/javascript"></script>
|
||||
<script src="js/app.js" type="text/javascript"></script>
|
||||
<script src="js/bootstrap.min.js" type="text/javascript"></script>
|
||||
<script
|
||||
src="https://code.jquery.com/jquery-3.2.1.min.js"
|
||||
integrity="sha256-hwg4gsxgFZhOsEEamdOYGBf13FyQuiTwlAQgxVSNgt4="
|
||||
crossorigin="anonymous"></script>
|
||||
<script type="text/javascript" src="gauge/jquery-asPieProgress.js"></script>
|
||||
|
||||
<script type="text/javascript">
|
||||
$(document).ready(function () {
|
||||
// Example with grater loading time - loads longer
|
||||
$('.pie_progress_cpu, .pie_progress_mem, .pie_progress_disk').asPieProgress({});
|
||||
getCpu();
|
||||
getMem();
|
||||
getDisk();
|
||||
});
|
||||
|
||||
function getCpu() {
|
||||
$.ajax({
|
||||
url: 'cpu.json.php',
|
||||
success: function (response) {
|
||||
update('cpu', response);
|
||||
setTimeout(function () {
|
||||
getCpu();
|
||||
}, 1000);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
function getMem() {
|
||||
$.ajax({
|
||||
url: 'memory.json.php',
|
||||
success: function (response) {
|
||||
update('mem', response);
|
||||
|
||||
setTimeout(function () {
|
||||
getMem();
|
||||
}, 1000);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
function getDisk() {
|
||||
$.ajax({
|
||||
url: 'disk.json.php',
|
||||
success: function (response) {
|
||||
update('disk', response);
|
||||
setTimeout(function () {
|
||||
getDisk();
|
||||
}, 1000);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
function update(name, response) {
|
||||
$('.pie_progress_' + name).asPieProgress('go', response.percent);
|
||||
$("#" + name + "Div div.title").text(response.title);
|
||||
// $("#" + name + "Div pre").text(response.output.join('\n'));
|
||||
}
|
||||
</script>
|
||||
|
||||
<script>
|
||||
function afficherHeure() {
|
||||
var date = new Date();
|
||||
var heures = date.getHours();
|
||||
var minutes = date.getMinutes();
|
||||
var secondes = date.getSeconds();
|
||||
|
||||
document.getElementById('heure').innerHTML = heures + ":" + minutes + ":" + secondes;
|
||||
|
||||
// Actualise l'heure chaque seconde
|
||||
setTimeout(afficherHeure, 1000);
|
||||
}
|
||||
|
||||
// Appelle la fonction pour la première fois
|
||||
afficherHeure();
|
||||
</script>
|
||||
|
||||
|
||||
<script src="darktheme.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
<?php
|
||||
|
||||
function getStatus($ip, $port)
|
||||
{
|
||||
$socket = @fsockopen($ip, $port, $errorNo, $errorStr, 2);
|
||||
if (!$socket) return false;
|
||||
else return true;
|
||||
}
|
||||
|
||||
function addServer($name, $host, $port)
|
||||
{
|
||||
// TODO : rewrite the opening part correctly (better errors management)
|
||||
$i = 0;
|
||||
$filename = 'servers.xml';
|
||||
|
||||
$servers = file_get_contents("servers.xml");
|
||||
if (trim($servers) == '')
|
||||
{
|
||||
exit();
|
||||
}
|
||||
else
|
||||
{
|
||||
$servers = simplexml_load_file("servers.xml");
|
||||
foreach ($servers as $server) $i++;
|
||||
}
|
||||
|
||||
$servers = simplexml_load_file($filename);
|
||||
$server = $servers->addChild('server');
|
||||
|
||||
$server->addAttribute('id', (string) $i);
|
||||
if(strlen($name) == 0) $name = $host;
|
||||
$server->addChild('name', (string)$name);
|
||||
$server->addChild('host', (string)$host);
|
||||
$server->addChild('port', (string)$port);
|
||||
$servers->asXML($filename);
|
||||
}
|
||||
|
||||
function parser()
|
||||
{
|
||||
//TODO : Fix errors when no valid XML content inside file.
|
||||
$file = "servers.xml";
|
||||
if(file_exists($file))
|
||||
{
|
||||
$servers = file_get_contents("servers.xml");
|
||||
if (trim($servers) == '') //File exists but empty
|
||||
{
|
||||
$content = "<?xml version=\"1.0\" encoding=\"UTF-8\"?><servers></servers>";
|
||||
file_put_contents($file, $content, FILE_APPEND | LOCK_EX);
|
||||
}
|
||||
else
|
||||
{
|
||||
$servers = simplexml_load_file("servers.xml");
|
||||
foreach ($servers as $server)
|
||||
{
|
||||
echo "<tr>";
|
||||
echo "<td>".$server->name."</td>";
|
||||
if(filter_var($server->host, FILTER_VALIDATE_IP))
|
||||
{
|
||||
echo "<td class=\"text-center\">N/A</td><td class=\"text-center\">".$server->host."</td>";
|
||||
}
|
||||
else
|
||||
{
|
||||
echo "<td class=\"text-center\">".$server->host."</td><td class=\"text-center\">".gethostbyname($server->host)."</td>";
|
||||
}
|
||||
|
||||
echo "<td class=\"text-center\">".$server->port."</td>";
|
||||
|
||||
if (getStatus((string)$server->host, (string)$server->port))
|
||||
{
|
||||
echo "<td class=\"text-center\"><span class=\"label label-success\">Online</span></td>";
|
||||
}
|
||||
else
|
||||
{
|
||||
echo "<td class=\"text-center\"><span class=\"label label-danger\">Offline</span></td>";
|
||||
}
|
||||
echo "<td class=\"text-center deleteMode\"><a href=\"index.php?del=".$server->attributes()."\" style=\"text-decoration:none\"><b style=\"color:red;\">X</b></a></td>";
|
||||
echo "</tr>";
|
||||
}
|
||||
}
|
||||
}
|
||||
else
|
||||
{
|
||||
// TODO : detect creation errors (ex : permissions)
|
||||
$content = "<?xml version=\"1.0\" encoding=\"UTF-8\"?><servers></servers>";
|
||||
file_put_contents($file, $content, FILE_APPEND | LOCK_EX);
|
||||
}
|
||||
}
|
||||
|
||||
function deleteServer($index)
|
||||
{
|
||||
$file = "servers.xml";
|
||||
|
||||
$serverFile = new DOMDocument;
|
||||
$serverFile->formatOutput = true;
|
||||
$serverFile->load($file);
|
||||
$servers = $serverFile->documentElement;
|
||||
$list = $servers->getElementsByTagName('server');
|
||||
$nodeToRemove = null;
|
||||
|
||||
foreach ($list as $server)
|
||||
{
|
||||
$attrValue = $server->getAttribute('id');
|
||||
if ((int)$attrValue == $index) $nodeToRemove = $server;
|
||||
}
|
||||
|
||||
if ($nodeToRemove != null) $servers->removeChild($nodeToRemove);
|
||||
|
||||
$serverFile->save($file);
|
||||
header('Location: index.php');
|
||||
}
|
||||
22
js/app.js
Normal file
22
js/app.js
Normal file
|
|
@ -0,0 +1,22 @@
|
|||
window.onload = function(){
|
||||
$('.deleteMode').hide();
|
||||
document.getElementById("add-button").disabled = true;
|
||||
}
|
||||
|
||||
$(document).ready(function() {
|
||||
$('#editMode').click(function() {
|
||||
$('.deleteMode').toggle();
|
||||
});
|
||||
|
||||
$('#port').tooltip({'trigger':'focus', 'title': 'You can leave empty if port is 80'});
|
||||
});
|
||||
|
||||
function checkForm(elem) {
|
||||
var b = document.getElementById("add-button");
|
||||
if(elem.value == "" || elem.value.length == 0) {
|
||||
b.disabled = true;
|
||||
}
|
||||
else {
|
||||
b.disabled = false;
|
||||
}
|
||||
}
|
||||
7
js/bootstrap.min.js
vendored
Normal file
7
js/bootstrap.min.js
vendored
Normal file
File diff suppressed because one or more lines are too long
10308
js/jquery.js
vendored
Normal file
10308
js/jquery.js
vendored
Normal file
File diff suppressed because it is too large
Load diff
5
memory.json.php
Normal file
5
memory.json.php
Normal file
|
|
@ -0,0 +1,5 @@
|
|||
<?php
|
||||
require_once 'ServerMonitor.php';
|
||||
header('Content-Type: application/json');
|
||||
echo json_encode(ServerMonitor::getMemory());
|
||||
|
||||
9
servers.xml
Normal file
9
servers.xml
Normal file
|
|
@ -0,0 +1,9 @@
|
|||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<servers>
|
||||
|
||||
<server id="1">
|
||||
<name>google.fr</name>
|
||||
<host>google.fr</host>
|
||||
<port>80</port>
|
||||
</server>
|
||||
</servers>
|
||||
234
ssl-checks.sh
Executable file
234
ssl-checks.sh
Executable file
|
|
@ -0,0 +1,234 @@
|
|||
#!/bin/bash
|
||||
|
||||
usage()
|
||||
{
|
||||
cat <<EOF
|
||||
Usage: $(basename $0) [options]
|
||||
|
||||
This shell script is a simple wrapper around the openssl binary. It uses
|
||||
s_client to get certificate information from remote hosts, or x509 for local
|
||||
certificate files. It can parse out some of the openssl output or just dump all
|
||||
of it as text.
|
||||
|
||||
Options:
|
||||
|
||||
--all-info Print all output, including boring things like Modulus and
|
||||
Exponent.
|
||||
|
||||
--alt Print Subject Alternative Names. These will be typically be
|
||||
additional hostnames that the certificate is valid for.
|
||||
|
||||
--cn Print commonName from Subject. This is typically the host for
|
||||
which the certificate was issued.
|
||||
|
||||
--debug Print additional info that might be helpful when debugging this
|
||||
script.
|
||||
|
||||
--end Print certificate expiration date. For additional functionality
|
||||
related to certificate expiration, take a look at this script:
|
||||
"http://prefetch.net/code/ssl-cert-check".
|
||||
|
||||
--dates Print start and end dates of when the certificate is valid.
|
||||
|
||||
--file Use a local certificate file for input.
|
||||
|
||||
--help Print this help message.
|
||||
|
||||
--host Fetch the certificate from this remote host.
|
||||
|
||||
--name Specify a specific domain name (Virtual Host) along with the
|
||||
request. This value will be used as the '-servername' in the
|
||||
s_client command. This is for TLS SNI (Server Name Indication).
|
||||
|
||||
--issuer Print the certificate issuer.
|
||||
|
||||
--most-info Print almost everything. Skip boring things like Modulus and
|
||||
Exponent.
|
||||
|
||||
--option Pass any openssl option through to openssl to get its raw
|
||||
output.
|
||||
|
||||
--port Use this port when conneting to remote host. If ommitted, port
|
||||
defaults to 443.
|
||||
|
||||
--subject Print the certificate Subject -- typically address and org name.
|
||||
|
||||
Examples:
|
||||
|
||||
1. Print a list of all hostnames that the certificate used by amazon.com
|
||||
is valid for.
|
||||
|
||||
$(basename $0) --host amazon.com --alt
|
||||
DNS:uedata.amazon.com
|
||||
DNS:amazon.com
|
||||
DNS:amzn.com
|
||||
DNS:www.amzn.com
|
||||
DNS:www.amazon.com
|
||||
|
||||
2. Print issuer of certificate used by smtp.gmail.com. Fetch certficate info
|
||||
over port 465.
|
||||
|
||||
$(basename $0) --host smtp.gmail.com --port 465 --issuer
|
||||
issuer=
|
||||
countryName = US
|
||||
organizationName = Google Inc
|
||||
commonName = Google Internet Authority G2
|
||||
|
||||
3. Print valid dates for the certificate, using a local file as the source of
|
||||
certificate data. Dates are formatted using the date command and display
|
||||
time in your local timezone instead of GMT.
|
||||
|
||||
$(basename $0) --file /path/to/file.crt --dates
|
||||
valid from: 2014-02-04 16:00:00 PST
|
||||
valid till: 2017-02-04 15:59:59 PST
|
||||
|
||||
|
||||
4. Print certificate serial number. This script doesn't have a special option
|
||||
to parse out the serial number, so will use the generic --option flag to
|
||||
pass '-serial' through to openssl.
|
||||
|
||||
$(basename $0) --host gmail.com --option -serial
|
||||
serial=4BF004B4DDC9C2F8
|
||||
|
||||
EOF
|
||||
}
|
||||
|
||||
if ! [ -x "$(type -P openssl)" ]; then
|
||||
echo "ERROR: script requires openssl"
|
||||
echo "For Debian and friends, get it with 'apt-get install openssl'"
|
||||
exit 1
|
||||
fi
|
||||
|
||||
while [ "$1" ]; do
|
||||
case "$1" in
|
||||
--file)
|
||||
shift
|
||||
crt="$1"
|
||||
source="local"
|
||||
;;
|
||||
--host)
|
||||
shift
|
||||
host="$1"
|
||||
source="remote"
|
||||
;;
|
||||
--port)
|
||||
shift
|
||||
port="$1"
|
||||
;;
|
||||
--name)
|
||||
shift
|
||||
servername="-servername $1"
|
||||
;;
|
||||
--all-info)
|
||||
opt="-text"
|
||||
;;
|
||||
--alt)
|
||||
FormatOutput() {
|
||||
grep -A1 "Subject Alternative Name:" | tail -n1 |
|
||||
tr -d ' ' | tr ',' '\n'
|
||||
}
|
||||
;;
|
||||
--cn)
|
||||
opt="-subject -nameopt multiline"
|
||||
FormatOutput() {
|
||||
awk '/commonName/ {print$NF}'
|
||||
}
|
||||
;;
|
||||
--dates)
|
||||
opt="-dates"
|
||||
FormatOutput() {
|
||||
dates=$(cat -)
|
||||
start=$(grep Before <<<"$dates" | cut -d= -f2-)
|
||||
end=$(grep After <<<"$dates" | cut -d= -f2-)
|
||||
echo valid from: $(date -d "$start" '+%F %T %Z')
|
||||
echo valid till: $(date -d "$end" '+%F %T %Z')
|
||||
}
|
||||
;;
|
||||
--end)
|
||||
opt="-enddate"
|
||||
FormatOutput() {
|
||||
read end
|
||||
end=$(cut -d= -f2- <<<"$end")
|
||||
date -d "$end" '+%F %T %Z'
|
||||
}
|
||||
;;
|
||||
--issuer)
|
||||
opt="-issuer -nameopt multiline"
|
||||
;;
|
||||
--most-info)
|
||||
opt="-text -certopt no_header,no_version,no_serial,no_signame,no_pubkey,no_sigdump,no_aux"
|
||||
;;
|
||||
--option)
|
||||
shift
|
||||
opt="$1"
|
||||
;;
|
||||
--subject)
|
||||
opt="-subject -nameopt multiline"
|
||||
;;
|
||||
--help)
|
||||
usage
|
||||
exit 0
|
||||
;;
|
||||
--debug)
|
||||
DEBUG="yes"
|
||||
;;
|
||||
*)
|
||||
echo "$(basename $0): invalid option $1" >&2
|
||||
echo "see --help for usage"
|
||||
exit 1
|
||||
;;
|
||||
esac
|
||||
shift
|
||||
done
|
||||
|
||||
CheckLocalCert()
|
||||
{
|
||||
openssl x509 -in $crt -noout $opt
|
||||
}
|
||||
|
||||
CheckRemoteCert()
|
||||
{
|
||||
echo |
|
||||
openssl s_client $servername -connect $host:$port 2>/dev/null |
|
||||
openssl x509 -noout $opt
|
||||
}
|
||||
|
||||
if [ -z "$(type -t FormatOutput)" ]; then
|
||||
FormatOutput() { cat; }
|
||||
fi
|
||||
|
||||
if [ -z "$opt" ]; then
|
||||
opt="-text -certopt no_header,no_version,no_serial,no_signame,no_pubkey,no_sigdump,no_aux"
|
||||
fi
|
||||
|
||||
if [ -z "$source" ]; then
|
||||
echo "ERROR: missing certificate source."
|
||||
echo "Provide one via '--file' or '--host' arguments."
|
||||
echo "See '--help' for examples."
|
||||
exit 1
|
||||
fi
|
||||
|
||||
if [ "$source" == "local" ]; then
|
||||
[ -n "$DEBUG" ] && echo "DEBUG: certificate source is local file"
|
||||
if [ -z "$crt" ]; then
|
||||
echo "ERROR: missing certificate file"
|
||||
exit 1
|
||||
fi
|
||||
[ -n "$DEBUG" ] && echo
|
||||
CheckLocalCert | FormatOutput
|
||||
fi
|
||||
|
||||
if [ "$source" == "remote" ]; then
|
||||
[ -n "$DEBUG" ] && echo "DEBUG: certificate source is remote host"
|
||||
if [ -z "$host" ]; then
|
||||
echo "ERROR: missing remote host value."
|
||||
echo "Provide one via '--host' argument"
|
||||
exit 1
|
||||
fi
|
||||
if [ -z "$port" ]; then
|
||||
[ -n "$DEBUG" ] && echo "DEBUG: defaulting to 443 for port."
|
||||
port="443"
|
||||
fi
|
||||
[ -n "$DEBUG" ] && echo
|
||||
CheckRemoteCert | FormatOutput
|
||||
fi
|
||||
85
style.css
Normal file
85
style.css
Normal file
|
|
@ -0,0 +1,85 @@
|
|||
body {
|
||||
font-family: Arial, sans-serif;
|
||||
transition: background-color 0.5s ease;
|
||||
}
|
||||
|
||||
.light-mode {
|
||||
background-color: #fff;
|
||||
color: #333;
|
||||
}
|
||||
|
||||
.dark-mode {
|
||||
background-color: #333;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
|
||||
#theme-toggle {
|
||||
position: fixed;
|
||||
top: 10px;
|
||||
left: 10px;
|
||||
margin: 5px;
|
||||
padding: 10px;
|
||||
cursor: pointer;
|
||||
/* Nouvelle couleur du texte en mode sombre */
|
||||
color: #000;
|
||||
}
|
||||
|
||||
|
||||
.btnedit {
|
||||
color:#e8dede;
|
||||
background-color:#d9534f;
|
||||
border-color:#adadad;
|
||||
}
|
||||
|
||||
.page-title {
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
background-color: #19191e; /* Couleur de fond du titre */
|
||||
color: green; /* Couleur du texte du titre */
|
||||
padding: 2px;
|
||||
margin: 0;
|
||||
text-align: center;
|
||||
z-index: 1000; /* Pour s'assurer que le titre est au-dessus du reste du contenu */
|
||||
}
|
||||
|
||||
|
||||
footer {
|
||||
/* background-color: #19191e;*/ /* Couleur de fond du titre */
|
||||
color: #fff;
|
||||
padding: 10px;
|
||||
margin: 0;
|
||||
text-align: center;
|
||||
width: 100%;
|
||||
bottom: 0;
|
||||
}
|
||||
|
||||
footer pre {
|
||||
line-height: 0.6;
|
||||
}
|
||||
|
||||
.content {
|
||||
margin-top: 60px; /* Ajustez cette valeur pour éviter que le contenu soit caché derrière le titre fixe */
|
||||
}
|
||||
|
||||
|
||||
|
||||
a, a:hover, a:visited {
|
||||
text-decoration: none;
|
||||
color: inherit;
|
||||
}
|
||||
|
||||
/* Ajoutez cette règle pour styliser l'image */
|
||||
.logo-image {
|
||||
/* float: right; *//* Aligner l'image à droite */
|
||||
position: fixed;
|
||||
top: 5px;
|
||||
right: 10px;
|
||||
margin_: 5px;
|
||||
padding_: 10px;
|
||||
margin-right: 10px;
|
||||
max-height: 50px;
|
||||
|
||||
}
|
||||
140
system.php
Normal file
140
system.php
Normal file
|
|
@ -0,0 +1,140 @@
|
|||
<!doctype html>
|
||||
<html class="no-js">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
|
||||
<title>Server monitor</title>
|
||||
<meta name="description" content="">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
|
||||
<link rel="stylesheet" href="gauge/css/asPieProgress.css">
|
||||
<link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet" integrity="sha384-wvfXpqpZZVQGK6TAh5PVlGOfQNHSoD2xbE+QkPxCAFlNEevoEH3Sl0sibVcOQVnN" crossorigin="anonymous">
|
||||
|
||||
|
||||
<style type="text/css">
|
||||
body {
|
||||
padding-top: 60px;
|
||||
}
|
||||
.pie_progress {
|
||||
width: 200px;
|
||||
margin: 10px auto;
|
||||
}
|
||||
@media all and (max-width: 968px) {
|
||||
.pie_progress {
|
||||
width: 80%;
|
||||
max-width: 810px;
|
||||
}
|
||||
}
|
||||
pre{
|
||||
height: 550px;
|
||||
overflow: scroll;
|
||||
}
|
||||
.title{
|
||||
height: 50px;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body><nav class="navbar navbar-default navbar-fixed-top">
|
||||
<div class="container">
|
||||
<div class="navbar-header">
|
||||
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar">
|
||||
<span class="sr-only">Toggle navigation</span>
|
||||
<span class="icon-bar"></span>
|
||||
<span class="icon-bar"></span>
|
||||
<span class="icon-bar"></span>
|
||||
</button>
|
||||
<a class="navbar-brand" href="#"></a>
|
||||
</div>
|
||||
<div id="navbar" class="navbar-collapse collapse">
|
||||
<a href="/" class="btn btn-success navbar-btn pull-right" ><span class="fa fa-login"></span> <strong>ServerMonitor</strong></a>
|
||||
</div><!--/.nav-collapse -->
|
||||
</div>
|
||||
</nav>
|
||||
<div class="container">
|
||||
<div class="col-xs-4 col-sm-4 col-lg-4" id="cpuDiv">
|
||||
<div class="pie_progress_cpu" role="progressbar" data-goal="33">
|
||||
<div class="pie_progress__number">0%</div>
|
||||
<div class="pie_progress__label">CPU</div>
|
||||
</div>
|
||||
<h1>Cpu</h1>
|
||||
<div class='title'></div>
|
||||
<pre></pre>
|
||||
</div>
|
||||
<div class="col-xs-4 col-sm-4 col-lg-4" id="memDiv">
|
||||
<div class="pie_progress_mem" role="progressbar" data-goal="33">
|
||||
<div class="pie_progress__number">0%</div>
|
||||
<div class="pie_progress__label">Memory</div>
|
||||
</div>
|
||||
<h1>Memory</h1>
|
||||
<div class='title'></div>
|
||||
<pre></pre>
|
||||
</div>
|
||||
<div class="col-xs-4 col-sm-4 col-lg-4" id="diskDiv">
|
||||
<div class="pie_progress_disk" role="progressbar" data-goal="33">
|
||||
<div class="pie_progress__number">0%</div>
|
||||
<div class="pie_progress__label">Disk</div>
|
||||
</div>
|
||||
<h1>Disk</h1>
|
||||
<div class='title'></div>
|
||||
<pre></pre>
|
||||
</div>
|
||||
</div>
|
||||
<script
|
||||
src="https://code.jquery.com/jquery-3.2.1.min.js"
|
||||
integrity="sha256-hwg4gsxgFZhOsEEamdOYGBf13FyQuiTwlAQgxVSNgt4="
|
||||
crossorigin="anonymous"></script>
|
||||
<script type="text/javascript" src="gauge/jquery-asPieProgress.js"></script>
|
||||
<script type="text/javascript">
|
||||
$(document).ready(function () {
|
||||
// Example with grater loading time - loads longer
|
||||
$('.pie_progress_cpu, .pie_progress_mem, .pie_progress_disk').asPieProgress({});
|
||||
getCpu();
|
||||
getMem();
|
||||
getDisk();
|
||||
});
|
||||
|
||||
function getCpu() {
|
||||
$.ajax({
|
||||
url: 'cpu.json.php',
|
||||
success: function (response) {
|
||||
update('cpu', response);
|
||||
setTimeout(function () {
|
||||
getCpu();
|
||||
}, 1000);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
function getMem() {
|
||||
$.ajax({
|
||||
url: 'memory.json.php',
|
||||
success: function (response) {
|
||||
update('mem', response);
|
||||
|
||||
setTimeout(function () {
|
||||
getMem();
|
||||
}, 1000);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
function getDisk() {
|
||||
$.ajax({
|
||||
url: 'disk.json.php',
|
||||
success: function (response) {
|
||||
update('disk', response);
|
||||
setTimeout(function () {
|
||||
getDisk();
|
||||
}, 1000);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
function update(name, response) {
|
||||
$('.pie_progress_' + name).asPieProgress('go', response.percent);
|
||||
$("#" + name + "Div div.title").text(response.title);
|
||||
$("#" + name + "Div pre").text(response.output.join('\n'));
|
||||
}
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
Loading…
Reference in a new issue