2
0
mirror of https://expo.survex.com/repositories/troggle/.git synced 2025-12-15 05:27:07 +00:00

tabs to spaces

This commit is contained in:
Philip Sargent
2021-04-28 00:50:36 +01:00
parent cb6619a90a
commit 62799d196b

View File

@@ -1,413 +1,415 @@
{% extends "cavebase.html" %} {% extends "cavebase.html" %}
<!-- cave.html - this text visible because this template has been included -->
{% block extraheaders %} {% block extraheaders %}
{% if cave.survex_file %} {% if cave.survex_file %}
<style>
# This is presumably very similar caveview.css but why is it copied here ?
# Because it is NOT the same as the distrubuted CaveView code.
# Needs to be separated out into JSLIB local. (PMS 3/4/2021) <!--# This is presumably very similar caveview.css but why is it copied here ?
# Because it is NOT exactly the same as the distrubuted CaveView code.
#e.g. the body {} bit in Caveview/css/caveview.css is missing here:
# Needs to be separated out into JSLIB local. (PMS 27/4/2021)
-->
<style>
div.cv-panel { div.cv-panel {
position: absolute; position: absolute;
top: 0; top: 0;
left: 0; left: 0;
z-index: 100; z-index: 100;
background-color: rgba(50,50,50,0.5); background-color: rgba(50,50,50,0.5);
color: yellowgreen; color: yellowgreen;
border: 1px solid black; border: 1px solid black;
border-radius: 5px; border-radius: 5px;
} }
div.cv-compass, div.cv-ahi { div.cv-compass, div.cv-ahi {
position: absolute; position: absolute;
bottom: 95px; bottom: 95px;
right: 5px; right: 5px;
margin: 0; margin: 0;
padding-top: 2px; padding-top: 2px;
/* border: 1px solid white; */ /* border: 1px solid white; */
text-align: center; text-align: center;
width: 78px; width: 78px;
height: 19px; height: 19px;
z-index: 50; z-index: 50;
background-color: rgba(50,50,50,0.5); background-color: rgba(50,50,50,0.5);
background-color: black; background-color: black;
color: white; color: white;
} }
div.cv-ahi { div.cv-ahi {
right: 95px; right: 95px;
} }
div.scale-legend { div.scale-legend {
position: absolute; position: absolute;
color: white; color: white;
background-color: black; background-color: black;
bottom: 30px; bottom: 30px;
} }
div.linear-scale { div.linear-scale {
position: absolute; position: absolute;
color: white; color: white;
background-color: black; background-color: black;
right: 30px; right: 30px;
width: 40px; width: 40px;
padding: 2px 0; padding: 2px 0;
text-align: right; text-align: right;
border: 1px solid black; border: 1px solid black;
font-size: 14px; font-size: 14px;
} }
div.linear-scale-caption { div.linear-scale-caption {
position: absolute; position: absolute;
color: white; color: white;
background-color: black; background-color: black;
right: 5px; right: 5px;
width: 65px; width: 65px;
padding: 2px 0 5px 0; padding: 2px 0 5px 0;
text-align: left; text-align: left;
border: 1px solid black; border: 1px solid black;
font-size: 14px; font-size: 14px;
} }
#min-div { #min-div {
border-bottom: 1px solid white; border-bottom: 1px solid white;
} }
#max-div { #max-div {
border-top: 1px solid white; border-top: 1px solid white;
} }
#angle-legend { #angle-legend {
position: absolute; position: absolute;
width: 80px; width: 80px;
right: 5px; right: 5px;
bottom: 180px; bottom: 180px;
color: white; color: white;
background-color: black; background-color: black;
font-size: 14px; font-size: 14px;
text-align: center; text-align: center;
} }
#scene { #scene {
width: 100%; width: 100%;
height: 700px; height: 700px;
position: relative; position: relative;
} }
#progress-bar { #progress-bar {
position: absolute; position: absolute;
top: 55%; top: 55%;
height: 20px; height: 20px;
border: 1px solid white; border: 1px solid white;
z-index: 100; z-index: 100;
} }
#status-text { #status-text {
position: absolute; position: absolute;
top: 50%; top: 50%;
height: 20px; height: 20px;
padding-left: 4px; padding-left: 4px;
background-color: black; background-color: black;
color: white; color: white;
z-index: 100; z-index: 100;
} }
#frame div.page ul { #frame div.page ul {
list-style-type: none; list-style-type: none;
margin: 8px 0 0 0; margin: 8px 0 0 0;
padding: 0; padding: 0;
width: 200px; width: 200px;
height: 100%; height: 100%;
cursor: default; cursor: default;
font-size: 12px; font-size: 12px;
overflow-y: auto; overflow-y: auto;
overflow-x: hidden; overflow-x: hidden;
} }
#frame div.page li { #frame div.page li {
position: relative; position: relative;
margin-left: 16px; margin-left: 16px;
border-bottom: 1px solid #444444; border-bottom: 1px solid #444444;
} }
#frame div.page li.selected { #frame div.page li.selected {
color: #1ab4e5; color: #1ab4e5;
} }
#frame div.page li:hover { #frame div.page li:hover {
color: yellow; color: yellow;
} }
#frame div.page div#ui-path { #frame div.page div#ui-path {
font-size: 12px; font-size: 12px;
border-top: 1px solid grey; border-top: 1px solid grey;
border-bottom: 1px solid grey; border-bottom: 1px solid grey;
margin-top: 8px; margin-top: 8px;
padding: 2px 0 2px 12px; padding: 2px 0 2px 12px;
} }
#frame div.page div#ui-path span { #frame div.page div#ui-path span {
color: #1ab4e5; color: #1ab4e5;
} }
#frame div.page div.slide { #frame div.page div.slide {
position: absolute; position: absolute;
top: 64px; top: 64px;
left: 0px; left: 0px;
height: auto; height: auto;
margin-top:0; margin-top:0;
bottom: 44px; bottom: 44px;
background-color: #222222; background-color: #222222;
transition: transform 0.25s ease-in; transition: transform 0.25s ease-in;
} }
#frame div.slide-out { #frame div.slide-out {
border-right: 1px grey solid; border-right: 1px grey solid;
transform: translateX(-100%); transform: translateX(-100%);
} }
#frame div.page div.descend-tree { #frame div.page div.descend-tree {
position: absolute; position: absolute;
top: 0px; top: 0px;
right: 0px; right: 0px;
margin: 0; margin: 0;
color: #1ab4e5; color: #1ab4e5;
z-index: 110; z-index: 110;
} }
#frame { #frame {
position: absolute; position: absolute;
top: 0px; top: 0px;
left: 0px; left: 0px;
width: 240px; width: 240px;
height: 100%; height: 100%;
background-color: transparent; background-color: transparent;
transform: translateX(-200px); transform: translateX(-200px);
transition: transform 0.25s ease-in; transition: transform 0.25s ease-in;
} }
#frame.onscreen { #frame.onscreen {
transform: none; transform: none;
transition: transform 0.25s ease-out; transition: transform 0.25s ease-out;
} }
#frame a.download { #frame a.download {
border: 1px solid green; border: 1px solid green;
display: block; display: block;
width: 180px; width: 180px;
box-sizing: border-box; box-sizing: border-box;
margin-top: 6px; margin-top: 6px;
margin-bottom: 4px; margin-bottom: 4px;
margin-left: 8px; margin-left: 8px;
border: none; border: none;
border-bottom: 4px solid #1ab4e5; border-bottom: 4px solid #1ab4e5;
color: #dddddd; color: #dddddd;
background-color: black; background-color: black;
padding-bottom: 4px; padding-bottom: 4px;
box-shadow: 1px 1px 8px 0px #888888; box-shadow: 1px 1px 8px 0px #888888;
outline: nonlass="cavedisplay"e; outline: nonlass="cavedisplay"e;
text-decoration: none; text-decoration: none;
text-align: center; text-align: center;
} }
#frame a.download:hover { #frame a.download:hover {
color: white; color: white;
} }
#frame a.download:active { #frame a.download:active {
color: #dddddd; color: #dddddd;
border-bottom: 4px solid #0c536a; border-bottom: 4px solid #0c536a;
box-shadow: none; box-shadow: none;
box-shadow: inset 1px 1px 8px 0px #888888; box-shadow: inset 1px 1px 8px 0px #888888;
} }
#frame .tab { #frame .tab {
position: absolute; position: absolute;
right: 0px;lass="cavedisplay" right: 0px;lass="cavedisplay"
width: 40px; width: 40px;
height: 40px; height: 40px;
box-sizing: border-box; box-sizing: border-box;
background-color: #444444; background-color: #444444;
border-left: 1px solid black; border-left: 1px solid black;
background-position: center; background-position: center;
border-top: 1px solid black; border-top: 1px solid black;
} }
#frame #close { #frame #close {
position: absolute; position: absolute;
right: 40px; right: 40px;
bottom: 0px; bottom: 0px;
width: 40px; width: 40px;
height: 40px; height: 40px;
box-sizing: border-box; box-sizing: border-box;
z-index: 150; z-index: 150;
background-image: url(../images/ic_remove.png); background-image: url(../images/ic_remove.png);
background-position: center; background-position: center;
} }
#icon_settings { #icon_settings {
background-image: url(../images/ic_settings.png); background-image: url(../images/ic_settings.png);
} }
#icon_terrain { #icon_terrain {
background-image: url(../images/ic_terrain.png); background-image: url(../images/ic_terrain.png);
} }
#icon_explore { #icon_explore {
background-image: url(../images/ic_explore.png); background-image: url(../images/ic_explore.png);
} }
#icon_info { #icon_info {
background-image: url(../images/ic_info.png); background-image: url(../images/ic_info.png);
} }
#icon_route { #icon_route {
background-image: url(../images/ic_route.png); background-image: url(../images/ic_route.png);
} }
#icon_help { #icon_help {
background-image: url(../images/ic_help.png); background-image: url(../images/ic_help.png);
} }
#frame div.toptab { #frame div.toptab {
background-color: #222222; background-color: #222222;
border-left: none; border-left: none;
border-right: 1px solid grey; border-right: 1px solid grey;
border-top: 1px solid grey; border-top: 1px solid grey;
} }
#frame div.page { #frame div.page {
position: absolute; position: absolute;
top: 0px; top: 0px;
bottom: 40px; bottom: 40px;
left: 0px; left: 0px;
width: 200px; width: 200px;
height: 100%; height: 100%;
color: white; color: white;
background-color: #222222; background-color: #222222;
padding: 0 4px; padding: 0 4px;
box-sizing: border-box; box-sizing: border-box;
cursor: default; cursor: default;
padding-bottom: 40px; padding-bottom: 40px;
} }
#frame div.page div.header { #frame div.page div.header {
margin: 16px 0px 8px 0px; margin: 16px 0px 8px 0px;
font-weight: bold; font-weight: bold;
height: 16px; height: 16px;
box-sizing: border-box; box-sizing: border-box;
padding-left: 2px; padding-left: 2px;
} }
#frame div.page div.control { #frame div.page div.control {
margin: 2px 0 2px 0; margin: 2px 0 2px 0;
padding-top: 2px; padding-top: 2px;
} }
#frame div.page label { #frame div.page label {
display: block; display: block;
border-top: 1px solid grey; border-top: 1px solid grey;
padding: 2px 0 2px 8px; padding: 2px 0 2px 8px;
font-size: 12px; font-size: 12px;
} }
#frame div.page select { #frame div.page select {
display: block; display: block;
width: 180px; width: 180px;
box-sizing: border-box; box-sizing: border-box;
padding-top: 2px; padding-top: 2px;
margin: 2px 0 4px 8px; margin: 2px 0 4px 8px;
} }
#frame div.page select:empty { #frame div.page select:empty {
background-color: #888888; background-color: #888888;
} }
#frame div.page button { #frame div.page button {
display: block; display: block;
width: 180px; width: 180px;
box-sizing: border-box; box-sizing: border-box;
margin-top: 4px; margin-top: 4px;
margin-bottom: 4px; margin-bottom: 4px;
margin-left: 8px; margin-left: 8px;
border: none; border: none;
border-bottom: 4px solid #1ab4e5; border-bottom: 4px solid #1ab4e5;
color: #dddddd; color: #dddddd;
background-color: black; background-color: black;
padding-bottom: 4px; padding-bottom: 4px;
box-shadow: 1px 1px 8px 0px #888888; box-shadow: 1px 1px 8px 0px #888888;
outline: none; outline: none;
} }
#frame div.page button:hover { #frame div.page button:hover {
color: white; color: white;
} }
#frame div.page button:active { #frame div.page button:active {
color: #dddddd; color: #dddddd;
border-bottom: 4px solid #0c536a; border-bottom: 4px solid #0c536a;
box-shadow: none; box-shadow: none;
box-shadow: inset 1px 1px 8px 0px #888888; box-shadow: inset 1px 1px 8px 0px #888888;
} }
#frame div.page input[type="text"] { #frame div.page input[type="text"] {
display: block; display: block;
width: 180px; width: 180px;
box-sizing: border-box; box-sizing: border-box;
margin-top: 2px; margin-top: 2px;
margin-left: 8px; margin-left: 8px;
} }
#frame div.page input[type="checkbox"] { #frame div.page input[type="checkbox"] {
position: absolute; position: absolute;
right: 0px; right: 0px;
} }
#frame div.page input[type="range"] { #frame div.page input[type="range"] {
display: block; display: block;
width: 180px; width: 180px;
margin-left: 8px; margin-left: 8px;
} }
#frame dt, #frame dd { #frame dt, #frame dd {
font-size: 12px; font-size: 12px;
} }
#frame dt { #frame dt {
clear: both; clear: both;
float: left; float: left;
padding-left: 16px; padding-left: 16px;
} }
#frame dd { #frame dd {
margin-left: 40px; margin-left: 40px;
} }
#frame p { #frame p {
font-size: 12px; font-size: 12px;
line-height: 18px; line-height: 18px;
} }
div.station-info { div.station-info {
position: absolute; position: absolute;
border: 1px solid white; border: 1px solid white;
background-color: #222222; background-color: #222222;
color: white; color: white;
padding: 4px; padding: 4px;
z-index: 200; z-index: 200;
} }
.overlay-branding { .overlay-branding {
color: white; color: white;
margin: 4px; margin: 4px;
position: absolute; position: absolute;
right: 0; right: 0;
top: 0; top: 0;
} }
div#scene { div#scene {
width: 100%; width: 100%;
height: 90%; } height: 90%; }
</style> </style>
@@ -417,20 +419,20 @@ div#scene {
<script type="text/javascript" > <script type="text/javascript" >
function onLoad () { function onLoad () {
// display the user interface - and a blank canvas // display the user interface - and a blank canvas
// the configuration object specifies the location of CaveView, surveys and terrain files // the configuration object specifies the location of CaveView, surveys and terrain files
CV.UI.init( 'scene', { CV.UI.init( 'scene', {
home: '/javascript/CaveView/', home: '/javascript/CaveView/',
surveyDirectory: '/expowebcache/3d/', surveyDirectory: '/expowebcache/3d/',
terrainDirectory: '/loser/surface/terrain/' terrainDirectory: '/loser/surface/terrain/' // cannot work, apache not handling this
} ); } );
// load a single survey to display // load a single survey to display
// Note the special code in views.caves.py to do this. The appropriate .svx/.3d file may not be simply the cave name +.3d // Note the special code in views.caves.py to do this. The appropriate .svx/.3d file may not be simply the cave name +.3d
CV.UI.loadCave('{{svx3d}}.3d'); CV.UI.loadCave('{{svx3d}}.3d');
} }
window.onload = onLoad; window.onload = onLoad;
</script> </script>
{% endif %} <!-- all the above only loads if cave.survex_file is not empty--> {% endif %} <!-- all the above only loads if cave.survex_file is not empty-->
@@ -500,7 +502,7 @@ div#scene {
{% endif %} {% endif %}
{% if cave.survex_file %} {% if cave.survex_file %}
<h2>Survex File</h2> <h2>Survex File</h2>
<a href="{% url "survexcavessingle" cave.kataster_number %}">All survex files</a> &nbsp;&nbsp;&nbsp; <a href="/survexfile">All survex files</a> &nbsp;&nbsp;&nbsp;
<a href="{% if cave.kataster_number %}{% url "cave3d" cave.kataster_number %}{% else %}{% url "cave3d" cave.unofficial_number %}{% endif %}">3d file download</a>&nbsp;&nbsp;&nbsp; <a href="{% if cave.kataster_number %}{% url "cave3d" cave.kataster_number %}{% else %}{% url "cave3d" cave.unofficial_number %}{% endif %}">3d file download</a>&nbsp;&nbsp;&nbsp;
<a href="{% url "svx" svxstem %}">This survex file</a> &nbsp;&nbsp;&nbsp; <a href="{% url "svx" svxstem %}">This survex file</a> &nbsp;&nbsp;&nbsp;
@@ -513,7 +515,7 @@ div#scene {
</div> </div>
<div id="entrances"> <div id="entrances">
<p>{% if cave.entrances %} <p>{% if cave.entrances %}
<h2>Entrances</h2> <h2>Entrances</h2>
<ul> <ul>
{% for ent in cave.entrances %} {% for ent in cave.entrances %}
@@ -570,10 +572,10 @@ div#scene {
{% endif %} {% endif %}
{% if ent.entrance.other_station %} {% if ent.entrance.other_station %}
<dt>Other Station</dt><dd>{{ ent.entrance.other_station|safe }} <dt>Other Station</dt><dd>{{ ent.entrance.other_station|safe }}
{% if ent.entrance.other_description %} {% if ent.entrance.other_description %}
- {{ ent.entrance.other_description|safe }} - {{ ent.entrance.other_description|safe }}
{% endif %} {{ ent.entrance.other_location.y|safe }}, {{ ent.entrance.other_location.x|safe }}, {{ ent.entrance.other_location.z|safe }}m {% endif %} {{ ent.entrance.other_location.y|safe }}, {{ ent.entrance.other_location.x|safe }}, {{ ent.entrance.other_location.z|safe }}m
</dd> </dd>
{% endif %} {% endif %}
</dl> </dl>
</li> </li>