Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly

Sign up
Appearance settings

FredrikMeyer/mspaint

Repository files navigation

MS Paint look-a-like in React

https://github.com/fredrikmeyer/mspaint/actions/workflows/build-and-test.yml/badge.svg

https://github.com/fredrikmeyer/mspaint/actions/workflows/codeql-analysis.yml/badge.svg

See result in paint.fredrikmeyer.net.

Install and run

Do yarn install and yarn start.

Build

yarn install

Script to generate icons

Run python cut_image.py to cut the screenshot of the toolbar into smaller images.

Icons

https://react-icons.github.io/react-icons/search?q=twitter

CSS processing

CSS is written mostly with SCSS and organized with CSS Modules.

@startuml
[SCSS] -> [CSS] : transpile
[CSS] -> [processed CSS] : PostCSS\n(autoprefixer, etc)
@enduml

css_processing.png

Inspiration

./inspiration.png/

See this YouTube video.

This one has several Windows 3.10 screenshots.

Windows 3.10 emulator.

React hooks-inspiration

react-use (mange hooks)

https://codeheir.com/2022/08/21/comparing-flood-fill-algorithms-in-javascript/

Se den hacker-vidoen (ca 21 min uti), eksempel på tegning. Ideer:rotering, kopering, cut/paste

https://hacks.mozilla.org/2011/12/faster-canvas-pixel-manipulation-with-typed-arrays/

Litteratur

Midpoint circle algorithm https://imruljubair.github.io/teaching/material/CSE4203/Chapter%20-%208%20(part%20-%20B).pdf https://uomustansiriyah.edu.iq/media/lectures/12/12_2020_06_26!11_47_57_PM.pdf

Bresenham linjealgoritme http://members.chello.at/easyfilter/canvas.html

About

A MS Paint clone in React.

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Contributors 4

AltStyle によって変換されたページ (->オリジナル) /