gandalf/HambiMap
1
0
Fork 0
Code Issues 2 Pull requests Packages Projects Releases Wiki Activity

Compare commits

base: gandalf:56f4940d63a46b19b795c33ac1697a46bce6a275
Branches Tags
gandalf:main
gandalf:frontend_sketch
gandalf:first_own_trials
gandalf:tutorial
..
compare: gandalf:b1bfab6bbc7b0e85f2469cb114669bde9d3e8f3a
Branches Tags
gandalf:frontend_sketch
gandalf:first_own_trials
gandalf:tutorial
gandalf:main

No commits in common. "56f4940d63a46b19b795c33ac1697a46bce6a275" and "b1bfab6bbc7b0e85f2469cb114669bde9d3e8f3a" have entirely different histories.
56f4940d63 ... b1bfab6bbc

42 changed files with 175 additions and 366 deletions
Show stats Expand all files Collapse all files

20
sketch/HambiMap
View file

@ -1,20 +0,0 @@
server {
listen 8080;
server_name HambiMapAlt;
location / {
root /home/bernhardt/Entwicklung/HambiMap/sketch/alt;
}
}
server {
listen 1314;
server_name HambiMap;
root /home/bernhardt/Entwicklung/HambiMap;
location /leaflet/ {
}
location /fontawesome/ {
}
location / {
root /home/bernhardt/Entwicklung/HambiMap/sketch/html;
}
}

4
sketch/html/barrio_view.html
View file

@ -1,4 +0,0 @@
<!DOCTYPE html>
<html>
</html>

4
sketch/html/comment_form.html
View file

@ -1,4 +0,0 @@
<!DOCTYPE html>
<html>
</html>

4
sketch/html/gallery.html
View file

@ -1,4 +0,0 @@
<!DOCTYPE html>
<html>
</html>

4
sketch/html/house_form.html
View file

@ -1,4 +0,0 @@
<!DOCTYPE html>
<html>
</html>

BIN
sketch/html/images/buche_gesund_haus.png
View file

Binary file not shown.
Side by side

Before

Width:  |  Height:  |  Size: 928 KiB

BIN
sketch/html/images/buche_gesund_kuppel.png
View file

Binary file not shown.
Side by side

Before

Width:  |  Height:  |  Size: 887 KiB

BIN
sketch/html/images/buche_gesund_portaledge.png
View file

Binary file not shown.
Side by side

Before

Width:  |  Height:  |  Size: 916 KiB

BIN
sketch/html/images/buche_krank_haus.png
View file

Binary file not shown.
Side by side

Before

Width:  |  Height:  |  Size: 854 KiB

BIN
sketch/html/images/buche_krank_kuppel.png
View file

Binary file not shown.
Side by side

Before

Width:  |  Height:  |  Size: 827 KiB

BIN
sketch/html/images/buche_krank_portaledge.png
View file

Binary file not shown.
Side by side

Before

Width:  |  Height:  |  Size: 842 KiB

BIN
sketch/html/images/buche_tot_haus.png
View file

Binary file not shown.
Side by side

Before

Width:  |  Height:  |  Size: 738 KiB

BIN
sketch/html/images/buche_tot_kuppel.png
View file

Binary file not shown.
Side by side

Before

Width:  |  Height:  |  Size: 721 KiB

BIN
sketch/html/images/buche_tot_portaledge.png
View file

Binary file not shown.
Side by side

Before

Width:  |  Height:  |  Size: 725 KiB

BIN
sketch/html/images/eiche_gesund_haus.png
View file

Binary file not shown.
Side by side

Before

Width:  |  Height:  |  Size: 827 KiB

BIN
sketch/html/images/eiche_gesund_kuppel.png
View file

Binary file not shown.
Side by side

Before

Width:  |  Height:  |  Size: 785 KiB

BIN
sketch/html/images/eiche_grün_portaledge.png
View file

Binary file not shown.
Side by side

Before

Width:  |  Height:  |  Size: 791 KiB

BIN
sketch/html/images/eiche_krank_haus.png
View file

Binary file not shown.
Side by side

Before

Width:  |  Height:  |  Size: 694 KiB

BIN
sketch/html/images/eiche_krank_kuppel.png
View file

Binary file not shown.
Side by side

Before

Width:  |  Height:  |  Size: 676 KiB

BIN
sketch/html/images/eiche_krank_portaledge.png
View file

Binary file not shown.
Side by side

Before

