Skip to content

Commit a73fb20

Browse files
DeeAyDanDeeAyDan
committed
final fixes
1 parent 4f68acf commit a73fb20

13 files changed

+875
-1061
lines changed

‎src/algorithms/CoinChange.svelte

Lines changed: 75 additions & 79 deletions
Original file line numberDiff line numberDiff line change
@@ -15,24 +15,38 @@
1515
import Controls from '../routes/Controls.svelte';
1616
import { get } from 'svelte/store';
1717
import { algorithmDisplayNames } from '../stores/algorithmMap.js';
18+
import { waitUntilResume, delay, pauseIfNeeded, log } from '../stores/utils.js';
19+
20+
const displayName = algorithmDisplayNames[get(selectedAlgorithm)];
1821
1922
// ==== Alapadatok ====
2023
21-
currentStep.set(0);
22-
algorithmStatus.set('idle');
23-
consoleLog.set([]);
24-
activeLine.set(-1);
2524
let exchangeCoins = [1, 4, 6, 10];
26-
const displayName = algorithmDisplayNames[get(selectedAlgorithm)];
2725
let dpTable: { index: number; value: number; coin: number }[] = [];
2826
let lastCoinTable = [];
29-
3027
let moneyToExchange = 29;
3128
3229
let newCoin = 0;
3330
let showInsertForm = false;
3431
let showDeleteList = false;
3532
33+
// ==== Előkalkulált lépésszám ====
34+
onMount(() => {
35+
totalSteps.set(Math.floor(moneyToExchange));
36+
resetParameters();
37+
});
38+
39+
function resetParameters() {
40+
algorithmStatus.set('idle');
41+
currentStep.set(0);
42+
consoleLog.set([]);
43+
44+
usedCoins = [];
45+
dpTable = [];
46+
47+
activeLine.set({ start: -1, end: -1 });
48+
}
49+
3650
function openInsertForm() {
3751
showInsertForm = !showInsertForm;
3852
showDeleteList = false;
@@ -63,53 +77,18 @@
6377
showDeleteList = false;
6478
}
6579
66-
// ==== Előkalkulált lépésszám ====
67-
onMount(() => {
68-
totalSteps.set(0);
69-
});
70-
7180
// ==== Késleltetés és vezérlés ====
72-
function log(message: string) {
73-
consoleLog.update((logs) => [...logs, message]);
74-
currentStep.update((n) => n + 1);
75-
}
76-
function delay(ms: number) {
77-
return new Promise((resolve) => setTimeout(resolve, ms));
78-
}
79-
function waitUntilResume(): Promise<void> {
80-
return new Promise((resolve) => {
81-
const unsub = resumeSignal.subscribe(() => {
82-
if (get(algorithmStatus) === 'running') {
83-
unsub();
84-
resolve();
85-
}
86-
});
87-
});
88-
}
89-
function waitUntilRestart(): Promise<void> {
90-
return new Promise((resolve) => {
91-
const unsub = resumeSignal.subscribe(() => {
92-
if (get(algorithmStatus) === 'idle') {
93-
consoleLog.set([]);
94-
currentStep.set(0);
95-
96-
usedCoins = [];
97-
dpTable = [];
98-
99-
unsub();
100-
resolve();
101-
}
102-
});
103-
});
104-
}
105-
async function pauseIfNeeded() {
106-
if (get(algorithmStatus) === 'paused') {
107-
await waitUntilResume();
108-
}
109-
}
11081
async function restartAlgorithm() {
11182
if (get(algorithmStatus) === 'finished') {
112-
await waitUntilRestart();
83+
return new Promise((resolve) => {
84+
const unsub = resumeSignal.subscribe(() => {
85+
if (get(algorithmStatus) === 'idle') {
86+
resetParameters();
87+
unsub();
88+
resolve();
89+
}
90+
});
91+
});
11392
}
11493
}
11594
@@ -125,11 +104,13 @@
125104
showDeleteList = false;
126105
127106
let amount = Math.floor(moneyToExchange);
107+
totalSteps.set(amount);
128108
let coins = exchangeCoins.map((c) => Math.floor(c));
129-
dpTable = [];
130109
131110
await coinExchange(amount, coins);
132111
112+
activeLine.set({ start: -1, end: -1 });
113+
133114
consoleLog.update((logs) => [...logs, 'A futás befejeződött!']);
134115
algorithmStatus.set('finished');
135116
await restartAlgorithm();
@@ -144,30 +125,31 @@
144125
145126
dp[0] = 0;
146127
147-
totalSteps.set(amount);
148-
149128
for (let i = 1; i <= amount; i++) {
150-
activeLine.set(6);
151-
await pauseIfNeeded();
129+
activeLine.set({ start: 7, end: 7 });
152130
await delay(700 - get(speed) * 8);
131+
await pauseIfNeeded();
132+
153133
for (let coin of coins) {
154-
activeLine.set(7);
155-
await pauseIfNeeded();
134+
activeLine.set({ start: 8, end: 8 });
156135
await delay(700 - get(speed) * 8);
136+
await pauseIfNeeded();
137+
157138
if (i - coin >= 0 && dp[i - coin] + 1 < dp[i]) {
158139
dp[i] = dp[i - coin] + 1;
159140
lastCoin[i] = coin;
160-
activeLine.set(9);
161-
await pauseIfNeeded();
141+
activeLine.set({ start: 10, end: 13 });
162142
await delay(700 - get(speed) * 8);
143+
await pauseIfNeeded();
163144
}
164145
}
165146
166147
dpTable = [...dpTable, { index: i, value: dp[i], coin: lastCoin[i] }];
167148
168-
activeLine.set(12);
169-
await pauseIfNeeded();
149+
activeLine.set({ start: 16, end: 16 });
170150
await delay(700 - get(speed) * 8);
151+
await pauseIfNeeded();
152+
171153
log(`Összeg: ${i}, Minimum érme: ${dp[i]}, Utolsó érme: ${lastCoin[i]}`);
172154
}
173155
@@ -176,18 +158,17 @@
176158
while (current > 0) {
177159
let coin = lastCoin[current];
178160
if (coin === -1) {
179-
activeLine.set(20);
180-
await pauseIfNeeded();
161+
activeLine.set({ start: 24, end: 26 });
181162
await delay(700 - get(speed) * 8);
163+
await pauseIfNeeded();
164+
182165
consoleLog.update((logs) => [...logs, 'Nem lehet pontosan felváltani!']);
183166
break;
184167
}
185168
usedCoins.push(coin);
186169
current -= coin;
187170
}
188171
189-
activeLine.set(-1);
190-
191172
consoleLog.update((logs) => [...logs, `Minimum érme szám: ${usedCoins.length}`]);
192173
consoleLog.update((logs) => [...logs, `Felhasznált érmék: ${usedCoins}`]);
193174
}
@@ -199,18 +180,22 @@
199180
let dp = Array(amount + 1).fill(Infinity);
200181
let lastCoin = Array(amount + 1).fill(-1);
201182
dp[0] = 0;
183+
202184
for (let i = 1; i <= amount; i++) {
203185
for (let coin of coins) {
186+
204187
if (i - coin >= 0 && dp[i - coin] + 1 < dp[i]) {
205188
dp[i] = dp[i - coin] + 1;
206189
lastCoin[i] = coin;
207190
}
191+
208192
}
209193
dpTable = [...dpTable, { index: i, value: dp[i], coin: lastCoin[i] }];
210194
}
211195
212196
usedCoins = [];
213197
let current = amount;
198+
214199
while (current > 0) {
215200
let coin = lastCoin[current];
216201
if (coin === -1) {
@@ -219,6 +204,7 @@
219204
usedCoins.push(coin);
220205
current -= coin;
221206
}
207+
222208
}`
223209
);
224210
</script>
@@ -227,22 +213,27 @@
227213
<div class="custom-input">
228214
<div>
229215
<label for="order">Felváltandó:</label>
230-
<input id="order" bind:value={moneyToExchange} />
216+
<input
217+
id="order"
218+
type="number"
219+
disabled={$algorithmStatus !== 'idle'}
220+
bind:value={moneyToExchange}
221+
/>
231222
</div>
232223

233224
<div class="custom-buttons">
234225
<div class="button-group">
235-
<button on:click={openInsertForm}>Beszúrás</button>
226+
<button disabled={$algorithmStatus !== 'idle'} on:click={openInsertForm}>Beszúrás</button>
236227
{#if showInsertForm}
237-
<div class="dropdown">
228+
<div class="dropdown insert-dropdown">
238229
<input type="number" placeholder="Érme értéke" bind:value={newCoin} />
239230
<button on:click={insertNewCoin}>Hozzáadás</button>
240231
</div>
241232
{/if}
242233
</div>
243234

244235
<div class="button-group">
245-
<button on:click={openDeleteList}>Kivétel</button>
236+
<button disabled={$algorithmStatus !== 'idle'} on:click={openDeleteList}>Kivétel</button>
246237
{#if showDeleteList}
247238
<div class="dropdown">
248239
{#each exchangeCoins as coin, index}
@@ -260,7 +251,6 @@
260251
<!-- ==== Komponens markup ==== -->
261252
<div class="algorithm-container">
262253
<Controls {currentStep} {totalSteps} on:start={startAlgorithm} />
263-
<div class="tag">Vászon</div>
264254
<div class="coin-visual">
265255
<div class="left-container">
266256
<div>Felhasználható</div>
@@ -309,14 +299,6 @@
309299

310300
<!-- ==== Stílus ==== -->
311301
<style>
312-
.tag {
313-
display: inline-block;
314-
top: 0;
315-
left: 0;
316-
background-color: #484848;
317-
color: white;
318-
padding: 3px;
319-
}
320302
.coin-visual {
321303
display: flex;
322304
gap: 40px;
@@ -353,13 +335,19 @@
353335
border-bottom: 3px solid #505050;
354336
}
355337
.custom-input input {
338+
text-align: center;
339+
font-size: 1rem;
356340
width: 55px;
357341
padding: 0.5rem;
358-
margin-right: 10px;
359342
border-radius: 5px;
360343
background-color: #2f2f2f;
361344
border: 3px solid #505050;
362345
}
346+
.custom-input input:disabled {
347+
opacity: 0.6;
348+
cursor: not-allowed;
349+
border-color: #3a3a3a;
350+
}
363351
.custom-input button {
364352
padding: 0.5rem 1rem;
365353
background-color: #444;
@@ -371,6 +359,11 @@
371359
.custom-input button:hover {
372360
background-color: #5cb85c;
373361
}
362+
.custom-input button:disabled {
363+
opacity: 0.6;
364+
cursor: not-allowed;
365+
border-color: #3a3a3a;
366+
}
374367
.custom-input label {
375368
width: 150px;
376369
text-align: center;
@@ -415,6 +408,9 @@
415408
color: white;
416409
border: 1px solid #666;
417410
}
411+
.insert-dropdown {
412+
align-items: center;
413+
}
418414
.delete-item {
419415
display: flex;
420416
flex-direction: column;

0 commit comments

Comments
 (0)
pFad - Phonifier reborn

Pfad - The Proxy pFad of © 2024 Garber Painting. All rights reserved.

Note: This service is not intended for secure transactions such as banking, social media, email, or purchasing. Use at your own risk. We assume no liability whatsoever for broken pages.


Alternative Proxies:

Alternative Proxy

pFad Proxy

pFad v3 Proxy

pFad v4 Proxy