add prototype of icon picker
|
|
@ -9,9 +9,10 @@ server {
|
||||||
server {
|
server {
|
||||||
listen 1314;
|
listen 1314;
|
||||||
server_name HambiMap;
|
server_name HambiMap;
|
||||||
|
root /home/bernhardt/Entwicklung/HambiMap;
|
||||||
location /leaflet/ {
|
location /leaflet/ {
|
||||||
root /home/bernhardt/Entwicklung/HambiMap;
|
}
|
||||||
autoindex on;
|
location /fontawesome/ {
|
||||||
}
|
}
|
||||||
location / {
|
location / {
|
||||||
root /home/bernhardt/Entwicklung/HambiMap/sketch/html;
|
root /home/bernhardt/Entwicklung/HambiMap/sketch/html;
|
||||||
|
|
|
||||||
BIN
sketch/html/images/buche_gesund_haus.png
Normal file
|
After 
(image error) Size: 928 KiB |
BIN
sketch/html/images/buche_gesund_kuppel.png
Normal file
|
After 
(image error) Size: 887 KiB |
BIN
sketch/html/images/buche_gesund_portaledge.png
Normal file
|
After 
(image error) Size: 916 KiB |
BIN
sketch/html/images/buche_krank_haus.png
Normal file
|
After 
(image error) Size: 854 KiB |
BIN
sketch/html/images/buche_krank_kuppel.png
Normal file
|
After 
(image error) Size: 827 KiB |
BIN
sketch/html/images/buche_krank_portaledge.png
Normal file
|
After 
(image error) Size: 842 KiB |
BIN
sketch/html/images/buche_tot_haus.png
Normal file
|
After 
(image error) Size: 738 KiB |
BIN
sketch/html/images/buche_tot_kuppel.png
Normal file
|
After 
(image error) Size: 721 KiB |
BIN
sketch/html/images/buche_tot_portaledge.png
Normal file
|
After 
(image error) Size: 725 KiB |
BIN
sketch/html/images/eiche_gesund_haus.png
Normal file
|
After 
(image error) Size: 827 KiB |
BIN
sketch/html/images/eiche_gesund_kuppel.png
Normal file
|
After 
(image error) Size: 785 KiB |
BIN
sketch/html/images/eiche_grün_portaledge.png
Normal file
|
After 
(image error) Size: 791 KiB |
BIN
sketch/html/images/eiche_krank_haus.png
Normal file
|
After 
(image error) Size: 694 KiB |
BIN
sketch/html/images/eiche_krank_kuppel.png
Normal file
|
After 
(image error) Size: 676 KiB |
BIN
sketch/html/images/eiche_krank_portaledge.png
Normal file
|
After 
(image error) Size: 681 KiB |
BIN
sketch/html/images/eiche_tot_haus.png
Normal file
|
After 
(image error) Size: 630 KiB |
BIN
sketch/html/images/eiche_tot_kuppel.png
Normal file
|
After 
(image error) Size: 611 KiB |
BIN
sketch/html/images/eiche_tot_portaledge.png
Normal file
|
After 
(image error) Size: 615 KiB |
BIN
sketch/html/images/fichte_gesund_haus.png
Normal file
|
After 
(image error) Size: 748 KiB |
BIN
sketch/html/images/fichte_gesund_kuppel.png
Normal file
|
After 
(image error) Size: 692 KiB |
BIN
sketch/html/images/fichte_gesund_portaledge.png
Normal file
|
After 
(image error) Size: 695 KiB |
BIN
sketch/html/images/fichte_krank_haus.png
Normal file
|
After 
(image error) Size: 682 KiB |
BIN
sketch/html/images/fichte_krank_kuppel.png
Normal file
|
After 
(image error) Size: 622 KiB |
BIN
sketch/html/images/fichte_krank_portaledge.png
Normal file
|
After 
(image error) Size: 626 KiB |
BIN
sketch/html/images/fichte_tot_haus.png
Normal file
|
After 
(image error) Size: 604 KiB |
BIN
sketch/html/images/fichte_tot_kuppel.png
Normal file
|
After 
(image error) Size: 552 KiB |
BIN
sketch/html/images/fichte_tot_portaledge.png
Normal file
|
After 
(image error) Size: 554 KiB |
|
|
@ -0,0 +1,44 @@
|
||||||
|
<!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>
|
||||||
|
|
||||||