Width:  |  Height:  |  Size: 681 KiB

BIN
sketch/html/images/eiche_tot_haus.png
View file

Binary file not shown.
Side by side

Before

Width:  |  Height:  |  Size: 630 KiB

BIN
sketch/html/images/eiche_tot_kuppel.png
View file

Binary file not shown.
Side by side

Before

Width:  |  Height:  |  Size: 611 KiB

BIN
sketch/html/images/eiche_tot_portaledge.png
View file

Binary file not shown.
Side by side

Before

Width:  |  Height:  |  Size: 615 KiB

BIN
sketch/html/images/fichte_gesund_haus.png
View file

Binary file not shown.
Side by side

Before

Width:  |  Height:  |  Size: 748 KiB

BIN
sketch/html/images/fichte_gesund_kuppel.png
View file

Binary file not shown.
Side by side

Before

Width:  |  Height:  |  Size: 692 KiB

BIN
sketch/html/images/fichte_gesund_portaledge.png
View file

Binary file not shown.
Side by side

Before

Width:  |  Height:  |  Size: 695 KiB

BIN
sketch/html/images/fichte_krank_haus.png
View file

Binary file not shown.
Side by side

Before

Width:  |  Height:  |  Size: 682 KiB

BIN
sketch/html/images/fichte_krank_kuppel.png
View file

Binary file not shown.
Side by side

Before

Width:  |  Height:  |  Size: 622 KiB

BIN
sketch/html/images/fichte_krank_portaledge.png
View file

Binary file not shown.
Side by side

Before

Width:  |  Height:  |  Size: 626 KiB

BIN
sketch/html/images/fichte_tot_haus.png
View file

Binary file not shown.
Side by side

Before

Width:  |  Height:  |  Size: 604 KiB

BIN
sketch/html/images/fichte_tot_kuppel.png
View file

Binary file not shown.
Side by side

Before

Width:  |  Height:  |  Size: 552 KiB

BIN
sketch/html/images/fichte_tot_portaledge.png
View file

Binary file not shown.
Side by side

Before

Width:  |  Height:  |  Size: 554 KiB

178
sketch/html/index.html
View file

