new network map (neighbors) implementation
also link to manual topology from device ports fix tooltip reinit on datatables paging Squashed commit of the following: commit85d52ed174Merge:66e3536607446ed7Author: Oliver Gorwits <oliver@cpan.org> Date: Sun Dec 31 08:59:19 2017 +0000 Merge branch 'master' into og-newnetmap commit66e353669dAuthor: Oliver Gorwits <oliver@cpan.org> Date: Sun Dec 31 00:16:49 2017 +0000 add docs link commit809f1ede76Author: Oliver Gorwits <oliver@cpan.org> Date: Sun Dec 31 00:11:29 2017 +0000 node links to other devices commit187e1ea803Author: Oliver Gorwits <oliver@cpan.org> Date: Sat Dec 30 23:58:56 2017 +0000 add node infostring commit6453f99b28Author: Oliver Gorwits <oliver@cpan.org> Date: Sat Dec 30 23:41:19 2017 +0000 link infostrings! commitf3ba260142Author: Oliver Gorwits <oliver@cpan.org> Date: Sat Dec 30 22:42:09 2017 +0000 maxnoderadius is now based on dynamic size calc commit0af415e391Author: Oliver Gorwits <oliver@cpan.org> Date: Sat Dec 30 22:33:22 2017 +0000 fix to get aggregate ports in matching order on left and right side commit3f36121a4cAuthor: Oliver Gorwits <oliver@cpan.org> Date: Sat Dec 30 22:07:28 2017 +0000 initial aggregate link summing commite5b96b0781Author: Oliver Gorwits <oliver@cpan.org> Date: Sat Dec 30 14:55:00 2017 +0000 tidy and refactor commit79f22a47b3Author: Oliver Gorwits <oliver@cpan.org> Date: Sat Dec 30 13:42:58 2017 +0000 get rid of d3 v3/v4 and only have v3 commit18c3f16c8fAuthor: Oliver Gorwits <oliver@cpan.org> Date: Sat Dec 30 12:54:45 2017 +0000 fullscreen exit now works commit93f8181fc8Author: Oliver Gorwits <oliver@cpan.org> Date: Sat Dec 30 08:58:04 2017 +0000 implement show link speeds on links commit72961f172dAuthor: Oliver Gorwits <oliver@cpan.org> Date: Thu Dec 28 23:51:26 2017 +0000 add speed to retrieved devicelinks commitae5496310eAuthor: Oliver Gorwits <oliver@cpan.org> Date: Tue Dec 26 11:21:12 2017 +0000 remove annealing on label change commit885cb92bd3Author: Oliver Gorwits <oliver@cpan.org> Date: Tue Dec 26 11:15:21 2017 +0000 reorder options commit015a1debe0Author: Oliver Gorwits <oliver@cpan.org> Date: Tue Dec 26 11:11:01 2017 +0000 fix d3-force debug link messing up svg text elements commit10ccaa78b1Author: Oliver Gorwits <oliver@cpan.org> Date: Tue Dec 26 10:52:47 2017 +0000 show ips functionality; improvement to maximise icon; bugfix d3-force label wrap commit71a1a20909Author: Oliver Gorwits <oliver@cpan.org> Date: Mon Dec 25 13:21:23 2017 +0000 move labels on neighbor view commit9578215349Author: Oliver Gorwits <oliver@cpan.org> Date: Mon Dec 25 13:13:13 2017 +0000 force running spinner commit6618fba548Author: Oliver Gorwits <oliver@cpan.org> Date: Sun Dec 24 23:13:33 2017 +0000 fix neighbors pinning commit938848551eAuthor: Oliver Gorwits <oliver@cpan.org> Date: Sun Dec 24 18:12:04 2017 +0000 implement dynamic sizing option commite4b19be5d7Author: Oliver Gorwits <oliver@cpan.org> Date: Sun Dec 24 13:25:00 2017 +0000 zoom to device on neighbor show; do not save positions on neighbor show commit58b576b464Author: Oliver Gorwits <oliver@cpan.org> Date: Sun Dec 24 13:10:48 2017 +0000 better neighbors/save interaction commit2c77660f2fAuthor: Oliver Gorwits <oliver@cpan.org> Date: Sun Dec 24 13:03:46 2017 +0000 fix labels on checkboxes to be clickable commit2c2dc62cdaAuthor: Oliver Gorwits <oliver@cpan.org> Date: Sun Dec 24 12:50:26 2017 +0000 prevent save positions when in neighbor view mode commit78c558b5beAuthor: Oliver Gorwits <oliver@cpan.org> Date: Sun Dec 24 12:37:51 2017 +0000 add tooltip to show why host groups radio is disabled commit7000d4b0ebAuthor: Oliver Gorwits <oliver@cpan.org> Date: Sun Dec 24 12:12:29 2017 +0000 allow port control role to edit manual topology commit547d2934cbAuthor: Oliver Gorwits <oliver@cpan.org> Date: Sun Dec 24 12:09:40 2017 +0000 working save/restore node positions with groups commitbf7e231ffeAuthor: Oliver Gorwits <oliver@cpan.org> Date: Sun Dec 24 10:09:26 2017 +0000 node colors! commite23594b041Author: Oliver Gorwits <oliver@cpan.org> Date: Sat Dec 23 23:42:17 2017 +0000 wooo device group selection is working commitb1b22c9811Author: Oliver Gorwits <oliver@cpan.org> Date: Sat Dec 23 22:31:23 2017 +0000 send full query str from netmap for json commit9a13bb7f9bAuthor: Oliver Gorwits <oliver@cpan.org> Date: Sat Dec 23 22:06:24 2017 +0000 implement host_group_displaynames and fix vlan save bug commit35ed34ed2fAuthor: Oliver Gorwits <oliver@cpan.org> Date: Sat Dec 23 17:52:14 2017 +0000 when neighbors only can restrict the links search commitf9e5ec02abAuthor: Oliver Gorwits <oliver@cpan.org> Date: Sat Dec 23 17:44:41 2017 +0000 tweak mapshow commit9f9971ff4eAuthor: Oliver Gorwits <oliver@cpan.org> Date: Sat Dec 23 00:47:17 2017 +0000 better sidebar look and layout commit1def41da67Author: Oliver Gorwits <oliver@cpan.org> Date: Thu Dec 21 23:54:44 2017 +0000 sidebar with many options!! commit4203cbb225Merge:7c12df6b7db65932Author: Oliver Gorwits <oliver@cpan.org> Date: Thu Dec 21 20:14:55 2017 +0000 Merge branch 'master' into og-newnetmap commit7c12df6b83Author: Oliver Gorwits <oliver@cpan.org> Date: Thu Dec 21 00:13:03 2017 +0000 refresh tooltips when the datatables table is updated commit081b89d5dcAuthor: Oliver Gorwits <oliver@cpan.org> Date: Wed Dec 20 23:59:15 2017 +0000 shortcut from device port to manual topology commit9520438960Author: Oliver Gorwits <oliver@cpan.org> Date: Wed Dec 20 23:34:44 2017 +0000 tighten the sql for neighbor links commitd6b0275931Author: Oliver Gorwits <oliver@cpan.org> Date: Wed Dec 20 23:26:22 2017 +0000 tweak layout again commit9e5e2f0ed5Author: Oliver Gorwits <oliver@cpan.org> Date: Wed Dec 20 23:18:57 2017 +0000 fullscreen mode for netmap commitaba359d2a9Author: Oliver Gorwits <oliver@cpan.org> Date: Wed Dec 20 22:05:51 2017 +0000 save and load netmap positions for same device groups commitb7cd0251ffAuthor: Oliver Gorwits <oliver@cpan.org> Date: Tue Dec 19 23:24:47 2017 +0000 basic positions upload commit786115ebdaAuthor: Oliver Gorwits <oliver@cpan.org> Date: Tue Dec 19 22:13:16 2017 +0000 working group drag commit91f98d4f33Author: Oliver Gorwits <oliver@cpan.org> Date: Mon Dec 18 23:00:16 2017 +0000 drag all selected nodes commitba48eee5f7Merge:60412cd67f8e3edfAuthor: Oliver Gorwits <oliver@cpan.org> Date: Mon Dec 18 20:14:20 2017 +0000 Merge branch 'master' into og-newnetmap commit60412cd6e6Merge:39ca14917dc79f72Author: Oliver Gorwits <oliver@cpan.org> Date: Sun Dec 17 20:23:41 2017 +0000 Merge branch 'master' into og-newnetmap commit39ca1491b0Merge:69622582c8806beaAuthor: Oliver Gorwits <oliver@cpan.org> Date: Sun Dec 17 19:52:49 2017 +0000 Merge branch 'master' into og-newnetmap commit6962258223Author: Oliver Gorwits <oliver@cpan.org> Date: Sun Dec 17 19:52:26 2017 +0000 bleed versions commit444e82b8a3Author: Oliver Gorwits <oliver@cpan.org> Date: Sat Dec 16 15:33:41 2017 +0000 use d3 v4 only commit01cd7a908dAuthor: Oliver Gorwits <oliver@cpan.org> Date: Sat Dec 16 15:22:08 2017 +0000 two d3 connected commit854f37fc94Author: Oliver Gorwits <oliver@cpan.org> Date: Thu Dec 14 21:34:49 2017 +0000 more fiddling with d3 commit61a3a9e06dAuthor: Oliver Gorwits <oliver@cpan.org> Date: Thu Dec 14 19:15:21 2017 +0000 working worker commitebadebe69aAuthor: Oliver Gorwits <oliver@cpan.org> Date: Thu Dec 14 07:57:55 2017 +0000 borken worker commitc327b28513Author: Oliver Gorwits <oliver@cpan.org> Date: Wed Dec 13 13:45:03 2017 +0000 fix node center commit33bd9d39daAuthor: Oliver Gorwits <oliver@cpan.org> Date: Wed Dec 13 01:14:50 2017 +0000 improvements to graphing commit6178bf2298Merge:1c627eaf925940c9Author: Oliver Gorwits <oliver@cpan.org> Date: Tue Dec 12 23:44:48 2017 +0000 Merge branch 'master' into og-newnetmap commit1c627eaf3cMerge:77ca8f96000cbaa1Author: Oliver Gorwits <oliver@cpan.org> Date: Tue Dec 12 23:38:00 2017 +0000 Merge branch 'master' into og-newnetmap commit77ca8f96e1Author: Oliver Gorwits <oliver@cpan.org> Date: Mon Dec 11 00:09:08 2017 +0000 working rendering using d3-force plugin commit187265fc03Author: Oliver Gorwits <oliver@cpan.org> Date: Sun Dec 10 23:19:23 2017 +0000 initial work on moving to d3-force-apex-plugin - json data
This commit is contained in:
Oliver Gorwits
@@ -11,7 +11,7 @@ __PACKAGE__->load_namespaces(
|
||||
);
|
||||
|
||||
our # try to hide from kwalitee
|
||||
$VERSION = 45; # schema version used for upgrades, keep as integer
|
||||
$VERSION = 46; # schema version used for upgrades, keep as integer
|
||||
|
||||
use Path::Class;
|
||||
use File::ShareDir 'dist_dir';
|
||||
|
||||
@@ -191,6 +191,15 @@ Returns the row from the community string table, if one exists.
|
||||
__PACKAGE__->might_have(
|
||||
community => 'App::Netdisco::DB::Result::Community', 'ip');
|
||||
|
||||
=head2 throughput
|
||||
|
||||
Returns a sum of speeds on all ports on the device.
|
||||
|
||||
=cut
|
||||
|
||||
__PACKAGE__->has_one(
|
||||
throughput => 'App::Netdisco::DB::Result::Virtual::DevicePortSpeed', 'ip');
|
||||
|
||||
=head1 ADDITIONAL METHODS
|
||||
|
||||
=head2 is_pseudo
|
||||
|
||||
25
lib/App/Netdisco/DB/Result/NetmapPositions.pm
Normal file
25
lib/App/Netdisco/DB/Result/NetmapPositions.pm
Normal file
@@ -0,0 +1,25 @@
|
||||
use utf8;
|
||||
package App::Netdisco::DB::Result::NetmapPositions;
|
||||
|
||||
use strict;
|
||||
use warnings;
|
||||
|
||||
use base 'DBIx::Class::Core';
|
||||
__PACKAGE__->table("netmap_positions");
|
||||
__PACKAGE__->add_columns(
|
||||
"id",
|
||||
{ data_type => "integer", is_nullable => 0, is_auto_increment => 1 },
|
||||
"device_groups",
|
||||
{ data_type => "text[]", is_nullable => 0 },
|
||||
"vlan",
|
||||
{ data_type => "integer", is_nullable => 0, default => 0 },
|
||||
"positions",
|
||||
{ data_type => "text", is_nullable => 0 },
|
||||
);
|
||||
|
||||
__PACKAGE__->set_primary_key("id");
|
||||
|
||||
__PACKAGE__->add_unique_constraint(
|
||||
"netmap_positions_device_groups_vlan_key" => [qw/device_groups vlan/]);
|
||||
|
||||
1;
|
||||
@@ -7,17 +7,36 @@ use base 'DBIx::Class::Core';
|
||||
|
||||
__PACKAGE__->table_class('DBIx::Class::ResultSource::View');
|
||||
|
||||
# note to future devs:
|
||||
# this query does not use the slave_of field in device_port table to group
|
||||
# ports because what we actually want is total b/w between devices on all
|
||||
# links, regardless of whether those links are in an aggregate.
|
||||
|
||||
__PACKAGE__->table('device_links');
|
||||
__PACKAGE__->result_source_instance->is_virtual(1);
|
||||
__PACKAGE__->result_source_instance->view_definition(<<ENDSQL
|
||||
SELECT dp.ip AS left_ip, dp.port AS left_port, di.ip AS right_ip, dp.remote_port AS right_port
|
||||
FROM ( SELECT device_port.ip, device_port.port, device_port.remote_ip, device_port.remote_port
|
||||
FROM device_port
|
||||
WHERE device_port.remote_port IS NOT NULL
|
||||
GROUP BY device_port.ip, device_port.port, device_port.remote_ip, device_port.remote_port
|
||||
ORDER BY device_port.ip) dp
|
||||
LEFT JOIN device_ip di ON dp.remote_ip = di.alias
|
||||
WHERE di.ip IS NOT NULL
|
||||
SELECT dp.ip AS left_ip, ld.dns AS left_dns, ld.name AS left_name,
|
||||
array_agg(dp.port) AS left_port, array_agg(dp.name) AS left_descr,
|
||||
sum(btrim(dp.speed, ' MGTbps')::float
|
||||
* (CASE btrim(dp.speed, ' 0123456789.')
|
||||
WHEN 'Gbps' THEN 1000
|
||||
WHEN 'Tbps' THEN 1000000
|
||||
ELSE 1 END)) AS aggspeed,
|
||||
count(*) AS aggports,
|
||||
dp2.ip AS right_ip, rd.dns AS right_dns, rd.name AS right_name,
|
||||
array_agg(dp2.port) AS right_port, array_agg(dp2.name) AS right_descr
|
||||
|
||||
FROM device_port dp
|
||||
INNER JOIN device ld ON dp.ip = ld.ip
|
||||
INNER JOIN device_ip di ON dp.remote_ip = di.alias
|
||||
INNER JOIN device rd ON di.ip = rd.ip
|
||||
INNER JOIN device_port dp2 ON (di.ip = dp2.ip AND dp.remote_port = dp2.port)
|
||||
|
||||
WHERE dp.remote_port IS NOT NULL
|
||||
AND dp.type = 'ethernetCsmacd'
|
||||
AND dp.speed LIKE '%bps'
|
||||
AND dp.ip <= dp2.ip
|
||||
GROUP BY left_ip, left_dns, left_name, right_ip, right_dns, right_name
|
||||
ORDER BY dp.ip
|
||||
ENDSQL
|
||||
);
|
||||
@@ -26,23 +45,59 @@ __PACKAGE__->add_columns(
|
||||
'left_ip' => {
|
||||
data_type => 'inet',
|
||||
},
|
||||
'left_port' => {
|
||||
'left_dns' => {
|
||||
data_type => 'text',
|
||||
},
|
||||
'left_name' => {
|
||||
data_type => 'text',
|
||||
},
|
||||
'left_port' => {
|
||||
data_type => '[text]',
|
||||
},
|
||||
'left_descr' => {
|
||||
data_type => '[text]',
|
||||
},
|
||||
'aggspeed' => {
|
||||
data_type => 'integer',
|
||||
},
|
||||
'aggports' => {
|
||||
data_type => 'integer',
|
||||
},
|
||||
'right_ip' => {
|
||||
data_type => 'inet',
|
||||
},
|
||||
'right_port' => {
|
||||
'right_dns' => {
|
||||
data_type => 'text',
|
||||
},
|
||||
'right_name' => {
|
||||
data_type => 'text',
|
||||
},
|
||||
'right_port' => {
|
||||
data_type => '[text]',
|
||||
},
|
||||
'right_descr' => {
|
||||
data_type => '[text]',
|
||||
},
|
||||
);
|
||||
|
||||
__PACKAGE__->has_many('left_vlans', 'App::Netdisco::DB::Result::DevicePortVlan',
|
||||
{ 'foreign.ip' => 'self.left_ip', 'foreign.port' => 'self.left_port' },
|
||||
{ join_type => 'INNER' } );
|
||||
sub {
|
||||
my $args = shift;
|
||||
return {
|
||||
"$args->{foreign_alias}.ip" => { -ident => "$args->{self_alias}.left_ip" },
|
||||
"$args->{self_alias}.left_port" => { '@>' => \"ARRAY[$args->{foreign_alias}.port]" },
|
||||
};
|
||||
}
|
||||
);
|
||||
|
||||
__PACKAGE__->has_many('right_vlans', 'App::Netdisco::DB::Result::DevicePortVlan',
|
||||
{ 'foreign.ip' => 'self.right_ip', 'foreign.port' => 'self.right_port' },
|
||||
{ join_type => 'INNER' } );
|
||||
sub {
|
||||
my $args = shift;
|
||||
return {
|
||||
"$args->{foreign_alias}.ip" => { -ident => "$args->{self_alias}.right_ip" },
|
||||
"$args->{self_alias}.right_port" => { '@>' => \"ARRAY[$args->{foreign_alias}.port]" },
|
||||
};
|
||||
}
|
||||
);
|
||||
|
||||
1;
|
||||
|
||||
36
lib/App/Netdisco/DB/Result/Virtual/DevicePortSpeed.pm
Normal file
36
lib/App/Netdisco/DB/Result/Virtual/DevicePortSpeed.pm
Normal file
@@ -0,0 +1,36 @@
|
||||
package App::Netdisco::DB::Result::Virtual::DevicePortSpeed;
|
||||
|
||||
use strict;
|
||||
use warnings;
|
||||
|
||||
use base 'DBIx::Class::Core';
|
||||
|
||||
__PACKAGE__->table_class('DBIx::Class::ResultSource::View');
|
||||
|
||||
__PACKAGE__->table('device_port_speed');
|
||||
__PACKAGE__->result_source_instance->is_virtual(1);
|
||||
__PACKAGE__->result_source_instance->view_definition(<<ENDSQL
|
||||
SELECT ip,
|
||||
sum(btrim(speed, ' MGTbps')::float *
|
||||
(CASE btrim(speed, ' 0123456789.')
|
||||
WHEN 'Gbps' THEN 1000
|
||||
WHEN 'Tbps' THEN 1000000
|
||||
ELSE 1 END)) AS total
|
||||
FROM device_port
|
||||
WHERE type = 'ethernetCsmacd'
|
||||
AND speed LIKE '%bps'
|
||||
GROUP BY ip
|
||||
ORDER BY total DESC
|
||||
ENDSQL
|
||||
);
|
||||
|
||||
__PACKAGE__->add_columns(
|
||||
'total' => {
|
||||
data_type => 'integer',
|
||||
},
|
||||
);
|
||||
|
||||
__PACKAGE__->belongs_to('device', 'App::Netdisco::DB::Result::Device',
|
||||
{ 'foreign.ip' => 'self.ip' });
|
||||
|
||||
1;
|
||||
@@ -47,8 +47,7 @@ sub update_stats {
|
||||
device_ip_count =>
|
||||
$schema->resultset('DeviceIp')->count_rs->as_query,
|
||||
device_link_count =>
|
||||
$schema->resultset('Virtual::DeviceLinks')
|
||||
->count_rs({'me.left_ip' => {'>', \'me.right_ip'}})->as_query,
|
||||
$schema->resultset('Virtual::DeviceLinks')->count_rs->as_query,
|
||||
device_port_count =>
|
||||
$schema->resultset('DevicePort')->count_rs->as_query,
|
||||
device_port_up_count =>
|
||||
|
||||
@@ -6,6 +6,7 @@ use Dancer::Plugin::Ajax;
|
||||
use Dancer::Plugin::DBIC;
|
||||
use Dancer::Plugin::Auth::Extensible;
|
||||
|
||||
use URI ();
|
||||
use Socket6 (); # to ensure dependency is met
|
||||
use HTML::Entities (); # to ensure dependency is met
|
||||
use URI::QueryParam (); # part of URI, to add helper methods
|
||||
@@ -129,6 +130,12 @@ hook 'before_template' => sub {
|
||||
# allow portable dynamic content
|
||||
$tokens->{uri_for} = sub { uri_for(@_)->path_query };
|
||||
|
||||
# current query string to all resubmit from within ajax template
|
||||
my $queryuri = URI->new();
|
||||
$queryuri->query_param($_ => param($_))
|
||||
for grep {$_ ne 'return_url'} keys %{params()};
|
||||
$tokens->{my_query} = $queryuri->query();
|
||||
|
||||
# access to logged in user's roles
|
||||
$tokens->{user_has_role} = sub { user_has_role(@_) };
|
||||
|
||||
|
||||
@@ -16,6 +16,7 @@ set('connected_properties' => [
|
||||
]);
|
||||
|
||||
hook 'before_template' => sub {
|
||||
my $tokens = shift;
|
||||
my $defaults = var('sidebar_defaults')->{'device_ports'}
|
||||
or return;
|
||||
|
||||
@@ -34,6 +35,13 @@ hook 'before_template' => sub {
|
||||
}
|
||||
}
|
||||
|
||||
# used in the device search sidebar template to set selected items
|
||||
foreach my $opt (qw/devgrp/) {
|
||||
my $p = (ref [] eq ref param($opt) ? param($opt)
|
||||
: (param($opt) ? [param($opt)] : []));
|
||||
$tokens->{"${opt}_lkp"} = { map { $_ => 1 } @$p };
|
||||
}
|
||||
|
||||
return if param('reset')
|
||||
or not var('sidebar_key') or (var('sidebar_key') ne 'device_ports');
|
||||
|
||||
@@ -69,6 +77,7 @@ get '/device' => require_login sub {
|
||||
params->{'tab'} ||= 'details';
|
||||
template 'device', {
|
||||
display_name => ($others ? $first->ip : ($first->dns || $first->ip)),
|
||||
devgrp_list => setting('host_group_displaynames'),
|
||||
device => params->{'tab'},
|
||||
};
|
||||
};
|
||||
|
||||
@@ -29,7 +29,7 @@ sub _sanity_ok {
|
||||
return 1;
|
||||
}
|
||||
|
||||
ajax '/ajax/control/admin/topology/add' => require_role admin => sub {
|
||||
ajax '/ajax/control/admin/topology/add' => require_role port_control => sub {
|
||||
send_error('Bad Request', 400) unless _sanity_ok();
|
||||
|
||||
my $device = schema('netdisco')->resultset('Topology')
|
||||
@@ -78,7 +78,7 @@ ajax '/ajax/control/admin/topology/add' => require_role admin => sub {
|
||||
};
|
||||
};
|
||||
|
||||
ajax '/ajax/control/admin/topology/del' => require_role admin => sub {
|
||||
ajax '/ajax/control/admin/topology/del' => require_role port_control => sub {
|
||||
send_error('Bad Request', 400) unless _sanity_ok();
|
||||
|
||||
schema('netdisco')->txn_do(sub {
|
||||
@@ -129,7 +129,7 @@ ajax '/ajax/control/admin/topology/del' => require_role admin => sub {
|
||||
};
|
||||
};
|
||||
|
||||
ajax '/ajax/content/admin/topology' => require_role admin => sub {
|
||||
ajax '/ajax/content/admin/topology' => require_role port_control => sub {
|
||||
my $set = schema('netdisco')->resultset('Topology')
|
||||
->search({},{order_by => [qw/dev1 dev2 port1/]});
|
||||
|
||||
|
||||
@@ -5,6 +5,10 @@ use Dancer::Plugin::Ajax;
|
||||
use Dancer::Plugin::DBIC;
|
||||
use Dancer::Plugin::Auth::Extensible;
|
||||
|
||||
use SNMP::Info ();
|
||||
use List::Util 'first';
|
||||
use List::MoreUtils ();
|
||||
use App::Netdisco::Util::Permission 'check_acl_only';
|
||||
use App::Netdisco::Web::Plugin;
|
||||
|
||||
register_device_tab({ tag => 'netmap', label => 'Neighbors' });
|
||||
@@ -14,108 +18,211 @@ ajax '/ajax/content/device/netmap' => require_login sub {
|
||||
template 'ajax/device/netmap.tt', {}, { layout => undef };
|
||||
};
|
||||
|
||||
sub _get_name {
|
||||
my $ip = shift;
|
||||
my $domain = quotemeta( setting('domain_suffix') || '' );
|
||||
|
||||
(my $dns = (var('devices')->{$ip} || '')) =~ s/$domain$//;
|
||||
return ($dns || $ip);
|
||||
}
|
||||
|
||||
sub _add_children {
|
||||
my ($ptr, $childs, $step, $limit) = @_;
|
||||
|
||||
return $step if $limit and $step > $limit;
|
||||
my @legit = ();
|
||||
my $max = $step;
|
||||
|
||||
foreach my $c (@$childs) {
|
||||
next if exists var('seen')->{$c};
|
||||
var('seen')->{$c}++;
|
||||
push @legit, $c;
|
||||
push @{$ptr}, {
|
||||
ip => $c,
|
||||
name => _get_name($c),
|
||||
};
|
||||
}
|
||||
|
||||
for (my $i = 0; $i < @legit; $i++) {
|
||||
$ptr->[$i]->{children} = [];
|
||||
my $nm = _add_children($ptr->[$i]->{children}, var('links')->{$legit[$i]},
|
||||
($step + 1), $limit);
|
||||
$max = $nm if $nm > $max;
|
||||
}
|
||||
|
||||
return $max;
|
||||
}
|
||||
|
||||
# d3 seems not to use proper ajax semantics, so get instead of ajax
|
||||
get '/ajax/data/device/netmap' => require_login sub {
|
||||
my $q = param('q');
|
||||
ajax '/ajax/data/device/netmappositions' => require_login sub {
|
||||
my $p = param('positions') or send_error('Missing positions', 400);
|
||||
my $positions = from_json($p) or send_error('Bad positions', 400);
|
||||
send_error('Bad positions', 400) unless ref [] eq ref $positions;
|
||||
|
||||
my $vlan = param('vlan');
|
||||
undef $vlan if (defined $vlan and $vlan !~ m/^\d+$/);
|
||||
|
||||
my $depth = (param('depth') || 8);
|
||||
undef $depth if (defined $depth and $depth !~ m/^\d+$/);
|
||||
my $mapshow = param('mapshow');
|
||||
return if !defined $mapshow or $mapshow !~ m/^(?:all|only)$/;
|
||||
|
||||
my $device = schema('netdisco')->resultset('Device')
|
||||
->search_for_device($q) or send_error('Bad device', 400);
|
||||
my $start = $device->ip;
|
||||
# list of groups selected by user and passed in param
|
||||
my $devgrp = (ref [] eq ref param('devgrp') ? param('devgrp') : [param('devgrp')]);
|
||||
# list of groups validated as real host groups and named host groups
|
||||
my @hgrplist = List::MoreUtils::uniq
|
||||
grep { exists setting('host_group_displaynames')->{$_} }
|
||||
grep { exists setting('host_groups')->{$_} }
|
||||
grep { defined } @{ $devgrp };
|
||||
return if $mapshow eq 'only' and 0 == scalar @hgrplist;
|
||||
push(@hgrplist, '__ANY__') if 0 == scalar @hgrplist;
|
||||
|
||||
my @devices = schema('netdisco')->resultset('Device')->search({}, {
|
||||
result_class => 'DBIx::Class::ResultClass::HashRefInflator',
|
||||
columns => ['ip', 'dns', 'name'],
|
||||
})->all;
|
||||
var(devices => { map { $_->{ip} => lc($_->{dns} || $_->{name} || '') }
|
||||
@devices });
|
||||
my %clean = ();
|
||||
POSITION: foreach my $pos (@$positions) {
|
||||
next unless ref {} eq ref $pos;
|
||||
foreach my $k (qw/ID x y/) {
|
||||
next POSITION unless exists $pos->{$k};
|
||||
next POSITION unless $pos->{$k} =~ m/^[[:word:]\.-]+$/;
|
||||
}
|
||||
$clean{$pos->{ID}} = { x => $pos->{x}, y => $pos->{y} };
|
||||
}
|
||||
return unless scalar keys %clean;
|
||||
|
||||
var(links => {});
|
||||
my $rs = schema('netdisco')->resultset('Virtual::DeviceLinks')->search({}, {
|
||||
columns => [qw/left_ip right_ip/],
|
||||
result_class => 'DBIx::Class::ResultClass::HashRefInflator',
|
||||
my $posrow = schema('netdisco')->resultset('NetmapPositions')->find({
|
||||
device_groups => \[ '= ?', [device_groups => [sort @hgrplist]] ],
|
||||
vlan => ($vlan || 0)});
|
||||
if ($posrow) {
|
||||
$posrow->update({ positions => to_json(\%clean) });
|
||||
}
|
||||
else {
|
||||
schema('netdisco')->resultset('NetmapPositions')->create({
|
||||
device_groups => [sort @hgrplist],
|
||||
vlan => ($vlan || 0),
|
||||
positions => to_json(\%clean),
|
||||
});
|
||||
}
|
||||
};
|
||||
|
||||
sub to_speed {
|
||||
my $speed = shift or return '';
|
||||
$speed = SNMP::Info::munge_highspeed($speed);
|
||||
$speed =~ s/(?:\s|bps)//g;
|
||||
return $speed;
|
||||
}
|
||||
|
||||
sub make_node_infostring {
|
||||
my $node = shift or return '';
|
||||
my $fmt = ('Serial: <b>%s</b><br>Vendor/Model: <b>%s / %s</b><br>'
|
||||
.'OS/Version: <b>%s / %s</b><br>Uptime: <b>%s</b><br>'
|
||||
.'Location: <b>%s</b><br>Contact: <b>%s</b>');
|
||||
return sprintf $fmt,
|
||||
map {defined $_ ? $_ : ''}
|
||||
map {$node->$_}
|
||||
(qw/serial vendor model os os_ver uptime_age location contact/);
|
||||
}
|
||||
|
||||
sub make_link_infostring {
|
||||
my $link = shift or return '';
|
||||
|
||||
my $domain = quotemeta( setting('domain_suffix') || '' );
|
||||
(my $left_name = lc($link->{left_dns} || $link->{left_name} || $link->{left_ip})) =~ s/$domain$//;
|
||||
(my $right_name = lc($link->{right_dns} || $link->{right_name} || $link->{right_ip})) =~ s/$domain$//;
|
||||
|
||||
if ($link->{aggports} == 1) {
|
||||
return sprintf '<b>%s:%s</b> (%s)<br><b>%s:%s</b> (%s)',
|
||||
$left_name, $link->{left_port}->[0], $link->{left_descr}->[0],
|
||||
$right_name, $link->{right_port}->[0], $link->{right_descr}->[0];
|
||||
}
|
||||
else {
|
||||
return sprintf '<b>%s:(%s)</b><br><b>%s:(%s)</b>',
|
||||
$left_name, join(',', @{$link->{left_port}}),
|
||||
$right_name, join(',', @{$link->{right_port}});
|
||||
}
|
||||
}
|
||||
|
||||
ajax '/ajax/data/device/netmap' => require_login sub {
|
||||
my $q = param('q');
|
||||
my $qdev = schema('netdisco')->resultset('Device')
|
||||
->search_for_device($q) or send_error('Bad device', 400);
|
||||
|
||||
my $vlan = param('vlan');
|
||||
undef $vlan if (defined $vlan and $vlan !~ m/^\d+$/);
|
||||
|
||||
my $mapshow = (param('mapshow') || 'neighbors');
|
||||
$mapshow = 'neighbors' if $mapshow !~ m/^(?:all|neighbors|only)$/;
|
||||
$mapshow = 'all' unless $qdev->in_storage;
|
||||
|
||||
# list of groups selected by user and passed in param
|
||||
my $devgrp = (ref [] eq ref param('devgrp') ? param('devgrp') : [param('devgrp')]);
|
||||
# list of groups validated as real host groups and named host groups
|
||||
my @hgrplist = List::MoreUtils::uniq
|
||||
grep { exists setting('host_group_displaynames')->{$_} }
|
||||
grep { exists setting('host_groups')->{$_} }
|
||||
grep { defined } @{ $devgrp };
|
||||
|
||||
my %ok_dev = ();
|
||||
my %logvals = ();
|
||||
my %metadata = ();
|
||||
my %data = ( nodes => [], links => [] );
|
||||
my $domain = quotemeta( setting('domain_suffix') || '' );
|
||||
|
||||
# LINKS
|
||||
|
||||
my $links = schema('netdisco')->resultset('Virtual::DeviceLinks')->search({
|
||||
($mapshow eq 'neighbors' ? ( -or => [
|
||||
{ left_ip => $qdev->ip },
|
||||
{ right_ip => $qdev->ip },
|
||||
]) : ())
|
||||
}, { result_class => 'DBIx::Class::ResultClass::HashRefInflator' });
|
||||
|
||||
if ($vlan) {
|
||||
$rs = $rs->search({
|
||||
'left_vlans.vlan' => $vlan,
|
||||
'right_vlans.vlan' => $vlan,
|
||||
$links = $links->search({
|
||||
-or => [
|
||||
{ 'left_vlans.vlan' => $vlan },
|
||||
{ 'right_vlans.vlan' => $vlan },
|
||||
],
|
||||
}, {
|
||||
join => [qw/left_vlans right_vlans/],
|
||||
});
|
||||
}
|
||||
|
||||
while (my $l = $rs->next) {
|
||||
var('links')->{ $l->{left_ip} } ||= [];
|
||||
push @{ var('links')->{ $l->{left_ip} } }, $l->{right_ip};
|
||||
}
|
||||
|
||||
my %tree = (
|
||||
ip => $start,
|
||||
name => _get_name($start), # dns or sysname or ip
|
||||
children => [],
|
||||
);
|
||||
|
||||
var(seen => {$start => 1});
|
||||
my $max = _add_children($tree{children}, var('links')->{$start}, 1, $depth);
|
||||
$tree{scale} = $max;
|
||||
|
||||
content_type('application/json');
|
||||
to_json(\%tree);
|
||||
while (my $link = $links->next) {
|
||||
push @{$data{'links'}}, {
|
||||
FROMID => $link->{left_ip},
|
||||
TOID => $link->{right_ip},
|
||||
INFOSTRING => make_link_infostring($link),
|
||||
SPEED => to_speed($link->{aggspeed}),
|
||||
};
|
||||
|
||||
ajax '/ajax/data/device/alldevicelinks' => require_login sub {
|
||||
my $rs = schema('netdisco')->resultset('Virtual::DeviceLinks')->search({}, {
|
||||
result_class => 'DBIx::Class::ResultClass::HashRefInflator',
|
||||
});
|
||||
|
||||
my %tree = ();
|
||||
while (my $l = $rs->next) {
|
||||
push @{ $tree{ $l->{left_ip} } }, $l->{right_ip};
|
||||
++$ok_dev{$link->{left_ip}};
|
||||
++$ok_dev{$link->{right_ip}};
|
||||
}
|
||||
|
||||
# DEVICES (NODES)
|
||||
|
||||
my $posrow = schema('netdisco')->resultset('NetmapPositions')->find({
|
||||
device_groups => \[ '= ?',
|
||||
[device_groups => [$mapshow eq 'all' ? '__ANY__' : (sort @hgrplist)]] ],
|
||||
vlan => ($vlan || 0)});
|
||||
my $pos_for = from_json( $posrow ? $posrow->positions : '{}' );
|
||||
|
||||
my $devices = schema('netdisco')->resultset('Device')->search({}, {
|
||||
'+select' => [\'floor(log(throughput.total))'], '+as' => ['log'],
|
||||
join => 'throughput',
|
||||
})->with_times;
|
||||
|
||||
DEVICE: while (my $device = $devices->next) {
|
||||
# if in neighbors or vlan mode then use %ok_dev to filter
|
||||
next DEVICE if (($mapshow eq 'neighbors') or $vlan)
|
||||
and (not $ok_dev{$device->ip});
|
||||
|
||||
# if in only mode then use ACLs to filter
|
||||
my $first_hgrp =
|
||||
first { check_acl_only($device, setting('host_groups')->{$_}) } @hgrplist;
|
||||
next DEVICE if $mapshow eq 'only' and not $first_hgrp;
|
||||
|
||||
++$logvals{ $device->get_column('log') || 1 };
|
||||
(my $name = lc($device->dns || $device->name || $device->ip)) =~ s/$domain$//;
|
||||
|
||||
my $node = {
|
||||
ID => $device->ip,
|
||||
SIZEVALUE => (param('dynamicsize') ?
|
||||
(($device->get_column('log') || 1) * 1000) : 3000),
|
||||
(param('colorgroups') ?
|
||||
(COLORVALUE => ($first_hgrp ? setting('host_group_displaynames')->{$first_hgrp}
|
||||
: 'Other')) : ()),
|
||||
LABEL => (param('showips')
|
||||
? (($name eq $device->ip) ? $name : ($name .' '. $device->ip)) : $name),
|
||||
ORIG_LABEL => $name,
|
||||
INFOSTRING => make_node_infostring($device),
|
||||
LINK => uri_for('/device', {
|
||||
tab => 'netmap',
|
||||
q => $device->ip,
|
||||
firstsearch => 'on',
|
||||
})->path_query,
|
||||
};
|
||||
|
||||
if ($mapshow ne 'neighbors' and exists $pos_for->{$device->ip}) {
|
||||
$node->{'fixed'} = 1;
|
||||
$node->{'x'} = $pos_for->{$device->ip}->{'x'};
|
||||
$node->{'y'} = $pos_for->{$device->ip}->{'y'};
|
||||
}
|
||||
else {
|
||||
++$metadata{'newnodes'};
|
||||
}
|
||||
|
||||
push @{$data{'nodes'}}, $node;
|
||||
$metadata{'centernode'} = $device->ip
|
||||
if $qdev and $qdev->in_storage and $device->ip eq $qdev->ip;
|
||||
}
|
||||
|
||||
# to help get a sensible range of node sizes
|
||||
$metadata{'numsizes'} = scalar keys %logvals;
|
||||
|
||||
content_type('application/json');
|
||||
to_json(\%tree);
|
||||
to_json({ data => \%data, %metadata });
|
||||
};
|
||||
|
||||
true;
|
||||
|
||||
@@ -132,6 +132,12 @@ sidebar_defaults:
|
||||
age_unit: { default: months }
|
||||
mac_format: { default: IEEE }
|
||||
neigh_id: { default: null }
|
||||
device_netmap:
|
||||
showips: { default: null }
|
||||
showspeed: { default: null }
|
||||
mapshow: { default: neighbors }
|
||||
colorgroups: { default: checked }
|
||||
dynamicsize: { default: null }
|
||||
report_moduleinventory:
|
||||
fruonly: { default: checked }
|
||||
matchall: { default: checked }
|
||||
@@ -172,10 +178,13 @@ login_logo: ""
|
||||
# mibhome is discovered from environment
|
||||
# mibdirs defaults to contents of mibhome
|
||||
host_groups:
|
||||
__ANY__:
|
||||
- 'any'
|
||||
__LOCAL_ADDRESSES__:
|
||||
- '::1'
|
||||
- 'fe80::/10'
|
||||
- '127.0.0.0/8'
|
||||
host_group_displaynames: {}
|
||||
device_identity: []
|
||||
community: []
|
||||
community_rw: []
|
||||
|
||||
329
share/public/css/awesome-bootstrap-checkbox.css
Normal file
329
share/public/css/awesome-bootstrap-checkbox.css
Normal file
@@ -0,0 +1,329 @@
|
||||
/*
|
||||
.checkbox {
|
||||
padding-left: 20px;
|
||||
}
|
||||
.checkbox label {
|
||||
display: inline-block;
|
||||
vertical-align: middle;
|
||||
position: relative;
|
||||
padding-left: 5px;
|
||||
}
|
||||
.checkbox label::before {
|
||||
content: "";
|
||||
display: inline-block;
|
||||
position: absolute;
|
||||
width: 17px;
|
||||
height: 17px;
|
||||
left: 0;
|
||||
margin-left: -20px;
|
||||
border: 1px solid #cccccc;
|
||||
border-radius: 3px;
|
||||
background-color: #fff;
|
||||
-webkit-transition: border 0.15s ease-in-out, color 0.15s ease-in-out;
|
||||
-o-transition: border 0.15s ease-in-out, color 0.15s ease-in-out;
|
||||
transition: border 0.15s ease-in-out, color 0.15s ease-in-out;
|
||||
}
|
||||
.checkbox label::after {
|
||||
display: inline-block;
|
||||
position: absolute;
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
left: 0;
|
||||
top: 0;
|
||||
margin-left: -20px;
|
||||
padding-left: 3px;
|
||||
padding-top: 1px;
|
||||
font-size: 11px;
|
||||
color: #555555;
|
||||
line-height: 1.4;
|
||||
}
|
||||
.checkbox input[type="checkbox"],
|
||||
.checkbox input[type="radio"] {
|
||||
opacity: 0;
|
||||
z-index: 1;
|
||||
cursor: pointer;
|
||||
}
|
||||
.checkbox input[type="checkbox"]:focus + label::before,
|
||||
.checkbox input[type="radio"]:focus + label::before {
|
||||
outline: thin dotted;
|
||||
outline: 5px auto -webkit-focus-ring-color;
|
||||
outline-offset: -2px;
|
||||
}
|
||||
.checkbox input[type="checkbox"]:checked + label::after,
|
||||
.checkbox input[type="radio"]:checked + label::after {
|
||||
font-family: "FontAwesome";
|
||||
content: "\f00c";
|
||||
}
|
||||
.checkbox input[type="checkbox"]:indeterminate + label::after,
|
||||
.checkbox input[type="radio"]:indeterminate + label::after {
|
||||
display: block;
|
||||
content: "";
|
||||
width: 10px;
|
||||
height: 3px;
|
||||
background-color: #555555;
|
||||
border-radius: 2px;
|
||||
margin-left: -16.5px;
|
||||
margin-top: 7px;
|
||||
}
|
||||
.checkbox input[type="checkbox"]:disabled,
|
||||
.checkbox input[type="radio"]:disabled {
|
||||
cursor: not-allowed;
|
||||
}
|
||||
.checkbox input[type="checkbox"]:disabled + label,
|
||||
.checkbox input[type="radio"]:disabled + label {
|
||||
opacity: 0.65;
|
||||
}
|
||||
.checkbox input[type="checkbox"]:disabled + label::before,
|
||||
.checkbox input[type="radio"]:disabled + label::before {
|
||||
background-color: #eeeeee;
|
||||
cursor: not-allowed;
|
||||
}
|
||||
.checkbox.checkbox-circle label::before {
|
||||
border-radius: 50%;
|
||||
}
|
||||
.checkbox.checkbox-inline {
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
.checkbox-primary input[type="checkbox"]:checked + label::before,
|
||||
.checkbox-primary input[type="radio"]:checked + label::before {
|
||||
background-color: #337ab7;
|
||||
border-color: #337ab7;
|
||||
}
|
||||
.checkbox-primary input[type="checkbox"]:checked + label::after,
|
||||
.checkbox-primary input[type="radio"]:checked + label::after {
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.checkbox-danger input[type="checkbox"]:checked + label::before,
|
||||
.checkbox-danger input[type="radio"]:checked + label::before {
|
||||
background-color: #d9534f;
|
||||
border-color: #d9534f;
|
||||
}
|
||||
.checkbox-danger input[type="checkbox"]:checked + label::after,
|
||||
.checkbox-danger input[type="radio"]:checked + label::after {
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.checkbox-info input[type="checkbox"]:checked + label::before,
|
||||
.checkbox-info input[type="radio"]:checked + label::before {
|
||||
background-color: #5bc0de;
|
||||
border-color: #5bc0de;
|
||||
}
|
||||
.checkbox-info input[type="checkbox"]:checked + label::after,
|
||||
.checkbox-info input[type="radio"]:checked + label::after {
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.checkbox-warning input[type="checkbox"]:checked + label::before,
|
||||
.checkbox-warning input[type="radio"]:checked + label::before {
|
||||
background-color: #f0ad4e;
|
||||
border-color: #f0ad4e;
|
||||
}
|
||||
.checkbox-warning input[type="checkbox"]:checked + label::after,
|
||||
.checkbox-warning input[type="radio"]:checked + label::after {
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.checkbox-success input[type="checkbox"]:checked + label::before,
|
||||
.checkbox-success input[type="radio"]:checked + label::before {
|
||||
background-color: #5cb85c;
|
||||
border-color: #5cb85c;
|
||||
}
|
||||
.checkbox-success input[type="checkbox"]:checked + label::after,
|
||||
.checkbox-success input[type="radio"]:checked + label::after {
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.checkbox-primary input[type="checkbox"]:indeterminate + label::before,
|
||||
.checkbox-primary input[type="radio"]:indeterminate + label::before {
|
||||
background-color: #337ab7;
|
||||
border-color: #337ab7;
|
||||
}
|
||||
|
||||
.checkbox-primary input[type="checkbox"]:indeterminate + label::after,
|
||||
.checkbox-primary input[type="radio"]:indeterminate + label::after {
|
||||
background-color: #fff;
|
||||
}
|
||||
|
||||
.checkbox-danger input[type="checkbox"]:indeterminate + label::before,
|
||||
.checkbox-danger input[type="radio"]:indeterminate + label::before {
|
||||
background-color: #d9534f;
|
||||
border-color: #d9534f;
|
||||
}
|
||||
|
||||
.checkbox-danger input[type="checkbox"]:indeterminate + label::after,
|
||||
.checkbox-danger input[type="radio"]:indeterminate + label::after {
|
||||
background-color: #fff;
|
||||
}
|
||||
|
||||
.checkbox-info input[type="checkbox"]:indeterminate + label::before,
|
||||
.checkbox-info input[type="radio"]:indeterminate + label::before {
|
||||
background-color: #5bc0de;
|
||||
border-color: #5bc0de;
|
||||
}
|
||||
|
||||
.checkbox-info input[type="checkbox"]:indeterminate + label::after,
|
||||
.checkbox-info input[type="radio"]:indeterminate + label::after {
|
||||
background-color: #fff;
|
||||
}
|
||||
|
||||
.checkbox-warning input[type="checkbox"]:indeterminate + label::before,
|
||||
.checkbox-warning input[type="radio"]:indeterminate + label::before {
|
||||
background-color: #f0ad4e;
|
||||
border-color: #f0ad4e;
|
||||
}
|
||||
|
||||
.checkbox-warning input[type="checkbox"]:indeterminate + label::after,
|
||||
.checkbox-warning input[type="radio"]:indeterminate + label::after {
|
||||
background-color: #fff;
|
||||
}
|
||||
|
||||
.checkbox-success input[type="checkbox"]:indeterminate + label::before,
|
||||
.checkbox-success input[type="radio"]:indeterminate + label::before {
|
||||
background-color: #5cb85c;
|
||||
border-color: #5cb85c;
|
||||
}
|
||||
|
||||
.checkbox-success input[type="checkbox"]:indeterminate + label::after,
|
||||
.checkbox-success input[type="radio"]:indeterminate + label::after {
|
||||
background-color: #fff;
|
||||
}
|
||||
*/
|
||||
|
||||
.radio {
|
||||
padding-left: 20px;
|
||||
}
|
||||
.radio label {
|
||||
display: inline-block;
|
||||
vertical-align: middle;
|
||||
position: relative;
|
||||
padding-left: 5px;
|
||||
}
|
||||
.radio label::before {
|
||||
content: "";
|
||||
display: inline-block;
|
||||
position: absolute;
|
||||
width: 17px;
|
||||
height: 17px;
|
||||
left: 0;
|
||||
margin-left: -20px;
|
||||
border: 1px solid #cccccc;
|
||||
border-radius: 50%;
|
||||
background-color: #fff;
|
||||
-webkit-transition: border 0.15s ease-in-out;
|
||||
-o-transition: border 0.15s ease-in-out;
|
||||
transition: border 0.15s ease-in-out;
|
||||
}
|
||||
.radio label::after {
|
||||
display: inline-block;
|
||||
position: absolute;
|
||||
content: " ";
|
||||
width: 11px;
|
||||
height: 11px;
|
||||
left: 4px;
|
||||
top: 4px;
|
||||
margin-left: -20px;
|
||||
border-radius: 50%;
|
||||
background-color: #555555;
|
||||
-webkit-transform: scale(0, 0);
|
||||
-ms-transform: scale(0, 0);
|
||||
-o-transform: scale(0, 0);
|
||||
transform: scale(0, 0);
|
||||
-webkit-transition: -webkit-transform 0.1s cubic-bezier(0.8, -0.33, 0.2, 1.33);
|
||||
-moz-transition: -moz-transform 0.1s cubic-bezier(0.8, -0.33, 0.2, 1.33);
|
||||
-o-transition: -o-transform 0.1s cubic-bezier(0.8, -0.33, 0.2, 1.33);
|
||||
transition: transform 0.1s cubic-bezier(0.8, -0.33, 0.2, 1.33);
|
||||
}
|
||||
.radio input[type="radio"] {
|
||||
opacity: 0;
|
||||
z-index: 1;
|
||||
cursor: pointer;
|
||||
}
|
||||
.radio input[type="radio"]:focus + label::before {
|
||||
outline: thin dotted;
|
||||
outline: 5px auto -webkit-focus-ring-color;
|
||||
outline-offset: -2px;
|
||||
}
|
||||
.radio input[type="radio"]:checked + label::after {
|
||||
-webkit-transform: scale(1, 1);
|
||||
-ms-transform: scale(1, 1);
|
||||
-o-transform: scale(1, 1);
|
||||
transform: scale(1, 1);
|
||||
}
|
||||
.radio input[type="radio"]:disabled {
|
||||
cursor: not-allowed;
|
||||
}
|
||||
.radio input[type="radio"]:disabled + label {
|
||||
opacity: 0.65;
|
||||
}
|
||||
.radio input[type="radio"]:disabled + label::before {
|
||||
cursor: not-allowed;
|
||||
}
|
||||
.radio.radio-inline {
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
.radio-primary input[type="radio"] + label::after {
|
||||
background-color: #337ab7;
|
||||
}
|
||||
.radio-primary input[type="radio"]:checked + label::before {
|
||||
border-color: #337ab7;
|
||||
}
|
||||
.radio-primary input[type="radio"]:checked + label::after {
|
||||
background-color: #337ab7;
|
||||
}
|
||||
|
||||
.radio-danger input[type="radio"] + label::after {
|
||||
background-color: #d9534f;
|
||||
}
|
||||
.radio-danger input[type="radio"]:checked + label::before {
|
||||
border-color: #d9534f;
|
||||
}
|
||||
.radio-danger input[type="radio"]:checked + label::after {
|
||||
background-color: #d9534f;
|
||||
}
|
||||
|
||||
.radio-info input[type="radio"] + label::after {
|
||||
background-color: #5bc0de;
|
||||
}
|
||||
.radio-info input[type="radio"]:checked + label::before {
|
||||
border-color: #5bc0de;
|
||||
}
|
||||
.radio-info input[type="radio"]:checked + label::after {
|
||||
background-color: #5bc0de;
|
||||
}
|
||||
|
||||
.radio-warning input[type="radio"] + label::after {
|
||||
background-color: #f0ad4e;
|
||||
}
|
||||
.radio-warning input[type="radio"]:checked + label::before {
|
||||
border-color: #f0ad4e;
|
||||
}
|
||||
.radio-warning input[type="radio"]:checked + label::after {
|
||||
background-color: #f0ad4e;
|
||||
}
|
||||
|
||||
.radio-success input[type="radio"] + label::after {
|
||||
background-color: #5cb85c;
|
||||
}
|
||||
.radio-success input[type="radio"]:checked + label::before {
|
||||
border-color: #5cb85c;
|
||||
}
|
||||
.radio-success input[type="radio"]:checked + label::after {
|
||||
background-color: #5cb85c;
|
||||
}
|
||||
|
||||
/* input[type="checkbox"].styled:checked + label:after, */
|
||||
input[type="radio"].styled:checked + label:after {
|
||||
font-family: 'FontAwesome';
|
||||
content: "\f00c";
|
||||
}
|
||||
/* input[type="checkbox"] .styled:checked + label::before, */
|
||||
input[type="radio"] .styled:checked + label::before {
|
||||
color: #fff;
|
||||
}
|
||||
/* input[type="checkbox"] .styled:checked + label::after, */
|
||||
input[type="radio"] .styled:checked + label::after {
|
||||
color: #fff;
|
||||
}
|
||||
32
share/public/css/bootstrap2-toggle.min.css
vendored
Normal file
32
share/public/css/bootstrap2-toggle.min.css
vendored
Normal file
@@ -0,0 +1,32 @@
|
||||
/*! ========================================================================
|
||||
* Bootstrap Toggle: bootstrap2-toggle.css v2.2.0
|
||||
* http://www.bootstraptoggle.com
|
||||
* ========================================================================
|
||||
* Copyright 2014 Min Hur, The New York Times Company
|
||||
* Licensed under MIT
|
||||
* ======================================================================== */
|
||||
label.checkbox .toggle,label.checkbox.inline .toggle{margin-left:-20px;margin-right:5px}
|
||||
.toggle{min-width:40px;height:20px;position:relative;overflow:hidden}
|
||||
.toggle input[type=checkbox]{display:none}
|
||||
.toggle-group{position:absolute;width:200%;top:0;bottom:0;left:0;transition:left .35s;-webkit-transition:left .35s;-moz-user-select:none;-webkit-user-select:none}
|
||||
.toggle.off .toggle-group{left:-100%}
|
||||
.toggle-on{position:absolute;top:0;bottom:0;left:0;right:50%;margin:0;border:0;border-radius:0}
|
||||
.toggle-off{position:absolute;top:0;bottom:0;left:50%;right:0;margin:0;border:0;border-radius:0}
|
||||
.toggle-handle{position:relative;margin:0 auto;padding-top:0;padding-bottom:0;height:100%;width:0;border-width:0 1px}
|
||||
.toggle-handle.btn-mini{top:-1px}
|
||||
.toggle.btn{min-width:30px}
|
||||
.toggle-on.btn{padding-right:24px}
|
||||
.toggle-off.btn{padding-left:24px}
|
||||
.toggle.btn-large{min-width:40px}
|
||||
.toggle-on.btn-large{padding-right:35px}
|
||||
.toggle-off.btn-large{padding-left:35px}
|
||||
.toggle.btn-small{min-width:25px}
|
||||
.toggle-on.btn-small{padding-right:20px}
|
||||
.toggle-off.btn-small{padding-left:20px}
|
||||
.toggle.btn-mini{min-width:20px}
|
||||
.toggle-on.btn-mini{padding-right:12px}
|
||||
.toggle-off.btn-mini{padding-left:12px}
|
||||
/* added for netdisco */
|
||||
div.checkbox.pull-left {padding-left:5px}
|
||||
label.btn.btn-success.btn-small.toggle-on {left:-4px}
|
||||
|
||||
197
share/public/css/d3-force-network-chart.css
Normal file
197
share/public/css/d3-force-network-chart.css
Normal file
@@ -0,0 +1,197 @@
|
||||
.net_gobrechts_d3_force,
|
||||
.net_gobrechts_d3_force_customize,
|
||||
.net_gobrechts_d3_force_customize td,
|
||||
.net_gobrechts_d3_force_tooltip {
|
||||
box-sizing: content-box;
|
||||
font-family: Arial, Helvetica, Sans Serif;
|
||||
font-size: 10px;
|
||||
background-color: #fff
|
||||
}
|
||||
.net_gobrechts_d3_force.border {
|
||||
border: 1px solid silver;
|
||||
border-radius: 5px;
|
||||
}
|
||||
.net_gobrechts_d3_force circle.highlighted {
|
||||
stroke: #555;
|
||||
stroke-width: 2px;
|
||||
stroke-opacity: 1.0;
|
||||
}
|
||||
.net_gobrechts_d3_force circle.selected {
|
||||
stroke: #555;
|
||||
stroke-width: 4px;
|
||||
stroke-dasharray: 4 2;
|
||||
stroke-opacity: 1.0;
|
||||
}
|
||||
.net_gobrechts_d3_force text.label,
|
||||
.net_gobrechts_d3_force text.labelCircular {
|
||||
fill: black;
|
||||
font-size: 10px;
|
||||
letter-spacing: 0;
|
||||
pointer-events: none;
|
||||
}
|
||||
.net_gobrechts_d3_force text.label{
|
||||
text-anchor: middle;
|
||||
}
|
||||
.net_gobrechts_d3_force text.highlighted {
|
||||
font-size: 12px;
|
||||
font-weight: bold;
|
||||
}
|
||||
.net_gobrechts_d3_force text.link {
|
||||
font-size: 12px;
|
||||
fill: #2a7ae2;
|
||||
cursor: pointer;
|
||||
}
|
||||
.net_gobrechts_d3_force line.link,
|
||||
.net_gobrechts_d3_force path.link {
|
||||
fill: none;
|
||||
stroke: #bbb;
|
||||
stroke-width: 1.5px;
|
||||
stroke-opacity: 0.8;
|
||||
}
|
||||
.net_gobrechts_d3_force line.dotted,
|
||||
.net_gobrechts_d3_force path.dotted {
|
||||
stroke-dasharray: .01 3;
|
||||
stroke-linecap: round;
|
||||
}
|
||||
.net_gobrechts_d3_force line.dashed,
|
||||
.net_gobrechts_d3_force path.dashed {
|
||||
stroke-dasharray: 4 2;
|
||||
}
|
||||
.net_gobrechts_d3_force line.highlighted,
|
||||
.net_gobrechts_d3_force path.highlighted {
|
||||
stroke: #555 !important;
|
||||
stroke-opacity: 1.0;
|
||||
}
|
||||
.net_gobrechts_d3_force marker.normal {
|
||||
stroke: none;
|
||||
fill: #bbb;
|
||||
}
|
||||
.net_gobrechts_d3_force marker.highlighted {
|
||||
stroke: none;
|
||||
fill: #555;
|
||||
}
|
||||
.net_gobrechts_d3_force .graphOverlay,
|
||||
.net_gobrechts_d3_force .graphOverlaySizeHelper {
|
||||
fill: none;
|
||||
pointer-events: all;
|
||||
}
|
||||
.net_gobrechts_d3_force .lasso path {
|
||||
stroke: #505050;
|
||||
stroke-width: 2px;
|
||||
}
|
||||
.net_gobrechts_d3_force .lasso .drawn {
|
||||
fill-opacity: 0.05 ;
|
||||
}
|
||||
.net_gobrechts_d3_force .lasso .loop_close {
|
||||
fill: none;
|
||||
stroke-dasharray: 4,4;
|
||||
}
|
||||
.net_gobrechts_d3_force .lasso .origin {
|
||||
fill: #3399FF;
|
||||
fill-opacity: 0.5;
|
||||
}
|
||||
.net_gobrechts_d3_force .loading rect {
|
||||
fill: black;
|
||||
fill-opacity: 0.2;
|
||||
}
|
||||
.net_gobrechts_d3_force .loading text {
|
||||
fill: white;
|
||||
font-size: 36px;
|
||||
text-anchor: middle;
|
||||
}
|
||||
.net_gobrechts_d3_force_tooltip {
|
||||
position: absolute;
|
||||
border-radius: 5px;
|
||||
padding: 5px;
|
||||
background-color: silver;
|
||||
opacity: 0.9;
|
||||
width: 150px;
|
||||
overflow: auto;
|
||||
font-size: 12px;
|
||||
z-index: 100000;
|
||||
pointer-events: none;
|
||||
display: none;
|
||||
}
|
||||
.net_gobrechts_d3_force_customize {
|
||||
border: 1px solid silver;
|
||||
border-radius: 5px;
|
||||
font-size: 12px;
|
||||
position: absolute;
|
||||
padding: 5px;
|
||||
background-color:white;
|
||||
box-shadow: 1px 1px 6px #666;
|
||||
z-index: 200000;
|
||||
}
|
||||
.net_gobrechts_d3_force_customize .drag {
|
||||
border: 1px dashed silver;
|
||||
border-radius: 3px;
|
||||
display: block;
|
||||
cursor: move;
|
||||
font-weight: bold;
|
||||
height: 24px;
|
||||
margin-bottom: 5px;
|
||||
}
|
||||
.net_gobrechts_d3_force_customize .title {
|
||||
position: absolute;
|
||||
top: 10px;
|
||||
left: 10px;
|
||||
}
|
||||
.net_gobrechts_d3_force_customize .close {
|
||||
position: absolute;
|
||||
top: 10px;
|
||||
right: 10px;
|
||||
}
|
||||
.net_gobrechts_d3_force_customize table {
|
||||
border-collapse: collapse;
|
||||
border-spacing: 0;
|
||||
border: none;
|
||||
margin:0;
|
||||
padding:0;
|
||||
}
|
||||
.net_gobrechts_d3_force_customize tr.hidden {
|
||||
display: none;
|
||||
}
|
||||
.net_gobrechts_d3_force_customize td {
|
||||
padding: 1px;
|
||||
font-size: 12px;
|
||||
vertical-align: middle;
|
||||
border: none;
|
||||
}
|
||||
.net_gobrechts_d3_force_customize .label {
|
||||
text-align: right;
|
||||
}
|
||||
.net_gobrechts_d3_force_customize .warning {
|
||||
background-color: orange;
|
||||
}
|
||||
.net_gobrechts_d3_force_customize input,
|
||||
.net_gobrechts_d3_force_customize select,
|
||||
.net_gobrechts_d3_force_customize textarea,
|
||||
.net_gobrechts_d3_force_customize a {
|
||||
border: 1px solid silver;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
height: auto;
|
||||
}
|
||||
.net_gobrechts_d3_force_customize a {
|
||||
border: 1px solid transparent;
|
||||
color: #2a7ae2;
|
||||
text-decoration: none;
|
||||
cursor: pointer;
|
||||
}
|
||||
.net_gobrechts_d3_force_customize input:focus,
|
||||
.net_gobrechts_d3_force_customize select:focus,
|
||||
.net_gobrechts_d3_force_customize textarea:focus,
|
||||
.net_gobrechts_d3_force_customize a:focus {
|
||||
outline: none !important;
|
||||
border: 1px solid #2a7ae2 !important;
|
||||
background-color: #ffff99 !important;
|
||||
box-shadow: none !important;
|
||||
}
|
||||
.net_gobrechts_d3_force_customize textarea {
|
||||
font-size: 10px !important;
|
||||
padding: 2px;
|
||||
width: 160px;
|
||||
height: 85px;
|
||||
background-color: white;
|
||||
color: black;
|
||||
}
|
||||
@@ -425,6 +425,14 @@ td > form.nd_inline-form {
|
||||
/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
|
||||
/* style customization for many items which appear in the sidebar */
|
||||
|
||||
/* horizontal rule */
|
||||
.nd_sidebar-hr {
|
||||
color: black;
|
||||
background-color: black;
|
||||
height: 2px;
|
||||
margin: 12px 0px 12px 0px;
|
||||
}
|
||||
|
||||
/* text in the sidebar */
|
||||
.nd_sidebar-title {
|
||||
margin-left: 10px;
|
||||
@@ -432,11 +440,49 @@ td > form.nd_inline-form {
|
||||
margin-bottom: 12px;
|
||||
}
|
||||
|
||||
/* Flabels in netmap sidebar (not in a collapser) */
|
||||
/* labels in netmap sidebar (not in a collapser) */
|
||||
.nd_sidebar-label {
|
||||
margin-left: 7px;
|
||||
}
|
||||
|
||||
/* to allow display of tooltip on a disabled control
|
||||
http://jsfiddle.net/cSSUA/209/ */
|
||||
.tooltip-wrapper {
|
||||
display: inline-block;
|
||||
}
|
||||
.tooltip-wrapper .input[disabled] {
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
/* vlan entry box for netmap */
|
||||
#nd_vlan-label {
|
||||
margin-left: 5px;
|
||||
margin-bottom: -7px;
|
||||
}
|
||||
#nd_vlan-label-text {
|
||||
vertical-align: text-bottom;
|
||||
}
|
||||
#nd_vlan-entry {
|
||||
width: 56px;
|
||||
}
|
||||
|
||||
/* netmap maximise icon */
|
||||
#nd2_fullscreen-netmap {
|
||||
fill: black;
|
||||
font-size: 15px;
|
||||
}
|
||||
|
||||
/* netmap link labels */
|
||||
.nd_netmap-linklabel {
|
||||
pointer-events: none;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
/* netmap tooltip box */
|
||||
#netmap_pane_tooltip {
|
||||
width: unset;
|
||||
}
|
||||
|
||||
/* fixup for prepended checkbox in sidebar */
|
||||
.nd_searchcheckbox {
|
||||
width: 121px;
|
||||
@@ -614,8 +660,12 @@ form .clearfix.success input {
|
||||
}
|
||||
|
||||
.nd_netmap-sidebar {
|
||||
margin-top: 7px;
|
||||
margin-left: -9px;
|
||||
margin-top: 0px;
|
||||
margin-left: -8px;
|
||||
}
|
||||
|
||||
.nd_netmap-sidebar > .input-prepend {
|
||||
margin-left: 5px;
|
||||
}
|
||||
|
||||
.nd_netmap-sidebar-help {
|
||||
@@ -629,6 +679,7 @@ form .clearfix.success input {
|
||||
/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
|
||||
/* D3 SVG */
|
||||
|
||||
/*
|
||||
.node circle {
|
||||
fill: #fff;
|
||||
stroke: steelblue;
|
||||
@@ -651,6 +702,7 @@ form .clearfix.success input {
|
||||
stroke-width: 2px;
|
||||
display: none;
|
||||
}
|
||||
*/
|
||||
|
||||
/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
|
||||
/* dataTables */
|
||||
|
||||
9
share/public/javascripts/bootstrap2-toggle.min.js
vendored
Normal file
9
share/public/javascripts/bootstrap2-toggle.min.js
vendored
Normal file
@@ -0,0 +1,9 @@
|
||||
/*! ========================================================================
|
||||
* Bootstrap Toggle: bootstrap2-toggle.js v2.2.0
|
||||
* http://www.bootstraptoggle.com
|
||||
* ========================================================================
|
||||
* Copyright 2014 Min Hur, The New York Times Company
|
||||
* Licensed under MIT
|
||||
* ======================================================================== */
|
||||
+function(a){"use strict";function b(b){return this.each(function(){var d=a(this),e=d.data("bs.toggle"),f="object"==typeof b&&b;e||d.data("bs.toggle",e=new c(this,f)),"string"==typeof b&&e[b]&&e[b]()})}var c=function(b,c){this.$element=a(b),this.options=a.extend({},this.defaults(),c),this.render()};c.VERSION="2.2.0",c.DEFAULTS={on:"On",off:"Off",onstyle:"primary",offstyle:"default",size:"normal",style:"",width:null,height:null},c.prototype.defaults=function(){return{on:this.$element.attr("data-on")||c.DEFAULTS.on,off:this.$element.attr("data-off")||c.DEFAULTS.off,onstyle:this.$element.attr("data-onstyle")||c.DEFAULTS.onstyle,offstyle:this.$element.attr("data-offstyle")||c.DEFAULTS.offstyle,size:this.$element.attr("data-size")||c.DEFAULTS.size,style:this.$element.attr("data-style")||c.DEFAULTS.style,width:this.$element.attr("data-width")||c.DEFAULTS.width,height:this.$element.attr("data-height")||c.DEFAULTS.height}},c.prototype.render=function(){this._onstyle="btn-"+this.options.onstyle,this._offstyle="btn-"+this.options.offstyle;var b="large"===this.options.size?"btn-large":"small"===this.options.size?"btn-small":"mini"===this.options.size?"btn-mini":"",c=a('<label class="btn">').html(this.options.on).addClass(this._onstyle+" "+b),d=a('<label class="btn">').html(this.options.off).addClass(this._offstyle+" "+b+" active"),e=a('<span class="toggle-handle btn btn-default">').addClass(b),f=a('<div class="toggle-group">').append(c,d,e),g=a('<div class="toggle btn" data-toggle="toggle">').addClass(this.$element.prop("checked")?this._onstyle:this._offstyle+" off").addClass(b).addClass(this.options.style);this.$element.wrap(g),a.extend(this,{$toggle:this.$element.parent(),$toggleOn:c,$toggleOff:d,$toggleGroup:f}),this.$toggle.append(f);var h=this.options.width||Math.max(c.width(),d.width())+e.outerWidth()/2,i=this.options.height||Math.max(c.height(),d.height());c.addClass("toggle-on"),d.addClass("toggle-off"),this.$toggle.css({width:h,height:i}),this.options.height&&(c.css("line-height",c.height()+"px"),d.css("line-height",d.height()+"px")),this.update(!0),this.trigger(!0)},c.prototype.toggle=function(){this.$element.prop("checked")?this.off():this.on()},c.prototype.on=function(a){return this.$element.prop("disabled")?!1:(this.$toggle.removeClass(this._offstyle+" off").addClass(this._onstyle),this.$element.prop("checked",!0),void(a||this.trigger()))},c.prototype.off=function(a){return this.$element.prop("disabled")?!1:(this.$toggle.removeClass(this._onstyle).addClass(this._offstyle+" off"),this.$element.prop("checked",!1),void(a||this.trigger()))},c.prototype.enable=function(){this.$toggle.removeAttr("disabled"),this.$element.prop("disabled",!1)},c.prototype.disable=function(){this.$toggle.attr("disabled","disabled"),this.$element.prop("disabled",!0)},c.prototype.update=function(a){this.$element.prop("disabled")?this.disable():this.enable(),this.$element.prop("checked")?this.on(a):this.off(a)},c.prototype.trigger=function(b){this.$element.off("change.bs.toggle"),b||this.$element.change(),this.$element.on("change.bs.toggle",a.proxy(function(){this.update()},this))},c.prototype.destroy=function(){this.$element.off("change.bs.toggle"),this.$toggleGroup.remove(),this.$element.removeData("bs.toggle"),this.$element.unwrap()};var d=a.fn.bootstrapToggle;a.fn.bootstrapToggle=b,a.fn.bootstrapToggle.Constructor=c,a.fn.toggle.noConflict=function(){return a.fn.bootstrapToggle=d,this},a(function(){a("input[type=checkbox][data-toggle^=toggle]").bootstrapToggle()}),a(document).on("click.bs.toggle","div[data-toggle^=toggle]",function(b){var c=a(this).find("input[type=checkbox]");c.bootstrapToggle("toggle"),b.preventDefault()})}(jQuery);
|
||||
//# sourceMappingURL=bootstrap2-toggle.min.js.map
|
||||
5198
share/public/javascripts/d3-force-network-chart.js
vendored
Normal file
5198
share/public/javascripts/d3-force-network-chart.js
vendored
Normal file
File diff suppressed because it is too large
Load Diff
9
share/public/javascripts/d3.min.js
vendored
9
share/public/javascripts/d3.min.js
vendored
File diff suppressed because one or more lines are too long
11
share/schema_versions/App-Netdisco-DB-45-46-PostgreSQL.sql
Normal file
11
share/schema_versions/App-Netdisco-DB-45-46-PostgreSQL.sql
Normal file
@@ -0,0 +1,11 @@
|
||||
BEGIN;
|
||||
|
||||
CREATE TABLE "netmap_positions" (
|
||||
"id" serial PRIMARY KEY,
|
||||
"device_groups" text[] NOT NULL,
|
||||
"vlan" integer NOT NULL DEFAULT 0,
|
||||
"positions" text NOT NULL,
|
||||
UNIQUE ("device_groups", "vlan")
|
||||
);
|
||||
|
||||
COMMIT;
|
||||
@@ -75,7 +75,7 @@
|
||||
<tbody>
|
||||
[% FOREACH row IN network %]
|
||||
<tr>
|
||||
<td><a href="[% uri_for('/device') %]?tab=netmap&q=[% row.ip | uri %]">
|
||||
<td><a href="[% uri_for('/device') %]?tab=netmap&q=[% row.ip | uri %]&firstsearch=on">
|
||||
[% row.dns || row.name || row.ip | html_entity %]</a></td>
|
||||
<td>
|
||||
[% IF row.location %]
|
||||
|
||||
@@ -12,13 +12,13 @@
|
||||
<tr>
|
||||
<td class="nd_center-cell">
|
||||
<div class="input-append">
|
||||
<input data-form="add" class="nd_topo_dev nd_topo_dev1" name="dev1" type="text">
|
||||
<input data-form="add" class="nd_topo_dev nd_topo_dev1" name="dev1" type="text" value="[% params.dev1 | html_entity %]">
|
||||
<span class="add-on nd_topo_dev_caret"><i class="icon-caret-down icon-large"></i></span>
|
||||
</div>
|
||||
</td>
|
||||
<td class="nd_center-cell">
|
||||
<div class="input-append">
|
||||
<input data-form="add" class="nd_topo_port nd_topo_dev1" name="port1" type="text">
|
||||
<input data-form="add" class="nd_topo_port nd_topo_dev1" name="port1" type="text" value="[% params.port1 | html_entity %]">
|
||||
<span class="add-on nd_topo_port_caret"><i class="icon-caret-down icon-large"></i></span>
|
||||
</div>
|
||||
</td>
|
||||
|
||||
@@ -1,187 +1,287 @@
|
||||
<div id="netmap_pane_tooltip" class="net_gobrechts_d3_force_tooltip" style="top: 0px; left: 0px;"></div>
|
||||
<script>
|
||||
|
||||
var winHeight = window.innerHeight;
|
||||
var winWidth = window.innerWidth;
|
||||
// ***********************************************
|
||||
// ************ retrieve network map *************
|
||||
// ***********************************************
|
||||
|
||||
// links in the initial tree drawing use this generator
|
||||
var treeLink = d3.svg.diagonal.radial()
|
||||
.projection(function(d) { return [d.y, d.x / 180 * Math.PI]; });
|
||||
$.getJSON('[% uri_for('/ajax/data/device/netmap') %]?[% my_query %]', function(mapdata) {
|
||||
|
||||
// actual device neighbor links use this generator
|
||||
var neighLink = d3.svg.diagonal.radial();
|
||||
jQuery(document).ready(function() {
|
||||
window.graph = netGobrechtsD3Force('netmap_pane')
|
||||
// .debug(true)
|
||||
.width( parseInt(jQuery('#netmap_pane').parent().css('width')) )
|
||||
.height( window.innerHeight - 100 )
|
||||
.showSelfLinks(true)
|
||||
.wrapLabels(true)
|
||||
.lassoMode(true)
|
||||
.dragMode(true)
|
||||
.zoomMode(true)
|
||||
.pinMode(true)
|
||||
[% '.showLegend(false)' IF NOT params.colorgroups %]
|
||||
.showLinkDirection(false)
|
||||
.colorScheme('color20')
|
||||
.preventLabelOverlappingOnForceEnd(
|
||||
(mapdata['newnodes'] && ('[% params.mapshow %]' == 'neighbors'))
|
||||
? true : false
|
||||
)
|
||||
.nodeEventToStopPinMode('none')
|
||||
.showTooltips(true)
|
||||
.tooltipPosition('svgTopLeft')
|
||||
.nodeEventToOpenLink('dblclick')
|
||||
.nodeLinkTarget('none')
|
||||
.minNodeRadius(4)
|
||||
.maxNodeRadius(4 + (mapdata['numsizes'] || 0))
|
||||
.minZoomFactor(0.1)
|
||||
.maxZoomFactor(10)
|
||||
.labelDistance(2)
|
||||
.linkDistance(120)
|
||||
.charge(-550)
|
||||
.gravity(0.3);
|
||||
|
||||
// store x,y for all circles on the map
|
||||
var loc = {};
|
||||
// store actual links between all nodes
|
||||
var neighbors_data = {};
|
||||
graph['nd2'] = {};
|
||||
graph['nd2']['centernode'] = mapdata['centernode'];
|
||||
graph['nd2']['dragging'] = false;
|
||||
|
||||
// main SVG background, with support for pan/zoom
|
||||
var svg = d3.select("#netmap_pane").append("svg")
|
||||
.attr("width", winWidth - 50)
|
||||
.attr("height", winHeight - 100)
|
||||
.attr("pointer-events", "all")
|
||||
.append('g')
|
||||
.call(d3.behavior.zoom().on("zoom", redraw))
|
||||
// ***************************************
|
||||
// *********** fullscreen icon ***********
|
||||
// ***************************************
|
||||
|
||||
graph.inspect().dom.svg
|
||||
.append("g")
|
||||
.attr("transform", "translate(" + winHeight / 2 + "," + winHeight / 2 + ")");
|
||||
|
||||
// this is the image background
|
||||
// XXX there must be a way to discover the radial tree's size?
|
||||
svg.append('rect')
|
||||
.attr("x", (0 - (winHeight * 2)))
|
||||
.attr('width', "400%")
|
||||
.attr("y", (0 - (winHeight * 2)))
|
||||
.attr('height', "400%")
|
||||
.attr('fill', 'white');
|
||||
|
||||
// handle pan and zoom
|
||||
function redraw() {
|
||||
svg.attr("transform",
|
||||
"translate(" + d3.event.translate + ")"
|
||||
+ "scale(" + d3.event.scale + ")"
|
||||
+ "translate(" + (winHeight / 2) + "," + (winHeight / 2) + ")");
|
||||
}
|
||||
|
||||
// save the x,y of an element into the loc dictionary
|
||||
function recordLocation(d,i) {
|
||||
var rect = this.getBoundingClientRect();
|
||||
loc[d.ip] = {
|
||||
'x': (rect.left + ((rect.right - rect.left) / 2))
|
||||
,'y': (rect.top + ((rect.bottom - rect.top) / 2))
|
||||
};
|
||||
}
|
||||
|
||||
// convert a device ip to a valid CSS class name
|
||||
function to_class(ip) { return 'nd_' + ip.replace(/[:.]/g, "_") }
|
||||
|
||||
// handler for clicking on a circle - redirect to that device's netmap
|
||||
function circleClick(d) {
|
||||
window.location = '[% uri_for('/device') %]?tab=netmap'
|
||||
+ '&q=' + d.ip
|
||||
+ '&depth=[% params.depth | uri %]'
|
||||
+ '&vlan=[% params.vlan | uri %]';
|
||||
}
|
||||
|
||||
// handler for mouseover on a circle - show that device's real neighbors
|
||||
function circleOver(d) {
|
||||
$('.link').hide();
|
||||
$('path.' + to_class(d.ip)).show();
|
||||
$(this).css('cursor', 'pointer');
|
||||
|
||||
$.each(neighbors_data[d.ip], function(idx, target) {
|
||||
if (! (target in loc)) { return true }
|
||||
$('circle.' + to_class(target)).css('fill', '#e96cfa');
|
||||
});
|
||||
}
|
||||
|
||||
// handler for mouseout on a circle - hide real neighbours and show treeLinks
|
||||
function circleOut(d) {
|
||||
$.each(neighbors_data[d.ip], function(idx, target) {
|
||||
if (! (target in loc)) { return true }
|
||||
$('circle.' + to_class(target)).css('fill', '#fff');
|
||||
});
|
||||
|
||||
$(this).css('cursor', 'auto');
|
||||
$('path.' + to_class(d.ip)).hide();
|
||||
$('.link').show();
|
||||
}
|
||||
|
||||
// load all device connections into neighbors_data dictionary
|
||||
$.getJSON('[% uri_for('/ajax/data/device/alldevicelinks') %]', function(data) {
|
||||
neighbors_data = data;
|
||||
|
||||
// draw the tree
|
||||
d3.json("[% uri_for('/ajax/data/device/netmap') %]?"
|
||||
+ '&q=[% params.q | uri %]'
|
||||
+ '&depth=[% params.depth | uri %]'
|
||||
+ '&vlan=[% params.vlan | uri %]', function(error, root) {
|
||||
var tree = d3.layout.tree()
|
||||
// magic number "8" for scaling (network depth). seems to make things look right for me.
|
||||
.size([360, (winHeight / 8 * (root['scale'] || 0))])
|
||||
.separation(function(a, b) { return (a.parent == b.parent ? 1 : 2) / a.depth; });
|
||||
|
||||
var nodes = tree.nodes(root),
|
||||
links = tree.links(nodes);
|
||||
|
||||
var link = svg.selectAll(".link")
|
||||
.data(links)
|
||||
.enter().append("path")
|
||||
.attr("id", "nd2_fullscreen-netmap-container")
|
||||
.attr("transform", "translate(" + (graph.width() - 17) + ",17)")
|
||||
.append("svg:text")
|
||||
.attr("id", "nd2_fullscreen-netmap")
|
||||
.attr("class", "link")
|
||||
.attr("d", treeLink);
|
||||
.attr("text-anchor", "start")
|
||||
.attr("font-family", "FontAwesome")
|
||||
.text('\uf065')
|
||||
.on("click", function() {
|
||||
requestFullScreen(document.getElementById('netmap_pane'));
|
||||
});
|
||||
|
||||
var node = svg.selectAll(".node")
|
||||
.data(nodes)
|
||||
.enter().append("g")
|
||||
.attr("class", "node")
|
||||
.attr("transform", function(d) { return "rotate(" + (d.x - 90) + ")translate(" + d.y + ")"; });
|
||||
// **************************************************
|
||||
// *********** force running spinner icon ***********
|
||||
// **************************************************
|
||||
|
||||
// begin to draw...
|
||||
d3.select("#nd_waiting").remove();
|
||||
graph.inspect().dom.svg
|
||||
.append("g")
|
||||
.attr("id", "nd2_netmap-spinner-container")
|
||||
.attr("transform", "translate(" + (graph.width() - 15) + "," + (graph.height() - 15) + ")")
|
||||
.append("path")
|
||||
.attr("id", "nd2_netmap-spinner");
|
||||
|
||||
node.append("circle")
|
||||
.attr("r", 4.5)
|
||||
// circle has class name of its device, so we can show/hide it
|
||||
.attr("class", function(d) { return to_class(d.ip) })
|
||||
// store the x,y of every circle we've just drawn
|
||||
.each(recordLocation)
|
||||
// handlers for mouse interaction with the circles
|
||||
.on("click", circleClick)
|
||||
.on("mouseover", circleOver)
|
||||
.on("mouseout", circleOut);
|
||||
graph.inspect().main.force.on('start.nd2spinner', function() {
|
||||
d3.select("#nd2_netmap-spinner").call(spin);
|
||||
});
|
||||
|
||||
node.append("text")
|
||||
.attr("dy", ".31em")
|
||||
.attr("text-anchor", function(d) { return d.x < 180 ? "start" : "end"; })
|
||||
.attr("transform", function(d) { return d.x < 180 ? "translate(8)" : "rotate(180)translate(-8)"; })
|
||||
.text(function(d) { return d.name; });
|
||||
// *****************************************************
|
||||
// *********** link labels which track links ***********
|
||||
// *****************************************************
|
||||
|
||||
// reorient text on the root node
|
||||
svg.select(".node")
|
||||
.attr("transform", function(d) {
|
||||
return d.x < 180 ? "rotate(0)translate(0)" : "rotate(180)translate(0)"; });
|
||||
graph.inspect().main.force.on('tick.movelinklabel', function() {
|
||||
graph.inspect().dom.svg.selectAll('text.nd_netmap-linklabel')
|
||||
.attr('x', function(d) {
|
||||
var sx = graph.nodeDataById($(this).attr('data-source'));
|
||||
var tx = graph.nodeDataById($(this).attr('data-target'));
|
||||
if (!(sx && tx)) { return 0 }
|
||||
return ((sx.x + tx.x) / 2);
|
||||
})
|
||||
.attr('y', function(d) {
|
||||
var sy = graph.nodeDataById($(this).attr('data-source'));
|
||||
var ty = graph.nodeDataById($(this).attr('data-target'));
|
||||
if (!(sy && ty)) { return 0 }
|
||||
return ((sy.y + ty.y) / 2);
|
||||
});
|
||||
});
|
||||
|
||||
// key (ip) of the root node in our locations store
|
||||
var rootname = svg.select(".node").data()[0].ip;
|
||||
// reformatted neighbors_data for the real neighbor links
|
||||
var neighbors = [];
|
||||
graph.inspect().main.force.on('start.movelinklabel', function() {
|
||||
mapdata['data']['links'].forEach(function(link) {
|
||||
graph.inspect().dom.svg.select('g.graph')
|
||||
.append('svg:text')
|
||||
.attr('class', 'nd_netmap-linklabel')
|
||||
.attr('data-source', link['FROMID'])
|
||||
.attr('data-target', link['TOID'])
|
||||
.attr('text-anchor', 'middle')
|
||||
[% ".attr('fill', 'black')" IF params.showspeed %]
|
||||
.text(link['SPEED']);
|
||||
});
|
||||
|
||||
// need to build neighbors array only after we have built loc dictionary,
|
||||
// after drawing the circles and storing their x,y
|
||||
$.each(neighbors_data, function(key, val) {
|
||||
if (! (key in loc)) { return true }
|
||||
graph.inspect().main.force.on('start.movelinklabel', null);
|
||||
});
|
||||
|
||||
$.each(val, function(idx, ip) {
|
||||
if (! (ip in loc)) { return true }
|
||||
// **********************************************************
|
||||
// ********* node lasso and group-dragging support **********
|
||||
// **********************************************************
|
||||
|
||||
neighbors.push({
|
||||
'source': {
|
||||
'ip': key
|
||||
,'x': loc[key]['x']
|
||||
,'y': loc[key]['y']
|
||||
graph.inspect().main.force.on('start.draggednode', function() {
|
||||
graph.inspect().main.nodes.on('mousedown.dragall', function(n) {
|
||||
if (this.nodeName !== 'circle') { return }
|
||||
graph['nd2']['dragging'] = true;
|
||||
graph['nd2']['dragStartX'] = n.x;
|
||||
graph['nd2']['dragStartY'] = n.y;
|
||||
graph['nd2']['draggedNode'] = n.index;
|
||||
console.log(graph['nd2']);
|
||||
});
|
||||
|
||||
graph.inspect().main.nodes.on('mousemove.dragall', function(draggedNode) {
|
||||
var evt = window.event;
|
||||
if (!("buttons" in evt) || (evt.buttons !== 1)) { return }
|
||||
if (!(graph['nd2']['dragging']) || !(graph['nd2']['draggedNode'])) { return }
|
||||
if (draggedNode.index !== graph['nd2']['draggedNode']) { return }
|
||||
|
||||
var dx = (draggedNode.x - graph['nd2']['dragStartX']),
|
||||
dy = (draggedNode.y - graph['nd2']['dragStartY']);
|
||||
graph['nd2']['dragStartX'] += dx;
|
||||
graph['nd2']['dragStartY'] += dy;
|
||||
|
||||
graph.inspect().main.nodes
|
||||
.filter(function(n) { return (n.selected && (n.index !== draggedNode.index)) })
|
||||
.each(function(n) {
|
||||
n.x += dx; n.y += dy;
|
||||
n.px += dx; n.py += dy;
|
||||
});
|
||||
});
|
||||
|
||||
graph.inspect().main.nodes.on('mouseup.dragall', function(n) {
|
||||
graph['nd2']['dragging'] = false;
|
||||
});
|
||||
|
||||
graph.inspect().main.force.on('start.draggednode', null);
|
||||
});
|
||||
|
||||
// ********************************************************
|
||||
// ********* save new node positions back to DB ***********
|
||||
// ********************************************************
|
||||
|
||||
graph.inspect().main.force.on('end.savepositions', function() {
|
||||
graph.inspect().main.nodes.each(function(n) { n.fixed = true });
|
||||
|
||||
if (mapdata['newnodes'] && ('[% params.mapshow %]' != 'neighbors')) {
|
||||
$.post(
|
||||
'[% uri_for('/ajax/data/device/netmappositions') %]'
|
||||
,$("#nd_vlan-entry, #nd_devgrp-select, input[name='mapshow']").serialize()
|
||||
+ '&positions=' + JSON.stringify(graph.positions())
|
||||
);
|
||||
}
|
||||
,'target': {
|
||||
'ip': ip
|
||||
,'x': loc[ip]['x']
|
||||
,'y': loc[ip]['y']
|
||||
|
||||
graph.inspect().main.force.on('end.savepositions', null);
|
||||
});
|
||||
|
||||
// *****************************
|
||||
// ********* DO IT!! ***********
|
||||
// *****************************
|
||||
|
||||
graph.start(mapdata);
|
||||
|
||||
// about a second after render starts, zoom in a bit
|
||||
if ('[% params.mapshow %]' == 'neighbors') {
|
||||
setTimeout(function() {
|
||||
if ('[% params.dynamicsize %]' == 'on') {
|
||||
graph.zoomToFit();
|
||||
} else {
|
||||
var node = graph.nodeDataById( graph['nd2']['centernode'] );
|
||||
graph.zoomSmooth(node.x, node.y, node.radius * 125);
|
||||
}
|
||||
}, 1500);
|
||||
}
|
||||
}); // document.onReady
|
||||
|
||||
}); // getJSON
|
||||
|
||||
// ***********************************************
|
||||
// ******** force engine status spinner *********
|
||||
// ***********************************************
|
||||
|
||||
var radius = 12;
|
||||
var tau = 2 * Math.PI;
|
||||
|
||||
var arc = d3.svg.arc()
|
||||
.innerRadius(radius * 0.5)
|
||||
.outerRadius(radius * 0.8)
|
||||
.startAngle(0)
|
||||
.endAngle(0.33 * tau);
|
||||
|
||||
var circle = d3.svg.arc()
|
||||
.innerRadius(radius * 0.5)
|
||||
.outerRadius(radius * 0.8)
|
||||
.startAngle(0)
|
||||
.endAngle(tau);
|
||||
|
||||
function spin(selection, duration) {
|
||||
duration = duration || 1500;
|
||||
if (! graph.inspect().status.forceRunning) {
|
||||
d3.select('#nd2_netmap-spinner').style('fill', '#CCFFCC').attr('d', circle);
|
||||
return;
|
||||
}
|
||||
d3.select('#nd2_netmap-spinner').style('fill', '#FFE4B5').attr('d', arc);
|
||||
selection.transition()
|
||||
.ease("linear")
|
||||
.duration(duration)
|
||||
.attrTween("transform", function() {
|
||||
return d3.interpolateString("rotate(0)", "rotate(360)");
|
||||
});
|
||||
setTimeout(function() { spin(selection, duration); }, duration);
|
||||
}
|
||||
|
||||
// ***********************************************
|
||||
// ************ full screen handling *************
|
||||
// ***********************************************
|
||||
|
||||
function isFullScreen() {
|
||||
return (document.webkitFullscreenElement || document.mozFullScreenElement || document.fullscreenElement);
|
||||
}
|
||||
|
||||
function requestFullScreen(elt) {
|
||||
if (isFullScreen()) {
|
||||
if (document.exitFullscreen) {
|
||||
document.exitFullscreen();
|
||||
} else if (document.msExitFullscreen) {
|
||||
document.msExitFullscreen();
|
||||
} else if (document.mozCancelFullScreen) {
|
||||
document.mozCancelFullScreen();
|
||||
} else if (document.webkitExitFullscreen) {
|
||||
document.webkitExitFullscreen();
|
||||
}
|
||||
}
|
||||
else {
|
||||
if (elt.requestFullscreen) {
|
||||
elt.requestFullscreen();
|
||||
} else if (elt.msRequestFullscreen) {
|
||||
elt.msRequestFullscreen();
|
||||
} else if (elt.mozRequestFullScreen) {
|
||||
elt.mozRequestFullScreen();
|
||||
} else if (elt.webkitRequestFullscreen) {
|
||||
elt.webkitRequestFullscreen();
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
$(document).on('webkitfullscreenchange mozfullscreenchange fullscreenchange', function() {
|
||||
resizeGraphContainer();
|
||||
$('#nd2_fullscreen-netmap').text(function() {
|
||||
return (isFullScreen() ? '\uf066' : '\uf065');
|
||||
});
|
||||
});
|
||||
|
||||
// insert Netdisco neighbor links below circles but above tree links
|
||||
svg.selectAll(".neighbor")
|
||||
.data(neighbors)
|
||||
.enter().insert("path", ".node")
|
||||
// add class name of source device, so we can show/hide the link
|
||||
// (also "neighbor" class)
|
||||
.attr("class", function(d) { return ("neighbor " + to_class( d.source.ip )) })
|
||||
.attr("d", neighLink)
|
||||
.attr("transform", "translate(-" + loc[rootname]['x'] + ",-" + loc[rootname]['y'] + ")");
|
||||
});
|
||||
// custom resize function as there is no event to fire and we need
|
||||
// to react to the sidebar.
|
||||
function resizeGraphContainer() {
|
||||
setTimeout(function(){
|
||||
var netmap_pane = jQuery('#netmap_pane');
|
||||
graph.width( parseInt(netmap_pane.parent().css('width')) ).resume();
|
||||
graph.height( window.innerHeight - 100 ).resume();
|
||||
d3.select("#nd2_netmap-spinner-container").attr("transform",
|
||||
"translate(" + (graph.width() - 15) + "," + (graph.height() - 15) + ")");
|
||||
d3.select("#nd2_fullscreen-netmap-container").attr("transform",
|
||||
"translate(" + (graph.width() - 17) + ",17)");
|
||||
}, 500)
|
||||
}
|
||||
|
||||
}); // jquery getJSON for all connections
|
||||
$('#nd_sidebar-toggle-img-in').on("click", resizeGraphContainer);
|
||||
$('#nd_sidebar-toggle-img-out').on("click", resizeGraphContainer);
|
||||
$(window).on("resize", resizeGraphContainer);
|
||||
|
||||
// vim: ft=javascript
|
||||
</script>
|
||||
|
||||
<div id="nd_waiting" class="span2 alert"><i class="icon-spinner icon-spin"></i> Waiting for results...</div>
|
||||
|
||||
@@ -345,6 +345,14 @@
|
||||
[% END %]
|
||||
[% END %]
|
||||
[% END %]
|
||||
[% IF user_can_port_control AND params.c_admin %]
|
||||
<a class="nd_log-icon"
|
||||
href="[% uri_for('/admin/topology') %]?dev1=[% device.ip | uri %]&port1=[% row.port | uri %]">
|
||||
<i class="icon-bolt"
|
||||
rel="tooltip" data-placement="top" data-offset="3"
|
||||
data-animation="" data-title="Manual Topology"></i>
|
||||
[% END %]
|
||||
</a>
|
||||
</td>
|
||||
[% END %]
|
||||
|
||||
|
||||
@@ -23,6 +23,13 @@
|
||||
$('.nd_modal').modal({show: false});
|
||||
$("[rel=tooltip]").tooltip({live: true});
|
||||
$("[rel=popover]").popover({live: true});
|
||||
|
||||
// positions save not available in netmap neighbors view
|
||||
if ($("input[name='mapshow']:checked").val() == 'neighbors') {
|
||||
$('#nd_netmap-save').prop('disabled', true).removeClass('btn-info');
|
||||
} else {
|
||||
$('#nd_netmap-save').prop('disabled', false).addClass('btn-info');
|
||||
}
|
||||
}
|
||||
|
||||
// on load, establish global delegations for now and future
|
||||
@@ -95,6 +102,66 @@
|
||||
}
|
||||
});
|
||||
|
||||
// refresh tooltips when the datatables table is updated
|
||||
$('#ports_pane').on('draw.dt', function() {
|
||||
$("[rel=tooltip]").tooltip({live: true});
|
||||
});
|
||||
|
||||
// netmap show controls
|
||||
$('#nd_showips').change(function() {
|
||||
if ($(this).prop('checked')) {
|
||||
graph.inspect().main.nodes.each(function(n) {
|
||||
if (n['ORIG_LABEL'] != n['ID']) {
|
||||
n['LABEL'] = n['ORIG_LABEL'] + ' ' + n['ID'];
|
||||
}
|
||||
});
|
||||
graph.wrapLabels(true).start();
|
||||
} else {
|
||||
graph.inspect().main.nodes.each(function(n) {
|
||||
n['LABEL'] = n['ORIG_LABEL'];
|
||||
});
|
||||
graph.wrapLabels(false).start();
|
||||
}
|
||||
});
|
||||
$('#nd_showspeed').change(function() {
|
||||
$('.nd_netmap-linklabel').css('fill',
|
||||
($(this).prop('checked') ? 'black' : 'none')
|
||||
);
|
||||
});
|
||||
|
||||
// netmap pin/release controls
|
||||
$('#nd_netmap-releaseall').on('click', function(event) {
|
||||
event.preventDefault();
|
||||
graph.releaseFixedNodes().resume();
|
||||
});
|
||||
$('#nd_netmap-releaseonly').on('click', function(event) {
|
||||
event.preventDefault();
|
||||
graph.inspect().main.nodes
|
||||
.filter(function(n) { return n.selected })
|
||||
.each(function(n) { n.fixed = false });
|
||||
graph.resume();
|
||||
});
|
||||
$('#nd_netmap-pinonly').on('click', function(event) {
|
||||
event.preventDefault();
|
||||
graph.inspect().main.nodes
|
||||
.filter(function(n) { return n.selected })
|
||||
.each(function(n) { n.fixed = true });
|
||||
});
|
||||
$('#nd_netmap-save').on('click', function(event) {
|
||||
event.preventDefault();
|
||||
// if user enters vlan but does not submit this will save wrong data
|
||||
$.post(
|
||||
'[% uri_for('/ajax/data/device/netmappositions') %]'
|
||||
,$("#nd_vlan-entry, #nd_devgrp-select, input[name='mapshow']").serialize()
|
||||
+ '&positions=' + JSON.stringify(graph.positions())
|
||||
);
|
||||
});
|
||||
$('#nd_netmap-zoomtodevice').on('click', function(event) {
|
||||
event.preventDefault();
|
||||
var node = graph.nodeDataById( graph['nd2']['centernode'] );
|
||||
graph.zoomSmooth(node.x, node.y, node.radius * 100);
|
||||
});
|
||||
|
||||
// activity for admin tasks in device details
|
||||
$('#details_pane').on('click', '.nd_adminbutton', function(event) {
|
||||
// stop form from submitting normally
|
||||
|
||||
@@ -18,9 +18,11 @@
|
||||
<!-- <script type="text/javascript" src="[% uri_base %]/javascripts/jquery.cookie.js"></script> -->
|
||||
<script type="text/javascript" src="[% uri_base %]/javascripts/jquery-deserialize.js"></script>
|
||||
<script type="text/javascript" src="[% uri_base %]/javascripts/bootstrap.min.js"></script>
|
||||
<script type="text/javascript" src="[% uri_base %]/javascripts/bootstrap2-toggle.min.js"></script>
|
||||
<script type="text/javascript" src="[% uri_base %]/javascripts/underscore.min.js"></script>
|
||||
<script type="text/javascript" src="[% uri_base %]/javascripts/jquery.qtip.min.js"></script>
|
||||
<script type="text/javascript" src="[% uri_base %]/javascripts/d3.min.js"></script>
|
||||
<script type="text/javascript" src="[% uri_base %]/javascripts/d3-force-network-chart.js"></script>
|
||||
<script type="text/javascript" src="[% uri_base %]/javascripts/toastr.js"></script>
|
||||
<script type="text/javascript" src="[% uri_base %]/javascripts/jquery.floatThead.js"></script>
|
||||
<script type="text/javascript" src="[% uri_base %]/javascripts/daterangepicker.js"></script>
|
||||
@@ -48,10 +50,13 @@
|
||||
[% END %]
|
||||
|
||||
<link rel="stylesheet" href="[% uri_base %]/css/bootstrap.min.css"/>
|
||||
<link rel="stylesheet" href="[% uri_base %]/css/bootstrap2-toggle.min.css"/>
|
||||
<link rel="stylesheet" href="[% uri_base %]/css/awesome-bootstrap-checkbox.css"/>
|
||||
<link rel="stylesheet" href="[% uri_base %]/css/jquery.qtip.min.css"/>
|
||||
<link rel="stylesheet" href="[% uri_base %]/css/smoothness/jquery-ui.custom.min.css"/>
|
||||
<link rel="stylesheet" href="[% uri_base %]/css/font-awesome.min.css"/>
|
||||
<link rel="stylesheet" href="[% uri_base %]/css/toastr.css"/>
|
||||
<link rel="stylesheet" href="[% uri_base %]/css/d3-force-network-chart.css"/>
|
||||
<link rel="stylesheet" href="[% uri_base %]/css/netdisco.css"/>
|
||||
<link rel="stylesheet" href="[% uri_base %]/css/bootstrap-tree.css"/>
|
||||
<link rel="stylesheet" href="[% uri_base %]/css/daterangepicker-bs2.css"/>
|
||||
|
||||
5
share/views/sidebar/admintask/topology.tt
Normal file
5
share/views/sidebar/admintask/topology.tt
Normal file
@@ -0,0 +1,5 @@
|
||||
|
||||
|
||||
<input name="dev1" value="[% params.dev1 | html_entity %]" type="hidden"/>
|
||||
<input name="port1" value="[% params.port1 | html_entity %]" type="hidden"/>
|
||||
<script type="text/javascript">has_sidebar["topology"] = 0;</script>
|
||||
@@ -5,20 +5,125 @@
|
||||
<ul class="muted nd_netmap-sidebar-help">
|
||||
<li>Click and drag to pan</li>
|
||||
<li>Scroll to zoom</li>
|
||||
<li>Hover shows neighbors</li>
|
||||
<li>Click to center device</li>
|
||||
<li><a href="https://github.com/netdisco/netdisco/wiki/NetworkMap" target="_blank">Full Instructions
|
||||
<i class="icon-external-link"></i></a></li>
|
||||
</ul>
|
||||
|
||||
<em class="muted nd_sidebar-label">Draw to Depth:</em><br/>
|
||||
<input id="nd_port-query" placeholder="" type="number"
|
||||
name="depth" value="[% params.depth || 8 | html_entity %]" type="text"
|
||||
rel="tooltip" data-placement="left" data-offset="5" data-title="Max Depth"/>
|
||||
|
||||
<em class="muted nd_sidebar-label">Filter by VLAN:</em><br/>
|
||||
<input id="nd_port-query" placeholder="" type="number"
|
||||
name="vlan" value="[% params.vlan | html_entity %]" type="text"
|
||||
rel="tooltip" data-placement="left" data-offset="5" data-title="VLAN"/>
|
||||
</div>
|
||||
<button id="[% tab.tag %]_submit" type="submit" class="btn btn-info">
|
||||
<i class="icon-pencil icon-large pull-left nd_navbar-icon"></i> Redraw Map</button>
|
||||
|
||||
<div class="clearfix nd_netmap-sidebar">
|
||||
<div class="checkbox pull-left">
|
||||
<label>
|
||||
<input type="checkbox" name="showips" id="nd_showips"
|
||||
[% 'checked="checked"' IF vars.sidebar_defaults.device_netmap.showips %]
|
||||
data-toggle="toggle" data-size="small" data-width="30"
|
||||
data-on="Show" data-off=" " data-onstyle="success">
|
||||
<span onclick="$('#nd_showips').bootstrapToggle('toggle')"> Management IPs</span>
|
||||
</label>
|
||||
</div>
|
||||
<div class="checkbox pull-left">
|
||||
<label>
|
||||
<input type="checkbox" name="showspeed" id="nd_showspeed"
|
||||
[% 'checked="checked"' IF vars.sidebar_defaults.device_netmap.showspeed %]
|
||||
data-toggle="toggle" data-size="small" data-width="30"
|
||||
data-on="Show" data-off=" " data-onstyle="success">
|
||||
<span onclick="$('#nd_showspeed').bootstrapToggle('toggle')"> Link Speed</span>
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<button id="nd_netmap-releaseall" class="btn btn-info">
|
||||
<i class="icon-unlock icon-large pull-left nd_navbar-icon"></i>
|
||||
Release All</button>
|
||||
|
||||
<button id="nd_netmap-releaseonly" class="btn btn-info">
|
||||
<i class="icon-unlock icon-large pull-left nd_navbar-icon"></i>
|
||||
Release Selected</button>
|
||||
|
||||
<button id="nd_netmap-pinonly" class="btn btn-info">
|
||||
<i class="icon-lock icon-large pull-left nd_navbar-icon"></i>
|
||||
Pin Selected</button>
|
||||
|
||||
<button id="nd_netmap-save" class="btn" disabled>
|
||||
<i class="icon-save icon-large pull-left nd_navbar-icon"></i>
|
||||
Save Positions</button>
|
||||
|
||||
<button id="nd_netmap-zoomtodevice" class="btn btn-info">
|
||||
<i class="icon-search icon-large pull-left nd_navbar-icon"></i>
|
||||
Zoom to this Device</button>
|
||||
|
||||
<hr class="nd_sidebar-hr"/>
|
||||
|
||||
<div class="radio radio-success">
|
||||
<input type="radio" name="mapshow" id="nd_mapshow-all"
|
||||
[% 'checked' IF vars.sidebar_defaults.device_netmap.mapshow == 'all' %] value="all">
|
||||
<label for="nd_mapshow-all">All Devices</label>
|
||||
</div>
|
||||
<div class="radio radio-success">
|
||||
<input type="radio" name="mapshow" id="nd_mapshow-neighbors"
|
||||
[% 'checked' IF vars.sidebar_defaults.device_netmap.mapshow == 'neighbors' %] value="neighbors">
|
||||
<label for="nd_mapshow-neighbors">Neighbors Only</label>
|
||||
</div>
|
||||
|
||||
[% IF devgrp_list.size %]
|
||||
<div class="radio radio-success">
|
||||
[% ELSE %]
|
||||
<div class="radio radio-success tooltip-wrapper"
|
||||
rel="tooltip" data-placement="left" data-offset="5" data-title="No Named Groups Defined">
|
||||
[% END %]
|
||||
<input type="radio" name="mapshow" id="nd_mapshow-only"
|
||||
[% 'checked' IF vars.sidebar_defaults.device_netmap.mapshow == 'only' %]
|
||||
[% 'disabled' IF NOT devgrp_list.size %] value="only">
|
||||
<label for="nd_mapshow-only">Host Groups</label>
|
||||
</div>
|
||||
|
||||
[% IF devgrp_list.size %]
|
||||
<div class="clearfix">
|
||||
<select class="nd_side-select" size="[% devgrp_list.size > 5 ? 5 : devgrp_list.size %]"
|
||||
multiple="on" name="devgrp" id="nd_devgrp-select"
|
||||
rel="tooltip" data-placement="left" data-offset="5" data-title="Host Groups"/>
|
||||
[% FOREACH opt IN devgrp_list.pairs %]
|
||||
<option[% ' selected="selected"' IF devgrp_lkp.exists(opt.key) %]
|
||||
value="[% opt.key %]">[% opt.value | html_entity %]</option>
|
||||
[% END %]
|
||||
</select>
|
||||
</div>
|
||||
[% END %]
|
||||
|
||||
<div class="clearfix nd_netmap-sidebar">
|
||||
|
||||
<div id="nd_vlan-label" class="control-group">
|
||||
<div class="controls">
|
||||
<label><span id="nd_vlan-label-text">Carrying VLAN: </span>
|
||||
<input name="vlan" id="nd_vlan-entry" class="input-mini" type="number" placeholder="ID"
|
||||
value="[% params.vlan | html_entity %]" type="text"/>
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
[% IF devgrp_list.size %]
|
||||
<div class="clearfix input-prepend">
|
||||
<label class="add-on">
|
||||
<input type="checkbox" id="colorgroups" name="colorgroups"
|
||||
[% 'checked="checked"' IF vars.sidebar_defaults.device_netmap.colorgroups %]/>
|
||||
</label>
|
||||
<label class="nd_checkboxlabel" for="colorgroups">
|
||||
<span class="nd_searchcheckbox uneditable-input">Color Groups</span>
|
||||
</label>
|
||||
</div>
|
||||
[% END %]
|
||||
|
||||
<div class="clearfix input-prepend">
|
||||
<label class="add-on">
|
||||
<input type="checkbox" id="dynamicsize" name="dynamicsize"
|
||||
[% 'checked="checked"' IF vars.sidebar_defaults.device_netmap.dynamicsize %]/>
|
||||
</label>
|
||||
<label class="nd_checkboxlabel" for="dynamicsize">
|
||||
<span class="nd_searchcheckbox uneditable-input">Dynamic Size</span>
|
||||
</label>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<button id="[% tab.tag %]_submit" type="submit" class="btn btn-info">
|
||||
<i class="icon-pencil icon-large pull-left nd_navbar-icon"></i>
|
||||
Redraw Map</button>
|
||||
|
||||
Reference in New Issue
Block a user