DEV Community: masspopcorn

What is Arccticy™?

masspopcorn — Mon, 15 Nov 2021 18:44:18 +0000

Arccticy™ Chat

What is it?

Arccticy™ Chat is an open-source, simple, (for now), chat platform.

Current team:

~~Product Manager~~: (1 person)@dudeactualdev

~~Head Developer~~: (2 ppl)(Taken - @Lankdev @StringentDev)(Advantages: Team Admin)

Designer: (2 people)(Open - @ch1ck3n))

Back-end development: (3 people)(Available - @natethemaker, @zplusfour)

~~Marketing Assistant~~: (1 person)(Taken - @natethemaker)

Developer: (2 people)(Available)

What's planned:

Design
- User Interface
- Landing Page
- Components
- Templates
- Desktop app with Electron.JS (All devs)
- Mobile app with Flutter? (Optional)
- Skeleton shimmers (better than using a circular indicator as it tells the user what type of content to expect)
Implement
- SPA routing (No reloading for moving channels/servers and to all pages)
- Video Chat (P2P?)
- Custom Database module (Stringent)
- API server (Stringent)
- Clusters module (standard nodejs module)
- Subscription service using API (NOT POSSIBLE ON REPL)

Hand Tracking using MediaPipe

masspopcorn — Fri, 05 Nov 2021 19:01:21 +0000

Hand Tracking using MediaPipe

Hey everyone! This is a Hand Tracking app using MediaPipe!

Description/Instructions

Use your camera and put your hands up!

Outro

Thanks for reading and playing! Here are some socials.

Repl Profile: dudeactualdev

Github Profile: dudeactual

OG Codepen: MediaPipe Hands

DEMO: handtracking

My portfolio!

masspopcorn — Tue, 19 Oct 2021 01:23:58 +0000

dudeactual/masspopcorn

Hey Everyone! I'm dudeactual/masspopcorn! I'm a fullstack developer who likes french fries and popcorn!

Description/Instructions

This was originally made by @lilykhan on repl.it. Huge thanks to her!

Outro

Thanks for reading and playing! Here are some socials.

Repl Profile: dudeactualdev

Github Profile: dudeactual

Portfolio: dudeactualdev

Repl.it post: My portfolio

How to make Rainbow Text in CSS

masspopcorn — Fri, 15 Oct 2021 17:10:45 +0000

Intro

Hey everyone! Today I was bored after I woke up and I had an idea for a CSS text design.

Description

It's text with Rainbow Fade. Yea that's it.

Outro

Thanks for reading! Here are some links.

Repl Profile: dudeactualdev

Github Profile: dudeactual

Github Repository: CSSRainbow-Text

DEMO: Demo

✏️Drawing function✏️

masspopcorn — Thu, 14 Oct 2021 18:35:06 +0000

Intro

Hey Everyone! I made a drawing function on canvas, here it is!

Description/Instructions

It's simple! Draw on the canvas!

Outro

Thanks for reading and playing! Here are some socials.

Repl Profile: dudeactualdev

Github Profile: dudeactual

DEMO: DrawFunction

Github Repository: draw

Creating a custom context-menu in JS

masspopcorn — Sun, 10 Oct 2021 21:35:31 +0000

Intro

Hey everyone! Have you ever right clicked on a website and were given a nice "right click menu"? Well today I will be showing you how to make one WITH custom CSS!

How do I make this?

To make the menu work, you add in:

 oncontextmenu = (e) => {
  e.preventDefault()
  let menu = document.createElement("div")
  menu.id = "ctxmenu"
  menu.style = `top:${e.pageY-10}px;left:${e.pageX-40}px`
  menu.onmouseleave = () => ctxmenu.outerHTML = ''
  menu.innerHTML = "<p>CTX Menu (with css)</p><p onclick='location.reload()'>Reload</p><p onclick='alert(`Server Status: Running`)'>ServerInfo</p><p onclick=(window.open(`https://patreon.com/masspopcorn`,`_blank`))>💸Donations</p><p onclick='alert(`EVERYBODY DO THE FLOP *flop*`)'>Flop?</p>"
  document.body.appendChild(menu)

To make the design work, you add:

 #ctxmenu {
  border-radius: 4px;
  position: fixed;
  background-color:#39403f;
  color: #FFF;
  cursor: pointer;
  border: 0px black solid
  -webkit-box-shadow: 8px 5px 23px 5px rgba(26,50,71,0.76); 
box-shadow: 8px 5px 23px 5px rgba(26,50,71,0.76);
}

#ctxmenu > p {
  padding: 0 1rem;
  margin: 0
}

#ctxmenu > p:hover {
  background: grey;
  color: ghostwhite
  cursor: crosshair;
}

Outro

Thanks for reading! Here are some links.

Repl Profile: dudeactualdev

Github Profile: dudeactual

Github Repository: CTX-Menu

DEMO: Demo

Number Guessing Game

masspopcorn — Tue, 05 Oct 2021 05:06:11 +0000

Intro

Hey everyone! This is a number guessing game I made. Let me know if you like the code!

Description/Instructions

Guess the number! Hint: It's between 1-100.

Outro

Thanks for reading and playing! Here are some socials.

Repl Profile: dudeactualdev

Github Profile: dudeactual

Github Repository: Number-Guessing-Game

DEV Community: masspopcorn

What is Arccticy™?

Arccticy™ Chat

What is it?

Current team:

What's planned:

Hand Tracking using MediaPipe

Hand Tracking using MediaPipe

Description/Instructions

Outro

DEMO: handtracking

My portfolio!

dudeactual/masspopcorn

Description/Instructions

Outro

Portfolio: dudeactualdev

How to make Rainbow Text in CSS

Intro

Description

Outro

DEMO: Demo

✏️Drawing function✏️

Intro

Description/Instructions

Outro

DEMO: DrawFunction

Creating a custom context-menu in JS

Intro

How do I make this?

Outro

DEMO: Demo

Number Guessing Game

Intro

Description/Instructions

Outro

DEMO: guessing-game