@ -1,10 +1,180 @@
<!DOCTYPE html>
<html>
<title>Sketch HambiMap</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="w3.css">
<link rel="stylesheet" href="style.css">
<!--leaflet from CDN
<link rel="stylesheet" href="https://unpkg.com/leaflet@1.9.4/dist/leaflet.css"
integrity="sha256-p4NxAoJBhIIN+hmNHrzRCf9tD/miZyoHS5obTRR9BMY="
crossorigin=""/>
<script src="https://unpkg.com/leaflet@1.9.4/dist/leaflet.js"
integrity="sha256-20nQCchB9co0qIjJZRGuk2/Z9VM+kNiyxNV1lvTlZBo="
crossorigin=""></script>-->
<!--self-served leaflet-->
<link rel="stylesheet" href="leaflet/leaflet.css">
<!--integrity="sha256-p4NxAoJBhIIN+hmNHrzRCf9tD/miZyoHS5obTRR9BMY="-->
<script src="leaflet/leaflet.js">
<!--integrity="sha256-20nQCchB9co0qIjJZRGuk2/Z9VM+kNiyxNV1lvTlZBo="-->
</script>
<script>
var modals=document.getElementsByClassName('w3-modal');
window.onclick = function(event) {
for(var j = 0; j < modals.length; ++j){
if (event.target == modals[j]) {
modals[j].style.display = "none";
}
}
}
function switch_modal(id){
for(var i = 0; i < modals.length; ++i){
modals[i].style.display = 'none';
}
if (id!='none'){
document.getElementById(id).style.display='block';
}
}
</script>
<body>
<h2>Sketch HambiMap</h2>
<a href="main_with_title.html">Sketch with a title area above the map</a>
<br/>
<a href="main_with_sidebar.html">Sketch where I moved all the stuff from the title area to a sidebar</a>
<div id="modals">
<div id="modal_view_treehouse" class="w3-modal">
<div class="w3-modal-content">
<div class="w3-container">
<span onclick="switch_modal('none');"
class="w3-button w3-display-topright">&times;</span>
<iframe src="treehouse_view.html"></iframe>
</div>
</div>
</div>
<!-- The Modals -->
<div id="modal_view_tree" class="w3-modal">
<div class="w3-modal-content">
<div class="w3-container">
<span onclick="switch_modal('none');"
class="w3-button w3-display-topright">&times;</span>
<iframe src="tree_view.html"></iframe>
</div>
</div>
</div>
<div id="modal_view_barrio" class="w3-modal">
<div class="w3-modal-content">
<div class="w3-container">
<span onclick="switch_modal('none');"
class="w3-button w3-display-topright">&times;</span>
<iframe src="barrio_view.html"></iframe>
</div>
</div>
</div>
<div id="modal_form_treehouse" class="w3-modal">
<div class="w3-modal-content">
<div class="w3-container">
<span onclick="switch_modal('none');"
class="w3-button w3-display-topright">&times;</span>
<iframe src="treehouse_form.html"></iframe>
</div>
</div>
</div>
<div id="modal_form_tree" class="w3-modal">
<div class="w3-modal-content">
<div class="w3-container">
<span onclick="switch_modal('none');"
class="w3-button w3-display-topright">&times;</span>
<iframe src="tree_form.html"></iframe>
</div>
</div>
</div>
<div id="modal_form_barrio" class="w3-modal">
<div class="w3-modal-content">
<div class="w3-container">
<span onclick="switch_modal('none');"
class="w3-button w3-display-topright">&times;</span>
<iframe src="barrio_form.html"></iframe>
</div>
</div>
</div>
<div id="modal_form_story" class="w3-modal">
<div class="w3-modal-content">
<div class="w3-container">
<span onclick="switch_modal('none');"
class="w3-button w3-display-topright">&times;</span>
<iframe src="story_form.html"></iframe>
</div>
</div>
</div>
<div id="modal_form_photo" class="w3-modal">
<div class="w3-modal-content">
<div class="w3-container">
<span onclick="switch_modal('none');"
class="w3-button w3-display-topright">&times;</span>
<iframe src="photo_form.html"></iframe>
</div>
</div>
</div>
<div id="modal_form_comment" class="w3-modal">
<div class="w3-modal-content">
<div class="w3-container">
<span onclick="switch_modal('none');"
class="w3-button w3-display-topright">&times;</span>
<iframe src="comment_form.html"></iframe>
</div>
</div>
<div id="modal_form_house" class="w3-modal">
<div class="w3-modal-content">
<div class="w3-container">
<span onclick="switch_modal('none');"
class="w3-button w3-display-topright">&times;</span>
<iframe src="house_form.html"></iframe>
</div>
</div>
</div>
</div>
</div>
<div class="w3-container" id="site_body">
<h2>Stories of Hambi</h2>
<!-- Trigger/Open the Modals -->
<button onclick="switch_modal('modal_view_treehouse')" class="w3-button">View Treehouse</button>
<button onclick="switch_modal('modal_view_barrio')" class="w3-button">View Barrio</button>
<button onclick="switch_modal('modal_view_tree')" class="w3-button">View Tree</button>
<button onclick="switch_modal('modal_form_treehouse')" class="w3-button">Add Treehouse</button>
<button onclick="switch_modal('modal_form_barrio')" class="w3-button">Add Barrio</button>
<a href="user_form.html" class="w3-button">Register</a>
<a href="login_form.html" class="w3-button">Login</a>
<div id="map"></div>
</div>
<script>
var map = L.map('map').setView([50.880301, 6.560531], 13,);
L.tileLayer('https://tile.openstreetmap.org/{z}/{x}/{y}.png', { minZoom: 12, maxZoom: 19, attribution: '&copy; <a href="http://www.openstreetmap.org/copyright">OpenStreetMap</a>' }).addTo(map);
var barrio_markers = L.layerGroup(); //overlay where all barrio markers will be added
var tree_markers = L.layerGroup(); //overlay where all tree(house) markers will be added
var test_tree_marker = L.marker([50.880301, 6.560531]).addTo(tree_markers);
map.addLayer(tree_markers);
function onMapClick(e){} //for adding a tree(house)
function onMapZoom(e){ //for deciding wether to show barrios or treehouses
if (map.getZoom() > 16) {
map.addLayer(barrio_markers);
map.removeLayer(tree_markers);
}
if (map.getZoom() <= 16) {
map.addLayer(tree_markers);
map.removeLayer(barrio_markers);
}
}
function onMapMouseDown(e){} //probably needed for Barrio creation
function onMapMouseUp(e){} //^^
function onMapContextMenu(e){}//probably neat for something
map.on('click', onMapClick);
map.on('zoom', onMapZoom);
map.on('mousedown', onMapMouseDown);
map.on('mouseup', onMapMouseUp);
map.on('contextMenu', onMapContextMenu);
</script>
</body>
</html>

