update example: make compatible with IAA javascripts

SjonHortensius · SjonHortensius · commit 898a9aafb91f · 2020-05-29T14:53:19.000+02:00
diff --git a/example/README.md b/example/README.md
@@ -12,20 +12,22 @@ Set the correct `API_KEY` and `API_SECRET` and optional `PLATFORM` and you can c
 any supported method, for example:
 
 ### Show all valid data from a valid postal code
-`.../example/index.php?action=dutchAddressByPostcode&data[]=2012es&data[]=30`
+`example/index.php?p=dutchAddressByPostcode/2012es/30`
 
 ### Return an exception for non-existing addresses
-`.../example/index.php?action=dutchAddressByPostcode&data[]=2012es&data[]=31`
+`example/index.php?p=dutchAddressByPostcode/2012es/31`
 
 ### Show autocomplete results for a German lookup
-`.../example/index.php?action=internationalAutocomplete&data[]=deu&data[]=strasse&data[]=CLIENT_SESSION_FROM_COOKIE`
+`example/index.php?p=internationalAutocomplete/deu/strasse/CLIENT_SESSION_FROM_COOKIE`
 
 Please only use this proxy as an example for your own implementation.
 What you should add:
 
 * Don't allow random calls but implement what you use in a custom wrapper
 * Add caching to prevent fetching the same data over and over
 * Add Session by reading `$_COOKIE`, don't pass it in the URL
+* Configure your webserver to send all requests under a certain directory to your proxy
+ so you don't need to use `?p=`
 
 License
 =============
diff --git a/example/autocomplete.html b/example/autocomplete.html
@@ -0,0 +1,30 @@
+<!DOCTYPE html>
+<html lang="nl-NL">
+<head>
+	<style>
+		input[type=text]{
+			width: 500px;	
+		}
+	</style>
+	<link rel="stylesheet" href="https://api.postcode.nl/static/3.2.16.0/css/autocomplete-address.css">
+	<script src="https://api.postcode.nl/static/3.2.16.0/js/PostcodeNl/AutocompleteAddress.min.js"></script>
+	<script src="https://api.postcode.nl/static/3.2.16.0/js/PostcodeNl/AutocompleteAddress.js"></script>
+</head>
+<body>
+	<form>
+		<input type="text" class="input-autocomplete" placeholder="City, street or postcode">
+	</form>
+
+	<address class="autocomplete-result autocomplete-result-int"></address>
+	<script>
+		const inputElement = document.querySelector('.input-autocomplete'),
+			autocomplete = new PostcodeNl.AutocompleteAddress(inputElement, {
+			autocompleteUrl: 'index.php?p=internationalAutocomplete', // Required
+			addressDetailsUrl: 'index.php?p=internationalGetDetails', // Required
+		});
+
+		inputElement.addEventListener('autocomplete-select', function (e) {
+			console.log('Selected item:', e.detail);
+		});
+	</script>
+</body>
diff --git a/example/index.php b/example/index.php
@@ -1,8 +1,8 @@
 <?php
 
-define('API_KEY',    /* as received by mail after signing up */);
-define('API_SECRET', /* as received by mail after signing up */);
-define('PLATFORM', 'example proxy');
+define('API_KEY',    '** insert key here **');
+define('API_SECRET', '** insert secret here **');
+define('PLATFORM',   'example proxy');
 
 
 // this will load exceptions when they occur
@@ -15,11 +15,24 @@
 
 try
 {
-	if (0 !== strpos($_GET['action'], 'international') && 0 !== strpos($_GET['action'], 'dutchAddress'))
+	if (!isset($_GET['p']))
+		throw new Exception('Missing parameters');
+
+	$parts = explode('/', $_GET['p']);
+
+	if (count($parts) < 2)
+		throw new Exception('Not enough parameters');
+
+	$action = array_shift($parts);
+
+	if (0 !== strpos($action, 'international') && 0 !== strpos($action, 'dutchAddress'))
 		throw new Exception('This example only supports calls to international or dutchAddress methods');
 
+	if ($action == 'internationalAutocomplete' || $action == 'internationalGetDetails')
+		$parts []= 'MY_SESSION_ID';
+
 	$client = new PostcodeNl\Api\Client(API_KEY, API_SECRET, PLATFORM);
-	print json_encode(call_user_func_array([$client, $_GET['action']], $_GET['data'] ?? []));
+	print json_encode(call_user_func_array([$client, $action], $parts));
 }
 catch (Exception $e)
 {
