summaryrefslogtreecommitdiff
path: root/examples/gipfel2html
blob: 02bf2bf3e8836c1ffb58bd342dd64531195bc13e (plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
#!/bin/sh

MODE="$1"
TITLE="$2"
FILE="$3"

if [ "$MODE" = "images" ]; then
	DATAFILE="gipfelweb/gipfel/${FILE}.imgs"
else
	DATAFILE="gipfelweb/gipfel/${FILE}.hills"
fi

cat << EOF
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/1999/REC-html401-19991224/loose.dtd">
<html>
<head>
EOF

echo "<title>$TITLE</title>"

cat << EOF
<style type="text/css">
#gipfel { display: block; position: relative; margin: 0; padding: 0; }
#gipfel li { visibility: hidden; list-style-type: none; position: absolute; background: url(25w.png); border: 1px solid black; font-family: sans-serif; font-size: x-small; color: #000; padding: 0; line-height: 1.3em; overflow: hidden; }
#gipfel span { visibility: hidden; position: absolute; left: 0; right: 0; display: block; padding: 5px; }
#gipfel:hover li { visibility: visible; }
#gipfel li:hover span {visibility: visible;}
EOF

IFS="	"
i=0
grep -v "^#" ${DATAFILE} | \
while read name height x y dist flags dummy; do
	if [ "$MODE" = "images" ]; then
		thumb_w=`identify -format %w gipfelweb/thumbs/${name}`
		thumb_h=`identify -format %h gipfelweb/thumbs/${name}`

		echo "#id_${i} {left:$((${x} - 10 / 2))px; top: $((${y} - 6 / 2))px; width: 10px; height: 6px;}"
		echo "#id_${i}:hover {width: ${thumb_w}px; height: ${thumb_h}px; background: url(thumbs/${name});}"
	else
		echo "#id_${i} {left:$((${x} - 4 / 2))px; top: $((${y} - 4 / 2))px; width: 4px; height: 4px;}"
		echo "#id_${i}:hover {width: 200px; height: 20px;}"
	fi

	i=$((${i} + 1))
done

cat << EOF
</style></head>
<body bgcolor="#919faa">
<script type="text/javascript"><!--
google_ad_client = "pub-4715934322518147";
google_ad_width = 728;
google_ad_height = 90;
google_ad_format = "728x90_as";
google_ad_type = "text_image";
google_ad_channel = "";
google_color_border = "ffffff";
google_color_bg = "f3f3f3";
google_color_link = "000000";
google_color_text = "333333";
google_color_url = "666666";
--></script><script type="text/javascript" src="http://pagead2.googlesyndication.com/pagead/show_ads.js"></script>
<br/>
<br/>
EOF

echo "<h3>$TITLE</h3>"

if [ "$MODE" = "images" ]; then
	echo "<a href=\"hills/${FILE}.html\">show hill names</a>"
else
	echo "<a href=\"../${FILE}.html\">back to gipfelweb</a>"
fi

cat << EOF
<table border="0" cellpadding="0" cellspacing="1" bgcolor="black">
<tr><td>
<table border="0" cellpadding="10" cellspacing="0" bgcolor="white">
<tr><td>
<div id="gipfel">
EOF

if [ "$MODE" = "images" ]; then
	echo "<img src=\"slides/${FILE}.jpg\"/>"
else
	echo "<img src=\"../slides/${FILE}.jpg\"/>"
fi


echo "<ul>"
i=0
grep -v "^#" ${DATAFILE} | \
while read name height x y dist flags dummy; do
	if [ "$MODE" = "images" ]; then
		THUMB_TITLE="${name%.jpg}"
		if [ -e "${name%.jpg}.title" ]; then
			THUMB_TITLE=`cat ${name%.jpg}.title`
		fi
		echo "<li id=\"id_${i}\"><a href=\"${name%.jpg}.html\"><span>${THUMB_TITLE} (${height}m)</span></a></li>"
	else
		echo "<li id=\"id_${i}\"><span>${name} (${height}m)</span></li>"
	fi

	i=$((${i} + 1))
done
echo "</ul>"

cat << EOF
</div>
</td></tr>
</table>
</td></tr>
</table>
<br/>
Move the mouse over the image to see other images of which the 
viewpoint is visible.
Move the mouse over the rectangle to see a thumbnail.
<br/>
<br/>

This image is visible on these images:<br/>
EOF

grep -l ${FILE} gipfelweb/gipfel/*.imgs | \
while read f; do
	img="`basename ${f%.imgs}`"
	if [ "$MODE" = "images" ]; then
		echo "<a href=\"${img}.html\"><img src=\"thumbs/${img}.jpg\"></a><br/>"
	else
		echo "<a href=\"../${img}.html\"><img src=\"../thumbs/${img}.jpg\"></a><br/>"
	fi
done


cat << EOF
<small>copyright &copy; 2007 <a href="http://www.ecademix.com/JohannesHofmann/impressum.html">Johannes Hofmann</a></small>
</body>
</html>
EOF