NeoAnd/netbox
1
0
Fork 0
mirror of https://github.com/netbox-community/netbox.git synced 2025-07-23 04:22:01 -06:00
Code Issues Actions 8 Packages Projects Releases Wiki Activity

Clean up SVG image styling

Browse Source
This commit is contained in:
jeremystretch 2021-07-15 13:54:49 -04:00
parent 8b571912cf
commit 89662124e5
4 changed files with 47 additions and 29 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

57
netbox/dcim/svg.py
View File

@ -244,7 +244,7 @@ class RackElevationSVG:
OFFSET = 0.5
PADDING = 10
LINE_HEIGHT = 15
LINE_HEIGHT = 20
class CableTraceSVG:
@ -255,9 +255,6 @@ class CableTraceSVG:
:param width: Width of the generated image (in pixels)
:param base_url: Base URL for links within the SVG document. If none, links will be relative.
"""
PARENT_OBJECT_DEFAULT_COLOR = 'd0d0d0'
TERMINATION_DEFAULT_COLOR = 'c0c0c0'
def __init__(self, origin, width=400, base_url=None):
self.origin = origin
self.width = width
@ -277,9 +274,21 @@ class CableTraceSVG:
Return a list of text labels for the given instance based on model type.
"""
labels = [str(instance)]
if hasattr(instance, 'device_type'):
labels.append(str(instance.device_type))
elif hasattr(instance, 'provider'):
if instance._meta.model_name == 'device':
labels.append(f'{instance.device_type.manufacturer} {instance.device_type}')
location_label = f'{instance.site}'
if instance.location:
location_label += f' / {instance.location}'
if instance.rack:
location_label += f' / {instance.rack}'
labels.append(location_label)
elif instance._meta.model_name == 'circuit':
labels[0] = f'Circuit {instance}'
labels.append(instance.provider)
elif instance._meta.model_name == 'circuittermination':
if instance.xconnect_id:
labels.append(f'{instance.xconnect_id}')
elif instance._meta.model_name == 'providernetwork':
labels.append(instance.provider)
return labels
@ -291,13 +300,13 @@ class CableTraceSVG:
"""
if hasattr(instance, 'parent_object'):
# Termination
return cls.TERMINATION_DEFAULT_COLOR
return 'f0f0f0'
if hasattr(instance, 'device_role'):
# Device
return instance.device_role.color
else:
# Other parent object
return cls.PARENT_OBJECT_DEFAULT_COLOR
return 'e0e0e0'
def _draw_box(self, width, color, url, labels, y_indent=0, padding_multiplier=1, radius=10):
"""
@ -334,7 +343,7 @@ class CableTraceSVG:
self.cursor += LINE_HEIGHT
text_coords = (self.center, self.cursor - LINE_HEIGHT / 2)
text_color = f'#{foreground_color(color)}'
text = Text(label, insert=text_coords, fill=text_color)
text = Text(label, insert=text_coords, fill=text_color, class_='bold' if not i else [])
link.add(text)
self.cursor += PADDING * padding_multiplier
@ -351,12 +360,17 @@ class CableTraceSVG:
"""
group = Group(class_='connector')
# Draw cable (line)
# Draw a "shadow" line to give the cable a border
start = (OFFSET + self.center, self.cursor)
height = PADDING * 2 + LINE_HEIGHT * len(labels) + PADDING * 2
end = (start[0], start[1] + height)
line = Line(start=start, end=end, style=f'stroke: #{color}')
group.add(line)
cable_shadow = Line(start=start, end=end, class_='cable-shadow')
group.add(cable_shadow)
# Draw the cable
cable = Line(start=start, end=end, style=f'stroke: #{color}')
group.add(cable)
self.cursor += PADDING * 2
# Add link
@ -366,7 +380,7 @@ class CableTraceSVG:
for i, label in enumerate(labels):
self.cursor += LINE_HEIGHT
text_coords = (self.center + PADDING * 2, self.cursor - LINE_HEIGHT / 2)
text = Text(label, insert=text_coords, class_='cable')
text = Text(label, insert=text_coords, class_='bold' if not i else [])
link.add(text)
group.add(link)
@ -381,19 +395,12 @@ class CableTraceSVG:
group = Group(class_='connector')
# Draw attachment (line)
start = (OFFSET + self.center, self.cursor)
start = (OFFSET + self.center, OFFSET + self.cursor)
height = PADDING * 2 + LINE_HEIGHT + PADDING * 2
end = (start[0], start[1] + height)
line = Line(start=start, end=end, class_='attachment')
group.add(line)
self.cursor += PADDING * 2
# Add label
self.cursor += LINE_HEIGHT
text_coords = (self.center + PADDING * 2, self.cursor - LINE_HEIGHT / 2)
text = Text('Attachment', insert=text_coords)
group.add(text)
self.cursor += PADDING * 2
self.cursor += PADDING * 4
return group
@ -429,7 +436,7 @@ class CableTraceSVG:
width=self.width * .8,
color=self._get_color(near_end),
url=near_end.get_absolute_url(),
labels=[str(near_end)],
labels=self._get_labels(near_end),
y_indent=PADDING,
radius=5
)
@ -451,7 +458,7 @@ class CableTraceSVG:
width=self.width * .8,
color=self._get_color(far_end),
url=far_end.get_absolute_url(),
labels=[str(far_end)],
labels=self._get_labels(far_end),
radius=5
)
terminations.append(termination)

17
netbox/project-static/_cable_trace.scss
View File

@ -1,17 +1,24 @@
* {
font-family: sans-serif;
font-size: 13px;
font-size: 14px;
}
text {
text-anchor: middle;
dominant-baseline: middle;
}
text.bold {
font-weight: bold;
}
svg {
/* Boxes */
rect {
stroke: #303030;
fill: #e0e0e0;
stroke: #606060;
stroke-width: 1;
.termination {
fill: #f0f0f0;
}
}
/* Connectors */
@ -19,7 +26,11 @@ svg {
text-anchor: start;
}
line {
stroke-width: 3;
stroke-width: 5px;
}
line.cable-shadow {
stroke: #303030;
stroke-width: 7px;
}
line.attachment {
stroke: #c0c0c0;

BIN
netbox/project-static/dist/cable_trace.css vendored
View File

Binary file not shown.

2
netbox/project-static/dist/cable_trace.css.map vendored
View File

@ -1 +1 @@
{"version":3,"sources":["_cable_trace.scss"],"names":[],"mappings":"AAAA,EACI,sBAAA,CACA,eAEJ,KACI,kBAAA,CACA,yBAKF,SACE,cAAA,CACA,eAIF,oBACE,kBAEF,SACE,eAEF,oBACE,aAAA,CACA","file":"cable_trace.css","sourceRoot":"..","sourcesContent":["* {\n font-family: sans-serif;\n font-size: 13px;\n}\ntext {\n text-anchor: middle;\n dominant-baseline: middle;\n}\n\nsvg {\n /* Boxes */\n rect {\n stroke: #303030;\n stroke-width: 1;\n }\n\n /* Connectors */\n .connector text {\n text-anchor: start;\n }\n line {\n stroke-width: 3;\n }\n line.attachment {\n stroke: #c0c0c0;\n stroke-dasharray: 5px,5px;\n }\n}\n"]}
{"version":3,"sources":["_cable_trace.scss"],"names":[],"mappings":"AAAA,EACI,sBAAA,CACA,eAEJ,KACI,kBAAA,CACA,yBAEJ,UACE,gBAKA,SACE,YAAA,CACA,cAAA,CACA,eACA,sBACE,aAKJ,oBACE,kBAEF,SACE,iBAEF,sBACE,cAAA,CACA,iBAEF,oBACE,aAAA,CACA","file":"cable_trace.css","sourceRoot":"..","sourcesContent":["* {\n font-family: sans-serif;\n font-size: 14px;\n}\ntext {\n text-anchor: middle;\n dominant-baseline: middle;\n}\ntext.bold {\n font-weight: bold;\n}\n\nsvg {\n /* Boxes */\n rect {\n fill: #e0e0e0;\n stroke: #606060;\n stroke-width: 1;\n .termination {\n fill: #f0f0f0;\n }\n }\n\n /* Connectors */\n .connector text {\n text-anchor: start;\n }\n line {\n stroke-width: 5px;\n }\n line.cable-shadow {\n stroke: #303030;\n stroke-width: 7px;\n }\n line.attachment {\n stroke: #c0c0c0;\n stroke-dasharray: 5px,5px;\n }\n}\n"]}