mirror of
https://github.com/librenms/librenms.git
synced 2024-10-07 16:52:45 +00:00
Tidy up + new tiles
This commit is contained in:
laf
@ -10,14 +10,14 @@
|
|||||||
* the source code distribution for details.
|
* the source code distribution for details.
|
||||||
*/
|
*/
|
||||||
|
|
||||||
$sql = "SELECT `D`.`hostname`,`D`.`device_id`,`D`.`status`,`D`.`uptime` FROM `devices` AS `D`";
|
$sql = 'SELECT `D`.`hostname`,`D`.`device_id`,`D`.`status`,`D`.`uptime` FROM `devices` AS `D`';
|
||||||
|
|
||||||
if (is_admin() === false && is_read() === false) {
|
if (is_admin() === false && is_read() === false) {
|
||||||
$sql .= " , `devices_perms` AS P WHERE D.`device_id` = P.`device_id` AND P.`user_id` = ? AND";
|
$sql .= ' , `devices_perms` AS P WHERE D.`device_id` = P.`device_id` AND P.`user_id` = ? AND';
|
||||||
$param = array($_SESSION['user_id']);
|
$param = array($_SESSION['user_id']);
|
||||||
}
|
}
|
||||||
else {
|
else {
|
||||||
$sql .= " WHERE";
|
$sql .= ' WHERE';
|
||||||
}
|
}
|
||||||
|
|
||||||
$sql .= " `D`.`ignore` = '0' AND `D`.`disabled` = '0' ORDER BY `hostname`";
|
$sql .= " `D`.`ignore` = '0' AND `D`.`disabled` = '0' ORDER BY `hostname`";
|
||||||
@ -34,12 +34,11 @@ foreach(dbFetchRows($sql,$param) as $device) {
|
|||||||
else {
|
else {
|
||||||
$btn_type = 'btn-danger';
|
$btn_type = 'btn-danger';
|
||||||
}
|
}
|
||||||
$temp_output[] = "<a href='" .generate_url(array('page' => 'device', 'device' => $device['device_id'])). "' role='button' class='btn " . $btn_type . " btn-xs' title='" . $device['hostname'] . "' style='min-height:25px; min-width:25px; border-radius:0px; border:0px; margin:0; padding:0;'></a>";
|
$temp_output[] = '<a href="' .generate_url(array('page' => 'device', 'device' => $device['device_id'])). '" role="button" class="btn ' . $btn_type . ' btn-xs" title="' . $device['hostname'] . '" style="min-height:25px; min-width:25px; border-radius:0px; border:0px; margin:0; padding:0;"></a>';
|
||||||
}
|
}
|
||||||
|
|
||||||
$temp_rows = count($temp_output);
|
$temp_rows = count($temp_output);
|
||||||
|
|
||||||
$temp_output[] = "</div>";
|
$temp_output[] = '</div>';
|
||||||
$temp_header = array("<div style='margin-left:auto; margin-right:auto;'><center><h3>All Devices(" . $temp_rows . ")</h3></center>");
|
$temp_header = array('<div style="margin-left:auto; margin-right:auto;"><center><h3>All Devices(' . $temp_rows . ')</h3></center>');
|
||||||
$common_output = array_merge($temp_header,$temp_output);
|
$common_output = array_merge($temp_header,$temp_output);
|
||||||
|
|
||||||
|
|||||||
@ -49,4 +49,5 @@ $temp_output .= '
|
|||||||
</div>
|
</div>
|
||||||
';
|
';
|
||||||
|
|
||||||
|
unset($common_output);
|
||||||
$common_output[] = $temp_output;
|
$common_output[] = $temp_output;
|
||||||
|
|||||||
@ -1,6 +1,7 @@
|
|||||||
<?php
|
<?php
|
||||||
require_once 'includes/object-cache.inc.php';
|
require_once 'includes/object-cache.inc.php';
|
||||||
?>
|
|
||||||
|
$temp_output = '
|
||||||
<div class="panel panel-default panel-condensed table-responsive">
|
<div class="panel panel-default panel-condensed table-responsive">
|
||||||
<table class="table table-hover table-condensed table-striped">
|
<table class="table table-hover table-condensed table-striped">
|
||||||
<thead>
|
<thead>
|
||||||
@ -8,52 +9,102 @@ require_once 'includes/object-cache.inc.php';
|
|||||||
<th>Summary</th>
|
<th>Summary</th>
|
||||||
<th><a href="devices/">Devices</a></th>
|
<th><a href="devices/">Devices</a></th>
|
||||||
<th><a href="ports/">Ports</a></th>
|
<th><a href="ports/">Ports</a></th>
|
||||||
<?php if ($config['show_services']) { ?>
|
';
|
||||||
|
|
||||||
|
if ($config['show_services']) {
|
||||||
|
|
||||||
|
$temp_output .= '
|
||||||
<th><a href="services/">Services</a></th>
|
<th><a href="services/">Services</a></th>
|
||||||
<?php } ?>
|
';
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
$temp_output .= '
|
||||||
</tr>
|
</tr>
|
||||||
</thead>
|
</thead>
|
||||||
<tbody>
|
<tbody>
|
||||||
<tr class="active">
|
<tr class="active">
|
||||||
<th><span class="green">Up</span></th>
|
<th><span class="green">Up</span></th>
|
||||||
<td><a href="devices/format=list_detail/state=up/"><span class="green"><?php echo($devices['up']) ?></span></a></td>
|
<td><a href="devices/format=list_detail/state=up/"><span class="green">'. $devices['up'] .'</span></a></td>
|
||||||
<td><a href="ports/format=list_detail/state=up/"><span class="green"><?php echo($ports['up']) ?></span></a></td>
|
<td><a href="ports/format=list_detail/state=up/"><span class="green">'. $ports['up'] .'</span></a></td>
|
||||||
<?php if ($config['show_services']) { ?>
|
';
|
||||||
<td><a href="services/view=details/state=up/"><span class="green"><?php echo($services['up']) ?></span></a></td>
|
if ($config['show_services']) {
|
||||||
<?php } ?>
|
|
||||||
|
$temp_output .= '
|
||||||
|
<td><a href="services/view=details/state=up/"><span class="green">'. $services['up'] .'</span></a></td>
|
||||||
|
';
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
$temp_output .= '
|
||||||
</tr>
|
</tr>
|
||||||
<tr class="active">
|
<tr class="active">
|
||||||
<th><span class="red">Down</span></th>
|
<th><span class="red">Down</span></th>
|
||||||
<td><a href="devices/format=list_detail/state=down/"><span class="red"><?php echo($devices['down']) ?></span></a></td>
|
<td><a href="devices/format=list_detail/state=down/"><span class="red">'. $devices['down'] .'</span></a></td>
|
||||||
<td><a href="ports/format=list_detail/state=down/"><span class="red"><?php echo($ports['down']) ?></span></a></td>
|
<td><a href="ports/format=list_detail/state=down/"><span class="red">'. $ports['down'] .'</span></a></td>
|
||||||
<?php if ($config['show_services']) { ?>
|
';
|
||||||
<td><a href="services/view=details/state=down/"><span class="red"><?php echo($services['down']) ?></span></a></td>
|
|
||||||
<?php } ?>
|
if ($config['show_services']) {
|
||||||
|
|
||||||
|
$temp_output .= '
|
||||||
|
<td><a href="services/view=details/state=down/"><span class="red">'. $services['down'] .'</span></a></td>
|
||||||
|
';
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
$temp_output .= '
|
||||||
</tr>
|
</tr>
|
||||||
<tr class="active">
|
<tr class="active">
|
||||||
<th><span class="grey">Ignored</span></th>
|
<th><span class="grey">Ignored</span></th>
|
||||||
<td><a href="devices/format=list_detail/ignore=1/"><span class="grey"><?php echo($devices['ignored']) ?></span></a></td>
|
<td><a href="devices/format=list_detail/ignore=1/"><span class="grey">'. $devices['ignored'] .'</span></a></td>
|
||||||
<td><a href="ports/format=list_detail/ignore=1/"><span class="grey"><?php echo($ports['ignored']) ?></span></a></td>
|
<td><a href="ports/format=list_detail/ignore=1/"><span class="grey">'. $ports['ignored'] .'</span></a></td>
|
||||||
<?php if ($config['show_services']) { ?>
|
';
|
||||||
<td><a href="services/view=details/ignore=1/"><span class="grey"><?php echo($services['ignored']) ?></span></a></td>
|
|
||||||
<?php } ?>
|
if ($config['show_services']) {
|
||||||
|
|
||||||
|
$temp_output .= '
|
||||||
|
<td><a href="services/view=details/ignore=1/"><span class="grey">'. $services['ignored'] .'</span></a></td>
|
||||||
|
';
|
||||||
|
}
|
||||||
|
|
||||||
|
$temp_output .= '
|
||||||
</tr>
|
</tr>
|
||||||
<tr class="active">
|
<tr class="active">
|
||||||
<th><span class="black">Disabled/Shutdown</span></th>
|
<th><span class="black">Disabled/Shutdown</span></th>
|
||||||
<td><a href="devices/format=list_detail/disabled=1/"><span class="black"><?php echo($devices['disabled']) ?></span></a></td>
|
<td><a href="devices/format=list_detail/disabled=1/"><span class="black">'. $devices['disabled'] .'</span></a></td>
|
||||||
<td><a href="ports/format=list_detail/state=admindown/"><span class="black"><?php echo($ports['shutdown']) ?></span></a></td>
|
<td><a href="ports/format=list_detail/state=admindown/"><span class="black">'. $ports['shutdown'] .'</span></a></td>
|
||||||
<?php if ($config['show_services']) { ?>
|
';
|
||||||
<td><a href="services/view=details/disabled=1/"><span class="black"><?php echo($services['disabled']) ?></span></a></td>
|
|
||||||
<?php } ?>
|
if ($config['show_services']) {
|
||||||
|
|
||||||
|
$temp_output .= '
|
||||||
|
<td><a href="services/view=details/disabled=1/"><span class="black">'. $services['disabled'] .'</span></a></td>
|
||||||
|
';
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
$temp_output .= '
|
||||||
</tr>
|
</tr>
|
||||||
<tr class="active">
|
<tr class="active">
|
||||||
<th>Total</th>
|
<th>Total</th>
|
||||||
<td><a href="devices/"><span><?php echo($devices['count']) ?></span></a></td>
|
<td><a href="devices/"><span>'. $devices['count'] .'</span></a></td>
|
||||||
<td><a href="ports/"><span><?php echo($ports['count']) ?></span></a></td>
|
<td><a href="ports/"><span>'. $ports['count'] .'</span></a></td>
|
||||||
<?php if ($config['show_services']) { ?>
|
';
|
||||||
<td><a href="services/"><span><?php echo($services['count']) ?></span></a></td>
|
|
||||||
<?php } ?>
|
if ($config['show_services']) {
|
||||||
|
|
||||||
|
$temp_output .= '
|
||||||
|
<td><a href="services/"><span>'. $services['count'] .'</span></a></td>
|
||||||
|
';
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
$temp_output .= '
|
||||||
</tr>
|
</tr>
|
||||||
</tbody>
|
</tbody>
|
||||||
</table>
|
</table>
|
||||||
</div>
|
</div>
|
||||||
|
';
|
||||||
|
|
||||||
|
unset($common_output);
|
||||||
|
$common_output[] = $temp_output;
|
||||||
108
html/includes/common/globe.inc.php
Normal file
108
html/includes/common/globe.inc.php
Normal file
@ -0,0 +1,108 @@
|
|||||||
|
<?php
|
||||||
|
/* Copyright (C) 2014 Daniel Preussker <f0o@devilcode.org>
|
||||||
|
* This program is free software: you can redistribute it and/or modify
|
||||||
|
* it under the terms of the GNU General Public License as published by
|
||||||
|
* the Free Software Foundation, either version 3 of the License, or
|
||||||
|
* (at your option) any later version.
|
||||||
|
*
|
||||||
|
* This program is distributed in the hope that it will be useful,
|
||||||
|
* but WITHOUT ANY WARRANTY; without even the implied warranty of
|
||||||
|
* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.See the
|
||||||
|
* GNU General Public License for more details.
|
||||||
|
*
|
||||||
|
* You should have received a copy of the GNU General Public License
|
||||||
|
* along with this program. If not, see <http://www.gnu.org/licenses/>.
|
||||||
|
*/
|
||||||
|
|
||||||
|
/*
|
||||||
|
* Custom Frontpage
|
||||||
|
* @author f0o <f0o@devilcode.org>
|
||||||
|
* @copyright 2014 f0o, LibreNMS
|
||||||
|
* @license GPL
|
||||||
|
* @package LibreNMS
|
||||||
|
* @subpackage Frontpage
|
||||||
|
*/
|
||||||
|
|
||||||
|
$temp_output .= "
|
||||||
|
<script type='text/javascript'>
|
||||||
|
google.load('visualization', '1', {'packages': ['geochart'], callback: function() {
|
||||||
|
|
||||||
|
drawRegionsMap();
|
||||||
|
function drawRegionsMap() {
|
||||||
|
var data = new google.visualization.DataTable();
|
||||||
|
data.addColumn('string', 'Site');
|
||||||
|
data.addColumn('number', 'Status');
|
||||||
|
data.addColumn('number', 'Size');
|
||||||
|
data.addColumn({type: 'string', role: 'tooltip', 'p': {'html': true}});
|
||||||
|
data.addRows([
|
||||||
|
";
|
||||||
|
|
||||||
|
$locations = array();
|
||||||
|
foreach (getlocations() as $location) {
|
||||||
|
$devices = array();
|
||||||
|
$devices_down = array();
|
||||||
|
$devices_up = array();
|
||||||
|
$count = 0;
|
||||||
|
$down = 0;
|
||||||
|
foreach (dbFetchRows("SELECT devices.device_id,devices.hostname,devices.status FROM devices LEFT JOIN devices_attribs ON devices.device_id = devices_attribs.device_id WHERE ( devices.location = ? || ( devices_attribs.attrib_type = 'override_sysLocation_string' && devices_attribs.attrib_value = ? ) ) && devices.disabled = 0 && devices.ignore = 0 GROUP BY devices.hostname", array($location,$location)) as $device) {
|
||||||
|
if( $config['frontpage_globe']['markers'] == 'devices' || empty($config['frontpage_globe']['markers']) ) {
|
||||||
|
$devices[] = $device['hostname'];
|
||||||
|
$count++;
|
||||||
|
if( $device['status'] == "0" ) {
|
||||||
|
$down++;
|
||||||
|
$devices_down[] = $device['hostname']." DOWN";
|
||||||
|
}
|
||||||
|
else {
|
||||||
|
$devices_up[] = $device;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
elseif( $config['frontpage_globe']['markers'] == 'ports' ) {
|
||||||
|
foreach( dbFetchRows("SELECT ifName,ifOperStatus,ifAdminStatus FROM ports WHERE ports.device_id = ? && ports.ignore = 0 && ports.disabled = 0 && ports.deleted = 0",array($device['device_id'])) as $port ) {
|
||||||
|
$count++;
|
||||||
|
if( $port['ifOperStatus'] == 'down' && $port['ifAdminStatus'] == 'up' ) {
|
||||||
|
$down++;
|
||||||
|
$devices_down[] = $device['hostname']."/".$port['ifName']." DOWN";
|
||||||
|
}
|
||||||
|
else {
|
||||||
|
$devices_up[] = $port;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
$pdown = ($down / $count)*100;
|
||||||
|
if( $config['frontpage_globe']['markers'] == 'devices' || empty($config['frontpage_globe']['markers']) ) {
|
||||||
|
$devices_down = array_merge(array(count($devices_up). " Devices OK"), $devices_down);
|
||||||
|
}
|
||||||
|
elseif( $config['frontpage_globe']['markers'] == 'ports' ) {
|
||||||
|
$devices_down = array_merge(array(count($devices_up). " Ports OK"), $devices_down);
|
||||||
|
}
|
||||||
|
$locations[] = " ['".$location."', ".$pdown.", ".$count.", '".implode(",<br/> ", $devices_down)."']";
|
||||||
|
}
|
||||||
|
$temp_output .= implode(",\n", $locations);
|
||||||
|
|
||||||
|
$map_world = $config['frontpage_globe']['region'] ? $config['frontpage_globe']['region'] : 'world';
|
||||||
|
$map_countries = $config['frontpage_globe']['resolution'] ? $config['frontpage_globe']['resolution'] : 'countries';
|
||||||
|
|
||||||
|
$temp_output .= "
|
||||||
|
]);
|
||||||
|
var options = {
|
||||||
|
region: '". $map_world ."',
|
||||||
|
resolution: '". $map_countries ."',
|
||||||
|
displayMode: 'markers',
|
||||||
|
keepAspectRatio: 1,
|
||||||
|
magnifyingGlass: {enable: true, zoomFactor: 100},
|
||||||
|
colorAxis: {minValue: 0, maxValue: 100, colors: ['green', 'yellow', 'red']},
|
||||||
|
markerOpacity: 0.90,
|
||||||
|
tooltip: {isHtml: true},
|
||||||
|
};
|
||||||
|
var chart = new google.visualization.GeoChart(document.getElementById('chart_div'));
|
||||||
|
chart.draw(data, options);
|
||||||
|
};
|
||||||
|
}
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
<div id='chart_div'></div>
|
||||||
|
";
|
||||||
|
|
||||||
|
unset($common_output);
|
||||||
|
$common_output[] = $temp_output;
|
||||||
@ -1,45 +0,0 @@
|
|||||||
<?php
|
|
||||||
require_once 'includes/object-cache.inc.php';
|
|
||||||
?>
|
|
||||||
<div class="panel panel-default panel-condensed table-responsive">
|
|
||||||
<table class="table table-hover table-condensed table-striped">
|
|
||||||
<thead>
|
|
||||||
<tr class="info">
|
|
||||||
<th> </th>
|
|
||||||
<th>Total</th>
|
|
||||||
<th>Up</th>
|
|
||||||
<th>Down</th>
|
|
||||||
<th>Ignored</th>
|
|
||||||
<th>Disabled</th>
|
|
||||||
</tr>
|
|
||||||
</thead>
|
|
||||||
<tbody>
|
|
||||||
<tr class="active">
|
|
||||||
<td><a href="devices/">Devices</a></td>
|
|
||||||
<td><a href="devices/"><span><?php echo($devices['count']) ?></span></a></td>
|
|
||||||
<td><a href="devices/state=up/format=list_detail/"><span class="green"> <?php echo($devices['up']) ?> up</span></a></td>
|
|
||||||
<td><a href="devices/state=down/format=list_detail/"><span class="red"> <?php echo($devices['down']) ?> down</span></a></td>
|
|
||||||
<td><a href="devices/ignore=1/format=list_detail/"><span class="grey"> <?php echo($devices['ignored']) ?> ignored </span></a></td>
|
|
||||||
<td><a href="devices/disabled=1/format=list_detail/"><span class="black"> <?php echo($devices['disabled']) ?> disabled</span></a></td>
|
|
||||||
</tr>
|
|
||||||
<tr class="active">
|
|
||||||
<td><a href="ports/">Ports</a></td>
|
|
||||||
<td><a href="ports/"><span><?php echo($ports['count']) ?></span></a></td>
|
|
||||||
<td><a href="ports/format=list_detail/state=up/"><span class="green"> <?php echo($ports['up']) ?> up </span></a></td>
|
|
||||||
<td><a href="ports/format=list_detail/state=down/"><span class="red"> <?php echo($ports['down']) ?> down </span></a></td>
|
|
||||||
<td><a href="ports/format=list_detail/ignore=1/"><span class="grey"> <?php echo($ports['ignored']) ?> ignored </span></a></td>
|
|
||||||
<td><a href="ports/format=list_detail/state=admindown/"><span class="black"> <?php echo($ports['shutdown']) ?> shutdown</span></a></td>
|
|
||||||
</tr>
|
|
||||||
<?php if ($config['show_services']) { ?>
|
|
||||||
<tr class="active">
|
|
||||||
<td><a href="services/">Services</a></td>
|
|
||||||
<td><a href="services/"><span><?php echo($services['count']) ?></span></a></td>
|
|
||||||
<td><a href="services/state=up/view=details/"><span class="green"><?php echo($services['up']) ?> up</span></a></td>
|
|
||||||
<td><a href="services/state=down/view=details/"><span class="red"> <?php echo($services['down']) ?> down</span></a></td>
|
|
||||||
<td><a href="services/ignore=1/view=details/"><span class="grey"> <?php echo($services['ignored']) ?> ignored</span></a></td>
|
|
||||||
<td><a href="services/disabled=1/view=details/"><span class="black"> <?php echo($services['disabled']) ?> disabled</span></a></td>
|
|
||||||
</tr>
|
|
||||||
<?php } ?>
|
|
||||||
</tbody>
|
|
||||||
</table>
|
|
||||||
</div>
|
|
||||||
@ -1,84 +0,0 @@
|
|||||||
<div class="row">
|
|
||||||
<div class="col-sm-12">
|
|
||||||
<span id="message"></span>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="table-responsive">
|
|
||||||
<table id="alerts" class="table table-hover table-condensed alerts">
|
|
||||||
<thead>
|
|
||||||
<tr>
|
|
||||||
<th data-column-id="status" data-formatter="status" data-sortable="false">Status</th>
|
|
||||||
<th data-column-id="rule">Rule</th>
|
|
||||||
<th data-column-id="details" data-sortable="false"> </th>
|
|
||||||
<th data-column-id="hostname">Hostname</th>
|
|
||||||
<th data-column-id="timestamp">Timestamp</th>
|
|
||||||
<th data-column-id="severity">Severity</th>
|
|
||||||
<th data-column-id="ack" data-formatter="ack" data-sortable="false">Acknowledge</th>
|
|
||||||
</tr>
|
|
||||||
</thead>
|
|
||||||
</table>
|
|
||||||
</div>
|
|
||||||
<script>
|
|
||||||
var grid = $("#alerts").bootgrid({
|
|
||||||
ajax: true,
|
|
||||||
post: function ()
|
|
||||||
{
|
|
||||||
return {
|
|
||||||
id: "alerts",
|
|
||||||
device_id: '<?php echo $device['device_id']; ?>'
|
|
||||||
};
|
|
||||||
},
|
|
||||||
url: "/ajax_table.php",
|
|
||||||
formatters: {
|
|
||||||
"status": function(column,row) {
|
|
||||||
return "<h4><span class='label label-"+row.extra+" threeqtr-width'>" + row.msg + "</span></h4>";
|
|
||||||
},
|
|
||||||
"ack": function(column,row) {
|
|
||||||
return "<button type='button' class='btn btn-"+row.ack_col+" btn-sm command-ack-alert' data-target='#ack-alert' data-state='"+row.state+"' data-alert_id='"+row.alert_id+"' name='ack-alert' id='ack-alert' data-extra='"+row.extra+"'><span class='glyphicon glyphicon-"+row.ack_ico+"'aria-hidden='true'></span></button>";
|
|
||||||
}
|
|
||||||
},
|
|
||||||
templates: {
|
|
||||||
}
|
|
||||||
}).on("loaded.rs.jquery.bootgrid", function() {
|
|
||||||
grid.find(".incident-toggle").each( function() {
|
|
||||||
$(this).parent().addClass('incident-toggle-td');
|
|
||||||
}).on("click", function(e) {
|
|
||||||
var target = $(this).data("target");
|
|
||||||
$(target).collapse('toggle');
|
|
||||||
$(this).toggleClass('glyphicon-plus glyphicon-minus');
|
|
||||||
});
|
|
||||||
grid.find(".incident").each( function() {
|
|
||||||
$(this).parent().addClass('col-lg-4 col-md-4 col-sm-4 col-xs-4');
|
|
||||||
$(this).parent().parent().on("mouseenter", function() {
|
|
||||||
$(this).find(".incident-toggle").fadeIn(200);
|
|
||||||
}).on("mouseleave", function() {
|
|
||||||
$(this).find(".incident-toggle").fadeOut(200);
|
|
||||||
}).on("click", "td:not(.incident-toggle-td)", function() {
|
|
||||||
var target = $(this).parent().find(".incident-toggle").data("target");
|
|
||||||
if( $(this).parent().find(".incident-toggle").hasClass('glyphicon-plus') ) {
|
|
||||||
$(this).parent().find(".incident-toggle").toggleClass('glyphicon-plus glyphicon-minus');
|
|
||||||
$(target).collapse('toggle');
|
|
||||||
}
|
|
||||||
});
|
|
||||||
});
|
|
||||||
grid.find(".command-ack-alert").on("click", function(e) {
|
|
||||||
e.preventDefault();
|
|
||||||
var alert_id = $(this).data("alert_id");
|
|
||||||
var state = $(this).data("state");
|
|
||||||
$.ajax({
|
|
||||||
type: "POST",
|
|
||||||
url: "/ajax_form.php",
|
|
||||||
data: { type: "ack-alert", alert_id: alert_id, state: state },
|
|
||||||
success: function(msg){
|
|
||||||
$("#message").html('<div class="alert alert-info">'+msg+'</div>');
|
|
||||||
if(msg.indexOf("ERROR:") <= -1) {
|
|
||||||
location.reload();
|
|
||||||
}
|
|
||||||
},
|
|
||||||
error: function(){
|
|
||||||
$("#message").html('<div class="alert alert-info">An error occurred acking this alert.</div>');
|
|
||||||
}
|
|
||||||
});
|
|
||||||
});
|
|
||||||
});
|
|
||||||
</script>
|
|
||||||
@ -160,6 +160,8 @@ else {
|
|||||||
<script src="js/lazyload.js"></script>
|
<script src="js/lazyload.js"></script>
|
||||||
<script type="text/javascript">
|
<script type="text/javascript">
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
<!-- Begin
|
<!-- Begin
|
||||||
function popUp(URL)
|
function popUp(URL)
|
||||||
{
|
{
|
||||||
|
|||||||
@ -13,5 +13,6 @@
|
|||||||
*/
|
*/
|
||||||
|
|
||||||
$device['device_id'] = '-1';
|
$device['device_id'] = '-1';
|
||||||
require_once 'includes/print-alerts.php';
|
require_once 'includes/common/alerts.inc.php';
|
||||||
|
echo implode('',$common_output);
|
||||||
unset($device['device_id']);
|
unset($device['device_id']);
|
||||||
|
|||||||
@ -1,40 +1,4 @@
|
|||||||
<?php
|
<?php
|
||||||
/*
|
|
||||||
* LibreNMS
|
|
||||||
*
|
|
||||||
* Copyright (c) 2015 Søren Friis Rosiak <sorenrosiak@gmail.com>
|
|
||||||
* This program is free software: you can redistribute it and/or modify it
|
|
||||||
* under the terms of the GNU General Public License as published by the
|
|
||||||
* Free Software Foundation, either version 3 of the License, or (at your
|
|
||||||
* option) any later version. Please see LICENSE.txt at the top level of
|
|
||||||
* the source code distribution for details.
|
|
||||||
*/
|
|
||||||
|
|
||||||
if ($_SESSION['userlevel'] >= '10') {
|
include_once 'includes/common/availability-map.inc.php';
|
||||||
$sql = "SELECT `hostname`,`device_id`,`status`,`uptime` FROM `devices` WHERE `ignore` = '0' AND `disabled` = '0' ORDER BY `hostname`";
|
echo implode('',$common_output);
|
||||||
$sqlcount = "SELECT COUNT(*) FROM `devices` WHERE `ignore` = '0' AND `disabled` = '0' ORDER BY `hostname`";
|
|
||||||
$rows = dbFetchCell($sqlcount);
|
|
||||||
echo "<div style='max-width:800px; margin-left:auto; margin-right:auto;'><center><h3>All Devices(" . $rows . ")</h3></center>";
|
|
||||||
}
|
|
||||||
else {
|
|
||||||
$sql = "SELECT D.`hostname`,D.`device_id`,D.`status`,D.`uptime` FROM `devices` AS D, `devices_perms` AS P WHERE D.`device_id` = P.`device_id` AND P.`user_id` = '" . $_SESSION['user_id'] . "' AND D.`ignore` = '0' AND D.`disabled` = '0' ORDER BY D.`hostname`";
|
|
||||||
$sqlcount = "SELECT COUNT(*) FROM `devices` AS D, `devices_perms` AS P WHERE D.`device_id` = P.`device_id` AND P.`user_id` = '" . $_SESSION['user_id'] . "' AND D.`ignore` = '0' AND D.`disabled` = '0' ORDER BY D.`hostname`";
|
|
||||||
$rows = dbFetchCell($sqlcount);
|
|
||||||
echo "<div style='max-width:800px; margin-left:auto; margin-right:auto;'><center><h3>All Devices(" . $rows . ")</h3></center>";
|
|
||||||
}
|
|
||||||
|
|
||||||
foreach(dbFetchRows($sql) as $device) {
|
|
||||||
if ($device['status'] == '1') {
|
|
||||||
$btn_type = 'btn-success';
|
|
||||||
if ($device['uptime'] < $config['uptime_warning']) {
|
|
||||||
$btn_type = 'btn-warning';
|
|
||||||
}
|
|
||||||
}
|
|
||||||
else {
|
|
||||||
$btn_type = 'btn-danger';
|
|
||||||
}
|
|
||||||
echo "<a href='" .generate_url(array('page' => 'device', 'device' => $device['device_id'])). "' role='button' class='btn " . $btn_type . " btn-xs' title='" . $device['hostname'] . "' style='min-height:25px; min-width:25px; border-radius:0px;'></a>";
|
|
||||||
|
|
||||||
}
|
|
||||||
|
|
||||||
echo "</div>";
|
|
||||||
|
|||||||
@ -12,4 +12,5 @@
|
|||||||
* the source code distribution for details.
|
* the source code distribution for details.
|
||||||
*/
|
*/
|
||||||
|
|
||||||
require_once 'includes/print-alerts.php';
|
require_once 'includes/common/alerts.inc.php';
|
||||||
|
echo implode('',$common_output);
|
||||||
|
|||||||
@ -160,7 +160,8 @@ if ($config['vertical_summary']) {
|
|||||||
}
|
}
|
||||||
else {
|
else {
|
||||||
echo ' <div class="col-md-4">';
|
echo ' <div class="col-md-4">';
|
||||||
include_once 'includes/device-summary-horiz.inc.php';
|
include_once 'includes/common/device-summary-horiz.inc.php';
|
||||||
|
echo implode('',$common_output);
|
||||||
}
|
}
|
||||||
|
|
||||||
echo '
|
echo '
|
||||||
|
|||||||
@ -23,84 +23,22 @@
|
|||||||
* @subpackage Frontpage
|
* @subpackage Frontpage
|
||||||
*/
|
*/
|
||||||
|
|
||||||
?>
|
|
||||||
<script type='text/javascript' src='https://www.google.com/jsapi'></script>
|
|
||||||
<script type='text/javascript'>
|
|
||||||
google.load('visualization', '1', {'packages': ['geochart']});
|
|
||||||
google.setOnLoadCallback(drawRegionsMap);
|
|
||||||
function drawRegionsMap() {
|
|
||||||
var data = new google.visualization.DataTable();
|
|
||||||
data.addColumn('string', 'Site');
|
|
||||||
data.addColumn('number', 'Status');
|
|
||||||
data.addColumn('number', 'Size');
|
|
||||||
data.addColumn({type: 'string', role: 'tooltip', 'p': {'html': true}});
|
|
||||||
data.addRows([
|
|
||||||
<?php
|
|
||||||
$locations = array();
|
|
||||||
foreach (getlocations() as $location) {
|
|
||||||
$devices = array();
|
|
||||||
$devices_down = array();
|
|
||||||
$devices_up = array();
|
|
||||||
$count = 0;
|
|
||||||
$down = 0;
|
|
||||||
foreach (dbFetchRows("SELECT devices.device_id,devices.hostname,devices.status FROM devices LEFT JOIN devices_attribs ON devices.device_id = devices_attribs.device_id WHERE ( devices.location = ? || ( devices_attribs.attrib_type = 'override_sysLocation_string' && devices_attribs.attrib_value = ? ) ) && devices.disabled = 0 && devices.ignore = 0 GROUP BY devices.hostname", array($location,$location)) as $device) {
|
|
||||||
if( $config['frontpage_globe']['markers'] == 'devices' || empty($config['frontpage_globe']['markers']) ) {
|
|
||||||
$devices[] = $device['hostname'];
|
|
||||||
$count++;
|
|
||||||
if( $device['status'] == "0" ) {
|
|
||||||
$down++;
|
|
||||||
$devices_down[] = $device['hostname']." DOWN";
|
|
||||||
}
|
|
||||||
else {
|
|
||||||
$devices_up[] = $device;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
elseif( $config['frontpage_globe']['markers'] == 'ports' ) {
|
|
||||||
foreach( dbFetchRows("SELECT ifName,ifOperStatus,ifAdminStatus FROM ports WHERE ports.device_id = ? && ports.ignore = 0 && ports.disabled = 0 && ports.deleted = 0",array($device['device_id'])) as $port ) {
|
|
||||||
$count++;
|
|
||||||
if( $port['ifOperStatus'] == 'down' && $port['ifAdminStatus'] == 'up' ) {
|
|
||||||
$down++;
|
|
||||||
$devices_down[] = $device['hostname']."/".$port['ifName']." DOWN";
|
|
||||||
}
|
|
||||||
else {
|
|
||||||
$devices_up[] = $port;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
$pdown = ($down / $count)*100;
|
|
||||||
if( $config['frontpage_globe']['markers'] == 'devices' || empty($config['frontpage_globe']['markers']) ) {
|
|
||||||
$devices_down = array_merge(array(count($devices_up). " Devices OK"), $devices_down);
|
|
||||||
}
|
|
||||||
elseif( $config['frontpage_globe']['markers'] == 'ports' ) {
|
|
||||||
$devices_down = array_merge(array(count($devices_up). " Ports OK"), $devices_down);
|
|
||||||
}
|
|
||||||
$locations[] = " ['".$location."', ".$pdown.", ".$count.", '".implode(",<br/> ", $devices_down)."']";
|
|
||||||
}
|
|
||||||
echo implode(",\n", $locations);
|
|
||||||
?>
|
?>
|
||||||
|
|
||||||
]);
|
<script src='https://www.google.com/jsapi'></script>
|
||||||
var options = {
|
|
||||||
region: '<?php echo($config['frontpage_globe']['region'] ? $config['frontpage_globe']['region'] : "world") ?>',
|
|
||||||
resolution: '<?php echo($config['frontpage_globe']['resolution'] ? $config['frontpage_globe']['resolution'] : "countries") ?>',
|
|
||||||
displayMode: 'markers',
|
|
||||||
keepAspectRatio: 1,
|
|
||||||
magnifyingGlass: {enable: true, zoomFactor: 100},
|
|
||||||
colorAxis: {minValue: 0, maxValue: 100, colors: ['green', 'yellow', 'red']},
|
|
||||||
markerOpacity: 0.90,
|
|
||||||
tooltip: {isHtml: true},
|
|
||||||
};
|
|
||||||
var chart = new google.visualization.GeoChart(document.getElementById('chart_div'));
|
|
||||||
chart.draw(data, options);
|
|
||||||
};
|
|
||||||
</script>
|
|
||||||
<?php
|
<?php
|
||||||
include_once("includes/object-cache.inc.php");
|
|
||||||
|
include_once 'includes/object-cache.inc.php';
|
||||||
echo '<div class="container-fluid">
|
echo '<div class="container-fluid">
|
||||||
<div class="row">
|
<div class="row">
|
||||||
<div class="col-md-8">
|
<div class="col-md-8">
|
||||||
<div id="chart_div"></div>
|
';
|
||||||
|
|
||||||
|
include_once 'includes/common/globe.inc.php';
|
||||||
|
echo implode(',',$common_output);
|
||||||
|
|
||||||
|
echo '
|
||||||
</div>
|
</div>
|
||||||
<div class="col-md-4">
|
<div class="col-md-4">
|
||||||
<div class="container-fluid">
|
<div class="container-fluid">
|
||||||
@ -120,7 +58,8 @@ echo ' </div>
|
|||||||
<div class="row">
|
<div class="row">
|
||||||
<div class="col-md-12">';
|
<div class="col-md-12">';
|
||||||
$device['device_id'] = '-1';
|
$device['device_id'] = '-1';
|
||||||
require_once('includes/print-alerts.php');
|
require_once('includes/common/alerts.inc.php');
|
||||||
|
echo implode('',$common_output);
|
||||||
unset($device['device_id']);
|
unset($device['device_id']);
|
||||||
echo ' </div>
|
echo ' </div>
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
@ -14,15 +14,15 @@
|
|||||||
|
|
||||||
$no_refresh = true;
|
$no_refresh = true;
|
||||||
|
|
||||||
foreach (dbFetchRows("SELECT * FROM `dashboard_items` WHERE `user_id`=?",array($_SESSION['user_id'])) as $items) {
|
foreach (dbFetchRows('SELECT * FROM `dashboard_items` WHERE `user_id`=?',array($_SESSION['user_id'])) as $items) {
|
||||||
$data[] = $items;
|
$data[] = $items;
|
||||||
}
|
}
|
||||||
|
|
||||||
if (!is_array($data)) {
|
if (!is_array($data)) {
|
||||||
$data[] = array('dashboard_item_id'=>'0','widget_id'=>1,'title'=>'Add a widget','content'=>'placeholder','col'=>1,'row'=>1,'size_x'=>1,'size_y'=>1,'refresh'=>60);
|
$data[] = array('dashboard_item_id'=>'0','widget_id'=>1,'title'=>'Add a widget','content'=>'placeholder','col'=>1,'row'=>1,'size_x'=>2,'size_y'=>2,'refresh'=>60);
|
||||||
}
|
}
|
||||||
|
|
||||||
$data = serialize(_json_encode($data));
|
$data = serialize(json_encode($data));
|
||||||
$dash_config = unserialize(stripslashes($data));
|
$dash_config = unserialize(stripslashes($data));
|
||||||
|
|
||||||
$new_tile = '
|
$new_tile = '
|
||||||
@ -40,17 +40,21 @@ $new_title .= '
|
|||||||
|
|
||||||
?>
|
?>
|
||||||
|
|
||||||
<button type='button' id='new-tile' class='btn btn-primary btn-sm' name='new-dashboard-tile' data-html='true' data-container='body' data-toggle='popover' data-placement='right' data-content='<a href="#">
|
<button type='button' id='new-tile' class='btn btn-success btn-sm' name='new-dashboard-tile' data-html='true' data-container='body' data-toggle='popover' data-placement='right' data-content='<a href="#">
|
||||||
<?php
|
<?php
|
||||||
echo $new_tile;
|
echo $new_tile;
|
||||||
?>
|
?>
|
||||||
</a>'><span class='glyphicon glyphicon-plus' aria-hidden='true'></span></button>
|
</a>'><span class='glyphicon glyphicon-plus' aria-hidden='true'></span> Add tile</button>
|
||||||
<script>
|
<script>
|
||||||
$('#new-tile').popover();
|
$('#new-tile').popover();
|
||||||
|
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
|
<script src='https://www.google.com/jsapi'></script>
|
||||||
<script src="js/jquery.gridster.min.js"></script>
|
<script src="js/jquery.gridster.min.js"></script>
|
||||||
|
|
||||||
<span class="message" id="message"></span>
|
<span class="message" id="message"></span>
|
||||||
|
|
||||||
<div class="row">
|
<div class="row">
|
||||||
<div class="col-sm-12">
|
<div class="col-sm-12">
|
||||||
<div class="gridster grid">
|
<div class="gridster grid">
|
||||||
@ -58,92 +62,26 @@ $('#new-tile').popover();
|
|||||||
</ul>
|
</ul>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
<script type="text/javascript">
|
<script type="text/javascript">
|
||||||
var gridster;
|
var gridster;
|
||||||
|
|
||||||
// same object than generated with gridster.serialize() method
|
var serialization = <?php echo $dash_config; ?>;
|
||||||
var serialization = <?php echo $dash_config; ?>;
|
|
||||||
|
|
||||||
|
serialization = Gridster.sort_by_row_and_col_asc(serialization);
|
||||||
|
|
||||||
// sort serialization
|
function updatePos(gridster) {
|
||||||
serialization = Gridster.sort_by_row_and_col_asc(serialization);
|
var s = JSON.stringify(gridster.serialize());
|
||||||
|
$.ajax({
|
||||||
function updatePos(gridster) {
|
|
||||||
var s = JSON.stringify(gridster.serialize());
|
|
||||||
$.ajax({
|
|
||||||
type: 'POST',
|
type: 'POST',
|
||||||
url: '/ajax_form.php',
|
url: '/ajax_form.php',
|
||||||
data: {type: "update-dashboard-config", data: s},
|
data: {type: "update-dashboard-config", data: s},
|
||||||
dataType: "json",
|
dataType: "json",
|
||||||
success: function (data) {
|
success: function (data) {
|
||||||
if (data.status == 'ok') {
|
if (data.status == 'ok') {
|
||||||
} else {
|
|
||||||
$("#message").html('<div class="alert alert-info">' + data.message + '</div>');
|
|
||||||
}
|
}
|
||||||
},
|
else {
|
||||||
error: function () {
|
|
||||||
$("#message").html('<div class="alert alert-info">An error occurred.</div>');
|
|
||||||
}
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
$(function(){
|
|
||||||
|
|
||||||
gridster = $(".gridster ul").gridster({
|
|
||||||
widget_base_dimensions: [200, 200],
|
|
||||||
widget_margins: [5, 5],
|
|
||||||
autogrow_cols: true,
|
|
||||||
min_cols: 1,
|
|
||||||
min_rows: 2,
|
|
||||||
draggable: {
|
|
||||||
handle: 'header',
|
|
||||||
stop: function(e, ui, $widget) {
|
|
||||||
updatePos(gridster);
|
|
||||||
},
|
|
||||||
},
|
|
||||||
resize: {
|
|
||||||
enabled: true,
|
|
||||||
stop: function(e, ui, $widget) {
|
|
||||||
updatePos(gridster);
|
|
||||||
}
|
|
||||||
},
|
|
||||||
serialize_params: function($w, wgd) {
|
|
||||||
return {
|
|
||||||
id: $($w).attr('id'),
|
|
||||||
col: wgd.col,
|
|
||||||
row: wgd.row,
|
|
||||||
size_x: wgd.size_x,
|
|
||||||
size_y: wgd.size_y
|
|
||||||
};
|
|
||||||
}
|
|
||||||
}).data('gridster');
|
|
||||||
|
|
||||||
|
|
||||||
gridster.remove_all_widgets();
|
|
||||||
$.each(serialization, function() {
|
|
||||||
gridster.add_widget(
|
|
||||||
'<li id="'+this.dashboard_item_id+'">'+
|
|
||||||
'\<script\>var timeout'+this.dashboard_item_id+' = grab_data('+this.dashboard_item_id+','+this.refresh+',\''+this.content+'\');\<\/script\>'+
|
|
||||||
'<header class="tile_header">'+this.title+'<button type="button" class="close" data-tile-id="'+this.dashboard_item_id+'" aria-label="Close"><span aria-hidden="true">×</span></button></header>'+
|
|
||||||
'<div class="tile_body" id="tile_body_'+this.dashboard_item_id+'">'+this.content+'</div>'+
|
|
||||||
'</li>',
|
|
||||||
this.size_x, this.size_y, this.col, this.row);
|
|
||||||
});
|
|
||||||
|
|
||||||
var gridster = $('.gridster ul').gridster().data('gridster');
|
|
||||||
$(document).on( "click", ".close", function() {
|
|
||||||
var tile_id = $(this).data('tile-id');
|
|
||||||
$.ajax({
|
|
||||||
type: 'POST',
|
|
||||||
url: '/ajax_form.php',
|
|
||||||
data: {type: "update-dashboard-config", sub_type: 'remove', tile_id: tile_id},
|
|
||||||
dataType: "json",
|
|
||||||
success: function (data) {
|
|
||||||
if (data.status == 'ok') {
|
|
||||||
gridster.remove_widget($('#'+tile_id));
|
|
||||||
updatePos(gridster);
|
|
||||||
} else {
|
|
||||||
$("#message").html('<div class="alert alert-info">' + data.message + '</div>');
|
$("#message").html('<div class="alert alert-info">' + data.message + '</div>');
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
@ -151,64 +89,132 @@ $('#new-tile').popover();
|
|||||||
$("#message").html('<div class="alert alert-info">An error occurred.</div>');
|
$("#message").html('<div class="alert alert-info">An error occurred.</div>');
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
});
|
|
||||||
|
|
||||||
$(document).on('change','#tile_id',function(){
|
|
||||||
var tile_id = $(this).val();
|
|
||||||
$.ajax({
|
|
||||||
type: 'POST',
|
|
||||||
url: '/ajax_form.php',
|
|
||||||
data: {type: "update-dashboard-config", sub_type: 'add', tile_id: tile_id},
|
|
||||||
dataType: "json",
|
|
||||||
success: function (data) {
|
|
||||||
if (data.status == 'ok') {
|
|
||||||
var item_id = data.extra.item_id;
|
|
||||||
var title = data.extra.title;
|
|
||||||
var content = data.extra.content;
|
|
||||||
var size_x = data.extra.size_x;
|
|
||||||
var size_y = data.extra.size_y;
|
|
||||||
gridster.add_widget(
|
|
||||||
'<li id="'+item_id+'">'+
|
|
||||||
'\<script\>var timeout'+item_id+' = grab_data('+item_id+',60,\''+content+'\');\<\/script\>'+
|
|
||||||
'<header class="tile_header">'+title+'<button type="button" class="close" data-tile-id="'+item_id+'" aria-label="Close"><span aria-hidden="true">×</span></button></header>'+
|
|
||||||
'<div class="tile_body" id="tile_body_'+item_id+'">'+content+'</div>'+
|
|
||||||
'</li>',
|
|
||||||
size_x, size_y);
|
|
||||||
$('#new-tile').popover('hide')
|
|
||||||
updatePos(gridster);
|
|
||||||
} else {
|
|
||||||
$("#message").html('<div class="alert alert-info">' + data.message + '</div>');
|
|
||||||
}
|
|
||||||
},
|
|
||||||
error: function () {
|
|
||||||
$("#message").html('<div class="alert alert-info">An error occurred.</div>');
|
|
||||||
}
|
|
||||||
});
|
|
||||||
});
|
|
||||||
|
|
||||||
});
|
|
||||||
|
|
||||||
function grab_data(id,refresh,data_type) {
|
|
||||||
new_refresh = refresh * 1000;
|
|
||||||
$.ajax({
|
|
||||||
type: 'POST',
|
|
||||||
url: '/ajax_dash.php',
|
|
||||||
data: {type: data_type},
|
|
||||||
dataType: "json",
|
|
||||||
success: function (data) {
|
|
||||||
if (data.status == 'ok') {
|
|
||||||
$("#tile_body_"+id).html(data.html);
|
|
||||||
} else {
|
|
||||||
$("#tile_body_"+id).html('<div class="alert alert-info">' + data.message + '</div>');
|
|
||||||
}
|
|
||||||
},
|
|
||||||
error: function () {
|
|
||||||
$("#tile_body_"+id).html('<div class="alert alert-info">Problem with backend</div>');
|
|
||||||
}
|
|
||||||
});
|
|
||||||
setTimeout(function() {
|
|
||||||
grab_data(id,refresh,data_type);
|
|
||||||
}, new_refresh);
|
|
||||||
}
|
}
|
||||||
|
|
||||||
</script>
|
$(function(){
|
||||||
|
gridster = $(".gridster ul").gridster({
|
||||||
|
widget_base_dimensions: [100, 100],
|
||||||
|
widget_margins: [5, 5],
|
||||||
|
autogrow_cols: true,
|
||||||
|
min_cols: 1,
|
||||||
|
min_rows: 2,
|
||||||
|
avoid_overlapped_widgets: true,
|
||||||
|
draggable: {
|
||||||
|
handle: 'header',
|
||||||
|
stop: function(e, ui, $widget) {
|
||||||
|
updatePos(gridster);
|
||||||
|
},
|
||||||
|
},
|
||||||
|
resize: {
|
||||||
|
enabled: true,
|
||||||
|
stop: function(e, ui, $widget) {
|
||||||
|
updatePos(gridster);
|
||||||
|
}
|
||||||
|
},
|
||||||
|
serialize_params: function($w, wgd) {
|
||||||
|
return {
|
||||||
|
id: $($w).attr('id'),
|
||||||
|
col: wgd.col,
|
||||||
|
row: wgd.row,
|
||||||
|
size_x: wgd.size_x,
|
||||||
|
size_y: wgd.size_y
|
||||||
|
};
|
||||||
|
}
|
||||||
|
}).data('gridster');
|
||||||
|
|
||||||
|
gridster.remove_all_widgets();
|
||||||
|
$.each(serialization, function() {
|
||||||
|
gridster.add_widget(
|
||||||
|
'<li id="'+this.dashboard_item_id+'">'+
|
||||||
|
'\<script\>var timeout'+this.dashboard_item_id+' = grab_data('+this.dashboard_item_id+','+this.refresh+',\''+this.content+'\');\<\/script\>'+
|
||||||
|
'<header class="tile_header">'+this.title+'<button style="color: #ffffff" type="button" class="close close-tile" data-tile-id="'+this.dashboard_item_id+'" aria-label="Close"><span aria-hidden="true">×</span></button></header>'+
|
||||||
|
'<div class="tile_body" id="tile_body_'+this.dashboard_item_id+'">'+this.content+'</div>'+
|
||||||
|
'</li>',
|
||||||
|
this.size_x, this.size_y, this.col, this.row
|
||||||
|
);
|
||||||
|
});
|
||||||
|
|
||||||
|
$(document).on( "click", ".close-tile", function() {
|
||||||
|
var tile_id = $(this).data('tile-id');
|
||||||
|
$.ajax({
|
||||||
|
type: 'POST',
|
||||||
|
url: '/ajax_form.php',
|
||||||
|
data: {type: "update-dashboard-config", sub_type: 'remove', tile_id: tile_id},
|
||||||
|
dataType: "json",
|
||||||
|
success: function (data) {
|
||||||
|
if (data.status == 'ok') {
|
||||||
|
gridster.remove_widget($('#'+tile_id));
|
||||||
|
updatePos(gridster);
|
||||||
|
}
|
||||||
|
else {
|
||||||
|
$("#message").html('<div class="alert alert-info">' + data.message + '</div>');
|
||||||
|
}
|
||||||
|
},
|
||||||
|
error: function () {
|
||||||
|
$("#message").html('<div class="alert alert-info">An error occurred.</div>');
|
||||||
|
}
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
|
$(document).on('change','#tile_id',function(){
|
||||||
|
var tile_id = $(this).val();
|
||||||
|
$.ajax({
|
||||||
|
type: 'POST',
|
||||||
|
url: '/ajax_form.php',
|
||||||
|
data: {type: "update-dashboard-config", sub_type: 'add', tile_id: tile_id},
|
||||||
|
dataType: "json",
|
||||||
|
success: function (data) {
|
||||||
|
if (data.status == 'ok') {
|
||||||
|
var item_id = data.extra.item_id;
|
||||||
|
var title = data.extra.title;
|
||||||
|
var content = data.extra.content;
|
||||||
|
var size_x = data.extra.size_x;
|
||||||
|
var size_y = data.extra.size_y;
|
||||||
|
gridster.add_widget(
|
||||||
|
'<li id="'+item_id+'">'+
|
||||||
|
'\<script\>var timeout'+item_id+' = grab_data('+item_id+',60,\''+content+'\');\<\/script\>'+
|
||||||
|
'<header class="tile_header">'+title+'<button type="button" class="close" data-tile-id="'+item_id+'" aria-label="Close"><span aria-hidden="true">×</span></button></header>'+
|
||||||
|
'<div class="tile_body" id="tile_body_'+item_id+'">'+content+'</div>'+
|
||||||
|
'</li>',
|
||||||
|
size_x, size_y
|
||||||
|
);
|
||||||
|
$('#new-tile').popover('hide')
|
||||||
|
updatePos(gridster);
|
||||||
|
}
|
||||||
|
else {
|
||||||
|
$("#message").html('<div class="alert alert-info">' + data.message + '</div>');
|
||||||
|
}
|
||||||
|
},
|
||||||
|
error: function () {
|
||||||
|
$("#message").html('<div class="alert alert-info">An error occurred.</div>');
|
||||||
|
}
|
||||||
|
});
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
|
function grab_data(id,refresh,data_type) {
|
||||||
|
new_refresh = refresh * 1000;
|
||||||
|
$.ajax({
|
||||||
|
type: 'POST',
|
||||||
|
url: '/ajax_dash.php',
|
||||||
|
data: {type: data_type},
|
||||||
|
dataType: "json",
|
||||||
|
success: function (data) {
|
||||||
|
if (data.status == 'ok') {
|
||||||
|
$("#tile_body_"+id).html(data.html);
|
||||||
|
}
|
||||||
|
else {
|
||||||
|
$("#tile_body_"+id).html('<div class="alert alert-info">' + data.message + '</div>');
|
||||||
|
}
|
||||||
|
},
|
||||||
|
error: function () {
|
||||||
|
$("#tile_body_"+id).html('<div class="alert alert-info">Problem with backend</div>');
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
setTimeout(function() {
|
||||||
|
grab_data(id,refresh,data_type);
|
||||||
|
},
|
||||||
|
new_refresh);
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|||||||
3
sql-schema/058.sql
Normal file
3
sql-schema/058.sql
Normal file
@ -0,0 +1,3 @@
|
|||||||
|
CREATE TABLE `dashboard_items` ( `dashboard_item_id` int(11) NOT NULL AUTO_INCREMENT, `user_id` int(11) NOT NULL, `widget_id` int(11) NOT NULL, `col` tinyint(4) NOT NULL, `row` tinyint(4) NOT NULL, `size_x` tinyint(4) NOT NULL, `size_y` tinyint(4) NOT NULL, `title` varchar(255) NOT NULL, `content` text NOT NULL, `refresh` tinyint(4) NOT NULL DEFAULT '60', PRIMARY KEY (`dashboard_item_id`), KEY `user_id` (`user_id`,`widget_id`) ) ENGINE=InnoDB AUTO_INCREMENT=46 DEFAULT CHARSET=latin1;
|
||||||
|
CREATE TABLE `tiles` ( `tile_id` int(11) NOT NULL AUTO_INCREMENT, `tile_title` varchar(255) NOT NULL, `tile` varchar(255) NOT NULL, `base_dimensions` varchar(10) NOT NULL, PRIMARY KEY (`tile_id`), UNIQUE KEY `tile` (`tile`)) ENGINE=InnoDB AUTO_INCREMENT=4 DEFAULT CHARSET=latin1;
|
||||||
|
INSERT INTO `tiles` (`tile_id`, `tile_title`, `tile`, `base_dimensions`) VALUES (1, 'Availability map', 'availability-map', '4,3'), (2, 'Device summary horizontal', 'device-summary-horiz', '4,2'), (3, 'Alerts', 'alerts', '6,4'), (4, 'Device summary vertical', 'device-summary-vert', '4,3'), (5, 'World map', 'globe', '3,3');
|
||||||
Reference in New Issue
Block a user