add backers to page

api/classes/organizr.class.php

@@ -5251,6 +5251,20 @@ class Organizr
 		return false;
 	}
 	
+	public function getOpenCollectiveBackers()
+	{
+		$url = 'https://opencollective.com/organizr/members/users.json?limit=100&offset=0';
+		$options = (localURL($url)) ? array('verify' => false) : array();
+		$response = Requests::get($url, array(), $options);
+		if ($response->success) {
+			$api = json_decode($response->body, true);
+			$this->setAPIResponse('success', '', 200, $api);
+			return $api;
+		}
+		$this->setAPIResponse('error', 'Error connecting to Open Collective', 409);
+		return false;
+	}
+	
 	public function guestHash($start, $end)
 	{
 		$ip = $_SERVER['REMOTE_ADDR'];

api/pages/settings.php

@@ -20,6 +20,7 @@ function get_page_settings($Organizr)
         sponsorLoad();
         newsLoad();
         checkCommitLoad();
+        backersLoad();
         [].slice.call(document.querySelectorAll(\'.sttabs-main-settings-div\')).forEach(function(el) {
             new CBPFWTabs(el);
         });
@@ -229,6 +230,11 @@ function get_page_settings($Organizr)
     											<li><a href="https://organizr.app/discord" target="_blank"><i class="mdi mdi-discord mdi-24px"></i></a></li>
     											<li><a href="https://github.com/causefx/organizr" target="_blank"><i class="mdi mdi-github-box mdi-24px"></i></a></li>
     										</ul>
+    										<hr>
+    										<div class="p-20 p-t-0 text-center">
+						                        <h4 class="font-medium">Backers</h4>
+						                        <ul class="dp-table m-t-30 backers-list"></ul>
+						                    </div>
     									</div>
     									<a href="https://poeditor.com/join/project/T6l68hksTE" target="_blank">
 	                                        <div class="white-box bg-org">

api/v2/routes/opencollective.php

@@ -0,0 +1,9 @@
+<?php
+$app->get('/opencollective', function ($request, $response, $args) {
+	$Organizr = ($request->getAttribute('Organizr')) ?? new Organizr();
+	$Organizr->getOpenCollectiveBackers();
+	$response->getBody()->write(jsonE($GLOBALS['api']));
+	return $response
+		->withHeader('Content-Type', 'application/json;charset=UTF-8')
+		->withStatus($GLOBALS['responseCode']);
+});

js/functions.js

@@ -3461,7 +3461,32 @@ function sponsorLoad(){
         console.error("Organizr Function: Github Connection Failed");
     });
 }
-
+function backersLoad(){
+	organizrAPI2('GET','api/v2/opencollective').success(function(data) {
+		try {
+			let json = data.response;
+			$('.backers-list').html(buildBackers(json.data));
+		}catch(e) {
+			console.log(e + ' error: ' + data);
+			orgErrorAlert('<h4>' + e + '</h4>' + formatDebug(data));
+			return false;
+		}
+	}).fail(function(xhr) {
+		console.error("Organizr Function: API Connection Failed");
+	});
+}
+function buildBackers(array){
+	let backers = '';
+	$.each(array, function(i,v) {
+		if(v.type == 'USER' && v.role == 'BACKER' && v.isActive){
+			v.name = v.name ? v.name : 'User';
+			v.image = v.image ? v.image : 'image here';
+			backers += '<li><img src="'+v.image+'" alt="user" height="60" width="60" data-toggle="tooltip" title="" class="img-circle" data-original-title="'+v.name+'"></li>';
+		}
+	});
+	backers += '<li><a href="https://opencollective.com/organizr" target="_blank" class="circle circle-md bg-info di" data-toggle="tooltip" title="" data-original-title="Join">You</a></li>';
+	return backers;
+}
 function sponsorDetails(id){
 	sponsorsJSON().success(function(data) {
 		try {