AppointmentTrader ermöglicht es Ihnen, Apps zu erstellen, die innerhalb des AppointmentTrader-Ökosystems ausgeführt werden. Sie können Apps entweder für sich selbst oder für andere bauen.

Die grundlegende Struktur, wie AT Apps funktionieren, besteht darin, dass Sie die App mit PHP 8 auf Ihrer eigenen Infrastruktur entwickeln. Während Sie sich an eine einfache Ordnerstruktur halten,
nimmt AT die Ausgaben Ihrer App über HTTPS-Aufrufe an Ihre Infrastruktur entgegen und präsentiert sie innerhalb der AppointmentTrader-Plattform.

Theoretisch können Sie jede Programmiersprache verwenden, allerdings können Sie Ihre App dann nicht für andere Nutzer veröffentlichen.

Wenn Sie die AppointmentTrader Developer Medal besitzen, können Sie Apps für sich selbst erstellen, ohne auf eine Überprüfung warten zu müssen. Wenn Sie Apps im App-Marktplatz veröffentlichen
oder auf ein Entwicklungsgebot antworten möchten, können Sie Ihre App zur Überprüfung einreichen. Dabei wird Ihr PHP-8-Quellcode analysiert und nach Freigabe im AppointmentTrader-Infrastruktur bereitgestellt. Das sichert eine schnelle Performance und stellt sicher, dass Ihr Code nach Abschluss der Überprüfung nicht mehr verändert wird.

Sie können Ihre Arbeit auf eine oder mehrere der folgenden Arten monetarisieren:

-> Sie erhalten automatisch eine Provision für jede Transaktion, die von einem anderen Nutzer über Ihre App ausgelöst wird (z.B. erstellen Sie einen verbesserten Kalender und Checkout-Flow, alle Transaktionen, die hierüber laufen, bringen Ihnen eine Provision ein).

-> Sie erhalten automatisch eine Provision für jeden kostenpflichtigen Endpoint, der durch Ihre App ausgeführt wird.

-> Sie können eine Abonnementgebühr verlangen

Wichtig: Da Apps ein integraler Bestandteil von AppointmentTrader werden können, behalten Sie Ihr Provisionsrecht, solange die App aktiv Nutzer bedient. Wir erlauben jedoch möglicherweise nicht, die App zurückzuziehen, sobald sie veröffentlicht und genutzt wird.

Apps können auf Ereignisse reagieren, die auf AppointmentTrader stattfinden.

Ihre App erhält nach der Registrierung über /v1/apps/set eine eindeutige Kennung und einen privaten Schlüssel

Die Registrierung einer App mittels /v1/apps/set liefert eine Antwort ähnlich dem untenstehenden Beispiel. Bitte laden Sie das AppointmentTrader SDK über die im Payload->sdkUrl-Feld definierte URL herunter.

Merken Sie: Geben Sie diese ZIP-Datei NICHT weiter. Sie enthält Ihre persönlichen Schlüssel und gefährdet Ihre Sicherheit, wenn sie geteilt wird.
Nachdem Sie den Inhalt dieser Datei entpackt haben, können Sie die in "boilerplateUrl" definierte Datei herunterladen, um das Basis-Setup wie unten definiert zu erhalten.
/v1/apps/get_list stellt Ihnen diese URLs für all Ihre Apps zur Verfügung, falls Sie diese erneut benötigen.

{
"RequestUserAlias": "YourUserHandle",
"RequestPath": "/v1/apps/set",
"RequestStatus": "Succeeded",
"ResponseCode": 100,
"ResponseMessage": "Request Successful",
"Payload": {
"uniqueAppIdentifier": "ForecastExplorer",
"sdkUrl": "https://appointmenttrader.com/modules/apps/download_sdk.php?unique_app_id=ForecastExplorer&app_private_key=588f9b00f6038448a3200d8b736474f4",
"boilerplateUrl": "https://appointmenttrader.com/modules/apps/download_sdk.php?boilerplate"
}
}


Apps können wie folgt aufgerufen werden:
https://appointmenttrader.com/[YourAppIdentifier]

Beispiel für Root-Ordner:

Für die aktuelle Version: (in diesem Beispiel wäre v3 die aktuelle Version)
https://appointmenttrader.com/ForecastExplorer
Für eine Legacy-Version: (nur für Entwickler- & Reviewer-Accounts sichtbar)
https://appointmenttrader.com/ForecastExplorer/legacy-versions/v2
Für den Entwicklungsstand (nur für Entwickler-Accounts sichtbar)
https://appointmenttrader.com/ForecastExplorer/development
Für den aktuellen Release-Candidate, der überprüft wird (nur für Entwickler- und Reviewer-Accounts sichtbar), nachdem der API-Endpunkt apps::set_new_version ausgeführt wurde
https://appointmenttrader.com/ForecastExplorer/release-candidate

