cus_Menu.js

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;
      position_var = false;
      pointsoe = " "
    } else {
      subMenu.style.maxHeight = subMenu.scrollHeight + "px";
    }
  });
}

async function nordbahnview() {
  var viewp = vcs.vcm.Framework.getInstance().viewpoints.NordBView
  vcs.vcm.Framework.getInstance().getActiveMap().gotoViewPoint(viewp);

  // document.getElementById("UmfrageOne").style.display = "none";
  // document.getElementById("NordbahnhofInfo").style.display = "block";
  // document.getElementById("Navigation").style.display = "none";
  // document.getElementById("projektOne").style.display = "none";
  // document.getElementById("Energiekonzept").style.display = "none";
  // document.getElementById("IntroProj").style.display = "none";
  // document.getElementById("Expertenmodus").style.display = "block";
  await new Promise(resolve => setTimeout(resolve, 100));
  showgraph();

}

function akkustikview() {
  var viewp = vcs.vcm.Framework.getInstance().viewpoints.NoiseView
  vcs.vcm.Framework.getInstance().getActiveMap().gotoViewPoint(viewp);
}

function MobilityView() {
  var viewp = vcs.vcm.Framework.getInstance().viewpoints.MobilityView
  vcs.vcm.Framework.getInstance().getActiveMap().gotoViewPoint(viewp);
}

var expstate = false;

function onoff() {

  if (expstate == false) {
    // var element = document.getElementById("menustuff");
    // element.classList.remove("hidden");
    expstate = true;
  } else {
    // var element = document.getElementById("menustuff");
    // element.classList.add("hidden");
    expstate = false;
  }
}

