diff --git a/index.html b/index.html
new file mode 100644
index 0000000..a376b83
--- /dev/null
+++ b/index.html
@@ -0,0 +1,17 @@
+
+
+
+
+
+ Affichage du compte Mastodon
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/js/affichage.js b/js/affichage.js
new file mode 100644
index 0000000..273891b
--- /dev/null
+++ b/js/affichage.js
@@ -0,0 +1,54 @@
+function transformName(name, url) {
+ nameWithoutHttps = url.substring(8);
+ indexOfSlash = nameWithoutHttps.indexOf("/");
+ nameWithoutSlash = nameWithoutHttps.substring(0,indexOfSlash);
+ ret = "@" + name.toLowerCase() + "@" + nameWithoutSlash;
+ return ret;
+}
+
+function getProfile(url, id) {
+ apiUrl = url + "/api/v1/accounts/" + id;
+ var xmlHttp = new XMLHttpRequest();
+ xmlHttp.open("GET", apiUrl, false);
+ xmlHttp.send();
+ response = JSON.parse(xmlHttp.responseText);
+ console.log(response);
+
+ accountUrl = response['url'];
+ accountName = response['display_name']
+ accountPicture = response['avatar'];
+
+ accountAtName = transformName(accountName, accountUrl);
+
+ linkHTML = document.createElement("a");
+ text = document.createTextNode("coucou");
+ linkHTML.title = "link to mastodon profile";
+ linkHTML.href = accountUrl;
+
+ imageHtml = document.createElement("img");
+ imageHtml.src = accountPicture
+ imageHtml.height = 65;
+ imageHtml.width = 65;
+ imageHtml.id = "photoMasto";
+
+ accountNameHtml = document.createElement("p");
+ text = document.createTextNode(accountName);
+ accountNameHtml.appendChild(text);
+ accountNameHtml.id = "nomMasto";
+
+ atAccountHtml = document.createElement("p");
+ text = document.createTextNode(accountAtName);
+ atAccountHtml.appendChild(text);
+ atAccountHtml.value = accountName;
+ atAccountHtml.id = "nomCompteMasto";
+
+ divInfos = document.createElement("div");
+ divInfos.id = "infoTextMasto";
+ divInfos.appendChild(accountNameHtml);
+ divInfos.appendChild(atAccountHtml);
+
+ linkHTML.appendChild(imageHtml);
+ linkHTML.appendChild(divInfos);
+
+ document.getElementById("petitAffichage").appendChild(linkHTML);
+}
\ No newline at end of file
diff --git a/style/mastodonFooter.css b/style/mastodonFooter.css
new file mode 100644
index 0000000..1f6e1ed
--- /dev/null
+++ b/style/mastodonFooter.css
@@ -0,0 +1,33 @@
+#petitAffichage {
+ width: 250px;
+ height: 65px;
+ padding: 10px;
+ margin: 0;
+ border-radius: 25px;
+ background-color: #414141;
+}
+
+#petitAffichage a {
+ display: flex;
+ color: white;
+ text-decoration: none;
+}
+
+#photoMasto {
+ margin-right: 10px;
+ border-radius: 360px;
+}
+
+#infoTextMasto {
+ margin:10px;
+}
+
+#infoTextMasto p {
+ margin: 0;
+ font-family: Arial, Helvetica, sans-serif;
+}
+
+#nomCompteMasto {
+ padding-top: 10px;
+ color: #778899;
+}
\ No newline at end of file