feat: added homepage item for prompage

api/classes/organizr.class.php

@@ -65,6 +65,7 @@ class Organizr
 	use WeatherHomepageItem;
 	use uTorrentHomepageItem;
 	use UptimeKumaHomepageItem;
+	use PromPageHomepageItem;
 
 	// ===================================
 	// Organizr Version
@@ -4711,6 +4712,13 @@ class Organizr
 						$class .= ' faded';
 					}
 					break;
+				case 'homepageOrderPromPage':
+					$class = 'bg-info';
+					$image = 'plugins/images/tabs/prompage.png';
+					if (!$this->config['homepagePromPageEnabled']) {
+						$class .= ' faded';
+					}
+					break;
 				case 'homepageOrderWeatherAndAir':
 					$class = 'bg-success';
 					$image = 'plugins/images/tabs/wind.png';
@@ -5137,7 +5145,7 @@ class Organizr
 		];
 		return $this->processQueries($response);
 	}
-
+	
 	public function getNextCategoryId()
 	{
 		$response = [

api/config/default.php

@@ -377,6 +377,7 @@ return [
 	'homepageOrderAdguard' => '42',
 	'homepageOrderProwlarr' => '43',
 	'homepageOrderUptimeKuma' => '44',
+	'homepageOrderPromPage' => '45',
 	'homepageShowStreamNames' => false,
 	'homepageShowStreamNamesAuth' => '1',
 	'homepageShowStreamNamesWithoutIp' => false,
@@ -707,6 +708,13 @@ return [
 	'homepageUptimeKumaHeaderToggle' => true,
 	'homepageUptimeKumaCompact' => true,
 	'homepageUptimeKumaShowLatency' => true,
+	'homepagePromPageEnabled' => false,
+	'promPageURL' => '',
+	'homepagePromPageRefresh' => '60000',
+	'homepagePromPageHeader' => 'Status Page',
+	'homepagePromPageHeaderToggle' => true,
+	'homepagePromPageCompact' => true,
+	'homepagePromPageShowUptime' => true,
 	'checkForUpdate' => true,
 	'socksDebug' => false,
 	'maxSocksDebugSize' => 100

api/homepage/prompage.php

@@ -0,0 +1,117 @@
+<?php
+
+use GuzzleHttp\Client;
+use GuzzleHttp\Exception\GuzzleException;
+
+trait PromPageHomepageItem
+{
+	private static Client $kumaClient;
+
+	public function promPageSettingsArray($infoOnly = false)
+	{
+		$homepageInformation = [
+			'name' => 'PromPage',
+			'enabled' => true,
+			'image' => 'plugins/images/tabs/prompage.png',
+			'category' => 'Monitor',
+			'settingsArray' => __FUNCTION__
+		];
+		if ($infoOnly) {
+			return $homepageInformation;
+		}
+		$homepageSettings = [
+			'debug' => true,
+			'settings' => [
+				'Enable' => [
+					$this->settingsOption('html', null, ['override' => 6, 'label' => 'Info', 'html' => '<p>This homepage item requires <a href="https://github.com/henrywhitaker3/prompage" target="_blank" rel="noreferrer noopener">PromPage <i class="fa fa-external-link" aria-hidden="true"></i></a> to be running.</p>']),
+					$this->settingsOption('enable', 'homepagePromPageEnabled'),
+				],
+				'Connection' => [
+					$this->settingsOption('url', 'promPageURL', ['help' => 'URL for Uptime Kuma e.g. http://kuma:3001 (no trailing slash)', 'placeholder' => 'http://prompage:3000']),
+				],
+				'Options' => [
+					$this->settingsOption('refresh', 'homepagePromPageRefresh'),
+					$this->settingsOption('title', 'homepagePromPageHeader'),
+					$this->settingsOption('toggle-title', 'homepagePromPageHeaderToggle'),
+					$this->settingsOption('switch', 'homepagePromPageCompact', ['label' => 'Compact view', 'help' => 'Toggles the compact view of this homepage module']),
+					$this->settingsOption('switch', 'homepagePromPageShowUptime', ['label' => 'Show monitor uptime']),
+				],
+			]
+		];
+		return array_merge($homepageInformation, $homepageSettings);
+	}
+
+	public function promPageHomepagePermissions($key = null)
+	{
+		$permissions = [
+			'main' => [
+				'enabled' => [
+					'homepagePromPageEnabled'
+				],
+				'not_empty' => [
+					'promPageURL',
+				]
+			]
+		];
+		return $this->homepageCheckKeyPermissions($key, $permissions);
+	}
+
+	public function homepageOrderPromPage()
+	{
+		if ($this->homepageItemPermissions($this->promPageHomepagePermissions('main'))) {
+			return '
+				<div id="' . __FUNCTION__ . '">
+					<div class="white-box homepage-loading-box"><h2 class="text-center" lang="en">Loading Status Page...</h2></div>
+					<script>
+						// PromPage
+						homepagePromPage("' . $this->config['homepagePromPageRefresh'] . '");
+						// End PromPage
+					</script>
+				</div>
+				';
+		}
+	}
+
+	public function getpromPageHomepageData()
+	{
+		if (!$this->homepageItemPermissions($this->promPageHomepagePermissions('main'), true)) {
+			return false;
+		}
+		$api = [];
+		$url = $this->qualifyURL($this->config['promPageURL']);
+		try {
+			$services = json_decode($this->getPromPageClient($url, $this->config['promPageToken'])
+					->get('/api/services')
+					->getBody()
+					->getContents())->services;
+
+			$api = [
+				'data' => $services,
+				'options' => [
+					'title' => $this->config['homepagePromPageHeader'],
+					'titleToggle' => $this->config['homepagePromPageHeaderToggle'],
+					'compact' => $this->config['homepagePromPageCompact'],
+					'showUptime' => $this->config['homepagePromPageShowUptime'],
+				]
+			];
+		} catch (GuzzleException $e) {
+			$this->setLoggerChannel('promPage')->error($e);
+			$this->setAPIResponse('error', $e->getMessage(), 401);
+			return false;
+		};
+		$api = isset($api) ? $api : false;
+		$this->setAPIResponse('success', null, 200, $api);
+		return $api;
+	}
+
+	private function getPromPageClient(string $url): Client
+	{
+		if (!isset(static::$kumaClient)) {
+			static::$kumaClient = new Client([
+				'base_uri' => $url,
+			]);
+		}
+
+		return static::$kumaClient;
+	}
+}

api/v2/routes/homepage.php

@@ -316,6 +316,14 @@ $app->get('/homepage/kuma/data', function ($request, $response, $args) {
 		->withHeader('Content-Type', 'application/json;charset=UTF-8')
 		->withStatus($GLOBALS['responseCode']);
 });
+$app->get('/homepage/prompage/data', function ($request, $response, $args) {
+	$Organizr = ($request->getAttribute('Organizr')) ?? new Organizr();
+	$Organizr->getpromPageHomepageData();
+	$response->getBody()->write(jsonE($GLOBALS['api']));
+	return $response
+		->withHeader('Content-Type', 'application/json;charset=UTF-8')
+		->withStatus($GLOBALS['responseCode']);
+});
 $app->get('/homepage/speedtest/data', function ($request, $response, $args) {
 	$Organizr = ($request->getAttribute('Organizr')) ?? new Organizr();
 	$Organizr->getSpeedtestHomepageData();

js/functions.js

@@ -9206,6 +9206,121 @@ function homepageUptimeKuma(timeout){
     timeouts[timeoutTitle] = setTimeout(function(){ homepageUptimeKuma(timeout); }, timeout);
     delete timeout;
 }
+function buildPromPageItem(array) {
+    var cards = '';
+    var options = array['options'];
+    var services = array['data'];
+    var tabName = '';
+    console.log(options)
+
+    var buildCard = function(name, data) {
+        if(data.status == true) {
+            var statusColor = 'success'; var imageText = 'fa fa-check-circle text-success'
+        } else {
+            var statusColor = 'danger animated-3 loop-animation flash'; var imageText = 'fa fa-times-circle text-danger'
+        }
+        tabName = data.name;
+        if(options['compact']) {
+            var card = `
+            <div class="col-xl-2 col-lg-3 col-md-4 col-sm-6 col-xs-12">
+                <div class="card bg-inverse text-white mb-3 monitorr-card">
+                    <div class="card-body bg-org-alt pt-1 pb-1">
+                        <div class="d-flex no-block align-items-center">
+                            <div class="left-health bg-`+statusColor+`"></div>
+                            <div class="ml-1 w-100">
+                                <i class="`+imageText+` font-20 pull-right mt-3 mb-2"></i>
+                                `;
+                                card += `<h3 class="d-flex no-block align-items-center mt-2 mb-2"><img class="lazyload loginTitle">&nbsp;`+data.name;
+                                if (data.uptime != null && options.showUptime) {
+                                    card += `<span class="ml-3 font-12 align-self-center text-dark">`+ Math.round(data.uptime * 100) / 100 +`%</span></h3>`
+                                }
+                                card += `</h3>`
+                                card += `<div class="clearfix"></div>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+            </div>`;
+        } else {
+            var card = `
+            <div class="col-lg-2 col-md-3 col-sm-4 col-xs-6">
+                <div class="card bg-inverse text-white mb-3 monitorr-card">
+                    <div class="card-body bg-org-alt text-center">
+                        `;
+                        card += `<div class="d-block">
+                            <h3 class="mt-0 mb-2">`+data.name+`</h3>`
+                            
+                        if (data.uptime != null && options.showUptime) {
+                            card += `<p class="text-dark mb-0">`+ Math.round(data.uptime * 100) / 100 +`%</p>`
+                        }
+
+                        card += `</div>
+                        <div class="d-inline-block mt-4 py-2 px-4 badge indicator bg-`+statusColor+`">
+                            <p class="mb-0">`; if(data.status == true) { card += 'UP' } else { card += 'DOWN' } card+=`</p>
+                        </div>
+                        `;
+                        card += `</div>
+                </div>
+            </div>
+            `;
+        }
+        return card;
+    }
+    for(var key in services) {
+        cards += buildCard(key, services[key]);
+    };
+    return cards;
+}
+function buildPromPage(array) {
+    if(array === false){ return ''; }
+    if(array.error != undefined) {
+	    organizrConsole('PromPage Function',array.error, 'error');
+    } else {
+        var html = `
+        <div id="allPromPage">
+            <div class="el-element-overlay row">`
+        if(array['options']['titleToggle']) {
+            html += `
+                <div class="col-md-12">
+                    <h4 class="pull-left homepage-element-title"><span lang="en">`+array['options']['title']+`</span> : </h4>
+                    <hr class="hidden-xs ml-2">
+                </div>
+                <div class="clearfix"></div>
+            `;
+        }
+        html += `
+                <div class="promPageCards">
+                    `+buildPromPageItem(array)+`
+                </div>
+            </div>
+        </div>
+        <div class="clearfix"></div>
+        `;
+    }
+    return (array) ? html : '';
+}
+function homepagePromPage(timeout){
+    var timeout = (typeof timeout !== 'undefined') ? timeout : activeInfo.settings.homepage.refresh.homepagePromPageRefresh;
+    organizrAPI2('GET','api/v2/homepage/prompage/data').success(function(data) {
+        try {
+            let response = data.response;
+	        document.getElementById('homepageOrderPromPage').innerHTML = '';
+	        if(response.data !== null){
+		        buildUptimeKuma(response.data)
+		        $('#homepageOrderPromPage').html(buildPromPage(response.data));
+	        }
+        }catch(e) {
+            console.log(e)
+	        organizrCatchError(e,data);
+        }
+    }).fail(function(xhr) {
+	    OrganizrApiError(xhr);
+    });
+    let timeoutTitle = 'PromPage-Homepage';
+    if(typeof timeouts[timeoutTitle] !== 'undefined'){ clearTimeout(timeouts[timeoutTitle]); }
+    timeouts[timeoutTitle] = setTimeout(function(){ homepagePromPage(timeout); }, timeout);
+    delete timeout;
+}
 function homepageSpeedtest(timeout){
     var timeout = (typeof timeout !== 'undefined') ? timeout : activeInfo.settings.homepage.refresh.homepageSpeedtestRefresh;
     organizrAPI2('GET','api/v2/homepage/speedtest/data').success(function(data) {