83
sketch/html/main_with_sidebar.html
View file

@ -1,83 +0,0 @@
<!DOCTYPE html>
<html>
<head>
<title>Sketch HambiMap</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="w3.css">
<link rel="stylesheet" href="style.css">
<link href="fontawesome/5.3.1/css/all.css" rel="stylesheet">
<!--self-served leaflet-->
<link rel="stylesheet" href="leaflet/Leaflet-1.9.4/leaflet.css">
<link rel="stylesheet" href="leaflet/leaflet-sidebar-v2/css/leaflet-sidebar.css">
</head>
<body>
<div id="sidebar" class="leaflet-sidebar collapsed">
<!-- nav tabs -->
<div class="leaflet-sidebar-tabs">
<!-- top aligned tabs -->
<ul role="tablist">
<li><a href="#home" role="tab"><i class="fa fa-bars active"></i></a></li>
<li><a href="#autopan" role="tab"><i class="fa fa-arrows"></i></a></li>
</ul>
</div>
<!-- panel content -->
<div class="leaflet-sidebar-content">
<div class="leaflet-sidebar-pane" id="home">
<h1 class="leaflet-sidebar-header">
HambiMap Sketch
<span class="leaflet-sidebar-close"><i class="fa fa-caret-left"></i></span>
</h1>
<p>A map designed to collect histories of Hambi treehouses</p>
</div><!--sidebar-pane home-->
</div><!--sidebar-content-->
</div><!--sidebar-->
<div id="map" style="height: 100vh;"></div>
<script src="leaflet/Leaflet-1.9.4/leaflet.js">
<!--integrity="sha256-20nQCchB9co0qIjJZRGuk2/Z9VM+kNiyxNV1lvTlZBo="-->
</script>
<script src="leaflet/leaflet-sidebar-v2/js/leaflet-sidebar.js"></script>
<script>
var map = L.map('map').setView([50.880301, 6.560531], 13,);
L.tileLayer('https://tile.openstreetmap.org/{z}/{x}/{y}.png', { minZoom: 12, maxZoom: 19, attribution: '&copy; <a href="http://www.openstreetmap.org/copyright">OpenStreetMap</a>' }).addTo(map);
var barrio_markers = L.layerGroup(); //overlay where all barrio markers will be added
var tree_markers = L.layerGroup(); //overlay where all tree(house) markers will be added
var test_tree_marker = L.marker([50.880301, 6.560531]).addTo(tree_markers);
map.addLayer(tree_markers);
function onMapClick(e){} //for adding a tree(house)
function onMapZoom(e){ //for deciding wether to show barrios or treehouses
if (map.getZoom() > 16) {
map.addLayer(barrio_markers);
map.removeLayer(tree_markers);
}
if (map.getZoom() <= 16) {
map.addLayer(tree_markers);
map.removeLayer(barrio_markers);
}
}
function onMapMouseDown(e){} //probably needed for Barrio creation
function onMapMouseUp(e){} //^^
function onMapContextMenu(e){}//probably neat for something
map.on('click', onMapClick);
map.on('zoomend', onMapZoom);
map.on('mousedown', onMapMouseDown);
map.on('mouseup', onMapMouseUp);
map.on('contextMenu', onMapContextMenu);
var sidebar = L.control.sidebar({
container: 'sidebar', // the DOM container or #ID of a predefined sidebar container that should be used
}).addTo(map).open('home');
</script>
</body>
</html>

180
sketch/html/main_with_title.html
View file

