<?php
global $mydata;
global $count;
global $thecorners;
global $block_corners;
global $block_number;
global $height;
global $bns;
global $block_count;
global $building_count;
global $the_building_list;
global $the_lon_lats;
global $current_date;
global $looklong;
global $looklat;
global $buildingIDs;
global $bldgIDcount;
$host = "localhost";
$user = "saintlouisdev";
$pass = "";
$db = "vcities";
$building_count=0;
function do_query($the_query){
$host = "localhost";
$user = "saintlouisdev";
$pass = "";
$db = "vcities";
try {
$hcon = pg_connect("host=$host dbname=$db port=5432 user=$user password=$pass");
if (!$hcon) { echo "Could not connect to server\n"; }
$rs = pg_query($hcon, $the_query) or die("Cannot execute query: $query\n");
pg_close($hcon);
return pg_fetch_all($rs,$result_type = PGSQL_NUM);
} catch (Exception $e) { echo 'Caught exception: '. $e->getMessage(). "\n";}
}
function get_the_heightanddate($bn) {
$host = "localhost";
$user = "saintlouisdev";
$pass = "";
$db = "vcities";
//1118_1121_1124
//echo $db;
try {
$hcon = pg_connect("host=$host dbname=$db port=5432 user=$user password=$pass");
if (!$hcon) {
echo "Could not connect to server\n";
}
$query = "select a.height, to_char(a.default_date, 'YYYY-MM-DD') from cesium_entities a, temporal_objects b where b.id=a.temporalobject_ptr_id and a.entity_type=0 and trim(both ' ' from b.block_number)='" . $bn . "'";
// echo $query;
$rs = pg_query($hcon, $query) or die("Cannot execute query: $query\n");
pg_close($hcon);
$row = pg_fetch_row($rs);
return $row;
// echo $height;
} catch (Exception $e) {
echo 'Caught exception: ', $e->getMessage(), "\n";
}
}
try {
$block_count=$argc-1;
for ($ind = 0;$ind<$block_count;$ind++)$bns[$ind] = $argv[$ind+1];
for ($ib = 0; $ib < $block_count; $ib++) {
$height_currentdate = get_the_heightanddate($bns[$ib]);
$height[$ib] = $height_currentdate[0];
$current_date[$ib] = $height_currentdate[1];
}
$con = pg_connect("host=$host dbname=$db port=5432 user=$user password=$pass");
if (!$con) {
echo "Could not connect to server\n";
}
$the_clause = 'b.block_number=' . "'" . $bns[0] . "' ";
for ($ib = 1; $ib < $block_count; $ib++) {
$the_clause = $the_clause . 'or b.block_number=' . "'" . $bns[$ib] . "' ";
}
$the_clause = ' (' . $the_clause . ') ';
$query1 = 'SELECT b.block_number, a.building_id, c.value, c.is_valid, d.value, d.is_valid, a.points,e.ge_latitude,e.ge_longitude FROM saintlouisdev.geo_footprints a, saintlouisdev.temporal_objects b, saintlouisdev.vc_dates c, saintlouisdev.vc_dates d,CesiumLatLong e WHERE ' . $the_clause;
$query2 = ' AND a.temporalobject_ptr_id=b.id AND b.start_date_id=c.id AND b.end_date_id=d.id AND e.building_id=a.building_id;';
$query = $query1 . $query2;
$rs = pg_query($con, $query) or die("Cannot execute query: $query\n");
pg_close($con);
$i = 0;
while ($row = pg_fetch_row($rs)) {
// $justpoints=substr($row[6],9);
$tok1 = strtok(substr($row[6], 9), " ");
$tok2 = strtok(" ");
for ($j = 0; $j < 5; $j++) {
$mydata[$i][$j] = $row[$j + 1];
}
$mydata[$i][5] = $tok1;
$mydata[$i][6] = $tok2;
$mydata[$i][7] = $row[7];
$mydata[$i][8] = $row[8];;
$i++;
}
$count = $i;
$con = pg_connect("host=$host dbname=$db port=5432 user=$user password=$pass")
or die("Could not connect to server\n");
$query1 = 'select a.points from geo_blocks a ,temporal_objects b WHERE ';
$query2 = ' and a.temporalobject_ptr_id=b.id';
$query = $query1 . $the_clause . $query2;
//echo $query.'<br />';
$rs = pg_query($con, $query) or die("Cannot execute query: $query\n");
pg_close($con);
for ($ib = 0; $ib < $block_count; $ib++) {
$row = pg_fetch_row($rs);
$tok1 = strtok(substr($row[0], 9), " ");
$tok2 = strtok(" ");
$output = shell_exec('java toLatLon ' . $tok1 . ' ' . $tok2);
$ind = strrpos($output, ' ');
$lat = substr($output, 0, $ind);
$lon = substr($output, ($ind + 1), -1);
$thecorners[$ib] = $lon . ',' . $lat;
$firstcorner = $thecorners[$ib];
for ($i = 0; $i < 3; $i++) {
$tok1 = strtok(",");
$tok1 = strtok(" ");
$tok2 = strtok(" ");
$output = shell_exec('java toLatLon ' . $tok1 . ' ' . $tok2);
$ind = strrpos($output, ' ');
$lat = substr($output, 0, $ind);
$lon = substr($output, ($ind + 1), -1);
$thecorners[$ib] = $thecorners[$ib] . ',' . $lon . ',' . $lat;
}
$thecorners[$ib] = $thecorners[$ib] . ',' . $firstcorner;
// echo $thecorners[$ib]."\n";
}
} catch (Exception $e) {
echo 'Caught exception: ', $e->getMessage(), "\n";
}
?>
<!doctype html>
<html lang="en">
<head>
<base href="https://vcities.umsl.edu/Cesium1.72/Apps/Sandcastle/vcities/">
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=Edge,chrome=1">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no">
<title>Virtual Cities</title>
<script src="../../../Build/Cesium/Cesium.js"></script>
<script type="text/javascript" src="../Sandcastle-header.js"></script>
<style>@import url(../../../Build/Cesium/Widgets/widgets.css);</style>
<link rel="stylesheet" href="./vcities.css">
<script type="text/javascript" src="./vcitiesF.js"></script>
<script type="text/javascript">
if (typeof require === "function") {
require.config({
baseUrl : '../../../Source',
waitSeconds : 120
});
}
function loadconfirm(the_selected) {
// parent.frames['Big'].location.href=links[the_selected.id];
}
function its_loaded() {
//alert("Page functionality Available");
var x= document.getElementById("tour_state");
x.style.visibility = "hidden";
x.innerHTML = " The Control ";
x=document.getElementById("doc_view");
x.innerHTML = " Discover Building/Site History ";
x=document.getElementById("the_looper");
x.innerHTML=" Loop Site ";
}
</script>
</head>
<body class="sandcastle-loading" data-sandcastle-bucket="bucket-requirejs.html" onload="its_loaded()">
<style>
@import url(../templates/bucket.css);
</style>
<div id="cesiumContainer" class="fullSize">
</div>
<div id="loadingOverlay">
<h1>Loading...</h1>
</div>
<div id="toolbar">
</div>
<script id="cesium_sandcastle_script">
var name_desc=[];
function startup(Cesium) {
'use strict';
//Sandcastle_Begin
gCesium=Cesium;
Cesium.Ion.defaultAccessToken = 'eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJqdGkiOiJjZjRjMjQ1OS1hNDI4LTQ0NmYtYTczYy03NGQ3NjMzYTVjZDYiLCJpZCI6NDY0OSwic2NvcGVzIjpbImFzciIsImdjIl0sImlhdCI6MTU0MTM2MDM4OH0.NCvTrd2_i3tadjyL-jr1ZN4Y4VbwydskfwWefpx-xJk';
var viewer = new Cesium.Viewer('cesiumContainer',{
imageryProvider : Cesium.createWorldImagery({
style : Cesium.IonWorldImageryStyle.AERIAL
}),
baseLayerPicker : false,infoBox : false
});
gviewer=viewer;
var options = {
camera : viewer.scene.camera,
canvas : viewer.scene.canvas
};
//////////////////////////
viewer.scene.canvas.addEventListener('click', function(e){
var clicked_index;
for(clicked_index=0;clicked_index<all_buildings.length;clicked_index++){
if (all_buildings[clicked_index]==gviewer.selectedEntity)break;
}
var clicked_desc=String(all_buildings[clicked_index].description);
if(clicked_desc.includes("This building has no history entries")){this_history=false;}else{this_history=true;};
gviewer.selectedEntity.name=all_buildings[clicked_index].name;
gviewer.selectedEntity.description=all_buildings[clicked_index].description;
document.getElementById("tour_state").style.visibility = "hidden";
if(in_fullC){
document.getElementById("the_data").style.display="block";
}
document.getElementById("the_data").innerHTML =all_buildings[clicked_index].name; //description ;
no_clicks_yet=false;
// loadconfirm(viewer.selectedEntity); // gecl(viewer.selectedEntity);
parent.SiteClick(gviewer.selectedEntity.description);
if(first_click){
first_click=false;
}else{
selected_holder.description=description_holder;
}
selected_holder=gviewer.selectedEntity;
description_holder=gviewer.selectedEntity.description;
if(in_fullC){
if(!this_history){
document.getElementById("doc_view").style.visibility = "hidden";
}else{
document.getElementById("doc_view").style.visibility = "visible";
}
}
if(!this_history){
document.getElementById("the_data").innerHTML="This Building has no History Available";
}else{
var n1 = clicked_desc.indexOf("<h2>");
var n2 = clicked_desc.indexOf("</h2>");
document.getElementById("the_data").innerHTML =" ".concat(clicked_desc.substring(n1+4,n2)).concat(" ");
}
//document.getElementById("tour_state").innerHTML = "Pause Loop" ;
document.getElementById("the_looper").style.visibility = "visible";
stop_loop();
}
);
///////////////////////////////
viewer.scene.globe.depthTestAgainstTerrain = true;
<?php
$host = "localhost";
$user = "saintlouisdev";
$pass = "";
$db = "vcities";
$block_number=$bns[0];
$start_date="1800-01-01";
$end_date="1950-01-01";
$temporalobject_ptr_id=0;
$bldgIDcount=0;
$the_header;
function tweak_query($the_tweak){
$host = "localhost";
$user = "saintlouisdev";
$pass = "";
$db = "vcities";
if ($the_tweak==1) {
$the_query = "select bldg_number, model, block_number,heading from cesiumtweaks where tweak=1";
} else {
$the_query = "select bldg_number, model, block_number,lon,lat,heading,tweak from cesiumtweaks where tweak=2";
}
try {
$hcon = pg_connect("host=$host dbname=$db port=5432 user=$user password=$pass");
if (!$hcon) {
echo "Could not connect to server\n"; return;
}
$rs = pg_query($hcon, $the_query) or die("Cannot execute query: $query\n");
pg_close($hcon);
return pg_fetch_all($rs,$result_type = PGSQL_NUM);
} catch (Exception $e) { echo 'Caught exception: '. $e->getMessage(). "\n";}
}
///////////////////
$this_array=tweak_query(1);
$max = count($this_array);
for ($j = 0; $j < ($max-1);$j++) {
$this_block_number=$this_array[$j][2];
$the_header=$this_array[$j][3];
$this_model=$this_array[$j][1];
$in_the_block=0;
for ($i= 0; $i< ($block_count); $i++) {
if ($this_block_number==$bns[$i]) $in_the_block=1;
};
if ($in_the_block==1) {
$building_id=$this_array[$j][0];
// $the_header=$this_array[$j][3];
$buildingIDs[$bldgIDcount]=$building_id;
$bldgIDcount++;
$query1 ='SELECT a.building_id,a.ge_latitude,a.ge_longitude,a.ge_heading,b.title, b.narrative,b.caption,a.temporalobject_ptr_id FROM saintlouisdev.geo_meshes a,saintlouisdev.the_histories b ' ;
$query2 ='where a.building_id='.$building_id.' and b.temporal_object_id='.$building_id;
$query = $query1. $query2;
$con = pg_connect("host=$host dbname=$db port=5432 user=$user password=$pass");
if (!$con) {
echo "Could not connect to server\n";
}
$rs = pg_query($con, $query) or die("Cannot execute query: $query\n");
pg_close($con);
$row = pg_fetch_row($rs);
if ( $row==NULL) {
$query ='SELECT building_id,ge_latitude,ge_longitude,ge_heading,temporalobject_ptr_id FROM saintlouisdev.geo_meshes where building_id='.$building_id;
$con = pg_connect("host=$host dbname=$db port=5432 user=$user password=$pass");
if (!$con) {
echo "Could not connect to server\n";
}
$rs = pg_query($con, $query) or die("Cannot execute query: $query\n");
pg_close($con);
$row = pg_fetch_row($rs);
$narrative="no history available";
$the_name="not known";
$temporalobject_ptr_id=$row[4];
} else {
// $narrative=str_replace("'","'",$row[5]);
// $narrative = str_replace("http://12.234.174.20","http://vcities.umsl.edu",$narrative);
// $narrative = str_replace("http://vcities.ite-stl.org","http://vcities.umsl.edu",$narrative);
// $description="'<html><body><center><h2>".$row[4]."</h2><h3>Building ".$row[0]."</h3></center>".$narrative."<body></html>'";
// $description= str_replace("\r", "", $description);
// $description = str_replace("\n", "", $description);
// $temporalobject_ptr_id=$row[7];
$the_name=$row[4];
}
$the_lon=$row[2];
$the_lat=$row[1];
$the_head=$row[3];
$the_id=$row[0];
$query1="SELECT a.id, a.description, b.value,c.value FROM saintlouisdev.temporal_objects a, saintlouisdev.vc_dates b, saintlouisdev.vc_dates c where ";
$query2=" a.id=".$temporalobject_ptr_id." and a.start_date_id=b.id and a.end_date_id=c.id";
$query=$query1.$query2;
$con = pg_connect("host=$host dbname=$db port=5432 user=$user password=$pass");
if (!$con) {
echo "Could not connect to server\n";
}
$rs = pg_query($con, $query) or die("Cannot execute query: $query\n");
pg_close($con);
$row = pg_fetch_row($rs);
$start_date=$row[2];
$end_date=$row[3];
// $description="'<html><body><center><h2>".$row[1]."</h2></center>".$narrative."<body></html>'";
// $description= str_replace("\r", "", $description);
// $description = str_replace("\n", "", $description);
echo "var position=Cesium.Cartesian3.fromDegrees(".$the_lon.",".$the_lat.",0.0);\n";
//position = Cesium.Cartesian3.fromDegrees(-90.18415135202939,38.624735103,0);
$this_head=$the_head;
if ( $the_header != "361" ) {
$this_head=$the_header;
}
echo "var heading = Cesium.Math.toRadians(".$this_head.");\n";
echo "var roll=0.0;\n";
echo 'var name="'.$the_name.'"'.";\n";
$description= file_get_contents('http://vcities.umsl.edu/vcity/editor/buildingPage/'.$the_id.'/');
$description=str_replace("'","'", $description);
$description= str_replace("\r", "", $description);
$description = str_replace("\n", "", $description);
echo "var description='<html><body>".$description."<body></html>';\n";
echo "name_desc.push([name,description]);\n";
echo "var hpr = new Cesium.HeadingPitchRoll(heading, pitch, roll);\n";
echo "var orientation = Cesium.Transforms.headingPitchRollQuaternion(position, hpr);\n";
echo "var building".$the_id." = viewer.entities.add({\n";
echo ' id:'.$the_id.",\n";
echo " name: name ,\n";
echo " description: description ,\n";
echo ' availability : new Cesium.TimeIntervalCollection([new Cesium.TimeInterval({'."\n";
echo ' start : Cesium.JulianDate.fromIso8601("'.$start_date.'")'.",\n";
echo ' stop : Cesium.JulianDate.fromIso8601("'.$end_date.'")'.",\n";
echo ' })]),'."\n";
echo " position: position,\n";
echo " orientation: orientation,\n";
echo ' model:{';
echo ' uri:"./models/block_8/'. $this_model.'"'."\n";
echo " }\n";
echo " }\n";
echo " );\n";
echo 'all_buildings.push(building'.$the_id.'); <!--This Buildings index='.$building_count." --> \n";
$building_count++;
echo 'lon_lat_heights["building'.$the_id.'"]=['.$the_lon.','.$the_lat.',0.0];'."\n";
echo 'bldg_lon_lats.push(['.$the_lon.','.$the_lat.']);'."\n";
echo 'positions.push(Cesium.Cartographic.fromDegrees('.$the_lon.','.$the_lat.'));'."\n";
}
}
$the_tweaks=tweak_query(2);
$tmax=count($the_tweaks);
$buildinglist = array();
$lon_lats = array();
$j = 0;
echo "\n";
for ($i = 0; $i < $count; $i++) {
$bldg = $mydata[$i][0];
$bldg_inlist=FALSE;
for ($bldid=0;$bldid<$bldgIDcount;$bldid++) {
if ($buildingIDs[$bldid]==$bldg) $bldg_inlist=TRUE;
if ($bldg_inlist)break;
}
if (!$bldg_inlist) {
$buildingIDs[$bldgIDcount]=$bldg;$bldgIDcount++;
$this_url = $bldg + 2;
$link = './models/all/' . $this_url . '.gltf';
if (file_exists($link)) {
$query1="SELECT a.title, a.narrative FROM saintlouisdev.the_histories a, saintlouisdev.the_buildings b ";
$query2="where a.temporal_object_id=b.building_id AND b.building_id=".$bldg;
$query=$query1.$query2;
$con = pg_connect("host=$host dbname=$db port=5432 user=$user password=$pass");
$rs = pg_query($con, $query) or die("Cannot execute query: $query\n");
$rows = pg_fetch_all($rs);
pg_close($con);
$narrative="";
$description='<html><body><center><h4>Building '.$bldg.'</h4></center><body></html>';
// if (count($rows)==1) {
if (!is_null($rows)) {
$title=str_replace("\n", "",$rows[0]['title']);
$title=str_replace("'","'",$title);
$narrative=str_replace("'","'",$rows[0]['narrative']);
// $narrative=$rows[0]['narrative'];
$description='<html><body><center><h4>'.$title.'</h4><h5>Building '.$bldg.'</h5></center>'.$narrative.'<body></html>';
$description= str_replace("\r", "", $description);
$description = str_replace("\n", "", $description);
}
$istweeked=array(0,0);
for($j=0;$j<$tmax;$j++){
if($bldg==$the_tweaks[$j][0]){
$istweeked=array(1,$j);
$mydata[$i][8]=$the_tweaks[$j][3];
$mydata[$i][7]=$the_tweaks[$j][4];
}
}
echo "var position=Cesium.Cartesian3.fromDegrees(".$mydata[$i][8] .",".$mydata[$i][7] .",0.0);\n";
if($istweeked[0]==1){
echo "var heading = Cesium.Math.toRadians(".$the_tweaks[$istweeked[1]][5] .");\n";
echo "var roll=0.0;\n";
echo "var hpr = new Cesium.HeadingPitchRoll(heading, pitch, roll);\n";
echo "var orientation = Cesium.Transforms.headingPitchRollQuaternion(position, hpr);\n";
$link = "./models/all/".$the_tweaks[$istweeked[1]][1];
}
echo 'var name="Building '.$bldg.'";'."\n";
$description= file_get_contents('http://vcities.umsl.edu/vcity/editor/buildingPage/'.$bldg.'/');
$description=str_replace("'","'", $description);
$description= str_replace("\r", "", $description);
$description = str_replace("\n", "", $description);
echo "var description='<html><body>".$description."<body></html>';\n";
echo "name_desc.push([name,description]);\n";
echo "var building" . $bldg . " = viewer.entities.add({\n";
echo ' id:' . $bldg .",\n";
echo " name: name ,\n";
echo " description: description ,\n";
echo " availability : new Cesium.TimeIntervalCollection([new Cesium.TimeInterval({\n";
echo ' start : Cesium.JulianDate.fromIso8601("' . $mydata[$i][1] . '"),' . "\n";
echo ' stop : Cesium.JulianDate.fromIso8601("' . $mydata[$i][3] . '")' . "\n";
echo " })]),\n";
echo " position: position,\n";
if($istweeked[0]==1){
echo " orientation: orientation,\n";
}
echo " model:{uri:'".$link . "'" ."}\n";
echo " }\n";
echo " );\n";
// echo 'building'.$bldg.'.description='.'"This is Building '.$bldg.'"'.";\n";
echo 'building_list[' . $j . ']=building' . $bldg . ";\n";
$buildinglist[$j] = 'building' . $bldg;
$lon_lats[$buildinglist[$j]] = preg_replace("/\r|\n/", "", $mydata[$i][8]) . ',' . $mydata[$i][7];
echo 'all_buildings.push(building'.$bldg.'); <!--This Buildings index='.$building_count." --> \n";
$building_count++;
echo 'lon_lat_heights["' . $buildinglist[$j] . '"]=[' . $lon_lats[$buildinglist[$j]] . ',' . $height[0] . "];\n";
echo 'bldg_lon_lats.push(['.$mydata[$i][8] . ',' . $mydata[$i][7].']);'."\n";
echo "positions.push(Cesium.Cartographic.fromDegrees(" . $mydata[$i][8] . ',' . $mydata[$i][7] . "));\n";
$j++;
}
}
}
$count = $j;
$the_building_list = $buildinglist;
$the_lon_lats = $lon_lats;
echo 'bldg_count=' . $building_count . ";\n";
// echo 'viewer.clock.currentTime =Cesium.JulianDate.fromIso8601("' . $current_date[0] . '");' . "\n";
echo 'viewer.clock.currentTime =Cesium.JulianDate.fromIso8601("1900-01-01T00:00:00Z");' . "\n";
?>
///////////////////////////////////////////////////
///////////// Set up clock and timeline.
viewer.clock.currentTime =Cesium.JulianDate.fromIso8601("1930-01-01T00:00:00Z");
viewer.clock.shouldAnimate = false; // make the animation play when the viewer starts
viewer.clock.startTime = Cesium.JulianDate.fromIso8601("1830-01-01T00:00:00Z");
viewer.clock.stopTime = Cesium.JulianDate.fromIso8601("2000-01-01T00:00:00Z");
viewer.clock.multiplier = 1; // sets a speedup
viewer.timeline.zoomTo(viewer.clock.startTime, viewer.clock.stopTime); // set visible range
// lookAt
lheading=270.;llong=-90.18527699999999;llat=38.624388;lpitch=-10.0;
infopage="http://www.citytoriver.org/history/";
elong=bldg_lon_lats[0][0];nlat=bldg_lon_lats[0][1];wlong=bldg_lon_lats[0][0];slat=bldg_lon_lats[0][1];
compute_nsc_long_lat();
center = Cesium.Cartesian3.fromDegrees( clong,clat ); //-90.21437530335254,38.637056502179554);
heading = Cesium.Math.toRadians(-10.0);
lheading=heading;
pitch = Cesium.Math.toRadians(-10.0);
if (crange<100.0)crange=100.0;
range = 1.2*crange;
startheading=heading;startpitch=pitch;startrange= Math.round(range);startcenter=center;
viewer.camera.lookAt(center, new Cesium.HeadingPitchRange(heading, pitch, range));
//Sandcastle_End
Sandcastle.finishedLoading();
//box_it();
}
if (typeof Cesium !== "undefined") {
startup(Cesium);
} else if (typeof require === "function") {
require(["Cesium"], startup);
}
function HideIt() {
document.getElementById("the_data").style.display = "none";
}
function Hide_the_data() {
document.getElementById("the_data").style.display = "none";
}
function Show_the_data() {
document.getElementById("the_data").style.display = "block"; x=0;
}
</script>
<div class="toolbar-left">
<table>
<tr>
<td><font class="button4"><b> Present Range </b>
<span id="range_value">
<script>
document.write(Math.round(crange));
</script>
</span>
<b>Meters </b></font>
</td>
<td>
<div id="this_try">
<select class="button2" id="WhereTo" onchange="gothere()">
<option value="-2"><b><font color="yellow">Buildings and Tours</font></b></option>
<!--option value="4001"><b>The Old Cathedral - History</b></option>
<option value="6"><b>The Old Courthouse-1919</b></option>
<option value="342"><b>The Arch-1965</b></option>
<option value="4002">Other Notable Buildings</b></option>
<option value="3"> Old Rock House-1932</b></option>
<option value="3000"><b>Tour Wharf Street- 1925</b></option>
<option value="3001"><b>Tour 3rd Street - 1920 </b>
</option> <option value="-1"><b><font color="yellow">Overview</font</b></option -->
</select>
</div>
</td>
<td>
<div id="the_data" style="font-size: 16px;color: black;font-weight: bold;text-align: center;display:block;height:20px;background:#FFFFFF;border:3px outset blue;pointer-events:none">
The Saint Louis Riverfront
</div>
</td>
</tr>
<tr>
<td>
<input type="range" min="50" max="500" value="150" class="button1" id="myRange">
</td>
</tr>
<tr>
<td><button id="doc_view" class="button1" onclick="open_div();"> Loading </button></td>
<!-- td><button id="tour_state" class="button1" onclick="which_anima();"> Loading </button --></td>
</tr>
<tr>
<td><button id="the_looper"class="button1" onclick="do_loop();"> Loading
Site </button><button id="tour_state" class="button1" onclick="which_anima();"> Loading </button></td>
</tr><!-- tr><td> </td></tr> <tr><td><button id="the_help"class="button3" onclick="help()">Using This Page</button></td></tr -->
</table>
<!-- ;; overflow-y: scroll -->
</div>
<script>
var slider = document.getElementById("myRange");
slider.oninput = function() {
var this_heading=gviewer.camera.heading;
var this_pitch=gviewer.camera.pitch;
range=slider.value;
gviewer.camera.lookAt(center, new gCesium.HeadingPitchRange(this_heading, this_pitch, range));
document.getElementById("range_value").innerHTML = range;
}
var the_stepper;
var present_count=0; //looper and tourer count
var div_open=false;
function open_div(){
if (no_clicks_yet) {
alert("Please make a building selection first.");
} else {
div_open=true;
parent.shift_divs();
gviewer.selectedEntity=selected_holder;
in_fullC=false;
document.getElementById("the_data").style.display="none";
document.getElementById("doc_view").style.visibility = "hidden";
}
}
function close_div(){
console.log("why not?");
div_open=false;
in_fullC=true;
// parent.shift_divs();
gviewer.selectedEntity=selected_holder;
document.getElementById("the_data").style.display="block";
if (this_history) {
document.getElementById("doc_view").style.visibility = "visible";
} else {
document.getElementById("the_data").innerHTML="This Building has no History Available";
}
// console.log("why not?");
}
function help(){
window.open("https://vcities.umsl.edu/StLouis/PageHelp.html");
}
//////////////////////////looper//////////////////////
var the_loop;
var in_the_loop;
var in_tour=false;
var anima_loop=false;
var anima_tour=false;
var the_tour_number;
function looper(x){
var loop_heading =lheading;gCesium.Math.toRadians(lheading);
lheading=lheading+x;
gviewer.camera.lookAt(center, new gCesium.HeadingPitchRange(loop_heading, pitch, range));
}
function loopstep(){
looper(.003);
}
// call a tour step in Cesium
function stop_loop(){
if (in_the_loop) {
clearInterval(the_loop);
in_the_loop=false;
}
}
//The javascript timing layer on top of Cesium
function loop_it(){
if (in_tour)stop_tour();
in_the_loop=true;
console.log(lheading);
the_loop=setInterval(loopstep, 100);
// }
}
function do_loop(){
anima_loop=true;
clearInterval(the_loop);
document.getElementById("tour_state").style.visibility = "visible";
// in_the_loop=false;
if (anima_tour) {
stop_tour();
}
if (!in_the_loop) {
document.getElementById("tour_state").innerHTML = "Pause Loop" ;
document.getElementById("the_looper").style.visibility = "hidden";
document.getElementById("WhereTo").style.visibility = "hidden";
loop_it();
} else {
document.getElementById("tour_state").innerHTML = "Resume Loop" ;
// document.getElementById("the_looper").style.visibility = "visible";
document.getElementById("WhereTo").style.visibility = "visible";
stop_loop();
}
}
function step_it(){
in_tour=true;
document.getElementById("tour_state").innerHTML = "Pause Tour" ;
the_stepper=setInterval(stepper, 100);
}
function stop_step(){
if (in_tour) {
clearInterval(the_stepper);
in_tour=false;
}
}
function stop_tour(){
in_tour=false;
clearInterval(the_stepper);
the_stepper=null;
anima_tour=false;
}
function do_tour(){
anima_loop=false;
anima_tour=true;
document.getElementById("tour_state").style.visibility = "visible";
if (!in_tour) {
document.getElementById("tour_state").innerHTML = "Pause Tour" ;
document.getElementById("the_looper").style.visibility = "hidden";
document.getElementById("WhereTo").style.visibility = "hidden";
in_tour=true;
the_stepper=setInterval(stepper, 100);
} else {
document.getElementById("tour_state").innerHTML = "Resume Tour" ;
document.getElementById("the_looper").style.visibility = "hidden";
document.getElementById("WhereTo").style.visibility = "visible";
clearInterval(the_stepper);
in_tour=false;
}
}
function which_anima(){
if (anima_loop) {
do_loop();
} else if (anima_tour) {
do_tour();
}
}
/////////////////visits and tours/////////////////////
var a_tour=[]; // list of entities to view
var a_tour_view=[]; //list of entity positions and counts associated with the tour
var a_tour_time; //time tour takes place.
var all_tours=[];
var all_views=[]
var all_tour_POIs=[];
var all_times=[];
var in_tour=false;
var total_count; //=1820;
var start_long;
var end_long;
var start_lat;
var end_lat;
var tour_heading;
var tour_pitch;
var tour_range;
var this_tour=[];
var tour_POIs=[];
var tour_length;
var last_name;
var last_description;
var first_name;
var first_description;
var final_name;
var final_description;
var this_name;
var this_description;
var name_holder;
var this_position;
function close_doc_window(){
document.getElementById("doc_view").style.visibility = "visible";
}
/////////////////////////////////// Tour and Selection Edits////////////////////////////////
var the_options=[];
the_options.push('<select class="button2" id="WhereTo" onchange="gothere()"><option value="-2"><b><font color="yellow">Buildings and Tours</font></b></option><option value="4001"><b>The Old Cathedral History</b></option><option value="6"><b>The Old Courthouse-1919</b></option><option value="342"><b>The Arch-1965</b></option><option value="4002"> Other Notable Buildings</b></option><option value="3000"><b>Tour Wharf Street </b></option> <option value="3001"><b>Tour 3rd Street </b></option><option value="-1"><b><font color="yellow">Overview</font</b></option></select>');
the_options.push('<select class="button2" id="WhereTo" onchange="gothere()"><option value="-2"><b><font color="yellow">Old Cathedral - Dates</font></b></option> <option value="340"><b>1770</b></option><option value="338"><b>1776</b></option><option value="5"><b>1834-1939</b></option> <option value="341"><b>1961</b></option> <option value="4000"><b><font color="yellow">Back</font</b></option></select>');
the_options.push('<select class="button2" id="WhereTo" onchange="gothere()"><option value="-2"><b><font color="yellow">The Buildings</font></b></option><option value="3"> Old Rock House-1932</b></option><option value="298"><b>Federal Fur & Wool-1900</b></option> <option value="332"><b>The Barnum Hotel</b></option><option value="329"><b>The National Hotel-1835</b></option><option value="328"><b>The National Hotel-1860</b></option><option value="201"><b>The Gay Building</b></option> <option value="191"><b>The Times Building-1870</b></option><option value="39"><b>The Times Building-1907</b></option> <option value="4000"><b><font color="yellow">Back</font</b></option></select>');
function which_options(x){
document.getElementById("this_try").innerHTML =the_options[x];
}
function back(){which_options(0);}
function gothere() {
var e = document.getElementById("WhereTo");
var the_bldg = e.options[e.selectedIndex].value;
if (the_bldg==-2) {return}
document.getElementById("the_looper").style.visibility = "visible";
document.getElementById("tour_state").style.visibility = "hidden";
if (the_bldg>3999) {
var sub_options=the_bldg-4000;
which_options(sub_options);
/* if (the_bldg==4001) {
which_options(1);
} else if (the_bldg==4000) {
which_options(0);
} else if (the_bldg==4002) {
which_options(2);
}*/
return;
}
if (anima_tour) {
// reset_tour(the_tour_number);
in_tour=false;
clearInterval(the_stepper);
the_stepper=null;
anima_tour=false;
}
if (anima_loop) {
anima_loop=false;
clearInterval(the_loop);
in_the_loop=false;
}
document.getElementById("tour_state").innerHTML = " The Control " ;
present_count=0;
clearInterval(the_stepper);
// var e = document.getElementById("WhereTo");
// var the_bldg = e.options[e.selectedIndex].value;
var this_pitch = gCesium.Math.toRadians(-10.0); //Default
// var the_target;
if (the_bldg==-1) {
// heading=7.0;
// lheading=heading;
// range=171.0;
document.getElementById("tour_state").style.visibility = "hidden";
document.getElementById("myRange").value=startrange;
document.getElementById("range_value").innerHTML = startrange;
center=Cesium.Cartesian3.fromDegrees( clong,clat );
gviewer.selectedEntity=null;
gviewer.clock.currentTime =Cesium.JulianDate.fromIso8601("1900-01-01T00:00:00Z");
gviewer.camera.lookAt(startcenter, new gCesium.HeadingPitchRange(startheading, startpitch, startrange));
parent.SiteClick("<html><bocy><center><h1>The Saint Louis Riverfront</h1></center></body></html>");
first_click=true;
in_fullC=true;
div_open=true;
selected_holder=null;
document.getElementById("the_data").innerHTML="The Saint Louis Riverfront";
// parent.full_screen1();
} else {
if (the_bldg<3000) {
document.getElementById("tour_state").style.visibility = "hidden";
div_open=true;
in_fullC=true;
this_name=all_buildings[the_bldg].name;
this_description=all_buildings[the_bldg].description;
this_position=Cesium.Cartesian3.fromDegrees(bldg_lon_lats[the_bldg][0],bldg_lon_lats[the_bldg][1],0);
gviewer.selectedEntity=all_buildings[the_bldg];
document.getElementById("the_data").style.display="none";
document.getElementById("the_data").innerHTML =all_buildings[the_bldg].name; //description ;
parent.SiteClick(this_description);
if (first_click) {
first_click=false;
} else {
selected_holder.description=description_holder;
}
selected_holder=all_buildings[the_bldg];
description_holder=this_description;
}
if (!in_fullC) {
console.log("not full C");
gviewer.selectedEntity=selected_holder;
}
if (the_bldg==338) {
heading=Cesium.Math.toRadians(45.0);
lheading=heading;
range=50.0;
pitch = Cesium.Math.toRadians(-10.0);
document.getElementById("myRange").value=range;
document.getElementById("range_value").innerHTML = range;
center=Cesium.Cartesian3.fromDegrees(-90.187285,38.624034,0.0);
gviewer.clock.currentTime =Cesium.JulianDate.fromIso8601("1778-01-01T00:00:00Z");
}
if (the_bldg==340) {
heading=Cesium.Math.toRadians(45.0);
lheading=heading;
range=40.0;
pitch = Cesium.Math.toRadians(-10.0);
document.getElementById("myRange").value=range;
document.getElementById("range_value").innerHTML = range;
center=Cesium.Cartesian3.fromDegrees(-90.187285,38.624034,0.0);
gviewer.clock.currentTime =Cesium.JulianDate.fromIso8601("1771-01-01T00:00:00Z");
}
if (the_bldg==3) {
heading=4.905037599462777;
lheading=heading;
range=50.0;
document.getElementById("myRange").value=range;
document.getElementById("range_value").innerHTML = range;
center=Cesium.Cartesian3.fromDegrees(-90.18414,38.624723,0.0);
gviewer.clock.currentTime =Cesium.JulianDate.fromIso8601("1932-01-01T00:00:00Z")
} else if (the_bldg==5) {
heading=Cesium.Math.toRadians(-10.0);
lheading=heading;
range=150.0;
pitch = Cesium.Math.toRadians(-10.0);
document.getElementById("myRange").value=range;
document.getElementById("range_value").innerHTML = range;
center=Cesium.Cartesian3.fromDegrees(-90.187285,38.624034,0.0);
gviewer.clock.currentTime =Cesium.JulianDate.fromIso8601("1860-01-01T00:00:00Z");
} else if (the_bldg==2) {
heading=4.905037599462777;
lheading=heading;
range=50.0;
document.getElementById("myRange").value=range;
document.getElementById("range_value").innerHTML = range;
center=Cesium.Cartesian3.fromDegrees(-90.18414,38.624723,0.0);
gviewer.clock.currentTime =Cesium.JulianDate.fromIso8601("1819-01-01T00:00:00Z");
} else if (the_bldg==341) {
heading=Cesium.Math.toRadians(-10.0);
lheading=heading;
range=150.0;
pitch = Cesium.Math.toRadians(-10.0);
document.getElementById("myRange").value=range;
document.getElementById("range_value").innerHTML = range;
center=Cesium.Cartesian3.fromDegrees(-90.187285,38.624034,0.0);
gviewer.clock.currentTime =Cesium.JulianDate.fromIso8601("1961-01-01T00:00:00Z");
} else if (the_bldg==6) {
heading=1.7457796260818064;
lheading=heading;
range=300.0;
pitch = Cesium.Math.toRadians(-15.0);
document.getElementById("myRange").value=range;
document.getElementById("range_value").innerHTML = range;
center=Cesium.Cartesian3.fromDegrees(-90.1893056966,38.625056698,0.0);
gviewer.clock.currentTime =Cesium.JulianDate.fromIso8601("1919-01-01T00:00:00Z");
} else if (the_bldg==298) {
heading=1.7957796260818064;
lheading=heading;
range=18; <!--50.0; -->
this_pitch = Cesium.Math.toRadians(-5.0);
document.getElementById("myRange").value=range;
document.getElementById("range_value").innerHTML = range;
center=Cesium.Cartesian3.fromDegrees(-90.1849248503835,38.6247988064905,7.0);
gviewer.clock.currentTime =Cesium.JulianDate.fromIso8601("1900-01-01T00:00:00Z");
} else if (the_bldg==332) {
heading=Cesium.Math.toRadians(-10.0);;
lheading=heading;
range=140.0;
this_pitch = Cesium.Math.toRadians(-18.0);
document.getElementById("myRange").value=range;
document.getElementById("range_value").innerHTML = range;
center=Cesium.Cartesian3.fromDegrees(-90.1866329363722,38.6240353638296,7.0);
gviewer.clock.currentTime =Cesium.JulianDate.fromIso8601("1860-01-01T00:00:00Z");
} else if (the_bldg==328) {
heading=Cesium.Math.toRadians(170.0);;
lheading=heading;
range=70.0;
pitch = Cesium.Math.toRadians(-18.0);
document.getElementById("myRange").value=range;
document.getElementById("range_value").innerHTML = range;
center=Cesium.Cartesian3.fromDegrees(-90.1877974897737,38.6248000881992,0.0);
gviewer.clock.currentTime =Cesium.JulianDate.fromIso8601("1860-01-01T00:00:00Z");
} else if (the_bldg==329) {
heading=Cesium.Math.toRadians(170.0);;
lheading=heading;
range=70.0;
pitch = Cesium.Math.toRadians(-18.0);
document.getElementById("myRange").value=range;
document.getElementById("range_value").innerHTML = range;
center=Cesium.Cartesian3.fromDegrees(-90.1877974897737,38.6248000881992,0.0);
gviewer.clock.currentTime =Cesium.JulianDate.fromIso8601("1835-01-01T00:00:00Z");
} else if (the_bldg==201) {
heading=Cesium.Math.toRadians(170.0);;
lheading=heading;
range=155.0;
pitch = Cesium.Math.toRadians(-18.0);
document.getElementById("myRange").value=range;
document.getElementById("range_value").innerHTML = range;
center=Cesium.Cartesian3.fromDegrees(-90.1859822154191,38.6259900824625,0.0);
gviewer.clock.currentTime =Cesium.JulianDate.fromIso8601("1870-01-01T00:00:00Z");
} else if (the_bldg==39) {
heading=Cesium.Math.toRadians(90.0);;
lheading=heading;
range=170.0;
pitch = Cesium.Math.toRadians(-18.0);
document.getElementById("myRange").value=range;
document.getElementById("range_value").innerHTML = range;
center=Cesium.Cartesian3.fromDegrees(-90.1894674444491,38.6264585015218,0.0);
gviewer.clock.currentTime =Cesium.JulianDate.fromIso8601("1906-01-01T00:00:00Z");
} else if (the_bldg==191) {
heading=Cesium.Math.toRadians(90.0);
lheading=heading;
range=170.0;
pitch = Cesium.Math.toRadians(-18.0);
document.getElementById("myRange").value=range;
document.getElementById("range_value").innerHTML = range;
center=Cesium.Cartesian3.fromDegrees(-90.1894674444491,38.6264585015218,0.0);
gviewer.clock.currentTime =Cesium.JulianDate.fromIso8601("1890-01-01T00:00:00Z");
} else if (the_bldg==342) {
heading= Cesium.Math.toRadians(290.0); //1.7957796260818064;
lheading=heading;
range=500.0;
pitch = Cesium.Math.toRadians(-35.0);
this_pitch=pitch;
document.getElementById("myRange").value=range;
document.getElementById("range_value").innerHTML = range;
center=Cesium.Cartesian3.fromDegrees(-90.18519780521553,38.624640301242944,0.0);
gviewer.clock.currentTime =Cesium.JulianDate.fromIso8601("1967-01-01T00:00:00Z");
}
if (the_bldg<3000) {
// console.log(center);
// console.log(this_position);
gviewer.camera.lookAt(center, new gCesium.HeadingPitchRange(lheading, pitch, range));//the center of the view, maybe not the building position.
document.getElementById("doc_view").style.visibility = "hidden";
open_div();
return;
}
if (the_bldg>=3000&&the_bldg<4000) {
anima_tour=true;
document.getElementById("tour_state").style.visibility = "visible";
var tour_val=the_bldg-3000;
present_count=0;
the_tour_number=tour_val;
document.getElementById("the_looper").style.visibility = "hidden";
document.getElementById("WhereTo").style.visibility = "hidden";
document.getElementById("doc_view").style.visibility = "hidden";
gviewer.selectedEntity=all_buildings[this_tour[tour_val]];
open_div();
take_tour(tour_val);
}
}
}
a_tour=[3,42,77,278];
all_tours.push(a_tour);
all_tour_POIs.push([10,150,325,530]);
a_tour_view=[-90.18414,-90.1844593729466,38.624723,38.6241738013305,4.905037599462777,Cesium.Math.toRadians(-10.0),50.0,550];
all_views.push(a_tour_view);
all_times.push(Cesium.JulianDate.fromIso8601("1925-01-01T00:00:00Z"));
a_tour=[];
a_tour=[68,292,272,250,213,301,211,208];
all_tours.push(a_tour);
all_tour_POIs.push([4,110,190,290,380,550,600,670]);
a_tour_view=[-90.1869645105869,-90.1875486468281,38.6263692671663,38.6249205138303,121,Cesium.Math.toRadians(-10.0),50.0,700];
all_views.push(a_tour_view);
all_times.push(Cesium.JulianDate.fromIso8601("1920-01-01T00:00:00Z"));
////////////////////////////////////End Edits/////////////////////////////
function set_tour_parms(x){
this_tour=all_tours[x];
gviewer.clock.currentTime =all_times[x];
start_long=all_views[x][0];
end_long=all_views[x][1];
start_lat=all_views[x][2];
end_lat=all_views[x][3];
tour_heading=all_views[x][4];
tour_pitch =all_views[x][5];
tour_range =all_views[x][6];
total_count=all_views[x][7];
tour_POIs=all_tour_POIs[x];
tour_length=tour_POIs.length;
}
function take_tour(tour_val){
the_stepper=null;
in_tour=true;
anima_tour=true;
set_tour_parms(tour_val);
parent.SiteClick(all_buildings[this_tour[0]].description);
document.getElementById("tour_state").innerHTML = "Pause Tour" ;
// console.log(document.getElementById("tour_state").style.visability);
the_stepper=setInterval(stepper, 100);
}
function highlight(x){
gviewer.selectedEntity=all_buildings[this_tour[x]];
parent.SiteClick(all_buildings[this_tour[x]].description);
}
function stepper(){
var this_ratio=(present_count-100)/2000;
var increment_long=end_long-start_long;
var increment_lat=end_lat-start_lat;
var this_long;
var this_lat;
var tour_center;
var ipoi;
if (present_count<50) {
this_long=start_long;
this_lat=start_lat;
if (present_count==tour_POIs[0]) {
console.log("position 0");
highlight(0);
}
} else if (present_count<total_count) {
this_ratio=(present_count-50)/(total_count-50);
this_long=start_long+(this_ratio*increment_long);
this_lat=start_lat+(this_ratio*increment_lat);
for (ipoi=1;ipoi<tour_length;ipoi++) {
if (present_count==tour_POIs[ipoi]) {
highlight(ipoi);
break;
}
}
}
tour_center = Cesium.Cartesian3.fromDegrees(this_long,this_lat,0.0);
gviewer.camera.lookAt(tour_center, new Cesium.HeadingPitchRange(tour_heading, tour_pitch, tour_range));
present_count++;
// console.log(present_count);
if (present_count==total_count) {
clearInterval(the_stepper);
the_stepper=null;
present_count=0;
gviewer.selectedEntity=null;
document.getElementById("tour_state").innerHTML = "The Control" ;
document.getElementById("the_looper").style.visibility = "visible";
document.getElementById("WhereTo").style.visibility = "visible";
// reset_tour(the_tour_number);
in_tour=false;
}
}
/*function reset_tour(x){
var this_tour=all_tours[x];
var steps=this_tour.length;
for (i=0;i<steps;i++ ) {
all_buildings[this_tour[i]].description=name_desc[this_tour[i]][1];
all_buildings[this_tour[i]].name= name_desc[this_tour[i]][0];
}
} */
function pause_tour(){
clearInterval(the_stepper);
the_stepper=null;
}
function close_the_div(){
document.getElementById("doc_view").style.visibility = "visible";
}
</script>
<script>
document.getElementById("myRange").min=20;
document.getElementById("myRange").max=3*crange;
document.getElementById("myRange").value=crange;
function mySpareFunction() {
document.getElementById("tester").value=2+1;
}
</script>
</body>
</html>