connectcore-demo-example: add NPU section to display and run NPU demos
https://onedigi.atlassian.net/browse/CCS-10 Signed-off-by: David Escalona <david.escalona@digi.com>
This commit is contained in:
David Escalona
parent
b71aa2e72b
commit
5113d8e340
|
|
@ -102,12 +102,15 @@ BT_REQUEST_TIMEOUT = 5000
|
|||
COMMAND_PING = "ping -q -w 1 -c 1 -I %s 8.8.8.8"
|
||||
COMMAND_READ_SN = "fw_printenv -n serial#"
|
||||
|
||||
NPU_DEMOS_FILE = "static/assets/npu_demos.json"
|
||||
|
||||
# Variables.
|
||||
log = logging.getLogger(APP_NAME)
|
||||
last_cpu_work = 0
|
||||
last_cpu_total = 0
|
||||
led_status = {}
|
||||
fw_process = None
|
||||
npu_demos = None
|
||||
|
||||
|
||||
class RequestHandler(http.server.SimpleHTTPRequestHandler):
|
||||
|
|
@ -624,6 +627,46 @@ class RequestHandler(http.server.SimpleHTTPRequestHandler):
|
|||
self.wfile.write(json.dumps(result).encode(encoding="utf_8"))
|
||||
else:
|
||||
self.wfile.write(json.dumps({"data": json.dumps(result)}).encode(encoding="utf_8"))
|
||||
elif re.search("/ajax/get_npu_info", self.path) is not None:
|
||||
# Set the response headers.
|
||||
self._set_headers(200)
|
||||
# Fill NPU info.
|
||||
info = {
|
||||
"has-npu-demos": str(has_npu_demos()).lower()
|
||||
}
|
||||
# Send the JSON value.
|
||||
self.wfile.write(json.dumps(info).encode(encoding="utf_8"))
|
||||
elif re.search("/ajax/get_npu_demos", self.path) is not None:
|
||||
# Set the response headers.
|
||||
self._set_headers(200)
|
||||
# Get NPU demos data.
|
||||
platform_id = get_platform_id()
|
||||
demos = get_npu_demos_for_platform(platform_id)
|
||||
self.wfile.write(json.dumps({"data": json.dumps(demos)}).encode(encoding="utf_8"))
|
||||
elif re.search("/ajax/run_npu_demo", self.path) is not None:
|
||||
# Set the response headers.
|
||||
self._set_headers(200)
|
||||
# Get the JSON data.
|
||||
data = self.rfile.read(int(self.headers["Content-Length"]))
|
||||
demo_id = json.loads(data.decode("utf-8")).get("demo_id", None)
|
||||
# Get the demo with the given ID.
|
||||
demo = get_npu_demo(demo_id)
|
||||
if demo:
|
||||
# Get the command to execute.
|
||||
script = None
|
||||
platform_id = get_platform_id()
|
||||
for comp_platform in demo.get("compatible_platforms", []):
|
||||
if comp_platform.get("platform", None) == platform_id:
|
||||
script = comp_platform.get("launch_script", None)
|
||||
break
|
||||
if script:
|
||||
# Execute the demo.
|
||||
exec_cmd_nowait(script)
|
||||
self.wfile.write("{}".encode(encoding="utf_8"))
|
||||
else:
|
||||
self.wfile.write(json.dumps({"error": "NPU demo launch script not found."}).encode(encoding="utf_8"))
|
||||
else:
|
||||
self.wfile.write(json.dumps({"error": "NPU demo not found."}).encode(encoding="utf_8"))
|
||||
else:
|
||||
# Forbidden.
|
||||
self._set_headers(403)
|
||||
|
|
@ -1766,6 +1809,93 @@ def set_bluetooth_device_configuration(device, config_data):
|
|||
return data
|
||||
|
||||
|
||||
def has_npu_demos():
|
||||
"""
|
||||
Returns whether the device has NPU demos available or not.
|
||||
|
||||
Returns:
|
||||
Boolean: True if device has NPU demos available, False otherwise.
|
||||
"""
|
||||
return len(get_npu_demos_for_platform(get_platform_id())) > 0
|
||||
|
||||
|
||||
def load_npu_demos():
|
||||
"""
|
||||
Returns the loaded NPU demos or parses the JSON file with NPU demos
|
||||
metadata.
|
||||
|
||||
Returns:
|
||||
list: A list of dictionaries, each representing an NPU demo,
|
||||
`None` if error
|
||||
"""
|
||||
global npu_demos
|
||||
|
||||
# Return the demos if they are already loaded.
|
||||
if npu_demos:
|
||||
return npu_demos
|
||||
|
||||
# Initialize the demos var.
|
||||
npu_demos = None
|
||||
|
||||
# Build demos file path.
|
||||
npu_demos_file_path = os.path.join(os.path.dirname(__file__), NPU_DEMOS_FILE)
|
||||
try:
|
||||
with open(npu_demos_file_path, 'r') as file:
|
||||
content = json.load(file)
|
||||
if content:
|
||||
npu_demos = content.get("npu_demos", [])
|
||||
except FileNotFoundError:
|
||||
log.error("Error reading NPU demos: File '%s' not found." % NPU_DEMOS_FILE)
|
||||
except json.JSONDecodeError:
|
||||
log.error("Error reading NPU demos: File '%s' contains invalid JSON." % NPU_DEMOS_FILE)
|
||||
except OSError as exc:
|
||||
log.error("Error reading NPU demos: %s" % str(exc))
|
||||
|
||||
return npu_demos
|
||||
|
||||
|
||||
def get_npu_demo(demo_id):
|
||||
"""
|
||||
Returns the NPU demo matching the given ID.
|
||||
|
||||
Args:
|
||||
demo_id (str): ID of the NPU demo to get.
|
||||
|
||||
Returns:
|
||||
Dictionary: The NPU demo for the given ID, None if the demo is not
|
||||
found.
|
||||
"""
|
||||
demos = load_npu_demos()
|
||||
if not demos:
|
||||
return None
|
||||
|
||||
return next((demo for demo in demos if demo.get("id", None) == demo_id), None)
|
||||
|
||||
|
||||
def get_npu_demos_for_platform(platform_name):
|
||||
"""
|
||||
Returns a list of NPU demos that are compatible with the given platform.
|
||||
|
||||
Args:
|
||||
platform_name (str): The name of the platform to filter NPU demos by.
|
||||
|
||||
Returns:
|
||||
list: A list of dictionaries, each representing an NPU demo compatible
|
||||
with the given platform.
|
||||
"""
|
||||
compatible_demos = []
|
||||
demos = load_npu_demos()
|
||||
|
||||
if demos:
|
||||
for demo in demos:
|
||||
for platform in demo.get('compatible_platforms', []):
|
||||
if platform.get('platform') == platform_name and file_exists(platform.get('launch_script')):
|
||||
compatible_demos.append(demo)
|
||||
break
|
||||
|
||||
return compatible_demos
|
||||
|
||||
|
||||
def get_platform_id():
|
||||
"""
|
||||
Returns the running platform ID.
|
||||
|
|
@ -1891,6 +2021,19 @@ def write_file(path, value):
|
|||
return True
|
||||
|
||||
|
||||
def file_exists(file_path):
|
||||
"""
|
||||
Determines whether the given file path exists or not.
|
||||
|
||||
Args:
|
||||
file_path (String): Absolute path of the file to check.
|
||||
|
||||
Returns:
|
||||
Boolean: 'True' if the file exists, 'False' otherwise.
|
||||
"""
|
||||
return os.path.isfile(file_path)
|
||||
|
||||
|
||||
def resize_to(value, to, divider=1024):
|
||||
"""
|
||||
Resizes the given value.
|
||||
|
|
|
|||
|
|
@ -68,6 +68,14 @@ Digi Demo - Dashboard
|
|||
</div>
|
||||
</a>
|
||||
</li>
|
||||
<li id="section_npu">
|
||||
<a data-pjax href="npu.html" class="list-group-item list-group-item-action d-flex align-items-center">
|
||||
<div class="d-flex w-100 justify-content-start align-items-center">
|
||||
<span class="digi-menu-icon fas fa-brain fa-fw fa-lg mr-3"></span>
|
||||
<span class="menu-collapsed">Machine Learning</span>
|
||||
</div>
|
||||
</a>
|
||||
</li>
|
||||
<li id="section_network">
|
||||
<a data-pjax href="network.html" class="list-group-item list-group-item-action d-flex align-items-center">
|
||||
<div class="d-flex w-100 justify-content-start align-items-center">
|
||||
|
|
@ -824,6 +832,7 @@ Digi Demo - Dashboard
|
|||
<script type="text/javascript" src="./static/js/dashboard.js"></script>
|
||||
<script type="text/javascript" src="./static/js/network.js"></script>
|
||||
<script type="text/javascript" src="./static/js/multimedia.js"></script>
|
||||
<script type="text/javascript" src="./static/js/npu.js"></script>
|
||||
<script type="text/javascript" src="./static/js/management.js"></script>
|
||||
<script type="text/javascript" src="./static/js/file-system.js"></script>
|
||||
<script>
|
||||
|
|
|
|||
|
|
@ -68,6 +68,14 @@ Digi Demo - Management
|
|||
</div>
|
||||
</a>
|
||||
</li>
|
||||
<li id="section_npu">
|
||||
<a data-pjax href="npu.html" class="list-group-item list-group-item-action d-flex align-items-center">
|
||||
<div class="d-flex w-100 justify-content-start align-items-center">
|
||||
<span class="digi-menu-icon fas fa-brain fa-fw fa-lg mr-3"></span>
|
||||
<span class="menu-collapsed">Machine Learning</span>
|
||||
</div>
|
||||
</a>
|
||||
</li>
|
||||
<li id="section_network">
|
||||
<a data-pjax href="network.html" class="list-group-item list-group-item-action d-flex align-items-center">
|
||||
<div class="d-flex w-100 justify-content-start align-items-center">
|
||||
|
|
@ -307,6 +315,7 @@ Digi Demo - Management
|
|||
<script type="text/javascript" src="./static/js/dashboard.js"></script>
|
||||
<script type="text/javascript" src="./static/js/network.js"></script>
|
||||
<script type="text/javascript" src="./static/js/multimedia.js"></script>
|
||||
<script type="text/javascript" src="./static/js/npu.js"></script>
|
||||
<script type="text/javascript" src="./static/js/management.js"></script>
|
||||
<script type="text/javascript" src="./static/js/file-system.js"></script>
|
||||
<script>
|
||||
|
|
|
|||
|
|
@ -68,6 +68,14 @@ Digi Demo - Multimedia
|
|||
</div>
|
||||
</a>
|
||||
</li>
|
||||
<li id="section_npu">
|
||||
<a data-pjax href="npu.html" class="list-group-item list-group-item-action d-flex align-items-center">
|
||||
<div class="d-flex w-100 justify-content-start align-items-center">
|
||||
<span class="digi-menu-icon fas fa-brain fa-fw fa-lg mr-3"></span>
|
||||
<span class="menu-collapsed">Machine Learning</span>
|
||||
</div>
|
||||
</a>
|
||||
</li>
|
||||
<li id="section_network">
|
||||
<a data-pjax href="network.html" class="list-group-item list-group-item-action d-flex align-items-center">
|
||||
<div class="d-flex w-100 justify-content-start align-items-center">
|
||||
|
|
@ -248,6 +256,7 @@ Digi Demo - Multimedia
|
|||
<script type="text/javascript" src="./static/js/dashboard.js"></script>
|
||||
<script type="text/javascript" src="./static/js/network.js"></script>
|
||||
<script type="text/javascript" src="./static/js/multimedia.js"></script>
|
||||
<script type="text/javascript" src="./static/js/npu.js"></script>
|
||||
<script type="text/javascript" src="./static/js/management.js"></script>
|
||||
<script type="text/javascript" src="./static/js/file-system.js"></script>
|
||||
<script>
|
||||
|
|
|
|||
|
|
@ -68,6 +68,14 @@ Digi Demo - Network
|
|||
</div>
|
||||
</a>
|
||||
</li>
|
||||
<li id="section_npu">
|
||||
<a data-pjax href="npu.html" class="list-group-item list-group-item-action d-flex align-items-center">
|
||||
<div class="d-flex w-100 justify-content-start align-items-center">
|
||||
<span class="digi-menu-icon fas fa-brain fa-fw fa-lg mr-3"></span>
|
||||
<span class="menu-collapsed">Machine Learning</span>
|
||||
</div>
|
||||
</a>
|
||||
</li>
|
||||
<li id="section_network">
|
||||
<a data-pjax href="network.html" class="list-group-item list-group-item-action d-flex align-items-center">
|
||||
<div class="d-flex w-100 justify-content-start align-items-center">
|
||||
|
|
@ -526,6 +534,7 @@ Digi Demo - Network
|
|||
<script type="text/javascript" src="./static/js/dashboard.js"></script>
|
||||
<script type="text/javascript" src="./static/js/network.js"></script>
|
||||
<script type="text/javascript" src="./static/js/multimedia.js"></script>
|
||||
<script type="text/javascript" src="./static/js/npu.js"></script>
|
||||
<script type="text/javascript" src="./static/js/management.js"></script>
|
||||
<script type="text/javascript" src="./static/js/file-system.js"></script>
|
||||
<script>
|
||||
|
|
|
|||
|
|
@ -0,0 +1,236 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<title>
|
||||
Digi Demo - NPU
|
||||
</title>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<link rel="stylesheet" href="./static/css/stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css" integrity="sha384-MCw98/SFnGE8fJT3GXwEOngsV7Zt27NXFoaoApmYm81iuXoPkFOJwJ8ERdknLPMO" crossorigin="anonymous">
|
||||
<link href="./static/css/cdn.jsdelivr.net/gh/gitbrent/bootstrap4-toggle@3.6.1/css/bootstrap4-toggle.min.css" rel="stylesheet">
|
||||
<link href="./static/css/cdnjs.cloudflare.com/ajax/libs/bootstrap-slider/9.7.3/css/bootstrap-slider.min.css" rel="stylesheet">
|
||||
<link href="./static/css/fontawesome5.15.4/all.min.css" rel="stylesheet">
|
||||
|
||||
<link rel="stylesheet" href="./static/css/general.css">
|
||||
<link rel="stylesheet" href="./static/css/toastr.css">
|
||||
|
||||
<!-- JS, Popper.js, and jQuery -->
|
||||
<script src="./static/js/code.jquery.com/jquery-3.5.1.min.js" integrity="sha256-9/aliU8dGd2tb6OSsuzixeV4y/faTqgFtohetphbbj0=" crossorigin="anonymous"></script>
|
||||
<script src="./static/js/cdn.jsdelivr.net/npm/popper.js@1.16.1/dist/umd/popper.min.js" integrity="sha384-9/reFTGAW83EW2RDu2S0VKaIzap3H66lZH81PoYlFhbGU+6BZp6G7niu735Sk7lN" crossorigin="anonymous"></script>
|
||||
<script src="./static/js/stackpath.bootstrapcdn.com/bootstrap/4.5.2/js/bootstrap.min.js" integrity="sha384-B4gt1jrGC7Jh4AgTPSdUtOBvfO8shuf57BaghqFfPlYxofvL8/KUEfYiJOMMV+rV" crossorigin="anonymous"></script>
|
||||
<script src="./static/js/cdn.jsdelivr.net/gh/gitbrent/bootstrap4-toggle@3.6.1/js/bootstrap4-toggle.min.js"></script>
|
||||
<script src="./static/js/cdnjs.cloudflare.com/ajax/libs/bootstrap-slider/9.7.3/bootstrap-slider.min.js"></script>
|
||||
<script type="text/javascript" src="./static/js/common.js"></script>
|
||||
<script type="text/javascript" src="./static/js/devices.js"></script>
|
||||
<script type="text/javascript" src="./static/js/jquery.pjax.js"></script>
|
||||
<script type="text/javascript" src="./static/js/jquery.matchHeight-min.js"></script>
|
||||
<script type="text/javascript" src="./static/js/toastr.min.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<nav id="topBar" class="navbar navbar-expand-lg navbar-light bg-white shadow-sm">
|
||||
<div class="nav-container">
|
||||
<a id="banner-link" class="navbar-brand align-middle" href="index.html">
|
||||
<div class="d-flex align-items-baseline">
|
||||
<img id="banner-logo" class="banner-icon" src="./static/images/Digi_logo_banner.png">
|
||||
<p id="banner-text">ConnectCore Demo</p>
|
||||
</div>
|
||||
</a>
|
||||
<div class="nav-right-container">
|
||||
<div>
|
||||
<img src="./static/images/board.png" class="device-title-img" title="Device">
|
||||
</div>
|
||||
<div id="device-name">DEY DEVICE</div>
|
||||
</div>
|
||||
</div>
|
||||
</nav>
|
||||
|
||||
<div class="bg-light" id="body-row">
|
||||
|
||||
<!-- Sidebar https://www.codeply.com/go/3e0RAjccRO/bootstrap-4-collapsing-sidebar-menu# -->
|
||||
<div id="sidebar-container" class="sidebar-expanded d-none d-md-block">
|
||||
<!-- d-* hides the Sidebar in smaller devices. Its items can be kept on the Navbar 'Menu' -->
|
||||
<div id="sidebar-contents">
|
||||
<!-- Bootstrap List Group -->
|
||||
|
||||
<ul id="sections" data-pjax class="list-group">
|
||||
<li id="section_dashboard">
|
||||
<a data-pjax href="index.html" class="list-group-item list-group-item-action d-flex align-items-center">
|
||||
<div class="d-flex w-100 justify-content-start align-items-center">
|
||||
<span class="digi-menu-icon fas fa-tachometer-alt fa-fw fa-lg mr-3"></span>
|
||||
<span class="menu-collapsed">Dashboard</span>
|
||||
</div>
|
||||
</a>
|
||||
</li>
|
||||
<li id="section_multimedia">
|
||||
<a data-pjax href="multimedia.html" class="list-group-item list-group-item-action d-flex align-items-center">
|
||||
<div class="d-flex w-100 justify-content-start align-items-center">
|
||||
<span class="digi-menu-icon fas fa-film fa-fw fa-lg mr-3"></span>
|
||||
<span class="menu-collapsed">Multimedia</span>
|
||||
</div>
|
||||
</a>
|
||||
</li>
|
||||
<li id="section_npu">
|
||||
<a data-pjax href="npu.html" class="list-group-item list-group-item-action d-flex align-items-center">
|
||||
<div class="d-flex w-100 justify-content-start align-items-center">
|
||||
<span class="digi-menu-icon fas fa-brain fa-fw fa-lg mr-3"></span>
|
||||
<span class="menu-collapsed">Machine Learning</span>
|
||||
</div>
|
||||
</a>
|
||||
</li>
|
||||
<li id="section_network">
|
||||
<a data-pjax href="network.html" class="list-group-item list-group-item-action d-flex align-items-center">
|
||||
<div class="d-flex w-100 justify-content-start align-items-center">
|
||||
<span class="digi-menu-icon fas fa-network-wired fa-fw fa-lg mr-3"></span>
|
||||
<span class="menu-collapsed">Network</span>
|
||||
</div>
|
||||
</a>
|
||||
</li>
|
||||
<li id="section_management">
|
||||
<a data-pjax href="management.html" class="list-group-item list-group-item-action d-flex align-items-center">
|
||||
<div class="d-flex w-100 justify-content-start align-items-center">
|
||||
<span class="digi-menu-icon fas fa-cog fa-fw fa-lg mr-3"></span>
|
||||
<span class="menu-collapsed">Management</span>
|
||||
</div>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
<ul id="collapsator" class="list-group">
|
||||
<a href="#top" data-toggle="sidebar-collapse" class="list-group-item list-group-item-action d-flex align-items-center">
|
||||
<div class="d-flex w-100 justify-content-start align-items-center">
|
||||
<span id="collapse-icon" class="digi-menu-icon fas fa-fw fa-lg mr-3"></span>
|
||||
<span id="collapse-text" class="menu-collapsed">Collapse</span>
|
||||
</div>
|
||||
</a>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="container-fluid">
|
||||
|
||||
<div id="loading">
|
||||
<img id="loading-image" src="./static/images/loading.gif" alt="Loading..." />
|
||||
</div>
|
||||
<div id="pjax-container">
|
||||
|
||||
<div class="row justify-content-lg-center">
|
||||
<div class="col-lg-12 col-xl-12">
|
||||
<div id="loading_popup" class="popup popup-loading shadow">
|
||||
<img class="popup-item" src="./static/images/loading.gif" alt="Loading..." />
|
||||
<div id="loading_popup_message" class="popup-text">Loading information...</div>
|
||||
</div>
|
||||
<div id="info_popup" class="popup popup-info shadow d-none">
|
||||
<div id="info_popup_title" class="popup-title">Error</div>
|
||||
<div id="info_popup_message" class="popup-text">-</div>
|
||||
</div>
|
||||
<div id="loading_wrapper" class="loading-wrapper element-grayed">
|
||||
<div class="card shadow-sm">
|
||||
<div class="card-body">
|
||||
<h5 class="card-title">NPU demos</h5>
|
||||
<!-- NPU items section -->
|
||||
<div id="npu_demos_container" class="row">
|
||||
</div> <!-- NPU items -->
|
||||
</div> <!-- card body -->
|
||||
</div> <!-- card shadow -->
|
||||
</div> <!-- loading wrapper -->
|
||||
</div> <!-- col -->
|
||||
</div> <!-- row justify -->
|
||||
<script>
|
||||
$(document).ready(function() {
|
||||
// Reset variables.
|
||||
readingNPUInfo = false;
|
||||
npuInfoRead = false;
|
||||
// Initialize page.
|
||||
initializeNPUPage();
|
||||
});
|
||||
</script>
|
||||
</div> <!-- pjax-container -->
|
||||
</div> <!-- container-fluid -->
|
||||
</div> <!-- bg-light -->
|
||||
|
||||
<script>
|
||||
$(document).ready(function() {
|
||||
$("#banner-link").on({
|
||||
"mouseover" : function() {
|
||||
$("#banner-logo").attr("src", "./static/images/Digi_logo_banner_gray.png");
|
||||
},
|
||||
"mouseout" : function() {
|
||||
$("#banner-logo").attr("src", "./static/images/Digi_logo_banner.png");
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
// Enable the tooltip library.
|
||||
$(function() {
|
||||
$('[data-toggle="tooltip"]').tooltip();
|
||||
});
|
||||
</script>
|
||||
|
||||
<!-- Local JS files and functions -->
|
||||
<script type="text/javascript" src="./static/js/sidebar.js"></script>
|
||||
<script type="text/javascript" src="./static/js/ccmp133-dvk.js"></script>
|
||||
<script type="text/javascript" src="./static/js/ccmp157-dvk.js"></script>
|
||||
<script type="text/javascript" src="./static/js/ccmp255-dvk.js"></script>
|
||||
<script type="text/javascript" src="./static/js/ccimx6ulsbc.js"></script>
|
||||
<script type="text/javascript" src="./static/js/ccimx8mm-dvk.js"></script>
|
||||
<script type="text/javascript" src="./static/js/ccimx8m-nano.js"></script>
|
||||
<script type="text/javascript" src="./static/js/ccimx8x-sbc-pro.js"></script>
|
||||
<script type="text/javascript" src="./static/js/ccimx93-dvk.js"></script>
|
||||
<script type="text/javascript" src="./static/js/ccimx91-dvk.js"></script>
|
||||
<script type="text/javascript" src="./static/js/ccimx6sbc.js"></script>
|
||||
<script type="text/javascript" src="./static/js/ccimx6qpsbc.js"></script>
|
||||
<script type="text/javascript" src="./static/js/dashboard.js"></script>
|
||||
<script type="text/javascript" src="./static/js/network.js"></script>
|
||||
<script type="text/javascript" src="./static/js/multimedia.js"></script>
|
||||
<script type="text/javascript" src="./static/js/npu.js"></script>
|
||||
<script type="text/javascript" src="./static/js/management.js"></script>
|
||||
<script type="text/javascript" src="./static/js/file-system.js"></script>
|
||||
<script>
|
||||
$(document).ready(function() {
|
||||
// Don't show the loading spinner at the beginning. Initial page
|
||||
// load is full, so not relying on AJAX.
|
||||
$("#loading").hide();
|
||||
|
||||
// Set up PJAX.
|
||||
if ($.support.pjax) {
|
||||
$.pjax.defaults.timeout = 20000;
|
||||
$.pjax.defaults.fragment = "#pjax-container";
|
||||
$(document).pjax("a[data-pjax]", "#pjax-container");
|
||||
|
||||
$(document).on("pjax:beforeSend", function() {
|
||||
// Do not load new content if there are unsaved changes.
|
||||
if ($("#save-schedule").length && !$("#save-schedule").attr("disabled") && !confirm("There are unsaved changes. Do you want to exit?"))
|
||||
return false;
|
||||
});
|
||||
|
||||
$(document).on("pjax:send", function(e) {
|
||||
setSelectedSection(e.currentTarget.activeElement);
|
||||
$("#pjax-container").hide();
|
||||
$("#loading").show();
|
||||
});
|
||||
|
||||
$(document).on("pjax:complete", function() {
|
||||
$("#loading").hide();
|
||||
$("#pjax-container").show();
|
||||
});
|
||||
}
|
||||
|
||||
// Append the URL parameters to the section links.
|
||||
var params = new URLSearchParams(window.location.search).toString();
|
||||
if (params) {
|
||||
$("#sections li").each(function(i, n) {
|
||||
n.children[0].href += "?" + params;
|
||||
});
|
||||
}
|
||||
|
||||
// Update available sections.
|
||||
updateAvailableSections();
|
||||
|
||||
// Set the selected section.
|
||||
setSelectedSection();
|
||||
});
|
||||
</script>
|
||||
|
||||
|
||||
</body>
|
||||
</html>
|
||||
|
||||
|
|
@ -0,0 +1,92 @@
|
|||
{
|
||||
"npu_demos": [
|
||||
{
|
||||
"id": "pose_estimation",
|
||||
"name": "Pose Estimation",
|
||||
"preview_image": "npu_pose_estimation.png",
|
||||
"description": "This demo detects and tracks human body joints in real-time using video input, showcasing the NPU's efficiency in handling complex computations for applications like augmented reality and sports analysis.",
|
||||
"compatible_platforms": [
|
||||
{
|
||||
"platform": "ccmp255-dvk",
|
||||
"launch_script": "/etc/demos/scripts/npu_pose_estimation.sh"
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
"id": "object_detection",
|
||||
"name": "Object Detection",
|
||||
"preview_image": "npu_object_detection.png",
|
||||
"description": "This demo detects and identifies objects in real-time using a camera, demonstrating the NPU's capability to efficiently process visual data for applications like autonomous systems and smart surveillance.",
|
||||
"compatible_platforms": [
|
||||
{
|
||||
"platform": "ccmp255-dvk",
|
||||
"launch_script": "/etc/demos/scripts/npu_object_detection.sh"
|
||||
},
|
||||
{
|
||||
"platform": "ccimx93-dvk",
|
||||
"launch_script": "/etc/demos/scripts/launch_eiq_demo_object_detection.sh"
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
"id": "image_classification",
|
||||
"name": "Image Classification",
|
||||
"preview_image": "npu_image_classification.png",
|
||||
"description": "This demo scans images with a camera and classifies them in real-time, demonstrating the NPU's ability to quickly and accurately categorize visual data for applications like inventory management and automated sorting.",
|
||||
"compatible_platforms": [
|
||||
{
|
||||
"platform": "ccmp255-dvk",
|
||||
"launch_script": "/etc/demos/scripts/npu_image_classification.sh"
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
"id": "semantic_segmentation",
|
||||
"name": "Semantic Segmentation",
|
||||
"preview_image": "npu_semantic_segmentation.png",
|
||||
"description": "This demo captures images with a camera and performs semantic segmentation in real-time, dividing the scene into distinct regions by type, perfect for applications like robotics and environmental monitoring.",
|
||||
"compatible_platforms": [
|
||||
{
|
||||
"platform": "ccmp255-dvk",
|
||||
"launch_script": "/etc/demos/scripts/npu_semantic_segmentation.sh"
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
"id": "gesture_detection",
|
||||
"name": "Gesture Detection",
|
||||
"preview_image": "npu_gesture_detection.png",
|
||||
"description": "This demo identifies and interprets hand gestures in real-time, demonstrating the NPU's capacity for responsive interaction in applications such as touchless controls, augmented reality, and smart home automation.",
|
||||
"compatible_platforms": [
|
||||
{
|
||||
"platform": "ccimx93-dvk",
|
||||
"launch_script": "/etc/demos/scripts/launch_eiq_demo_gesture_detection.sh"
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
"id": "face_recognition",
|
||||
"name": "Face Recognition",
|
||||
"preview_image": "npu_face_recognition.png",
|
||||
"description": "This demo detects and recognizes human faces in real-time using a camera, showcasing the NPU's ability to process visual data efficiently for security systems, personalized user experiences, and access control applications.",
|
||||
"compatible_platforms": [
|
||||
{
|
||||
"platform": "ccimx93-dvk",
|
||||
"launch_script": "/etc/demos/scripts/launch_eiq_demo_face_recognition.sh"
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
"id": "drowsy_detection",
|
||||
"name": "Drowsy Detection",
|
||||
"preview_image": "npu_drowsy_detection.png",
|
||||
"description": "This demo monitors and detects signs of drowsiness in real-time, using visual cues to assess alertness, highlighting the NPU's potential for enhancing safety in driver assistance systems and fatigue monitoring in workplaces.",
|
||||
"compatible_platforms": [
|
||||
{
|
||||
"platform": "ccimx93-dvk",
|
||||
"launch_script": "/etc/demos/scripts/launch_eiq_demo_dms.sh"
|
||||
}
|
||||
]
|
||||
}
|
||||
]
|
||||
}
|
||||
|
|
@ -1897,6 +1897,52 @@ body {
|
|||
}
|
||||
/* END MULTIMEDIA VIEWER */
|
||||
|
||||
/* NPU */
|
||||
.npu-container {
|
||||
color: #666666;
|
||||
padding: 20px 7px 0px 7px;
|
||||
}
|
||||
|
||||
.npu-box {
|
||||
padding-left: 0px;
|
||||
padding-right: 0px;
|
||||
}
|
||||
|
||||
.npu-item {
|
||||
cursor: pointer;
|
||||
padding: 5px;
|
||||
height: 240px;
|
||||
border: 1px solid var(--light);
|
||||
border-radius: 0px;
|
||||
text-align: center;
|
||||
background-color: white;
|
||||
box-shadow: 4px .25rem .25rem rgba(0,0,0,.075);
|
||||
}
|
||||
|
||||
.npu-item:hover {
|
||||
border: 1px solid var(--digi-green);
|
||||
}
|
||||
|
||||
.npu-title {
|
||||
padding: 0px 0px 3px 0px;
|
||||
margin-bottom: 0px;
|
||||
font-weight: bold;
|
||||
font-size: 17px;
|
||||
}
|
||||
|
||||
.npu-item hr {
|
||||
border-width: 1px;
|
||||
border-color: #CCCCCC;
|
||||
margin-top: 5px;
|
||||
}
|
||||
|
||||
.npu-item img {
|
||||
height: 200px;
|
||||
object-fit: contain;
|
||||
max-width: 100%;
|
||||
}
|
||||
/* END NPU */
|
||||
|
||||
/* CONFIG CONTROLS */
|
||||
.param-container {
|
||||
margin-top: 10px;
|
||||
|
|
|
|||
Binary file not shown.
|
After Width: | Height: | Size: 70 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 79 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 143 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 36 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 27 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 75 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 67 KiB |
|
|
@ -76,6 +76,7 @@ const ID_FLASH_MEMORY = "flash_memory";
|
|||
const ID_FLASH_SIZE = "flash_size";
|
||||
const ID_FW_STORE_PATH = "fw_store_path";
|
||||
const ID_HAS_ARROW = "has-arrow";
|
||||
const ID_HAS_NPU_DEMOS = "has-npu-demos";
|
||||
const ID_HAS_PANEL = "has-panel";
|
||||
const ID_ICON = "icon";
|
||||
const ID_ID = "id";
|
||||
|
|
@ -110,6 +111,7 @@ const ID_SAMPLE_RATE = "sample_rate";
|
|||
const ID_SECTION_DASHBOARD = "section_dashboard";
|
||||
const ID_SECTION_MANAGEMENT = "section_management";
|
||||
const ID_SECTION_MULTIMEDIA = "section_multimedia";
|
||||
const ID_SECTION_NPU = "section_npu";
|
||||
const ID_SERIAL_NUMBER = "serial_number";
|
||||
const ID_SESSION_ID = "session_id";
|
||||
const ID_SIZE = "size";
|
||||
|
|
@ -515,6 +517,11 @@ function isMultimediaShowing() {
|
|||
return window.location.pathname.indexOf("multimedia") > -1;
|
||||
}
|
||||
|
||||
// Returns whether the NPU page is showing or not.
|
||||
function isNPUShowing() {
|
||||
return window.location.pathname.indexOf("npu") > -1;
|
||||
}
|
||||
|
||||
// Returns the device name.
|
||||
function getDeviceName() {
|
||||
return new URLSearchParams(window.location.search).get(ID_DEVICE_NAME);
|
||||
|
|
@ -522,9 +529,11 @@ function getDeviceName() {
|
|||
|
||||
// Updates the available web sections.
|
||||
function updateAvailableSections() {
|
||||
// Remove multimedia section when rendering the demo from a computer.
|
||||
if (!navigator.platform.includes("aarch") && !navigator.platform.includes("arm"))
|
||||
// Remove device specific sections when rendering the demo from a computer.
|
||||
if (!navigator.platform.includes("aarch") && !navigator.platform.includes("arm")) {
|
||||
removeSection(ID_SECTION_MULTIMEDIA);
|
||||
removeSection(ID_SECTION_NPU);
|
||||
}
|
||||
// Set visible sections based on device type.
|
||||
$.post(
|
||||
"http://" + getServerAddress() + "/ajax/get_device_type",
|
||||
|
|
@ -535,6 +544,7 @@ function updateAvailableSections() {
|
|||
toastr.error("Could not get device type");
|
||||
return;
|
||||
}
|
||||
// Update multimedia section.
|
||||
switch (data[ID_DEVICE_TYPE]) {
|
||||
case CCIMX6ULSBC.DEVICE_TYPE:
|
||||
case CCMP157.DEVICE_TYPE:
|
||||
|
|
@ -547,6 +557,20 @@ function updateAvailableSections() {
|
|||
// Process error.
|
||||
processAjaxErrorResponse(response);
|
||||
});
|
||||
// Set NPU section visibility.
|
||||
$.post(
|
||||
"http://" + getServerAddress() + "/ajax/get_npu_info",
|
||||
function(data) {
|
||||
// Process answer.
|
||||
if (data[ID_HAS_NPU_DEMOS] != "true") {
|
||||
// Remove NPU section.
|
||||
removeSection(ID_SECTION_NPU);
|
||||
}
|
||||
}
|
||||
).fail(function(response) {
|
||||
// Process error.
|
||||
processAjaxErrorResponse(response);
|
||||
});
|
||||
}
|
||||
|
||||
// Removes the given section.
|
||||
|
|
|
|||
|
|
@ -0,0 +1,166 @@
|
|||
/*
|
||||
* Copyright (C) 2024, Digi International Inc.
|
||||
*
|
||||
* This Source Code Form is subject to the terms of the Mozilla Public
|
||||
* License, v. 2.0. If a copy of the MPL was not distributed with this
|
||||
* file, You can obtain one at http://mozilla.org/MPL/2.0/.
|
||||
*
|
||||
* THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES
|
||||
* WITH REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF
|
||||
* MERCHANTABILITY AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR
|
||||
* ANY SPECIAL, DIRECT, INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES
|
||||
* WHATSOEVER RESULTING FROM LOSS OF USE, DATA OR PROFITS, WHETHER IN AN
|
||||
* ACTION OF CONTRACT, NEGLIGENCE OR OTHER TORTIOUS ACTION, ARISING OUT OF
|
||||
* OR IN CONNECTION WITH THE USE OR PERFORMANCE OF THIS SOFTWARE.
|
||||
*/
|
||||
|
||||
// Constants.
|
||||
const ID_NPU_DEMOS = "npu_demos";
|
||||
const ID_NPU_IMAGE = "preview_image";
|
||||
const ID_NPU_DEMOS_CONTAINER = "npu_demos_container";
|
||||
|
||||
const CLASS_4_COLUMNS_XL = "col-xl-3"
|
||||
const CLASS_NPU_DEMO_CONTAINER = "npu-container"
|
||||
|
||||
const TEMPLATE_NPU_DEMO = "" +
|
||||
"<div class='d-flex justify-content-center align-items-center npu-box'>" +
|
||||
" <div class='npu-item' onclick='runNPUDemo(\"{0}\")'>" +
|
||||
" <div class='npu-title'>{1}</div>" +
|
||||
" <img src='./static/images/{2}' alt='{3}'>" +
|
||||
" </div>" +
|
||||
"</div>";
|
||||
const TEMPLATE_NO_DEMOS = "<p style='padding-left: 15px;'><i>No demos found</i></p>";
|
||||
|
||||
const MESSAGE_EXECUTING_NPU_DEMO = "Executing NPU demo...";
|
||||
|
||||
const HIDE_STATUS_TIMEOUT = 10000; // 10 seconds.
|
||||
|
||||
// Variables.
|
||||
var readingNPUInfo = false;
|
||||
var npuInfoRead = false;
|
||||
|
||||
// Initializes the npu page.
|
||||
function initializeNPUPage() {
|
||||
// Sanity checks.
|
||||
if (!isNPUShowing() || npuInfoRead)
|
||||
return;
|
||||
// Read NPU demos information.
|
||||
readNPUDemos();
|
||||
}
|
||||
|
||||
// Read the NPU demos information.
|
||||
function readNPUDemos() {
|
||||
// Execute only in the NPU page.
|
||||
if (!isNPUShowing() || npuInfoRead)
|
||||
return;
|
||||
// Flag reading variable.
|
||||
readingNPUInfo = true;
|
||||
// Hide the info popup.
|
||||
showInfoPopup(false);
|
||||
// Show the loading popup.
|
||||
showLoadingPopup(true, MESSAGE_LOADING_INFORMATION);
|
||||
// Send request to read NPU demos information.
|
||||
$.post(
|
||||
"http://" + getServerAddress() + "/ajax/get_npu_demos",
|
||||
function(data) {
|
||||
readingNPUInfo = false;
|
||||
// Process only in the NPU page.
|
||||
if (!isNPUShowing())
|
||||
return;
|
||||
// Hide the loading panel.
|
||||
showLoadingPopup(false);
|
||||
// Process the answer.
|
||||
processNPUDemosResponse(data);
|
||||
}
|
||||
).fail(function(response) {
|
||||
// Flag reading variable.
|
||||
readingNPUInfo = false;
|
||||
// Process only in the NPU page.
|
||||
if (!isNPUShowing())
|
||||
return;
|
||||
// Hide the loading panel.
|
||||
showLoadingPopup(false);
|
||||
// Process error.
|
||||
processAjaxErrorResponse(response);
|
||||
});
|
||||
}
|
||||
|
||||
// Processes the response of the NPU demos request.
|
||||
function processNPUDemosResponse(response) {
|
||||
// Check if there was any error in the request.
|
||||
if (!checkErrorResponse(response, false)) {
|
||||
// List the available demos.
|
||||
listNPUDemos(JSON.parse(response[ID_DATA]));
|
||||
// Flag device info read.
|
||||
npuInfoRead = true;
|
||||
}
|
||||
}
|
||||
|
||||
// Lists and draws the given NPU demos.
|
||||
function listNPUDemos(npuDemos) {
|
||||
var npuDemosContainer = document.getElementById(ID_NPU_DEMOS_CONTAINER);
|
||||
|
||||
// Process response entries and create HTML elements.
|
||||
if (npuDemos.length === 0) {
|
||||
var entryDiv = document.createElement("div");
|
||||
|
||||
entryDiv.innerHTML = TEMPLATE_NO_DEMOS;
|
||||
npuDemosContainer.appendChild(entryDiv);
|
||||
} else {
|
||||
for (var demo of npuDemos) {
|
||||
var id = demo[ID_ID];
|
||||
var name = demo[ID_NAME];
|
||||
var image = demo[ID_NPU_IMAGE];
|
||||
var entryDiv = document.createElement("div");
|
||||
|
||||
entryDiv.classList.add(CLASS_4_COLUMNS_XL);
|
||||
entryDiv.classList.add(CLASS_NPU_DEMO_CONTAINER);
|
||||
entryDiv.innerHTML = TEMPLATE_NPU_DEMO.format(id, name, image, name);
|
||||
npuDemosContainer.appendChild(entryDiv);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Runs the given NPU demo.
|
||||
function runNPUDemo(npuDemoID) {
|
||||
// Hide the info popup.
|
||||
showInfoPopup(false);
|
||||
// Show the loading popup.
|
||||
showLoadingPopup(true, MESSAGE_EXECUTING_NPU_DEMO);
|
||||
// Send request.
|
||||
$.post(
|
||||
"http://" + getServerAddress() + "/ajax/run_npu_demo",
|
||||
JSON.stringify({
|
||||
"demo_id": npuDemoID,
|
||||
}),
|
||||
function(data) {
|
||||
// Process only in the NPU page.
|
||||
if (!isNPUShowing())
|
||||
return;
|
||||
// Process answer.
|
||||
processRunNPUDemoResponse(data);
|
||||
}
|
||||
).fail(function(response) {
|
||||
// Process only in the NPU page.
|
||||
if (!isNPUShowing())
|
||||
return;
|
||||
// Hide the loading panel.
|
||||
showLoadingPopup(false);
|
||||
// Process error.
|
||||
processAjaxErrorResponse(response);
|
||||
});
|
||||
}
|
||||
|
||||
// Processes the response of the run NPU demo request.
|
||||
function processRunNPUDemoResponse(response) {
|
||||
// Check if there was any error in the request.
|
||||
checkErrorResponse(response, false);
|
||||
// Start timer to hide loading popup.
|
||||
setTimeout(() => {
|
||||
// Process only in the NPU page.
|
||||
if (!isNPUShowing())
|
||||
return;
|
||||
// Hide the loading panel.
|
||||
showLoadingPopup(false);
|
||||
}, HIDE_STATUS_TIMEOUT);
|
||||
}
|
||||
Loading…
Reference in New Issue