@ -1,180 +0,0 @@
<!DOCTYPE html>
<html>
<title>Sketch HambiMap</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="w3.css">
<link rel="stylesheet" href="style.css">
<!--leaflet from CDN
<link rel="stylesheet" href="https://unpkg.com/leaflet@1.9.4/dist/leaflet.css"
integrity="sha256-p4NxAoJBhIIN+hmNHrzRCf9tD/miZyoHS5obTRR9BMY="
crossorigin=""/>
<script src="https://unpkg.com/leaflet@1.9.4/dist/leaflet.js"
integrity="sha256-20nQCchB9co0qIjJZRGuk2/Z9VM+kNiyxNV1lvTlZBo="
crossorigin=""></script>-->
<!--self-served leaflet-->
<link rel="stylesheet" href="leaflet/Leaflet-1.9.4/leaflet.css">
<!--integrity="sha256-p4NxAoJBhIIN+hmNHrzRCf9tD/miZyoHS5obTRR9BMY="-->
<script src="leaflet/Leaflet-1.9.4/leaflet.js">
<!--integrity="sha256-20nQCchB9co0qIjJZRGuk2/Z9VM+kNiyxNV1lvTlZBo="-->
</script>
<script>
var modals=document.getElementsByClassName('w3-modal');
window.onclick = function(event) {
for(var j = 0; j < modals.length; ++j){
if (event.target == modals[j]) {
modals[j].style.display = "none";
}
}
}
function switch_modal(id){
for(var i = 0; i < modals.length; ++i){
modals[i].style.display = 'none';
}
if (id!='none'){
document.getElementById(id).style.display='block';
}
}
</script>
<body>
<div id="modals">
<div id="modal_view_treehouse" class="w3-modal">
<div class="w3-modal-content">
<div class="w3-container">
<span onclick="switch_modal('none');"
class="w3-button w3-display-topright">&times;</span>
<iframe src="treehouse_view.html"></iframe>
</div>
</div>
</div>
<!-- The Modals -->
<div id="modal_view_tree" class="w3-modal">
<div class="w3-modal-content">
<div class="w3-container">
<span onclick="switch_modal('none');"
class="w3-button w3-display-topright">&times;</span>
<iframe src="tree_view.html"></iframe>
</div>
</div>
</div>
<div id="modal_view_barrio" class="w3-modal">
<div class="w3-modal-content">
<div class="w3-container">
<span onclick="switch_modal('none');"
class="w3-button w3-display-topright">&times;</span>
<iframe src="barrio_view.html"></iframe>
</div>
</div>
</div>
<div id="modal_form_treehouse" class="w3-modal">
<div class="w3-modal-content">
<div class="w3-container">
<span onclick="switch_modal('none');"
class="w3-button w3-display-topright">&times;</span>
<iframe src="treehouse_form.html"></iframe>
</div>
</div>
</div>
<div id="modal_form_tree" class="w3-modal">
<div class="w3-modal-content">
<div class="w3-container">
<span onclick="switch_modal('none');"
class="w3-button w3-display-topright">&times;</span>
<iframe src="tree_form.html"></iframe>
</div>
</div>
</div>
<div id="modal_form_barrio" class="w3-modal">
<div class="w3-modal-content">
<div class="w3-container">
<span onclick="switch_modal('none');"
class="w3-button w3-display-topright">&times;</span>
<iframe src="barrio_form.html"></iframe>
</div>
</div>
</div>
<div id="modal_form_story" class="w3-modal">
<div class="w3-modal-content">
<div class="w3-container">
<span onclick="switch_modal('none');"
class="w3-button w3-display-topright">&times;</span>
<iframe src="story_form.html"></iframe>
</div>
</div>
</div>
<div id="modal_form_photo" class="w3-modal">
<div class="w3-modal-content">
<div class="w3-container">
<span onclick="switch_modal('none');"
class="w3-button w3-display-topright">&times;</span>
<iframe src="photo_form.html"></iframe>
</div>
</div>
</div>
<div id="modal_form_comment" class="w3-modal">
<div class="w3-modal-content">
<div class="w3-container">
<span onclick="switch_modal('none');"
class="w3-button w3-display-topright">&times;</span>
<iframe src="comment_form.html"></iframe>
</div>
</div>
<div id="modal_form_house" class="w3-modal">
<div class="w3-modal-content">
<div class="w3-container">
<span onclick="switch_modal('none');"
class="w3-button w3-display-topright">&times;</span>
<iframe src="house_form.html"></iframe>
</div>
</div>
</div>
</div>
</div>
<div class="w3-container" id="site_body">
<h2>Stories of Hambi</h2>
<!-- Trigger/Open the Modals -->
<button onclick="switch_modal('modal_view_treehouse')" class="w3-button">View Treehouse</button>
<button onclick="switch_modal('modal_view_barrio')" class="w3-button">View Barrio</button>
<button onclick="switch_modal('modal_view_tree')" class="w3-button">View Tree</button>
<button onclick="switch_modal('modal_form_treehouse')" class="w3-button">Add Treehouse</button>
<button onclick="switch_modal('modal_form_barrio')" class="w3-button">Add Barrio</button>
<a href="user_form.html" class="w3-button">Register</a>
<a href="login_form.html" class="w3-button">Login</a>
<div id="map"></div>
</div>
<script>
var map = L.map('map').setView([50.880301, 6.560531], 13,);
L.tileLayer('https://tile.openstreetmap.org/{z}/{x}/{y}.png', { minZoom: 12, maxZoom: 19, attribution: '&copy; <a href="http://www.openstreetmap.org/copyright">OpenStreetMap</a>' }).addTo(map);
var barrio_markers = L.layerGroup(); //overlay where all barrio markers will be added
var tree_markers = L.layerGroup(); //overlay where all tree(house) markers will be added
var test_tree_marker = L.marker([50.880301, 6.560531]).addTo(tree_markers);
map.addLayer(tree_markers);
function onMapClick(e){} //for adding a tree(house)
function onMapZoom(e){ //for deciding wether to show barrios or treehouses
if (map.getZoom() > 16) {
map.addLayer(barrio_markers);
map.removeLayer(tree_markers);
}
if (map.getZoom() <= 16) {
map.addLayer(tree_markers);
map.removeLayer(barrio_markers);
}
}
function onMapMouseDown(e){} //probably needed for Barrio creation
function onMapMouseUp(e){} //^^
function onMapContextMenu(e){}//probably neat for something
map.on('click', onMapClick);
map.on('zoom', onMapZoom);
map.on('mousedown', onMapMouseDown);
map.on('mouseup', onMapMouseUp);
map.on('contextMenu', onMapContextMenu);
</script>
</body>
</html>

