better sidebar look and layout
This commit is contained in:
@@ -11,6 +11,8 @@ __PACKAGE__->add_columns(
|
||||
{ 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 },
|
||||
);
|
||||
@@ -18,6 +20,6 @@ __PACKAGE__->add_columns(
|
||||
__PACKAGE__->set_primary_key("id");
|
||||
|
||||
__PACKAGE__->add_unique_constraint(
|
||||
"netmap_positions_device_groups_key" => ['device_groups']);
|
||||
"netmap_positions_device_groups_vlan_key" => [qw/device_groups vlan/]);
|
||||
|
||||
1;
|
||||
|
||||
@@ -20,6 +20,9 @@ ajax '/ajax/data/device/netmappositions' => require_login sub {
|
||||
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 %clean = ();
|
||||
POSITION: foreach my $pos (@$positions) {
|
||||
next unless ref {} eq ref $pos;
|
||||
@@ -32,13 +35,15 @@ ajax '/ajax/data/device/netmappositions' => require_login sub {
|
||||
|
||||
return unless scalar keys %clean;
|
||||
my $posrow = schema('netdisco')->resultset('NetmapPositions')->find({
|
||||
device_groups => \[ '= ?', [device_groups => [sort (List::MoreUtils::uniq( '__ANY__' )) ]] ]});
|
||||
device_groups => \[ '= ?', [device_groups => [sort (List::MoreUtils::uniq( '__ANY__' )) ]] ],
|
||||
vlan => ($vlan || 0)});
|
||||
if ($posrow) {
|
||||
$posrow->update({ positions => to_json(\%clean) });
|
||||
}
|
||||
else {
|
||||
schema('netdisco')->resultset('NetmapPositions')->create({
|
||||
device_groups => [sort (List::MoreUtils::uniq( '__ANY__' )) ],
|
||||
vlan => ($vlan || 0),
|
||||
positions => to_json(\%clean),
|
||||
});
|
||||
}
|
||||
@@ -99,7 +104,8 @@ ajax '/ajax/data/device/netmap' => require_login sub {
|
||||
# DEVICES (NODES)
|
||||
|
||||
my $posrow = schema('netdisco')->resultset('NetmapPositions')->find({
|
||||
device_groups => \[ '= ?', [device_groups => [sort (List::MoreUtils::uniq( '__ANY__' )) ]] ]});
|
||||
device_groups => \[ '= ?', [device_groups => [sort (List::MoreUtils::uniq( '__ANY__' )) ]] ],
|
||||
vlan => ($vlan || 0)});
|
||||
my $pos_for = from_json( $posrow ? $posrow->positions : '{}' );
|
||||
|
||||
my @devices = schema('netdisco')->resultset('Device')->search({}, {
|
||||
|
||||
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;
|
||||
}
|
||||
510
share/public/css/bootstrap-switch.css
vendored
510
share/public/css/bootstrap-switch.css
vendored
@@ -1,510 +0,0 @@
|
||||
/**
|
||||
* bootstrap-switch - Turn checkboxes and radio buttons into toggle switches.
|
||||
*
|
||||
* @version v3.3.4
|
||||
* @homepage https://bttstrp.github.io/bootstrap-switch
|
||||
* @author Mattia Larentis <mattia@larentis.eu> (http://larentis.eu)
|
||||
* @license Apache-2.0
|
||||
*/
|
||||
|
||||
.clearfix {
|
||||
*zoom: 1;
|
||||
}
|
||||
.clearfix:before,
|
||||
.clearfix:after {
|
||||
display: table;
|
||||
content: "";
|
||||
line-height: 0;
|
||||
}
|
||||
.clearfix:after {
|
||||
clear: both;
|
||||
}
|
||||
.hide-text {
|
||||
font: 0/0 a;
|
||||
color: transparent;
|
||||
text-shadow: none;
|
||||
background-color: transparent;
|
||||
border: 0;
|
||||
}
|
||||
.input-block-level {
|
||||
display: block;
|
||||
width: 100%;
|
||||
min-height: 30px;
|
||||
-webkit-box-sizing: border-box;
|
||||
-moz-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
.bootstrap-switch {
|
||||
display: inline-block;
|
||||
direction: ltr;
|
||||
cursor: pointer;
|
||||
-webkit-border-radius: 5px;
|
||||
-moz-border-radius: 5px;
|
||||
border-radius: 5px;
|
||||
border: 1px solid;
|
||||
border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
|
||||
position: relative;
|
||||
text-align: left;
|
||||
overflow: hidden;
|
||||
line-height: 8px;
|
||||
z-index: 0;
|
||||
-webkit-user-select: none;
|
||||
-moz-user-select: none;
|
||||
-ms-user-select: none;
|
||||
-o-user-select: none;
|
||||
user-select: none;
|
||||
vertical-align: middle;
|
||||
-webkit-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
|
||||
-moz-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
|
||||
-o-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
|
||||
transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
|
||||
}
|
||||
.bootstrap-switch .bootstrap-switch-container {
|
||||
display: inline-block;
|
||||
top: 0;
|
||||
-webkit-border-radius: 4px;
|
||||
-moz-border-radius: 4px;
|
||||
border-radius: 4px;
|
||||
-webkit-transform: translate3d(0, 0, 0);
|
||||
-moz-transform: translate3d(0, 0, 0);
|
||||
-o-transform: translate3d(0, 0, 0);
|
||||
transform: translate3d(0, 0, 0);
|
||||
}
|
||||
.bootstrap-switch .bootstrap-switch-handle-on,
|
||||
.bootstrap-switch .bootstrap-switch-handle-off,
|
||||
.bootstrap-switch .bootstrap-switch-label {
|
||||
-webkit-box-sizing: border-box;
|
||||
-moz-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
cursor: pointer;
|
||||
display: inline-block !important;
|
||||
padding-top: 4px;
|
||||
padding-bottom: 4px;
|
||||
padding-left: 8px;
|
||||
padding-right: 8px;
|
||||
font-size: 14px;
|
||||
line-height: 20px;
|
||||
}
|
||||
.bootstrap-switch .bootstrap-switch-handle-on,
|
||||
.bootstrap-switch .bootstrap-switch-handle-off {
|
||||
text-align: center;
|
||||
z-index: 1;
|
||||
}
|
||||
.bootstrap-switch .bootstrap-switch-handle-on.bootstrap-switch-primary,
|
||||
.bootstrap-switch .bootstrap-switch-handle-off.bootstrap-switch-primary {
|
||||
color: #fff;
|
||||
text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
|
||||
background-color: #005fcc;
|
||||
background-image: -moz-linear-gradient(top, #0044cc, #08c);
|
||||
background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#0044cc), to(#08c));
|
||||
background-image: -webkit-linear-gradient(top, #0044cc, #08c);
|
||||
background-image: -o-linear-gradient(top, #0044cc, #08c);
|
||||
background-image: linear-gradient(to bottom, #0044cc, #08c);
|
||||
background-repeat: repeat-x;
|
||||
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff0044cc', endColorstr='#ff0088cc', GradientType=0);
|
||||
border-color: #08c #08c #005580;
|
||||
border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
|
||||
*background-color: #08c;
|
||||
/* Darken IE7 buttons by default so they stand out more given they won't have borders */
|
||||
filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
|
||||
}
|
||||
.bootstrap-switch .bootstrap-switch-handle-on.bootstrap-switch-primary:hover,
|
||||
.bootstrap-switch .bootstrap-switch-handle-off.bootstrap-switch-primary:hover,
|
||||
.bootstrap-switch .bootstrap-switch-handle-on.bootstrap-switch-primary:focus,
|
||||
.bootstrap-switch .bootstrap-switch-handle-off.bootstrap-switch-primary:focus,
|
||||
.bootstrap-switch .bootstrap-switch-handle-on.bootstrap-switch-primary:active,
|
||||
.bootstrap-switch .bootstrap-switch-handle-off.bootstrap-switch-primary:active,
|
||||
.bootstrap-switch .bootstrap-switch-handle-on.bootstrap-switch-primary.active,
|
||||
.bootstrap-switch .bootstrap-switch-handle-off.bootstrap-switch-primary.active,
|
||||
.bootstrap-switch .bootstrap-switch-handle-on.bootstrap-switch-primary.disabled,
|
||||
.bootstrap-switch .bootstrap-switch-handle-off.bootstrap-switch-primary.disabled,
|
||||
.bootstrap-switch .bootstrap-switch-handle-on.bootstrap-switch-primary[disabled],
|
||||
.bootstrap-switch .bootstrap-switch-handle-off.bootstrap-switch-primary[disabled] {
|
||||
color: #fff;
|
||||
background-color: #08c;
|
||||
*background-color: #0077b3;
|
||||
}
|
||||
.bootstrap-switch .bootstrap-switch-handle-on.bootstrap-switch-primary:active,
|
||||
.bootstrap-switch .bootstrap-switch-handle-off.bootstrap-switch-primary:active,
|
||||
.bootstrap-switch .bootstrap-switch-handle-on.bootstrap-switch-primary.active,
|
||||
.bootstrap-switch .bootstrap-switch-handle-off.bootstrap-switch-primary.active {
|
||||
background-color: #006699 \9;
|
||||
}
|
||||
.bootstrap-switch .bootstrap-switch-handle-on.bootstrap-switch-info,
|
||||
.bootstrap-switch .bootstrap-switch-handle-off.bootstrap-switch-info {
|
||||
color: #fff;
|
||||
text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
|
||||
background-color: #41a7c5;
|
||||
background-image: -moz-linear-gradient(top, #2f96b4, #5bc0de);
|
||||
background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#2f96b4), to(#5bc0de));
|
||||
background-image: -webkit-linear-gradient(top, #2f96b4, #5bc0de);
|
||||
background-image: -o-linear-gradient(top, #2f96b4, #5bc0de);
|
||||
background-image: linear-gradient(to bottom, #2f96b4, #5bc0de);
|
||||
background-repeat: repeat-x;
|
||||
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff2f96b4', endColorstr='#ff5bc0de', GradientType=0);
|
||||
border-color: #5bc0de #5bc0de #28a1c5;
|
||||
border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
|
||||
*background-color: #5bc0de;
|
||||
/* Darken IE7 buttons by default so they stand out more given they won't have borders */
|
||||
filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
|
||||
}
|
||||
.bootstrap-switch .bootstrap-switch-handle-on.bootstrap-switch-info:hover,
|
||||
.bootstrap-switch .bootstrap-switch-handle-off.bootstrap-switch-info:hover,
|
||||
.bootstrap-switch .bootstrap-switch-handle-on.bootstrap-switch-info:focus,
|
||||
.bootstrap-switch .bootstrap-switch-handle-off.bootstrap-switch-info:focus,
|
||||
.bootstrap-switch .bootstrap-switch-handle-on.bootstrap-switch-info:active,
|
||||
.bootstrap-switch .bootstrap-switch-handle-off.bootstrap-switch-info:active,
|
||||
.bootstrap-switch .bootstrap-switch-handle-on.bootstrap-switch-info.active,
|
||||
.bootstrap-switch .bootstrap-switch-handle-off.bootstrap-switch-info.active,
|
||||
.bootstrap-switch .bootstrap-switch-handle-on.bootstrap-switch-info.disabled,
|
||||
.bootstrap-switch .bootstrap-switch-handle-off.bootstrap-switch-info.disabled,
|
||||
.bootstrap-switch .bootstrap-switch-handle-on.bootstrap-switch-info[disabled],
|
||||
.bootstrap-switch .bootstrap-switch-handle-off.bootstrap-switch-info[disabled] {
|
||||
color: #fff;
|
||||
background-color: #5bc0de;
|
||||
*background-color: #46b8da;
|
||||
}
|
||||
.bootstrap-switch .bootstrap-switch-handle-on.bootstrap-switch-info:active,
|
||||
.bootstrap-switch .bootstrap-switch-handle-off.bootstrap-switch-info:active,
|
||||
.bootstrap-switch .bootstrap-switch-handle-on.bootstrap-switch-info.active,
|
||||
.bootstrap-switch .bootstrap-switch-handle-off.bootstrap-switch-info.active {
|
||||
background-color: #31b0d5 \9;
|
||||
}
|
||||
.bootstrap-switch .bootstrap-switch-handle-on.bootstrap-switch-success,
|
||||
.bootstrap-switch .bootstrap-switch-handle-off.bootstrap-switch-success {
|
||||
color: #fff;
|
||||
text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
|
||||
background-color: #58b058;
|
||||
background-image: -moz-linear-gradient(top, #51a351, #62c462);
|
||||
background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#51a351), to(#62c462));
|
||||
background-image: -webkit-linear-gradient(top, #51a351, #62c462);
|
||||
background-image: -o-linear-gradient(top, #51a351, #62c462);
|
||||
background-image: linear-gradient(to bottom, #51a351, #62c462);
|
||||
background-repeat: repeat-x;
|
||||
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff51a351', endColorstr='#ff62c462', GradientType=0);
|
||||
border-color: #62c462 #62c462 #3b9e3b;
|
||||
border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
|
||||
*background-color: #62c462;
|
||||
/* Darken IE7 buttons by default so they stand out more given they won't have borders */
|
||||
filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
|
||||
}
|
||||
.bootstrap-switch .bootstrap-switch-handle-on.bootstrap-switch-success:hover,
|
||||
.bootstrap-switch .bootstrap-switch-handle-off.bootstrap-switch-success:hover,
|
||||
.bootstrap-switch .bootstrap-switch-handle-on.bootstrap-switch-success:focus,
|
||||
.bootstrap-switch .bootstrap-switch-handle-off.bootstrap-switch-success:focus,
|
||||
.bootstrap-switch .bootstrap-switch-handle-on.bootstrap-switch-success:active,
|
||||
.bootstrap-switch .bootstrap-switch-handle-off.bootstrap-switch-success:active,
|
||||
.bootstrap-switch .bootstrap-switch-handle-on.bootstrap-switch-success.active,
|
||||
.bootstrap-switch .bootstrap-switch-handle-off.bootstrap-switch-success.active,
|
||||
.bootstrap-switch .bootstrap-switch-handle-on.bootstrap-switch-success.disabled,
|
||||
.bootstrap-switch .bootstrap-switch-handle-off.bootstrap-switch-success.disabled,
|
||||
.bootstrap-switch .bootstrap-switch-handle-on.bootstrap-switch-success[disabled],
|
||||
.bootstrap-switch .bootstrap-switch-handle-off.bootstrap-switch-success[disabled] {
|
||||
color: #fff;
|
||||
background-color: #62c462;
|
||||
*background-color: #4fbd4f;
|
||||
}
|
||||
.bootstrap-switch .bootstrap-switch-handle-on.bootstrap-switch-success:active,
|
||||
.bootstrap-switch .bootstrap-switch-handle-off.bootstrap-switch-success:active,
|
||||
.bootstrap-switch .bootstrap-switch-handle-on.bootstrap-switch-success.active,
|
||||
.bootstrap-switch .bootstrap-switch-handle-off.bootstrap-switch-success.active {
|
||||
background-color: #42b142 \9;
|
||||
}
|
||||
.bootstrap-switch .bootstrap-switch-handle-on.bootstrap-switch-warning,
|
||||
.bootstrap-switch .bootstrap-switch-handle-off.bootstrap-switch-warning {
|
||||
color: #fff;
|
||||
text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
|
||||
background-color: #f9a123;
|
||||
background-image: -moz-linear-gradient(top, #f89406, #fbb450);
|
||||
background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#f89406), to(#fbb450));
|
||||
background-image: -webkit-linear-gradient(top, #f89406, #fbb450);
|
||||
background-image: -o-linear-gradient(top, #f89406, #fbb450);
|
||||
background-image: linear-gradient(to bottom, #f89406, #fbb450);
|
||||
background-repeat: repeat-x;
|
||||
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fff89406', endColorstr='#fffbb450', GradientType=0);
|
||||
border-color: #fbb450 #fbb450 #f89406;
|
||||
border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
|
||||
*background-color: #fbb450;
|
||||
/* Darken IE7 buttons by default so they stand out more given they won't have borders */
|
||||
filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
|
||||
}
|
||||
.bootstrap-switch .bootstrap-switch-handle-on.bootstrap-switch-warning:hover,
|
||||
.bootstrap-switch .bootstrap-switch-handle-off.bootstrap-switch-warning:hover,
|
||||
.bootstrap-switch .bootstrap-switch-handle-on.bootstrap-switch-warning:focus,
|
||||
.bootstrap-switch .bootstrap-switch-handle-off.bootstrap-switch-warning:focus,
|
||||
.bootstrap-switch .bootstrap-switch-handle-on.bootstrap-switch-warning:active,
|
||||
.bootstrap-switch .bootstrap-switch-handle-off.bootstrap-switch-warning:active,
|
||||
.bootstrap-switch .bootstrap-switch-handle-on.bootstrap-switch-warning.active,
|
||||
.bootstrap-switch .bootstrap-switch-handle-off.bootstrap-switch-warning.active,
|
||||
.bootstrap-switch .bootstrap-switch-handle-on.bootstrap-switch-warning.disabled,
|
||||
.bootstrap-switch .bootstrap-switch-handle-off.bootstrap-switch-warning.disabled,
|
||||
.bootstrap-switch .bootstrap-switch-handle-on.bootstrap-switch-warning[disabled],
|
||||
.bootstrap-switch .bootstrap-switch-handle-off.bootstrap-switch-warning[disabled] {
|
||||
color: #fff;
|
||||
background-color: #fbb450;
|
||||
*background-color: #faa937;
|
||||
}
|
||||
.bootstrap-switch .bootstrap-switch-handle-on.bootstrap-switch-warning:active,
|
||||
.bootstrap-switch .bootstrap-switch-handle-off.bootstrap-switch-warning:active,
|
||||
.bootstrap-switch .bootstrap-switch-handle-on.bootstrap-switch-warning.active,
|
||||
.bootstrap-switch .bootstrap-switch-handle-off.bootstrap-switch-warning.active {
|
||||
background-color: #fa9f1e \9;
|
||||
}
|
||||
.bootstrap-switch .bootstrap-switch-handle-on.bootstrap-switch-danger,
|
||||
.bootstrap-switch .bootstrap-switch-handle-off.bootstrap-switch-danger {
|
||||
color: #fff;
|
||||
text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
|
||||
background-color: #d14641;
|
||||
background-image: -moz-linear-gradient(top, #bd362f, #ee5f5b);
|
||||
background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#bd362f), to(#ee5f5b));
|
||||
background-image: -webkit-linear-gradient(top, #bd362f, #ee5f5b);
|
||||
background-image: -o-linear-gradient(top, #bd362f, #ee5f5b);
|
||||
background-image: linear-gradient(to bottom, #bd362f, #ee5f5b);
|
||||
background-repeat: repeat-x;
|
||||
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffbd362f', endColorstr='#ffee5f5b', GradientType=0);
|
||||
border-color: #ee5f5b #ee5f5b #e51d18;
|
||||
border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
|
||||
*background-color: #ee5f5b;
|
||||
/* Darken IE7 buttons by default so they stand out more given they won't have borders */
|
||||
filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
|
||||
}
|
||||
.bootstrap-switch .bootstrap-switch-handle-on.bootstrap-switch-danger:hover,
|
||||
.bootstrap-switch .bootstrap-switch-handle-off.bootstrap-switch-danger:hover,
|
||||
.bootstrap-switch .bootstrap-switch-handle-on.bootstrap-switch-danger:focus,
|
||||
.bootstrap-switch .bootstrap-switch-handle-off.bootstrap-switch-danger:focus,
|
||||
.bootstrap-switch .bootstrap-switch-handle-on.bootstrap-switch-danger:active,
|
||||
.bootstrap-switch .bootstrap-switch-handle-off.bootstrap-switch-danger:active,
|
||||
.bootstrap-switch .bootstrap-switch-handle-on.bootstrap-switch-danger.active,
|
||||
.bootstrap-switch .bootstrap-switch-handle-off.bootstrap-switch-danger.active,
|
||||
.bootstrap-switch .bootstrap-switch-handle-on.bootstrap-switch-danger.disabled,
|
||||
.bootstrap-switch .bootstrap-switch-handle-off.bootstrap-switch-danger.disabled,
|
||||
.bootstrap-switch .bootstrap-switch-handle-on.bootstrap-switch-danger[disabled],
|
||||
.bootstrap-switch .bootstrap-switch-handle-off.bootstrap-switch-danger[disabled] {
|
||||
color: #fff;
|
||||
background-color: #ee5f5b;
|
||||
*background-color: #ec4844;
|
||||
}
|
||||
.bootstrap-switch .bootstrap-switch-handle-on.bootstrap-switch-danger:active,
|
||||
.bootstrap-switch .bootstrap-switch-handle-off.bootstrap-switch-danger:active,
|
||||
.bootstrap-switch .bootstrap-switch-handle-on.bootstrap-switch-danger.active,
|
||||
.bootstrap-switch .bootstrap-switch-handle-off.bootstrap-switch-danger.active {
|
||||
background-color: #e9322d \9;
|
||||
}
|
||||
.bootstrap-switch .bootstrap-switch-handle-on.bootstrap-switch-default,
|
||||
.bootstrap-switch .bootstrap-switch-handle-off.bootstrap-switch-default {
|
||||
color: #333;
|
||||
text-shadow: 0 1px 1px rgba(255, 255, 255, 0.75);
|
||||
background-color: #f0f0f0;
|
||||
background-image: -moz-linear-gradient(top, #e6e6e6, #fff);
|
||||
background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#e6e6e6), to(#fff));
|
||||
background-image: -webkit-linear-gradient(top, #e6e6e6, #fff);
|
||||
background-image: -o-linear-gradient(top, #e6e6e6, #fff);
|
||||
background-image: linear-gradient(to bottom, #e6e6e6, #fff);
|
||||
background-repeat: repeat-x;
|
||||
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffe6e6e6', endColorstr='#ffffffff', GradientType=0);
|
||||
border-color: #fff #fff #d9d9d9;
|
||||
border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
|
||||
*background-color: #fff;
|
||||
/* Darken IE7 buttons by default so they stand out more given they won't have borders */
|
||||
filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
|
||||
}
|
||||
.bootstrap-switch .bootstrap-switch-handle-on.bootstrap-switch-default:hover,
|
||||
.bootstrap-switch .bootstrap-switch-handle-off.bootstrap-switch-default:hover,
|
||||
.bootstrap-switch .bootstrap-switch-handle-on.bootstrap-switch-default:focus,
|
||||
.bootstrap-switch .bootstrap-switch-handle-off.bootstrap-switch-default:focus,
|
||||
.bootstrap-switch .bootstrap-switch-handle-on.bootstrap-switch-default:active,
|
||||
.bootstrap-switch .bootstrap-switch-handle-off.bootstrap-switch-default:active,
|
||||
.bootstrap-switch .bootstrap-switch-handle-on.bootstrap-switch-default.active,
|
||||
.bootstrap-switch .bootstrap-switch-handle-off.bootstrap-switch-default.active,
|
||||
.bootstrap-switch .bootstrap-switch-handle-on.bootstrap-switch-default.disabled,
|
||||
.bootstrap-switch .bootstrap-switch-handle-off.bootstrap-switch-default.disabled,
|
||||
.bootstrap-switch .bootstrap-switch-handle-on.bootstrap-switch-default[disabled],
|
||||
.bootstrap-switch .bootstrap-switch-handle-off.bootstrap-switch-default[disabled] {
|
||||
color: #333;
|
||||
background-color: #fff;
|
||||
*background-color: #f2f2f2;
|
||||
}
|
||||
.bootstrap-switch .bootstrap-switch-handle-on.bootstrap-switch-default:active,
|
||||
.bootstrap-switch .bootstrap-switch-handle-off.bootstrap-switch-default:active,
|
||||
.bootstrap-switch .bootstrap-switch-handle-on.bootstrap-switch-default.active,
|
||||
.bootstrap-switch .bootstrap-switch-handle-off.bootstrap-switch-default.active {
|
||||
background-color: #e6e6e6 \9;
|
||||
}
|
||||
.bootstrap-switch .bootstrap-switch-label {
|
||||
text-align: center;
|
||||
margin-top: -1px;
|
||||
margin-bottom: -1px;
|
||||
z-index: 100;
|
||||
border-left: 1px solid #ccc;
|
||||
border-right: 1px solid #ccc;
|
||||
color: #333;
|
||||
text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
|
||||
background-color: #f5f5f5;
|
||||
background-image: -moz-linear-gradient(top, #fff, #e6e6e6);
|
||||
background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#fff), to(#e6e6e6));
|
||||
background-image: -webkit-linear-gradient(top, #fff, #e6e6e6);
|
||||
background-image: -o-linear-gradient(top, #fff, #e6e6e6);
|
||||
background-image: linear-gradient(to bottom, #fff, #e6e6e6);
|
||||
background-repeat: repeat-x;
|
||||
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffffff', endColorstr='#ffe6e6e6', GradientType=0);
|
||||
border-color: #e6e6e6 #e6e6e6 #bfbfbf;
|
||||
border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
|
||||
*background-color: #e6e6e6;
|
||||
/* Darken IE7 buttons by default so they stand out more given they won't have borders */
|
||||
filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
|
||||
}
|
||||
.bootstrap-switch .bootstrap-switch-label:hover,
|
||||
.bootstrap-switch .bootstrap-switch-label:focus,
|
||||
.bootstrap-switch .bootstrap-switch-label:active,
|
||||
.bootstrap-switch .bootstrap-switch-label.active,
|
||||
.bootstrap-switch .bootstrap-switch-label.disabled,
|
||||
.bootstrap-switch .bootstrap-switch-label[disabled] {
|
||||
color: #333;
|
||||
background-color: #e6e6e6;
|
||||
*background-color: #d9d9d9;
|
||||
}
|
||||
.bootstrap-switch .bootstrap-switch-label:active,
|
||||
.bootstrap-switch .bootstrap-switch-label.active {
|
||||
background-color: #cccccc \9;
|
||||
}
|
||||
.bootstrap-switch span::before {
|
||||
content: "\200b";
|
||||
}
|
||||
.bootstrap-switch .bootstrap-switch-handle-on {
|
||||
-webkit-border-top-left-radius: 4px;
|
||||
-moz-border-radius-topleft: 4px;
|
||||
border-top-left-radius: 4px;
|
||||
-webkit-border-bottom-left-radius: 4px;
|
||||
-moz-border-radius-bottomleft: 4px;
|
||||
border-bottom-left-radius: 4px;
|
||||
}
|
||||
.bootstrap-switch .bootstrap-switch-handle-off {
|
||||
-webkit-border-top-right-radius: 4px;
|
||||
-moz-border-radius-topright: 4px;
|
||||
border-top-right-radius: 4px;
|
||||
-webkit-border-bottom-right-radius: 4px;
|
||||
-moz-border-radius-bottomright: 4px;
|
||||
border-bottom-right-radius: 4px;
|
||||
}
|
||||
.bootstrap-switch input[type='radio'],
|
||||
.bootstrap-switch input[type='checkbox'] {
|
||||
position: absolute !important;
|
||||
top: 0;
|
||||
left: 0;
|
||||
opacity: 0;
|
||||
filter: alpha(opacity=0);
|
||||
z-index: -1;
|
||||
visibility: hidden;
|
||||
}
|
||||
.bootstrap-switch input[type='radio'].form-control,
|
||||
.bootstrap-switch input[type='checkbox'].form-control {
|
||||
height: auto;
|
||||
}
|
||||
.bootstrap-switch.bootstrap-switch-mini {
|
||||
min-width: 71px;
|
||||
}
|
||||
.bootstrap-switch.bootstrap-switch-mini .bootstrap-switch-handle-on,
|
||||
.bootstrap-switch.bootstrap-switch-mini .bootstrap-switch-handle-off,
|
||||
.bootstrap-switch.bootstrap-switch-mini .bootstrap-switch-label {
|
||||
padding: 3px 6px;
|
||||
font-size: 10px;
|
||||
line-height: 9px;
|
||||
}
|
||||
.bootstrap-switch.bootstrap-switch-small {
|
||||
min-width: 79px;
|
||||
}
|
||||
.bootstrap-switch.bootstrap-switch-small .bootstrap-switch-handle-on,
|
||||
.bootstrap-switch.bootstrap-switch-small .bootstrap-switch-handle-off,
|
||||
.bootstrap-switch.bootstrap-switch-small .bootstrap-switch-label {
|
||||
padding: 3px 6px;
|
||||
font-size: 12px;
|
||||
line-height: 18px;
|
||||
}
|
||||
.bootstrap-switch.bootstrap-switch-large {
|
||||
min-width: 120px;
|
||||
}
|
||||
.bootstrap-switch.bootstrap-switch-large .bootstrap-switch-handle-on,
|
||||
.bootstrap-switch.bootstrap-switch-large .bootstrap-switch-handle-off,
|
||||
.bootstrap-switch.bootstrap-switch-large .bootstrap-switch-label {
|
||||
padding: 9px 12px;
|
||||
font-size: 16px;
|
||||
line-height: normal;
|
||||
}
|
||||
.bootstrap-switch.bootstrap-switch-disabled,
|
||||
.bootstrap-switch.bootstrap-switch-readonly,
|
||||
.bootstrap-switch.bootstrap-switch-indeterminate {
|
||||
cursor: default !important;
|
||||
}
|
||||
.bootstrap-switch.bootstrap-switch-disabled .bootstrap-switch-handle-on,
|
||||
.bootstrap-switch.bootstrap-switch-readonly .bootstrap-switch-handle-on,
|
||||
.bootstrap-switch.bootstrap-switch-indeterminate .bootstrap-switch-handle-on,
|
||||
.bootstrap-switch.bootstrap-switch-disabled .bootstrap-switch-handle-off,
|
||||
.bootstrap-switch.bootstrap-switch-readonly .bootstrap-switch-handle-off,
|
||||
.bootstrap-switch.bootstrap-switch-indeterminate .bootstrap-switch-handle-off,
|
||||
.bootstrap-switch.bootstrap-switch-disabled .bootstrap-switch-label,
|
||||
.bootstrap-switch.bootstrap-switch-readonly .bootstrap-switch-label,
|
||||
.bootstrap-switch.bootstrap-switch-indeterminate .bootstrap-switch-label {
|
||||
opacity: 0.5;
|
||||
filter: alpha(opacity=50);
|
||||
cursor: default !important;
|
||||
}
|
||||
.bootstrap-switch.bootstrap-switch-animate .bootstrap-switch-container {
|
||||
-webkit-transition: margin-left 0.5s;
|
||||
-moz-transition: margin-left 0.5s;
|
||||
-o-transition: margin-left 0.5s;
|
||||
transition: margin-left 0.5s;
|
||||
}
|
||||
.bootstrap-switch.bootstrap-switch-inverse .bootstrap-switch-handle-on {
|
||||
-webkit-border-top-left-radius: 0;
|
||||
-moz-border-radius-topleft: 0;
|
||||
border-top-left-radius: 0;
|
||||
-webkit-border-bottom-left-radius: 0;
|
||||
-moz-border-radius-bottomleft: 0;
|
||||
border-bottom-left-radius: 0;
|
||||
-webkit-border-top-right-radius: 4px;
|
||||
-moz-border-radius-topright: 4px;
|
||||
border-top-right-radius: 4px;
|
||||
-webkit-border-bottom-right-radius: 4px;
|
||||
-moz-border-radius-bottomright: 4px;
|
||||
border-bottom-right-radius: 4px;
|
||||
}
|
||||
.bootstrap-switch.bootstrap-switch-inverse .bootstrap-switch-handle-off {
|
||||
-webkit-border-top-right-radius: 0;
|
||||
-moz-border-radius-topright: 0;
|
||||
border-top-right-radius: 0;
|
||||
-webkit-border-bottom-right-radius: 0;
|
||||
-moz-border-radius-bottomright: 0;
|
||||
border-bottom-right-radius: 0;
|
||||
-webkit-border-top-left-radius: 4px;
|
||||
-moz-border-radius-topleft: 4px;
|
||||
border-top-left-radius: 4px;
|
||||
-webkit-border-bottom-left-radius: 4px;
|
||||
-moz-border-radius-bottomleft: 4px;
|
||||
border-bottom-left-radius: 4px;
|
||||
}
|
||||
.bootstrap-switch.bootstrap-switch-focused {
|
||||
border-color: rgba(82, 168, 236, 0.8);
|
||||
outline: 0;
|
||||
outline: thin dotted \9;
|
||||
-webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(82, 168, 236, .6);
|
||||
-moz-box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(82, 168, 236, .6);
|
||||
box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(82, 168, 236, .6);
|
||||
}
|
||||
.bootstrap-switch.bootstrap-switch-on .bootstrap-switch-label,
|
||||
.bootstrap-switch.bootstrap-switch-inverse.bootstrap-switch-off .bootstrap-switch-label {
|
||||
-webkit-border-top-right-radius: 4px;
|
||||
-moz-border-radius-topright: 4px;
|
||||
border-top-right-radius: 4px;
|
||||
-webkit-border-bottom-right-radius: 4px;
|
||||
-moz-border-radius-bottomright: 4px;
|
||||
border-bottom-right-radius: 4px;
|
||||
}
|
||||
.bootstrap-switch.bootstrap-switch-off .bootstrap-switch-label,
|
||||
.bootstrap-switch.bootstrap-switch-inverse.bootstrap-switch-on .bootstrap-switch-label {
|
||||
-webkit-border-top-left-radius: 4px;
|
||||
-moz-border-radius-topleft: 4px;
|
||||
border-top-left-radius: 4px;
|
||||
-webkit-border-bottom-left-radius: 4px;
|
||||
-moz-border-radius-bottomleft: 4px;
|
||||
border-bottom-left-radius: 4px;
|
||||
}
|
||||
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}
|
||||
|
||||
@@ -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;
|
||||
@@ -437,9 +445,16 @@ td > form.nd_inline-form {
|
||||
margin-left: 7px;
|
||||
}
|
||||
|
||||
/* bootstrap switch toggles */
|
||||
.bootstrap-switch {
|
||||
margin-left: -4px;
|
||||
/* 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: 57px;
|
||||
}
|
||||
|
||||
/* fixup for prepended checkbox in sidebar */
|
||||
@@ -623,6 +638,10 @@ form .clearfix.success input {
|
||||
margin-left: -9px;
|
||||
}
|
||||
|
||||
.nd_netmap-sidebar > .input-prepend {
|
||||
margin-left: 5px;
|
||||
}
|
||||
|
||||
.nd_netmap-sidebar-help {
|
||||
margin-left: 32px;
|
||||
}
|
||||
|
||||
784
share/public/javascripts/bootstrap-switch.js
vendored
784
share/public/javascripts/bootstrap-switch.js
vendored
@@ -1,784 +0,0 @@
|
||||
/**
|
||||
* bootstrap-switch - Turn checkboxes and radio buttons into toggle switches.
|
||||
*
|
||||
* @version v3.3.4
|
||||
* @homepage https://bttstrp.github.io/bootstrap-switch
|
||||
* @author Mattia Larentis <mattia@larentis.eu> (http://larentis.eu)
|
||||
* @license Apache-2.0
|
||||
*/
|
||||
|
||||
(function (global, factory) {
|
||||
if (typeof define === "function" && define.amd) {
|
||||
define(['jquery'], factory);
|
||||
} else if (typeof exports !== "undefined") {
|
||||
factory(require('jquery'));
|
||||
} else {
|
||||
var mod = {
|
||||
exports: {}
|
||||
};
|
||||
factory(global.jquery);
|
||||
global.bootstrapSwitch = mod.exports;
|
||||
}
|
||||
})(this, function (_jquery) {
|
||||
'use strict';
|
||||
|
||||
var _jquery2 = _interopRequireDefault(_jquery);
|
||||
|
||||
function _interopRequireDefault(obj) {
|
||||
return obj && obj.__esModule ? obj : {
|
||||
default: obj
|
||||
};
|
||||
}
|
||||
|
||||
var _extends = Object.assign || function (target) {
|
||||
for (var i = 1; i < arguments.length; i++) {
|
||||
var source = arguments[i];
|
||||
|
||||
for (var key in source) {
|
||||
if (Object.prototype.hasOwnProperty.call(source, key)) {
|
||||
target[key] = source[key];
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
return target;
|
||||
};
|
||||
|
||||
function _classCallCheck(instance, Constructor) {
|
||||
if (!(instance instanceof Constructor)) {
|
||||
throw new TypeError("Cannot call a class as a function");
|
||||
}
|
||||
}
|
||||
|
||||
var _createClass = function () {
|
||||
function defineProperties(target, props) {
|
||||
for (var i = 0; i < props.length; i++) {
|
||||
var descriptor = props[i];
|
||||
descriptor.enumerable = descriptor.enumerable || false;
|
||||
descriptor.configurable = true;
|
||||
if ("value" in descriptor) descriptor.writable = true;
|
||||
Object.defineProperty(target, descriptor.key, descriptor);
|
||||
}
|
||||
}
|
||||
|
||||
return function (Constructor, protoProps, staticProps) {
|
||||
if (protoProps) defineProperties(Constructor.prototype, protoProps);
|
||||
if (staticProps) defineProperties(Constructor, staticProps);
|
||||
return Constructor;
|
||||
};
|
||||
}();
|
||||
|
||||
var $ = _jquery2.default || window.jQuery || window.$;
|
||||
|
||||
var BootstrapSwitch = function () {
|
||||
function BootstrapSwitch(element) {
|
||||
var _this = this;
|
||||
|
||||
var options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
|
||||
|
||||
_classCallCheck(this, BootstrapSwitch);
|
||||
|
||||
this.$element = $(element);
|
||||
this.options = $.extend({}, $.fn.bootstrapSwitch.defaults, this._getElementOptions(), options);
|
||||
this.prevOptions = {};
|
||||
this.$wrapper = $('<div>', {
|
||||
class: function _class() {
|
||||
var classes = [];
|
||||
classes.push(_this.options.state ? 'on' : 'off');
|
||||
if (_this.options.size) {
|
||||
classes.push(_this.options.size);
|
||||
}
|
||||
if (_this.options.disabled) {
|
||||
classes.push('disabled');
|
||||
}
|
||||
if (_this.options.readonly) {
|
||||
classes.push('readonly');
|
||||
}
|
||||
if (_this.options.indeterminate) {
|
||||
classes.push('indeterminate');
|
||||
}
|
||||
if (_this.options.inverse) {
|
||||
classes.push('inverse');
|
||||
}
|
||||
if (_this.$element.attr('id')) {
|
||||
classes.push('id-' + _this.$element.attr('id'));
|
||||
}
|
||||
return classes.map(_this._getClass.bind(_this)).concat([_this.options.baseClass], _this._getClasses(_this.options.wrapperClass)).join(' ');
|
||||
}
|
||||
});
|
||||
this.$container = $('<div>', { class: this._getClass('container') });
|
||||
this.$on = $('<span>', {
|
||||
html: this.options.onText,
|
||||
class: this._getClass('handle-on') + ' ' + this._getClass(this.options.onColor)
|
||||
});
|
||||
this.$off = $('<span>', {
|
||||
html: this.options.offText,
|
||||
class: this._getClass('handle-off') + ' ' + this._getClass(this.options.offColor)
|
||||
});
|
||||
this.$label = $('<span>', {
|
||||
html: this.options.labelText,
|
||||
class: this._getClass('label')
|
||||
});
|
||||
|
||||
this.$element.on('init.bootstrapSwitch', this.options.onInit.bind(this, element));
|
||||
this.$element.on('switchChange.bootstrapSwitch', function () {
|
||||
for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
|
||||
args[_key] = arguments[_key];
|
||||
}
|
||||
|
||||
if (_this.options.onSwitchChange.apply(element, args) === false) {
|
||||
if (_this.$element.is(':radio')) {
|
||||
$('[name="' + _this.$element.attr('name') + '"]').trigger('previousState.bootstrapSwitch', true);
|
||||
} else {
|
||||
_this.$element.trigger('previousState.bootstrapSwitch', true);
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
this.$container = this.$element.wrap(this.$container).parent();
|
||||
this.$wrapper = this.$container.wrap(this.$wrapper).parent();
|
||||
this.$element.before(this.options.inverse ? this.$off : this.$on).before(this.$label).before(this.options.inverse ? this.$on : this.$off);
|
||||
|
||||
if (this.options.indeterminate) {
|
||||
this.$element.prop('indeterminate', true);
|
||||
}
|
||||
|
||||
this._init();
|
||||
this._elementHandlers();
|
||||
this._handleHandlers();
|
||||
this._labelHandlers();
|
||||
this._formHandler();
|
||||
this._externalLabelHandler();
|
||||
this.$element.trigger('init.bootstrapSwitch', this.options.state);
|
||||
}
|
||||
|
||||
_createClass(BootstrapSwitch, [{
|
||||
key: 'setPrevOptions',
|
||||
value: function setPrevOptions() {
|
||||
this.prevOptions = _extends({}, this.options);
|
||||
}
|
||||
}, {
|
||||
key: 'state',
|
||||
value: function state(value, skip) {
|
||||
if (typeof value === 'undefined') {
|
||||
return this.options.state;
|
||||
}
|
||||
if (this.options.disabled || this.options.readonly || this.options.state && !this.options.radioAllOff && this.$element.is(':radio')) {
|
||||
return this.$element;
|
||||
}
|
||||
if (this.$element.is(':radio')) {
|
||||
$('[name="' + this.$element.attr('name') + '"]').trigger('setPreviousOptions.bootstrapSwitch');
|
||||
} else {
|
||||
this.$element.trigger('setPreviousOptions.bootstrapSwitch');
|
||||
}
|
||||
if (this.options.indeterminate) {
|
||||
this.indeterminate(false);
|
||||
}
|
||||
this.$element.prop('checked', Boolean(value)).trigger('change.bootstrapSwitch', skip);
|
||||
return this.$element;
|
||||
}
|
||||
}, {
|
||||
key: 'toggleState',
|
||||
value: function toggleState(skip) {
|
||||
if (this.options.disabled || this.options.readonly) {
|
||||
return this.$element;
|
||||
}
|
||||
if (this.options.indeterminate) {
|
||||
this.indeterminate(false);
|
||||
return this.state(true);
|
||||
} else {
|
||||
return this.$element.prop('checked', !this.options.state).trigger('change.bootstrapSwitch', skip);
|
||||
}
|
||||
}
|
||||
}, {
|
||||
key: 'size',
|
||||
value: function size(value) {
|
||||
if (typeof value === 'undefined') {
|
||||
return this.options.size;
|
||||
}
|
||||
if (this.options.size != null) {
|
||||
this.$wrapper.removeClass(this._getClass(this.options.size));
|
||||
}
|
||||
if (value) {
|
||||
this.$wrapper.addClass(this._getClass(value));
|
||||
}
|
||||
this._width();
|
||||
this._containerPosition();
|
||||
this.options.size = value;
|
||||
return this.$element;
|
||||
}
|
||||
}, {
|
||||
key: 'animate',
|
||||
value: function animate(value) {
|
||||
if (typeof value === 'undefined') {
|
||||
return this.options.animate;
|
||||
}
|
||||
if (this.options.animate === Boolean(value)) {
|
||||
return this.$element;
|
||||
}
|
||||
return this.toggleAnimate();
|
||||
}
|
||||
}, {
|
||||
key: 'toggleAnimate',
|
||||
value: function toggleAnimate() {
|
||||
this.options.animate = !this.options.animate;
|
||||
this.$wrapper.toggleClass(this._getClass('animate'));
|
||||
return this.$element;
|
||||
}
|
||||
}, {
|
||||
key: 'disabled',
|
||||
value: function disabled(value) {
|
||||
if (typeof value === 'undefined') {
|
||||
return this.options.disabled;
|
||||
}
|
||||
if (this.options.disabled === Boolean(value)) {
|
||||
return this.$element;
|
||||
}
|
||||
return this.toggleDisabled();
|
||||
}
|
||||
}, {
|
||||
key: 'toggleDisabled',
|
||||
value: function toggleDisabled() {
|
||||
this.options.disabled = !this.options.disabled;
|
||||
this.$element.prop('disabled', this.options.disabled);
|
||||
this.$wrapper.toggleClass(this._getClass('disabled'));
|
||||
return this.$element;
|
||||
}
|
||||
}, {
|
||||
key: 'readonly',
|
||||
value: function readonly(value) {
|
||||
if (typeof value === 'undefined') {
|
||||
return this.options.readonly;
|
||||
}
|
||||
if (this.options.readonly === Boolean(value)) {
|
||||
return this.$element;
|
||||
}
|
||||
return this.toggleReadonly();
|
||||
}
|
||||
}, {
|
||||
key: 'toggleReadonly',
|
||||
value: function toggleReadonly() {
|
||||
this.options.readonly = !this.options.readonly;
|
||||
this.$element.prop('readonly', this.options.readonly);
|
||||
this.$wrapper.toggleClass(this._getClass('readonly'));
|
||||
return this.$element;
|
||||
}
|
||||
}, {
|
||||
key: 'indeterminate',
|
||||
value: function indeterminate(value) {
|
||||
if (typeof value === 'undefined') {
|
||||
return this.options.indeterminate;
|
||||
}
|
||||
if (this.options.indeterminate === Boolean(value)) {
|
||||
return this.$element;
|
||||
}
|
||||
return this.toggleIndeterminate();
|
||||
}
|
||||
}, {
|
||||
key: 'toggleIndeterminate',
|
||||
value: function toggleIndeterminate() {
|
||||
this.options.indeterminate = !this.options.indeterminate;
|
||||
this.$element.prop('indeterminate', this.options.indeterminate);
|
||||
this.$wrapper.toggleClass(this._getClass('indeterminate'));
|
||||
this._containerPosition();
|
||||
return this.$element;
|
||||
}
|
||||
}, {
|
||||
key: 'inverse',
|
||||
value: function inverse(value) {
|
||||
if (typeof value === 'undefined') {
|
||||
return this.options.inverse;
|
||||
}
|
||||
if (this.options.inverse === Boolean(value)) {
|
||||
return this.$element;
|
||||
}
|
||||
return this.toggleInverse();
|
||||
}
|
||||
}, {
|
||||
key: 'toggleInverse',
|
||||
value: function toggleInverse() {
|
||||
this.$wrapper.toggleClass(this._getClass('inverse'));
|
||||
var $on = this.$on.clone(true);
|
||||
var $off = this.$off.clone(true);
|
||||
this.$on.replaceWith($off);
|
||||
this.$off.replaceWith($on);
|
||||
this.$on = $off;
|
||||
this.$off = $on;
|
||||
this.options.inverse = !this.options.inverse;
|
||||
return this.$element;
|
||||
}
|
||||
}, {
|
||||
key: 'onColor',
|
||||
value: function onColor(value) {
|
||||
if (typeof value === 'undefined') {
|
||||
return this.options.onColor;
|
||||
}
|
||||
if (this.options.onColor) {
|
||||
this.$on.removeClass(this._getClass(this.options.onColor));
|
||||
}
|
||||
this.$on.addClass(this._getClass(value));
|
||||
this.options.onColor = value;
|
||||
return this.$element;
|
||||
}
|
||||
}, {
|
||||
key: 'offColor',
|
||||
value: function offColor(value) {
|
||||
if (typeof value === 'undefined') {
|
||||
return this.options.offColor;
|
||||
}
|
||||
if (this.options.offColor) {
|
||||
this.$off.removeClass(this._getClass(this.options.offColor));
|
||||
}
|
||||
this.$off.addClass(this._getClass(value));
|
||||
this.options.offColor = value;
|
||||
return this.$element;
|
||||
}
|
||||
}, {
|
||||
key: 'onText',
|
||||
value: function onText(value) {
|
||||
if (typeof value === 'undefined') {
|
||||
return this.options.onText;
|
||||
}
|
||||
this.$on.html(value);
|
||||
this._width();
|
||||
this._containerPosition();
|
||||
this.options.onText = value;
|
||||
return this.$element;
|
||||
}
|
||||
}, {
|
||||
key: 'offText',
|
||||
value: function offText(value) {
|
||||
if (typeof value === 'undefined') {
|
||||
return this.options.offText;
|
||||
}
|
||||
this.$off.html(value);
|
||||
this._width();
|
||||
this._containerPosition();
|
||||
this.options.offText = value;
|
||||
return this.$element;
|
||||
}
|
||||
}, {
|
||||
key: 'labelText',
|
||||
value: function labelText(value) {
|
||||
if (typeof value === 'undefined') {
|
||||
return this.options.labelText;
|
||||
}
|
||||
this.$label.html(value);
|
||||
this._width();
|
||||
this.options.labelText = value;
|
||||
return this.$element;
|
||||
}
|
||||
}, {
|
||||
key: 'handleWidth',
|
||||
value: function handleWidth(value) {
|
||||
if (typeof value === 'undefined') {
|
||||
return this.options.handleWidth;
|
||||
}
|
||||
this.options.handleWidth = value;
|
||||
this._width();
|
||||
this._containerPosition();
|
||||
return this.$element;
|
||||
}
|
||||
}, {
|
||||
key: 'labelWidth',
|
||||
value: function labelWidth(value) {
|
||||
if (typeof value === 'undefined') {
|
||||
return this.options.labelWidth;
|
||||
}
|
||||
this.options.labelWidth = value;
|
||||
this._width();
|
||||
this._containerPosition();
|
||||
return this.$element;
|
||||
}
|
||||
}, {
|
||||
key: 'baseClass',
|
||||
value: function baseClass(value) {
|
||||
return this.options.baseClass;
|
||||
}
|
||||
}, {
|
||||
key: 'wrapperClass',
|
||||
value: function wrapperClass(value) {
|
||||
if (typeof value === 'undefined') {
|
||||
return this.options.wrapperClass;
|
||||
}
|
||||
if (!value) {
|
||||
value = $.fn.bootstrapSwitch.defaults.wrapperClass;
|
||||
}
|
||||
this.$wrapper.removeClass(this._getClasses(this.options.wrapperClass).join(' '));
|
||||
this.$wrapper.addClass(this._getClasses(value).join(' '));
|
||||
this.options.wrapperClass = value;
|
||||
return this.$element;
|
||||
}
|
||||
}, {
|
||||
key: 'radioAllOff',
|
||||
value: function radioAllOff(value) {
|
||||
if (typeof value === 'undefined') {
|
||||
return this.options.radioAllOff;
|
||||
}
|
||||
var val = Boolean(value);
|
||||
if (this.options.radioAllOff === val) {
|
||||
return this.$element;
|
||||
}
|
||||
this.options.radioAllOff = val;
|
||||
return this.$element;
|
||||
}
|
||||
}, {
|
||||
key: 'onInit',
|
||||
value: function onInit(value) {
|
||||
if (typeof value === 'undefined') {
|
||||
return this.options.onInit;
|
||||
}
|
||||
if (!value) {
|
||||
value = $.fn.bootstrapSwitch.defaults.onInit;
|
||||
}
|
||||
this.options.onInit = value;
|
||||
return this.$element;
|
||||
}
|
||||
}, {
|
||||
key: 'onSwitchChange',
|
||||
value: function onSwitchChange(value) {
|
||||
if (typeof value === 'undefined') {
|
||||
return this.options.onSwitchChange;
|
||||
}
|
||||
if (!value) {
|
||||
value = $.fn.bootstrapSwitch.defaults.onSwitchChange;
|
||||
}
|
||||
this.options.onSwitchChange = value;
|
||||
return this.$element;
|
||||
}
|
||||
}, {
|
||||
key: 'destroy',
|
||||
value: function destroy() {
|
||||
var $form = this.$element.closest('form');
|
||||
if ($form.length) {
|
||||
$form.off('reset.bootstrapSwitch').removeData('bootstrap-switch');
|
||||
}
|
||||
this.$container.children().not(this.$element).remove();
|
||||
this.$element.unwrap().unwrap().off('.bootstrapSwitch').removeData('bootstrap-switch');
|
||||
return this.$element;
|
||||
}
|
||||
}, {
|
||||
key: '_getElementOptions',
|
||||
value: function _getElementOptions() {
|
||||
return {
|
||||
state: this.$element.is(':checked'),
|
||||
size: this.$element.data('size'),
|
||||
animate: this.$element.data('animate'),
|
||||
disabled: this.$element.is(':disabled'),
|
||||
readonly: this.$element.is('[readonly]'),
|
||||
indeterminate: this.$element.data('indeterminate'),
|
||||
inverse: this.$element.data('inverse'),
|
||||
radioAllOff: this.$element.data('radio-all-off'),
|
||||
onColor: this.$element.data('on-color'),
|
||||
offColor: this.$element.data('off-color'),
|
||||
onText: this.$element.data('on-text'),
|
||||
offText: this.$element.data('off-text'),
|
||||
labelText: this.$element.data('label-text'),
|
||||
handleWidth: this.$element.data('handle-width'),
|
||||
labelWidth: this.$element.data('label-width'),
|
||||
baseClass: this.$element.data('base-class'),
|
||||
wrapperClass: this.$element.data('wrapper-class')
|
||||
};
|
||||
}
|
||||
}, {
|
||||
key: '_width',
|
||||
value: function _width() {
|
||||
var _this2 = this;
|
||||
|
||||
var $handles = this.$on.add(this.$off).add(this.$label).css('width', '');
|
||||
var handleWidth = this.options.handleWidth === 'auto' ? Math.round(Math.max(this.$on.width(), this.$off.width())) : this.options.handleWidth;
|
||||
$handles.width(handleWidth);
|
||||
this.$label.width(function (index, width) {
|
||||
if (_this2.options.labelWidth !== 'auto') {
|
||||
return _this2.options.labelWidth;
|
||||
}
|
||||
if (width < handleWidth) {
|
||||
return handleWidth;
|
||||
}
|
||||
return width;
|
||||
});
|
||||
this._handleWidth = this.$on.outerWidth();
|
||||
this._labelWidth = this.$label.outerWidth();
|
||||
this.$container.width(this._handleWidth * 2 + this._labelWidth);
|
||||
return this.$wrapper.width(this._handleWidth + this._labelWidth);
|
||||
}
|
||||
}, {
|
||||
key: '_containerPosition',
|
||||
value: function _containerPosition() {
|
||||
var _this3 = this;
|
||||
|
||||
var state = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : this.options.state;
|
||||
var callback = arguments[1];
|
||||
|
||||
this.$container.css('margin-left', function () {
|
||||
var values = [0, '-' + _this3._handleWidth + 'px'];
|
||||
if (_this3.options.indeterminate) {
|
||||
return '-' + _this3._handleWidth / 2 + 'px';
|
||||
}
|
||||
if (state) {
|
||||
if (_this3.options.inverse) {
|
||||
return values[1];
|
||||
} else {
|
||||
return values[0];
|
||||
}
|
||||
} else {
|
||||
if (_this3.options.inverse) {
|
||||
return values[0];
|
||||
} else {
|
||||
return values[1];
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
}, {
|
||||
key: '_init',
|
||||
value: function _init() {
|
||||
var _this4 = this;
|
||||
|
||||
var init = function init() {
|
||||
_this4.setPrevOptions();
|
||||
_this4._width();
|
||||
_this4._containerPosition();
|
||||
setTimeout(function () {
|
||||
if (_this4.options.animate) {
|
||||
return _this4.$wrapper.addClass(_this4._getClass('animate'));
|
||||
}
|
||||
}, 50);
|
||||
};
|
||||
if (this.$wrapper.is(':visible')) {
|
||||
init();
|
||||
return;
|
||||
}
|
||||
var initInterval = window.setInterval(function () {
|
||||
if (_this4.$wrapper.is(':visible')) {
|
||||
init();
|
||||
return window.clearInterval(initInterval);
|
||||
}
|
||||
}, 50);
|
||||
}
|
||||
}, {
|
||||
key: '_elementHandlers',
|
||||
value: function _elementHandlers() {
|
||||
var _this5 = this;
|
||||
|
||||
return this.$element.on({
|
||||
'setPreviousOptions.bootstrapSwitch': this.setPrevOptions.bind(this),
|
||||
|
||||
'previousState.bootstrapSwitch': function previousStateBootstrapSwitch() {
|
||||
_this5.options = _this5.prevOptions;
|
||||
if (_this5.options.indeterminate) {
|
||||
_this5.$wrapper.addClass(_this5._getClass('indeterminate'));
|
||||
}
|
||||
_this5.$element.prop('checked', _this5.options.state).trigger('change.bootstrapSwitch', true);
|
||||
},
|
||||
|
||||
'change.bootstrapSwitch': function changeBootstrapSwitch(event, skip) {
|
||||
event.preventDefault();
|
||||
event.stopImmediatePropagation();
|
||||
var state = _this5.$element.is(':checked');
|
||||
_this5._containerPosition(state);
|
||||
if (state === _this5.options.state) {
|
||||
return;
|
||||
}
|
||||
_this5.options.state = state;
|
||||
_this5.$wrapper.toggleClass(_this5._getClass('off')).toggleClass(_this5._getClass('on'));
|
||||
if (!skip) {
|
||||
if (_this5.$element.is(':radio')) {
|
||||
$('[name="' + _this5.$element.attr('name') + '"]').not(_this5.$element).prop('checked', false).trigger('change.bootstrapSwitch', true);
|
||||
}
|
||||
_this5.$element.trigger('switchChange.bootstrapSwitch', [state]);
|
||||
}
|
||||
},
|
||||
|
||||
'focus.bootstrapSwitch': function focusBootstrapSwitch(event) {
|
||||
event.preventDefault();
|
||||
_this5.$wrapper.addClass(_this5._getClass('focused'));
|
||||
},
|
||||
|
||||
'blur.bootstrapSwitch': function blurBootstrapSwitch(event) {
|
||||
event.preventDefault();
|
||||
_this5.$wrapper.removeClass(_this5._getClass('focused'));
|
||||
},
|
||||
|
||||
'keydown.bootstrapSwitch': function keydownBootstrapSwitch(event) {
|
||||
if (!event.which || _this5.options.disabled || _this5.options.readonly) {
|
||||
return;
|
||||
}
|
||||
if (event.which === 37 || event.which === 39) {
|
||||
event.preventDefault();
|
||||
event.stopImmediatePropagation();
|
||||
_this5.state(event.which === 39);
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
}, {
|
||||
key: '_handleHandlers',
|
||||
value: function _handleHandlers() {
|
||||
var _this6 = this;
|
||||
|
||||
this.$on.on('click.bootstrapSwitch', function (event) {
|
||||
event.preventDefault();
|
||||
event.stopPropagation();
|
||||
_this6.state(false);
|
||||
return _this6.$element.trigger('focus.bootstrapSwitch');
|
||||
});
|
||||
return this.$off.on('click.bootstrapSwitch', function (event) {
|
||||
event.preventDefault();
|
||||
event.stopPropagation();
|
||||
_this6.state(true);
|
||||
return _this6.$element.trigger('focus.bootstrapSwitch');
|
||||
});
|
||||
}
|
||||
}, {
|
||||
key: '_labelHandlers',
|
||||
value: function _labelHandlers() {
|
||||
var _this7 = this;
|
||||
|
||||
var handlers = {
|
||||
click: function click(event) {
|
||||
event.stopPropagation();
|
||||
},
|
||||
|
||||
|
||||
'mousedown.bootstrapSwitch touchstart.bootstrapSwitch': function mousedownBootstrapSwitchTouchstartBootstrapSwitch(event) {
|
||||
if (_this7._dragStart || _this7.options.disabled || _this7.options.readonly) {
|
||||
return;
|
||||
}
|
||||
event.preventDefault();
|
||||
event.stopPropagation();
|
||||
_this7._dragStart = (event.pageX || event.originalEvent.touches[0].pageX) - parseInt(_this7.$container.css('margin-left'), 10);
|
||||
if (_this7.options.animate) {
|
||||
_this7.$wrapper.removeClass(_this7._getClass('animate'));
|
||||
}
|
||||
_this7.$element.trigger('focus.bootstrapSwitch');
|
||||
},
|
||||
|
||||
'mousemove.bootstrapSwitch touchmove.bootstrapSwitch': function mousemoveBootstrapSwitchTouchmoveBootstrapSwitch(event) {
|
||||
if (_this7._dragStart == null) {
|
||||
return;
|
||||
}
|
||||
var difference = (event.pageX || event.originalEvent.touches[0].pageX) - _this7._dragStart;
|
||||
event.preventDefault();
|
||||
if (difference < -_this7._handleWidth || difference > 0) {
|
||||
return;
|
||||
}
|
||||
_this7._dragEnd = difference;
|
||||
_this7.$container.css('margin-left', _this7._dragEnd + 'px');
|
||||
},
|
||||
|
||||
'mouseup.bootstrapSwitch touchend.bootstrapSwitch': function mouseupBootstrapSwitchTouchendBootstrapSwitch(event) {
|
||||
if (!_this7._dragStart) {
|
||||
return;
|
||||
}
|
||||
event.preventDefault();
|
||||
if (_this7.options.animate) {
|
||||
_this7.$wrapper.addClass(_this7._getClass('animate'));
|
||||
}
|
||||
if (_this7._dragEnd) {
|
||||
var state = _this7._dragEnd > -(_this7._handleWidth / 2);
|
||||
_this7._dragEnd = false;
|
||||
_this7.state(_this7.options.inverse ? !state : state);
|
||||
} else {
|
||||
_this7.state(!_this7.options.state);
|
||||
}
|
||||
_this7._dragStart = false;
|
||||
},
|
||||
|
||||
'mouseleave.bootstrapSwitch': function mouseleaveBootstrapSwitch() {
|
||||
_this7.$label.trigger('mouseup.bootstrapSwitch');
|
||||
}
|
||||
};
|
||||
this.$label.on(handlers);
|
||||
}
|
||||
}, {
|
||||
key: '_externalLabelHandler',
|
||||
value: function _externalLabelHandler() {
|
||||
var _this8 = this;
|
||||
|
||||
var $externalLabel = this.$element.closest('label');
|
||||
$externalLabel.on('click', function (event) {
|
||||
event.preventDefault();
|
||||
event.stopImmediatePropagation();
|
||||
if (event.target === $externalLabel[0]) {
|
||||
_this8.toggleState();
|
||||
}
|
||||
});
|
||||
}
|
||||
}, {
|
||||
key: '_formHandler',
|
||||
value: function _formHandler() {
|
||||
var $form = this.$element.closest('form');
|
||||
if ($form.data('bootstrap-switch')) {
|
||||
return;
|
||||
}
|
||||
$form.on('reset.bootstrapSwitch', function () {
|
||||
window.setTimeout(function () {
|
||||
$form.find('input').filter(function () {
|
||||
return $(this).data('bootstrap-switch');
|
||||
}).each(function () {
|
||||
return $(this).bootstrapSwitch('state', this.checked);
|
||||
});
|
||||
}, 1);
|
||||
}).data('bootstrap-switch', true);
|
||||
}
|
||||
}, {
|
||||
key: '_getClass',
|
||||
value: function _getClass(name) {
|
||||
return this.options.baseClass + '-' + name;
|
||||
}
|
||||
}, {
|
||||
key: '_getClasses',
|
||||
value: function _getClasses(classes) {
|
||||
if (!$.isArray(classes)) {
|
||||
return [this._getClass(classes)];
|
||||
}
|
||||
return classes.map(this._getClass.bind(this));
|
||||
}
|
||||
}]);
|
||||
|
||||
return BootstrapSwitch;
|
||||
}();
|
||||
|
||||
$.fn.bootstrapSwitch = function (option) {
|
||||
for (var _len2 = arguments.length, args = Array(_len2 > 1 ? _len2 - 1 : 0), _key2 = 1; _key2 < _len2; _key2++) {
|
||||
args[_key2 - 1] = arguments[_key2];
|
||||
}
|
||||
|
||||
function reducer(ret, next) {
|
||||
var $this = $(next);
|
||||
var existingData = $this.data('bootstrap-switch');
|
||||
var data = existingData || new BootstrapSwitch(next, option);
|
||||
if (!existingData) {
|
||||
$this.data('bootstrap-switch', data);
|
||||
}
|
||||
if (typeof option === 'string') {
|
||||
return data[option].apply(data, args);
|
||||
}
|
||||
return ret;
|
||||
}
|
||||
return Array.prototype.reduce.call(this, reducer, this);
|
||||
};
|
||||
$.fn.bootstrapSwitch.Constructor = BootstrapSwitch;
|
||||
$.fn.bootstrapSwitch.defaults = {
|
||||
state: true,
|
||||
size: null,
|
||||
animate: true,
|
||||
disabled: false,
|
||||
readonly: false,
|
||||
indeterminate: false,
|
||||
inverse: false,
|
||||
radioAllOff: false,
|
||||
onColor: 'primary',
|
||||
offColor: 'default',
|
||||
onText: 'ON',
|
||||
offText: 'OFF',
|
||||
labelText: ' ',
|
||||
handleWidth: 'auto',
|
||||
labelWidth: 'auto',
|
||||
baseClass: 'bootstrap-switch',
|
||||
wrapperClass: 'wrapper',
|
||||
onInit: function onInit() {},
|
||||
onSwitchChange: function onSwitchChange() {}
|
||||
};
|
||||
});
|
||||
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
|
||||
@@ -2,8 +2,10 @@ BEGIN;
|
||||
|
||||
CREATE TABLE "netmap_positions" (
|
||||
"id" serial PRIMARY KEY,
|
||||
"device_groups" text[] UNIQUE NOT NULL,
|
||||
"positions" text NOT NULL
|
||||
"device_groups" text[] NOT NULL,
|
||||
"vlan" integer NOT NULL DEFAULT 0,
|
||||
"positions" text NOT NULL,
|
||||
UNIQUE ("device_groups", "vlan")
|
||||
);
|
||||
|
||||
COMMIT;
|
||||
|
||||
@@ -72,7 +72,7 @@ $.getJSON('[% uri_for('/ajax/data/device/netmap') %]',{
|
||||
if (mapdata['v3']['newnodes']) {
|
||||
$.post(
|
||||
'[% uri_for('/ajax/data/device/netmappositions') %]'
|
||||
,'positions=' + JSON.stringify(graph.positions())
|
||||
,'vlan=[% params.vlan %]&positions=' + JSON.stringify(graph.positions())
|
||||
);
|
||||
}
|
||||
|
||||
|
||||
@@ -122,7 +122,7 @@
|
||||
event.preventDefault();
|
||||
$.post(
|
||||
'[% uri_for('/ajax/data/device/netmappositions') %]'
|
||||
,'positions=' + JSON.stringify(graph.positions())
|
||||
,'vlan=[% params.vlan %]&positions=' + JSON.stringify(graph.positions())
|
||||
);
|
||||
});
|
||||
$('#nd_netmap-zoomtodevice').on('click', function(event) {
|
||||
|
||||
@@ -18,7 +18,7 @@
|
||||
<!-- <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/bootstrap-switch.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>
|
||||
@@ -50,7 +50,8 @@
|
||||
[% END %]
|
||||
|
||||
<link rel="stylesheet" href="[% uri_base %]/css/bootstrap.min.css"/>
|
||||
<link rel="stylesheet" href="[% uri_base %]/css/bootstrap-switch.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"/>
|
||||
|
||||
@@ -8,6 +8,25 @@
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<div class="clearfix nd_netmap-sidebar">
|
||||
<div class="checkbox pull-left">
|
||||
<label>
|
||||
<input type="checkbox" name="showips" id="nd_showips"
|
||||
data-toggle="toggle" data-size="small" data-width="30"
|
||||
data-on="Show" data-off=" " data-onstyle="success">
|
||||
Management IPs
|
||||
</label>
|
||||
</div>
|
||||
<div class="checkbox pull-left">
|
||||
<label>
|
||||
<input type="checkbox" name="showspeed" id="nd_showspeed"
|
||||
data-toggle="toggle" data-size="small" data-width="30"
|
||||
data-on="Show" data-off=" " data-onstyle="success">
|
||||
Link Speed
|
||||
</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>
|
||||
@@ -24,71 +43,74 @@
|
||||
<i class="icon-save icon-large pull-left nd_navbar-icon"></i>
|
||||
Save Positions</button>
|
||||
|
||||
<div class="clearfix nd_netmap-sidebar">
|
||||
<em class="muted nd_sidebar-label">Show only Devices:</em><br/>
|
||||
</div>
|
||||
<input class="nd_bs-sw" type="radio" name="mapshow" value="neighbors"
|
||||
data-on-text="" data-off-text="" data-size="small"
|
||||
data-on-color="success" data-off-color="default"
|
||||
data-label-text="Neighbors" data-handle-width="74" data-label-width="90">
|
||||
<input class="nd_bs-sw" type="radio" name="mapshow" value="groups" checked
|
||||
data-on-text="" data-off-text="" data-size="small"
|
||||
data-on-color="success" data-off-color="default"
|
||||
data-label-text="Groups" data-handle-width="74" data-label-width="90">
|
||||
|
||||
<div class="clearfix">
|
||||
<select class="nd_side-select" size="[% devgrp_list.size > 5 ? 5 : devgrp_list.size %]"
|
||||
multiple="on" name="devgrp"
|
||||
rel="tooltip" data-placement="left" data-offset="5" data-title="Device Groups"/>
|
||||
[% FOREACH opt IN devgrp_list %]
|
||||
<option[% ' selected="selected"' IF os_lkp.exists(opt) %]>[% opt | html_entity %]</option>
|
||||
[% END %]
|
||||
<option value="__ALL__" selected="selected">All Devices</option>
|
||||
</select>
|
||||
</div>
|
||||
|
||||
<input class="nd_bs-sw" type="checkbox" data-label-text="Mgmt IPs"
|
||||
data-on-text="Show" data-off-text="Hide" data-size="small" disabled="true"
|
||||
data-handle-width="74" data-label-width="90">
|
||||
|
||||
<input class="nd_bs-sw" type="checkbox" data-label-text="Link Speed"
|
||||
data-on-text="Show" data-off-text="Hide" data-size="small" disabled="true"
|
||||
data-handle-width="74" data-label-width="90">
|
||||
|
||||
<div class="clearfix nd_netmap-sidebar">
|
||||
<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>
|
||||
|
||||
<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>
|
||||
<div class="clearfix input-prepend">
|
||||
<label class="add-on">
|
||||
<input type="checkbox" id="dynamicsize" disabled
|
||||
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>
|
||||
|
||||
<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" 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" value="neighbors" checked>
|
||||
<label for="nd_mapshow-neighbors">Neighbors Only</label>
|
||||
</div>
|
||||
|
||||
<div class="radio radio-success">
|
||||
<input type="radio" name="mapshow" id="nd_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"
|
||||
rel="tooltip" data-placement="left" data-offset="5" data-title="Host Groups"/>
|
||||
[% FOREACH opt IN devgrp_list %]
|
||||
<option[% ' selected="selected"' IF os_lkp.exists(opt) %]>[% opt | html_entity %]</option>
|
||||
[% END %]
|
||||
</select>
|
||||
</div>
|
||||
[% END %]
|
||||
|
||||
<div class="clearfix nd_netmap-sidebar">
|
||||
|
||||
[% 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 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="number"
|
||||
value="[% params.vlan | html_entity %]" type="text"/>
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="clearfix input-prepend">
|
||||
<label class="add-on">
|
||||
<input type="checkbox" id="dynamicsize" disabled
|
||||
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>
|
||||
|
||||
<script type="text/javascript">
|
||||
$('.nd_bs-sw').bootstrapSwitch();
|
||||
</script>
|
||||
|
||||
Reference in New Issue
Block a user