Truned into ocp-wg-backend module
This commit is contained in:
351
wrapper.py
351
wrapper.py
@@ -14,6 +14,7 @@ import dash
|
||||
import dash_cytoscape as cyto
|
||||
from dash import Dash, dcc, html
|
||||
from dash.dependencies import Input, Output
|
||||
import dash_bootstrap_components as dbc
|
||||
|
||||
cyto.load_extra_layouts()
|
||||
external_script = ["https://tailwindcss.com/", {"src": "https://cdn.tailwindcss.com"}]
|
||||
@@ -108,66 +109,67 @@ def line_process():
|
||||
with open(os.path.join(path, log_file)) as p_lines:
|
||||
|
||||
for line in p_lines:
|
||||
#print(line)
|
||||
parser_arg = line.encode('utf-8')
|
||||
call_lib = clibrary.line_parse(parser_arg)
|
||||
time_hr = datetime.fromisoformat(call_lib.contents.tstamp.decode('utf-8'))
|
||||
time_hr = time_hr.strftime("%d-%m-%Y %H:%M:%S (%Z)")
|
||||
if line.strip():
|
||||
#print(line)
|
||||
parser_arg = line.encode('utf-8')
|
||||
call_lib = clibrary.line_parse(parser_arg)
|
||||
time_hr = datetime.fromisoformat(call_lib.contents.tstamp.decode('utf-8'))
|
||||
time_hr = time_hr.strftime("%d-%m-%Y %H:%M:%S (%Z)")
|
||||
|
||||
# print("-"*50)
|
||||
# print("TSTAMP ",time_hr)
|
||||
# print("TAG ",call_lib.contents.tag.decode('utf-8'))
|
||||
# print("SRC ",call_lib.contents.src_ip.decode('utf-8'))
|
||||
# print("DST ",call_lib.contents.dst_ip.decode('utf-8'))
|
||||
# print("LEN ",call_lib.contents.len.decode('utf-8'))
|
||||
# print("-"*50)
|
||||
# print("TSTAMP ",time_hr)
|
||||
# print("TAG ",call_lib.contents.tag.decode('utf-8'))
|
||||
# print("SRC ",call_lib.contents.src_ip.decode('utf-8'))
|
||||
# print("DST ",call_lib.contents.dst_ip.decode('utf-8'))
|
||||
# print("LEN ",call_lib.contents.len.decode('utf-8'))
|
||||
|
||||
# print("IFACE_IN ",call_lib.contents.iface_in.decode('utf-8'))
|
||||
# print("IFACE_OUT ",call_lib.contents.iface_out.decode('utf-8'))
|
||||
# print("PROTO ",call_lib.contents.proto.decode('utf-8'))
|
||||
# if (call_lib.contents.proto != b"ICMP"):
|
||||
# print("SPT ",call_lib.contents.src_port.decode('utf-8'))
|
||||
# print("DPT ",call_lib.contents.dst_port.decode('utf-8'))
|
||||
# print()
|
||||
# print("IFACE_IN ",call_lib.contents.iface_in.decode('utf-8'))
|
||||
# print("IFACE_OUT ",call_lib.contents.iface_out.decode('utf-8'))
|
||||
# print("PROTO ",call_lib.contents.proto.decode('utf-8'))
|
||||
# if (call_lib.contents.proto != b"ICMP"):
|
||||
# print("SPT ",call_lib.contents.src_port.decode('utf-8'))
|
||||
# print("DPT ",call_lib.contents.dst_port.decode('utf-8'))
|
||||
# print()
|
||||
|
||||
timestamp = call_lib.contents.tstamp.decode('utf-8')
|
||||
tag = call_lib.contents.tag.decode('utf-8')
|
||||
src_ip = call_lib.contents.src_ip.decode('utf-8')
|
||||
dst_ip = call_lib.contents.dst_ip.decode('utf-8')
|
||||
iface_in = call_lib.contents.iface_in.decode('utf-8')
|
||||
iface_out = call_lib.contents.iface_out.decode('utf-8')
|
||||
proto = call_lib.contents.proto.decode('utf-8')
|
||||
timestamp = call_lib.contents.tstamp.decode('utf-8')
|
||||
tag = call_lib.contents.tag.decode('utf-8')
|
||||
src_ip = call_lib.contents.src_ip.decode('utf-8')
|
||||
dst_ip = call_lib.contents.dst_ip.decode('utf-8')
|
||||
iface_in = call_lib.contents.iface_in.decode('utf-8')
|
||||
iface_out = call_lib.contents.iface_out.decode('utf-8')
|
||||
proto = call_lib.contents.proto.decode('utf-8')
|
||||
|
||||
if (call_lib.contents.proto != b"ICMP"):
|
||||
src_port = call_lib.contents.src_port.decode('utf-8')
|
||||
dst_port = call_lib.contents.dst_port.decode('utf-8')
|
||||
else:
|
||||
src_port = ""
|
||||
dst_port = ""
|
||||
if (call_lib.contents.proto != b"ICMP"):
|
||||
src_port = call_lib.contents.src_port.decode('utf-8')
|
||||
dst_port = call_lib.contents.dst_port.decode('utf-8')
|
||||
else:
|
||||
src_port = ""
|
||||
dst_port = ""
|
||||
|
||||
tmp_data = {
|
||||
"TimeStamp": timestamp,
|
||||
"Tag": tag,
|
||||
"SourceIP": src_ip,
|
||||
"DestinationIP": dst_ip,
|
||||
"InterafceIN": iface_in,
|
||||
"InterafceOUT": iface_out,
|
||||
"SourcePort": src_port,
|
||||
"DestinationPort": dst_port,
|
||||
"Protocol": proto
|
||||
}
|
||||
nodes.append(src_ip)
|
||||
nodes.append(dst_ip)
|
||||
edges.append((src_ip, dst_ip))
|
||||
json_dump.append(tmp_data)
|
||||
tmp_data = {
|
||||
"TimeStamp": timestamp,
|
||||
"Tag": tag,
|
||||
"SourceIP": src_ip,
|
||||
"DestinationIP": dst_ip,
|
||||
"InterafceIN": iface_in,
|
||||
"InterafceOUT": iface_out,
|
||||
"SourcePort": src_port,
|
||||
"DestinationPort": dst_port,
|
||||
"Protocol": proto
|
||||
}
|
||||
nodes.append(src_ip)
|
||||
nodes.append(dst_ip)
|
||||
edges.append((src_ip, dst_ip))
|
||||
json_dump.append(tmp_data)
|
||||
|
||||
nodes = get_uniq(nodes)
|
||||
edges = get_uniq(edges)
|
||||
|
||||
plot_group_graph(nodes, edges)
|
||||
#plot_group_graph(nodes, edges)
|
||||
|
||||
json_data = json.dumps(json_dump, indent=2)
|
||||
|
||||
return json_data
|
||||
return nodes, edges
|
||||
|
||||
def get_uniq(list):
|
||||
|
||||
@@ -191,8 +193,9 @@ def get_uniq(list):
|
||||
# file_pointer()
|
||||
# struct_process()
|
||||
|
||||
def plot_group_graph(nodes, edges):
|
||||
def plot_group_graph():
|
||||
|
||||
nodes, edges = line_process()
|
||||
# Create a graph
|
||||
G = nx.Graph()
|
||||
G.add_nodes_from(nodes)
|
||||
@@ -202,83 +205,197 @@ def plot_group_graph(nodes, edges):
|
||||
random_words = [random.choice(["Apple", "Banana", "Cherry", "Date", "Fig", "Grape", "Lemon", "Mango", "Orange", "Peach"]) for _ in nodes]
|
||||
|
||||
# Define node colors based on conditions
|
||||
node_colors = {node: 'red' if node not in ['192.168.20.2', '192.168.100.62', '192.168.100.28', '192.168.101.112'] else ('#176069' if node == '192.168.20.2' else 'blue') for node in nodes}
|
||||
node_name = {node: "Johan:"+" "+node if node == "192.168.101.113" else node for node in nodes }
|
||||
node_colors = {node: 'turqoise' if node == '192.168.20.2' else ('teal' if node.startswith('192.168') else ('orange' if node.startswith('10.30.') else 'beige')) for node in nodes}
|
||||
|
||||
# Create a Dash app
|
||||
#app = dash.Dash(__name__)
|
||||
#app = DjangoDash(name='dash_app', external_stylesheets=[dbc.themes.LUX])
|
||||
|
||||
#layout={'name': 'cose', 'avoidOverlap': True, 'nodeDimensionsIncludeLabels': True},
|
||||
layout={
|
||||
"name": "cose",
|
||||
"idealEdgeLength": 20,
|
||||
"nodeOverlap": 20,
|
||||
"refresh": 30,
|
||||
"fit": True,
|
||||
"padding": 3,
|
||||
"randomize": False,
|
||||
"componentSpacing": 100,
|
||||
"nodeRepulsion": 400000,
|
||||
"edgeElasticity": 100,
|
||||
"nestingFactor": 5,
|
||||
"gravity": 80,
|
||||
"numIter": 1000,
|
||||
"initialTemp": 200,
|
||||
"coolingFactor": 0.95,
|
||||
"minTemp": 1.0,
|
||||
},
|
||||
app = dash.Dash(
|
||||
__name__,
|
||||
external_scripts=external_script,
|
||||
external_stylesheets=[dbc.themes.FLATLY]
|
||||
)
|
||||
app.scripts.config.serve_locally = True
|
||||
|
||||
positions = [ {"x":random.randint(1,1000), "y":random.randint(1,30000)} for _ in nodes ]
|
||||
#positions = [ {"x":random.randint(1000,5000), "y":random.randint(1,100)} for _ in nodes ]
|
||||
|
||||
elements=[
|
||||
{'data': {'id': node, 'label': node_name[node], 'random_word': random_word, 'color': node_colors[node]}} for node, random_word in zip(nodes, random_words)
|
||||
] + [{'data': {'source': source, 'target': target, 'color':'crimson'}} for source, target in edges], # Include the edges
|
||||
|
||||
stylesheet=[
|
||||
{
|
||||
'selector': 'node',
|
||||
'style': {
|
||||
'background-color': 'data(color)',
|
||||
"width": "mapData(weight, 40, 80, 20, 60)",
|
||||
'label': 'data(label)',
|
||||
'font-size': '12px',
|
||||
'text-halign': 'center',
|
||||
'text-valign': 'top', # Adjust the text position to 'top'
|
||||
'border-width': '2px',
|
||||
'border-color': 'seagreen',
|
||||
'shadow-box': '2px',
|
||||
'content': 'data(label)',
|
||||
}
|
||||
},
|
||||
{
|
||||
'selector': 'edge',
|
||||
'style': {
|
||||
'width': 2,
|
||||
'background-opacity': 0.2, # Set the opacity for the parent node
|
||||
'line-color': 'teal',
|
||||
}
|
||||
},
|
||||
{
|
||||
'selector': 'edge:selected',
|
||||
'style': {
|
||||
'border': 'crimson',
|
||||
'border-opacity': 0.2,
|
||||
'width': 4,
|
||||
'background-opacity': 0.2, # Set the opacity for the parent node
|
||||
'line-color': 'crimson',
|
||||
}
|
||||
},
|
||||
{
|
||||
'selector': ':parent',
|
||||
'style': {
|
||||
'background-opacity': 0.2, # Set the opacity for the parent node
|
||||
}
|
||||
},
|
||||
{
|
||||
'selector': 'node:parent',
|
||||
'style': {
|
||||
'border-width': 1, # Set the border width for the parent node
|
||||
}
|
||||
},
|
||||
{
|
||||
'selector': ':selected',
|
||||
'style': {
|
||||
'border-width': 4, # Set the border width for selected nodes
|
||||
'border-color': 'crimson', # Set the border color for selected nodes
|
||||
}
|
||||
},
|
||||
],
|
||||
|
||||
# Define the app layout
|
||||
app.layout = html.Div([
|
||||
html.Div(children=[
|
||||
html.Div(children=[
|
||||
html.Div(f'Edge Details: ', style={'font-weight': 'bold', 'background':'#dfdfdf'}),
|
||||
html.Div(id='hover-data', className='bg-gray-500'),
|
||||
], className="w-96 flex-none bg-amber-500"),
|
||||
html.Div([
|
||||
cyto.Cytoscape(
|
||||
id='network-graph',
|
||||
layout={'name': 'cose', 'avoidOverlap': True, 'nodeDimensionsIncludeLabels': True},
|
||||
elements=[
|
||||
{'data': {'id': node, 'label': node, 'random_word': random_word, 'color': node_colors[node], 'position':pos}} for node, random_word, pos in zip(nodes, random_words, positions)
|
||||
] + [{'data': {'source': source, 'target': target}} for source, target in edges], # Include the edges
|
||||
style={'width': '100%', 'height': '94vh'},
|
||||
stylesheet=[
|
||||
{
|
||||
'selector': 'node',
|
||||
'style': {
|
||||
'background-color': 'data(color)',
|
||||
'label': 'data(label)',
|
||||
'font-size': '12px',
|
||||
'text-halign': 'center',
|
||||
'text-valign': 'top', # Adjust the text position to 'top'
|
||||
'border-width': '1px',
|
||||
'border-color': 'gray',
|
||||
'shadow-box': '2px',
|
||||
'content': 'data(label)',
|
||||
}
|
||||
},
|
||||
{
|
||||
'selector': 'edge',
|
||||
'style': {
|
||||
'width': 2,
|
||||
'line-color': 'gray',
|
||||
}
|
||||
},
|
||||
{
|
||||
'selector': ':parent',
|
||||
'style': {
|
||||
'background-opacity': 0.2, # Set the opacity for the parent node
|
||||
}
|
||||
},
|
||||
{
|
||||
'selector': 'node:parent',
|
||||
'style': {
|
||||
'border-width': 1, # Set the border width for the parent node
|
||||
}
|
||||
},
|
||||
{
|
||||
'selector': ':selected',
|
||||
'style': {
|
||||
'border-width': 2, # Set the border width for selected nodes
|
||||
'border-color': 'aqua', # Set the border color for selected nodes
|
||||
}
|
||||
},
|
||||
],
|
||||
className="bg-surface-200 flex-none",
|
||||
),
|
||||
]),], className="flex w-full h-full"),
|
||||
html.Div(children=[
|
||||
dcc.Tabs([
|
||||
dcc.Tab(label='Tab 1',children=[
|
||||
html.Div(children=[
|
||||
html.Div(f'Node Details: ', className='p-2'),
|
||||
dcc.Slider(id='slider', min=1, max=500, step=20),
|
||||
html.Button('Reset', id='bt-reset', className='btn bg-teal-500 p-2 text-white hover:bg-teal-600'),
|
||||
dcc.Dropdown(['cose', 'cola', 'random', 'circle'], 'cose', id='graph-mode-dropdown'),
|
||||
dcc.Input(
|
||||
id="input_{}".format("text"),
|
||||
type="text",
|
||||
placeholder="input type {}"
|
||||
),
|
||||
html.Div(id='out-all-types', className=''),
|
||||
], className='p-2 space-y-2'),
|
||||
]),
|
||||
dcc.Tab(label='Tab 2', children=[
|
||||
html.Div(children=[
|
||||
html.Div(f'Edge Details: '),
|
||||
html.Div(id='hover-data', className=''),
|
||||
], className='space-y-2 p-2'),
|
||||
]),
|
||||
]),
|
||||
], className="w-96 flex-none"),
|
||||
html.Div(children=[
|
||||
dcc.Tabs([
|
||||
dcc.Tab(label='OAM',children=[
|
||||
html.Div(children=[
|
||||
cyto.Cytoscape(
|
||||
id='network-graph',
|
||||
layout=layout[0],
|
||||
zoomingEnabled=True,
|
||||
zoom=0.9,
|
||||
responsive=True,
|
||||
elements=elements[0],
|
||||
style={'width': '100%', 'height': '88vh', 'background':'#dfdfdf'},
|
||||
stylesheet=stylesheet[0],
|
||||
)
|
||||
], className="bg-amber-50 p-4 flex"),
|
||||
]),
|
||||
dcc.Tab(label='VPN Registration',children=[
|
||||
html.Div(children=[
|
||||
cyto.Cytoscape(
|
||||
id='network-graph',
|
||||
layout=layout[0],
|
||||
zoomingEnabled=True,
|
||||
zoom=0.9,
|
||||
responsive=True,
|
||||
elements=elements[0],
|
||||
style={'width': '100%', 'height': '88vh', 'background':'#efefef'},
|
||||
stylesheet=stylesheet[0],
|
||||
)
|
||||
], className="bg-amber-50 p-4"),
|
||||
]),
|
||||
]),
|
||||
], className="w-[calc(100%-24rem)] h-[calc(100%-16rem)]"), ],
|
||||
className="flex w-full h-full"),
|
||||
])
|
||||
|
||||
@app.callback(
|
||||
[Output('network-graph', 'zoom'),
|
||||
Output('network-graph', 'elements')],
|
||||
[Input('bt-reset', 'n_clicks')]
|
||||
)
|
||||
def reset_layout(n_clicks):
|
||||
print(n_clicks, 'click')
|
||||
return [0.5, elements[0]]
|
||||
|
||||
@app.callback(
|
||||
Output('network-graph', 'layout'),
|
||||
[Input('graph-mode-dropdown', 'value')]
|
||||
)
|
||||
def graph_mode(value):
|
||||
print(value)
|
||||
tmp_layout = layout[0]
|
||||
tmp_layout['name'] = value
|
||||
|
||||
return tmp_layout
|
||||
|
||||
# @app.callback(
|
||||
# Output('network-graph', 'layout'),
|
||||
# [Input('slider', 'value')]
|
||||
# )
|
||||
# def update_zoom(value):
|
||||
# print(value)
|
||||
# tmp_layout = layout[0]
|
||||
# tmp_layout['idealEdgeLength'] = value
|
||||
|
||||
# return tmp_layout
|
||||
|
||||
|
||||
@app.callback(
|
||||
Output('hover-data', 'children'),
|
||||
Input('network-graph', 'mouseoverNodeData')
|
||||
Input('network-graph', 'tapNodeData')
|
||||
)
|
||||
def display_hover_data(data):
|
||||
if data:
|
||||
@@ -288,9 +405,19 @@ def plot_group_graph(nodes, edges):
|
||||
])
|
||||
else:
|
||||
return ''
|
||||
|
||||
@app.callback(
|
||||
Output("out-all-types", "children"),
|
||||
Input("input_{}".format('text'), "value"),
|
||||
)
|
||||
def cb_render(*vals):
|
||||
return html.Div([
|
||||
html.Div(f'Input: {vals}', style={'font-weight': 'bold', 'background':'#dfdfdf'}),
|
||||
])
|
||||
|
||||
|
||||
if __name__ == '__main__':
|
||||
app.run_server(debug=False)
|
||||
app.run_server(debug=True, use_reloader=True)
|
||||
|
||||
|
||||
def plot_net_graph(nodes, edges):
|
||||
@@ -486,6 +613,4 @@ def plot_graph(in_nodes, in_edges):
|
||||
)
|
||||
fig.show()
|
||||
|
||||
# Push Config
|
||||
line_process()
|
||||
#plot_graph()
|
||||
#plot_group_graph()
|
||||
|
||||
Reference in New Issue
Block a user