Die App-Präsentationsstruktur ist wie folgt:


[AppointmentTrader HTML5 Header, + libraries in "uiLibraries"]

[Ihr gerendeter HTML- & Javascript-Code]

[AppointmentTrader HTML5 Footer]



Bitte befolgen Sie die folgenden Anweisungen zum Erstellen Ihrer HTML-Dateien für die Benutzeroberfläche:

Apps dürfen keine externen Front- oder Backend-Bibliotheken enthalten, sondern ausschließlich Vanilla HTML5, PHP, JavaScript und CSS-Code, es sind keine Frameworks erlaubt.
Im Backend müssen alle Kommunikationsvorgänge mit externen Anbietern über HTTPS-API-Aufrufe abgewickelt werden.

Ihre AT App muss Namespacing implementieren

Wir verlangen Namensräume innerhalb Ihrer App, um doppelte HTML-IDs, CSS-Klassen oder PHP-&-JavaScript-Funktionen im gesamten Ökosystem zu vermeiden.

Erforderliche HTML-ID-Namespaces:
HTML-Elemente können entweder keine ID haben oder, wenn sie eine ID haben, müssen Sie diese mit Ihrer eindeutigen App-Kennung prefixen. (zurückgegeben durch /v1/apps/set)
<span id="[YourAppIdentifier]-anyIdNameYouLike">Text</span>

Erforderliche JavaScript-Namespace-Implementierung:
Diese Art der Implementierung Ihrer JavaScript-Funktionen ist erforderlich, um doppelte Funktionsnamen zwischen Apps im Ökosystem zu vermeiden.

Hinweis: Verwenden Sie die globale Javascript-Variable _[YourAppIdentifier]BaseURL, um Ihren aktuellen Basis-URL relativ zum Projekt bei Aufgaben wie HTTPS Fetch Calls abzurufen.

var YourAppIdentifier = {};
YourAppIdentifier.CustomFunction = function(testParameter) {
console.log(testParameter);
};
YourAppIdentifier.CustomObject = {};

Erforderliche CSS-Namespace-Implementierung:
Globale Modifizierer wie [name="xxx"] sind nicht gestattet, alle Stylesheets müssen in Klassen oder ID-Operatoren gekapselt sein

#[YourAppIdentifier]-anyIdNameYouLike {
color: red;
}

.[YourAppIdentifier]-color-red-text {
color: red;
}

Erforderliche PHP-Namespace-Implementierung:
Binden Sie die Datei at_app_header.php in jeder Ihrer PHP-Dateien als erste Codezeile ein, damit Ihre App im richtigen Namespace arbeitet und API-Funktionen verfügbar sind – rufen Sie AT API-Funktionen nicht über einen https-Aufruf auf, sondern verwenden Sie die bereitgestellten PHP-Funktionen ATApiRead(string $endpoint, array $variables) und ATApiWrite(string $endpoint, array $variables, bool $validateRequestOnly). Die Methoden werden produktiv dann anders invokiert.

Beispiel für die Verwendung einiger Funktionen des PHP SDK:
// at_app_header.php setzt den Namespace ATApp[YourAppIdentifier]
include __DIR__ . '../at_app_header.php';

// $ATUser['ID'] enthält die UserID des eingeloggten Nutzers
// null falls kein Nutzer angemeldet ist
echo $ATUser['ID'] === null ? 'No logged in user present' : 'Logged in User ID:'.$ATUser['ID'];

//$ATUser['Alias'] enthält den User Alias
// null falls kein Nutzer angemeldet ist
echo $ATUser['Alias'] === null ? 'No logged in user present' : 'Logged in User Alias:'.$ATUser['Alias'];

//Ihr PHP-Code

Verwenden Sie _nicht_ <html /> <head /> und <body /> Tags – Ihr HTML wird in die AppointmentTrader-HTML-Struktur eingebunden, diese Tags wären daher überflüssig.

Fügen Sie alle benötigten Bibliotheken in die Datei structure.json.php unter dem Abschnitt "uiLibraries" ein, wie unten beschrieben, damit die Ressourcen korrekt in den AppointmentTrader-HTML-Code gerendert werden.

Bei AppointmentTrader-API-Aufrufen aus Ihrer HTML-Benutzeroberfläche müssen Sie das API-Key-Feld NICHT einfügen, da der aktuell eingeloggte Benutzer genutzt wird, um Ihre
Anfrage auszuführen.

