mirror of
https://github.com/placeAtlas/atlas.git
synced 2024-12-25 07:54:15 +01:00
254 lines
14 KiB
HTML
254 lines
14 KiB
HTML
<!--
|
|
========================================================================
|
|
The /r/place Atlas
|
|
|
|
An Atlas of Reddit's /r/place, with information to each
|
|
artwork of the canvas provided by the community.
|
|
|
|
Copyright (C) 2017 Roland Rytz <roland@draemm.li>
|
|
Licensed under the GNU Affero General Public License Version 3
|
|
This program is free software: you can redistribute it and/or modify
|
|
it under the terms of the GNU Affero General Public License as
|
|
published by the Free Software Foundation, either version 3 of the
|
|
License, or (at your option) any later version.
|
|
This program is distributed in the hope that it will be useful,
|
|
but WITHOUT ANY WARRANTY; without even the implied warranty of
|
|
MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.
|
|
For more information, see:
|
|
http://place-atlas.stefanocoding.me/license.txt
|
|
|
|
========================================================================
|
|
-->
|
|
|
|
<!DOCTYPE html>
|
|
<html>
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<title>The 2022 /r/place Atlas</title>
|
|
<meta name="description" content="An interactive map of Reddit's 2022 /r/place, with information to each artwork of the canvas.">
|
|
<meta name="author" content="Roland Rytz (2022 by Stefano#7366)">
|
|
<meta name="keywords" content="reddit, /r/place 2022">
|
|
<meta name="application-name" content="The /r/place Atlas 2022">
|
|
<meta name="robots" content="index, follow">
|
|
|
|
<!-- <meta name="google-site-verification" content="gZGHpBSMzffAbIn0qB8b00We6EwSGkDTfDoQVv-NWss"/> -->
|
|
|
|
<meta name="viewport" content="width=device-width, height=device-height, initial-scale=1, minimum-scale=1, maximum-scale=1, user-scalable=no, shrink-to-fit=no">
|
|
<meta name="mobile-web-app-capable" content="yes">
|
|
|
|
<link href="./_css/style.css?version=1.0.33" rel="stylesheet" type="text/css" media="all">
|
|
|
|
<script type="application/ld+json">
|
|
{
|
|
"@context": "http://schema.org",
|
|
"@type": "WebSite",
|
|
"name": "The 2022 /r/place Atlas",
|
|
"url": "http://place-atlas.stefanocoding.me/",
|
|
"author": {
|
|
"@type": "Person",
|
|
"@id": "#Codixer",
|
|
"name": "Stefano Haagmans",
|
|
"email": "stefano@stefanocoding.me",
|
|
"url": "https://stefanocoding.me/",
|
|
"sameAs": "https://stefanocoding.me/",
|
|
"familyName": "Haagmans",
|
|
"givenName": "Stefano",
|
|
"alternateName": "Codixer",
|
|
"gender": "Male",
|
|
"nationality": "Netherlands"
|
|
},
|
|
"copyrightHolder": { "@id": "#RolandRytz" },
|
|
"copyrightYear": 2017,
|
|
"license": "http://place-atlas.stefanocoding.me/license.txt",
|
|
"inLanguage": "English",
|
|
"isAccessibleForFree": true,
|
|
"keywords": "reddit, /r/place",
|
|
"thumbnailUrl": "http://place-atlas.stefanocoding.me/_img/logo.png",
|
|
"logo": "http://place-atlas.stefanocoding.me/_img/logo.png",
|
|
"description": "An interactive map of Reddit's /r/place, with information to each artwork of the canvas. Originally created by Roland Rytz (2022 by Stefano#7366)..",
|
|
}
|
|
</script>
|
|
</head>
|
|
<body>
|
|
<div id="wrapper">
|
|
<header>
|
|
<a href="./">
|
|
<img id="logo" src="./_img/logo.png" height="50" width="50" alt="Logo">
|
|
<!-- If you wonder why I shrink the image in html,
|
|
it's because this is the image that will be used
|
|
by reddit and the like as the thumbnail for the site.
|
|
The original is only 5.9kB, which wouldn't get much
|
|
smaller by reducing the actualy size. -->
|
|
<h1 id="title">The 2022 /r/place Atlas</h1>
|
|
</a>
|
|
|
|
</header>
|
|
|
|
<div id="container">
|
|
<div id="loading">
|
|
<div id="loadingContent">
|
|
<div></div><br>
|
|
<span> Hang on...</span>
|
|
<noscript>
|
|
<p>Sorry, you need JavaScript to view the Atlas.</p>
|
|
<p>All JavaScript on this site is licensed under either the MIT or AGPL license.</p>
|
|
<p><a href="https://github.com/placeAtlas/atlas">See the source on GitHub</a></p>
|
|
</noscript>
|
|
</div>
|
|
</div>
|
|
<canvas id="linesCanvas"></canvas>
|
|
<div id="innerContainer">
|
|
<canvas id="highlightCanvas" width="2000" height="2000"></canvas>
|
|
|
|
<img id="image" width="2000" height="2000" alt="Canvas of /r/place in the state of when the experiment was concluded." />
|
|
</div>
|
|
</div>
|
|
|
|
<div id="entriesListContainer">
|
|
<nav>
|
|
<a id="aboutLink" href="./about.html">About</a>
|
|
<a id="drawLink" href="./index.html?mode=draw">Draw</a>
|
|
<a id="toggleMode" onclick="return changeOverlapMode()">Overlap</a>
|
|
<button title="Discord" onclick="window.location.href='https://discord.gg/pJkm23b2nA'">
|
|
<img class="Discord" alt="Discord Logo" src="./_img/discord.svg">
|
|
</button>
|
|
<button title="Donate!" id="donateButton">
|
|
<img alt="Donate" src="data:image/svg+xml;utf8,%3Csvg%0A%20%20%20xmlns%3Adc%3D%22http%3A//purl.org/dc/elements/1.1/%22%0A%20%20%20xmlns%3Acc%3D%22http%3A//creativecommons.org/ns%23%22%0A%20%20%20xmlns%3Ardf%3D%22http%3A//www.w3.org/1999/02/22-rdf-syntax-ns%23%22%0A%20%20%20xmlns%3Asvg%3D%22http%3A//www.w3.org/2000/svg%22%0A%20%20%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%0A%20%20%20version%3D%221.1%22%0A%20%20%20width%3D%2263.97776%22%0A%20%20%20height%3D%2263.985764%22%0A%20%20%20id%3D%22svg2%22%3E%0A%20%20%3Cdefs%0A%20%20%20%20%20id%3D%22defs4%22%20/%3E%0A%20%20%3Cmetadata%0A%20%20%20%20%20id%3D%22metadata7%22%3E%0A%20%20%20%20%3Crdf%3ARDF%3E%0A%20%20%20%20%20%20%3Ccc%3AWork%0A%20%20%20%20%20%20%20%20%20rdf%3Aabout%3D%22%22%3E%0A%20%20%20%20%20%20%20%20%3Cdc%3Aformat%3Eimage/svg+xml%3C/dc%3Aformat%3E%0A%20%20%20%20%20%20%20%20%3Cdc%3Atype%0A%20%20%20%20%20%20%20%20%20%20%20rdf%3Aresource%3D%22http%3A//purl.org/dc/dcmitype/StillImage%22%20/%3E%0A%20%20%20%20%20%20%20%20%3Cdc%3Atitle%3E%3C/dc%3Atitle%3E%0A%20%20%20%20%20%20%3C/cc%3AWork%3E%0A%20%20%20%20%3C/rdf%3ARDF%3E%0A%20%20%3C/metadata%3E%0A%20%20%3Cg%0A%20%20%20%20%20transform%3D%22translate%28-239.44047%2C-363.22698%29%22%0A%20%20%20%20%20id%3D%22layer1%22%3E%0A%20%20%20%20%3Cpath%0A%20%20%20%20%20%20%20d%3D%22m%20290.96332%2C384.19885%20c%20-0.59424%2C-6.27896%20-6.01049%2C-8.39164%20-12.8518%2C-9.00126%20l%200.0128%2C-8.70824%20-5.30062%2C-0.007%20-0.0123%2C8.47872%20c%20-1.39346%2C-0.002%20-2.81788%2C0.0235%20-4.23308%2C0.0496%20l%200.0135%2C-8.53485%20-5.29778%2C-0.008%20-0.0149%2C8.70575%20c%20-1.14765%2C0.0217%20-2.27469%2C0.0414%20-3.3736%2C0.0405%20l%20-5.3e-4%2C-0.0271%20-7.31086%2C-0.0134%20-0.007%2C5.66124%20c%200%2C0%203.91442%2C-0.0688%203.84925%2C0.003%202.14703%2C0.004%202.84397%2C1.25133%203.04562%2C2.32724%20l%20-0.0143%2C9.92049%20c%200.14815%2C0.001%200.34143%2C0.008%200.56022%2C0.0378%20-0.17659%2C-3e-5%20-0.36561%2C-0.002%20-0.55995%2C-1.2e-4%20l%20-0.022%2C13.89765%20c%20-0.0952%2C0.67556%20-0.49402%2C1.75232%20-1.99407%2C1.75269%200.0678%2C0.0602%20-3.85316%2C-0.007%20-3.85316%2C-0.007%20l%20-1.06259%2C6.32874%206.89801%2C0.01%20c%201.28367%2C0.003%202.54669%2C0.0271%203.78665%2C0.0368%20l%20-0.0109%2C8.80736%205.29494%2C0.009%200.0128%2C-8.71427%20c%201.45379%2C0.0322%202.86073%2C0.0459%204.23429%2C0.0466%20l%20-0.0152%2C8.67412%205.30061%2C0.007%200.0147%2C-8.79173%20c%208.91219%2C-0.49805%2015.1527%2C-2.73385%2015.93965%2C-11.10113%200.63533%2C-6.73752%20-2.53%2C-9.74895%20-7.5868%2C-10.97123%203.07554%2C-1.56033%205.00104%2C-4.31475%204.55848%2C-8.90928%20z%20m%20-7.44387%2C18.82121%20c%20-0.007%2C6.58182%20-11.27551%2C5.81643%20-14.86789%2C5.81449%20l%200.0187%2C-11.66923%20c%203.59343%2C0.006%2014.85983%2C-1.01023%2014.84919%2C5.85474%20z%20m%20-2.44078%2C-16.46738%20c%20-0.0106%2C5.98811%20-9.40836%2C5.27536%20-12.40064%2C5.27116%20l%200.016%2C-10.58348%20c%202.99229%2C0.004%2012.39322%2C-0.93337%2012.38461%2C5.31232%20z%22%0A%20%20%20%20%20%20%20id%3D%22path3010%22%0A%20%20%20%20%20%20%20style%3D%22fill%3A%23ffffff%22%20/%3E%0A%20%20%3C/g%3E%0A%3C/svg%3E">
|
|
</button>
|
|
</nav>
|
|
<div id="entriesListControls">
|
|
<input autofocus id="searchList" type="text" placeholder="Search...">
|
|
<span id="atlasSize"></span>
|
|
<div id="sortContainer"><label>Sort:</label>
|
|
<select id="sort">
|
|
<option value="shuffle">Random</option>
|
|
<option value="relevant" id="relevantOption" disabled>Relevant</option>
|
|
<option value="alphaAsc">↓ Alphabetical</option>
|
|
<option value="alphaDesc">↑ Alphabetical</option>
|
|
<option value="newest">Newest</option>
|
|
<option value="oldest">Oldest</option>
|
|
<option value="area">Area</option>
|
|
</select>
|
|
</div>
|
|
</div>
|
|
<div id="entriesList">
|
|
|
|
</div>
|
|
</div>
|
|
<div id="entriesListBackground"></div>
|
|
|
|
<button id="hideListButton"></button>
|
|
|
|
<div id="bottomBar">
|
|
<div id="zoomControls">
|
|
<button title="Zoom In" id="zoomInButton"></button>
|
|
<button title="Reset View" id="zoomResetButton"></button>
|
|
<button title="Zoom Out" id="zoomOutButton"></button>
|
|
</div>
|
|
<div id="timeControls">
|
|
<input type="range" min="1" max="1" value="1" class="slider" id="timeControlsSlider">
|
|
</div>
|
|
<div id="author">
|
|
<p>Code by <a href="https://draemm.li/various/place-atlas/" target="_blank" rel="author">Roland Rytz</a>. Source on <a target="_blank" href="https://github.com/placeAtlas/atlas">GitHub</a>. This site is powered by <a href="https://www.netlify.com">Netlify</a>. Images provided by <a target="_blank" href="https://place.thatguyalex.com/">Alex Tsernoh</a>.</p>
|
|
</div>
|
|
</div>
|
|
|
|
<div id="drawControlsContainer">
|
|
<a id="drawBackButton" href="./">< Back to the Atlas</a>
|
|
<div id="drawControls">
|
|
<div>
|
|
<button id="undoButton" disabled>Undo</button>
|
|
<button disabled id="redoButton">Redo</button>
|
|
</div>
|
|
<button disabled id="finishButton">Finish (Enter)</button>
|
|
<button id="resetButton">Reset</button>
|
|
<label id="highlightUnchartedLabel" title="Highlight uncharted areas of the map" class="checkboxLabel">
|
|
<input type="checkbox" id="highlightUncharted" checked> Highlight Empty
|
|
</label>
|
|
<div id="objectInfo">
|
|
<label for="nameField">Name</label>
|
|
<input id="nameField" type="text" value="" placeholder="A short title">
|
|
<label for="descriptionField">Description</label>
|
|
<textarea id="descriptionField" placeholder="A short description to be understood by everyone"></textarea>
|
|
<label for="websiteField">Website</label>
|
|
<input id="websiteField" type="text" value="" placeholder="https://example.com">
|
|
<label for="subredditField">Subreddit</label>
|
|
<input id="subredditField" type="text" value="" placeholder="/r/example">
|
|
<div id="infoButtons">
|
|
<button id="cancelButton">Cancel</button>
|
|
<button id="exportButton">OK</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div id="hint">
|
|
<p>You can suggest new entries to the Atlas for art that isn't mapped yet.</p>
|
|
<p>Please read <a href="https://www.reddit.com/r/placeAtlas2/comments/tu203o/how_to_contribute/" target="_blank">this reddit post</a> for instructions.</p>
|
|
<p>Click anywhere on the image to start drawing a shape.
|
|
When you're happy with the result, click the "Finish" button above or press the Enter key.</p>
|
|
<p>You can then add more information about your object.</p>
|
|
<div style="background-color:#7289DA; padding:20px">
|
|
<p><b>Need Help?</b></p>
|
|
<b>You can ask for help on our discord server <a href="https://discord.gg/pJkm23b2nA">here</a>!</b><br>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<button class="hidden" id="closeObjectsListButton"></button>
|
|
<div id="objectsList">
|
|
</div>
|
|
|
|
<div id="exportOverlay" class="overlay">
|
|
<div id="exportWindow">
|
|
|
|
<p>Please copy the text below and submit it as a<br>
|
|
new text post to <a target="_blank" href="https://www.reddit.com/r/placeAtlas2/">/r/placeAtlas2</a> on Reddit.</p>
|
|
<p>I will then check it and add it to the atlas.</p>
|
|
<textarea cols="50" rows="5" id="exportString"></textarea>
|
|
|
|
<div style="display:flex; flex-direction:column;align-items:center">
|
|
<a href="_blank" id="exportDirectPost">Post Direct to Reddit</a>
|
|
</div>
|
|
<hr style="border-bottom: solid black 1px"/>
|
|
<i>or...</i>
|
|
<p>Please copy the text below and submit it as a
|
|
new text post to <a target="_blank" href="https://www.reddit.com/r/placeAtlas2/">/r/placeAtlas2</a> on Reddit.</p>
|
|
<p>Don't forget to flair it with the "New Entry" tag.</p>
|
|
<p>We will then check it and add it to the atlas.</p>
|
|
<textarea cols="20" rows="5" id="exportString"></textarea>
|
|
<div style="display:flex; flex-direction:column;align-items:center">
|
|
<button id="exportCloseButton">Done</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div id="donateOverlay" class="overlay">
|
|
<div id="donateWindow">
|
|
<h2>Donation Links</h2>
|
|
<p>Current 2022 Atlas Maintainers:</p>
|
|
<p> - <a target="_blank" href="https://paypal.me/placeAtlas/5">PayPal</a></p>
|
|
<p> - <a target="_blank" href="https://www.patreon.com/placeAtlas">Patreon</a></p>
|
|
<p> - <a target="_blank" href="https://ko-fi.com/placeatlas">Ko-Fi</a></p>
|
|
<p>Original 2017 Atlas Developer (draemmli aka Roland Rytz): </p>
|
|
<p> - <a target="_blank" href="https://paypal.me/draemmli">PayPal</a></p>
|
|
|
|
<button id="closeBitcoinButton">Close</button>
|
|
<br>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<script type="text/javascript" src="./_js/time.js?version=1.0.3"></script>
|
|
<script type="text/javascript" src="./_js/infoblock.js?version=1.0"></script>
|
|
<script type="text/javascript" src="./_js/pointInPolygon.js?version=1.0"></script>
|
|
<script type="text/javascript" src="./_js/atlas.js?version=1.0.50"></script>
|
|
<script type="text/javascript" src="./_js/view.js?version=1.0.4"></script>
|
|
<script type="text/javascript" src="./_js/overlap.js?version=1.0.4"></script>
|
|
<script type="text/javascript" src="./_js/draw.js?version=1.0.3"></script>
|
|
<script type="text/javascript" src="./_js/main.js?version=1.0.3"></script>
|
|
<!--
|
|
<script type="text/javascript" src="./_js/stats.js?version=1.0.0"></script>
|
|
|
|
|
|
<script type="text/javascript" src="./_js/minified.js?version=1.0.102"></script>
|
|
-->
|
|
</body>
|
|
</html>
|