Improvements to AA V1 Page
This commit is contained in:
Generated
+52
-3
@@ -16,7 +16,8 @@
|
||||
"moment": "^2.30.1",
|
||||
"next": "14.1.0",
|
||||
"react": "^18",
|
||||
"react-dom": "^18"
|
||||
"react-dom": "^18",
|
||||
"react-youtube": "^10.1.0"
|
||||
},
|
||||
"devDependencies": {
|
||||
"autoprefixer": "^10.0.1",
|
||||
@@ -2619,8 +2620,7 @@
|
||||
"node_modules/fast-deep-equal": {
|
||||
"version": "3.1.3",
|
||||
"resolved": "https://registry.npmjs.org/fast-deep-equal/-/fast-deep-equal-3.1.3.tgz",
|
||||
"integrity": "sha512-f3qQ9oQy9j2AhBe/H9VC91wLmKBCCU/gDOnKNAYG5hswO7BLKj09Hc5HYNz9cGI++xlpDCIgDaitVs03ATR84Q==",
|
||||
"dev": true
|
||||
"integrity": "sha512-f3qQ9oQy9j2AhBe/H9VC91wLmKBCCU/gDOnKNAYG5hswO7BLKj09Hc5HYNz9cGI++xlpDCIgDaitVs03ATR84Q=="
|
||||
},
|
||||
"node_modules/fast-glob": {
|
||||
"version": "3.3.2",
|
||||
@@ -3708,6 +3708,11 @@
|
||||
"resolved": "https://registry.npmjs.org/lines-and-columns/-/lines-and-columns-1.2.4.tgz",
|
||||
"integrity": "sha512-7ylylesZQ/PV29jhEDl3Ufjo6ZX7gCqJr5F7PKrqc93v7fzSymt1BpwEU8nAUXs8qzzvqhbjhK5QZg6Mt/HkBg=="
|
||||
},
|
||||
"node_modules/load-script": {
|
||||
"version": "1.0.0",
|
||||
"resolved": "https://registry.npmjs.org/load-script/-/load-script-1.0.0.tgz",
|
||||
"integrity": "sha512-kPEjMFtZvwL9TaZo0uZ2ml+Ye9HUMmPwbYRJ324qF9tqMejwykJ5ggTyvzmrbBeapCAbk98BSbTeovHEEP1uCA=="
|
||||
},
|
||||
"node_modules/locate-path": {
|
||||
"version": "6.0.0",
|
||||
"resolved": "https://registry.npmjs.org/locate-path/-/locate-path-6.0.0.tgz",
|
||||
@@ -4502,6 +4507,22 @@
|
||||
"react-dom": ">=16.6.0"
|
||||
}
|
||||
},
|
||||
"node_modules/react-youtube": {
|
||||
"version": "10.1.0",
|
||||
"resolved": "https://registry.npmjs.org/react-youtube/-/react-youtube-10.1.0.tgz",
|
||||
"integrity": "sha512-ZfGtcVpk0SSZtWCSTYOQKhfx5/1cfyEW1JN/mugGNfAxT3rmVJeMbGpA9+e78yG21ls5nc/5uZJETE3cm3knBg==",
|
||||
"dependencies": {
|
||||
"fast-deep-equal": "3.1.3",
|
||||
"prop-types": "15.8.1",
|
||||
"youtube-player": "5.5.2"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">= 14.x"
|
||||
},
|
||||
"peerDependencies": {
|
||||
"react": ">=0.14.1"
|
||||
}
|
||||
},
|
||||
"node_modules/read-cache": {
|
||||
"version": "1.0.0",
|
||||
"resolved": "https://registry.npmjs.org/read-cache/-/read-cache-1.0.0.tgz",
|
||||
@@ -4821,6 +4842,11 @@
|
||||
"url": "https://github.com/sponsors/isaacs"
|
||||
}
|
||||
},
|
||||
"node_modules/sister": {
|
||||
"version": "3.0.2",
|
||||
"resolved": "https://registry.npmjs.org/sister/-/sister-3.0.2.tgz",
|
||||
"integrity": "sha512-p19rtTs+NksBRKW9qn0UhZ8/TUI9BPw9lmtHny+Y3TinWlOa9jWh9xB0AtPSdmOy49NJJJSSe0Ey4C7h0TrcYA=="
|
||||
},
|
||||
"node_modules/slash": {
|
||||
"version": "3.0.0",
|
||||
"resolved": "https://registry.npmjs.org/slash/-/slash-3.0.0.tgz",
|
||||
@@ -5643,6 +5669,29 @@
|
||||
"funding": {
|
||||
"url": "https://github.com/sponsors/sindresorhus"
|
||||
}
|
||||
},
|
||||
"node_modules/youtube-player": {
|
||||
"version": "5.5.2",
|
||||
"resolved": "https://registry.npmjs.org/youtube-player/-/youtube-player-5.5.2.tgz",
|
||||
"integrity": "sha512-ZGtsemSpXnDky2AUYWgxjaopgB+shFHgXVpiJFeNB5nWEugpW1KWYDaHKuLqh2b67r24GtP6HoSW5swvf0fFIQ==",
|
||||
"dependencies": {
|
||||
"debug": "^2.6.6",
|
||||
"load-script": "^1.0.0",
|
||||
"sister": "^3.0.0"
|
||||
}
|
||||
},
|
||||
"node_modules/youtube-player/node_modules/debug": {
|
||||
"version": "2.6.9",
|
||||
"resolved": "https://registry.npmjs.org/debug/-/debug-2.6.9.tgz",
|
||||
"integrity": "sha512-bC7ElrdJaJnPbAP+1EotYvqZsb3ecl5wi6Bfi6BJTUcNowp6cvspg0jXznRTKDjm/E7AdgFBVeAPVMNcKGsHMA==",
|
||||
"dependencies": {
|
||||
"ms": "2.0.0"
|
||||
}
|
||||
},
|
||||
"node_modules/youtube-player/node_modules/ms": {
|
||||
"version": "2.0.0",
|
||||
"resolved": "https://registry.npmjs.org/ms/-/ms-2.0.0.tgz",
|
||||
"integrity": "sha512-Tpp60P6IUJDTuOq/5Z8cdskzJujfwqfOTkrwIwj7IRISpnkJnT6SyJ4PCPnGMoFjC9ddhal5KVIYtAt97ix05A=="
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -17,7 +17,8 @@
|
||||
"moment": "^2.30.1",
|
||||
"next": "14.1.0",
|
||||
"react": "^18",
|
||||
"react-dom": "^18"
|
||||
"react-dom": "^18",
|
||||
"react-youtube": "^10.1.0"
|
||||
},
|
||||
"homepage": "https://nicholaspease.com",
|
||||
"devDependencies": {
|
||||
|
||||
Binary file not shown.
|
After Width: | Height: | Size: 33 KiB |
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
@@ -6,6 +6,54 @@ import { useState } from "react"
|
||||
import ArrowForwardIosIcon from '@mui/icons-material/ArrowForwardIos';
|
||||
import ArrowBackIosIcon from '@mui/icons-material/ArrowBackIos';
|
||||
import { grey } from '@mui/material/colors'
|
||||
import YouTube from 'react-youtube';
|
||||
|
||||
import { FileList } from "@/components/filelist"
|
||||
|
||||
var fileList = [
|
||||
{
|
||||
"name": "Aviation Assistant V1 - Kelley Presentation",
|
||||
"type": "PDF",
|
||||
"filename": "kelley-presentation.pdf",
|
||||
"filetype": "PDF",
|
||||
"path": "/project_files/aa/files"
|
||||
},
|
||||
{
|
||||
"name": "Aviation Assistant V1 - Science Fair Presentation",
|
||||
"type": "PDF",
|
||||
"filename": "science-fair-slides.pdf",
|
||||
"filetype": "PDF",
|
||||
"path": "/project_files/aa/files"
|
||||
},
|
||||
{
|
||||
"name": "Aviation Assistant V1 - Senior Project Slides",
|
||||
"type": "PDF",
|
||||
"filename": "senior-project-slides.pdf",
|
||||
"filetype": "PDF",
|
||||
"path": "/project_files/aa/files"
|
||||
},
|
||||
{
|
||||
"name": "Maine State Science Fair - Computer Science Category Poster",
|
||||
"type": "PDF",
|
||||
"filename": "comp-2.pdf",
|
||||
"filetype": "PDF",
|
||||
"path": "/project_files/aa/files"
|
||||
},
|
||||
{
|
||||
"name": "Aviation Assistant V1 - Technical Manual (Work in Progress)",
|
||||
"type": "PDF",
|
||||
"filename": "aa_manual.pdf",
|
||||
"filetype": "PDF",
|
||||
"path": "/project_files/aa/files"
|
||||
},
|
||||
{
|
||||
"name": "Aviation Assistant V1 - Software Flow Diagram",
|
||||
"type": "PNG",
|
||||
"filename": "aa_flow.png",
|
||||
"filetype": "PNG",
|
||||
"path": "/project_files/aa/files"
|
||||
}
|
||||
]
|
||||
|
||||
function ImageCarousel() {
|
||||
const [loaded, setLoaded] = useState(false)
|
||||
@@ -60,18 +108,6 @@ function ImageCarousel() {
|
||||
This is a front view of the device showcasing the touch screen and the antenna.
|
||||
</div>
|
||||
</div>
|
||||
<div className={`keen-slider__slide ${loaded ? 'block' : 'hidden'}`}>
|
||||
<p className="flex justify-center">
|
||||
<img src="/project_files/aa/photos/aa_side.png" className="h-[450px]"/>
|
||||
</p>
|
||||
<div className="relative top-[-35px] left-[5px]">
|
||||
<span className="cursor-pointer z-10 font-white" onClick={() => {instanceRef.current?.prev()}}><ArrowBackIosIcon sx={{color: grey[100]}} fontSize="large"/></span>
|
||||
<span className="cursor-pointer z-10 font-white" onClick={() => {instanceRef.current?.next()}}><ArrowForwardIosIcon sx={{color: grey[100]}} fontSize="large"/></span>
|
||||
</div>
|
||||
<div className='mt-5 text-center p-2 bg-slate-900 rounded-md italic relative top-[-35px]'>
|
||||
This is a side view of the device showcasing the power connection and button, in addition to the form factor of the device.
|
||||
</div>
|
||||
</div>
|
||||
<div className={`keen-slider__slide ${loaded ? 'block' : 'hidden'}`}>
|
||||
<p className="flex justify-center">
|
||||
<img src="/project_files/aa/photos/aa_back.png" className="h-[450px]"/>
|
||||
@@ -101,8 +137,8 @@ function ImageCarousel() {
|
||||
<img src="/project_files/aa/photos/aa_diagram_1.png" className="h-[450px]"/>
|
||||
</p>
|
||||
<div className="relative top-[-35px] left-[5px]">
|
||||
<span className="cursor-pointer z-10 font-white" onClick={() => {instanceRef.current?.prev()}}><ArrowBackIosIcon sx={{color: grey[900]}} fontSize="large"/></span>
|
||||
<span className="cursor-pointer z-10 font-white" onClick={() => {instanceRef.current?.next()}}><ArrowForwardIosIcon sx={{color: grey[900]}} fontSize="large"/></span>
|
||||
<span className="cursor-pointer z-10 font-white" onClick={() => {instanceRef.current?.prev()}}><ArrowBackIosIcon sx={{color: grey[100]}} fontSize="large"/></span>
|
||||
<span className="cursor-pointer z-10 font-white" onClick={() => {instanceRef.current?.next()}}><ArrowForwardIosIcon sx={{color: grey[100]}} fontSize="large"/></span>
|
||||
</div>
|
||||
<div className='mt-5 text-center p-2 bg-slate-900 rounded-md italic relative top-[-35px]'>
|
||||
Device design diagram.
|
||||
@@ -120,7 +156,18 @@ function ImageCarousel() {
|
||||
Device design diagram.
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className={`keen-slider__slide ${loaded ? 'block' : 'hidden'}`}>
|
||||
<p className="flex justify-center">
|
||||
<img src="/project_files/aa/photos/aa_software_diagram.png" className="h-[450px]"/>
|
||||
</p>
|
||||
<div className="relative top-[-35px] left-[5px]">
|
||||
<span className="cursor-pointer z-10 font-white" onClick={() => {instanceRef.current?.prev()}}><ArrowBackIosIcon sx={{color: grey[100]}} fontSize="large"/></span>
|
||||
<span className="cursor-pointer z-10 font-white" onClick={() => {instanceRef.current?.next()}}><ArrowForwardIosIcon sx={{color: grey[100]}} fontSize="large"/></span>
|
||||
</div>
|
||||
<div className='mt-5 text-center p-2 bg-slate-900 rounded-md italic relative top-[-35px]'>
|
||||
Software Flow Diagram
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
@@ -129,32 +176,60 @@ function ImageCarousel() {
|
||||
export default function Home() {
|
||||
return (
|
||||
<div>
|
||||
<div className="grid grid-cols-1">
|
||||
<section className="flex justify-center items-center">
|
||||
<img src="/images/aa1.png" className="max-md:w-[80%] md:w-[60%]"/>
|
||||
</section>
|
||||
<section className="flex justify-center items-center mt-5">
|
||||
<img src="data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%20width%3D%22137%22%20height%3D%2228%22%20role%3D%22img%22%20aria-label%3D%22VERSION%3A%202.7.2%22%3E%3Ctitle%3EVERSION%3A%202.7.2%3C%2Ftitle%3E%3Cg%20shape-rendering%3D%22crispEdges%22%3E%3Crect%20width%3D%2278.75%22%20height%3D%2228%22%20fill%3D%22%23555%22%2F%3E%3Crect%20x%3D%2278.75%22%20width%3D%2258.25%22%20height%3D%2228%22%20fill%3D%22%234c1%22%2F%3E%3C%2Fg%3E%3Cg%20fill%3D%22%23fff%22%20text-anchor%3D%22middle%22%20font-family%3D%22Verdana%2CGeneva%2CDejaVu%20Sans%2Csans-serif%22%20text-rendering%3D%22geometricPrecision%22%20font-size%3D%22100%22%3E%3Ctext%20transform%3D%22scale(.1)%22%20x%3D%22393.75%22%20y%3D%22175%22%20textLength%3D%22547.5%22%20fill%3D%22%23fff%22%3EVERSION%3C%2Ftext%3E%3Ctext%20transform%3D%22scale(.1)%22%20x%3D%221078.75%22%20y%3D%22175%22%20textLength%3D%22342.5%22%20fill%3D%22%23fff%22%20font-weight%3D%22bold%22%3E2.7.2%3C%2Ftext%3E%3C%2Fg%3E%3C%2Fsvg%3E" className="ml-5 mr-5"/>
|
||||
<Link href="https://gitea.nicholaspease.com/npease/AviationAssistant" target="_blank"><img src="https://img.shields.io/badge/Open%20On%20Gitea-grey?style=for-the-badge&logo=gitea"/></Link>
|
||||
</section>
|
||||
<section className="font-bold text-[24px] text-center mt-4 mb-2">
|
||||
2021 Maine State Science Fair - Computer Science Category - 1st Place<br/>
|
||||
<div className="text-[16px] font-normal">
|
||||
<Link className="mr-5" href="https://www.jax.org/news-and-insights/2021/march/mssf-2021#" target="_blank">Link to Press Release</Link>
|
||||
<Link className="mr-5" href="https://archive.nicholaspease.com/archive/1716867123.673383/singlefile.html" target="_blank">Mirror 1 (Local Archive)</Link>
|
||||
<Link className="mr-5" href="https://web.archive.org/web/20230923190338/https://www.jax.org/news-and-insights/2021/March/mssf-2021" target="_blank">Mirror 2 (Web Archive)</Link>
|
||||
<main className="grid max-md:grid-cols-1 md:grid-cols-3">
|
||||
<div className="">
|
||||
<img src="/project_files/aa/photos/aa_side.png" className="md:relative md:left-[20%] md:w-[80%]"/>
|
||||
</div>
|
||||
<div className="col-span-2">
|
||||
<section className="flex justify-center items-center">
|
||||
<img src="/images/aa1.png" className="max-md:w-[80%] md:w-[60%]"/>
|
||||
</section>
|
||||
<section className="flex justify-center items-center mt-5">
|
||||
<img src="data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%20width%3D%22137%22%20height%3D%2228%22%20role%3D%22img%22%20aria-label%3D%22VERSION%3A%202.7.2%22%3E%3Ctitle%3EVERSION%3A%202.7.2%3C%2Ftitle%3E%3Cg%20shape-rendering%3D%22crispEdges%22%3E%3Crect%20width%3D%2278.75%22%20height%3D%2228%22%20fill%3D%22%23555%22%2F%3E%3Crect%20x%3D%2278.75%22%20width%3D%2258.25%22%20height%3D%2228%22%20fill%3D%22%234c1%22%2F%3E%3C%2Fg%3E%3Cg%20fill%3D%22%23fff%22%20text-anchor%3D%22middle%22%20font-family%3D%22Verdana%2CGeneva%2CDejaVu%20Sans%2Csans-serif%22%20text-rendering%3D%22geometricPrecision%22%20font-size%3D%22100%22%3E%3Ctext%20transform%3D%22scale(.1)%22%20x%3D%22393.75%22%20y%3D%22175%22%20textLength%3D%22547.5%22%20fill%3D%22%23fff%22%3EVERSION%3C%2Ftext%3E%3Ctext%20transform%3D%22scale(.1)%22%20x%3D%221078.75%22%20y%3D%22175%22%20textLength%3D%22342.5%22%20fill%3D%22%23fff%22%20font-weight%3D%22bold%22%3E2.7.2%3C%2Ftext%3E%3C%2Fg%3E%3C%2Fsvg%3E" className="ml-5 mr-5"/>
|
||||
<Link href="https://gitea.nicholaspease.com/npease/AviationAssistant" target="_blank"><img src="https://img.shields.io/badge/Open%20On%20Gitea-grey?style=for-the-badge&logo=gitea"/></Link>
|
||||
</section>
|
||||
<section className="font-bold text-[24px] text-center mt-4 mb-2">
|
||||
2021 Maine State Science Fair - Computer Science Category - 1st Place<br/>
|
||||
<div className="text-[16px] font-normal">
|
||||
<Link className="mr-5" href="https://www.jax.org/news-and-insights/2021/march/mssf-2021#" target="_blank">Link to Press Release</Link>
|
||||
<Link className="mr-5" href="https://archive.nicholaspease.com/archive/1716867123.673383/singlefile.html" target="_blank">Mirror 1 (Local Archive)</Link>
|
||||
<Link className="mr-5" href="https://web.archive.org/web/20230923190338/https://www.jax.org/news-and-insights/2021/March/mssf-2021" target="_blank">Mirror 2 (Web Archive)</Link>
|
||||
</div>
|
||||
</section>
|
||||
<section className="text-center pt-3 relative max-md:w-[80%] max-md:left-[10%] md:left-[20%] md:w-[60%]">
|
||||
The Aviation Assistant is a combination hardware / software solution to allow the user to track aircraft using the Automated Dependent Surveillance - Broadcast (ADS-B) system.
|
||||
The device is a Raspberry Pi, coupled with a battery control board, speakers, and a USB SDR interface device. The software is a combination of a modified <Link href="https://github.com/mutability/dump1090" target="_blank" className="underline italic">dump1090</Link>
|
||||
software, extended with additional features, in addition to a series of device based APIs to facilitate control and information from the physical hardware to the software interface. The interface is presented to the user via the 7 inch touchscreen display in the form of
|
||||
website.
|
||||
</section>
|
||||
</div>
|
||||
</main>
|
||||
<main className="md:w-[80%] md:relative md:left-[10%]">
|
||||
<ImageCarousel/>
|
||||
</main>
|
||||
<main className="pl-5 pr-5">
|
||||
<span className="text-[24px] font-bold mb-2">Project Videos</span>
|
||||
<section className="grid max-md:grid-cols-1 md:grid-cols-3 gap-x-5">
|
||||
<div className="w-[100%] text-center italic text-[18px]">
|
||||
<YouTube videoId="vaKSXLHYmrU" opts={{"width": '100%'}}/>
|
||||
2021 Maine State Science Fair - 2 Minute Summary
|
||||
</div>
|
||||
</section>
|
||||
<section className="text-center pt-3 relative max-md:w-[80%] max-md:left-[10%] md:left-[20%] md:w-[60%]">
|
||||
The Aviation Assistant is a combination hardware / software solution to allow the user to track aircraft using the Automated Dependent Surveillance - Broadcast (ADS-B) system.
|
||||
The device is a Raspberry Pi, coupled with a battery control board, speakers, and a USB SDR interface device. The software is a combination of a modified <Link href="https://github.com/mutability/dump1090" target="_blank" className="underline italic">dump1090</Link>
|
||||
software, extended with additional features, in addition to a series of device based APIs to facilite control and information from the physical hardware to the software interface. The interface is presented to the user via the 7 inch touchscreen display in the form of
|
||||
website.
|
||||
</section>
|
||||
<section className="max-md:w-[80%] md:w-[60%] relative max-md:left-[10%] md:left-[20%]">
|
||||
<ImageCarousel/>
|
||||
</section>
|
||||
</div>
|
||||
<div className="w-[100%] text-center italic text-[18px]">
|
||||
<YouTube videoId="jcz2ad-T-Vg" opts={{"width": '100%'}}/>
|
||||
Secondary Case Printing Video
|
||||
</div>
|
||||
<div className="w-[100%] text-center italic text-[18px]">
|
||||
<YouTube videoId="eMdDp03v9aI" opts={{"width": '100%'}}/>
|
||||
Field Test at Canaan Fire Tower
|
||||
</div>
|
||||
</section>
|
||||
</main>
|
||||
<main className="ml-5 mr-5 mt-10">
|
||||
<div className="md:w-[50%] md:relative md:left-[25%]">
|
||||
<FileList file={fileList}/>
|
||||
</div>
|
||||
</main>
|
||||
|
||||
</div>
|
||||
)
|
||||
}
|
||||
@@ -2,7 +2,7 @@ export function FileList({file: filelist}) {
|
||||
function FileRow({file}) {
|
||||
return (
|
||||
<tr>
|
||||
<td className="italic hover:underline p-1"><a href={"/project_files/chatmaps/"+file.filename} target="_blank">{file.name}</a></td>
|
||||
<td className="italic hover:underline p-1"><a href={file.path+"/"+file.filename} target="_blank">{file.name}</a></td>
|
||||
<td className="p-1">{file.type}</td>
|
||||
</tr>
|
||||
)
|
||||
@@ -15,7 +15,7 @@ export function FileList({file: filelist}) {
|
||||
|
||||
return (
|
||||
<div className="mt-5 bg-slate-900 mr-2 rounded-md p-3">
|
||||
<h2 className="font-bold text-[24px]">ChatMaps Files</h2>
|
||||
<h2 className="font-bold text-[24px]">Files</h2>
|
||||
<table className="w-[100%] mt-2 mr-2 ml-2">
|
||||
<thead>
|
||||
<tr>
|
||||
|
||||
Reference in New Issue
Block a user