/*************************************************************** * Copyright (C) 2016 punkt.de GmbH * Authors: Christoph Heidenreich * * This script is free software: you can redistribute it and/or modify * it under the terms of the GNU Lesser General Public License as published * by the Free Software Foundation, either version 3 of the License, or * (at your option) any later version. * * This script is distributed in the hope that it will be useful, * but WITHOUT ANY WARRANTY; without even the implied warranty of * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the * GNU Lesser General Public License for more details. * * You should have received a copy of the GNU General Public License * along with this program. If not, see . * * This copyright notice MUST APPEAR in all copies of the script! ***************************************************************/ // window.addEventListener("load", function(event) { var stateObj = {info: "start01"}; history.replaceState(stateObj, "neuerChronikEintrag", "http://localhost:8083/"); console.log("start01") // document.body.style.backgroundColor = "yellow"; // }); function historyP2(){ var stateObj = {info: "start02"}; history.pushState(stateObj, "neuerChronikEintrag", "http://localhost:8083/"); console.log("start02") } function historyMap(){ var stateObj = {info: "map01"}; history.pushState(stateObj, "neuerChronikEintrag", "http://localhost:8083/"); console.log("map01") } // function menu3(){ // var stateObj = {info: "menu03"}; // history.pushState(stateObj, "neuerChronikEintrag", "http://localhost:8089/"); // } // function SaveHistory(){ // var page = 0; // if (!$('#einlP01').is(':visible') && !$("#einlPO2").is(':hidden')){ // var dataObject = { // pageOne: "1", // one: "one" // }; // history.pushState(dataObject, null, window.location); // } else if ($("#einlPO2").css('display') == 'block' && $("#einlPO1").css('display') == 'none') { // var dataObject = { // pageTwo: "2", // two: "two" // }; // history.pushState(dataObject, null, window.location); // }else if($("#balloon-startscreen").css('display') == 'none') { // var dataObject = { // pageThree: "3", // three: "three" // }; // history.pushState(dataObject, null, window.location); // } // } jQuery(document).ready(function() { var $ = jQuery; // function replaceContentWith(html) { // $('#replace-container').replaceWith(html); // } // function setMenuActiveStateForId(id) { // $('#menu li').removeClass('active'); // $('#' + id).parent().addClass('active'); // } // function setCurrentPage(replacementHtml, activeLinkId) { // replaceContentWith(replacementHtml); // setMenuActiveStateForId(activeLinkId); // } //-------------------------------------------------------------------------- // handle history.back functionality in event // replace html and set active menu to restore dynamic made changes on page //-------------------------------------------------------------------------- window.addEventListener('popstate', function(event) { if (event.state !== null && event.state !== undefined) { // alert(event.state.info) if (event.state.info == "start01"){ activateStoryFrame("1") } else if (event.state.info == "start02"){ activateStoryFrame("2") } else if (event.state.info == "map01"){ activateStoryFrame("3") } else { activateStoryFrame("1") } } }); //-------------------------------------------------------------------------- // replace content on click and remember the changes in browser history //-------------------------------------------------------------------------- // $('#menu a').each(function() { // $(this).click(function() { // var activeLinkId = $(this).attr('id'); // var dataObject = { // }; // $.ajax({ // method: "GET", // url: $(this).data('url'), // dataType: "HTML" // }) // .done(function(html) { // if (!$('#einlP01').is(':visible') && !$("#einlPO2").is(':hidden')){ // dataObject = { // pageOne: "1", // one: "one" // }; // history.pushState(dataObject, null, window.location); // } else if ($("#einlPO2").css('display') == 'block' && $("#einlPO1").css('display') == 'none') { // dataObject = { // pageTwo: "2", // two: "two" // }; // history.pushState(dataObject, null, window.location); // }else if($("#balloon-startscreen").css('display') == 'none') { // dataObject = { // pageThree: "3", // three: "three" // }; // history.pushState(dataObject, null, window.location); // } // // this will add a new entry for the browser history like it would happen if you // // click on a hyperlink on the page with additional information we can use for our likes // history.pushState(dataObject, null, window.location); // // setCurrentPage(html, activeLinkId); // }); // }); // }); //-------------------------------------------------------------------------- // handling of first load of the page and // jumping back from some other url for example with the impress link //-------------------------------------------------------------------------- // if (history.state === null || history.state === undefined) { // // store current page state in the current history // var dataObject = { // html: jQuery('#replace-container').wrap('').parent().html(), // activeLinkId: '' // }; // // this replaces the current browser history entry with information (html and current active menu id) // // we use in your popstate event to handle the state of the page on history navigation // history.replaceState(dataObject, null, window.location); // } else { // // set the page state by given information from the history state // activateStoryFrame("pageN") // // setCurrentPage(history.state.html, history.state.activeLinkId); // } }); function activateStoryFrame(pageN){ if (pageN == "1"){ stopStory(); $("#story-frame").removeClass("tour-inactive"); $("#story-frame").removeClass("tour"); $("#story-frame").addClass("startscreen"); $("#balloon-startscreen").attr('style',"display:'block'!important"); $("#navi").attr('style',"display:'none'!important"); // $("#einlPO1").css('display') = 'block' document.getElementById("einlP01").style.display = "block"; document.getElementById("einlP02").style.display = "none"; document.getElementById("tourstart-btn").style.display = "none"; document.getElementById("iconlist").style.display = "none"; document.getElementById("detAnleitung").style.display = "none"; document.getElementById("einlP01").scrollIntoView(); document.getElementById("back-btn").style.display = "none"; } else if(pageN == "2"){ stopStory(); $("#story-frame").removeClass("tour-inactive"); $("#story-frame").removeClass("tour"); $("#story-frame").addClass("startscreen"); $("#balloon-startscreen").attr('style',"display:'block'!important"); $("#navi").attr('style',"display:'none'!important"); document.getElementById("einlP01").style.display = "none"; document.getElementById("einlP02").style.display = "block"; document.getElementById("tourstart-btn").style.display = "block"; document.getElementById("iconlist").style.display = "block"; document.getElementById("detAnleitung").style.display = "block"; document.getElementById("einlP02").scrollIntoView(); document.getElementById("back-btn").style.display = "block"; } else if(pageN == "3"){ showMap(); } }