Initial commit

docs/config.json

+{
+    "title": "__PRODUCT__",
+    "author": "Axel Hahn",
+    "tagline": "__DESCRIPTION__",
+    "ignore": {
+        "files": ["30_PHP-client/Plugins/Checks/_skeleton.md"],
+        "folders": ["99_Not_Ready"]
+    },
+    "html": {
+        "auto_toc": true,
+        "auto_landing": false,
+        "date_modified": false,
+        "jump_buttons": true,
+        "edit_on_github_": "iml-it/__PROJECT__/tree/master/docs",
+        "edit_on_": {
+            "name": "Gitlab",
+            "basepath": "https://git-repo.iml.unibe.ch/iml-open-source/__PROJECT__/tree/master/docs"
+        },
+        "links": {
+            "Git Repo": "__GITURL__"
+        },
+        "theme": "daux-blue",
+        "search": true
+    }
+}
\ No newline at end of file

docs/style.css

+/*
+
+    patch css elements of daux.io blue theme
+    version 2022-05-13
+
+*/
+
+
+/* ---------- vars ---------- */ 
+
+:root{
+
+    /* background colors */
+    --bg:none;
+    --bg-body: #fff;
+    --bg-navlinkactive:#f4f4f4;
+    --bg-navlinkactive: linear-gradient(-90deg,rgba(0,0,0,0), rgba(40,60,80,0.05) 30%);
+    --bg-pre:#f8f8f8;
+    --bg-toc: #fff;
+
+    /* foreground colors */
+    --color: #234;
+    --navlinkactive:#f33;
+    --title: #aaa;
+
+    --link:#12a;
+    --toclink:rgba(40,60,80,0.8);
+
+    --h1: rgba(40,60,80,0.8);
+    --h1-bottom: 1px solid rgba(40,60,80,0.1);
+    --h2: #468;
+    --h3: #579;
+
+}
+
+/* ---------- tags ---------- */
+
+a.Brand::before {
+	background: rgb(255,0,51);
+	color: #fff;
+    font-family: arial;
+	font-weight: bold;
+	padding: 0.5em 0.3em;
+	content: 'IML';
+    margin-right: 0.4em;
+}
+
+body, *{color: var(--color);}
+body{background: var(--bg-body);}
+
+
+a{color: var(--link);}
+a:hover{opacity: 0.7;}
+
+h1>a{ color:var(--title);}
+_h1:nth-child(1){position: fixed; background: var(--bg); box-shadow: 0 0 1em #ccc; padding: 0 1em}
+h1:nth-child(1)>a{ color:var(--navlinkactive); }
+
+.s-content h1{color: var(--h1); font-size: 200%; font-weight:bold; margin-top: 2em; border-bottom: var(--h1-bottom);}
+.s-content h2{color: var(--h2); font-size: 160%; }
+.s-content h3{color: var(--h3); font-size: 140%; }
+.s-content h4{margin: 0; font-size: 100%; text-align: center; background-color: rgba(0,0,0,0.05);padding: 0.3em;}
+
+.s-content pre{
+    background: var(--bg-pre);
+}
+
+/* ---------- classes ---------- */
+
+.required{color:#a42;}
+.optional{color:#888;}
+
+
+/* ----- top left */
+.Brand,
+.Columns__left {
+	background: var(--bg);
+	border-right: 0px solid #e7e7e9;
+    color: var(--color);
+}
+.Brand{font-size: 200%;
+    background_: linear-gradient(-10deg,#fff 50%, #ddd);
+    background: var(--bg);
+}
+.Columns__right__content {
+	background: var(--bg);
+}
+
+/* ----- Navi left */
+
+.Nav a:hover{
+    background: none;
+    color: var(--navlinkactive) !important;
+}
+
+.Nav__item--active {
+    border-right_: 0.3em solid var(--navlinkactive);
+}
+.Nav__item--active > a{
+	background: var(--bg-navlinkactive);
+    color: var(--navlinkactive);
+}
+.Nav .Nav .Nav__item--active a {
+    color: var(--navlinkactive);
+}
+.Nav .Nav .Nav__item a {
+	opacity: 1;
+}
+.Nav__item--open > a {
+	background-color: var(--bg);
+}
+
+.Nav a[href*="__Welcome"]{
+    background: url("/icons/house.png") no-repeat 10px 4px ;
+    padding-left: 40px;
+}
+.Nav a[href*="__How_does_it_work"]{
+    background: url("/icons/light-bulb.png") no-repeat 10px 4px ;
+    padding-left: 40px;
+}
+
+
+
+
+/* ---------- classes ---------- */
+
+/* FIX smaller fnt size in tables */
+.s-content table {
+	font-size: 1em;
+}
+
+
+/* TOC */
+@media(min-width:1700px){
+    .TableOfContentsContainer{
+        position: fixed;
+        right: 2em;
+        top: 1em;
+    }
+}
+
+.TableOfContentsContainer{
+    border-top-left-radius: 1em;
+    background-color: var(--bg-toc);
+	border-left: 2px solid rgba(0,0,0,0.05);
+    padding: 0em;
+}
+.TableOfContentsContainer__content {
+
+	border: none;
+	font-size: 0.5em;
+
+}
+ul.TableOfContents ul{
+	list-style-type: none;
+    padding-left: 1em;
+}
+.TableOfContentsContainer a{ color:var(--toclink);}
+
+.TableOfContentsContainer__content > .TableOfContents > li + li {
+	border-top: none;
+}
+.TableOfContentsContainer__content > .TableOfContents > li {
+	border-bottom: 1px dashed #ddd;
+}
+
+/* pager - prev .. next */
+.s-content{
+    margin-bottom: 6em;
+}
+.Pager{
+    border-top: 1px dashed #aaa; margin: 0; padding: 1em;
+}
+.Pager a{
+    color:var(--navlinkactive);
+}

public_html/index.html

+<!DOCTYPE html>
+<html>
+<head>
+<title>Dashboard</title>
+<meta http-equiv="content-type" content="text/html; charset=UTF-8"/>
+<meta http-equiv="refresh" content="3600">
+<link rel="stylesheet" href="main.css">
+<script src="javascript/functions.js" type="text/javascript"></script>
+
+<body>
+    <header>
+        <h1>📋 Dashboard</h1>
+    </header>
+
+    <section id="app-section"><h2>📦 fetching...</h2></section>
+    <section id="msg-section"><h2>🛎️ fetching...</h2></section>
+
+</html>
\ No newline at end of file

public_html/javascript/functions.js

+/*
+
+
+
+*/
+
+// ----------------------------------------------------------------------
+// CONSTANTS
+// ----------------------------------------------------------------------
+
+const AM_RESULTS={
+    0: 'OK',
+    1: 'unknown',
+    2: 'warning',
+    3: 'error'
+};
+
+const AM_SERVER_URL='http://localhost:8001/server/get.php?';
+const AM_URLS=[
+    '&item=apps&appid=60b1104800798cd79b694ca6f6764c15&what=all'
+];
+
+const OUT_ID_APPS='app-section';
+
+// ----------------------------------------------------------------------
+// VARS
+// ----------------------------------------------------------------------
+
+
+
+// ----------------------------------------------------------------------
+// FUNCTIONS
+// ----------------------------------------------------------------------
+
+function _appItem(sLabel,sText){
+    return '<tr><td>'+sLabel+'&nbsp;&nbsp;</td><td>'+sText+'</td></tr>'
+}
+
+function _getSingleAppStatus(sData){
+    let aData=JSON.parse(sData);
+
+    // DEBUG
+    console.log(aData);
+
+    // ------ checks
+    let sChecks='';
+    for (var j=0; j<aData.checks.length; j++){
+        let tmpCheck=aData.checks[j];
+        sChecks+='<tr class="result'+tmpCheck.result+'">'
+            +'<td>'+tmpCheck.name+'</td>'
+            +'<td>'+tmpCheck.description+'</td>'
+            +'<td>'+tmpCheck.value+'</td>'
+            +'</tr>'
+            ;
+    }
+    sChecks=sChecks ? '<table>'+sChecks+'</table>' : ' (No checks were found)';
+
+    // ----- generate output
+    let sReturn='<div class="app result'+ aData.meta.result +'">'
+        +'<div class="title">'
+            +'<span class="float-right">'+AM_RESULTS[aData.meta.result]+'</span>'
+            +aData.meta.website
+        +'</div>'
+        +'<table>'
+
+    let iAge=Math.round((new Date()).getTime() / 1000)- aData.result.ts;
+
+    sReturn+=''
+        +_appItem('Summary', 'Application status: '+ AM_RESULTS[aData.meta.result] 
+            + ' | Checks: ' + aData.checks.length 
+            + ' | Age: ' + iAge + ' sec'
+            + ' | TTL: ' + aData.result.ttl 
+            )
+        +_appItem('Checks', sChecks)
+        
+        +'</table>'
+        ;
+
+    sReturn+='</div>';
+
+    return sReturn;
+}
+
+async function getAppstatus(){
+    let out = '<h2>📦 Applications</h2>';
+
+    for (var i=0; i<AM_URLS.length; i++){
+
+    
+        let response = await fetch(AM_SERVER_URL + AM_URLS[i]);
+        if (response.ok) {
+            out+=_getSingleAppStatus(await response.text());
+        } else {
+            out+='<div class="app result1">ERROR: '
+                +AM_SERVER_URL + AM_URLS[i]
+                +'</div>';
+        } 
+    }
+    o=document.getElementById(OUT_ID_APPS);
+    o.innerHTML=out;
+}
+
+
+// ----------------------------------------------------------------------
+// MAIN
+// ----------------------------------------------------------------------
+
+
+window.setTimeout("getAppstatus()", 300);
+
+
+// ----------------------------------------------------------------------

public_html/main.css

+
+
+:root{
+    --color-0: #345;
+    --color-h1: #c54;
+    --color-h2: #567;
+    --color-links: #8ae;
+
+    --color-result-0: 
+    --bg-0: #f8f8f8;
+}
+
+
+a{color: var(--color-links);}
+body{
+    margin: 1em;
+    color: var(--color-0);
+    background: var(--bg-0);
+    font-family: verdana,arial;
+}
+
+h1{color: var(--color-h1)}
+h2{color: var(--color-h2)}
+
+section{
+    margin: 1em 0;
+    padding: 0.2em;
+    border-top: 2px solid #eee;
+    border-radius: 1em;
+}
+
+td{vertical-align: top;}
+
+.app{
+    margin: 1em;
+    border: 2px solid;
+    border-radius: 0.3em;
+    padding: 1em; 
+}
+
+.float-right{float: right;}
+
+.app .title{font-weight: bold; font-size: 130%; }
+
+.result0{background:#dfd    !important; background: linear-gradient(#dfd,#beb)!important;       color:#080}
+.result1{background:#eee    !important; background: linear-gradient(#eee,#ddd)!important;       color:#666;}
+.result2{background:#fff8d0 !important; background: linear-gradient(#fff0d0,#ffe0a0)!important; color:#870;}
+.result3{background:#fcd    !important; background: linear-gradient(#fcd,#faa)!important;       color:#800;}