-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
148 lines (138 loc) · 6.95 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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta
http-equiv="Content-Security-Policy"
content="
default-src 'self';
img-src 'self' https://*.scratch.mit.edu/;
object-src 'none';
"
/>
<meta name="referrer" content="strict-origin-when-cross-origin" />
<title>D-ScratchNinja - Project Gallery</title>
<link href="index.css" rel="stylesheet" />
<script src="index.js" type="module"></script>
</head>
<template id="template-project_card">
<div class="card">
<a class="style_as_text" target="_blank">
<img class="image-thumbn" alt="Project thumbnail" decoding="async" loading="lazy">
<span class="text-label_large">title</span>
</a>
</div>
</template>
<body>
<button class="accent floating_button skip_button">Skip to content</button>
<div id="main_container">
<header>
<div>
<div>
<h2><a href="https://scratch.mit.edu/users/D-ScratchNinja" class="pink">D-ScratchNinja</a>'s Scratch projects</h2>
</div>
<div>
<a href="#about" title="Content, privacy, safety, and other info">About & Info</a>
<a href="#" id="btn-random" title="Pick one for me" aria-label="Random project" class="style_as_text emoji_button">🎲</a>
<button id="btn-filter" aria-controls="filters_row" aria-label="Show search and filters" aria-pressed="true">Search or filter...</button>
</div>
</div>
<div id="filters_row">
<div class="item-row full">
<select title="Category">
<option value="">All</option>
<option value="featured">Featured</option>
<option value="animation">Animations</option>
<option value="art">Art</option>
<option value="fun">Fun</option>
<option value="game">Games</option>
<option value="information">Information</option>
<option value="learning">Learning & Tutorials</option>
<option value="library">Libraries & Engines</option>
<option value="music">Music</option>
<option value="tool">Tools & Utilities</option>
</select>
<select data-hidden data-if="game" title="Genre">
<option value="">All</option>
<option value="action">Action</option>
<!-- option value="adventure">Adventure</option -->
<option value="arcade">Arcade</option>
<!-- option value="board">Board Game</option -->
<option value="casual">Casual</option>
<option value="educational">Educational</option>
<option value="multiplayer">Multiplayer</option>
<option value="party">Party</option>
<option value="platformer">Platformer</option>
<option value="puzzle">Puzzle</option>
<option value="racing">Racing</option>
<option value="simulation">Simulation</option>
<option value="strategy">Strategy</option>
<option value="trivia">Trivia</option>
<option value="word">Word</option>
<option value="fast">Fast-Paced</option>
<option value="slow">Slow-Paced</option>
</select>
</div>
<form><input placeholder="Search" type="text" autocomplete="off" maxlength="50" enterkeyhint="search" spellcheck="false"></form>
</div>
</header>
<main>
<h4 hidden="hidden" id="no_results" class="center" tabindex="0">No results.</h4>
<div id="list" role="main" class="list-grid_results"></div>
</main>
<footer>
<div class="disclaimer center" role="contentinfo" id="about">
<p>
This gallery is curated and updated by hand, so not all of my projects are shown here. You can find them all
<a href="https://scratch.mit.edu/users/D-ScratchNinja/projects/">on Scratch</a>.
</p>
<p>
The content showcased by this website is available on Scratch, a coding language and online community. Scratch
is available for free at <a href="https://scratch.mit.edu/" target="_blank">scratch.mit.edu</a> and is a project
of the nonprofit organization <a href="https://www.scratchfoundation.org/" target="_blank">Scratch Foundation</a>.
</p>
<p>
All user-generated content shared to Scratch is available under a
<a href="https://creativecommons.org/licenses/by-sa/2.0/" target="_blank">Creative Commons Attribution-ShareAlike
2.0</a> license.
</p>
<p id="links">
<a href="https://scratch.mit.edu/users/D-ScratchNinja">D-ScratchNinja</a> · <a href="#" data-action="modal-privacy">Privacy & Safety</a>
</p>
</div>
</footer>
</div>
<button class="floating_button top_button">Back to top</button>
<dialog class="center">
<h2>Privacy</h2>
<p>
I don't collect any analytics or usage data from this website. It does, however, make requests to Scratch's database to
fetch project thumbnails. See <a href="https://scratch.mit.edu/privacy_policy/" target="_blank">Scratch's privacy
policy</a> for more information.
</p>
<p>
Some of the Scratch projects feature Cloud variables, which are stored on Scratch's server and update live. This can
potentially result in data being collected depending on the use case. Only users logged into a Scratch account with the
"Scratcher" status can use Cloud variables, otherwise they will function as normal variables, and very limited data is able
to be collected with Scratch - nothing more than usernames, timestamps, set language, and in-project interactions. See my
<a href="https://scratch.mit.edu/projects/964120169" target="_blank">Cloud variable privacy policy on Scratch</a> for more
information. For information on how <i>Scratch</i> handles Cloud variables, see
<a href="https://scratch.mit.edu/faq#clouddata" target="_blank">Scratch's FAQ</a> and
<a href="https://scratch.mit.edu/privacy_policy/" target="_blank">Scratch's privacy policy</a>.
</p>
<h2>Safety</h2>
<p>
Scratch's target audience is kids, so they have strict
<a href="https://scratch.mit.edu/community_guidelines/" target="_blank">Community Guidelines</a>
to keep the platform a safe environment. Therefore, all Scratch projects listed on this website are kid-appropriate.
</p>
<p>
Users can interact with each other using Cloud variables but
<a href="https://scratch.mit.edu/faq#clouddata:~:text=Can%20I%20make%20chat,on%20the%20Scratch%20website."
target="_blank">free communication features are not allowed</a>.
</p>
<button autofocus>OK</button>
</dialog>
</body>
</html>