blob: 4953033b58b0a1105d3b2945faa5228158daff18 (
plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
|
@extends('template')
@section('head')
<h1>Blood Splatters</h1>
@vite(['resources/css/style.css', 'resources/css/jstoys.css', 'resources/js/blood.js'])
@endsection
@section('body')
<div class="action-buttons">
<button id="clearBtn">Clear Canvas</button>
<button id="randomSprayBtn">Random Spray</button>
<button id="burstBtn">Blood Burst</button>
<button id="pauseBtn">Pause</button>
</div>
<canvas id="sprayCanvas" width="1200" height="800"></canvas>
<div class="controls">
<div class="control-group">
<label for="gravitySlider">Gravity</label>
<input type="range" id="gravitySlider" min="0.01" max="0.5" value="0.15" step="0.01">
</div>
<div class="control-group">
<label for="viscositySlider">Viscosity</label>
<input type="range" id="viscositySlider" min="0.75" max="0.99" value="0.92" step="0.01">
</div>
<div class="control-group">
<label for="particleCountSlider">Particle Count</label>
<input type="range" id="particleCountSlider" min="10" max="300" value="100">
</div>
<div class="control-group">
<label for="particleSizeSlider">Particle Size</label>
<input type="range" id="particleSizeSlider" min="1" max="8" value="3">
</div>
<div class="control-group">
<label for="sprayForceSlider">Spray Force</label>
<input type="range" id="sprayForceSlider" min="1" max="20" value="10">
</div>
<div class="control-group">
<label for="splatterSizeSlider">Splatter Size</label>
<input type="range" id="splatterSizeSlider" min="1" max="10" value="5">
</div>
<div class="control-group">
<label for="spreadSlider">Spread</label>
<input type="range" id="spreadSlider" min="0" max="1" value="0.3" step="0.05">
</div>
<div class="control-group">
<label for="dripToggle">Enable Drips</label>
<input type="checkbox" id="dripToggle" checked>
</div>
<div class="control-group">
<label for="poolToggle">Enable Pooling</label>
<input type="checkbox" id="poolToggle" checked>
</div>
<div class="control-group">
<label for="colorVariationSlider">Color Variation</label>
<input type="range" id="colorVariationSlider" min="0" max="50" value="15">
</div>
</div>
<p>Click and drag on the canvas to create blood spray.</p>
@endsection
|
