+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ + +# **Thank you for contributingπ** diff --git a/Pages/asteroid-info/assets/64e4e4aabd98a600197c0ca3.webp b/Pages/asteroid-info/assets/64e4e4aabd98a600197c0ca3.webp new file mode 100644 index 0000000..b65321b Binary files /dev/null and b/Pages/asteroid-info/assets/64e4e4aabd98a600197c0ca3.webp differ diff --git a/Pages/asteroid-info/assets/A letter tech logo.png b/Pages/asteroid-info/assets/A letter tech logo.png new file mode 100644 index 0000000..8be4e70 Binary files /dev/null and b/Pages/asteroid-info/assets/A letter tech logo.png differ diff --git a/Pages/asteroid-info/assets/favicon.png b/Pages/asteroid-info/assets/favicon.png new file mode 100644 index 0000000..0bd2071 Binary files /dev/null and b/Pages/asteroid-info/assets/favicon.png differ diff --git a/Pages/asteroid-info/assets/feel the fear and do it anyway.png b/Pages/asteroid-info/assets/feel the fear and do it anyway.png new file mode 100644 index 0000000..e76a257 Binary files /dev/null and b/Pages/asteroid-info/assets/feel the fear and do it anyway.png differ diff --git a/Pages/asteroid-info/assets/jb1p0zcvmgrdx7yq9sur.png b/Pages/asteroid-info/assets/jb1p0zcvmgrdx7yq9sur.png new file mode 100644 index 0000000..a640fcd Binary files /dev/null and b/Pages/asteroid-info/assets/jb1p0zcvmgrdx7yq9sur.png differ diff --git a/Pages/asteroid-info/assets/logo_black.png b/Pages/asteroid-info/assets/logo_black.png new file mode 100644 index 0000000..29f2a4f Binary files /dev/null and b/Pages/asteroid-info/assets/logo_black.png differ diff --git a/Pages/asteroid-info/assets/logo_white.png b/Pages/asteroid-info/assets/logo_white.png new file mode 100644 index 0000000..505c97e Binary files /dev/null and b/Pages/asteroid-info/assets/logo_white.png differ diff --git a/Pages/asteroid-info/assets/mars.png b/Pages/asteroid-info/assets/mars.png new file mode 100644 index 0000000..43eedb8 Binary files /dev/null and b/Pages/asteroid-info/assets/mars.png differ diff --git a/Pages/asteroid-info/assets/original-5fcdc62f8266e353ea97ca56731ad804.png b/Pages/asteroid-info/assets/original-5fcdc62f8266e353ea97ca56731ad804.png new file mode 100644 index 0000000..5c5d126 Binary files /dev/null and b/Pages/asteroid-info/assets/original-5fcdc62f8266e353ea97ca56731ad804.png differ diff --git a/Pages/asteroid-info/index.html b/Pages/asteroid-info/index.html new file mode 100644 index 0000000..0f46a5c --- /dev/null +++ b/Pages/asteroid-info/index.html @@ -0,0 +1,137 @@ + + + + + + +
+
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/Pages/asteroid-info/particles.min.js b/Pages/asteroid-info/particles.min.js
new file mode 100644
index 0000000..b3d46d1
--- /dev/null
+++ b/Pages/asteroid-info/particles.min.js
@@ -0,0 +1,9 @@
+/* -----------------------------------------------
+/* Author : Vincent Garreau - vincentgarreau.com
+/* MIT license: http://opensource.org/licenses/MIT
+/* Demo / Generator : vincentgarreau.com/particles.js
+/* GitHub : github.com/VincentGarreau/particles.js
+/* How to use? : Check the GitHub README
+/* v2.0.0
+/* ----------------------------------------------- */
+function hexToRgb(e){var a=/^#?([a-f\d])([a-f\d])([a-f\d])$/i;e=e.replace(a,function(e,a,t,i){return a+a+t+t+i+i});var t=/^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(e);return t?{r:parseInt(t[1],16),g:parseInt(t[2],16),b:parseInt(t[3],16)}:null}function clamp(e,a,t){return Math.min(Math.max(e,a),t)}function isInArray(e,a){return a.indexOf(e)>-1}var pJS=function(e,a){var t=document.querySelector("#"+e+" > .particles-js-canvas-el");this.pJS={canvas:{el:t,w:t.offsetWidth,h:t.offsetHeight},particles:{number:{value:400,density:{enable:!0,value_area:800}},color:{value:"#fff"},shape:{type:"circle",stroke:{width:0,color:"#ff0000"},polygon:{nb_sides:5},image:{src:"",width:100,height:100}},opacity:{value:1,random:!1,anim:{enable:!1,speed:2,opacity_min:0,sync:!1}},size:{value:20,random:!1,anim:{enable:!1,speed:20,size_min:0,sync:!1}},line_linked:{enable:!0,distance:100,color:"#fff",opacity:1,width:1},move:{enable:!0,speed:2,direction:"none",random:!1,straight:!1,out_mode:"out",bounce:!1,attract:{enable:!1,rotateX:3e3,rotateY:3e3}},array:[]},interactivity:{detect_on:"canvas",events:{onhover:{enable:!0,mode:"grab"},onclick:{enable:!0,mode:"push"},resize:!0},modes:{grab:{distance:100,line_linked:{opacity:1}},bubble:{distance:200,size:80,duration:.4},repulse:{distance:200,duration:.4},push:{particles_nb:4},remove:{particles_nb:2}},mouse:{}},retina_detect:!1,fn:{interact:{},modes:{},vendors:{}},tmp:{}};var i=this.pJS;a&&Object.deepExtend(i,a),i.tmp.obj={size_value:i.particles.size.value,size_anim_speed:i.particles.size.anim.speed,move_speed:i.particles.move.speed,line_linked_distance:i.particles.line_linked.distance,line_linked_width:i.particles.line_linked.width,mode_grab_distance:i.interactivity.modes.grab.distance,mode_bubble_distance:i.interactivity.modes.bubble.distance,mode_bubble_size:i.interactivity.modes.bubble.size,mode_repulse_distance:i.interactivity.modes.repulse.distance},i.fn.retinaInit=function(){i.retina_detect&&window.devicePixelRatio>1?(i.canvas.pxratio=window.devicePixelRatio,i.tmp.retina=!0):(i.canvas.pxratio=1,i.tmp.retina=!1),i.canvas.w=i.canvas.el.offsetWidth*i.canvas.pxratio,i.canvas.h=i.canvas.el.offsetHeight*i.canvas.pxratio,i.particles.size.value=i.tmp.obj.size_value*i.canvas.pxratio,i.particles.size.anim.speed=i.tmp.obj.size_anim_speed*i.canvas.pxratio,i.particles.move.speed=i.tmp.obj.move_speed*i.canvas.pxratio,i.particles.line_linked.distance=i.tmp.obj.line_linked_distance*i.canvas.pxratio,i.interactivity.modes.grab.distance=i.tmp.obj.mode_grab_distance*i.canvas.pxratio,i.interactivity.modes.bubble.distance=i.tmp.obj.mode_bubble_distance*i.canvas.pxratio,i.particles.line_linked.width=i.tmp.obj.line_linked_width*i.canvas.pxratio,i.interactivity.modes.bubble.size=i.tmp.obj.mode_bubble_size*i.canvas.pxratio,i.interactivity.modes.repulse.distance=i.tmp.obj.mode_repulse_distance*i.canvas.pxratio},i.fn.canvasInit=function(){i.canvas.ctx=i.canvas.el.getContext("2d")},i.fn.canvasSize=function(){i.canvas.el.width=i.canvas.w,i.canvas.el.height=i.canvas.h,i&&i.interactivity.events.resize&&window.addEventListener("resize",function(){i.canvas.w=i.canvas.el.offsetWidth,i.canvas.h=i.canvas.el.offsetHeight,i.tmp.retina&&(i.canvas.w*=i.canvas.pxratio,i.canvas.h*=i.canvas.pxratio),i.canvas.el.width=i.canvas.w,i.canvas.el.height=i.canvas.h,i.particles.move.enable||(i.fn.particlesEmpty(),i.fn.particlesCreate(),i.fn.particlesDraw(),i.fn.vendors.densityAutoParticles()),i.fn.vendors.densityAutoParticles()})},i.fn.canvasPaint=function(){i.canvas.ctx.fillRect(0,0,i.canvas.w,i.canvas.h)},i.fn.canvasClear=function(){i.canvas.ctx.clearRect(0,0,i.canvas.w,i.canvas.h)},i.fn.particle=function(e,a,t){if(this.radius=(i.particles.size.random?Math.random():1)*i.particles.size.value,i.particles.size.anim.enable&&(this.size_status=!1,this.vs=i.particles.size.anim.speed/100,i.particles.size.anim.sync||(this.vs=this.vs*Math.random())),this.x=t?t.x:Math.random()*i.canvas.w,this.y=t?t.y:Math.random()*i.canvas.h,this.x>i.canvas.w-2*this.radius?this.x=this.x-this.radius:this.x<2*this.radius&&(this.x=this.x+this.radius),this.y>i.canvas.h-2*this.radius?this.y=this.y-this.radius:this.y<2*this.radius&&(this.y=this.y+this.radius),i.particles.move.bounce&&i.fn.vendors.checkOverlap(this,t),this.color={},"object"==typeof e.value)if(e.value instanceof Array){var s=e.value[Math.floor(Math.random()*i.particles.color.value.length)];this.color.rgb=hexToRgb(s)}else void 0!=e.value.r&&void 0!=e.value.g&&void 0!=e.value.b&&(this.color.rgb={r:e.value.r,g:e.value.g,b:e.value.b}),void 0!=e.value.h&&void 0!=e.value.s&&void 0!=e.value.l&&(this.color.hsl={h:e.value.h,s:e.value.s,l:e.value.l});else"random"==e.value?this.color.rgb={r:Math.floor(256*Math.random())+0,g:Math.floor(256*Math.random())+0,b:Math.floor(256*Math.random())+0}:"string"==typeof e.value&&(this.color=e,this.color.rgb=hexToRgb(this.color.value));this.opacity=(i.particles.opacity.random?Math.random():1)*i.particles.opacity.value,i.particles.opacity.anim.enable&&(this.opacity_status=!1,this.vo=i.particles.opacity.anim.speed/100,i.particles.opacity.anim.sync||(this.vo=this.vo*Math.random()));var n={};switch(i.particles.move.direction){case"top":n={x:0,y:-1};break;case"top-right":n={x:.5,y:-.5};break;case"right":n={x:1,y:-0};break;case"bottom-right":n={x:.5,y:.5};break;case"bottom":n={x:0,y:1};break;case"bottom-left":n={x:-.5,y:1};break;case"left":n={x:-1,y:0};break;case"top-left":n={x:-.5,y:-.5};break;default:n={x:0,y:0}}i.particles.move.straight?(this.vx=n.x,this.vy=n.y,i.particles.move.random&&(this.vx=this.vx*Math.random(),this.vy=this.vy*Math.random())):(this.vx=n.x+Math.random()-.5,this.vy=n.y+Math.random()-.5),this.vx_i=this.vx,this.vy_i=this.vy;var r=i.particles.shape.type;if("object"==typeof r){if(r instanceof Array){var c=r[Math.floor(Math.random()*r.length)];this.shape=c}}else this.shape=r;if("image"==this.shape){var o=i.particles.shape;this.img={src:o.image.src,ratio:o.image.width/o.image.height},this.img.ratio||(this.img.ratio=1),"svg"==i.tmp.img_type&&void 0!=i.tmp.source_svg&&(i.fn.vendors.createSvgImg(this),i.tmp.pushing&&(this.img.loaded=!1))}},i.fn.particle.prototype.draw=function(){function e(){i.canvas.ctx.drawImage(r,a.x-t,a.y-t,2*t,2*t/a.img.ratio)}var a=this;if(void 0!=a.radius_bubble)var t=a.radius_bubble;else var t=a.radius;if(void 0!=a.opacity_bubble)var s=a.opacity_bubble;else var s=a.opacity;if(a.color.rgb)var n="rgba("+a.color.rgb.r+","+a.color.rgb.g+","+a.color.rgb.b+","+s+")";else var n="hsla("+a.color.hsl.h+","+a.color.hsl.s+"%,"+a.color.hsl.l+"%,"+s+")";switch(i.canvas.ctx.fillStyle=n,i.canvas.ctx.beginPath(),a.shape){case"circle":i.canvas.ctx.arc(a.x,a.y,t,0,2*Math.PI,!1);break;case"edge":i.canvas.ctx.rect(a.x-t,a.y-t,2*t,2*t);break;case"triangle":i.fn.vendors.drawShape(i.canvas.ctx,a.x-t,a.y+t/1.66,2*t,3,2);break;case"polygon":i.fn.vendors.drawShape(i.canvas.ctx,a.x-t/(i.particles.shape.polygon.nb_sides/3.5),a.y-t/.76,2.66*t/(i.particles.shape.polygon.nb_sides/3),i.particles.shape.polygon.nb_sides,1);break;case"star":i.fn.vendors.drawShape(i.canvas.ctx,a.x-2*t/(i.particles.shape.polygon.nb_sides/4),a.y-t/1.52,2*t*2.66/(i.particles.shape.polygon.nb_sides/3),i.particles.shape.polygon.nb_sides,2);break;case"image":if("svg"==i.tmp.img_type)var r=a.img.obj;else var r=i.tmp.img_obj;r&&e()}i.canvas.ctx.closePath(),i.particles.shape.stroke.width>0&&(i.canvas.ctx.strokeStyle=i.particles.shape.stroke.color,i.canvas.ctx.lineWidth=i.particles.shape.stroke.width,i.canvas.ctx.stroke()),i.canvas.ctx.fill()},i.fn.particlesCreate=function(){for(var e=0;e
+
+
+ Near Earth Objects
+ +
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ The ending date should not be more than 7 than the Starting date
+
+
+ Name of the Asteroid: X6969
+ +
+
+
+
+
+
+ Estimated diameter (km)
+Min: X
+Max: X
+
+
+
+ Potential hazardous?
+Yes
+
+
+
+ Close approach Date (YYYY-MM-DD)
+2024-05-12
+
+
+
+ Relative Velocity
+km/sec: X
+km/hr: X
+
+
+
+ Orbiting body
+ Earth +
+
+
+ Sentry object
+ No +
+ 
`
+ })
+
+}
+function fetchImg(){
+ if(document.querySelector('#lat').value==""|| document.querySelector('#lon').value==""){
+ alert("Pls enter both values or select get location")
+ }
+ else{
+fetchEPICImages(document.querySelector('#lat').value,document.querySelector('#lon').value);
+}
+}
+function fetchImg_auto() {
+ // Get user's current location
+ if (navigator.geolocation) {
+ navigator.geolocation.getCurrentPosition(successCallback, errorCallback);
+ } else {
+ console.error("Geolocation is not supported by this browser.");
+ }
+}
+
+// Success callback function for geolocation
+function successCallback(position) {
+ const latitude = position.coords.latitude;
+ const longitude = position.coords.longitude;
+ fetchEPICImages(latitude, longitude);
+}
+
+// Error callback function for geolocation
+function errorCallback(error) {
+ console.error("Error getting user's location:", error.message);
+}
+
diff --git a/Pages/earthPics/style.css b/Pages/earthPics/style.css
new file mode 100644
index 0000000..831be34
--- /dev/null
+++ b/Pages/earthPics/style.css
@@ -0,0 +1,206 @@
+* {
+ box-sizing: border-box;
+ margin: 0;
+ padding: 0;
+}
+body {
+ background-image: linear-gradient(to left, rgb(10, 0, 73), rgb(0, 0, 0));
+ overflow-x: hidden;
+ color: rgb(255, 255, 255);
+ font-family: sans-serif;
+}
+
+body::-webkit-scrollbar {
+ display: none;
+}
+
+
+/* NAVBAR STYLING */
+
+.navbar_background {
+ background-image: linear-gradient(to left, rgb(10, 0, 73), rgb(0, 0, 0));
+}
+
+#bg-ast {
+ position: fixed;
+ top: 0;
+ left: 0;
+ bottom: 0;
+ right: 0;
+ z-index: -1;
+}
+
+/* HERO SECTION */
+
+.container {
+ width: 75%;
+ position: relative;
+ top: 70px;
+ padding: 10px;
+ text-align: center;
+background: rgba( 255, 255, 255, 0.15 );
+box-shadow: 0 8px 32px 0 rgba( 31, 38, 135, 0.37 );
+backdrop-filter: blur( 2.5px );
+-webkit-backdrop-filter: blur( 2.5px );
+border-radius: 10px;
+border: 1px solid rgba( 255, 255, 255, 0.18 );
+}
+
+.info {
+ font-size: 1.1rem;
+ line-height: 1.6;
+ color: rgba(255, 255, 255, 0.8);
+ margin-top: 20px;
+}
+/* Inputs */
+
+
+.input-field {
+ padding: 20px 0px;
+}
+
+#input-heading {
+ font-weight: bold;
+ font-size: 3rem;
+ background: -webkit-linear-gradient(top, rgb(228, 214, 251), rgb(132, 0, 255)) text;
+ -webkit-text-fill-color: transparent;
+}
+
+.num-lat-input,.num-lon-input {
+ margin: 8px 0px;
+}
+
+.num-lon-input{
+ position: relative;
+ left: 8px;
+}
+.num-lat-input>label,.num-lon-input>label{
+ color: rgba(255, 255, 255, 0.75);
+ font-weight: 600;
+ font-size: 1rem;
+}
+
+.date-inputs {
+ padding: 4px 8px;
+ border-radius: 2px;
+ border: none;
+ outline: none;
+ background-color: #e4d6fb;
+ transition: 0.1s ease-in-out;
+}
+
+.date-inputs:hover {
+ box-shadow: 2px 2px 1px 1px rgb(187, 18, 187);
+ cursor: pointer;
+}
+
+#submit-btn,#loc_btn{
+ position: relative;
+ left: -30px;
+ padding: 6px 12px;
+ outline: none;
+ border: none;
+ background-color: #0d6efd;
+ border-radius: 6px;
+ color: white;
+ font-weight: bold;
+ letter-spacing: 1px;
+ transition: 0.1s ease-in-out;
+ margin: 10px 5px;
+}
+
+#dates-submit-btn:hover,#loc_btn:hover{
+ background-color: #0b5ed7;
+}
+
+
+.note {
+ margin: 0px auto;
+ padding: 4px;
+ width: fit-content;
+ display: flex;
+}
+
+#exclmation-icon {
+ margin: 0px 4px;
+}
+
+#fetch_img{
+ width: 400px;
+ height: 400px;
+ border-radius: 20px;
+ position: relative;
+ top: 20px;
+}
+
+.flex_container{
+ display: flex;
+ justify-content: center;
+ align-items: center;
+}
+
+.info{
+ display: flex;
+ flex-direction: column;
+}
+.coord{
+ display: flex;
+ flex-direction: row;
+ justify-content: space-evenly;
+}
+
+
+.sat_info{
+
+ font-size: 2rem;
+ background: -webkit-linear-gradient(top, rgb(228, 214, 251), rgb(106, 2, 204)) text;
+ -webkit-text-fill-color: transparent;
+}
+.text{
+
+ border-radius: 20px;
+}
+.satellite{
+ border-radius: 20px;
+ margin: 10px;
+ background-color: purple;
+ width: 310px;
+}
+
+.satellite{
+ background-color: #ffffff;
+ color: black;
+ border-radius: 10px;
+ width: fit-content;
+ padding: 10px;
+ width: 100%;
+ filter: drop-shadow(0 5px 10px 0 #ffffff);
+ z-index: 0;
+ overflow: hidden;
+ transition: 0.4s ease-in;
+ position: relative;
+}
+
+.satellite::before {
+ content: "";
+ position: absolute;
+ z-index: -1;
+ top: -15px;
+ right: -15px;
+ background: #7952b3;
+ height: 220px;
+ width: 25px;
+ border-radius: 32px;
+ transform: scale(1);
+ transform-origin: 50% 50%;
+ transition: transform 0.25s ease-out;
+}
+
+.satellite:hover::before {
+ transition-delay: 0.2s;
+ transform: scale(40);
+}
+
+.satellite:hover{
+ color: #ffffff;
+}
\ No newline at end of file
diff --git a/README.md b/README.md
index b8887c0..b7382f8 100644
--- a/README.md
+++ b/README.md
@@ -22,32 +22,38 @@
git clone https://github.com//cosmoXplore.git
```
-3. **Create a New Branch:** Establish a new branch for your profile using the command:
+3. **Navigate to your repository:** Navigate to your new project directory by using the command:
+
+```
+cd cosmoXplore
+```
+
+4. **Create a New Branch:** Establish a new branch for your profile using the command:
```
git checkout -b
```
-4. **Add Your Changes:** Add the modified files to the stage with the following command:
+5. **Add Your Changes:** Add the modified files to the stage with the following command:
```
git add .
```
-5. **Commit Your Changes:** Save your alterations to the branch by executing:
+6. **Commit Your Changes:** Save your alterations to the branch by executing:
```
git commit -m "Your descriptive commit message"
```
-6. **Push to the Branch:** Transmit the changes to the remote repository using:
+7. **Push to the Branch:** Transmit the changes to the remote repository using:
```
git push origin
```
-7. **Create a Pull Request:** Submit your modifications to the main repository by generating a pull request. Click on the "Compare & pull request" button on your forked repository page.
+8. **Create a Pull Request:** Submit your modifications to the main repository by generating a pull request. Click on the "Compare & pull request" button on your forked repository page.
-8. **Wait for Review and Merge:** Wait for the project maintainers to review and merge your changes.
+9. **Wait for Review and Merge:** Wait for the project maintainers to review and merge your changes.
---
diff --git a/app.js b/app.js
index 535afd7..cb70e9b 100644
--- a/app.js
+++ b/app.js
@@ -121,27 +121,39 @@ particlesJS("bg", {
return response.json()
}).then((data) => {
console.log(data)
-
- displayData(data.url, data.explanation, data.title, data.date, data.copyright )
-
+ displayData(data.url, data.explanation, data.title, data.date, data.copyright,data.media_type)
})
.catch((error) => console.error(error))
//function to display data in apod section
- function displayData(image, info, title, date, copyright){
- document.getElementById("apod_img").src = image
- document.getElementById("apod_info").textContent = info
- document.getElementById("title").textContent = title
- document.getElementById("date").textContent = date
- document.getElementById("copyright").textContent = copyright
-
+ function displayData(media, info, title, date, copyright,mediatype){
+ if(mediatype === "video") // Check media type
+ {
+ // Hide image container, display video container, and embed video
+ document.querySelector(".img").style.display = "none";
+ document.querySelector(".video").style.display = "block";
+ const videoContainer = document.querySelector(".video");
+ videoContainer.style.height = "80vh"; //Use viewport height (vh) for better responsiveness
+
+ document.getElementById("apod_video").innerHTML = ``;
+ } else {
+ // Hide video container, display image container, and set image source
+ document.querySelector(".video").style.display = "none";
+ document.querySelector(".img").style.display = "block";
+ document.getElementById("apod_img").src = media;
+ }
+ document.getElementById("apod_info").textContent = info;
+ document.getElementById("title").textContent = title;
+ document.getElementById("date").textContent = date;
+ document.getElementById("copyright").textContent = copyright;
}
// NASA API CALL 2 : Mars Rover Photos
+let photosArr;
function displayRover(){
document.querySelector('.rover_container').style.display = 'none';
@@ -158,6 +170,7 @@ function displayRover(){
console.log(data)
let img_src = data.photos[0].img_src;
+ photosArr = data.photos;
let date = data.photos[0].earth_date;
let roverName = data.photos[0].rover.name;
let camera = data.photos[0].camera.full_name;
@@ -165,8 +178,6 @@ function displayRover(){
let land = data.photos[0].rover.landing_date;
let status = data.photos[0].rover.status;
-
-
updateDom(img_src, date, roverName, camera, launch, land, status)
})
@@ -184,9 +195,34 @@ function displayRover(){
document.querySelector('.status').textContent = status
}
+// added closeRover function
+function closeRoverDisplay(e){
+ document.querySelector('.rover_container').style.display = 'flex';
+ document.querySelector('.rover_display').style.display = 'none';
+}
+//MARS PHOTOS SLIDESHOW OF MULTIPLE CAMERAS
+var slideIndex = 0; // Initialize slide index to 0
+function plusDivs(n) {
+ slideIndex += n;
+ if (slideIndex >= photosArr.length) {
+ slideIndex = 0; // Reset to first image if reached the end
+ } else if (slideIndex < 0) {
+ slideIndex = photosArr.length - 1; // Go to last image if reached the beginning
+ }
+ showDivs(slideIndex);
+}
-
+function showDivs(n) {
+ var roverImg = document.querySelector('#roverImg');
+ var cameraName = document.querySelector('.camera');
+ if (photosArr.length > 0) {
+ // Use modulo operator to ensure index wraps around correctly
+ n = (n + photosArr.length) % photosArr.length;
+ roverImg.src = photosArr[n].img_src;
+ cameraName.textContent = photosArr[n].camera.full_name;
+ }
+}
// API CALL 3 : NASA Photo Video Gallery
diff --git a/assets/favicon.png b/assets/favicon.png
new file mode 100644
index 0000000..0bd2071
Binary files /dev/null and b/assets/favicon.png differ
diff --git a/index.html b/index.html
index 5a5c3c8..7436e78 100644
--- a/index.html
+++ b/index.html
@@ -1,8 +1,5 @@
-
-
-
@@ -10,22 +7,80 @@
-
-
-
+
+
+
+
+
-
+
+ =i.particles.opacity.value&&(a.opacity_status=!1),a.opacity+=a.vo):(a.opacity<=i.particles.opacity.anim.opacity_min&&(a.opacity_status=!0),a.opacity-=a.vo),a.opacity<0&&(a.opacity=0)),i.particles.size.anim.enable&&(1==a.size_status?(a.radius>=i.particles.size.value&&(a.size_status=!1),a.radius+=a.vs):(a.radius<=i.particles.size.anim.size_min&&(a.size_status=!0),a.radius-=a.vs),a.radius<0&&(a.radius=0)),"bounce"==i.particles.move.out_mode)var s={x_left:a.radius,x_right:i.canvas.w,y_top:a.radius,y_bottom:i.canvas.h};else var s={x_left:-a.radius,x_right:i.canvas.w+a.radius,y_top:-a.radius,y_bottom:i.canvas.h+a.radius};switch(a.x-a.radius>i.canvas.w?(a.x=s.x_left,a.y=Math.random()*i.canvas.h):a.x+a.radius<0&&(a.x=s.x_right,a.y=Math.random()*i.canvas.h),a.y-a.radius>i.canvas.h?(a.y=s.y_top,a.x=Math.random()*i.canvas.w):a.y+a.radius<0&&(a.y=s.y_bottom,a.x=Math.random()*i.canvas.w),i.particles.move.out_mode){case"bounce":a.x+a.radius>i.canvas.w?a.vx=-a.vx:a.x-a.radius<0&&(a.vx=-a.vx),a.y+a.radius>i.canvas.h?a.vy=-a.vy:a.y-a.radius<0&&(a.vy=-a.vy)}if(isInArray("grab",i.interactivity.events.onhover.mode)&&i.fn.modes.grabParticle(a),(isInArray("bubble",i.interactivity.events.onhover.mode)||isInArray("bubble",i.interactivity.events.onclick.mode))&&i.fn.modes.bubbleParticle(a),(isInArray("repulse",i.interactivity.events.onhover.mode)||isInArray("repulse",i.interactivity.events.onclick.mode))&&i.fn.modes.repulseParticle(a),i.particles.line_linked.enable||i.particles.move.attract.enable)for(var n=e+1;n0){var c=i.particles.line_linked.color_rgb_line;i.canvas.ctx.strokeStyle="rgba("+c.r+","+c.g+","+c.b+","+r+")",i.canvas.ctx.lineWidth=i.particles.line_linked.width,i.canvas.ctx.beginPath(),i.canvas.ctx.moveTo(e.x,e.y),i.canvas.ctx.lineTo(a.x,a.y),i.canvas.ctx.stroke(),i.canvas.ctx.closePath()}}},i.fn.interact.attractParticles=function(e,a){var t=e.x-a.x,s=e.y-a.y,n=Math.sqrt(t*t+s*s);if(n<=i.particles.line_linked.distance){var r=t/(1e3*i.particles.move.attract.rotateX),c=s/(1e3*i.particles.move.attract.rotateY);e.vx-=r,e.vy-=c,a.vx+=r,a.vy+=c}},i.fn.interact.bounceParticles=function(e,a){var t=e.x-a.x,i=e.y-a.y,s=Math.sqrt(t*t+i*i),n=e.radius+a.radius;n>=s&&(e.vx=-e.vx,e.vy=-e.vy,a.vx=-a.vx,a.vy=-a.vy)},i.fn.modes.pushParticles=function(e,a){i.tmp.pushing=!0;for(var t=0;e>t;t++)i.particles.array.push(new i.fn.particle(i.particles.color,i.particles.opacity.value,{x:a?a.pos_x:Math.random()*i.canvas.w,y:a?a.pos_y:Math.random()*i.canvas.h})),t==e-1&&(i.particles.move.enable||i.fn.particlesDraw(),i.tmp.pushing=!1)},i.fn.modes.removeParticles=function(e){i.particles.array.splice(0,e),i.particles.move.enable||i.fn.particlesDraw()},i.fn.modes.bubbleParticle=function(e){function a(){e.opacity_bubble=e.opacity,e.radius_bubble=e.radius}function t(a,t,s,n,c){if(a!=t)if(i.tmp.bubble_duration_end){if(void 0!=s){var o=n-p*(n-a)/i.interactivity.modes.bubble.duration,l=a-o;d=a+l,"size"==c&&(e.radius_bubble=d),"opacity"==c&&(e.opacity_bubble=d)}}else if(r<=i.interactivity.modes.bubble.distance){if(void 0!=s)var v=s;else var v=n;if(v!=a){var d=n-p*(n-a)/i.interactivity.modes.bubble.duration;"size"==c&&(e.radius_bubble=d),"opacity"==c&&(e.opacity_bubble=d)}}else"size"==c&&(e.radius_bubble=void 0),"opacity"==c&&(e.opacity_bubble=void 0)}if(i.interactivity.events.onhover.enable&&isInArray("bubble",i.interactivity.events.onhover.mode)){var s=e.x-i.interactivity.mouse.pos_x,n=e.y-i.interactivity.mouse.pos_y,r=Math.sqrt(s*s+n*n),c=1-r/i.interactivity.modes.bubble.distance;if(r<=i.interactivity.modes.bubble.distance){if(c>=0&&"mousemove"==i.interactivity.status){if(i.interactivity.modes.bubble.size!=i.particles.size.value)if(i.interactivity.modes.bubble.size>i.particles.size.value){var o=e.radius+i.interactivity.modes.bubble.size*c;o>=0&&(e.radius_bubble=o)}else{var l=e.radius-i.interactivity.modes.bubble.size,o=e.radius-l*c;o>0?e.radius_bubble=o:e.radius_bubble=0}if(i.interactivity.modes.bubble.opacity!=i.particles.opacity.value)if(i.interactivity.modes.bubble.opacity>i.particles.opacity.value){var v=i.interactivity.modes.bubble.opacity*c;v>e.opacity&&v<=i.interactivity.modes.bubble.opacity&&(e.opacity_bubble=v)}else{var v=e.opacity-(i.particles.opacity.value-i.interactivity.modes.bubble.opacity)*c;v=i.interactivity.modes.bubble.opacity&&(e.opacity_bubble=v)}}}else a();"mouseleave"==i.interactivity.status&&a()}else if(i.interactivity.events.onclick.enable&&isInArray("bubble",i.interactivity.events.onclick.mode)){if(i.tmp.bubble_clicking){var s=e.x-i.interactivity.mouse.click_pos_x,n=e.y-i.interactivity.mouse.click_pos_y,r=Math.sqrt(s*s+n*n),p=((new Date).getTime()-i.interactivity.mouse.click_time)/1e3;p>i.interactivity.modes.bubble.duration&&(i.tmp.bubble_duration_end=!0),p>2*i.interactivity.modes.bubble.duration&&(i.tmp.bubble_clicking=!1,i.tmp.bubble_duration_end=!1)}i.tmp.bubble_clicking&&(t(i.interactivity.modes.bubble.size,i.particles.size.value,e.radius_bubble,e.radius,"size"),t(i.interactivity.modes.bubble.opacity,i.particles.opacity.value,e.opacity_bubble,e.opacity,"opacity"))}},i.fn.modes.repulseParticle=function(e){function a(){var a=Math.atan2(d,p);if(e.vx=u*Math.cos(a),e.vy=u*Math.sin(a),"bounce"==i.particles.move.out_mode){var t={x:e.x+e.vx,y:e.y+e.vy};t.x+e.radius>i.canvas.w?e.vx=-e.vx:t.x-e.radius<0&&(e.vx=-e.vx),t.y+e.radius>i.canvas.h?e.vy=-e.vy:t.y-e.radius<0&&(e.vy=-e.vy)}}if(i.interactivity.events.onhover.enable&&isInArray("repulse",i.interactivity.events.onhover.mode)&&"mousemove"==i.interactivity.status){var t=e.x-i.interactivity.mouse.pos_x,s=e.y-i.interactivity.mouse.pos_y,n=Math.sqrt(t*t+s*s),r={x:t/n,y:s/n},c=i.interactivity.modes.repulse.distance,o=100,l=clamp(1/c*(-1*Math.pow(n/c,2)+1)*c*o,0,50),v={x:e.x+r.x*l,y:e.y+r.y*l};"bounce"==i.particles.move.out_mode?(v.x-e.radius>0&&v.x+e.radius0&&v.y+e.radius=m&&a()}else 0==i.tmp.repulse_clicking&&(e.vx=e.vx_i,e.vy=e.vy_i)},i.fn.modes.grabParticle=function(e){if(i.interactivity.events.onhover.enable&&"mousemove"==i.interactivity.status){var a=e.x-i.interactivity.mouse.pos_x,t=e.y-i.interactivity.mouse.pos_y,s=Math.sqrt(a*a+t*t);if(s<=i.interactivity.modes.grab.distance){var n=i.interactivity.modes.grab.line_linked.opacity-s/(1/i.interactivity.modes.grab.line_linked.opacity)/i.interactivity.modes.grab.distance;if(n>0){var r=i.particles.line_linked.color_rgb_line;i.canvas.ctx.strokeStyle="rgba("+r.r+","+r.g+","+r.b+","+n+")",i.canvas.ctx.lineWidth=i.particles.line_linked.width,i.canvas.ctx.beginPath(),i.canvas.ctx.moveTo(e.x,e.y),i.canvas.ctx.lineTo(i.interactivity.mouse.pos_x,i.interactivity.mouse.pos_y),i.canvas.ctx.stroke(),i.canvas.ctx.closePath()}}}},i.fn.vendors.eventsListeners=function(){"window"==i.interactivity.detect_on?i.interactivity.el=window:i.interactivity.el=i.canvas.el,(i.interactivity.events.onhover.enable||i.interactivity.events.onclick.enable)&&(i.interactivity.el.addEventListener("mousemove",function(e){if(i.interactivity.el==window)var a=e.clientX,t=e.clientY;else var a=e.offsetX||e.clientX,t=e.offsetY||e.clientY;i.interactivity.mouse.pos_x=a,i.interactivity.mouse.pos_y=t,i.tmp.retina&&(i.interactivity.mouse.pos_x*=i.canvas.pxratio,i.interactivity.mouse.pos_y*=i.canvas.pxratio),i.interactivity.status="mousemove"}),i.interactivity.el.addEventListener("mouseleave",function(e){i.interactivity.mouse.pos_x=null,i.interactivity.mouse.pos_y=null,i.interactivity.status="mouseleave"})),i.interactivity.events.onclick.enable&&i.interactivity.el.addEventListener("click",function(){if(i.interactivity.mouse.click_pos_x=i.interactivity.mouse.pos_x,i.interactivity.mouse.click_pos_y=i.interactivity.mouse.pos_y,i.interactivity.mouse.click_time=(new Date).getTime(),i.interactivity.events.onclick.enable)switch(i.interactivity.events.onclick.mode){case"push":i.particles.move.enable?i.fn.modes.pushParticles(i.interactivity.modes.push.particles_nb,i.interactivity.mouse):1==i.interactivity.modes.push.particles_nb?i.fn.modes.pushParticles(i.interactivity.modes.push.particles_nb,i.interactivity.mouse):i.interactivity.modes.push.particles_nb>1&&i.fn.modes.pushParticles(i.interactivity.modes.push.particles_nb);break;case"remove":i.fn.modes.removeParticles(i.interactivity.modes.remove.particles_nb);break;case"bubble":i.tmp.bubble_clicking=!0;break;case"repulse":i.tmp.repulse_clicking=!0,i.tmp.repulse_count=0,i.tmp.repulse_finish=!1,setTimeout(function(){i.tmp.repulse_clicking=!1},1e3*i.interactivity.modes.repulse.duration)}})},i.fn.vendors.densityAutoParticles=function(){if(i.particles.number.density.enable){var e=i.canvas.el.width*i.canvas.el.height/1e3;i.tmp.retina&&(e/=2*i.canvas.pxratio);var a=e*i.particles.number.value/i.particles.number.density.value_area,t=i.particles.array.length-a;0>t?i.fn.modes.pushParticles(Math.abs(t)):i.fn.modes.removeParticles(t)}},i.fn.vendors.checkOverlap=function(e,a){for(var t=0;tv;v++)e.lineTo(i,0),e.translate(i,0),e.rotate(l);e.fill(),e.restore()},i.fn.vendors.exportImg=function(){window.open(i.canvas.el.toDataURL("image/png"),"_blank")},i.fn.vendors.loadImg=function(e){if(i.tmp.img_error=void 0,""!=i.particles.shape.image.src)if("svg"==e){var a=new XMLHttpRequest;a.open("GET",i.particles.shape.image.src),a.onreadystatechange=function(e){4==a.readyState&&(200==a.status?(i.tmp.source_svg=e.currentTarget.response,i.fn.vendors.checkBeforeDraw()):(console.log("Error pJS - Image not found"),i.tmp.img_error=!0))},a.send()}else{var t=new Image;t.addEventListener("load",function(){i.tmp.img_obj=t,i.fn.vendors.checkBeforeDraw()}),t.src=i.particles.shape.image.src}else console.log("Error pJS - No image.src"),i.tmp.img_error=!0},i.fn.vendors.draw=function(){"image"==i.particles.shape.type?"svg"==i.tmp.img_type?i.tmp.count_svg>=i.particles.number.value?(i.fn.particlesDraw(),i.particles.move.enable?i.fn.drawAnimFrame=requestAnimFrame(i.fn.vendors.draw):cancelRequestAnimFrame(i.fn.drawAnimFrame)):i.tmp.img_error||(i.fn.drawAnimFrame=requestAnimFrame(i.fn.vendors.draw)):void 0!=i.tmp.img_obj?(i.fn.particlesDraw(),i.particles.move.enable?i.fn.drawAnimFrame=requestAnimFrame(i.fn.vendors.draw):cancelRequestAnimFrame(i.fn.drawAnimFrame)):i.tmp.img_error||(i.fn.drawAnimFrame=requestAnimFrame(i.fn.vendors.draw)):(i.fn.particlesDraw(),i.particles.move.enable?i.fn.drawAnimFrame=requestAnimFrame(i.fn.vendors.draw):cancelRequestAnimFrame(i.fn.drawAnimFrame))},i.fn.vendors.checkBeforeDraw=function(){"image"==i.particles.shape.type?"svg"==i.tmp.img_type&&void 0==i.tmp.source_svg?i.tmp.checkAnimFrame=requestAnimFrame(check):(cancelRequestAnimFrame(i.tmp.checkAnimFrame),i.tmp.img_error||(i.fn.vendors.init(),i.fn.vendors.draw())):(i.fn.vendors.init(),i.fn.vendors.draw())},i.fn.vendors.init=function(){i.fn.retinaInit(),i.fn.canvasInit(),i.fn.canvasSize(),i.fn.canvasPaint(),i.fn.particlesCreate(),i.fn.vendors.densityAutoParticles(),i.particles.line_linked.color_rgb_line=hexToRgb(i.particles.line_linked.color)},i.fn.vendors.start=function(){isInArray("image",i.particles.shape.type)?(i.tmp.img_type=i.particles.shape.image.src.substr(i.particles.shape.image.src.length-3),i.fn.vendors.loadImg(i.tmp.img_type)):i.fn.vendors.checkBeforeDraw()},i.fn.vendors.eventsListeners(),i.fn.vendors.start()};Object.deepExtend=function(e,a){for(var t in a)a[t]&&a[t].constructor&&a[t].constructor===Object?(e[t]=e[t]||{},arguments.callee(e[t],a[t])):e[t]=a[t];return e},window.requestAnimFrame=function(){return window.requestAnimationFrame||window.webkitRequestAnimationFrame||window.mozRequestAnimationFrame||window.oRequestAnimationFrame||window.msRequestAnimationFrame||function(e){window.setTimeout(e,1e3/60)}}(),window.cancelRequestAnimFrame=function(){return window.cancelAnimationFrame||window.webkitCancelRequestAnimationFrame||window.mozCancelRequestAnimationFrame||window.oCancelRequestAnimationFrame||window.msCancelRequestAnimationFrame||clearTimeout}(),window.pJSDom=[],window.particlesJS=function(e,a){"string"!=typeof e&&(a=e,e="particles-js"),e||(e="particles-js");var t=document.getElementById(e),i="particles-js-canvas-el",s=t.getElementsByClassName(i);if(s.length)for(;s.length>0;)t.removeChild(s[0]);var n=document.createElement("canvas");n.className=i,n.style.width="100%",n.style.height="100%";var r=document.getElementById(e).appendChild(n);null!=r&&pJSDom.push(new pJS(e,a))},window.particlesJS.load=function(e,a,t){var i=new XMLHttpRequest;i.open("GET",a),i.onreadystatechange=function(a){if(4==i.readyState)if(200==i.status){var s=JSON.parse(a.currentTarget.response);window.particlesJS(e,s),t&&t()}else console.log("Error pJS - XMLHttpRequest status: "+i.status),console.log("Error pJS - File config not found")},i.send()};
\ No newline at end of file
diff --git a/Pages/earthPics/script.js b/Pages/earthPics/script.js
new file mode 100644
index 0000000..6107459
--- /dev/null
+++ b/Pages/earthPics/script.js
@@ -0,0 +1,386 @@
+
+
+// PARTICLES BACKGROUND
+particlesJS("bg-ast", {
+ "particles": {
+ "number": {
+ "value": 650,
+ "density": {
+ "enable": true,
+ "value_area": 789.1476416322727
+ }
+ },
+ "color": {
+ "value": "#ffffff"
+ },
+ "shape": {
+ "type": "circle",
+ "stroke": {
+ "width": 0,
+ "color": "#000000"
+ },
+ "polygon": {
+ "nb_sides": 5
+ },
+ "image": {
+ "src": "img/github.svg",
+ "width": 100,
+ "height": 100
+ }
+ },
+ "opacity": {
+ "value": 0.48927153781200905,
+ "random": false,
+ "anim": {
+ "enable": true,
+ "speed": 1.5,
+ "opacity_min": 0,
+ "sync": false
+ }
+ },
+ "size": {
+ "value": 3,
+ "random": true,
+ "anim": {
+ "enable": true,
+ "speed": 2,
+ "size_min": 0,
+ "sync": false
+ }
+ },
+ "line_linked": {
+ "enable": false,
+ "distance": 150,
+ "color": "#ffffff",
+ "opacity": 0.4,
+ "width": 1
+ },
+ "move": {
+ "enable": true,
+ "speed": 0.2,
+ "direction": "none",
+ "random": true,
+ "straight": false,
+ "out_mode": "out",
+ "bounce": false,
+ "attract": {
+ "enable": false,
+ "rotateX": 600,
+ "rotateY": 1200
+ }
+ }
+ },
+ "interactivity": {
+ "detect_on": "canvas",
+ "events": {
+ "onhover": {
+ "enable": true,
+ "mode": "bubble"
+ },
+ "onclick": {
+ "enable": true,
+ "mode": "push"
+ },
+ "resize": true
+ },
+ "modes": {
+ "grab": {
+ "distance": 400,
+ "line_linked": {
+ "opacity": 1
+ }
+ },
+ "bubble": {
+ "distance": 83.91608391608392,
+ "size": 1,
+ "duration": 3,
+ "opacity": 1,
+ "speed": 3
+ },
+ "repulse": {
+ "distance": 200,
+ "duration": 0.4
+ },
+ "push": {
+ "particles_nb": 4
+ },
+ "remove": {
+ "particles_nb": 2
+ }
+ }
+ },
+ "retina_detect": true
+});
+// PARTICLES BACKGROUND
+particlesJS("bg-ast", {
+ "particles": {
+ "number": {
+ "value": 650,
+ "density": {
+ "enable": true,
+ "value_area": 789.1476416322727
+ }
+ },
+ "color": {
+ "value": "#ffffff"
+ },
+ "shape": {
+ "type": "circle",
+ "stroke": {
+ "width": 0,
+ "color": "#000000"
+ },
+ "polygon": {
+ "nb_sides": 5
+ },
+ "image": {
+ "src": "img/github.svg",
+ "width": 100,
+ "height": 100
+ }
+ },
+ "opacity": {
+ "value": 0.48927153781200905,
+ "random": false,
+ "anim": {
+ "enable": true,
+ "speed": 1.5,
+ "opacity_min": 0,
+ "sync": false
+ }
+ },
+ "size": {
+ "value": 3,
+ "random": true,
+ "anim": {
+ "enable": true,
+ "speed": 2,
+ "size_min": 0,
+ "sync": false
+ }
+ },
+ "line_linked": {
+ "enable": false,
+ "distance": 150,
+ "color": "#ffffff",
+ "opacity": 0.4,
+ "width": 1
+ },
+ "move": {
+ "enable": true,
+ "speed": 0.2,
+ "direction": "none",
+ "random": true,
+ "straight": false,
+ "out_mode": "out",
+ "bounce": false,
+ "attract": {
+ "enable": false,
+ "rotateX": 600,
+ "rotateY": 1200
+ }
+ }
+ },
+ "interactivity": {
+ "detect_on": "canvas",
+ "events": {
+ "onhover": {
+ "enable": true,
+ "mode": "bubble"
+ },
+ "onclick": {
+ "enable": true,
+ "mode": "push"
+ },
+ "resize": true
+ },
+ "modes": {
+ "grab": {
+ "distance": 400,
+ "line_linked": {
+ "opacity": 1
+ }
+ },
+ "bubble": {
+ "distance": 83.91608391608392,
+ "size": 1,
+ "duration": 3,
+ "opacity": 1,
+ "speed": 3
+ },
+ "repulse": {
+ "distance": 200,
+ "duration": 0.4
+ },
+ "push": {
+ "particles_nb": 4
+ },
+ "remove": {
+ "particles_nb": 2
+ }
+ }
+ },
+ "retina_detect": true
+});
+
+// Rest of the logic
+// Function to fetch NASA EPIC images for a given latitude and longitude
+// Function to fetch NASA EPIC images for today_minus_3's date and given latitude and longitude
+function fetchEPICImages(latitude, longitude) {
+ // Get today_minus_3's date in YYYY-MM-DD format
+ // Get today_minus_3's date
+
+ // if (min.lat > max.lat || (min.lat === max.lat && min.lon > max.lon))
+
+ let today_minus_3 = new Date();
+
+// Subtract 3 days
+today_minus_3.setDate(today_minus_3.getDate() - 3);
+
+// Format the date as ISO string
+today_minus_3 = today_minus_3.toISOString().split('T')[0];
+
+
+ // Form the request URL for EPIC images for today_minus_3's date and given location
+
+ // Fetch EPIC images for today_minus_3's date
+ fetch(`https://api.nasa.gov/EPIC/api/natural/date/${today_minus_3}?api_key=eISHzmGbQk7EMWv9NTlVtvzZVmeLKPUoL3uKMSPJ`)
+ .then(response => {
+ return response.json(); // Convert response to JSON
+ })
+ .then(images => {
+ // Calculate distances of all images from the specified latitude and longitude
+ const imageObjects = images.map(image => {
+ return {
+ centroid_coordinates: {
+ lat: image.centroid_coordinates.lat,
+ lon: image.centroid_coordinates.lon
+ },
+ caption: image.caption,
+ imageUrl: image.image,
+ dscovr_j2000_position: image.dscovr_j2000_position,
+ lunar_j2000_position: image.lunar_j2000_position,
+ sun_j2000_position: image.sun_j2000_position,
+ attitude_quaternions: image.attitude_quaternions
+ };
+ });
+
+
+ let min = { lat: latitude, lon: longitude };
+ let minDifference = Infinity;
+ let nearestCoordinate = null;
+
+ imageObjects.forEach(coord => {
+ // Calculate the difference in latitude and longitude
+ let latDiff = Math.abs(coord.centroid_coordinates.lat - min.lat);
+ let lonDiff = Math.abs(coord.centroid_coordinates.lon - min.lon);
+
+ // Calculate the Euclidean distance
+ let distance = Math.sqrt(latDiff * latDiff + lonDiff * lonDiff);
+ // Check if this distance is smaller than the current minimum difference
+ if (distance < minDifference) {
+ minDifference = distance;
+ nearestCoordinate = coord;
+ }
+ });
+
+ console.log(nearestCoordinate.attitude_quaternions)
+ const data=()=>{
+ return `
+
`
+ }
+ document.querySelector(".flex_container").innerHTML=data()
+// Get today_minus_3's date
+today_minus_3 = new Date();
+
+// Subtract 3 days
+today_minus_3.setDate(today_minus_3.getDate() - 3);
+
+// Format the date as "YYYY/MM/DD"
+today_minus_3 = today_minus_3.toISOString().split('T')[0].replace(/-/g, '/');
+
+document.querySelector(".image").innerHTML=`Earth Polychromatic Imaging Camera(EPIC)
+ +
+ The Earth Polychromatic Imaging Camera (EPIC) is a specialized camera aboard the Deep Space Climate Observatory (DSCOVR) satellite. It captures stunning images of Earth in multiple wavelengths of light, allowing scientists to monitor phenomena such as ozone levels, cloud properties, aerosol particles, and vegetation health. EPIC's unique vantage point from deep space provides a global perspective, enabling continuous monitoring of Earth's dynamic atmospheric and surface conditions. Its imagery not only aids in scientific research but also offers breathtaking views of our planet, inspiring awe and appreciation for the beauty and fragility of our home in the cosmos.
+
+
+
+
+
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/Pages/earthPics/particles.min.js b/Pages/earthPics/particles.min.js
new file mode 100644
index 0000000..b3d46d1
--- /dev/null
+++ b/Pages/earthPics/particles.min.js
@@ -0,0 +1,9 @@
+/* -----------------------------------------------
+/* Author : Vincent Garreau - vincentgarreau.com
+/* MIT license: http://opensource.org/licenses/MIT
+/* Demo / Generator : vincentgarreau.com/particles.js
+/* GitHub : github.com/VincentGarreau/particles.js
+/* How to use? : Check the GitHub README
+/* v2.0.0
+/* ----------------------------------------------- */
+function hexToRgb(e){var a=/^#?([a-f\d])([a-f\d])([a-f\d])$/i;e=e.replace(a,function(e,a,t,i){return a+a+t+t+i+i});var t=/^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(e);return t?{r:parseInt(t[1],16),g:parseInt(t[2],16),b:parseInt(t[3],16)}:null}function clamp(e,a,t){return Math.min(Math.max(e,a),t)}function isInArray(e,a){return a.indexOf(e)>-1}var pJS=function(e,a){var t=document.querySelector("#"+e+" > .particles-js-canvas-el");this.pJS={canvas:{el:t,w:t.offsetWidth,h:t.offsetHeight},particles:{number:{value:400,density:{enable:!0,value_area:800}},color:{value:"#fff"},shape:{type:"circle",stroke:{width:0,color:"#ff0000"},polygon:{nb_sides:5},image:{src:"",width:100,height:100}},opacity:{value:1,random:!1,anim:{enable:!1,speed:2,opacity_min:0,sync:!1}},size:{value:20,random:!1,anim:{enable:!1,speed:20,size_min:0,sync:!1}},line_linked:{enable:!0,distance:100,color:"#fff",opacity:1,width:1},move:{enable:!0,speed:2,direction:"none",random:!1,straight:!1,out_mode:"out",bounce:!1,attract:{enable:!1,rotateX:3e3,rotateY:3e3}},array:[]},interactivity:{detect_on:"canvas",events:{onhover:{enable:!0,mode:"grab"},onclick:{enable:!0,mode:"push"},resize:!0},modes:{grab:{distance:100,line_linked:{opacity:1}},bubble:{distance:200,size:80,duration:.4},repulse:{distance:200,duration:.4},push:{particles_nb:4},remove:{particles_nb:2}},mouse:{}},retina_detect:!1,fn:{interact:{},modes:{},vendors:{}},tmp:{}};var i=this.pJS;a&&Object.deepExtend(i,a),i.tmp.obj={size_value:i.particles.size.value,size_anim_speed:i.particles.size.anim.speed,move_speed:i.particles.move.speed,line_linked_distance:i.particles.line_linked.distance,line_linked_width:i.particles.line_linked.width,mode_grab_distance:i.interactivity.modes.grab.distance,mode_bubble_distance:i.interactivity.modes.bubble.distance,mode_bubble_size:i.interactivity.modes.bubble.size,mode_repulse_distance:i.interactivity.modes.repulse.distance},i.fn.retinaInit=function(){i.retina_detect&&window.devicePixelRatio>1?(i.canvas.pxratio=window.devicePixelRatio,i.tmp.retina=!0):(i.canvas.pxratio=1,i.tmp.retina=!1),i.canvas.w=i.canvas.el.offsetWidth*i.canvas.pxratio,i.canvas.h=i.canvas.el.offsetHeight*i.canvas.pxratio,i.particles.size.value=i.tmp.obj.size_value*i.canvas.pxratio,i.particles.size.anim.speed=i.tmp.obj.size_anim_speed*i.canvas.pxratio,i.particles.move.speed=i.tmp.obj.move_speed*i.canvas.pxratio,i.particles.line_linked.distance=i.tmp.obj.line_linked_distance*i.canvas.pxratio,i.interactivity.modes.grab.distance=i.tmp.obj.mode_grab_distance*i.canvas.pxratio,i.interactivity.modes.bubble.distance=i.tmp.obj.mode_bubble_distance*i.canvas.pxratio,i.particles.line_linked.width=i.tmp.obj.line_linked_width*i.canvas.pxratio,i.interactivity.modes.bubble.size=i.tmp.obj.mode_bubble_size*i.canvas.pxratio,i.interactivity.modes.repulse.distance=i.tmp.obj.mode_repulse_distance*i.canvas.pxratio},i.fn.canvasInit=function(){i.canvas.ctx=i.canvas.el.getContext("2d")},i.fn.canvasSize=function(){i.canvas.el.width=i.canvas.w,i.canvas.el.height=i.canvas.h,i&&i.interactivity.events.resize&&window.addEventListener("resize",function(){i.canvas.w=i.canvas.el.offsetWidth,i.canvas.h=i.canvas.el.offsetHeight,i.tmp.retina&&(i.canvas.w*=i.canvas.pxratio,i.canvas.h*=i.canvas.pxratio),i.canvas.el.width=i.canvas.w,i.canvas.el.height=i.canvas.h,i.particles.move.enable||(i.fn.particlesEmpty(),i.fn.particlesCreate(),i.fn.particlesDraw(),i.fn.vendors.densityAutoParticles()),i.fn.vendors.densityAutoParticles()})},i.fn.canvasPaint=function(){i.canvas.ctx.fillRect(0,0,i.canvas.w,i.canvas.h)},i.fn.canvasClear=function(){i.canvas.ctx.clearRect(0,0,i.canvas.w,i.canvas.h)},i.fn.particle=function(e,a,t){if(this.radius=(i.particles.size.random?Math.random():1)*i.particles.size.value,i.particles.size.anim.enable&&(this.size_status=!1,this.vs=i.particles.size.anim.speed/100,i.particles.size.anim.sync||(this.vs=this.vs*Math.random())),this.x=t?t.x:Math.random()*i.canvas.w,this.y=t?t.y:Math.random()*i.canvas.h,this.x>i.canvas.w-2*this.radius?this.x=this.x-this.radius:this.x<2*this.radius&&(this.x=this.x+this.radius),this.y>i.canvas.h-2*this.radius?this.y=this.y-this.radius:this.y<2*this.radius&&(this.y=this.y+this.radius),i.particles.move.bounce&&i.fn.vendors.checkOverlap(this,t),this.color={},"object"==typeof e.value)if(e.value instanceof Array){var s=e.value[Math.floor(Math.random()*i.particles.color.value.length)];this.color.rgb=hexToRgb(s)}else void 0!=e.value.r&&void 0!=e.value.g&&void 0!=e.value.b&&(this.color.rgb={r:e.value.r,g:e.value.g,b:e.value.b}),void 0!=e.value.h&&void 0!=e.value.s&&void 0!=e.value.l&&(this.color.hsl={h:e.value.h,s:e.value.s,l:e.value.l});else"random"==e.value?this.color.rgb={r:Math.floor(256*Math.random())+0,g:Math.floor(256*Math.random())+0,b:Math.floor(256*Math.random())+0}:"string"==typeof e.value&&(this.color=e,this.color.rgb=hexToRgb(this.color.value));this.opacity=(i.particles.opacity.random?Math.random():1)*i.particles.opacity.value,i.particles.opacity.anim.enable&&(this.opacity_status=!1,this.vo=i.particles.opacity.anim.speed/100,i.particles.opacity.anim.sync||(this.vo=this.vo*Math.random()));var n={};switch(i.particles.move.direction){case"top":n={x:0,y:-1};break;case"top-right":n={x:.5,y:-.5};break;case"right":n={x:1,y:-0};break;case"bottom-right":n={x:.5,y:.5};break;case"bottom":n={x:0,y:1};break;case"bottom-left":n={x:-.5,y:1};break;case"left":n={x:-1,y:0};break;case"top-left":n={x:-.5,y:-.5};break;default:n={x:0,y:0}}i.particles.move.straight?(this.vx=n.x,this.vy=n.y,i.particles.move.random&&(this.vx=this.vx*Math.random(),this.vy=this.vy*Math.random())):(this.vx=n.x+Math.random()-.5,this.vy=n.y+Math.random()-.5),this.vx_i=this.vx,this.vy_i=this.vy;var r=i.particles.shape.type;if("object"==typeof r){if(r instanceof Array){var c=r[Math.floor(Math.random()*r.length)];this.shape=c}}else this.shape=r;if("image"==this.shape){var o=i.particles.shape;this.img={src:o.image.src,ratio:o.image.width/o.image.height},this.img.ratio||(this.img.ratio=1),"svg"==i.tmp.img_type&&void 0!=i.tmp.source_svg&&(i.fn.vendors.createSvgImg(this),i.tmp.pushing&&(this.img.loaded=!1))}},i.fn.particle.prototype.draw=function(){function e(){i.canvas.ctx.drawImage(r,a.x-t,a.y-t,2*t,2*t/a.img.ratio)}var a=this;if(void 0!=a.radius_bubble)var t=a.radius_bubble;else var t=a.radius;if(void 0!=a.opacity_bubble)var s=a.opacity_bubble;else var s=a.opacity;if(a.color.rgb)var n="rgba("+a.color.rgb.r+","+a.color.rgb.g+","+a.color.rgb.b+","+s+")";else var n="hsla("+a.color.hsl.h+","+a.color.hsl.s+"%,"+a.color.hsl.l+"%,"+s+")";switch(i.canvas.ctx.fillStyle=n,i.canvas.ctx.beginPath(),a.shape){case"circle":i.canvas.ctx.arc(a.x,a.y,t,0,2*Math.PI,!1);break;case"edge":i.canvas.ctx.rect(a.x-t,a.y-t,2*t,2*t);break;case"triangle":i.fn.vendors.drawShape(i.canvas.ctx,a.x-t,a.y+t/1.66,2*t,3,2);break;case"polygon":i.fn.vendors.drawShape(i.canvas.ctx,a.x-t/(i.particles.shape.polygon.nb_sides/3.5),a.y-t/.76,2.66*t/(i.particles.shape.polygon.nb_sides/3),i.particles.shape.polygon.nb_sides,1);break;case"star":i.fn.vendors.drawShape(i.canvas.ctx,a.x-2*t/(i.particles.shape.polygon.nb_sides/4),a.y-t/1.52,2*t*2.66/(i.particles.shape.polygon.nb_sides/3),i.particles.shape.polygon.nb_sides,2);break;case"image":if("svg"==i.tmp.img_type)var r=a.img.obj;else var r=i.tmp.img_obj;r&&e()}i.canvas.ctx.closePath(),i.particles.shape.stroke.width>0&&(i.canvas.ctx.strokeStyle=i.particles.shape.stroke.color,i.canvas.ctx.lineWidth=i.particles.shape.stroke.width,i.canvas.ctx.stroke()),i.canvas.ctx.fill()},i.fn.particlesCreate=function(){for(var e=0;e
+
+
+ This image was taken by NASA's EPIC camera onboard the NOAA DSCOVR spacecraft
+
+
+
+
+
+
+
+
+
+ DSCOVR J2000
+
+ X:${nearestCoordinate.dscovr_j2000_position.x}
+ Y:${nearestCoordinate.dscovr_j2000_position.y}
+
+ Z:${nearestCoordinate.dscovr_j2000_position.z}
+
+
+ LUNAR J2000
+
+ X:${nearestCoordinate.lunar_j2000_position.x}
+ Y:${nearestCoordinate.lunar_j2000_position.y}
+
+ Z:${nearestCoordinate.lunar_j2000_position.z}
+
+
+
+
+ SOLAR J200
+
+ X:${nearestCoordinate.sun_j2000_position.x}
+ Y:${nearestCoordinate.sun_j2000_position.y}
+
+ Z:${nearestCoordinate.sun_j2000_position.z}
+
+
+ ATTITUDE QUATERNIONS +
+
+ Q0:${nearestCoordinate.attitude_quaternions.q0}
+ Q1:${nearestCoordinate.attitude_quaternions.q1}
+
+ Q2:${nearestCoordinate.attitude_quaternions.q2}
+ Q3:${nearestCoordinate.attitude_quaternions.q3}
+
+
`
+ })
+
+}
+function fetchImg(){
+ if(document.querySelector('#lat').value==""|| document.querySelector('#lon').value==""){
+ alert("Pls enter both values or select get location")
+ }
+ else{
+fetchEPICImages(document.querySelector('#lat').value,document.querySelector('#lon').value);
+}
+}
+function fetchImg_auto() {
+ // Get user's current location
+ if (navigator.geolocation) {
+ navigator.geolocation.getCurrentPosition(successCallback, errorCallback);
+ } else {
+ console.error("Geolocation is not supported by this browser.");
+ }
+}
+
+// Success callback function for geolocation
+function successCallback(position) {
+ const latitude = position.coords.latitude;
+ const longitude = position.coords.longitude;
+ fetchEPICImages(latitude, longitude);
+}
+
+// Error callback function for geolocation
+function errorCallback(error) {
+ console.error("Error getting user's location:", error.message);
+}
+
diff --git a/Pages/earthPics/style.css b/Pages/earthPics/style.css
new file mode 100644
index 0000000..831be34
--- /dev/null
+++ b/Pages/earthPics/style.css
@@ -0,0 +1,206 @@
+* {
+ box-sizing: border-box;
+ margin: 0;
+ padding: 0;
+}
+body {
+ background-image: linear-gradient(to left, rgb(10, 0, 73), rgb(0, 0, 0));
+ overflow-x: hidden;
+ color: rgb(255, 255, 255);
+ font-family: sans-serif;
+}
+
+body::-webkit-scrollbar {
+ display: none;
+}
+
+
+/* NAVBAR STYLING */
+
+.navbar_background {
+ background-image: linear-gradient(to left, rgb(10, 0, 73), rgb(0, 0, 0));
+}
+
+#bg-ast {
+ position: fixed;
+ top: 0;
+ left: 0;
+ bottom: 0;
+ right: 0;
+ z-index: -1;
+}
+
+/* HERO SECTION */
+
+.container {
+ width: 75%;
+ position: relative;
+ top: 70px;
+ padding: 10px;
+ text-align: center;
+background: rgba( 255, 255, 255, 0.15 );
+box-shadow: 0 8px 32px 0 rgba( 31, 38, 135, 0.37 );
+backdrop-filter: blur( 2.5px );
+-webkit-backdrop-filter: blur( 2.5px );
+border-radius: 10px;
+border: 1px solid rgba( 255, 255, 255, 0.18 );
+}
+
+.info {
+ font-size: 1.1rem;
+ line-height: 1.6;
+ color: rgba(255, 255, 255, 0.8);
+ margin-top: 20px;
+}
+/* Inputs */
+
+
+.input-field {
+ padding: 20px 0px;
+}
+
+#input-heading {
+ font-weight: bold;
+ font-size: 3rem;
+ background: -webkit-linear-gradient(top, rgb(228, 214, 251), rgb(132, 0, 255)) text;
+ -webkit-text-fill-color: transparent;
+}
+
+.num-lat-input,.num-lon-input {
+ margin: 8px 0px;
+}
+
+.num-lon-input{
+ position: relative;
+ left: 8px;
+}
+.num-lat-input>label,.num-lon-input>label{
+ color: rgba(255, 255, 255, 0.75);
+ font-weight: 600;
+ font-size: 1rem;
+}
+
+.date-inputs {
+ padding: 4px 8px;
+ border-radius: 2px;
+ border: none;
+ outline: none;
+ background-color: #e4d6fb;
+ transition: 0.1s ease-in-out;
+}
+
+.date-inputs:hover {
+ box-shadow: 2px 2px 1px 1px rgb(187, 18, 187);
+ cursor: pointer;
+}
+
+#submit-btn,#loc_btn{
+ position: relative;
+ left: -30px;
+ padding: 6px 12px;
+ outline: none;
+ border: none;
+ background-color: #0d6efd;
+ border-radius: 6px;
+ color: white;
+ font-weight: bold;
+ letter-spacing: 1px;
+ transition: 0.1s ease-in-out;
+ margin: 10px 5px;
+}
+
+#dates-submit-btn:hover,#loc_btn:hover{
+ background-color: #0b5ed7;
+}
+
+
+.note {
+ margin: 0px auto;
+ padding: 4px;
+ width: fit-content;
+ display: flex;
+}
+
+#exclmation-icon {
+ margin: 0px 4px;
+}
+
+#fetch_img{
+ width: 400px;
+ height: 400px;
+ border-radius: 20px;
+ position: relative;
+ top: 20px;
+}
+
+.flex_container{
+ display: flex;
+ justify-content: center;
+ align-items: center;
+}
+
+.info{
+ display: flex;
+ flex-direction: column;
+}
+.coord{
+ display: flex;
+ flex-direction: row;
+ justify-content: space-evenly;
+}
+
+
+.sat_info{
+
+ font-size: 2rem;
+ background: -webkit-linear-gradient(top, rgb(228, 214, 251), rgb(106, 2, 204)) text;
+ -webkit-text-fill-color: transparent;
+}
+.text{
+
+ border-radius: 20px;
+}
+.satellite{
+ border-radius: 20px;
+ margin: 10px;
+ background-color: purple;
+ width: 310px;
+}
+
+.satellite{
+ background-color: #ffffff;
+ color: black;
+ border-radius: 10px;
+ width: fit-content;
+ padding: 10px;
+ width: 100%;
+ filter: drop-shadow(0 5px 10px 0 #ffffff);
+ z-index: 0;
+ overflow: hidden;
+ transition: 0.4s ease-in;
+ position: relative;
+}
+
+.satellite::before {
+ content: "";
+ position: absolute;
+ z-index: -1;
+ top: -15px;
+ right: -15px;
+ background: #7952b3;
+ height: 220px;
+ width: 25px;
+ border-radius: 32px;
+ transform: scale(1);
+ transform-origin: 50% 50%;
+ transition: transform 0.25s ease-out;
+}
+
+.satellite:hover::before {
+ transition-delay: 0.2s;
+ transform: scale(40);
+}
+
+.satellite:hover{
+ color: #ffffff;
+}
\ No newline at end of file
diff --git a/README.md b/README.md
index b8887c0..b7382f8 100644
--- a/README.md
+++ b/README.md
@@ -22,32 +22,38 @@
git clone https://github.com/
+
+
+
+