Skip to content

Basic Blackjack: simple JavaScript game, Emoji Table: print full table of emojis, Rainbow Noise: time-waster app on 2D canvas

Notifications You must be signed in to change notification settings

ATeaDaze/ateadaze.github.io

Folders and files

NameName
Last commit message
Last commit date

Latest commit

Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 

Repository files navigation

πŸƒ Basic Blackjack

A simple blackjack app written in (mostly) native JavaScript. Uses some jQuery for cleaner syntax. No additional libraries or anything fancy

πŸ’» Desktop | πŸ“± Mobile

blackjack_banner


πŸ”³ Emoji Table

Prints emojis in a table with 10 columns. Clicking an emoji copies it to the clipboard

πŸ’» Desktop / Mobile πŸ“± (landscape mode highly recommended for mobile)

emoji_table-repo_banner


🎲 Rainbow Noise

A time-waster app: draw with random shapes and patterns on a JavaScript canvas

πŸ’» Desktop | πŸ“± Mobile

rainbow_noise-repo_banner

Features

  • Draw abstract shapes with your mouse or touch screen
    • New patterns emerge from random lines overlapping
  • Run animations automatically (or combine them with drawing)
  • 13 color palettes
  • Keyboard support (desktop version)

Color Palettes

  • 🌈 Faded: rainbow with desaturated colors
  • 🌈 Rainbow: classic rainbow (red, orange, yellow, green, blue, indigo, violet)
  • πŸ”₯ Fire: warm and inviting
  • 🧊 Ice: cool and refreshing
  • πŸ“Š RGB: red, green, blue
  • ✨ CMY: cyan, magenta, yellow
  • 🦜 CGA-8: an old PC/DOS video mode (8-color)
  • 🦜 CGA-16: full 16-color CGA palette (minus pure black)
  • 🎨 Pyxel: default color palette for Pyxel Edit
  • 🟩 Gameboy: as green and hideous as it was in the 90s
  • 🧨 Patriot: a greater union (red, white, and blue)
  • 🏁 Grayscale: everything from dim gray to off-white
  • πŸ”± Ukraine: the sky and fields of a beautiful nation

Screenshots

Β  Type of Screenshot
πŸ–ŒοΈ Hand drawn
🎲 Randomly generated

⧎ Triangle Web πŸ–ŒοΈ Faded

triangles-faded

β–§ Line Scatter πŸ–ŒοΈ Ice

line_scatter-ice

✺ Starburst 🎲 Fire

starburst-fire

⧎ Triangle Web 🎲 CGA-8

triangles-cga8

β–§ Line Scatter 🎲 RGB

line_scatter-rgb

⧎ Triangle Web πŸ–ŒοΈ Grayscale

line_scatter-grayscale

✺ Starburst 🎲 Patriot

starburst

⧎ Triangle Web + β–§ Line Scatter + ✺ Starburst 🎲 Faded

mix-faded

πŸ’» Desktop

screenshot-faded

Keyboard Shortcuts

General

Key Β 
R Run animation
P Pause animation
C Clear screen
Enter Toggle free draw mode
Spacebar Next palette
? Help
O Origin reset (center)
* Random palette

Animation Select

Key Β 
T Triangle web
L Line scatter
S Starburst

Palettes

Key Β 
D Faded
A Rainbow (classic)
F Fire
I Ice
R RGB
M CMY
8 CGA-8
6 CGA-16
X Pyxel Edit
Y Gameboy
U USA
G Grayscale
K Ukraine

On-screen controls

Button Key Β 
Spacebar Space Select the next palette
Random * Select a random palette
E Enter Enable or disable free draw mode
? ? Print help screen (overwrites canvas with confirmation)
O o Reset origin to center

Instructions

β–Ά Press RUN repeatedly to increase the animation speed

βœ”οΈ Animations generally look smoothest between 1x and 5x speed

βœ”οΈ You can draw on the canvas while the animation is running

Instructions (Desktop)

✏️ Click and drag on the canvas to draw shapes

✏️ Free drawing mode paints shapes with mouse movement (no clicking)

βœ”οΈ Press spacebar to select the next color palette

🏠 Click the canvas to set a new origin for the starburst animation (setpoint=canvas.mouseup)

πŸ“± Mobile

mobile_screenshot

Instructions (Mobile)

πŸ–ŒοΈ Tap and drag across the canvas to paint with shapes

🏠 Tap and drag canvas to set new origin for starburst animation (setpoint=canvas.touchup)

ℹ️  Mobile version is basic (works but needs work)

Changes / Issues / Fixes

  • Release a mobile version with touch support
  • Separate updateUI() function into updateBanner() and updateButtons()
  • Remove style changes from setBrushColor()
  • Fix button colors not updating
  • Change origin setpoint to mousedown (instead of mouseup)
  • Added custom mouse cursors
  • Set indentation style to 2 tabs
  • Add toggle function to hide/show keyboard map
  • Add more variety: shapes, colors, brush width, etc. (experiment)
  • Replace all HTML legacy tags with CSS

Desktop

  • Expand mousemove listener to entire document body: wilder but more satisfying
  • Add a button to toggle drawing mode
  • Get actionListener working properly with mousemove and mousedown events (similar to mobile drawing)
  • Optimize resolution for the most common displays

Mobile

  • Disable swipe down refresh gesture
  • Needs more testing: limited testing done with Chrome device emulation and an S10+
  • Optimize resolution and settings for mobile displays

Technical Information

Languages: JavaScript for the main app, HTML for page elements, and CSS for formatting

Source Code

Desktop: JavaScript (main.js, drawCanvas.js), HTML, CSS

Mobile: mobileMain.js, mobileDrawCanvas.js, HTML, CSS (same as desktop)

About

Basic Blackjack: simple JavaScript game, Emoji Table: print full table of emojis, Rainbow Noise: time-waster app on 2D canvas

Topics

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published