mirror of
https://github.com/AMNatty/Mastodon-Circles.git
synced 2025-03-13 19:00:29 -06:00
MIEKE KRÖGER
This commit is contained in:
Andreas Grasser
parent
2f9be10231
commit
528a2f8b05
5 changed files with 56 additions and 28 deletions
|
|
@ -6,16 +6,19 @@ let ownProfilePic;
|
|||
let userInfo;
|
||||
let connection_list = {};
|
||||
let requestCounter = 1;
|
||||
// Request Limit
|
||||
let request_limit;
|
||||
|
||||
// The main function called by the button-click
|
||||
function circle_main() {
|
||||
// Make Button invisible to prevent clicking
|
||||
document.getElementById("btn_create").style.display = "none";
|
||||
// Reset all global variables
|
||||
[ownProfilePic, userInfo, connection_list, requestCounter] = [null, null, {}, 1];
|
||||
[ownProfilePic, userInfo, connection_list, requestCounter, request_limit] = [null, null, {}, 1, 50];
|
||||
// Get handle from Textfield
|
||||
let mastodon_handle = document.getElementById("txt_mastodon_handle").value;
|
||||
userInfo = formatedUserHandle(mastodon_handle);
|
||||
// Do all the Magic for creating circle
|
||||
getStatuses();
|
||||
}
|
||||
|
||||
|
|
@ -23,17 +26,17 @@ function circle_main() {
|
|||
function formatedUserHandle(mastodon_handle) {
|
||||
// Remove leading @
|
||||
if (mastodon_handle.charAt(0) === '@') mastodon_handle = mastodon_handle.substr(1);
|
||||
// Split handle into name and
|
||||
// Split handle into name and instance
|
||||
mastodon_handle = mastodon_handle.split("@");
|
||||
// Return the array
|
||||
// Return the array (fetch user ID with getIdFromName)
|
||||
return [mastodon_handle[0], getIdFromName(mastodon_handle[0], mastodon_handle[1]), mastodon_handle[1]];
|
||||
}
|
||||
|
||||
// Get the user ID from the handle
|
||||
// Get the user ID from the handle (synchronous request! :( )
|
||||
function getIdFromName(name, server) {
|
||||
var xmlHttp = new XMLHttpRequest();
|
||||
let url = "https://"+server+"/api/v1/accounts/lookup?acct="+name;
|
||||
xmlHttp.open( "GET", url, false ); // false for synchronous request
|
||||
xmlHttp.open( "GET", url, false );
|
||||
xmlHttp.send( null );
|
||||
let response = JSON.parse(xmlHttp.responseText);
|
||||
ownProfilePic = response["avatar"];
|
||||
|
|
@ -43,7 +46,7 @@ function getIdFromName(name, server) {
|
|||
// Get a JSON String with all the posted statuses from the account and call processStatuses()
|
||||
async function getStatuses() {
|
||||
// Build the URL
|
||||
let url = "https://"+userInfo[2]+"/api/v1/accounts/"+userInfo[1]+"/statuses?exclude_replies=true";
|
||||
let url = "https://"+userInfo[2]+"/api/v1/accounts/"+userInfo[1]+"/statuses?exclude_replies=true&exclude_reblogs=true";
|
||||
// Do the async http request and call processStatuses()
|
||||
httpRequest(url, processStatuses);
|
||||
}
|
||||
|
|
@ -52,15 +55,13 @@ async function getStatuses() {
|
|||
function processStatuses(statuses) {
|
||||
jsonStat = JSON.parse(statuses);
|
||||
|
||||
let request_limit = 50;
|
||||
|
||||
for (var i=0; i<jsonStat.length; i++) {
|
||||
if (!jsonStat[i]["reblog"]) {
|
||||
evaluateStatus(jsonStat[i]["id"], (jsonStat[i]["favourites_count"]>0), (jsonStat[i]["reblogs_count"]>0));
|
||||
request_limit--;
|
||||
if (request_limit<0) break;
|
||||
}
|
||||
evaluateStatus(jsonStat[i]["id"], (jsonStat[i]["favourites_count"]>0), (jsonStat[i]["reblogs_count"]>0));
|
||||
request_limit--;
|
||||
if (request_limit<0) return;
|
||||
}
|
||||
|
||||
// Do another API request to fetch older Posts?
|
||||
}
|
||||
|
||||
// Get all Reblogs and Favs for a status update
|
||||
|
|
@ -140,6 +141,13 @@ function showConnections() {
|
|||
(first, second) => { return second[1]["conStrength"] - first[1]["conStrength"] }
|
||||
);
|
||||
|
||||
// Export Item List for Further usage
|
||||
let userDataExport = {};
|
||||
for (var i=0; i<items.length; i++) {
|
||||
userDataExport[items[i][0]] = items[i][1]["conStrength"].toFixed(1);
|
||||
}
|
||||
document.getElementById("outDiv").innerText = JSON.stringify(userDataExport);
|
||||
|
||||
// Render the Objects
|
||||
document.getElementById("btn_download").style.display = "inline";
|
||||
render(items);
|
||||
|
|
|
|||
14
image.js
14
image.js
|
|
@ -15,8 +15,8 @@ function render(users) {
|
|||
const height = canvas.height;
|
||||
|
||||
// fill the background
|
||||
ctx.fillStyle = "#282c37";
|
||||
ctx.fillRect(0, 0, width, height);
|
||||
const bg_image = document.getElementById("mieke_bg");
|
||||
ctx.drawImage(bg_image, 0, 0, 1000, 1000);
|
||||
|
||||
loadImage(ctx, ownProfilePic, (width/2)-110, (height/2)-110, 110, 110);
|
||||
|
||||
|
|
@ -54,10 +54,12 @@ function render(users) {
|
|||
}
|
||||
}
|
||||
|
||||
ctx.fillStyle = "#DDDDDD";
|
||||
ctx.fillText("MIEKE", 10, 15, 25)
|
||||
ctx.fillText("KRÖGER", width-30, 15, 25)
|
||||
ctx.fillText("@sonnenbrandi@mieke.club mit lieben Grüßen an Duiker101", width-300, height-15, 290)
|
||||
ctx.fillStyle = "#0505AA";
|
||||
ctx.fillText("MIEKE", 10, 15, 40)
|
||||
ctx.fillText("KRÖGER", width-50, 15, 40)
|
||||
ctx.fillStyle = "#666666";
|
||||
ctx.fillText("circle.grasserisen.de", width-120, height-15, 110)
|
||||
//ctx.fillText("@sonnenbrandi@mieke.club mit lieben Grüßen an Duiker101", width-300, height-15, 290)
|
||||
};
|
||||
|
||||
function get_layer(i) {
|
||||
|
|
|
|||
21
index.html
21
index.html
|
|
@ -2,7 +2,7 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="de">
|
||||
<meta charset="UTF-8">
|
||||
<title>Mastodon Circle Creator</title>
|
||||
<title>Trötpty - Mastodon Circle Creator</title>
|
||||
<meta name="viewport" content="width=device-width,initial-scale=1">
|
||||
<link rel="stylesheet" href="style.css">
|
||||
<style>
|
||||
|
|
@ -11,13 +11,22 @@
|
|||
<body>
|
||||
<script src="create-circle.js"></script>
|
||||
<script src="image.js"></script>
|
||||
<h1>Mastodon Circle Creator</h1>
|
||||
<!-- Logo? -->
|
||||
<h1>Trötpty</h1>
|
||||
<h3>Mastodon Circle Creator</h3>
|
||||
<!-- TODO Logo? -->
|
||||
<input id="txt_mastodon_handle" type="text" onchange="document.getElementById('btn_create').style = 'display: inline;'; document.getElementById('btn_download').style = 'display: none;'" placeholder="@sonnenbrandi@mieke.club">
|
||||
<br><br>
|
||||
<!-- Buttons -->
|
||||
<button id="btn_create" onClick="circle_main()">Circle Erstellen</button>
|
||||
<button id="btn_download" onClick="downloadImage()" style="display: none;">DOWNLOAD</button>
|
||||
<br><br><br>
|
||||
<canvas id="canvas" width="1600" height="1000"></canvas>
|
||||
<div id="outDiv"></div>
|
||||
<br><br>
|
||||
<!-- Canvas for the final Image -->
|
||||
<canvas id="canvas" width="1000" height="1000"></canvas>
|
||||
<br><br><br><br>
|
||||
<div id="credits">Thanks to <a href="https://twitter.com/duiker101">Duiker101</a> for creating chirpty for Twitter</div>
|
||||
<!-- output for further projects ;) -->
|
||||
<div id="outDiv" style="display: none;"></div>
|
||||
<!-- Preload the background image -->
|
||||
<div style="display:none;"><img id="mieke_bg" src="mieke_bg.jpg" width="1000" height="1000" /></div>
|
||||
</body>
|
||||
</html>
|
||||
BIN
mieke_bg.jpg
Normal file
BIN
mieke_bg.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 28 KiB |
15
style.css
15
style.css
|
|
@ -9,10 +9,19 @@ body {
|
|||
|
||||
input[type="text"]
|
||||
{
|
||||
font-size: 30px;
|
||||
width: 50%;
|
||||
font-size: 110%;
|
||||
width: 75%;
|
||||
}
|
||||
|
||||
button {
|
||||
font-size: 30px;
|
||||
font-size: 110%;
|
||||
}
|
||||
|
||||
a {
|
||||
text-decoration: none;
|
||||
color: #AAAAAA;
|
||||
}
|
||||
|
||||
#outDiv {
|
||||
font-size: 20%;
|
||||
}
|
||||
Loading…
Add table
Reference in a new issue