1
sketch/html/photo_form.html
View file

@ -1 +0,0 @@
<!DOCTYPE html>

3
sketch/html/story_form.html
View file

@ -1,3 +0,0 @@
<!DOCTYPE html>
<html>
</html>

3
sketch/html/tree_view.html
View file

@ -1,3 +0,0 @@
<!DOCTYPE html>
<html>
</html>

44
sketch/html/treehouse_form.html
View file

@ -1,44 +0,0 @@
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="w3.css">
<link rel="stylesheet" href="style.css">
<link href="fontawesome/5.3.1/css/all.css" rel="stylesheet">
</head>
<div id='iconpicker' style='width:200px;'>
</div>
<script>
const iconpicker = document.getElementById('iconpicker');
const icon = [0,0,0];
const icons = [['buche','eiche','fichte'],['gesund','krank','tot'],['portaledge','kuppel','haus']];
iconpicker.innerHTML=`
<div class='w3-container w3-row'>
<div class='w3-col s2 m2 l2'>
<div class='w3-row'><button id='species_left' onclick='rotate(0,-1)'><i class="fa fa-caret-left"></i></button></div>
<div class='w3-row'><button id='state_left' onclick='rotate(1,-1)'><i class="fa fa-caret-left"></i></button></div>
<div class='w3-row'><button id='plattform_left' onclick='rotate(2,-1)'><i class="fa fa-caret-left"></i></button></div>
</div>
<div class='w3-col s8 m8 l8'>
<img id='icon' src='images/${icons[0][0]}_${icons[1][0]}_${icons[2][0]}.png' width='90%'/>
</div>
<div class='w3-col s2 m2 l2'>
<div class='w3-row'><button id='species_right' onclick='rotate(0,1)'><i class="fa fa-caret-right"></i></button></div>
<div class='w3-row'><button id='state_right' onclick='rotate(1,1)'><i class="fa fa-caret-right"></i></button></div>
<div class='w3-row'><button id='plattform_right' onclick='rotate(2,1)'><i class="fa fa-caret-right"></i></button></div>
</div>
</div>`;
const icon_elem = document.getElementById('icon');
function rotate(pos,dir){
icon[pos] += dir;
if (icon[pos]<0) icon[pos]=icons[pos].length-1;
if (icon[pos]>=icons[pos].length) icon[pos]=0;
const image = 'images/'+icons[0][icon[0]]+'_'+icons[1][icon[1]]+'_'+icons[2][icon[2]]+'.png';
icon_elem.src=image;
}
</script>
</html>

4
sketch/html/treehouse_teaser.html
View file

@ -1,4 +0,0 @@
<!DOCTYPE html>
<html>
</html>

5
sketch/html/treehouse_view.html
View file

@ -1,4 +1 @@
<!DOCTYPE html>
<html>
<h3>Treehouse View</h3>
</html>
Treehouse View

4
sketch/html/user_form.html
View file

@ -1,4 +0,0 @@
<!DOCTYPE html>
<html>
</html>