function addcont(content) {
  var bilderstuff = '<div class="slideshow-container">' +
    '<div class="mySlides1 fade">' +
    '<div class="numbertext">1 / 17</div>' +
    '<img src="images/content/contentboeckingerstrasse/grafik_aufgabenstellung.jpg" style="width:100%;border-radius: 10px;border: 1px solid black;">' +
    '<div class="text">Grafik</div>' +
    '</div>' +
    '<div class="mySlides1 fade">' +
    '<div class="numbertext">2 / 17</div>' +
    '<img src="images/content/contentboeckingerstrasse/boeckinger_strasse.jpg" style="width:100%;border-radius: 10px;border: 1px solid black;">' +
    '<div class="text">Böckinger Straße</div>' +
    '</div>' +
    '<div class="mySlides1 fade">' +
    '<div class="numbertext">3 / 17</div>' +
    '<img src="images/content/contentboeckingerstrasse/holzwerkstatt_igh.jpg" style="width:100%;border-radius: 10px;border: 1px solid black;">' +
    '<div class="text">Holzwerkstatt</div>' +
    '</div>' +
    '<div class="mySlides1 fade">' +
    '<div class="numbertext">4 / 17</div>' +
    '<img src="images/content/contentboeckingerstrasse/infoabend_garten_igh.jpg" style="width:100%;border-radius: 10px;border: 1px solid black;">' +
    '<div class="text">Infoabend im Garten</div>' +
    '</div>' +
    '<div class="mySlides1 fade">' +
    '<div class="numbertext">5 / 17</div>' +
    '<img src="images/content/contentboeckingerstrasse/interviews_nachbarschaft.jpg" style="width:100%;border-radius: 10px;border: 1px solid black;">' +
    '<div class="text">Interviews in der Nachbarschaft</div>' +
    '</div>' +
    '<div class="mySlides1 fade">' +
    '<div class="numbertext">6 / 17</div>' +
    '<img src="images/content/contentboeckingerstrasse/offene_bauwerkstatt_1.jpg" style="width:100%;border-radius: 10px;border: 1px solid black;">' +
    '<div class="text">Offene Bauwerkstatt</div>' +
    '</div>' +
    '<div class="mySlides1 fade">' +
    '<div class="numbertext">7 / 17</div>' +
    '<img src="images/content/contentboeckingerstrasse/offene_bauwerkstatt_2.jpg" style="width:100%;border-radius: 10px;border: 1px solid black;">' +
    '<div class="text">Offene Bauwerkstatt</div>' +
    '</div>' +
    '<div class="mySlides1 fade">' +
    '<div class="numbertext">8 / 17</div>' +
    '<img src="images/content/contentboeckingerstrasse/offene_bauwerkstatt_3.jpg" style="width:100%;border-radius: 10px;border: 1px solid black;">' +
    '<div class="text">Offene Bauwerkstatt</div>' +
    '</div>' +
    '<div class="mySlides1 fade">' +
    '<div class="numbertext">9 / 17</div>' +
    '<img src="images/content/contentboeckingerstrasse/planungsgebiet_choreographie.jpg" style="width:100%;border-radius: 10px;border: 1px solid black;">' +
    '<div class="text">Planungsgebiet Choreographie</div>' +
    '</div>' +
    '<div class="mySlides1 fade">' +
    '<div class="numbertext">10 / 17</div>' +
    '<img src="images/content/contentboeckingerstrasse/planungsgebiet_vogelperspektive.jpg" style="width:100%;border-radius: 10px;border: 1px solid black;">' +
    '<div class="text">Planungsgebiet Vogelperspektive</div>' +
    '</div>' +
    '<div class="mySlides1 fade">' +
    '<div class="numbertext">11 / 17</div>' +
    '<img src="images/content/contentboeckingerstrasse/station1_spielekiosk.jpg" style="width:100%;border-radius: 10px;border: 1px solid black;">' +
    '<div class="text">Spielekiosk</div>' +
    '</div>' +
    '<div class="mySlides1 fade">' +
    '<div class="numbertext">12 / 17</div>' +
    '<img src="images/content/contentboeckingerstrasse/station2_gartenkiosk.jpg" style="width:100%;border-radius: 10px;border: 1px solid black;">' +
    '<div class="text">Gartenkiosk</div>' +
    '</div>' +
    '<div class="mySlides1 fade">' +
    '<div class="numbertext">13 / 17</div>' +
    '<img src="images/content/contentboeckingerstrasse/station3_outdoorkiosk.jpg" style="width:100%;border-radius: 10px;border: 1px solid black;">' +
    '<div class="text">Outdoorkiosk</div>' +
    '</div>' +
    '<div class="mySlides1 fade">' +
    '<div class="numbertext">14 / 17</div>' +
    '<img src="images/content/contentboeckingerstrasse/station3_outdoorkiosk1.jpg" style="width:100%;border-radius: 10px;border: 1px solid black;">' +
    '<div class="text">Outdoorkiosk</div>' +
    '</div>' +
    '<div class="mySlides1 fade">' +
    '<div class="numbertext">15 / 17</div>' +
    '<img src="images/content/contentboeckingerstrasse/station4_infokiosk.jpg" style="width:100%;border-radius: 10px;border: 1px solid black;">' +
    '<div class="text">Infokiosk</div>' +
    '</div>' +
    '<div class="mySlides1 fade">' +
    '<div class="numbertext">16 / 17</div>' +
    '<img src="images/content/contentboeckingerstrasse/workshop_cafe_tas_1.jpg" style="width:100%;border-radius: 10px;border: 1px solid black;">' +
    '<div class="text">Workshop Cafe Tas</div>' +
    '</div>' +
    '<div class="mySlides1 fade">' +
    '<div class="numbertext">17 / 17</div>' +
    '<img src="images/content/contentboeckingerstrasse/workshop_cafe_tas_2.jpg" style="width:100%;border-radius: 10px;border: 1px solid black;">' +
    '<div class="text">Workshop Cafe Tas</div>' +
    '</div>' +
    '<!-- Next and previous buttons -->' +
    '<a class="prev" onclick="plusSlides(-1, 0)">&#10094;</a>' +
    '<a class="next" onclick="plusSlides(1, 0)">&#10095;</a>' +
    '</div>' +
    '<br>'

  var heatdem = '<div style="width:100%;margin-top:200px;" id="chartNordB"></div>'

  var nordbstuff = "" +
    "<div class='box-3'>" +
    "<div class='btn btn-three' onclick='newPlan()'>" +
    "<span>Neue Planung</span>" +
    "</div><br>" +
    "<div class='btn btn-three' onclick='oldZust()'>" +
    "<span>Ist Zustand</span>" +
    "</div><br></div>" +
    "<div onclick='document.getElementById('chxboxHighlight').click()' class='box-3'>" +
    "<p>Highlight &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; </p><div class='switch'>" +
    "<input type='checkbox' name='toggle' id='chxboxHighlight' onclick='checkboxHighlight(true);'>" +
    "<label for='toggle'><i></i></label>" +
    "<span></span>" +
    "</div>" +
    "</div>" +
    "<div onclick='document.getElementById('chxboxDemand').click()' class='box-3'>" +
    "<p>Wärmebedarf           &nbsp;</p><div class='switch'>" +
    "<input type='checkbox' name='toggle' id='chxboxDemand' onclick='checkboxDemand(true);'>" +
    "<label for='toggle'><i></i></label>" +
    "<span></span>" +
    "</div>" +
    "</div>"
  var nordbstuff2 = "" +
    "<div class='box-3'>" +
    "<div class='btn btn-three' onclick='newPlan()'>" +
    "<span>Neue Planung</span>" +
    "</div><br>" +
    "<div class='btn btn-three' onclick='oldZust()'>" +
    "<span>Ist Zustand</span>" +
    "</div><br></div>"
  heatdemVal01 = 100
  heatdemVal02 = 200
  heatdemVal03 = 300
  heatdemVal04 = 400



  if (content == "main_bock") {
    var bilder = document.getElementById('bilder_bock')
    var other = document.getElementById('bilder_bock2')
    other.innerHTML = ""
    bilder.innerHTML = ""
    // bilder.innerHTML = bilderstuff
    // showSlides(1, 0);
    // showSlides(1, 1);
  } else if (content == "main_bock2") {
    var bilder = document.getElementById('bilder_bock2')
    var other = document.getElementById('bilder_bock')
    other.innerHTML = ""
    bilder.innerHTML = ""
    bilder.innerHTML = bilderstuff
    showSlides(1, 0);
    showSlides(1, 1);
  } else if (content == "main_heatdem") {
    var heatdemand = document.getElementById('main_heatdem')
    // var other = document.getElementById('main_heatdem2')
    // other.innerHTML = ""
    heatdemand.innerHTML = ""
    heatdemand.innerHTML = heatdem

  } else if (content == "main_heatdem2") {
    var heatdemand = document.getElementById('main_heatdem2')
    var other = document.getElementById('main_heatdem')
    other.innerHTML = ""
    heatdemand.innerHTML = ""
    heatdemand.innerHTML = heatdem

  } else if (content == "main_nordbstuff") {
    var nordb = document.getElementById('nordbplanung')
    var other = document.getElementById('nordbplanung2')
    other.innerHTML = ""
    nordb.innerHTML = ""
    nordb.innerHTML = nordbstuff
  } else if (content == "main_nordbstuff2") {
    var nordb = document.getElementById('nordbplanung2')
    var other = document.getElementById('nordbplanung')
    other.innerHTML = ""
    nordb.innerHTML = ""
    nordb.innerHTML = nordbstuff2
  }








  // Thumbnail image controls
  // function currentSlide(n) {
  //   showSlides(slideIndex = n);
  // }


};

