Commit 2c603abc authored by Dietmar's avatar Dietmar

commit other tools ohne *.mp4

parent 1afbca25
*.mp4
\ No newline at end of file
......@@ -6,8 +6,10 @@ window.onload = function() {
toggle_div("error");
document.getElementById("manage").style.display = "none";
// https://coastmap.hzg.de/fmeserver
//http://a1sv0000160:3099/fmeserver
FMEServer.init({
server : "http://a1sv0000160:3099",
server : "https://coastmap.hzg.de/coastmap/fmeserver",
token : "7491024f500fd4977d60d292b1e367fd0a3f2f9a"
});
......
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<link rel="stylesheet" href="css/style.css" />
<style type="text/css">
body {
background-color: black;
height: 100%;
width: 100%;
}
* {
padding: 0;
margin: 0;
}
#main-image {
width: 100%;
height: auto;
}
</style>
</head>
<body>
<img lang="de" id="main-image" src="screensaver_de.jpg" onclick="location.href='main/index.html'" />
<img lang="en" id="main-image" src="screensaver_en.jpg" onclick="location.href='main/index.html'" />
</body>
</html>
This diff is collapsed.
This diff is collapsed.
function didShowImage(name) {
if(name=="main.jpg") {
$('#btn-reset').removeClass('active');
$('#btn-container').addClass('active');
$('#pulse-image').addClass('active');
}
else {
$('#btn-reset').addClass('active');
$('#btn-container').removeClass('active');
$('#pulse-image').removeClass('active');
}
}
function showImage(name) {
console.log(name);
$('#wat-image').attr({
'src': 'img/' + name
});
didShowImage(name);
}
var mapImages = ["img/mapStart.jpg", "img/mapAdmin.jpg", "img/mapFacility.jpg", "img/mapAdminFacility.jpg"];
var texts = ["<b>Raumnutzung</b><br/><br/>Auf dem Satellitenbild der südöstlichen Nordsee ist die Küstenlinie nur undeutlich auszumachen: Zu eng verbunden sind Land und Meer in diesem Bereich. Ablagerung und Umlagerung von Sedimenten lassen Sandbänke und Inseln wachsen, verschwinden oder wandern. Diese Sedimente werden von Flüssen in den Küstenraum verfrachtet, oder sie werden durch Strömungen im Uhrzeigersinn entlang der Nordseeküste transportiert und ernähren die Strände der Nordseeinseln. Große und kleine Flüsse entwässern intensiv genutzte Einzugsgebiete an Land und tragen mit dem Süßwasser die Abwässer menschlicher Aktivitäten in das Küstenmeer. Darunter sind Nährstoffe, die das Wachstum von Mikroalgen fördern, und eine Vielzahl von problematischen Substanzen wie Schwermetalle und organische Schadstoffe.<br/>Zunehmend wird das Küstenmeer selbst zum Industrieraum. In der deutschen Ausschließlichen Wirtschaftszone (AWZ) der Nordsee (Verweis auf die Kontur) konkurrieren unterschiedlichste Nutzungsansprüche: Schifffahrt, Fischerei, Betreiber von offshore Windenergieparks, Naturschutz, Tourismus, Gewinnung von Sand und Kies – alle stellen Ansprüche an das Küstenmeer als Quelle von Ressourcen oder als Raum.",
"<b>Administration</b><br/><br/>Karte  mit administrativen Grenzen, die bestehende und geplante Nutzungen sowie die planerische Gebietsfestlegungen innerhalb Festlandsockel der Ausschließliche Wirtschaftszone (AWZ) und 12–Seemeilenzone darstellt. Hierzu zählen  Schifffahrtswege, Gebiete der Sedimentgewinnung, militärische Übungsgebiete, Einbringungsgebiete, Vorranggebiete für Windenergie oder Sperrgebiete.",
"<b>Facilities</b><br/><br/>Karte der aktuellen Nutzungen innerhalb der Ausschließlichen Wirtschaftszone (AWZ) bzw. des deutschen Küstenraumes, wie Windparks, Plattformen, Datenkabel, Energiekabel und Rohrleitungen.",
"<b>Administration</b><br/><br/>Karte  mit administrativen Grenzen, die bestehende und geplante Nutzungen sowie die planerische Gebietsfestlegungen innerhalb Festlandsockel der Ausschließliche Wirtschaftszone (AWZ) und 12–Seemeilenzone darstellt. Hierzu zählen  Schifffahrtswege, Gebiete der Sedimentgewinnung, militärische Übungsgebiete, Einbringungsgebiete, Vorranggebiete für Windenergie oder Sperrgebiete.<br/><br/><br/><b>Facilities</b><br/><br/>Karte der aktuellen Nutzungen innerhalb der Ausschließlichen Wirtschaftszone (AWZ) bzw. des deutschen Küstenraumes, wie Windparks, Plattformen, Datenkabel, Energiekabel und Rohrleitungen."
];
var keyImages = ["", "img/AdminKey.png", "img/FacilityKey.png", "img/AdminFacilityKey.png"];
function topSegmentedChanged() {
var value = parseInt($("input[name=top]:checked").val());
if(value == 0) {
$('#text-container').addClass('visible');
$('#key-container').removeClass('visible');
}
else if(value == 1) {
$('#text-container').removeClass('visible');
$('#key-container').addClass('visible');
}
}
function hidePopOvers() {
$('body').unbind('click');
$('.river-popover').removeClass('visible');
}
$(document).ready(function() {
$("input[name=bottom]:radio").change(function() {
var value = parseInt($(this).attr('value'));
if(value > 0) {
$('#top-segmented-control').addClass('visible');
topSegmentedChanged();
}
else {
$('#top-segmented-control').removeClass('visible');
$('#text-container').addClass('visible');
$('#key-container').removeClass('visible');
}
$('#map-image').attr('src', mapImages[value]);
$('#key').attr('src', keyImages[value]);
$('#text-container').html(texts[value]);
});
$("input[name=top]:radio").change(function() {
topSegmentedChanged();
});
$('#river-toggle').change(function() {
var checked = $(this).is(':checked');
if(checked) {
$('#river-container').addClass('visible');
}
else {
$('#river-container').removeClass('visible');
}
});
$('.popover-btn').click(function() {
hidePopOvers();
var selector = $(this).attr('target');
$(selector).addClass('visible');
setTimeout(function() {
$('body').click(function(e) {
if(!$(e.target).hasClass('river-popover')) {
hidePopOvers();
}
});
},50);
});
});
\ No newline at end of file
/*
This file has been generated with SiteFlow (http://siteflow.witiz.com).
To remove this comment, please support us and upgrade to SiteFlow Pro.
*/
function didShowImage(a){if("main.jpg"==a){$("#btn-reset").removeClass("active");$("#btn-container").addClass("active");$("#pulse-image").addClass("active")}else{$("#btn-reset").addClass("active");$("#btn-container").removeClass("active");$("#pulse-image").removeClass("active")}}function showImage(a){console.log(a);$("#wat-image").attr({src:"img/"+a});didShowImage(a)}$(document).ready(function(){$("#radio-1, #radio-2, #radio3").change(function(){alert("whaaat")})});
* {
padding:0px;
margin: 0px;
}
html {
height: auto!important;
width: 100%!important;
}
body{
margin: 0;
padding: 0;
}
.btn-back{
background-color: rgba(60,60,60,0.8) !important;
border-radius: 6px;
}
#container{
position: absolute;
width: 1734px;
height: 1080px;
margin: 0;
padding: 0;
transform-origin: top left;
-moz-transform-origin: top left;
}
#main-image {
position: absolute;
width: 1734px;
height: auto;
}
@-webkit-keyframes pulsate {
0% {opacity: 0.0;}
50% {opacity: 1.0;}
100% {opacity: 0.0;}
}
@keyframes pulsate {
0% {opacity: 0.0;}
50% {opacity: 1.0;}
100% {opacity: 0.0;}
}
#main-image-pulse {
position: absolute;
width: 1734px;
height: auto;
-webkit-animation: pulsate 4s ease-out;
-webkit-animation-iteration-count: infinite;
animation: pulsate 4s ease-out;
animation-iteration-count: infinite;
}
.invisible {
position: absolute;
background-color: pink;
opacity: 0;
}
#btn-1 {
left: 0px;
top: 0px;
position: absolute;
width: 190px;;
height: 400px;
}
#btn-2 {
left: 0px;
top: 600px;
position: absolute;
width: 190px;
height: 200px;
}
#btn-3 {
left: 1344px;
top: 900px;
position: absolute;
width: 200px;
height: 180px;
}
#btn-4 {
left: 1020px;
top: 0px;
position: absolute;
width: 200px;
height: 172px;
}
#btn-5 {
left: 1040px;
top: 180px;
position: absolute;
width: 196px;
height: 180px;
}
#btn-6 {
left: 800px;
top: 930px;
position: absolute;
width: 190px;
height: 150px;
}
.gorickBtn:hover{
cursor: pointer;
}
.popover {
z-index: 100;
}
/*@media only screen
and (min-device-width : 768px)
and (max-device-width : 1024px) {
#main-image-pulse {
width: 120%;
left:-150px;
height: auto;}
#main-image {
width: 120%;
left:-150px;
height: auto;
}
#btn-1 {
left: 0%;
top: 0%;
position: absolute;
width: 14%;
height: 40%;
}
#btn-2 {
left: 0%;
top: 54%;
position: absolute;
width: 12%;
height: 22%;
}
#btn-5 {
left: 65%;
top: 16%;
position: absolute;
width: 12%;
height: 19%;
}
#btn-4 {
left: 65%;
top: 0%;
position: absolute;
width: 12%;