-
Notifications
You must be signed in to change notification settings - Fork 871
/
index.html
156 lines (140 loc) · 8.11 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
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
<!doctype html>
<html prefix="og: http://ogp.me/ns#" itemscope itemtype="http://schema.org/CreativeWork">
<head>
<meta charset="utf-8">
<title>Patatap</title>
<meta name="keywords" content="Synesthesia, Portable Animation Sound Kit, Visual Music, Creative Soundscapes, Interactive Art, Music Creation Tool, Animation and Sound Kit, Synesthetic Beats, Colorful Visual Animations, Jono Brandel, Lullatone, Musical Creativity, Visual Sound Kit Application, Engage Senses Creation, Digital Art Creation, Interactive Music Experience, Cross-disciplinary Art, Aesthetic Expression Synesthesia, Audio-Visual Experience, Synesthetic Art Tool, iOS App, iPhone App, iPad App, App, Mobile App">
<meta name="author" content="jonobr1">
<!-- Sharing -->
<meta name="name" content="Patatap">
<meta name="image" content="http://www.patatap.com/images/thumbnail.png">
<meta name="description" content="Patatap is a portable animation and sound kit. With the touch of a finger create melodies charged with moving shapes. Warning: contains flashing images.">
<meta name="twitter:card" content="summary">
<meta name="twitter:title" content="Patatap">
<meta name="twitter:description" content="Patatap is a portable animation and sound kit. With the touch of a finger create melodies charged with moving shapes. Warning: contains flashing images.">
<meta name="twitter:creator" content="@jonofyi">
<meta name="twitter:image:src" content="http://www.patatap.com/images/thumbnail.png">
<meta name="twitter:app:name:iphone" content="Patatap">
<meta name="twitter:app:name:ipad" content="Patatap">
<meta name="twitter:app:url:iphone" content="https://itunes.apple.com/us/app/patatap/id880626868?mt=8">
<meta name="twitter:app:url:ipad" content="https://itunes.apple.com/us/app/patatap/id880626868?mt=8">
<meta name="twitter:app:id:iphone" content="id880626868">
<meta name="twitter:app:id:ipad" content="id880626868">
<!-- <meta name="twitter:app:name:googleplay" content="Patatap">
<meta name="twitter:app:id:googleplay" content="com.jonobr1.Patatap">
<meta name="twitter:app:url:googleplay" content="https://play.google.com/store/apps/details?id=com.jonobr1.Patatap"> -->
<meta itemprop="name" content="Patatap">
<meta itemprop="description" content="Patatap is a portable animation and sound kit. With the touch of a finger create melodies charged with moving shapes. Warning: contains flashing images.">
<meta itemprop="image" src="http://www.patatap.com/images/thumbnail.png">
<meta property="og:title" content="Patatap">
<meta property="og:type" content="website">
<meta property="og:image" content="http://www.patatap.com/images/thumbnail.png"/>
<meta property="og:site_name" content="Patatap">
<meta property="og:description" content="Patatap is a portable animation and sound kit. With the touch of a finger create melodies charged with moving shapes. Warning: contains flashing images.">
<!-- iOS specific catches -->
<meta name="mobile-web-app-capable" content="yes">
<meta name="viewport" content="width=device-width, user-scalable=no">
<meta name="format-detection" content="telephone=no">
<!-- icons -->
<link rel="apple-touch-icon" href="/images/apple-touch-icon.png"/>
<link rel="icon" href="/images/favicon.ico" />
<link rel="canonical" href="https://patatap.com/" />
<!-- styles -->
<link rel="stylesheet" media="screen" type="text/css" href="/styles/main.css" />
</head>
<body style="background: rgb(181, 181, 181);">
<h1 style="width: 0; height: 0; overflow: hidden;">
Patatap is a portable animation and sound kit. With the touch of a finger create melodies charged with moving shapes. Warning: contains flashing images.
</h1>
<div id="credits" style="display: none;">
<ul>
<li>
<a href="http://patatap.com" target="_blank" style="border-bottom: 0;"><strong>Patatap</strong></a>
</li>
<li>
<a href="http://typatone.com" target="_blank">Typatone</a>
</li>
<li>
<a href="http://curaturae.com" target="_blank">Curaturae</a>
</li>
<li>
<a href="mailto:inquiries@patatap.com">Inquiries</a>
</li>
<li>
<a id="merchandise-button" href="#" title="Support the creators of Patatap">Merchandise</a>
</li>
<li>
<a id="jonobr1" href="http://jono.fyi/" target="_blank">jonobr1</a> + <a id="lullatone" href="http://lullatone.com/" target="_blank">lullatone</a>
</li>
</ul>
</div>
<div id="content"></div>
<div id="hint" style="display: none;">
<p class="message"></p>
<br /><br />
<p class="midi-connections" style="display: none;"></p>
<a class="newsletter-signup" href="https://cdn.forms-content-1.sg-form.com/5d1f7f0a-6002-11ef-901c-823e0ba7573a" target="_blank"></a>
<a class="ios-app-store" href="https://itunes.apple.com/us/app/patatap/id880626868?ls=1&mt=8" target="_blank"></a>
</div>
<div id="merchandise" style="z-index: -1; opacity: 0.0;">
<div class="container">
<div id="close-merchandise">×</div>
<br />
<div class="vimeo">
<iframe width="560" height="315" src="https://www.youtube.com/embed/o5igwpQIpi4?controls=1" title="Patatap" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
</div>
<div class="attribution">
<p>
Support the makers of Patatap:
</p>
<!-- Insert iOS App Store Button here -->
<div class="app-cta-container">
<a class="newsletter-signup" href="https://cdn.forms-content-1.sg-form.com/5d1f7f0a-6002-11ef-901c-823e0ba7573a" target="_blank"></a>
<a class="ios-app-store" href="https://itunes.apple.com/us/app/patatap/id880626868?ls=1&mt=8" target="_blank"></a>
</div>
<br />
<br />
<ul>
<li class="music">
<iframe src="https://open.spotify.com/embed/album/1vYyWMC997G9VkZwHVxwic" width="315" height="560" frameborder="0" allowtransparency="true" allow="encrypted-media"></iframe>
</li>
<li class="music">
<iframe src="https://open.spotify.com/embed/album/3AWATaNWvlDlTOmlemNQDw" width="315" height="560" frameborder="0" allowtransparency="true" allow="encrypted-media"></iframe>
</li>
</ul>
<br />
<p>
If you like Patatap you might like our other projects <a href="http://typatone.com" target="_blank">Typatone</a> and <a href="http://curaturae.com" target="_blank">Curaturae</a>.
</p>
<p>
Patatap was made with <a href="https://two.js.org/" target="_blank">Two.js</a>: a two dimensional drawing api for the web.
</p>
<p class="nb">
<a href="http://lullatone.com/" target="_blank">lullatone</a> · <a href="http://jono.fyi/" target="_blank">jono</a> · <a class="mailto" href="mailto:inquiries@patatap.com">inquiries</a> · <a href="/conversion-table.html">conversion table</a> · <a href="/privacy-policy.html" target="_blank">terms</a>
</p>
<p class="nb">
© 2014—2024
</p>
</div>
</div>
</div>
<div id="lobby">
<div id="loader"></div>
<div id="asset-info">
<span id="loaded">0</span> / <span id="total-assets">26</span>
</div>
</div>
<div class="scripts" style="display: none;">
<script src="./third-party/url.js"></script>
<script src="./main.min.js"></script>
<!-- Google tag (gtag.js) -->
<script async src="https://www.googletagmanager.com/gtag/js?id=G-FW06G1ZDXV"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', 'G-FW06G1ZDXV');
</script>
</div>
</body>
</html>