Digi
/
dey-examples
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

connectcore-demo-example: set relative path for static resources 

https://onedigi.atlassian.net/browse/DEL-7742

Signed-off-by: Tatiana Leon <Tatiana.Leon@digi.com>
This commit is contained in:
Tatiana Leon 2022-05-02 18:49:15 +02:00
parent 3a2d37f8e1
commit 59cb0dd752
4 changed files with 92 additions and 90 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

100
connectcore-demo-example/index.html
View File

@ -9,10 +9,10 @@ Digi Demo - Dashboard
<link href="https://cdn.jsdelivr.net/gh/gitbrent/bootstrap4-toggle@3.6.1/css/bootstrap4-toggle.min.css" rel="stylesheet"> <link href="https://cdn.jsdelivr.net/gh/gitbrent/bootstrap4-toggle@3.6.1/css/bootstrap4-toggle.min.css" rel="stylesheet">
<link href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-slider/9.7.3/css/bootstrap-slider.min.css" rel="stylesheet"> <link href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-slider/9.7.3/css/bootstrap-slider.min.css" rel="stylesheet">
<link rel="stylesheet" href="/static/css/login.css"> <link rel="stylesheet" href="./static/css/login.css">
<link rel="stylesheet" href="/static/css/general.css"> <link rel="stylesheet" href="./static/css/general.css">
<link rel="stylesheet" href="/static/css/toastr.css"> <link rel="stylesheet" href="./static/css/toastr.css">
<link rel="stylesheet" href="/static/css/xterm.css"> <link rel="stylesheet" href="./static/css/xterm.css">
<!-- JS, Popper.js, and jQuery --> <!-- JS, Popper.js, and jQuery -->
<script src="https://code.jquery.com/jquery-3.5.1.min.js" integrity="sha256-9/aliU8dGd2tb6OSsuzixeV4y/faTqgFtohetphbbj0=" crossorigin="anonymous"></script> <script src="https://code.jquery.com/jquery-3.5.1.min.js" integrity="sha256-9/aliU8dGd2tb6OSsuzixeV4y/faTqgFtohetphbbj0=" crossorigin="anonymous"></script>
@ -25,18 +25,18 @@ Digi Demo - Dashboard
<script> <script>
google.charts.load("current", {"packages":["line"]}); google.charts.load("current", {"packages":["line"]});
</script> </script>
<script type="text/javascript" src="/static/js/common.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/devices.js"></script>
<script type="text/javascript" src="/static/js/jquery.pjax.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/jquery.matchHeight-min.js"></script>
<script type="text/javascript" src="/static/js/toastr.min.js"></script> <script type="text/javascript" src="./static/js/toastr.min.js"></script>
</head> </head>
<body> <body>
<nav id="topBar" class="navbar navbar-expand-lg navbar-light bg-white shadow-sm"> <nav id="topBar" class="navbar navbar-expand-lg navbar-light bg-white shadow-sm">
<div class="nav-container"> <div class="nav-container">
<a id="banner-link" class="navbar-brand align-middle" href="/"> <a id="banner-link" class="navbar-brand align-middle" href="/">
<div class="d-flex align-items-baseline"> <div class="d-flex align-items-baseline">
<img id="banner-logo" class="banner-icon" src="/static/images/Digi_logo_banner.png"> <img id="banner-logo" class="banner-icon" src="./static/images/Digi_logo_banner.png">
<p id="banner-text">ConnectCore Demo</p> <p id="banner-text">ConnectCore Demo</p>
</div> </div>
</a> </a>
@ -47,7 +47,7 @@ Digi Demo - Dashboard
<div class="data-usage-panel-wrapper"> <div class="data-usage-panel-wrapper">
<div id="data_usage_loading" class="data-usage-loading"> <div id="data_usage_loading" class="data-usage-loading">
<div class="data-usage-loading-background"></div> <div class="data-usage-loading-background"></div>
<img class="data-usage-loading-icon" src="/static/images/loading.gif" alt="Loading..." /> <img class="data-usage-loading-icon" src="./static/images/loading.gif" alt="Loading..." />
<div class="data-usage-loading-text">Loading data...</div> <div class="data-usage-loading-text">Loading data...</div>
</div> </div>
<div id="data_usage_content" class="data-usage-content"> <div id="data_usage_content" class="data-usage-content">
@ -140,26 +140,26 @@ Digi Demo - Dashboard
</div> </div>
</div> </div>
<div> <div>
<img src="/static/images/board.png" class="device-title-img" title="Device"> <img src="./static/images/board.png" class="device-title-img" title="Device">
</div> </div>
<div id="device-name"></div> <div id="device-name"></div>
<div> <div>
<img src="/static/images/status_offline.png" id="device-connection-status" class="device-title-img" title="Offline"> <img src="./static/images/status_offline.png" id="device-connection-status" class="device-title-img" title="Offline">
</div> </div>
<div class="vertical-separator"></div> <div class="vertical-separator"></div>
<div> <div>
<button id="devices-list-button" class="btn widget-button" type="button" value="0" onclick="window.open('/','_self');"> <button id="devices-list-button" class="btn widget-button" type="button" value="0" onclick="window.open('/','_self');">
<img src="/static/images/devices_list_gray.png" id="devices-list-icon" class="devices-list-icon" data-toggle="tooltip" data-placement="bottom" title="Open devices list"> <img src="./static/images/devices_list_gray.png" id="devices-list-icon" class="devices-list-icon" data-toggle="tooltip" data-placement="bottom" title="Open devices list">
</button> </button>
<button id="data_usage_button" class="btn widget-button" type="button" value="0" onclick="toggleDataUsagePanel();"> <button id="data_usage_button" class="btn widget-button" type="button" value="0" onclick="toggleDataUsagePanel();">
<img src="/static/images/data_usage.png" id="data_usage_icon" class="devices-list-icon" data-toggle="tooltip" data-placement="bottom" title="Show data usage"> <img src="./static/images/data_usage.png" id="data_usage_icon" class="devices-list-icon" data-toggle="tooltip" data-placement="bottom" title="Show data usage">
</button> </button>
</div> </div>
<div class="vertical-separator"></div> <div class="vertical-separator"></div>
<div class="dropdown digi-gray" id="profile-container"> <div class="dropdown digi-gray" id="profile-container">
<button class="btn dropdown-toggle" type="button" id="profileMenuButton" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"> <button class="btn dropdown-toggle" type="button" id="profileMenuButton" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
<img id="profile-logo" class="banner-icon" src="/static/images/profile_gray.png"> <img id="profile-logo" class="banner-icon" src="./static/images/profile_gray.png">
</button> </button>
<div class="dropdown-menu shadow-sm" aria-labelledby="profileMenuButton"> <div class="dropdown-menu shadow-sm" aria-labelledby="profileMenuButton">
<a class="dropdown-item" href="/access/logout/">Log out</a> <a class="dropdown-item" href="/access/logout/">Log out</a>
@ -219,7 +219,7 @@ Digi Demo - Dashboard
<div class="container-fluid"> <div class="container-fluid">
<div id="loading"> <div id="loading">
<img id="loading-image" src="/static/images/loading.gif" alt="Loading..." /> <img id="loading-image" src="./static/images/loading.gif" alt="Loading..." />
</div> </div>
<div id="pjax-container"> <div id="pjax-container">
@ -231,7 +231,7 @@ Digi Demo - Dashboard
<div class="card-body"> <div class="card-body">
<div id="dashboard_device" class="dashboard-device"> <div id="dashboard_device" class="dashboard-device">
<div id="loading_popup" class="popup popup-loading shadow"> <div id="loading_popup" class="popup popup-loading shadow">
<img class="popup-item" src="/static/images/loading.gif" alt="Loading..." /> <img class="popup-item" src="./static/images/loading.gif" alt="Loading..." />
<div id="loading_popup_message" class="popup-text">Loading device...</div> <div id="loading_popup_message" class="popup-text">Loading device...</div>
</div> </div>
<div id="info_popup" class="popup popup-info shadow d-none"> <div id="info_popup" class="popup popup-info shadow d-none">
@ -256,10 +256,10 @@ Digi Demo - Dashboard
<div id="device_toolbar" class="device-toolbar"> <div id="device_toolbar" class="device-toolbar">
<div id="platform_name" class="platform-name"></div> <div id="platform_name" class="platform-name"></div>
<div id="device-button-show-info" class="device-button" onclick="setInfoPanelsVisible(true)"> <div id="device-button-show-info" class="device-button" onclick="setInfoPanelsVisible(true)">
<img id="device-button-show-info-img" src="/static/images/show_info.png" width="32px" data-toggle="tooltip" data-placement="bottom" title="Show all information panels"> <img id="device-button-show-info-img" src="./static/images/show_info.png" width="32px" data-toggle="tooltip" data-placement="bottom" title="Show all information panels">
</div> </div>
<div id="device-button-hide-info" class="device-button" onclick="setInfoPanelsVisible(false)"> <div id="device-button-hide-info" class="device-button" onclick="setInfoPanelsVisible(false)">
<img id="device-button-hide-info-img" src="/static/images/hide_info.png" width="32px" data-toggle="tooltip" data-placement="bottom" title="Hide all information panels"> <img id="device-button-hide-info-img" src="./static/images/hide_info.png" width="32px" data-toggle="tooltip" data-placement="bottom" title="Hide all information panels">
</div> </div>
<div class="samples-info-container"> <div class="samples-info-container">
<table> <table>
@ -283,7 +283,7 @@ Digi Demo - Dashboard
<div class="samples-info-overlay" title="Change device sampling settings" data-toggle="tooltip" data-placement="bottom" onclick="changeSampleRate()"></div> <div class="samples-info-overlay" title="Change device sampling settings" data-toggle="tooltip" data-placement="bottom" onclick="changeSampleRate()"></div>
</div> </div>
</div> </div>
<div id="board_image_container" class="device-board-container"> <div id="board_image_container" class="device-board-container">
<center><img id="board_image" class="device-board-image" width="" src=""/></center> <center><img id="board_image" class="device-board-image" width="" src=""/></center>
</div> </div>
</div> </div>
@ -403,7 +403,7 @@ Digi Demo - Dashboard
<div id="console" class="terminal"></div> <div id="console" class="terminal"></div>
<div id="console_hover_background" class="console-hover-background"></div> <div id="console_hover_background" class="console-hover-background"></div>
<div id="console_loading" class="popup shadow" style="top: 33%"> <div id="console_loading" class="popup shadow" style="top: 33%">
<img class="popup-item" src="/static/images/loading.gif" alt="Connecting..." /> <img class="popup-item" src="./static/images/loading.gif" alt="Connecting..." />
<div class="popup-text">Connecting...</div> <div class="popup-text">Connecting...</div>
</div> </div>
<div id="console_error_reconnect" class="popup popup-error-reconnect shadow"> <div id="console_error_reconnect" class="popup popup-error-reconnect shadow">
@ -622,7 +622,7 @@ Digi Demo - Dashboard
</div> </div>
<div id="filesystem_items_container" class="filesystem-items-container"></div> <div id="filesystem_items_container" class="filesystem-items-container"></div>
<div id="filesystem_loading" class="popup shadow" style="top: 33%"> <div id="filesystem_loading" class="popup shadow" style="top: 33%">
<img class="popup-item" src="/static/images/loading.gif" alt="Loading..." /> <img class="popup-item" src="./static/images/loading.gif" alt="Loading..." />
<div class="popup-text">Loading...</div> <div class="popup-text">Loading...</div>
</div> </div>
</div> </div>
@ -833,7 +833,7 @@ Digi Demo - Dashboard
<div id="led_panel" class="led-panel shadow-sm panel-tooltip" onclick="toggleUserLED()"> <div id="led_panel" class="led-panel shadow-sm panel-tooltip" onclick="toggleUserLED()">
<span class="panel-tooltip-text">Toggle LED</span> <span class="panel-tooltip-text">Toggle LED</span>
<span id="led_panel_arrow" class="panel-arrow"></span> <span id="led_panel_arrow" class="panel-arrow"></span>
<img id ="led_image" class="led-image" src="/static/images/led_bubble.png"/> <img id ="led_image" class="led-image" src="./static/images/led_bubble.png"/>
</div> </div>
<div id="flash_memory_panel_area" class="panel-area panel-tooltip" onclick="toggleInfoPanelVisibility('flash_memory')"> <div id="flash_memory_panel_area" class="panel-area panel-tooltip" onclick="toggleInfoPanelVisibility('flash_memory')">
<span class="panel-tooltip-text">Flash memory</span> <span class="panel-tooltip-text">Flash memory</span>
@ -881,18 +881,18 @@ Digi Demo - Dashboard
// Change the color of the device toolbar icons when hovering. // Change the color of the device toolbar icons when hovering.
$("#device-button-hide-info").on({ $("#device-button-hide-info").on({
"mouseover" : function() { "mouseover" : function() {
$("#device-button-hide-info-img").attr("src", "/static/images/hide_info_green.png"); $("#device-button-hide-info-img").attr("src", "./static/images/hide_info_green.png");
}, },
"mouseout" : function() { "mouseout" : function() {
$("#device-button-hide-info-img").attr("src", "/static/images/hide_info.png"); $("#device-button-hide-info-img").attr("src", "./static/images/hide_info.png");
} }
}); });
$("#device-button-show-info").on({ $("#device-button-show-info").on({
"mouseover" : function() { "mouseover" : function() {
$("#device-button-show-info-img").attr("src", "/static/images/show_info_green.png"); $("#device-button-show-info-img").attr("src", "./static/images/show_info_green.png");
}, },
"mouseout" : function() { "mouseout" : function() {
$("#device-button-show-info-img").attr("src", "/static/images/show_info.png"); $("#device-button-show-info-img").attr("src", "./static/images/show_info.png");
} }
}); });
// Register file upload change event. // Register file upload change event.
@ -906,10 +906,10 @@ Digi Demo - Dashboard
// Change image of the LED panel when hovering. // Change image of the LED panel when hovering.
$("#led_panel").on({ $("#led_panel").on({
"mouseover" : function() { "mouseover" : function() {
$("#led_image").attr("src", "/static/images/led_bubble_hover.png"); $("#led_image").attr("src", "./static/images/led_bubble_hover.png");
}, },
"mouseout" : function() { "mouseout" : function() {
$("#led_image").attr("src", "/static/images/led_bubble.png"); $("#led_image").attr("src", "./static/images/led_bubble.png");
} }
}); });
}); });
@ -944,10 +944,10 @@ Digi Demo - Dashboard
$(document).ready(function() { $(document).ready(function() {
$("#banner-link").on({ $("#banner-link").on({
"mouseover" : function() { "mouseover" : function() {
$("#banner-logo").attr("src", "/static/images/Digi_logo_banner_gray.png"); $("#banner-logo").attr("src", "./static/images/Digi_logo_banner_gray.png");
}, },
"mouseout" : function() { "mouseout" : function() {
$("#banner-logo").attr("src", "/static/images/Digi_logo_banner.png"); $("#banner-logo").attr("src", "./static/images/Digi_logo_banner.png");
} }
}); });
}); });
@ -964,7 +964,7 @@ Digi Demo - Dashboard
$( document ).ready(function() { $( document ).ready(function() {
$("#profile-container").on({ $("#profile-container").on({
"mouseover" : function() { "mouseover" : function() {
$("#profile-logo").attr("src", "/static/images/profile_green.png"); $("#profile-logo").attr("src", "./static/images/profile_green.png");
if (!$("#profile-container").hasClass("digi-green")) { if (!$("#profile-container").hasClass("digi-green")) {
$("#profile-container").addClass("digi-green"); $("#profile-container").addClass("digi-green");
} }
@ -973,7 +973,7 @@ $( document ).ready(function() {
} }
}, },
"mouseout" : function() { "mouseout" : function() {
$("#profile-logo").attr("src", "/static/images/profile_gray.png"); $("#profile-logo").attr("src", "./static/images/profile_gray.png");
if (!$("#profile-container").hasClass("digi-gray")) { if (!$("#profile-container").hasClass("digi-gray")) {
$("#profile-container").addClass("digi-gray"); $("#profile-container").addClass("digi-gray");
} }
@ -986,18 +986,18 @@ $( document ).ready(function() {
</script> </script>
<!-- Local JS files and functions --> <!-- Local JS files and functions -->
<script type="text/javascript" src="/static/js/sidebar.js"></script> <script type="text/javascript" src="./static/js/sidebar.js"></script>
<script type="text/javascript" src="/static/js/ccimx8mm-dvk.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/ccimx8m-nano.js"></script>
<script type="text/javascript" src="/static/js/ccimx8x-sbc-pro.js"></script> <script type="text/javascript" src="./static/js/ccimx8x-sbc-pro.js"></script>
<script type="text/javascript" src="/static/js/dashboard.js"></script> <script type="text/javascript" src="./static/js/dashboard.js"></script>
<script type="text/javascript" src="/static/js/management.js"></script> <script type="text/javascript" src="./static/js/management.js"></script>
<script type="text/javascript" src="/static/js/history.js"></script> <script type="text/javascript" src="./static/js/history.js"></script>
<script type="text/javascript" src="/static/js/xterm.js"></script> <script type="text/javascript" src="./static/js/xterm.js"></script>
<script type="text/javascript" src="/static/js/xterm-addon-fit.js"></script> <script type="text/javascript" src="./static/js/xterm-addon-fit.js"></script>
<script type="text/javascript" src="/static/js/console.js"></script> <script type="text/javascript" src="./static/js/console.js"></script>
<script type="text/javascript" src="/static/js/file-system.js"></script> <script type="text/javascript" src="./static/js/file-system.js"></script>
<script type="text/javascript" src="/static/js/data-usage.js"></script> <script type="text/javascript" src="./static/js/data-usage.js"></script>
<script> <script>
$(document).ready(function() { $(document).ready(function() {
// Don't show the loading spinner at the beginning. Initial page // Don't show the loading spinner at the beginning. Initial page
@ -1048,19 +1048,19 @@ $( document ).ready(function() {
// Change the color of the devices icon when hovering. // Change the color of the devices icon when hovering.
$("#devices-list-button").on({ $("#devices-list-button").on({
"mouseover" : function() { "mouseover" : function() {
$("#devices-list-icon").attr("src", "/static/images/devices_list_green.png"); $("#devices-list-icon").attr("src", "./static/images/devices_list_green.png");
}, },
"mouseout" : function() { "mouseout" : function() {
$("#devices-list-icon").attr("src", "/static/images/devices_list_gray.png"); $("#devices-list-icon").attr("src", "./static/images/devices_list_gray.png");
} }
}); });
// Change the color of the data usage icon when hovering. // Change the color of the data usage icon when hovering.
$("#data_usage_button").on({ $("#data_usage_button").on({
"mouseover" : function() { "mouseover" : function() {
$("#data_usage_icon").attr("src", "/static/images/data_usage_green.png"); $("#data_usage_icon").attr("src", "./static/images/data_usage_green.png");
}, },
"mouseout" : function() { "mouseout" : function() {
$("#data_usage_icon").attr("src", "/static/images/data_usage.png"); $("#data_usage_icon").attr("src", "./static/images/data_usage.png");
} }
}); });

76
connectcore-demo-example/management.html
View File

@ -9,10 +9,10 @@ Digi Demo - Management
<link href="https://cdn.jsdelivr.net/gh/gitbrent/bootstrap4-toggle@3.6.1/css/bootstrap4-toggle.min.css" rel="stylesheet"> <link href="https://cdn.jsdelivr.net/gh/gitbrent/bootstrap4-toggle@3.6.1/css/bootstrap4-toggle.min.css" rel="stylesheet">
<link href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-slider/9.7.3/css/bootstrap-slider.min.css" rel="stylesheet"> <link href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-slider/9.7.3/css/bootstrap-slider.min.css" rel="stylesheet">
<link rel="stylesheet" href="/static/css/login.css"> <link rel="stylesheet" href="./static/css/login.css">
<link rel="stylesheet" href="/static/css/general.css"> <link rel="stylesheet" href="./static/css/general.css">
<link rel="stylesheet" href="/static/css/toastr.css"> <link rel="stylesheet" href="./static/css/toastr.css">
<link rel="stylesheet" href="/static/css/xterm.css"> <link rel="stylesheet" href="./static/css/xterm.css">
<!-- JS, Popper.js, and jQuery --> <!-- JS, Popper.js, and jQuery -->
<script src="https://code.jquery.com/jquery-3.5.1.min.js" integrity="sha256-9/aliU8dGd2tb6OSsuzixeV4y/faTqgFtohetphbbj0=" crossorigin="anonymous"></script> <script src="https://code.jquery.com/jquery-3.5.1.min.js" integrity="sha256-9/aliU8dGd2tb6OSsuzixeV4y/faTqgFtohetphbbj0=" crossorigin="anonymous"></script>
@ -25,18 +25,18 @@ Digi Demo - Management
<script> <script>
google.charts.load("current", {"packages":["line"]}); google.charts.load("current", {"packages":["line"]});
</script> </script>
<script type="text/javascript" src="/static/js/common.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/devices.js"></script>
<script type="text/javascript" src="/static/js/jquery.pjax.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/jquery.matchHeight-min.js"></script>
<script type="text/javascript" src="/static/js/toastr.min.js"></script> <script type="text/javascript" src="./static/js/toastr.min.js"></script>
</head> </head>
<body> <body>
<nav id="topBar" class="navbar navbar-expand-lg navbar-light bg-white shadow-sm"> <nav id="topBar" class="navbar navbar-expand-lg navbar-light bg-white shadow-sm">
<div class="nav-container"> <div class="nav-container">
<a id="banner-link" class="navbar-brand align-middle" href="/"> <a id="banner-link" class="navbar-brand align-middle" href="/">
<div class="d-flex align-items-baseline"> <div class="d-flex align-items-baseline">
<img id="banner-logo" class="banner-icon" src="/static/images/Digi_logo_banner.png"> <img id="banner-logo" class="banner-icon" src="./static/images/Digi_logo_banner.png">
<p id="banner-text">ConnectCore Demo</p> <p id="banner-text">ConnectCore Demo</p>
</div> </div>
</a> </a>
@ -47,7 +47,7 @@ Digi Demo - Management
<div class="data-usage-panel-wrapper"> <div class="data-usage-panel-wrapper">
<div id="data_usage_loading" class="data-usage-loading"> <div id="data_usage_loading" class="data-usage-loading">
<div class="data-usage-loading-background"></div> <div class="data-usage-loading-background"></div>
<img class="data-usage-loading-icon" src="/static/images/loading.gif" alt="Loading..." /> <img class="data-usage-loading-icon" src="./static/images/loading.gif" alt="Loading..." />
<div class="data-usage-loading-text">Loading data...</div> <div class="data-usage-loading-text">Loading data...</div>
</div> </div>
<div id="data_usage_content" class="data-usage-content"> <div id="data_usage_content" class="data-usage-content">
@ -140,26 +140,26 @@ Digi Demo - Management
</div> </div>
</div> </div>
<div> <div>
<img src="/static/images/board.png" class="device-title-img" title="Device"> <img src="./static/images/board.png" class="device-title-img" title="Device">
</div> </div>
<div id="device-name"></div> <div id="device-name"></div>
<div> <div>
<img src="/static/images/status_offline.png" id="device-connection-status" class="device-title-img" title="Offline"> <img src="./static/images/status_offline.png" id="device-connection-status" class="device-title-img" title="Offline">
</div> </div>
<div class="vertical-separator"></div> <div class="vertical-separator"></div>
<div> <div>
<button id="devices-list-button" class="btn widget-button" type="button" value="0" onclick="window.open('/','_self');"> <button id="devices-list-button" class="btn widget-button" type="button" value="0" onclick="window.open('/','_self');">
<img src="/static/images/devices_list_gray.png" id="devices-list-icon" class="devices-list-icon" data-toggle="tooltip" data-placement="bottom" title="Open devices list"> <img src="./static/images/devices_list_gray.png" id="devices-list-icon" class="devices-list-icon" data-toggle="tooltip" data-placement="bottom" title="Open devices list">
</button> </button>
<button id="data_usage_button" class="btn widget-button" type="button" value="0" onclick="toggleDataUsagePanel();"> <button id="data_usage_button" class="btn widget-button" type="button" value="0" onclick="toggleDataUsagePanel();">
<img src="/static/images/data_usage.png" id="data_usage_icon" class="devices-list-icon" data-toggle="tooltip" data-placement="bottom" title="Show data usage"> <img src="./static/images/data_usage.png" id="data_usage_icon" class="devices-list-icon" data-toggle="tooltip" data-placement="bottom" title="Show data usage">
</button> </button>
</div> </div>
<div class="vertical-separator"></div> <div class="vertical-separator"></div>
<div class="dropdown digi-gray" id="profile-container"> <div class="dropdown digi-gray" id="profile-container">
<button class="btn dropdown-toggle" type="button" id="profileMenuButton" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"> <button class="btn dropdown-toggle" type="button" id="profileMenuButton" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
<img id="profile-logo" class="banner-icon" src="/static/images/profile_gray.png"> <img id="profile-logo" class="banner-icon" src="./static/images/profile_gray.png">
</button> </button>
<div class="dropdown-menu shadow-sm" aria-labelledby="profileMenuButton"> <div class="dropdown-menu shadow-sm" aria-labelledby="profileMenuButton">
<a class="dropdown-item" href="/access/logout/">Log out</a> <a class="dropdown-item" href="/access/logout/">Log out</a>
@ -219,7 +219,7 @@ Digi Demo - Management
<div class="container-fluid"> <div class="container-fluid">
<div id="loading"> <div id="loading">
<img id="loading-image" src="/static/images/loading.gif" alt="Loading..." /> <img id="loading-image" src="./static/images/loading.gif" alt="Loading..." />
</div> </div>
<div id="pjax-container"> <div id="pjax-container">
@ -228,7 +228,7 @@ Digi Demo - Management
<div class="row justify-content-lg-center"> <div class="row justify-content-lg-center">
<div class="col-lg-12 col-xl-12"> <div class="col-lg-12 col-xl-12">
<div id="loading_popup" class="popup popup-loading shadow"> <div id="loading_popup" class="popup popup-loading shadow">
<img class="popup-item" src="/static/images/loading.gif" alt="Loading..." /> <img class="popup-item" src="./static/images/loading.gif" alt="Loading..." />
<div id="loading_popup_message" class="popup-text">Loading information...</div> <div id="loading_popup_message" class="popup-text">Loading information...</div>
</div> </div>
<div id="info_popup" class="popup popup-info shadow d-none"> <div id="info_popup" class="popup popup-info shadow d-none">
@ -403,10 +403,10 @@ Digi Demo - Management
$(document).ready(function() { $(document).ready(function() {
$("#banner-link").on({ $("#banner-link").on({
"mouseover" : function() { "mouseover" : function() {
$("#banner-logo").attr("src", "/static/images/Digi_logo_banner_gray.png"); $("#banner-logo").attr("src", "./static/images/Digi_logo_banner_gray.png");
}, },
"mouseout" : function() { "mouseout" : function() {
$("#banner-logo").attr("src", "/static/images/Digi_logo_banner.png"); $("#banner-logo").attr("src", "./static/images/Digi_logo_banner.png");
} }
}); });
}); });
@ -423,7 +423,7 @@ Digi Demo - Management
$( document ).ready(function() { $( document ).ready(function() {
$("#profile-container").on({ $("#profile-container").on({
"mouseover" : function() { "mouseover" : function() {
$("#profile-logo").attr("src", "/static/images/profile_green.png"); $("#profile-logo").attr("src", "./static/images/profile_green.png");
if (!$("#profile-container").hasClass("digi-green")) { if (!$("#profile-container").hasClass("digi-green")) {
$("#profile-container").addClass("digi-green"); $("#profile-container").addClass("digi-green");
} }
@ -432,7 +432,7 @@ $( document ).ready(function() {
} }
}, },
"mouseout" : function() { "mouseout" : function() {
$("#profile-logo").attr("src", "/static/images/profile_gray.png"); $("#profile-logo").attr("src", "./static/images/profile_gray.png");
if (!$("#profile-container").hasClass("digi-gray")) { if (!$("#profile-container").hasClass("digi-gray")) {
$("#profile-container").addClass("digi-gray"); $("#profile-container").addClass("digi-gray");
} }
@ -445,18 +445,18 @@ $( document ).ready(function() {
</script> </script>
<!-- Local JS files and functions --> <!-- Local JS files and functions -->
<script type="text/javascript" src="/static/js/sidebar.js"></script> <script type="text/javascript" src="./static/js/sidebar.js"></script>
<script type="text/javascript" src="/static/js/ccimx8mm-dvk.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/ccimx8m-nano.js"></script>
<script type="text/javascript" src="/static/js/ccimx8x-sbc-pro.js"></script> <script type="text/javascript" src="./static/js/ccimx8x-sbc-pro.js"></script>
<script type="text/javascript" src="/static/js/dashboard.js"></script> <script type="text/javascript" src="./static/js/dashboard.js"></script>
<script type="text/javascript" src="/static/js/management.js"></script> <script type="text/javascript" src="./static/js/management.js"></script>
<script type="text/javascript" src="/static/js/history.js"></script> <script type="text/javascript" src="./static/js/history.js"></script>
<script type="text/javascript" src="/static/js/xterm.js"></script> <script type="text/javascript" src="./static/js/xterm.js"></script>
<script type="text/javascript" src="/static/js/xterm-addon-fit.js"></script> <script type="text/javascript" src="./static/js/xterm-addon-fit.js"></script>
<script type="text/javascript" src="/static/js/console.js"></script> <script type="text/javascript" src="./static/js/console.js"></script>
<script type="text/javascript" src="/static/js/file-system.js"></script> <script type="text/javascript" src="./static/js/file-system.js"></script>
<script type="text/javascript" src="/static/js/data-usage.js"></script> <script type="text/javascript" src="./static/js/data-usage.js"></script>
<script> <script>
$(document).ready(function() { $(document).ready(function() {
// Don't show the loading spinner at the beginning. Initial page // Don't show the loading spinner at the beginning. Initial page
@ -507,19 +507,19 @@ $( document ).ready(function() {
// Change the color of the devices icon when hovering. // Change the color of the devices icon when hovering.
$("#devices-list-button").on({ $("#devices-list-button").on({
"mouseover" : function() { "mouseover" : function() {
$("#devices-list-icon").attr("src", "/static/images/devices_list_green.png"); $("#devices-list-icon").attr("src", "./static/images/devices_list_green.png");
}, },
"mouseout" : function() { "mouseout" : function() {
$("#devices-list-icon").attr("src", "/static/images/devices_list_gray.png"); $("#devices-list-icon").attr("src", "./static/images/devices_list_gray.png");
} }
}); });
// Change the color of the data usage icon when hovering. // Change the color of the data usage icon when hovering.
$("#data_usage_button").on({ $("#data_usage_button").on({
"mouseover" : function() { "mouseover" : function() {
$("#data_usage_icon").attr("src", "/static/images/data_usage_green.png"); $("#data_usage_icon").attr("src", "./static/images/data_usage_green.png");
}, },
"mouseout" : function() { "mouseout" : function() {
$("#data_usage_icon").attr("src", "/static/images/data_usage.png"); $("#data_usage_icon").attr("src", "./static/images/data_usage.png");
} }
}); });

4
connectcore-demo-example/static/js/common.js
View File

@ -431,7 +431,9 @@ function roundToGigaBytes(kiloBytes) {
// Returns whether the dashboard page is showing or not. // Returns whether the dashboard page is showing or not.
function isDashboardShowing() { function isDashboardShowing() {
return window.location.pathname.indexOf("dashboard") > -1; if (window.location.pathname == "/")
return true;
return window.location.pathname.indexOf("index") > -1;
} }
// Returns whether the management page is showing or not. // Returns whether the management page is showing or not.

2
connectcore-demo-example/static/js/dashboard.js
View File

@ -339,7 +339,7 @@ function drawDevice() {
// Initialize variables. // Initialize variables.
var boardImage = document.getElementById(ID_BOARD_IMAGE); var boardImage = document.getElementById(ID_BOARD_IMAGE);
// Draw the device board image. // Draw the device board image.
$(boardImage).attr("src", "../static/images/" + device.getBoardImage()); $(boardImage).attr("src", "./static/images/" + device.getBoardImage());
boardImage.style.width = device.getBoardImageScale() + "%"; boardImage.style.width = device.getBoardImageScale() + "%";
boardImage.style.maxWidth = device.getBoardImageScale() + "%"; boardImage.style.maxWidth = device.getBoardImageScale() + "%";
boardImage.style.height = "auto"; boardImage.style.height = "auto";