<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>EveryNasa</title> <link rel="icon" href="/static/image/icons/favicon.png"> <link rel="preconnect" href="https://fonts.googleapis.com"> <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin> <link href="https://fonts.googleapis.com/css2?family=Roboto&display=swap" rel="stylesheet"> <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.2.1/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-iYQeCzEYFbKjA/T2uDLTpkwGzCiq6soy8tYaI1GyVh/UjpbCx/TYkiZhlZB6+fzT" crossorigin="anonymous"> <link rel="stylesheet" href="/static/style/gallery.css" type="text/css"> </head> <body style="background: #131313; color: white;"> <nav class="navbar navbar-expand-lg bg-dark navbar-dark"> <div class="container-fluid"> <a class="navbar-brand" href="/"> <img src="/static/image/icons/favicon.png" width="45" alt="EveryNasa"> </a> <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNavDropdown" aria-controls="navbarNavDropdown" aria-expanded="false" aria-label="Toggle navigation"> <span class="navbar-toggler-icon"></span> </button> <div class="collapse navbar-collapse" id="navbarNavDropdown"> <ul class="navbar-nav"> <li class="nav-item"> <a class="nav-link active" aria-current="page" href="/">Gallery</a> </li> <li class="nav-item"> <a class="nav-link" href="/favorite">Favorite</a> </li> <li class="nav-item"> <a class="nav-link" href="/settings">Settings</a> </li> <li class="nav-item"> <a class="nav-link" href="/about">About</a> </li> </ul> </div> </div> </nav> <div class="modal fade" id="WallpaperModal" aria-hidden="true" aria-labelledby="WallpaperModal" tabindex="-1" style="color: black;"> <div class="modal-dialog modal-dialog-centered"> <div class="modal-content"> <div class="modal-header"> <h5 class="modal-title" id="WallpaperModale"> <span class="d-inline-block text-truncate w-modal-title" style="max-width: 429px;"></span> </h5> <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button> </div> <div class="modal-body"></div> <div class="modal-footer"> </div> </div> </div> </div> <div class="container"> <header class="header-row"></header> </div> <div class="preloader"> <lottie-player src="https://assets4.lottiefiles.com/datafiles/a3YH0ragZcwfKHS/data.json" background="transparent" speed="1" style="width: 600px; height: 600px;" loop autoplay></lottie-player> </div> <div class="toast-container position-fixed bottom-0 end-0 p-3"> <div id="liveToast" class="toast" role="alert" aria-live="assertive" aria-atomic="true"> <div class="toast-header"> <img src="/static/image/icons/favicon.png" class="rounded me-2" alt="EveryNasa" width="30"> <strong class="me-auto" style="color: black;">EveryNasa</strong> <button type="button" class="btn-close" data-bs-dismiss="toast" aria-label="Close"></button> </div> <div class="toast-body" style="color: black;"></div> </div> </div> <script src="https://code.jquery.com/jquery-3.6.1.min.js"></script> <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.2.1/dist/js/bootstrap.min.js" integrity="sha384-7VPbUDkoPSGFnVtYi0QogXtr74QeVeeIs99Qfg5YCF+TidwNdjvaKZX19NZ/e6oz" crossorigin="anonymous"></script> <script src="https://unpkg.com/@lottiefiles/lottie-player@latest/dist/lottie-player.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/bodymovin/5.10.0/lottie.min.js"></script> <script src="/static/scripts/gallery.js" type="application/javascript"></script> <script type="application/javascript"> startDate.setDate(startDate.getUTCDate() - 17); $(document).ready(function() { $.ajax({ url: "https://api.nasa.gov/planetary/apod", type: "GET", data: { api_key: apiKEY, start_date: `${startDate.getUTCFullYear()}-${startDate.getUTCMonth() + 1}-${startDate.getUTCDate()}`, end_date: `${endDate.getUTCFullYear()}-${endDate.getUTCMonth() + 1}-${endDate.getUTCDate()}`, }, success: function(data) { data.reverse(); wallpaperLoad(data); }, }); }); </script> </body> </html>