diff --git a/index.html b/index.html index 4213253..b9e1bb3 100644 --- a/index.html +++ b/index.html @@ -39,16 +39,50 @@
click a project to find out more
-
-

- - + + + + + +
+

VR interaction system and physics engine

+ + -

+

A project done for my EPQ, during post-16, where I aimed to create a virtual reality environment where the user could grab and interact with objects in a semi-physics based + environment.

This system was my introduction to Unreal Engine and mainly used its \"Blueprint\" visual language, however I later used C++ to try and add my own physics + to it.

+
+

Work on Aardvark XR

+ + + +

Aardvark is a web-based virtual reality system which allows users to create and share web apps which are overlayed on top of the users vr experience, completely separate from the program they are currently running. + This allows for an incredibly flexible in-vr toolset that can be accessed within any virtual reality program.

Over the course of its release I have attended its first hackathon and added to its development in multiple + ways whether through designing 3D models for other developers apps or creating my own.

+ + +
+ +
+

Tower defence game

+ + + +

"A project I created with a friend to help us gain a better understanding of pygame.

This was a basic tower defence game but featured a fully scalable and customisable

+ + +
+ + + + + +
I hope you like my work! If you ever want to contact me, my twitter, email and github can be found below.
diff --git a/pages/gallery-index.js b/pages/gallery-index.js deleted file mode 100644 index 47404ca..0000000 --- a/pages/gallery-index.js +++ /dev/null @@ -1,47 +0,0 @@ -export class slide{ - constructor(title, caption, image, imagePos, link){ - this.title = title; - this.caption = caption; - this.image = image; - this.imagePos = imagePos; - this.link = link; - } -} - -export var slides = [ - new slide( - "VR interaction system and physics engine", - "A project done for my EPQ, during post-16, where I aimed to create a virtual reality environment where the user could grab and interact with objects in a semi-physics based \ - environment.

This system was my introduction to Unreal Engine and mainly used its \"Blueprint\" visual language, however I later used C++ to try and add my own physics \ - to it.", - "./pages/gallery/epq-project/projectHeaderImage.png", - "object-position: center;", - "./pages/gallery/epq-project/epq-project.html" - ), - new slide( - "Work on Aardvark XR", - "Aardvark is a web-based virtual reality system which allows users to create and share web apps which are overlayed on top of the users vr experience, completely separate from the program they are currently running.\ - This allows for an incredibly flexible in-vr toolset that can be accessed within any virtual reality program.

Over the course of its release I have attended its first hackathon and added to its development in multiple \ - ways whether through designing 3D models for other developers apps or creating my own.", - "./pages/gallery/aardvark-work/projectHeaderImage.png", - "object-position: center;", - "./pages/gallery/aardvark-work/aardvark-work.html" - ), - new slide( - "Tower defence game", - "A project I created with a friend to help us gain a better understanding of pygame.

This was a basic tower defence game but featured a fully scalable and customisable \ - level system allowing users to add their own levels and towers. One of my earliest projects, this is something I have revisited and improved upon quite a few times.", - "./pages/gallery/cat-tower-defence/projectHeaderImage.png", - "object-position: top;", - "./pages/gallery/cat-tower-defence/cat-tower-defence.html" - ), - new slide( - "House designer", - "Originally a task given to do in a school lesson with a text interface, this became a small personal project that I added many other features to.

It included \ - a graphical interface that allowed the user to draw, move and label rooms as well as set the painting and carpeting price which could later be used to calculate \ - full decoration costs.", - "./pages/gallery/room-builder/projectHeaderImage.png", - "object-position: top;", - "./pages/gallery/room-builder/room-builder.html" - ) -]; \ No newline at end of file diff --git a/pages/gallery.js b/pages/gallery.js index 2be8a64..67846f2 100644 --- a/pages/gallery.js +++ b/pages/gallery.js @@ -1,6 +1,5 @@ -import {slide, slides} from "../pages/gallery-index.js"; - var currentSlide = 0; +var allSlides = document.querySelectorAll(".programGallery"); window.nextSlide = function nextSlide(){ @@ -14,18 +13,22 @@ window.lastSlide = function lastSlide(){ } function updateSlide(){ - if (currentSlide > slides.length-1){ + if (currentSlide > allSlides.length-1){ currentSlide = 0; } else if (currentSlide < 0){ - currentSlide = slides.length-1; + currentSlide = allSlides.length-1; } - - document.querySelector(".galleryTitle").innerHTML = slides[currentSlide].title; - document.querySelector(".galleryCaption").innerHTML = slides[currentSlide].caption; - document.querySelector(".galleryLink").href = slides[currentSlide].link; - document.querySelector(".galleryImage").src = slides[currentSlide].image; - document.querySelector(".galleryImage").style = slides[currentSlide].imagePos; + + hideAll(); + allSlides[currentSlide].style.display = "grid"; } +function hideAll(){ + for (var i = 0; i < allSlides.length; i++){ + allSlides[i].style.display = "none"; + } +} + +hideAll() updateSlide(); \ No newline at end of file diff --git a/pages/mainpage.css b/pages/mainpage.css index cfbb0c8..fb41dd3 100644 --- a/pages/mainpage.css +++ b/pages/mainpage.css @@ -76,7 +76,7 @@ h1{ font-size: clamp(1rem, 1.2vw, 3rem); } -#programGallery{ +.programGallery{ display: grid; grid-template-columns: repeat(12, 1fr); grid-template-rows: repeat(10, 1fr); @@ -246,7 +246,7 @@ h1{ font-size: clamp(2rem, 4vw, 5rem); } - #programGallery{ + .programGallery{ width: 92vw; margin-left: 4vw;