Commit f2e3841a authored by Patrick's avatar Patrick
Browse files

some updates:

- create home button functionality
- Menu with projects
parent a9cc721e
...@@ -320,11 +320,11 @@ ...@@ -320,11 +320,11 @@
"<img style='padding-top:10px' src='../../images/content/contentstoeckach/Stoeckach.jpg' usemap='#image-map' alt='Simply Easy Learning' width='375'>", "<img style='padding-top:10px' src='../../images/content/contentstoeckach/Stoeckach.jpg' usemap='#image-map' alt='Simply Easy Learning' width='375'>",
"<map name='image-map'>", "<map name='image-map'>",
"<area id='mapElectricityID' alt='' title='electricity' shape='rect' coords='0,93,372,117' style='color:blue;border-style:dotted;' onclick='EnergiekonzeptFunction(\"Electricity\")' />", "<area id='mapElectricityID' alt='' title='electricity' shape='rect' coords='0,93,372,117' onclick='EnergiekonzeptFunction(\"Electricity\")' />",
"<area id='mapHeatID' alt='' title='heat' shape='rect' coords='0,202,375,227' style='color:blue;border-style:dotted;' onclick='EnergiekonzeptFunction(\"heat\")' />", "<area id='mapHeatID' alt='' title='heat' shape='rect' coords='0,202,375,227' onclick='EnergiekonzeptFunction(\"heat\")' />",
"<area id='mapNatID' alt='' title='Nat' shape='rect' coords='0,449,375,474' style='color:blue;border-style:dotted;' onclick='EnergiekonzeptFunction(\"Nat\")' />", "<area id='mapNatID' alt='' title='Nat' shape='rect' coords='0,449,375,474' onclick='EnergiekonzeptFunction(\"Nat\")' />",
"<area id='mapAuxGasBoilerID' alt='' title='AuxgasBoiler' shape='rect' coords='203,407,261,445' style='color:blue;border-style:dotted;' onclick='EnergiekonzeptFunction(\"Aux Gas Boiler\")' />", "<area id='mapAuxGasBoilerID' alt='' title='AuxgasBoiler' shape='rect' coords='203,407,261,445' onclick='EnergiekonzeptFunction(\"Aux Gas Boiler\")' />",
"<area id='mapAuxHeaterID' alt='' title='AuxHeater' shape='rect' coords='293,254,353,291' style='color:blue;border-style:dotted;' onclick='EnergiekonzeptFunction(\"Aux Heater\")' />", "<area id='mapAuxHeaterID' alt='' title='AuxHeater' shape='rect' coords='293,254,353,291' onclick='EnergiekonzeptFunction(\"Aux Heater\")' />",
"<area id='mapHeatPumpID' alt='' title='HeatPump' shape='rect' coords='106,231,166,268' style='outline:none;' onclick='EnergiekonzeptFunction(\"Heat Pump\")' />", "<area id='mapHeatPumpID' alt='' title='HeatPump' shape='rect' coords='106,231,166,268' style='outline:none;' onclick='EnergiekonzeptFunction(\"Heat Pump\")' />",
"<area id='mapTubID' alt='' title='tub' shape='rect' coords='208,331,268,373' style='outline:none;' onclick='EnergiekonzeptFunction(\"Tub\")' />", "<area id='mapTubID' alt='' title='tub' shape='rect' coords='208,331,268,373' style='outline:none;' onclick='EnergiekonzeptFunction(\"Tub\")' />",
"<area id='mapTankID' alt='' title='Tank' shape='rect' coords='31,286,69,332' style='outline:none;' onclick='EnergiekonzeptFunction(\"Tank\")' />", "<area id='mapTankID' alt='' title='Tank' shape='rect' coords='31,286,69,332' style='outline:none;' onclick='EnergiekonzeptFunction(\"Tank\")' />",
...@@ -887,19 +887,19 @@ ...@@ -887,19 +887,19 @@
},{ },{
"name": "stockach", "name": "stockach",
"cameraPosition": [ "cameraPosition": [
9.200739649848082, 9.19880981069925,
48.78628375787509, 48.78073258586779,
1135.1106292376635 557.8946752995696
], ],
"groundPosition": [ "groundPosition": [
9.200516671379766, 9.20002319296369,
48.78950156895682, 48.78831698706695,
-0.003564414081662304 -0.004286617007779517
], ],
"distance": 1190.3042008503244, "distance": 1015.2020567756226,
"heading": 357.3784311885765, "heading": 6.034472681516794,
"pitch": -72.48572022202158, "pitch": -33.33958313017551,
"roll": 359.8755203745571, "roll": 0.02406619855133695,
"animate": false "animate": false
}, },
{ {
......
...@@ -140,79 +140,7 @@ ...@@ -140,79 +140,7 @@
margin: 20px 10px 0 0; margin: 20px 10px 0 0;
display: inline-block; display: inline-block;
} }
/* Css code for Dropdown Menu */
/* The container <div> - needed to position the dropdown content */
.dropdown {
position: relative;
display: inline-block;
}
/* The dropdown container <div> - needed to hold the content inside dropdown */
.dropdown-content {
right: -20px;
display: none;
position: absolute;
min-width: 150px;
box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
z-index: 1;
}
/* Accordion as a button to add expandible and collapsible menu items */
.accordion {
border: solid white;
border-width: thin;
display: block;
background-color:dimgray;
color: white;
cursor: pointer;
padding: 11px;
width: 100%;
text-align: left;
outline: none;
font-size: 15px;
transition: 0.4s;
}
/* Sub menu items inside the accordion */
.sub-menu {
line-height: 35px;
padding: 0px 20px;
background-color: dimgray;
max-height: 0;
overflow: hidden;
transition: max-height 0.2s ease-out;
}
/* Styling for text of submenu */
.sub-menu a{
text-decoration: none;
color: aliceblue;
cursor: pointer;
outline: none;
font-size: 15px;
}
.active, .accordion:hover {
background-color: darkgray;
}
/* Changing of + and - on menu expand and collapse respectively*/
.accordion:after {
content: '\002B';
color:black;
font-weight: bold;
float: right;
margin-left: 5px;
}
.active:after {
content: "\2212";
}
/* Show the dropdown menu on hover */
.dropdown:hover .dropdown-content {
display: block;
}
</style> </style>
<link rel='stylesheet' href='css/vcm_ui.css'> <link rel='stylesheet' href='css/vcm_ui.css'>
...@@ -221,7 +149,9 @@ ...@@ -221,7 +149,9 @@
<!-- // added Story --> <!-- // added Story -->
<link rel="stylesheet" href="templates/custom.css"> <link rel="stylesheet" href="templates/custom.css">
<link rel="stylesheet" href="templates/story/story.css"> <link rel="stylesheet" href="templates/story/story.css">
<link rel="stylesheet" href="templates/cus_Menu.css">
</head> </head>
<body> <body>
...@@ -234,17 +164,21 @@ ...@@ -234,17 +164,21 @@
<div class="title-box vcm_copyright_headerTitle"></div> <div class="title-box vcm_copyright_headerTitle"></div>
<!-- Drop down menu starts here --> <!-- Drop down menu starts here -->
<div class="dropdown hidden" style="float: right; right:20px"> <div class="dropdown hidden" style="float: right; right:20px">
<i class="fa fa-bars" style="font-size:1.8rem;color: antiquewhite;"></i> <i class="fa fa-bars" id="dropdownMenu" style="font-size:1.8rem;color: antiquewhite; margin-top:1rem;"></i>
<div class="dropdown-content"> <div class="dropdown-content">
<button class="accordion">Menu 1</button> <button class="accordion">Partizipation</button>
<div class="sub-menu"> <div class="sub-menu">
<a href="#">Sub Menu 1</a> <a href="#" onclick="showtourSpecific('menu')">Böckingerstraße</a>
</div> </div>
<button class="accordion">Menu 2</button> <button class="accordion">Energy</button>
<div class="sub-menu"> <div class="sub-menu">
<a href="#">Sub Menu 2</a> <a href="#" onclick="EnergiekonzeptFunction('nothing')">Stöckach</a>
</div>
<button class="accordion">Acoustics</button>
<div class="sub-menu">
<a href="#">Sub Menu 3</a>
</div> </div>
<button class="accordion">Menu 3</button> <button class="accordion">Mobility</button>
<div class="sub-menu"> <div class="sub-menu">
<a href="#">Sub Menu 3</a> <a href="#">Sub Menu 3</a>
</div> </div>
...@@ -272,10 +206,10 @@ ...@@ -272,10 +206,10 @@
<!-- Content Tour --> <!-- Content Tour -->
<div id="tour-frame" style="display: none; overflow-y: scroll;"> <div id="tour-frame" style="display: none; overflow-y: scroll;">
<div class="tour-top-navi" style="z-index:99"> <div class="tour-top-navi" style="z-index:99">
<a href="#mystory" id = "testing" class="top-nav buttonset one"><i class="fa fa-globe"></i> Projekt 1</a> <a href="#" onclick="goHome()" id = "testing" class="top-nav buttonset one"><i class="fa fa-home"></i>Home</a>
<a href="#energiefahrrad" class="top-nav buttonset one"><i class="fa fa-bicycle"></i> Projekt 2</a> <!-- <a href="#energiefahrrad" class="top-nav buttonset one"><i class="fa fa-bicycle"></i> Projekt 2</a>
<a href="#wea" class="top-nav buttonset one"><i class="fa fa-bolt"></i> Projekt 3</a> <a href="#wea" class="top-nav buttonset one"><i class="fa fa-bolt"></i> Projekt 3</a>
<a href="#projects" id="back" class="top-nav buttonset one"><i class="fa fa-bolt"></i> Back to Projekt View 3</a> <a href="#projects" id="back" class="top-nav buttonset one"><i class="fa fa-bolt"></i> Back to Projekt View 3</a> -->
<!-- Buttonleiste oben <!-- Buttonleiste oben
<a href="#demo-viewpoint" class="top-nav buttonset one"><i class="fa fa-globe"></i> Viewpoint</a> <a href="#demo-viewpoint" class="top-nav buttonset one"><i class="fa fa-globe"></i> Viewpoint</a>
<a href="#demo-hiding" class="top-nav buttonset one"><i class="fa fa-eye-slash"></i> Hiding</a> <a href="#demo-hiding" class="top-nav buttonset one"><i class="fa fa-eye-slash"></i> Hiding</a>
...@@ -634,6 +568,8 @@ ...@@ -634,6 +568,8 @@
<script src="templates/custom.js"></script> <script src="templates/custom.js"></script>
<script src="templates/cus_Menu.js"></script>
<script src="templates/cus_SimStadt.js"></script>
<script src="templates/collapse.js"></script> <script src="templates/collapse.js"></script>
<script src="templates/checkmobile.js"></script> <script src="templates/checkmobile.js"></script>
...@@ -642,22 +578,6 @@ ...@@ -642,22 +578,6 @@
integrity="sha256-FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8=" integrity="sha256-FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8="
crossorigin="anonymous"></script> crossorigin="anonymous"></script>
<script src="templates/story/virtualcitystory.js"></script> <script src="templates/story/virtualcitystory.js"></script>
<!--Start: Javascript code to handle expand and collapse functionality of dropdown menu -->
<script>
var acc = document.getElementsByClassName("accordion");
var i;
for (i = 0; i < acc.length; i++) {
acc[i].addEventListener("click", function() {
this.classList.toggle("active");
var subMenu = this.nextElementSibling;
if (subMenu.style.maxHeight) {
subMenu.style.maxHeight = null;
} else {
subMenu.style.maxHeight = subMenu.scrollHeight + "px";
}
});
}
</script>
<!--End: Javascript code to handle expand and collapse functionality of dropdown menu -->
</body> </body>
</html> </html>
/* Css code for Dropdown Menu */
/* The container <div> - needed to position the dropdown content */
.dropdown {
position: relative;
display: inline-block;
}
/* The dropdown container <div> - needed to hold the content inside dropdown */
.dropdown-content {
right: -20px;
display: none;
position: absolute;
min-width: 150px;
box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
z-index: 1;
}
/* Accordion as a button to add expandible and collapsible menu items */
.accordion {
border: solid white;
border-width: thin;
display: block;
background-color:#000000;
color: white;
cursor: pointer;
padding: 11px;
width: 100%;
text-align: left;
outline: none;
font-size: 15px;
transition: 0.4s;
}
/* Sub menu items inside the accordion */
.sub-menu {
line-height: 35px;
padding: 0px 20px;
background-color: dimgray;
max-height: 0;
overflow: hidden;
transition: max-height 0.2s ease-out;
}
/* Styling for text of submenu */
.sub-menu a{
text-decoration: none;
color: aliceblue;
cursor: pointer;
outline: none;
font-size: 15px;
}
.active, .accordion:hover {
background-color: darkgray;
}
/* Changing of + and - on menu expand and collapse respectively*/
.accordion:after {
content: '\002B';
color:black;
font-weight: bold;
float: right;
margin-left: 5px;
}
.active:after {
content: "\2212";
}
/* Show the dropdown menu on hover */
.dropdown:hover .dropdown-content {
display: block;
}
#dropdownMenu{
cursor: pointer;
}
\ No newline at end of file
var acc = document.getElementsByClassName("accordion");
var i;
for (i = 0; i < acc.length; i++) {
acc[i].addEventListener("click", function() {
this.classList.toggle("active");
var subMenu = this.nextElementSibling;
if (subMenu.style.maxHeight) {
subMenu.style.maxHeight = null;
} else {
subMenu.style.maxHeight = subMenu.scrollHeight + "px";
}
});
}
\ No newline at end of file
var internStuff = {
attic: true,
atticHeating: true,
basement: true,
basementHeating: true,
buildingType: "EFH", // other options: "RH", "MFH", "GFH", "HH"
flatRoof: true,
id: 'DEBW522AA000039fd', // equal with glmid
latitude: 51.44679140365339, // an example of a building in Essen
longitude: 6.967781962878631, // an example of a building in Essen
refurbishment: "statuQuo", // other options: "medium", "advanced"
simulationName: "MonthlyEnergyBalance", // just use this value for Heat/Cooling Demand
storeyCount: 3,
timestep: 1, // dummy integer, not yet integrated but mandatory
usageProfile: "Single Family House", // // other options: "Multi Family House"
yearOfConstruction: 1946
}
// var SimSInput = {
// gmlid: 'DENW22AL700004Lv', // an example of a building in Essen DENW22AL700004Lv
// cityID: 3, //, Essen 3 // Stockach 1
// // ui: internStuff
// };
var SimSOutput = ""
//Test SimStadt API //DEBW522AA0001585e
var callSimS = function(){
var framework = vcs.vcm.Framework.getInstance();
var layers = framework.getLayers();
var layerStock = layers[1];
layerStock.highlight({"DEBW522AA0001585e":Cesium.Color.fromCssColorString("#BB8FCE")})
try {
$.ajax({
async: false,
type: "POST",
url: '/getSimS',
data: internStuff
}).done(function (SimSMid) {
convertdata(SimSMid);
});
function convertdata(SimSMids) {
SimSOutput = SimSMids;
}
// console.log(currentwind);
return SimSOutput;
}
catch (err) {
console.log('-> function callSimS() failed!\n' + err);
}
}
function fixJson(JsonString) {
var objOne = JsonString
JsonString = "{" + JsonString + "}"
JsonString = JsonString.replace(/DEN/g, ',"DEN')
JsonString = JsonString.replace(/ing/g, 'ing"')
JsonString = JsonString.replace("ly", 'ly"')
// JsonString = JsonString.replace(/]/g, '],')
JsonString = JsonString.replace(/=/g, ':')
JsonString = JsonString.replace(',"DEN', '"DEN')
// JsonString = JsonString.replace("=", '":')
console.log(JsonString)
return(JsonString)
}
\ No newline at end of file
...@@ -275,4 +275,8 @@ div.tour-top-navi { ...@@ -275,4 +275,8 @@ div.tour-top-navi {
.balloon{ .balloon{
cursor: pointer; cursor: pointer;
} }
\ No newline at end of file
...@@ -45,8 +45,10 @@ function stopStory() { ...@@ -45,8 +45,10 @@ function stopStory() {
// }; // };
} }
function showtourSpecific() { function showtourSpecific(specify) {
if (specify == 'menu'){
vcs.vcm.Framework.getInstance().getActiveMap().gotoViewPoint(vcs.vcm.Framework.getInstance().viewpoints.Böckingerstraße)
}
// var oldstuff = document.getElementById("old") // var oldstuff = document.getElementById("old")
// var para = document.createElement("P"); // var para = document.createElement("P");
// para.innerHTML = "This is a paragraph."; // para.innerHTML = "This is a paragraph.";
...@@ -89,13 +91,14 @@ function showSlides(n, no) { ...@@ -89,13 +91,14 @@ function showSlides(n, no) {
x[slideIndex[no]-1].style.display = "block"; x[slideIndex[no]-1].style.display = "block";
} }
var heating
// ========================================================================= // =========================================================================
function EnergiekonzeptFunction(content){ function EnergiekonzeptFunction(content){
vcs.vcm.Framework.getInstance().getActiveMap().gotoViewPoint(vcs.vcm.Framework.getInstance().viewpoints.stockach) vcs.vcm.Framework.getInstance().getActiveMap().gotoViewPoint(vcs.vcm.Framework.getInstance().viewpoints.stockach)
var layerNamesToDeactivate = ["ProjektOne"] // var layerNamesToDeactivate = ["ProjektOne"]
var layers = framework.getLayers(); // var layers = framework.getLayers();
document.getElementById("UmfrageOne").style.display = "none"; document.getElementById("UmfrageOne").style.display = "none";
...@@ -200,76 +203,13 @@ function Questionnaire() { ...@@ -200,76 +203,13 @@ function Questionnaire() {
} }
var internStuff = {
attic: true,
atticHeating: true,
basement: true,
basementHeating: true,
buildingType: "EFH", // other options: "RH", "MFH", "GFH", "HH"
flatRoof: true,
id: 'DEBW522AA000039fd', // equal with glmid
latitude: 51.44679140365339, // an example of a building in Essen
longitude: 6.967781962878631, // an example of a building in Essen
refurbishment: "statuQuo", // other options: "medium", "advanced"
simulationName: "MonthlyEnergyBalance", // just use this value for Heat/Cooling Demand
storeyCount: 3,
timestep: 1, // dummy integer, not yet integrated but mandatory
usageProfile: "Single Family House", // // other options: "Multi Family House"
yearOfConstruction: 1946
}
// var SimSInput = {
// gmlid: 'DENW22AL700004Lv', // an example of a building in Essen DENW22AL700004Lv
// cityID: 3, //, Essen 3 // Stockach 1
// // ui: internStuff
// };
var SimSOutput = ""
//Test SimStadt API //DEBW522AA0001585e
var callSimS = function(){
var framework = vcs.vcm.Framework.getInstance();
var layers = framework.getLayers();
var layerStock = layers[1];
layerStock.highlight({"DEBW522AA0001585e":Cesium.Color.fromCssColorString("#BB8FCE")})
try {
$.ajax({ function goHome(){
async: false, var viewp = vcs.vcm.Framework.getInstance().viewpoints.startview
type: "POST", $("#tour-button").hide();
url: '/getSimS', showMap()
data: internStuff
}).done(function (SimSMid) { //stopStory()
convertdata(SimSMid); vcs.vcm.Framework.getInstance().getActiveMap().gotoViewPoint(viewp)
});
function convertdata(SimSMids) {
SimSOutput = SimSMids;
}
// console.log(currentwind);
return SimSOutput;
}
catch (err) {
console.log('-> function callSimS() failed!\n' + err);
}
} }
function fixJson(JsonString) {
var objOne = JsonString
JsonString = "{" + JsonString + "}"
JsonString = JsonString.replace(/DEN/g, ',"DEN')
JsonString = JsonString.replace(/ing/g, 'ing"')
JsonString = JsonString.replace("ly", 'ly"')
// JsonString = JsonString.replace(/]/g, '],')
JsonString = JsonString.replace(/=/g, ':')
JsonString = JsonString.replace(',"DEN', '"DEN')
// JsonString = JsonString.replace("=", '":')
console.log(JsonString)
return(JsonString)
}
\ No newline at end of file
...@@ -365,12 +365,6 @@ ...@@ -365,12 +365,6 @@
"clickInteraction": [ "clickInteraction": [
"rotateAroundFernsehturm" "rotateAroundFernsehturm"
] ]
},
{
"htmlID": "#testing",
"clickInteraction": [
"sOne", "STEST"
]
} }
] ]
} }
Markdown is supported
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