Added Weather Satellite Images to Website
This commit is contained in:
@@ -8,6 +8,8 @@
|
||||
#nav {border-style: solid;border-color: black;}
|
||||
#contact-body {font-size: 15;}
|
||||
#navbarlogo {padding-bottom: 10px;}
|
||||
#resize {height: 250px; width: auto;}
|
||||
#nobold {text-decoration: none;}
|
||||
#entirenav {position: -webkit-sticky; /* Safari */
|
||||
position: sticky;
|
||||
top: 0;
|
||||
@@ -28,3 +30,4 @@ separator {height: 30px;}
|
||||
.inactive {color: orange;}
|
||||
.canceled {color: red;}
|
||||
.depracated {color: yellow;}
|
||||
.hidden {display: none;}
|
||||
|
||||
+79
-1
@@ -17,7 +17,7 @@
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body onload="onLoad();verify();projectList();programList();blogList();">
|
||||
<body onload="onLoad();verify();projectList();programList();blogList();satList();">
|
||||
<div id="entirenav">
|
||||
<div id="navbarlogo">
|
||||
<img src="img/LAX18.jpeg" width=64><span id="logofont" style="font-size: 68pt;">LAX18's Homepage</span>
|
||||
@@ -38,6 +38,84 @@
|
||||
</div>
|
||||
</div>
|
||||
<h2 id="titles" style="text-align: center; font-size: 26pt;">Admin Dashboard</h2>
|
||||
<table width="100%">
|
||||
<tr>
|
||||
<td width="25%" style="border-right-style: solid;border-left-style: solid;border-top-style: solid;border-color: black;">
|
||||
Satellite Imagery
|
||||
</td>
|
||||
<td style="border-bottom-style: solid;border-color: black">
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
<br>
|
||||
<table width="100%" >
|
||||
<tbody>
|
||||
<tr>
|
||||
<td class="tdregular">
|
||||
Add Satellite:<br>
|
||||
Satellite:<br>
|
||||
<select id="new-sat-name">
|
||||
<option value="NOAA 15">NOAA 15</option>
|
||||
<option value="NOAA 18">NOAA 18</option>
|
||||
<option value="NOAA 19">NOAA 19</option>
|
||||
<option value="Meteor M2">Meteor M2</option>
|
||||
</select><br>
|
||||
Direction:<br>
|
||||
<select id="new-sat-direction">
|
||||
<option value="Northbound">Northbound</option>
|
||||
<option value="Southbound">Southbound</option>
|
||||
</select>
|
||||
<br>Time (UTC):<br>
|
||||
<input id="new-sat-time" type="text"><br>
|
||||
Date<br>
|
||||
<input id="new-sat-date" type="text"><br>
|
||||
Image Name:<br>
|
||||
<input id="new-sat-image" type="text"><br>
|
||||
Max SNR:<br>
|
||||
<input id="new-sat-snr" type="text"><br>
|
||||
Max Elevation:<br>
|
||||
<input id="new-sat-elevation" type="text"><br>
|
||||
Processing Info:<br>
|
||||
<input id="new-sat-processing" type="text"><br>
|
||||
<input type="button" onclick="submitSat();" value="Submit">
|
||||
<br><br>
|
||||
</td>
|
||||
<td class="tdregular">
|
||||
Edit Satellite<br>
|
||||
Select Satellite Post to Edit:<br>
|
||||
<select id="sat-list" onchange="satOnChange();" onclick="satOnChange();">
|
||||
</select><br>
|
||||
Satellite:<br>
|
||||
<select id="edit-sat-name">
|
||||
<option value="NOAA 15">NOAA 15</option>
|
||||
<option value="NOAA 18">NOAA 18</option>
|
||||
<option value="NOAA 19">NOAA 19</option>
|
||||
<option value="Meteor M2">Meteor M2</option>
|
||||
</select><br>
|
||||
Direction:<br>
|
||||
<select id="edit-sat-direction">
|
||||
<option value="Northbound">Northbound</option>
|
||||
<option value="Southbound">Southbound</option>
|
||||
</select><br>
|
||||
<div class="hidden">
|
||||
<br>Time (UTC):<br>
|
||||
<input id="edit-sat-time" type="text"><br>
|
||||
Date<br>
|
||||
<input id="edit-sat-date" type="text"><br>
|
||||
</div>
|
||||
Image Name:<br>
|
||||
<input id="edit-sat-image" type="text"><br>
|
||||
Max SNR:<br>
|
||||
<input id="edit-sat-snr" type="text"><br>
|
||||
Max Elevation:<br>
|
||||
<input id="edit-sat-elevation" type="text"><br>
|
||||
Processing Info:<br>
|
||||
<input id="edit-sat-processing" type="text"><br>
|
||||
<input type="button" onclick="editSat();" value="Submit">
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
<table width="100%">
|
||||
<tr>
|
||||
<td width="25%" style="border-right-style: solid;border-left-style: solid;border-top-style: solid;border-color: black;">
|
||||
|
||||
+4
-3
@@ -14,11 +14,12 @@
|
||||
<body onload="onLoad();displayBlogs();">
|
||||
<div id="entirenav">
|
||||
<div id="navbarlogo">
|
||||
<img src="img/LAX18.jpeg" width=64><span id="logofont" style="font-size: 68pt;">LAX18's Homepage</span>
|
||||
<img src="img/LAX18.jpeg" width="64"><span id="logofont" style="font-size: 68pt;">LAX18's Homepage</span>
|
||||
</div>
|
||||
<div id="nav">
|
||||
<ul class="nav-bar" id="nav-bar">
|
||||
<li class="nav-bar-li"><a href="index.html">Home</a></li>
|
||||
<li class="nav-bar-li"><a href="sat.html">Satellite Imagery</a></li>
|
||||
<li class="nav-bar-li"><a href="programs.html">Programs</a></li>
|
||||
<li class="nav-bar-li"><a href="projects.html">Projects</li>
|
||||
<li class="nav-bar-li"><a href="contact.html">Contact</a></li>
|
||||
@@ -29,8 +30,8 @@
|
||||
</div>
|
||||
</div>
|
||||
<div><br>
|
||||
<div id="titles">Welcome</h2>
|
||||
<div id="subtitles">This is a place where I showcase my projects, skills, and completed products, as well as me.</h4>
|
||||
<h2 id="titles">Welcome</h2>
|
||||
<h4 id="subtitles">This is a place where I showcase my projects, skills, and completed products, as well as me.</h4>
|
||||
</div><br>
|
||||
<div id="blogs">
|
||||
|
||||
|
||||
@@ -1,3 +1,96 @@
|
||||
// Add New Satellite Post
|
||||
function submitSat() {
|
||||
var date = new Date();
|
||||
var data = {
|
||||
name: document.getElementById("new-sat-name").value,
|
||||
direction: document.getElementById("new-sat-direction").value,
|
||||
time: document.getElementById("new-sat-time").value,
|
||||
date: document.getElementById("new-sat-date").value,
|
||||
image: document.getElementById("new-sat-image").value,
|
||||
snr: document.getElementById("new-sat-snr").value,
|
||||
elevation: document.getElementById("new-sat-elevation").value,
|
||||
processing: document.getElementById("new-sat-processing").value
|
||||
}
|
||||
firebase.database().ref("sats/"+document.getElementById("new-sat-date").value.split("/").join(",")+" "+document.getElementById("new-sat-time").value).set(data)
|
||||
document.getElementById("new-sat-name").value = '';
|
||||
document.getElementById("new-sat-direction").value = '';
|
||||
document.getElementById("new-sat-time").value = "";
|
||||
document.getElementById("new-sat-date").value = "";
|
||||
document.getElementById("new-sat-image").value = "";
|
||||
document.getElementById("new-sat-snr").value = "";
|
||||
document.getElementById("new-sat-elevation").value = "";
|
||||
document.getElementById("new-sat-processing").value = "";
|
||||
}
|
||||
// Edit Satellite Post
|
||||
function editSat() {
|
||||
var data = {
|
||||
name: document.getElementById("edit-sat-name").value,
|
||||
direction: document.getElementById("edit-sat-direction").value,
|
||||
time: document.getElementById("edit-sat-time").value,
|
||||
date: document.getElementById("edit-sat-date").value,
|
||||
image: document.getElementById("edit-sat-image").value,
|
||||
snr: document.getElementById("edit-sat-snr").value,
|
||||
elevation: document.getElementById("edit-sat-elevation").value,
|
||||
processing: document.getElementById("edit-sat-processing").value
|
||||
}
|
||||
firebase.database().ref("sats/"+document.getElementById("edit-sat-date").value.split("/").join(",")+" "+document.getElementById("edit-sat-time").value).set(data)
|
||||
document.getElementById("edit-sat-name").value = '';
|
||||
document.getElementById("edit-sat-direction").value = '';
|
||||
document.getElementById("edit-sat-time").value = "";
|
||||
document.getElementById("edit-sat-date").value = "";
|
||||
document.getElementById("edit-sat-image").value = "";
|
||||
document.getElementById("edit-sat-snr").value = "";
|
||||
document.getElementById("edit-sat-elevation").value = "";
|
||||
document.getElementById("edit-sat-processing").value
|
||||
}
|
||||
|
||||
// Satellite onChange Page Update
|
||||
function satOnChange() {
|
||||
var title = document.getElementById("sat-list").value
|
||||
var database = firebase.database().ref("sats/"+title.split("/").join(","));
|
||||
database.on('value', function(data) {
|
||||
var data1 = data.val()
|
||||
document.getElementById("edit-sat-name").value = data1["name"]
|
||||
document.getElementById("edit-sat-direction").value = data1["direction"]
|
||||
document.getElementById("edit-sat-time").value = data1["time"]
|
||||
document.getElementById("edit-sat-date").value = data1["date"]
|
||||
document.getElementById("edit-sat-image").value = data1["image"]
|
||||
document.getElementById("edit-sat-snr").value = data1["snr"]
|
||||
document.getElementById("edit-sat-elevation").value = data1["elevation"]
|
||||
document.getElementById("edit-sat-processing").value = data1["processing"]
|
||||
})
|
||||
}
|
||||
|
||||
// Display List of Sats in form
|
||||
function satList() {
|
||||
database = firebase.database().ref("sats");
|
||||
database.once('value', function(snapshot) {
|
||||
snapshot.forEach(function(child) {
|
||||
var a = document.createElement("option")
|
||||
a.setAttribute("value",child["key"].split(",").join("/"))
|
||||
a.innerHTML = child["key"].split(",").join("/")
|
||||
document.getElementById("sat-list").appendChild(a)
|
||||
})
|
||||
});
|
||||
blogOnChange();
|
||||
}
|
||||
|
||||
// Display all Satellites
|
||||
function displaySats() {
|
||||
console.log("Init")
|
||||
database = firebase.database().ref("sats");
|
||||
database.once('value', function(snapshot) {
|
||||
snapshot.forEach(function(child) {
|
||||
firebase.database().ref("sats/"+child["key"]).on('value', function (data) {
|
||||
var data1 = data.val();
|
||||
var a = document.createElement("tr")
|
||||
a.innerHTML = "<tr style='border-bottom-style: solid;'><td style='border-right-style: solid;width: 10%;border-bottom-style: solid;'><img id='resize' src='https://lax18.github.io/Satellite-Imagery-Uploads/"+data1["image"]+".jpg'><br><a href='https://lax18.github.io/Satellite-Imagery-Uploads/"+data1["image"]+".jpg' target='_blank'>Click to enlarge</a></td><td style='border-bottom-style: solid;'><h1 id='titles'>"+data1["name"]+"</h1><h1 id='titles'>"+data1["direction"]+"</h1><h3>"+data1["date"].split(",").join(",")+" "+data1["time"]+" UTC"+"</h3><h4>Max Elevation: "+data1["elevation"]+"</h4><h4>Max SNR: "+data1["snr"]+"</h4><h4>Processing Information: "+data1["processing"]+"</td></tr>"
|
||||
document.getElementById("sats").appendChild(a)
|
||||
}
|
||||
)})
|
||||
});
|
||||
}
|
||||
|
||||
// Display List of Blogs in form
|
||||
function blogList() {
|
||||
database = firebase.database().ref("blogs");
|
||||
|
||||
@@ -0,0 +1,39 @@
|
||||
<html>
|
||||
<head>
|
||||
<title>LAX18's Homepage - Satellite Imagery</title>
|
||||
<link rel="stylesheet" type="text/css" href="css/style.css">
|
||||
<link rel="icon" type="image/png" href="https://i.imgur.com/A385G44.png">
|
||||
<script src="https://www.gstatic.com/firebasejs/5.8.2/firebase.js"></script>
|
||||
<!-- Global site tag (gtag.js) - Google Analytics -->
|
||||
<script async src="https://www.googletagmanager.com/gtag/js?id=UA-119545665-1"></script>
|
||||
<script src="js/script.js"></script>
|
||||
<style>
|
||||
|
||||
</style>
|
||||
</head>
|
||||
<body onload="onLoad();displaySats()">
|
||||
<div id="entirenav">
|
||||
<div id="navbarlogo">
|
||||
<img src="img/LAX18.jpeg" width="64"><span id="logofont" style="font-size: 68pt;">LAX18's Homepage</span>
|
||||
</div>
|
||||
<div id="nav">
|
||||
<ul class="nav-bar" id="nav-bar">
|
||||
<li class="nav-bar-li"><a href="index.html">Home</a></li>
|
||||
<li class="nav-bar-li"><a href="sat.html">Satellite Imagery</a></li>
|
||||
<li class="nav-bar-li"><a href="programs.html">Programs</a></li>
|
||||
<li class="nav-bar-li"><a href="projects.html">Projects</li>
|
||||
<li class="nav-bar-li"><a href="contact.html">Contact</a></li>
|
||||
<li class="nav-bar-li"><a href="libraries/index.html">Libraries</a></li>
|
||||
<li class="nav-bar-li" style="float: right;" id="logoutbutton"><a href='javascript:logOut();'>Log Out</a></li>
|
||||
<li class="nav-bar-li" style="float: right;" id="loginbutton"><a href="javascript:logIn();">Log In</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
<h2 id="titles">Satellite Imagery</h2>
|
||||
Listed below are my satellite captures from passing NOAA and Meteor satellites.<br>
|
||||
<table id="sats" style="border-style: solid;border-bottom-style: none;border-color: black;" width="100%">
|
||||
|
||||
</tr>
|
||||
</table>
|
||||
</body>
|
||||
</html>
|
||||
Reference in New Issue
Block a user