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

Standardized graph display; added templatization for graph links

Browse Source
This commit is contained in:
Jeremy Stretch 2016-06-24 11:16:49 -04:00
parent 9de8ac91a1
commit 39330850b3
6 changed files with 42 additions and 57 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
netbox/extras/api/serializers.py
View File

@ -5,10 +5,14 @@ from extras.models import Graph
class GraphSerializer(serializers.ModelSerializer):
embed_url = serializers.SerializerMethodField()
embed_link = serializers.SerializerMethodField()
class Meta:
model = Graph
fields = ['name', 'embed_url', 'link']
fields = ['name', 'embed_url', 'embed_link']
def get_embed_url(self, obj):
return obj.embed_url(self.context['graphed_object'])
def get_embed_link(self, obj):
return obj.embed_link(self.context['graphed_object'])

6
netbox/extras/models.py
View File

@ -56,6 +56,12 @@ class Graph(models.Model):
template = Template(self.source)
return template.render(Context({'obj': obj}))
def embed_link(self, obj):
if self.link is None:
return ''
template = Template(self.link)
return template.render(Context({'obj': obj}))
class ExportTemplate(models.Model):
content_type = models.ForeignKey(ContentType, limit_choices_to={'model__in': EXPORTTEMPLATE_MODELS})

26
netbox/project-static/js/graphs.js Normal file
View File

@ -0,0 +1,26 @@
$('#graphs_modal').on('show.bs.modal', function (event) {
var button = $(event.relatedTarget);
var obj = button.data('obj');
var url = button.data('url');
var modal_title = $(this).find('.modal-title');
var modal_body = $(this).find('.modal-body');
modal_title.text(obj);
modal_body.empty();
$.ajax({
url: url,
dataType: 'json',
success: function(json) {
$.each(json, function(i, graph) {
// Build in a 500ms delay per graph to avoid hammering the server
setTimeout(function() {
modal_body.append('<h4 class="text-center">' + graph.name + '</h4>');
if (graph.embed_link) {
modal_body.append('<a href="' + graph.embed_link + '"><img src="' + graph.embed_url + '" /></a>');
} else {
modal_body.append('<img src="' + graph.embed_url + '" />');
}
}, i*500);
})
}
});
});

27
netbox/templates/dcim/device.html
View File

@ -396,32 +396,7 @@ $(".powerport-toggle").click(function() {
$(".interface-toggle").click(function() {
return toggleConnection($(this), "/api/dcim/interface-connections/");
});
$('#graphs_modal').on('show.bs.modal', function (event) {
var button = $(event.relatedTarget);
var iface = button.data('interface');
var iface_id = button.data('id');
var modal_title = $(this).find('.modal-title');
var modal_body = $(this).find('.modal-body');
modal_title.text('{{ device.name }} - ' + iface);
modal_body.empty();
$.ajax({
url: "/api/dcim/interfaces/" + iface_id + "/graphs/",
dataType: 'json',
success: function(json) {
$.each(json, function(i, graph) {
// Build in a 500ms delay per graph to avoid hammering the server
setTimeout(function() {
modal_body.append('<h4 class="text-center">' + graph.name + '</h4>');
if (graph.link) {
modal_body.append('<a href="' + graph.link + '"><img src="' + graph.embed_url + '" /></a>');
} else {
modal_body.append('<img src="' + graph.embed_url + '" />');
}
}, i*500);
})
}
});
});
</script>
<script src="{% static 'js/graphs.js' %}"></script>
<script src="{% static 'js/secrets.js' %}"></script>
{% endblock %}

2
netbox/templates/dcim/inc/_interface.html
View File

@ -25,7 +25,7 @@
{% endif %}
<td class="text-right">
{% if iface.circuit or iface.connection %}
<button type="button" class="btn btn-primary btn-xs" data-toggle="modal" data-target="#graphs_modal" data-interface="{{ iface.name }}" data-id="{{ iface.id }}" title="Show graphs">
<button type="button" class="btn btn-primary btn-xs" data-toggle="modal" data-target="#graphs_modal" data-obj="{{ device.name }} - {{ iface.name }}" data-url="{% url 'dcim-api:interface_graphs' pk=iface.pk %}" title="Show graphs">
<i class="glyphicon glyphicon-signal" aria-hidden="true"></i>
</button>
{% endif %}

32
netbox/templates/dcim/site.html
View File

@ -1,4 +1,5 @@
{% extends '_base.html' %}
{% load static from staticfiles %}
{% load render_table from django_tables2 %}
{% load helpers %}
@ -6,7 +7,7 @@
{% block content %}
<div class="pull-right">
<button type="button" class="btn btn-primary" data-toggle="modal" data-target="#graphs_modal" data-site="{{ site.name }}" data-id="{{ site.id }}" title="Show graphs">
<button type="button" class="btn btn-primary" data-toggle="modal" data-target="#graphs_modal" data-obj="{{ site.name }}" data-url="{% url 'dcim-api:site_graphs' pk=site.pk %}" title="Show graphs">
<i class="glyphicon glyphicon-signal" aria-hidden="true"></i>
Graphs
</button>
@ -159,32 +160,5 @@
{% endblock %}
{% block javascript %}
<script type="text/javascript">
$('#graphs_modal').on('show.bs.modal', function (event) {
var button = $(event.relatedTarget);
var site = button.data('site');
var site_id = button.data('id');
var modal_title = $(this).find('.modal-title');
var modal_body = $(this).find('.modal-body');
modal_title.text(site);
modal_body.empty();
$.ajax({
url: "/api/dcim/sites/" + site_id + "/graphs/",
dataType: 'json',
success: function(json) {
$.each(json, function(i, graph) {
// Build in a 500ms delay per graph to avoid hammering the server
setTimeout(function() {
modal_body.append('<h4 class="text-center">' + graph.name + '</h4>');
if (graph.link) {
modal_body.append('<a href="' + graph.link + '"><img src="' + graph.embed_url + '" /></a>');
} else {
modal_body.append('<img src="' + graph.embed_url + '" />');
}
}, i*500);
})
}
});
});
</script>
<script src="{% static 'js/graphs.js' %}"></script>
{% endblock %}