-
Notifications
You must be signed in to change notification settings - Fork 6
/
Copy pathindex.html
100 lines (87 loc) · 4.56 KB
/
index.html
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
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
<!DOCTYPE html>
<html>
<head>
<meta charset=utf-8>
<title>Marblizer</title>
<meta name="description" content="Interactive paper marbling simulation. Create awesome patterns.">
<meta name="author" content="Nick Walker"/>
<meta property="og:image" content="https://marblizer.nickwalker.us/media/images/og-banner.jpg"/>
<link rel="canonical" href="https://marblizer.nickwalker.us/">
<link rel="shortcut icon" href="/media/images/favicon.png"/>
<link rel="apple-touch-icon" href="/media/images/apple-touch-icon.png">
<link rel="mask-icon" href="/media/images/mask.svg" color="#891920">
<link rel="stylesheet" href="media/css/style.css"/>
<link rel="stylesheet" href="media/css/help.css">
<script src="/dist/index.js"></script>
<script
src="https://code.jquery.com/jquery-3.1.1.min.js"
integrity="sha256-hVVnYaiADRTO2PzUGmuLJr8BLUSjGIZsDYGmIJLv2b8="
crossorigin="anonymous"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/spectrum/1.8.0/spectrum.js"></script>
<link rel="stylesheet" type="text/css" href="//cdnjs.cloudflare.com/ajax/libs/spectrum/1.8.0/spectrum.min.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/codemirror/6.65.7/codemirror.min.css" integrity="sha512-uf06llspW44/LZpHzHT6qBOIVODjWtv4MxCricRxkzvopAlSWnTf6hpZTFxuuZcuNE9CBQhqE0Seu1CoRk84nQ==" crossorigin="anonymous" referrerpolicy="no-referrer" />
<script>
window.goatcounter = {
path: function (p) {
return ".marblizer/" + p;
},
}
// Only run stats on live site
if (window.location.hostname !== "marblizer.nickwalker.us") {
window.goatcounter = undefined
}
</script>
<script async
data-goatcounter="https://nickwalker.us/stats/count" data-proofer-ignore src="https://nickwalker.us/stats/count.js"></script>
</head>
<body>
<div id="workspace">
</div>
<div class="modal-container" style="display:none;">
<div id="operations-input" class="marbling-pane center-pane">
<ul class="button-section">
<li class="run-button tool" title="Execute">▶</li>
<li class="get-url-button tool" title="Share URL"><img src="media/images/save.svg"></li>
<li class="close-button tool" title="Close">X</li>
</ul>
<div class="input-container"></div>
</div>
</div>
<div id="marbling-tools" class="marbling-pane">
<ul class="button-section" id="tools">
<li class="drop-tool tool" title="Ink drop"><img src="media/images/drop.svg"/></li>
<li class="spatter-tool tool" title="Spatter"><img src="media/images/spatter.svg"/></li>
<li class="tine-tool tool" title="Tine line"><img src="media/images/tine-line.svg"/></li>
<li class="wavy-tine-tool tool" title="Wavy "><img src="media/images/wavy-tine.svg"></li>
<li class="circular-tine-tool tool" title="Circular tine-line"><img src="media/images/circular-tine.svg"></li>
<li class="vortex-tool tool" title="Vortex"><img src="media/images/vortex.svg"/></li>
</ul>
<hr class="tools-divider">
<ul class="button-section options" id="options">
<li class="show-script-editor tool" title="Script editor"><img src="media/images/script.svg"></li>
<li class="save-image tool" title="Save image"><img src="media/images/save.svg"></li>
<li class="show-field tool" title="Show tool force field"><img src="media/images/field.svg"></li>
<li class="reset" title="Reset canvas"><img src="media/images/reset.svg"></li>
<li class="help" title="Help"><img src="media/images/help.svg"></li>
<li class="show-keyboard-shortcuts" title="Show keyboard shortcuts"><img src="media/images/shortcuts.svg"></li>
</ul>
<hr class="tools-divider">
<div id="colors">
<div id="color-inputs">
<input type="color" class="color-picker foreground" value="#891920" title="Foreground color">
<input type="color" class="color-picker background" value="#DCD2D2" title="Background color">
</div>
<ul class="button-section" id="recent-colors">
<li class="swatch-0"></li>
<li class="swatch-1"></li>
<li class="swatch-2"></li>
<li class="swatch-3"></li>
<li class="swatch-4"></li>
</ul>
</div>
<div id="logo"><img src="media/images/logo.svg"/></div>
</div>
<script src="https://cdnjs.cloudflare.com/ajax/libs/svg.js/2.3.6/svg.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/lz-string/1.4.4/lz-string.min.js"></script>
</body>
</html>