Skip to content
This repository has been archived by the owner on Jun 2, 2024. It is now read-only.

Commit

Permalink
stuck in a merge
Browse files Browse the repository at this point in the history
  • Loading branch information
@Elias2660
Elias2660 committed Feb 4, 2024
2 parents c007b89 + b64687c commit 33180a5
Show file tree
Hide file tree
Showing 27 changed files with 1,100 additions and 780 deletions.
232 changes: 120 additions & 112 deletions public/butter.js
View file
Original file line number Diff line number Diff line change
@@ -1,118 +1,126 @@
// butter.js

(function(root){
var Butter = function() {

var self = this;

this.defaults = {
wrapperId: 'butter',
wrapperDamper: 0.07,
cancelOnTouch: false
}

this.validateOptions = function(ops) {
for (var prop in ops) {
if (self.defaults.hasOwnProperty(prop)) {
Object.defineProperty(self.defaults, prop, {value: Object.getOwnPropertyDescriptor(ops, prop).value})
}
}
}
// ???? What is this for ????
// this.wrapperDamper;
// this.wrapperId;
// this.cancelOnTouch;
// this.wrapper;
this.wrapperOffset = 0;
// this.animateId;
this.resizing = false;
this.active = false;
// this.wrapperHeight;
// this.bodyHeight;
(function (root) {
var Butter = function () {
var self = this;

this.defaults = {
wrapperId: "butter",
wrapperDamper: 0.07,
cancelOnTouch: false,
};

Butter.prototype = {

init: function(options) {
if (options) {
this.validateOptions(options);
}

this.active = true;
this.resizing = false;
this.wrapperDamper = this.defaults.wrapperDamper;
this.wrapperId = this.defaults.wrapperId;
this.cancelOnTouch = this.defaults.cancelOnTouch;

this.wrapper = document.getElementById(this.wrapperId);
this.wrapper.style.position = 'fixed';
this.wrapper.style.width = '100%';

this.wrapperHeight = this.wrapper.clientHeight;
document.body.style.height = this.wrapperHeight + 'px';

window.addEventListener('resize', this.resize.bind(this));
if (this.cancelOnTouch) {
window.addEventListener('touchstart', this.cancel.bind(this));
}
this.wrapperOffset = 0.0;
this.animateId = window.requestAnimationFrame(this.animate.bind(this));

// window.addEventListener('load', this.resize.bind(this));
},

wrapperUpdate: function() {
var scrollY = (document.scrollingElement !== undefined) ? document.scrollingElement.scrollTop : (document.documentElement.scrollTop || 0.0);
this.wrapperOffset += (scrollY - this.wrapperOffset) * this.wrapperDamper;
this.wrapper.style.transform = 'translate3d(0,' + (-this.wrapperOffset.toFixed(2)) + 'px, 0)';
},

checkResize: function() {
if (this.wrapperHeight !== this.wrapper.clientHeight) {
this.resize();
}
},

resize: function() {
var self = this;
if (!self.resizing) {
self.resizing = true;
window.cancelAnimationFrame(self.animateId);
window.setTimeout(function() {
self.wrapperHeight = self.wrapper.clientHeight;
if (parseInt(document.body.style.height) !== parseInt(self.wrapperHeight)) {
document.body.style.height = self.wrapperHeight + 'px';
}
self.animateId = window.requestAnimationFrame(self.animate.bind(self));
self.resizing = false;
}, 150)
}
},

animate: function() {
this.checkResize();
this.wrapperUpdate();
this.animateId = window.requestAnimationFrame(this.animate.bind(this));
},

cancel: function() {
if (this.active) {
window.cancelAnimationFrame(this.animateId);

window.removeEventListener('resize', this.resize);
window.removeEventListener('touchstart', this.cancel);
this.wrapper.removeAttribute('style');
document.body.removeAttribute('style');

this.active = false;
this.wrapper = "";
this.wrapperOffset = 0;
this.resizing = true;
this.animateId = "";
}
},
this.validateOptions = function (ops) {
for (var prop in ops) {
if (self.defaults.hasOwnProperty(prop)) {
Object.defineProperty(self.defaults, prop, {
value: Object.getOwnPropertyDescriptor(ops, prop).value,
});
}
}
};
// ???? What is this for ????
// this.wrapperDamper;
// this.wrapperId;
// this.cancelOnTouch;
// this.wrapper;
this.wrapperOffset = 0;
// this.animateId;
this.resizing = false;
this.active = false;
// this.wrapperHeight;
// this.bodyHeight;
};

Butter.prototype = {
init: function (options) {
if (options) {
this.validateOptions(options);
}

this.active = true;
this.resizing = false;
this.wrapperDamper = this.defaults.wrapperDamper;
this.wrapperId = this.defaults.wrapperId;
this.cancelOnTouch = this.defaults.cancelOnTouch;

this.wrapper = document.getElementById(this.wrapperId);
this.wrapper.style.position = "fixed";
this.wrapper.style.width = "100%";

this.wrapperHeight = this.wrapper.clientHeight;
document.body.style.height = this.wrapperHeight + "px";

window.addEventListener("resize", this.resize.bind(this));
if (this.cancelOnTouch) {
window.addEventListener("touchstart", this.cancel.bind(this));
}
this.wrapperOffset = 0.0;
this.animateId = window.requestAnimationFrame(this.animate.bind(this));

// window.addEventListener('load', this.resize.bind(this));
},

wrapperUpdate: function () {
var scrollY =
document.scrollingElement !== undefined
? document.scrollingElement.scrollTop
: document.documentElement.scrollTop || 0.0;
this.wrapperOffset += (scrollY - this.wrapperOffset) * this.wrapperDamper;
this.wrapper.style.transform =
"translate3d(0," + -this.wrapperOffset.toFixed(2) + "px, 0)";
},

checkResize: function () {
if (this.wrapperHeight !== this.wrapper.clientHeight) {
this.resize();
}
},

resize: function () {
var self = this;
if (!self.resizing) {
self.resizing = true;
window.cancelAnimationFrame(self.animateId);
window.setTimeout(function () {
self.wrapperHeight = self.wrapper.clientHeight;
if (
parseInt(document.body.style.height) !==
parseInt(self.wrapperHeight)
) {
document.body.style.height = self.wrapperHeight + "px";
}
self.animateId = window.requestAnimationFrame(
self.animate.bind(self),
);
self.resizing = false;
}, 150);
}
},

animate: function () {
this.checkResize();
this.wrapperUpdate();
this.animateId = window.requestAnimationFrame(this.animate.bind(this));
},

cancel: function () {
if (this.active) {
window.cancelAnimationFrame(this.animateId);

window.removeEventListener("resize", this.resize);
window.removeEventListener("touchstart", this.cancel);
this.wrapper.removeAttribute("style");
document.body.removeAttribute("style");

root.butter = new Butter();

})(this);
this.active = false;
this.wrapper = "";
this.wrapperOffset = 0;
this.resizing = true;
this.animateId = "";
}
},
};

root.butter = new Butter();
})(this);
26 changes: 13 additions & 13 deletions src/components/App.jsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -7,17 +7,17 @@ import Home from "./Home";
import Socials from "./Socials";

export default function App() {
return (
<BrowserRouter>
<Routes>
<Route path="/" element={<Home />} />
<Route path="/people" element={<People />} />
<Route path="/resources" element={<Resources />} />
<Route path="/events" element={<Events />} />
<Route path="/socials" element={<Socials />} />
<Route path="/jprom" element={<JProm />} />
<Route path="*" element={<Home />} />
</Routes>
</BrowserRouter>
)
return (
<BrowserRouter>
<Routes>
<Route path="/" element={<Home />} />
<Route path="/people" element={<People />} />
<Route path="/resources" element={<Resources />} />
<Route path="/events" element={<Events />} />
<Route path="/socials" element={<Socials />} />
<Route path="/jprom" element={<JProm />} />
<Route path="*" element={<Home />} />
</Routes>
</BrowserRouter>
);
}
3 changes: 1 addition & 2 deletions src/components/Chars.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,8 +2,7 @@
opacity: 0.3;
transition: opacity 0.1s ease;
}

.visible {
opacity: 1;
}

2 changes: 1 addition & 1 deletion src/components/Events.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -33,4 +33,4 @@ font-size: 3rem;
font-style: normal;
font-weight: 350;
line-height: 100%; /* 3rem */
}
}
44 changes: 22 additions & 22 deletions src/components/Events.jsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,31 +2,31 @@ import React from "react";
import Navbar from "./NonPage/NavBar";
import Texture from "./NonPage/Texture";
import Initiatives from "./NonPage/Initiatives";
import Footer from "./NonPage/Footer"
import AnnouncementLine from "../Images/announcementsLine.svg"
import Footer from "./NonPage/Footer";
import AnnouncementLine from "../Images/announcementsLine.svg";
import "./Events.css";
import Carousel from "./NonPage/Carousel";
import CustomCursor from "./NonPage/Cursor";

export default function Events() {
let eventsPage = (
<div className="events-page">
<Navbar {...{ page: "Events" }} />
<CustomCursor />
<Carousel/>
<div className="events-body">
<div className="all-initiatives-header">
<h1 className="title">All Initiatives</h1>
<img className="vector" alt="line" src={AnnouncementLine} />
</div>
<div className="all-initiatives-flexbox">
<Initiatives />
</div>
</div>

<Footer />
<Texture />
let eventsPage = (
<div className="events-page">
<Navbar {...{ page: "Events" }} />
<CustomCursor />
<Carousel />
<div className="events-body">
<div className="all-initiatives-header">
<h1 className="title">All Initiatives</h1>
<img className="vector" alt="line" src={AnnouncementLine} />
</div>
<div className="all-initiatives-flexbox">
<Initiatives />
</div>
);
return eventsPage;
}
</div>

<Footer />
<Texture />
</div>
);
return eventsPage;
}
2 changes: 1 addition & 1 deletion src/components/Home.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -250,4 +250,4 @@ MISSION statement breaks at around 613 px; there should be some dyanmic stuff ha
font-style: normal;
font-weight: 400;
line-height: normal;
}
}
Loading

0 comments on commit 33180a5

Please sign in to comment.