Bitte strukturieren Sie Ihre App auf Ihrer Infrastruktur wie folgt:
(Beispiel: https://yourhomelabip/myatapp/)

Wichtig: Ihr AT-Projektverzeichnis muss Schreibrechte besitzen (unter Linux-Systemen 0777) für at_app_header.php, /appointmenttrader_sdk/ & /production/, da das AT-Revision-Management beim Deployen neuer Versionen Änderungen am Dateisystem vornimmt (z.B. Zippen, Hashen der Quell-Dateien und Aktualisieren der SDK-Dateien, falls erforderlich).

Sicherheitshinweis: /v1/apps/set gibt die öffentliche [YourAppIdentifier] und einen privaten Schlüssel aus, der eingefügt werden muss in die Variable $at_app_private_key in at_app_header.php, da dieser zur sicheren Dateisystemzugriff für AppointmentTrader genutzt wird.
/at_app_header.php -> diese Datei ist Teil des oben verlinkten SDK-Pakets und muss im Root-Ordner liegen und von allen Backend-PHP-Dateien eingebunden werden
/appointmenttrader_sdk/ -> enthält Asset-Dateien aus dem SDK-Paket
/development/ -> Dies ist Ihr Entwicklungsordner, angemeldet als Entwickler können Sie den aktuellen Entwicklungsstand live (ohne Review) unter https://appointmenttrader.com/[UserAlias]/[YourAppIdentifier]/development/ aufrufen. Sie nehmen alle Änderungen an dieser Struktur vor und das AppointmentTrader SDK übernimmt Deployment und Versionierung über die API :apps::set_new_version, sobald die Entwicklung und das Testen abgeschlossen sind.
/development/index.php -> Startseite Ihrer App
/development/structure.json.php -> Datei, die die App-Struktur enthält
/development/invoke_event.php (optional) -> wird aufgerufen, wenn ein für die App registriertes Ereignis ausgelöst wird (z.B. onNewBid)
/development/php-libraries/ (optional) -> falls Ihre App Libraries benötigt, legen Sie sie hier ab (müssen auf -lib.php enden, sonst werden sie im Review nicht akzeptiert, sie dürfen nicht direkt aufrufbar sein, um Namespaces überall zu erzwingen)
/development/css-libraries/ (optional) -> falls Ihre App CSS-Libraries hat, hier speichern
/development/javascript-libraries/ (optional) -> falls Ihre App JS-Libraries hat, hier speichern
/development/datastore/ (optional) -> hier erfolgen Lese- und Schreiboperationen im Zusammenhang mit Daten, dies ist der einzige Ordner, der im Produktivsystem per file_get_contents() beschrieben/gelesen werden darf
/development/assets/ (optional) -> wenn Ihre App Assets wie Bilder verwendet, speichern Sie diese hier. Greifen Sie per GET-Variable _ATWebBasePath, z.B. img src="echo $_GET['_ATWebBasePath']; assets/image.jpg" oder per Javascript-Variable _RequestPath darauf zu
/development/marketing/ -> enthält alle Materialien zur Präsentation Ihrer App für andere Nutzer
/development/marketing/storefront.html
/development/marketing/assets/ (optional)
/production/ -> Über die API :apps::set_new_version wird Ihr Server per AppointmentTrader SDK angesprochen, um ein ZIP-Archiv des aktuellen Entwicklungsstands zu erstellen und es mit folgender Ordnerstruktur an die AT-Produktionsumgebung zu übergeben.

Beispielhafte structure.json.php-Struktur, alle Pfade relativ zu [baseurl]version:

Wichtig: Fügen Sie keine JavaScript- oder CSS-Dateien per <script /> oder <link /> in Ihren HTML-Code ein, da AT dies über Ihre structure.json.php-Datei verwaltet.
Der 'any-ui-file'-Key macht Ihre Libraries in allen Dateien Ihres Projekts verfügbar, die File-Keys für bestimmte Dateien.
Mit dem 'globalAliasFor'-Key im Navigationsbereich geben Sie an, wo Nutzer Ihre App im AppointmentTrader-Portal implementieren können, z.B. bei einer besseren Portfolioansicht im Portfolio-Abschnitt.

{
"technical": {
"uiLibraries": {
"any-ui-file": [
{
"path": "/javascript-libraries/util.js",
"type": "javascript"
},
{
"path": "/css-libraries/style.css",
"type": "stylesheet"
}
],
"exampledir/examplefile.html": [
{
"path": "/javascript-libraries/extra_util.js",
"type": "javascript"
}
]
},
"registerForEventList": [
"OnNewBid"
],
"navigation": [
{
"itemName": "Pro Portfolio",
"itemDescription": "Advanced, fast Portfolio for Pro Sellers on AT",
"itemLink": "/exampledir/examplefile.php",
"globalAliasFor": "/modules/portfolio/index.php"
}
],
"marketing": [
{
"pricing":[{"monthly":[{"Type":"USDCent", "Amount":2900, "TrialperiodInDays":14}]}],
"appIconPath": "/assets/icon.png"
}],
"communityRewards": [
{
"perTranslatedKey":[{"Type":"Traderpoint", "Amount":25}],
"perValidatedBug":[{"Type":"Traderpoint", "Amount":250}]
}]
}
}


UI Styleguide

Bitte achten Sie darauf, dass Ihre App den folgenden Styleguide beachtet, um ein nahtloses Nutzererlebnis für AT-Nutzer zu gewährleisten

Farben:
#FFFFFF (weiß)
#3C9A52 (AppointmentTrader Grün)
#3D9563F (AppointmentTrader Rot)

#555555 Grau (hauptsächlich für Text)

Überschriften:
Bitte verwenden Sie aufsteigende Überschriften: h1 für den Hauptseitentitel, h2 für untergeordnete Abschnitte usw.

Infoboxen – bitte verwenden Sie den folgenden Stil, da Ihr HTML in das AppointmentTrader-Portal gerendert wird und Sie auf die genannten CSS-Klassen und Bilddateien Zugriff haben


<div class="shadow">;
<h2>Titel</h2>
<div class="info_box_line">
<div class="icon"> <img src="/images/ios-information-circle-outline.svg"> </div>
<div class="info">
<p class="small-text mb-1 gray-txt">Ihr Informationstext</p>
</div>
</div>
</div>


Elemente, die keine Infoboxen sind, sollten einen Abstand von 16px links und rechts besitzen
Der vertikale Abstand zwischen zusammengehörenden Elementen sollte 5px betragen, sonst 10px oder ein <hr>-Tag.

Absätze

<p class="small-text mb-1 gray-txt">Absatztext</p>


Links & Buttons:

Links

Sofern es sich nicht um einen externen Link handelt, nutzen Sie bitte die Funktion javascript:Navigate(), um dynamische Ladefunktionen zu nutzen.


<a class="link" href="javascript:Navigate('abc');">Button Text

Bestätigen-Button:

<a class="btn-profit" href="https://appointmenttrader.com">Button Text

Abbrechen-Button:

<a class="btn-cancel" href="https://appointmenttrader.com">Button Text

Löschen-Button:

<a class="btn-delete" href="https://appointmenttrader.com">Button Text

Bestätigen (wichtig)-Button:

<a class="btn full" href="https://appointmenttrader.com">Button Text

Formulare

<div class="form-group">
<label class="small-text gray-txt" id="[YourAppIdentifier]-input-field-label">Beschriftung für Ihr Eingabefeld</label>
<input autocomplete="off" type="text" class="form-control" value="" id="[YourAppIdentifier]-input-field">
</div>


UI-JavaScript-Funktionen

Eine Nachricht anzeigen

ScreenFeedback("Ihre Nachricht", "Ihr Titel");


AppointmentTrader ermöglicht es Nutzern, die gesamte Plattform über die Suchleiste auf jeder Seite zu bedienen.
App-Entwickler können das System nutzen, indem sie ihren Inhalten die folgenden Attribute hinzufügen.

Die allgemeine Struktur der DOM-Suche ist wie folgt:

CONTAINER
-- ELEMENT 1
-- ELEMENT 2


<ul data-domsearchgroupcontainer="Container Name">
<li data-domsearchgroup="Container Name" data-domsearchphrase="Container Name Item 1">Element 1</li>
<li data-domsearchgroup="Container Name" data-domsearchphrase="Container Name Item 2">Element 1</li>
</ul>



Mehrsprachiger Support

Beim Ausgeben von Text verwenden Sie bitte die SDK-Funktion echolang(), die automatisch Sprachschlüssel erstellt und es Community-Nutzern ermöglicht, Ihre App zu übersetzen.
Sie können Anreize für Nutzer bieten, Ihre App zu übersetzen, indem Sie in Ihrer structure.json.php unter "communityRewards"->"perTranslationKey" einen Wert eintragen. Damit erhält ein Community-Nutzer den angegebenen Betrag, wenn er eine Übersetzung zu Ihrer App hinzufügt.

Bietet hilfreiche Funktionen zur Ergänzung von Terminhandel

Verwaltet gemeinschaftsbezogene Funktionen

Verwaltet alle standortbezogenen Funktionen.

Verwaltet portfoliobezogene Funktionen wie Preisänderungen und Statusänderungen

Verwaltet alle portfoliobezogenen Funktionen

Verwaltet alle gebotsbezogenen Funktionen

Verwaltet KI-Chat-bezogene Funktionen

Verwaltet den Zugriff auf das AppointmentTrader-Konto

Enthält alle marktrelevanten Funktionen, damit Verkäufer im Laufe des Jahres Trends erkennen können

Verwaltet alle medaillen- und benutzerberechtigungsbezogenen Funktionen

Enthält alle benutzerbezogenen Funktionen

Verwaltet alle benachrichtigungsbezogenen Funktionen