Skip to content

Commit 3936760

Browse files
MauritzOrlinskiMauritzOrlinski
committed
Initial commit
0 parents  commit 3936760

8 files changed

+2092
-0
lines changed

‎.gitignore

+130
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,130 @@
1+
# Logs
2+
logs
3+
*.log
4+
npm-debug.log*
5+
yarn-debug.log*
6+
yarn-error.log*
7+
lerna-debug.log*
8+
.pnpm-debug.log*
9+
10+
# Diagnostic reports (https://nodejs.org/api/report.html)
11+
report.[0-9]*.[0-9]*.[0-9]*.[0-9]*.json
12+
13+
# Runtime data
14+
pids
15+
*.pid
16+
*.seed
17+
*.pid.lock
18+
19+
# Directory for instrumented libs generated by jscoverage/JSCover
20+
lib-cov
21+
22+
# Coverage directory used by tools like istanbul
23+
coverage
24+
*.lcov
25+
26+
# nyc test coverage
27+
.nyc_output
28+
29+
# Grunt intermediate storage (https://gruntjs.com/creating-plugins#storing-task-files)
30+
.grunt
31+
32+
# Bower dependency directory (https://bower.io/)
33+
bower_components
34+
35+
# node-waf configuration
36+
.lock-wscript
37+
38+
# Compiled binary addons (https://nodejs.org/api/addons.html)
39+
build/Release
40+
41+
# Dependency directories
42+
node_modules/
43+
jspm_packages/
44+
45+
# Snowpack dependency directory (https://snowpack.dev/)
46+
web_modules/
47+
48+
# TypeScript cache
49+
*.tsbuildinfo
50+
51+
# Optional npm cache directory
52+
.npm
53+
54+
# Optional eslint cache
55+
.eslintcache
56+
57+
# Optional stylelint cache
58+
.stylelintcache
59+
60+
# Microbundle cache
61+
.rpt2_cache/
62+
.rts2_cache_cjs/
63+
.rts2_cache_es/
64+
.rts2_cache_umd/
65+
66+
# Optional REPL history
67+
.node_repl_history
68+
69+
# Output of 'npm pack'
70+
*.tgz
71+
72+
# Yarn Integrity file
73+
.yarn-integrity
74+
75+
# dotenv environment variable files
76+
.env
77+
.env.development.local
78+
.env.test.local
79+
.env.production.local
80+
.env.local
81+
82+
# parcel-bundler cache (https://parceljs.org/)
83+
.cache
84+
.parcel-cache
85+
86+
# Next.js build output
87+
.next
88+
out
89+
90+
# Nuxt.js build / generate output
91+
.nuxt
92+
dist
93+
94+
# Gatsby files
95+
.cache/
96+
# Comment in the public line in if your project uses Gatsby and not Next.js
97+
# https://nextjs.org/blog/next-9-1#public-directory-support
98+
# public
99+
100+
# vuepress build output
101+
.vuepress/dist
102+
103+
# vuepress v2.x temp and cache directory
104+
.temp
105+
.cache
106+
107+
# Docusaurus cache and generated files
108+
.docusaurus
109+
110+
# Serverless directories
111+
.serverless/
112+
113+
# FuseBox cache
114+
.fusebox/
115+
116+
# DynamoDB Local files
117+
.dynamodb/
118+
119+
# TernJS port file
120+
.tern-port
121+
122+
# Stores VSCode versions used for testing VSCode extensions
123+
.vscode-test
124+
125+
# yarn v2
126+
.yarn/cache
127+
.yarn/unplugged
128+
.yarn/build-state.yml
129+
.yarn/install-state.gz
130+
.pnp.*

‎build.css

+1
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎index.html

+58
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,58 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="UTF-8">
5+
<title>Sorting algorithm</title>
6+
<script src="src/sorting.js"></script>
7+
<link href="build.css" rel="stylesheet">
8+
</head>
9+
<body >
10+
<div class="m-10 xl:grid xl:grid-cols-2 xl:justify-items-stretch w-[95%] h-full">
11+
<div class="text-2xl">
12+
<h1 class="text-5xl font-mono">Sorting algorithms</h1>
13+
<div class="p-6 mt-3 grid grid-cols-1 gap-1">
14+
<input class="shadow-sm border-gray-300 rounded-lg m-2 focus:ring-2 focus:ring-indigo-200 focus:border-indigo-400" type="text" id="input" placeholder="Enter numbers to sort">
15+
<button class="p-2 px-5 bg-black text-gray-400" onclick="sort()">Sort</button>
16+
<button class="p-2 px-5 bg-black text-gray-400" onclick="reset()">Reset</button>
17+
</div>
18+
<div>
19+
<h2 class="text-5xl font-mono">Stats</h2>
20+
<div class="p-6 mt-3">
21+
<p class="text-gray-800 font-mono">Sorting algorithm: <span id="sortingAlgorithm">Bubble sort</span></p>
22+
<p class="text-gray-800 font-mono">Array size: <span id="arraySize">0</span></p>
23+
<p class="text-gray-800 font-mono">Comparisons: <span id="comparisons">0</span></p>
24+
<p class="text-gray-800 font-mono">Swaps: <span id="iterations">0</span></p>
25+
<p class="text-gray-800 font-mono">Time: <span id="time">0</span> ms</p>
26+
<p class="text-gray-800 font-mono">Sorted: <span id="isSorted">False</span></p>
27+
</div>
28+
</div>
29+
</div>
30+
<div class="w-full h-full" id="sorting-visualisation">
31+
<canvas class="bg-black p-5 w-full h-full" id="canvas" width="1000" height="1000" ></canvas>
32+
</div>
33+
</div>
34+
<div class="text-2xl m-10">
35+
<h3 class="text-5xl my-5">
36+
Further Settings
37+
</h3>
38+
<input class="border-black border-2 rounded-lg" type="text" id="speed" placeholder="speed">
39+
<select name="sorting-algorithm" id="sorting-algorithm">
40+
<option class="text-lg" value="bubble-sort">Bubble sort</option>
41+
<option class="text-lg" value="insertion-sort">Insertion sort</option>
42+
<option class="text-lg" value="selection-sort">Selection sort</option>
43+
</select>
44+
<button onclick="updateSettings()">Update Settings</button>
45+
</div>
46+
<footer class="text-2xl mt-auto">
47+
<div class="bg-black">
48+
<div class="flex flex-row items-center justify-between py-4 ">
49+
<p class="text-lg text-gray-400 ">© 2023 Mauritz Orlinski</p>
50+
<div class="flex text-gray-200">
51+
<a class="mr-4 hover:scale-110" href="https://github.com/MauritzOrlinski">GitHub</a>
52+
<a class="mr-4 hover:scale-110" href="https://mauritzorlinski.com">mauritzorlinski.com</a>
53+
</div>
54+
</div>
55+
</div>
56+
</footer>
57+
</body>
58+
</html>

0 commit comments

Comments
 (0)