MirrorHub/atlas
0
0
Fork 0
mirror of https://github.com/placeAtlas/atlas.git synced 2024-12-25 19:24:23 +01:00
Code Issues Projects Releases Wiki Activity

Merge pull request #10 from Aeywoo/master

Browse source 
Minor Improvements and Changes
This commit is contained in:
Stefano 2022-04-04 19:13:28 +02:00 committed by GitHub
commit e99c06e33b
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
5 changed files with 344 additions and 419 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
.gitignore vendored
View file

@ -9,4 +9,4 @@ users.html
oldusers.html
web/_js/minified.js
allCharacters.txt
combined.js
combined.js

609
web/_css/style.css
View file

File diff suppressed because one or more lines are too long

63
web/_js/atlas.js
View file

@ -1,6 +1,3 @@
/*
========================================================================
The /r/place Atlas
@ -23,9 +20,6 @@
========================================================================
*/
window.addEventListener("error", function (e) {
console.log(e);
var errorMessage = "<p class=\"error\">An error has occurred:</p>";
@ -36,22 +30,21 @@ window.addEventListener("error", function (e) {
});
function pointIsInPolygon (point, polygon) {
// ray-casting algorithm based on
// http://www.ecse.rpi.edu/Homepages/wrf/Research/Short_Notes/pnpoly.html
var x = point[0], y = point[1];
var inside = false;
for (var i = 0, j = polygon.length - 1; i < polygon.length; j = i++) {
var xi = polygon[i][0], yi = polygon[i][1];
var xj = polygon[j][0], yj = polygon[j][1];
var intersect = ((yi > y) != (yj > y))
&& (x < (xj - xi) * (y - yi) / (yj - yi) + xi);
if (intersect) inside = !inside;
}
return inside;
// ray-casting algorithm based on
// http://www.ecse.rpi.edu/Homepages/wrf/Research/Short_Notes/pnpoly.html
var x = point[0], y = point[1];
var inside = false;
for (var i = 0, j = polygon.length - 1; i < polygon.length; j = i++) {
var xi = polygon[i][0], yi = polygon[i][1];
var xj = polygon[j][0], yj = polygon[j][1];
var intersect = ((yi > y) != (yj > y))
&& (x < (xj - xi) * (y - yi) / (yj - yi) + xi);
if (intersect) inside = !inside;
}
return inside;
};
var atlas = [
@ -209,13 +202,12 @@ var atlas = [
{"id": 151, "submitted_by": "F-L-A-R-E", "name": "Karlsruhe Institute of Technology (KIT)", "description": "University of Karlsruhe (Germany)", "website": "kit.edu", "subreddit": "/r/KaIT", "center": [796.5, 534.5], "path": [[760.5, 521.5], [760.5, 547.5], [832.5, 547.5], [832.5, 521.5]]},
{"id": 152, "submitted_by": "Powaza", "name": "Chick (Powi)", "description": "The Chick from the MEA (Middle Eastern Alliance). Idea from 'Powi Club's Discord server and other helpers.", "website": "https://discord.gg/EyNsdbU", "subreddit": "/r/PowiTeam", "center": [ 1777.5, 949.5 ], "path": [ [ 1784.5, 940.5 ], [ 1773.5, 940.5 ], [ 1773.5, 946.5 ], [ 1768.5, 947.5 ], [ 1768.5, 957.5 ], [ 1784.5, 957.5 ], [ 1784.5, 952.5 ] ] },
{"id": 153, "submitted_by": "horsewhips", "name": "The Ohio State University", "description": "The Ohio State University (OSU) is located in Columbus, Ohio, USA. OSU's school colors are scarlet and gray which can be seen around their famous Block O - located towards the bottom left of the artwork. The Block 'O' together with the Buckeye nut is the logo for The Ohio State University. OSU (not to be confused with the rhythm game 'osu!') is famous for it's rivalry with the University of Michigan with the 15-2 representing the current streak of 15 wins against UofM's 2. The Ohio flag is on the top right, representing the state of Ohio, USA. The bottom right has the famous 'Script Ohio' - a long-time Ohio State tradition from the school's Marching Band where members of the band will form the word 'Ohio' in script during football games. A second block 'O' is situated next to Purdue University & Rutgers University elsewhere on r/place.", "website": "[https://www.osu.edu](https://www.osu.edu)", "subreddit": "r/osu", "center": [ 1347.5, 813.5 ], "path": [ [ 1331.5, 795.5 ], [ 1331.5, 830.5 ], [ 1363.5, 831.5 ], [ 1363.5, 795.5 ], [ 1363.5, 795.5 ], [ 1363.5, 795.5 ] ] },
];
//console.log("There are "+atlas.length+" entries in the Atlas.");
/*
atlas.sort(function(a, b){
atlas.sort(function(a, b) {
if (a.id < b.id) {
return -1;
}
@ -226,9 +218,9 @@ atlas.sort(function(a, b){
return 0;
});
for(var i = 0; i < atlas.length; i++){
for(var i = 0; i < atlas.length; i++) {
if(atlas[i-1]){
if(atlas[i-1].id == atlas[i].id){
if(atlas[i-1].id == atlas[i].id) {
console.log(atlas[i-1].id + ": "+ atlas[i-1].name);
console.log(atlas[i ].id + ": "+ atlas[i ].name);
}
@ -238,13 +230,12 @@ for(var i = 0; i < atlas.length; i++){
console.log("biggest id: "+atlas[atlas.length-1].id + ", " + atlas[atlas.length-1].name);
*/
/*
for(var i = 0; i < atlas.length; i++){
if(typeof atlas[i].website == "undefined"){
for(var i = 0; i < atlas.length; i++) {
if(typeof atlas[i].website == "undefined") {
console.log(atlas[i].name);
} else if(atlas[i].website.trim() != ""){
if(atlas[i].website.trim().substring(0, 4) != "http"){
} else if(atlas[i].website.trim() != "") {
if(atlas[i].website.trim().substring(0, 4) != "http") {
console.log(atlas[i].name + ": " + atlas[i].website);
}
}
@ -263,19 +254,16 @@ atlas.sort(function (a, b) {
return 0;
});
/*
// Populate with test data
for(var i = 0; i < 10000; i++){
for(var i = 0; i < 10000; i++) {
var x = ~~(Math.random() * 1000)+0.5;
var y = ~~(Math.random() * 1000)+0.5;
var w = ~~(Math.random()*100);
var h = ~~(Math.random()*100);
atlas.push({
atlas.push( {
"id": 5,
"name": "test"+(i+3),
"website": "",
@ -290,5 +278,4 @@ for(var i = 0; i < 10000; i++){
});
}
*/
*/

39
web/about.html
View file

@ -1,4 +1,3 @@
<!--
========================================================================
The /r/place Atlas
@ -21,23 +20,20 @@
========================================================================
-->
<!doctype html>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>
The /r/place Atlas
</title>
<meta charset="UTF-8">
<title>The /r/place Atlas</title>
<meta name="description" content="An Atlas of Reddit's /r/place, with information to each artwork of the canvas.">
<meta name="author" content="Roland Rytz">
<meta name="keywords" content="reddit, /r/place, april">
<meta name="application-name" content="/r/place Atlas">
<meta name="robots" content="index, follow">
<meta name="viewport" content="width=device-width, height=device-height, initial-scale=1">
<link href="./_css/style.css?version=1.0.32" rel="stylesheet" type="text/css" media="all">
</head>
<body>
@ -53,11 +49,11 @@ <h1>The /r/place Atlas</h1>
<a id="aboutLink" href="./about.html">About</a>
</nav-->
</header>
<div id="author" style="right: 25px;">
<div id="author" style="right:25px">
Code by <a href="/" target="_blank" rel="author">Roland Rytz</a>. Source on <a target="_blank" href="https://github.com/RolandR/place-atlas">GitHub</a>.
</div>
<div class="overlay" id="bitcoinOverlay">
<div id="bitcoinWindow">
<h2>My Bitcoin Address</h2>
@ -67,7 +63,7 @@ <h2>My Bitcoin Address</h2>
<button id="closeBitcoinButton">Close</button>
</div>
</div>
<div id="aboutContainer">
<a id="aboutBackButton" href="./">&lt; Back to the Atlas</a>
<div id="about">
@ -88,7 +84,7 @@ <h2>r/placeAtlas2 (Current) Contributors</h2>
<p>Thank you to everyone who submitted new entries, amended existing ones, reported bugs and just supported the project in general.</p>
<div id="contributors">
<a href="https://reddit.com/user/TCOOfficiall" target="_blank">TCOOfficiall (Current Maintainer)</a>
<a href="https://reddit.com/user/TCOOfficiall" target="_blank">prosto_sanja (Provided Images)</a> - <a href="https://place.thatguyalex.com/" target="_blank">Website</a>
<a href="https://reddit.com/user/prosto_sanja" target="_blank">prosto_sanja (Provided Images)</a> - <a href="https://place.thatguyalex.com/" target="_blank">Website</a>
<h2>r/placeAtlas Contributors</h2>
<p>The (original) Atlas would not have been possible without the help of the following 775 reddit users.</p>
@ -873,21 +869,14 @@ <h2>r/placeAtlas Contributors</h2>
</div>
</div>
</div>
<script type="text/javascript">
document.getElementById("closeBitcoinButton").addEventListener("click", function(e){
document.getElementById("closeBitcoinButton").addEventListener("click", function(e) {
document.getElementById("bitcoinOverlay").style.display = "none";
});
document.getElementById("bitcoinButton").addEventListener("click", function(e){
document.getElementById("bitcoinButton").addEventListener("click", function(e) {
document.getElementById("bitcoinOverlay").style.display = "flex";
});
</script>
</body>
</html>
</html>

50
web/index.html
View file

@ -1,4 +1,3 @@
<!--
========================================================================
The /r/place Atlas
@ -21,28 +20,25 @@
========================================================================
-->
<!doctype html>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>
The /r/place Atlas
</title>
<meta charset="UTF-8">
<title>The /r/place Atlas</title>
<meta name="description" content="An interactive map of Reddit's /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="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.32" rel="stylesheet" type="text/css" media="all">
<script type="application/ld+json">
{
"@context": "http://schema.org",
@ -73,7 +69,6 @@
"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">
@ -176,33 +171,31 @@ <h1 id="title">The /r/place Atlas</h1>
<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: #666666; padding:20px">
<div style="background-color:#666; padding:20px">
<p><b>Handy with GitHub?</b></p>
<p>You can contribute directly with a Pull Request <a href="https://github.com/Codixer/place-atlas/blob/master/web/_js/atlas.js">here!</a></p>
</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>
<div style="background-color: #666666; padding:5px">
<div style="background-color:#666; padding:5px">
<p><b>Handy with GitHub?</b></p>
<p>You can contribute directly with a Pull Request <a href="https://github.com/Codixer/place-atlas/blob/master/web/_js/atlas.js">here!</a></p>
</div>
<textarea cols="50" rows="5" id="exportString"></textarea>
<div style="display:flex;flex-direction:column;align-items: center;">
<div style="display:flex; flex-direction:column;align-items:center">
<a href="_blank" id="exportDirectPost">Post Direct to Reddit</a>
<button id="exportCloseButton">Done</button>
</div>
</div>
</div>
@ -223,27 +216,18 @@ <h2>His Bitcoin Address</h2>
<br>
<button id="closeBitcoinButton">Close</button>
<br>
</div>
</div>
<div id="author">
Code by <a href="/" target="_blank" rel="author">Roland Rytz</a>. Source on <a target="_blank" href="https://github.com/RolandR/place-atlas">GitHub</a> (<a target="_blank" href="https://github.com/Codixer/place-atlas">2022 Version Github</a>). Image's provided by <a target="_blank" href="https://place.thatguyalex.com/">Alex Tsernoh</a>.
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/RolandR/place-atlas">GitHub</a> (<a target="_blank" href="https://github.com/Codixer/place-atlas">2022 Version Github</a>). Image's provided by <a target="_blank" href="https://place.thatguyalex.com/">Alex Tsernoh</a>.
</div>
</div>
<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>
@ -251,8 +235,4 @@ <h2>His Bitcoin Address</h2>
<script type="text/javascript" src="./_js/minified.js?version=1.0.102"></script>
-->
</body>
</html>
</html>