Deepak Gudi deepakgudi-pixel

🤠

Hello there!

Creative Developer

deepakgudi-pixel / scrollControls.js

Created April 9, 2023 10:03

scroll controls for r3f

	<ScrollControls pages={3} damping={0.1} horizontal>
	{/* Canvas contents in here will not scroll, but receive useScroll! */}
	<Scroll>
	{/* Canvas contents in here will scroll along */}
	</Scroll>
	<Scroll html>
	{/* DOM contents in here will scroll along */}
	</Scroll>
	</ScrollControls>

deepakgudi-pixel / fragStartUp.js

Created July 17, 2022 07:57

	uniform float time;
	uniform vec2 resolution;
	uniform vec2 mouse;
	uniform vec3 spectrum;

	uniform sampler2D startImage;

	in VertexData
	{
	vec4 v_position;

deepakgudi-pixel / smoothScrolling.js

Created April 27, 2022 07:42

	mport "../libs/gsap/gsap.min";
	import ScrollMagic from "../libs/smooth/ScrollMagic";
	import Scrollbar from "../libs/smooth/smooth-scrollbar";

	export default class SmoothScroll {
	constructor() {
	this.init();
	}
	init() {

deepakgudi-pixel / base.css

Last active April 20, 2022 17:23

	html, body, div, span, applet, object, iframe,
	h1, h2, h3, h4, h5, h6, p, blockquote, pre,
	a, abbr, acronym, address, big, cite, code,
	del, dfn, em, img, ins, kbd, q, s, samp,
	small, strike, strong, sub, sup, tt, var,
	b, u, i, center,
	dl, dt, dd, ol, ul, li,
	fieldset, form, label, legend,
	table, caption, tbody, tfoot, thead, tr, th, td,
	article, aside, canvas, details, embed,

deepakgudi-pixel / smooth.js

Created April 20, 2022 17:20

smooth scrolling effect for websites

	const mainTag = document.querySelector("main")
	const bodyTag = document.querySelector("body")

	const cursorTag = document.querySelector("div.cursor")
	const cursorInnerTag = document.querySelector("div.cursor-inner")

	const captions = document.querySelectorAll("figcaption")

	const motion = window.matchMedia('(prefers-reduced-motion: no-preference)')
	const large = window.matchMedia('(min-width: 600px)')

deepakgudi-pixel / rgbkinetic.js

Created March 23, 2022 06:35

	rgbKineticSlider = new rgbKineticSlider({
	slideImages: images,

	backgroundDisplacementSprite: "https://i.ibb.co/N246LxD/map-9.jpg",
	cursorDisplacementSprite: "https://i.ibb.co/KrVr51f/displace-circle.png",
	cursorImgEffect: true,
	cursorTextEffect: true,
	cursorScaleIntensity: 0.65,
	cursorMomentum: 0.14,

deepakgudi-pixel / mouseWheel.js

Last active February 19, 2022 13:49

	let speed = 0;
	let position = 0;
	let rounded = 0;

	let block = document.getElementById("block");

	window.addEventListener("wheel", (e) => {
	speed += e.deltaY * 0.0003;
	});

deepakgudi-pixel / HorizontalScroll.js

Created December 23, 2021 13:56

	let images = [...document.querySelectorAll(".img")];
	let slider = document.querySelector(".slider");
	let sliderWidth;
	let imageWidth;
	let current = 0;
	let target = 0;
	let ease = 0.05;

	images.forEach((img, idx) => {
	img.style.backgroundImage = `url(./images/${idx + 1}.jpg)`;

deepakgudi-pixel / grid-sketch.js

Created December 6, 2021 11:16

	const canvasSketch = require("canvas-sketch");
	const { lerp } = require("canvas-sketch-util/math");

	const settings = {
	dimensions: [2048, 2048],
	};

	const sketch = () => {
	//create local state
	//this fucntion returns points on the grid.

deepakgudi-pixel / sketch.js

Created December 6, 2021 05:37

	const canvasSketch = require("canvas-sketch");

	const settings = {
	dimensions: [2048, 2048],
	};

	const sketch = () => {
	return ({ context, width, height }) => {
	context.fillStyle = "orange";
	context.fillRect(0, 0, width, height);