Mirror of the OpenDaylight NeXt UI Toolkit gerrit project

Install / Use

/learn @CiscoDevNet/NeXt

About this skill

Quality Score

0/100

README

NeXt UI Framework

NeXt UI toolkit is an HTML5/JavaScript based toolkit for network web application. It provides a network centric topology UI component featuring high performance and rich functionality. NeXt can display large complex network topologies, aggregated network nodes, traffic/path/tunnel/group visualizations and it includes different layout algorithms, map overlays, and preset user friendly interactions. NeXt can work together with DLUX to build ODL apps.

Homepage : https://wiki.opendaylight.org/view/NeXt:Main

UI Toolkit Quicklook : https://www.youtube.com/watch?v=gBsUDu8aucs

Current version : 0.9

Key Features

Large complex network topologies
Aggregated network nodes
Traffic/path/tunnel/group visualizations
Different layout algorithms
Map overlays
Preset user-friendly interactions

File structure

next/
  |- css/
  |  |- next.css // next stylesheet file
  |  |- next.min.css // minimized stylesheet file
  |  |- next-componentized.css
  |  |- next-componentized.min.css
  |- js
  |  |- next.js // next js library
  |  |- next.min.js // minimized js library
  |- fonts/ // font resources foler
  |  doc/ //APi manual
  |- README.md

Quick start

Create a HTML file.

<!DOCTYPE html>
<html>
    <head>
        <link rel="stylesheet" href="css/next.css">
        <script src="js/next.js"></script>
    </head>
    <body>
    <script type="text/javascript">
    //next code
    </script>
    </body>
</html>

Edit next code

// Initialize a topology component
var topo = new nx.graphic.Topology({
});

// Create new app
var app = new nx.ui.Application();

// Attach topo to app
topo.attach(app);

Open html file with Chrome

Tutorials and Sample code

Tutorials : https://wiki.opendaylight.org/view/NeXt:Main

Opendaylight sample code intergrate DLUX with NeXt: https://github.com/CiscoDevNet/opendaylight-sample-apps

BIERMAN : https://github.com/zverevalexei/bierman-gui

Build instructions from source code

Git : https://git.opendaylight.org/gerrit/p/next

Environment requirements

Node

build process

npm install
grunt

Who's Using NeXt

Cisco
Verizon
AT&T (DIRECTV)

Are you NeXt?

Bugs

Open Bugs

Team

Aikepaer Abuduweili (aaikepae@cisco.com)
Kang Li (lkang2@cisco.com)
Alexei Zverev (alzverev@cisco.com)
Xu Yangyang(yangyxu@cisco.com)

Related Skills

node-connect

349.0k

Diagnose OpenClaw node connection and pairing failures for Android, iOS, and macOS companion apps

frontend-design

109.4k

Create distinctive, production-grade frontend interfaces with high design quality. Use this skill when the user asks to build web components, pages, or applications. Generates creative, polished code that avoids generic AI aesthetics.

openai-whisper-api

349.0k

Transcribe audio via OpenAI Audio Transcriptions API (Whisper).

qqbot-media

349.0k

QQBot 富媒体收发能力。使用 <qqmedia> 标签，系统根据文件扩展名自动识别类型（图片/语音/视频/文件）。