Commit 4ec19481 authored by barth23's avatar barth23
Browse files

integrate button switch

parent 9b8185af
<div data-template="templates:surround" data-template-with="templates/page_index.html" data-template-at="content-container">
<meta charset="utf-8"/>
<link rel="stylesheet" href="https://unpkg.com/leaflet@1.6.0/dist/leaflet.css" integrity="sha512-xwE/Az9zrjBIphAcBb3F6JVqxf46+CDLwfLMHloNu6KEQCAWi6HcDUbeOfBIptF7tcCzusKFjFw2yuvEpDL9wQ==" crossorigin=""/>
<script src="https://unpkg.com/leaflet@1.6.0/dist/leaflet.js" integrity="sha512-gZwIG9x3wUXg2hdXF6+rVkLF/0Vi9U8D2Ntg4Ga5I5BZpVkVxlJWbSQtXPSiUTtC0TjtGOmxa1AJPuV0CPthew==" crossorigin=""/>
<script src="/exist/apps/sade-architrave/templates/paris-project/js/leaflet-providers.js"/>
<script src="https://unpkg.com/georaster"/>
<script src="https://unpkg.com/georaster-layer-for-leaflet/georaster-layer-for-leaflet.browserify.min.js"/>
<style>
.info {
padding: 6px 8px;
font: 14px/16px Arial, Helvetica, sans-serif;
background: white;
background: rgba(255,255,255,0.8);
box-shadow: 0 0 15px rgba(0,0,0,0.2);
border-radius: 5px;
}
.legend {
background-color: black;
line-height: 25px;
color: #555;
width: auto;
}
.legend i {
width: 18px;
height: 18px;
float: left;
margin-right: 8px;
opacity: 0.7;
}
</style>
<meta charset="utf-8"/>
<link rel="stylesheet" href="https://unpkg.com/leaflet@1.6.0/dist/leaflet.css" integrity="sha512-xwE/Az9zrjBIphAcBb3F6JVqxf46+CDLwfLMHloNu6KEQCAWi6HcDUbeOfBIptF7tcCzusKFjFw2yuvEpDL9wQ==" crossorigin=""/>
<script src="https://unpkg.com/leaflet@1.6.0/dist/leaflet.js" integrity="sha512-gZwIG9x3wUXg2hdXF6+rVkLF/0Vi9U8D2Ntg4Ga5I5BZpVkVxlJWbSQtXPSiUTtC0TjtGOmxa1AJPuV0CPthew==" crossorigin=""/>
<script src="/exist/apps/sade-architrave/templates/paris-project/js/leaflet-providers.js"/>
<script src="https://unpkg.com/georaster"/>
<script src="https://unpkg.com/georaster-layer-for-leaflet/georaster-layer-for-leaflet.browserify.min.js"/>
<style>
.arch-content-margin{
margin: 0px auto;
margin-top: 25px;
}
.info {
padding: 6px 8px;
font: 14px/16px Arial, Helvetica, sans-serif;
background: white;
background: rgba(255,255,255,0.8);
box-shadow: 0 0 15px rgba(0,0,0,0.2);
border-radius: 5px;
}
.legend {
background-color: black;
line-height: 25px;
color: #555;
width: auto;
}
.legend i {
width: 18px;
height: 18px;
float: left;
margin-right: 8px;
opacity: 0.7;
}
</style>
<div class="arch-content p-content" id="content">
<h1 data-template="lang:translate" data-template-content="Itineraries"/>
<div class="arch-list-view-radio-slider">
<div class="btn-toolbar btn-group-toggle btn-group" data-toggle="buttons">
<!--
<label class="btn btn-primary active">
<input type="radio" name="map_button" value="arrowMap" autocomplete="off" checked="checked"/>
<span data-template="lang:translate" data-template-content="arrowMap"/>
</label>
-->
<label class="btn btn-primary">
<input type="radio" name="map_button" value="europeMap" autocomplete="off"/>
<span data-template="lang:translate" data-template-content="europeMap"/>
</label>
<label class="btn btn-primary">
<input type="radio" name="map_button" value="parisMap" autocomplete="off"/>
<span data-template="lang:translate" data-template-content="parisMap"/>
</label>
</div>
</div>
<!--<div id="map_content" class="arch-content p-content"/>-->
<div id="mapid" class="arch-content p-content">
<script src="/exist/apps/sade-architrave/templates/paris-project/js/europeMap.js"/>
</div>
</div>
<div class="arch-content p-content arch-content-margin" id="content">
<h1 data-template="lang:translate" data-template-content="Itineraries"/>
<div class="arch-list-view-radio-slider">
<div class="btn-toolbar btn-group-toggle btn-group" data-toggle="buttons">
<!--
<label class="btn btn-primary active">
<input type="radio" name="map_button" value="arrowMap" autocomplete="off" checked="checked"/>
<span data-template="lang:translate" data-template-content="arrowMap"/>
</label>
-->
<label class="btn btn-primary">
<input type="radio" name="map_button" value="europeMap" autocomplete="off"/>
<span data-template="lang:translate" data-template-content="europeMap" checked="checked"/>
</label>
<label class="btn btn-primary">
<input type="radio" name="map_button" value="parisMap" autocomplete="off"/>
<span data-template="lang:translate" data-template-content="parisMap"/>
</label>
</div>
</div>
<!--
<div id="mapid" class="arch-content arch-content-margin"/>
<script>
document.getElementById('map_content').innerHTML = '<script src="/exist/apps/sade-architrave/templates/paris-project/js/europeMap.js"/>';
</script>
-->
<div id="mapid" class="arch-content arch-content-margin">
<script>
//var button_value = $("input[name='map_button']:checked").attr("value");
var path = "/exist/apps/sade-architrave/templates/paris-project/js/europeMap.js"
$.ajax({
type: "GET",
url: path,
dataType: "script"
});
$("input[name='map_button']").change(function(){
// LOAD *CHANGED* VALUES
map.remove();
var button_value = $("input[name='map_button']:checked").attr("value");
//console.log(button_value)
if (button_value == "europeMap") {
console.log(button_value)
var path = "/exist/apps/sade-architrave/templates/paris-project/js/europeMap.js"
}
if (button_value == "parisMap") {
console.log(button_value)
var path = "/exist/apps/sade-architrave/templates/paris-project/js/parisMap.js"
}
$.ajax({
type: "GET",
url: path,
dataType: "script"
});
});
</script>
</div>
<!--<script src="/exist/apps/sade-architrave/templates/paris-project/js/europeMap.js"/>-->
</div>
</div>
\ No newline at end of file
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