diff --git a/netbox_floorplan/static/netbox_floorplan/floorplan/edit.js b/netbox_floorplan/static/netbox_floorplan/floorplan/edit.js
index f21ee27..c21c6e5 100644
--- a/netbox_floorplan/static/netbox_floorplan/floorplan/edit.js
+++ b/netbox_floorplan/static/netbox_floorplan/floorplan/edit.js
@@ -275,7 +275,7 @@ function add_text() {
}
window.add_text = add_text;
-function add_floorplan_object(top, left, width, height, unit, fill, rotation, object_id, object_name, object_type, status) {
+function add_floorplan_object(top, left, width, height, unit, fill, rotation, object_id, object_name, object_type, status, image) {
var object_width;
var object_height;
if ( !width || !height || !unit ){
@@ -300,44 +300,89 @@ function add_floorplan_object(top, left, width, height, unit, fill, rotation, ob
console.log(object_height)
}
document.getElementById(`object_${object_type}_${object_id}`).remove();
- var rect = new fabric.Rect({
- top: top,
- name: "rectangle",
- left: left,
- width: object_width,
- height: object_height,
- fill: fill,
- opacity: 0.8,
- lockRotation: false,
- originX: "center",
- originY: "center",
- cornerSize: 15,
- hasRotatingPoint: true,
- perPixelTargetFind: true,
- minScaleLimit: 1,
- maxWidth: canvasWidth,
- maxHeight: canvasHeight,
- centeredRotation: true,
- custom_meta: {
- "object_type": object_type,
- "object_id": object_id,
- "object_name": object_name,
- "object_url": "/dcim/" + object_type + "s/" + object_id + "/",
- },
- });
+ /* if we have an image, we display the text below, otherwise we display the text within */
+ var rect, text_offset = 0;
+ if (!image) {
+ rect = new fabric.Rect({
+ top: top,
+ name: "rectangle",
+ left: left,
+ width: object_width,
+ height: object_height,
+ fill: fill,
+ opacity: 0.8,
+ lockRotation: false,
+ originX: "center",
+ originY: "center",
+ cornerSize: 15,
+ hasRotatingPoint: true,
+ perPixelTargetFind: true,
+ minScaleLimit: 1,
+ maxWidth: canvasWidth,
+ maxHeight: canvasHeight,
+ centeredRotation: true,
+ custom_meta: {
+ "object_type": object_type,
+ "object_id": object_id,
+ "object_name": object_name,
+ "object_url": "/dcim/" + object_type + "s/" + object_id + "/",
+ },
+ });
+ } else {
+ object_height = object_width;
+ text_offset = object_height/2 + 4;
+ rect = new fabric.Image(null, {
+ top: top,
+ name: "rectangle",
+ left: left,
+ width: object_width,
+ height: object_height,
+ opacity: 1,
+ lockRotation: false,
+ originX: "center",
+ originY: "center",
+ cornerSize: 15,
+ hasRotatingPoint: true,
+ perPixelTargetFind: true,
+ minScaleLimit: 1,
+ maxWidth: canvasWidth,
+ maxHeight: canvasHeight,
+ centeredRotation: true,
+ shadow: new fabric.Shadow({
+ color: "red",
+ blur: 15,
+ }),
+ custom_meta: {
+ "object_type": object_type,
+ "object_id": object_id,
+ "object_name": object_name,
+ "object_url": "/dcim/" + object_type + "s/" + object_id + "/",
+ },
+ });
+ rect.setSrc("/media/" + image, function(img){
+ img.scaleX = object_width / img.width;
+ img.scaleY = object_height / img.height;
+ canvas.renderAll();
+ });
+ }
- var text = new fabric.IText(object_name, {
+ var text = new fabric.Textbox(object_name, {
fontFamily: "Courier New",
fontSize: 16,
+ splitByGrapheme: text_offset? null : true,
fill: "#FFFF",
+ width: object_width,
textAlign: "center",
originX: "center",
originY: "center",
left: left,
- top: top,
+ top: top + text_offset,
excludeFromExport: false,
includeDefaultValues: true,
centeredRotation: true,
+ stroke: "#000",
+ strokeWidth: 2,
+ paintFirst: 'stroke',
custom_meta: {
"text_type": "name",
}
@@ -352,10 +397,14 @@ function add_floorplan_object(top, left, width, height, unit, fill, rotation, ob
originX: "center",
originY: "center",
left: left,
- top: top + 16,
+ top: top + text_offset + 16,
excludeFromExport: false,
includeDefaultValues: true,
centeredRotation: true,
+ shadow: text_offset? new fabric.Shadow({
+ color: '#FFF',
+ blur: 1
+ }) : null,
custom_meta: {
"text_type": "status",
}
diff --git a/netbox_floorplan/tables.py b/netbox_floorplan/tables.py
index 3f22a29..14790e4 100644
--- a/netbox_floorplan/tables.py
+++ b/netbox_floorplan/tables.py
@@ -54,7 +54,7 @@ class FloorplanDeviceTable(NetBoxTable):
name = tables.LinkColumn()
actions = tables.TemplateColumn(template_code="""
- Add Device
+ Add Device
""")