Comunic/ComunicWeb
1
0
Fork 0
mirror of https://github.com/pierre42100/ComunicWeb synced 2025-11-04 12:14:12 +00:00
Code Issues Projects Releases Wiki Activity

Display user information

Browse Source
This commit is contained in:
Pierre HUBERT
2019-01-14 14:13:18 +01:00
parent f2ab71cf3f
commit 229b02534e
3 changed files with 195 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files

28
assets/zip/personnal-data-export-navigator/Export.html
View File

@@ -9,6 +9,14 @@
<link type="text/css" rel="stylesheet" href="assets/materialize/css/materialize.min.css" media="screen,projection"/>
<link rel="stylesheet" href="assets/css/main.css" />
<script>
//Project configuration
const SOURCE_URL = "./source.json";
const STORAGE_URL = "./files/";
</script>
</head>
<body>
@@ -38,7 +46,25 @@
</div>
<div id="user-info" class="category container">
Loading user information
<h1>User information</h1>
<table class="user-information-table">
<tr><td>User ID</td><td id="u-uid"></td></tr>
<tr><td>First name</td><td id="u-firstname"></td></tr>
<tr><td>Last name</td><td id="u-lastname"></td></tr>
<tr><td>Is page public</td><td id="u-pagepublic"></td></tr>
<tr><td>Is page open</td><td id="u-pageopen"></td></tr>
<tr><td>Virtual directory</td><td id="u-virtualdirectory"></td></tr>
<tr><td>Account image</td><td><img id="u-accountimage"></td></tr>
<tr><td>Is friend list public</td><td id="u-publicfriendslist"></td></tr>
<tr><td>Personnal website</td><td id="u-personnalwebsite"></td></tr>
<tr><td>Public note</td><td id="u-publicnote"></td></tr>
<tr><td>Comments forbidden</td><td id="u-commentsforbidden"></td></tr>
<tr><td>Allow posts from friends</td><td id="u-allowpostsfromfriends"></td></tr>
<tr><td>Account creation time</td><td id="u-accountcreationtime"></td></tr>
<tr><td>Background image</td><td><img id="u-bgimage" class="background-image" /></td></tr>
<tr><td>Page likes</td><td id="u-pagelikes"></td></tr>
</table>
</div>
<div id="friends-list" class="category container">

24
assets/zip/personnal-data-export-navigator/assets/css/main.css
View File

@@ -4,7 +4,9 @@
* @author Pierre HUBERT
*/
/**
* Global rules
*/
.sidenav.sidenav-fixed {
/*transform: unset;*/
/*margin-top: 80px;*/
@@ -17,3 +19,23 @@ main {
main .container {
display: none;
}
h1 {
font-size: 150%;
}
/**
* User information rules
*/
.user-information-table td:first-child {
font-weight: bold;
}
.account-image {
width: 50px;
}
.background-image {
max-width: 100px;
}

144
assets/zip/personnal-data-export-navigator/assets/js/main.js
View File

@@ -4,6 +4,100 @@
* @author Pierre HUBERT
*/
/**
* This object will contains all the exported data
* once it will have been decoded by the JSON parser
* of the browser
*/
let data;
/**
* Get and return an element specified by its ID
*
* @param {String} id The ID of the element to get
* @return {HTMLElement} Target element
*/
function byId(id){
return document.getElementById(id);
}
/**
* Set the content of an HTML element queried by
* its ID
*
* @param {String} id The ID of the element to get
* @param {String} html HTML content to apply
*/
function setInnerHTMLById(id, html){
byId(id).innerHTML = html;
}
/**
* Set the content of an HTML element queried by
* its ID for a specified boolean
*
* @param {String} id The ID of the element to get
* @param {Boolean} bool The boolean to apply
*/
function setBoolInnerHTMLById(id, bool){
setInnerHTMLById(id, bool == true ? "Yes " : "No")
}
/**
* Display an error
*
* @param {String} message The message of the error to display
*/
function error(message){
M.toast({html: "Error: " + message, classes: 'rounded', length: 1000});
}
/**
* Get the path to an image
*
* @param {String} url The original URL of the image
* @return {String} Locally accessible path to the image
*/
function getImagePath(url){
return STORAGE_URL + url.replace("://", "/");
}
/**
* Turn a timestamp into a string date
*
* @param {Number} time The time to convert
* @return {String} Matching date
*/
function timeToStr(time){
let date = new Date();
date.setTime(time*1000);
return date.toGMTString();
}
/**
* Apply an orignially remote image to an element
* of the page
*
* @param {HTMLElement} el Image HTML Element that will receive
* the image
* @param {String} url The original URL of the image
*/
function applyURLToImage(el, url){
el.src = getImagePath(url);
el.className + " responsive-img";
}
/**
* Apply a user image to an image object
*
* @param {HTMLElement} el Target HTML element
* @param {Object} info Information about the related object
*/
function applyUserAccountImage(el, info){
applyURLToImage(el, info.accountImage);
el.className += " circle account-image"
}
/**
* Refresh tabs visibility accordingly to the hash of
* the current URL
@@ -23,6 +117,31 @@ function RefreshTabsVisibility(){
}
/**
* Apply user information
*/
function ApplyUserInfo() {
let userInfo = data.advanced_info;
setInnerHTMLById("u-uid", userInfo.userID);
setInnerHTMLById("u-firstname", userInfo.firstName);
setInnerHTMLById("u-lastname", userInfo.lastName);
setBoolInnerHTMLById("u-pagepublic", userInfo.publicPage);
setBoolInnerHTMLById("u-pageopen", userInfo.openPage);
setInnerHTMLById("u-virtualdirectory", userInfo.virtualDirectory);
applyUserAccountImage(byId("u-accountimage"), userInfo);
setBoolInnerHTMLById("u-publicfriendslist", userInfo.friend_list_public);
setInnerHTMLById("u-personnalwebsite", userInfo.personnalWebsite);
setInnerHTMLById("u-publicnote", userInfo.publicNote);
setBoolInnerHTMLById("u-commentsforbidden", userInfo.noCommentOnHisPage);
setBoolInnerHTMLById("u-allowpostsfromfriends", userInfo.allowPostFromFriendOnHisPage);
setInnerHTMLById("u-accountcreationtime", timeToStr(userInfo.account_creation_time));
applyURLToImage(byId("u-bgimage"), userInfo.backgroundImage);
setInnerHTMLById("u-pagelikes", timeToStr(userInfo.pageLikes));
}
/**
* Automatically switch the tab when it
* is required by the user
@@ -32,3 +151,28 @@ window.addEventListener("hashchange", RefreshTabsVisibility);
//Page initialization
RefreshTabsVisibility();
/**
* Get the content of the source file
*/
let xhr = new XMLHttpRequest();
xhr.open("GET", SOURCE_URL);
xhr.onload = function(){
if(xhr.status != 200)
return error("Could not access " + SOURCE_URL + " !");
//Parse data
try {
data = JSON.parse(xhr.response);
}
catch(e){
return error("Could not parse " + SOURCE_URL + " !");
}
//Now we can apply specific process for each data block
ApplyUserInfo();
}
xhr.send(null);