Skip to content
GitLab
Commit a1022252 authored by Pithon Kabiro's avatar Pithon Kabiro
Browse files

Add basic list with sensor names

parent b81e04f1
Show whitespace changes
Inline Side-by-side
index.html
View file @ a1022252
...@@ -17,6 +17,10 @@ ...@@ -17,6 +17,10 @@
crossorigin="anonymous" crossorigin="anonymous"
/> />
<!--
CUSTOM CSS -->
<link href="css/stylesCustom.css" rel="stylesheet" />
<!-- Font Awesome icons --> <!-- Font Awesome icons -->
<script <script
src="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.1/js/all.min.js" src="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.1/js/all.min.js"
...@@ -68,6 +72,7 @@ ...@@ -68,6 +72,7 @@
Custom JS --> Custom JS -->
<script defer type="module" src="js/appCesium.js"></script> <script defer type="module" src="js/appCesium.js"></script>
<script defer type="module" src="js/appChart.js"></script> <script defer type="module" src="js/appChart.js"></script>
<script defer src="js/dropDownList.js"></script>
</head> </head>
<body class="sb-nav-fixed"> <body class="sb-nav-fixed">
<nav class="sb-topnav navbar navbar-expand navbar-dark bg-dark"> <nav class="sb-topnav navbar navbar-expand navbar-dark bg-dark">
...@@ -111,12 +116,50 @@ ...@@ -111,12 +116,50 @@
<i class="fas fa-globe mr-1"></i> <i class="fas fa-globe mr-1"></i>
3D Visualization 3D Visualization
</div> </div>
<div class="card-body"> <div class="card-body" id="cesiumGlobeContainerParent">
<div <div class="custom-toolbar" id="menu">
id="cesiumGlobeContainer" <!-- <h2>Sample NYC Geocaches</h2>
width="100%" <span><strong>Camera Mode</strong></span>
height="40" <div class="nowrap">
></div> <input
id="freeMode"
name="source"
type="radio"
checked
/>
<label for="freeMode">Free</label>
</div>
<div class="nowrap">
<input id="droneMode" name="source" type="radio" />
<label for="droneMode">Drone View</label>
</div>
<br /> -->
<span><strong>Sensor</strong></span>
<div class="nowrap">
<select id="drop-down--sensor">
<option value="none">None</option>
<option value="vorlauf">Vorlauftemperatur</option>
<option value="ruecklauf">Rücklauftemperatur</option>
<option value="durchfluss">Durchfluss</option>
<option value="leistung">Leistung</option>
<option value="energie">Energie</option>
<option value="energieVerbr">Energie_VERBR</option>
</select>
</div>
<br />
<!-- <span><strong>Display Options</strong></span>
<div class="nowrap">
<input id="shadows" type="checkbox" />
<label for="shadows">Shadows</label>
</div>
<div class="nowrap">
<input id="neighborhoods" type="checkbox" checked />
<label for="neighborhoods">Neighborhoods</label>
</div>
<br /> -->
</div>
<div id="cesiumGlobeContainer"></div>
</div> </div>
</div> </div>
</div> </div>
......
public/css/stylesCustom.css 0 → 100644
View file @ a1022252
#cesiumGlobeContainerParent {
/* Overwrite the padding in the dashboard's template; padding = 1.25rem */
/* padding: 0rem; */
/* To allow the dropdown to be placed on top of the 3D globe (1 of 2) */
position: relative;
}
#cesiumGlobeContainer {
width: 100%;
height: 40%;
margin: 0;
padding: 0;
overflow: hidden;
font-family: sans-serif;
background: #000;
}
.custom-toolbar {
display: inline-block;
background: rgba(42, 42, 42, 0.7);
border-radius: 5px;
border: 1px solid #444;
padding: 5px 10px;
color: #fff;
line-height: 150%;
font-size: small;
/* To allow the dropdown to be placed on top of the 3D globe (2 of 2) */
position: absolute;
top: 1.25rem;
left: 1.25rem;
z-index: 10;
}
public/js/dropDownList.js 0 → 100644
View file @ a1022252
"use strict";
const dropDownSensor = document.querySelector("#drop-down--sensor");
const selectSensorFromDropDownList = function () {
const selectedSensor =
dropDownSensor.options[dropDownSensor.selectedIndex].value;
switch (selectedSensor) {
case "none":
break;
case "vorlauf":
console.log("VORLAUF");
break;
case "ruecklauf":
console.log("RUECKLAUF");
break;
case "durchfluss":
console.log("DURCHFLUSS");
break;
case "leistung":
console.log("LEISTUNG");
break;
case "energie":
console.log("ENERGIE");
break;
case "energieVerbr":
console.log("ENERGIE_VERBR");
break;
default:
console.log("Default case");
}
};
dropDownSensor.addEventListener("change", selectSensorFromDropDownList);
Supports Markdown
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment

Dies ist die Gitlab-Instanz des Transferportals der Hochschule für Technik Stuttgart. Hier geht es zurück zum Portal