var slideIndex = [1, 1];

var slideId = ["mySlides1", "mySlides2"]
// Next/previous controls
function plusSlides(n, no) {
  showSlides(slideIndex[no] += n, no);
}


function showSlides(n, no) {
  var i;
  var x = document.getElementsByClassName(slideId[no]);
  if (n > x.length) {
    slideIndex[no] = 1
  }
  if (n < 1) {
    slideIndex[no] = x.length
  }
  for (i = 0; i < x.length; i++) {
    x[i].style.display = "none";
  }
  x[slideIndex[no] - 1].style.display = "block";
}

function currentSlide(n) {
  showSlides(n, 0);
}



var slideIndexNord = 1;
showSlidesNord(slideIndexNord);

// Next/previous controls
function plusSlidesNord(n) {
  showSlidesNord(slideIndexNord += n);
}

// Thumbnail image controls
function currentSlideNord(n) {
  showSlidesNord(slideIndexNord = n);
}

function showSlidesNord(n) {
  var i;
  var slides = document.getElementsByClassName("mySlidesNord");
  var dots = document.getElementsByClassName("dotNord");
  if (n > slides.length) {
    slideIndexNord = 1
  }
  if (n < 1) {
    slideIndexNord = slides.length
  }
  for (i = 0; i < slides.length; i++) {
    slides[i].style.display = "none";
  }
  for (i = 0; i < dots.length; i++) {
    dots[i].className = dots[i].className.replace(" activeNord", "");
  }
  slides[slideIndexNord - 1].style.display = "block";
  dots[slideIndexNord - 1].className += " activeNord";
}