| node_modules | |
| DS_Store | |
| .nvmrc | |
| .idea |
Dieses Beispiel verwendet den JavaScript API-Client um alle Annotationen (Events) vom Typus "video" auszulesen.
Bitte tragen Sie zuerst Ihren API Key in die Datei app.js ein.
Lassen Sie npm install (benötigt Node.js) im Ordner laufen um benötigte Dateien zu laden.
Wir verwenden den PHP Server für lokales Testing: php -s localhost:9696. Öffnen Sie http://localhost:9696 in Ihrem Browser.
| jQuery(function(){ | |
| var config = { | |
| piecemaker : { | |
| host: 'https://piecemaker2-api-public.herokuapp.com', | |
| api_key: '' // API Key bitte hier eintragen | |
| }, | |
| group_id : 29 | |
| }; | |
| if ( config.piecemaker.api_key ) { | |
| var pm2 = new PieceMakerApi( config.piecemaker ); | |
| pm2.listEventsOfType( config.group_id, 'video', function ( videos ) { | |
| var vidElms = []; | |
| videos.forEach(function(e,i){ | |
| var elm = jQuery( '<div class="video-element">'+ e.fields.title+'</div>' ); | |
| vidElms.push(elm); | |
| }); | |
| jQuery('#videos').empty().append(vidElms).addClass('videos-loaded'); | |
| }); | |
| } else { | |
| jQuery('#videos').empty().text('Bitte tragen Sie Ihren API Key in der Datei app.js ein.').addClass('message'); | |
| } | |
| }); |
| <!doctype html> | |
| <html lang="en"> | |
| <head> | |
| <meta charset="UTF-8"> | |
| <title>Beispiel zur Verwendung von Piecemaker2</title> | |
| <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script> | |
| <script src="node_modules/piecemaker-api-client/releases/piecemaker-api-client-current.js"></script> | |
| <script src="app.js"></script> | |
| <link rel="stylesheet" href="style.css"/> | |
| </head> | |
| <body> | |
| <h1>Alle Einträge vom Typus "video" in der Gruppe "Deborah Hay"</h1> | |
| <div id="videos">Loading …</div> | |
| </body> | |
| </html> |
| { | |
| "name": "beispiel-piecemaker-2", | |
| "version": "1.0.0", | |
| "description": "Zeigt beispielhaft die Verwendung von Piecemaker 2 Annotationen mittels JavaScript", | |
| "main": "index.js", | |
| "scripts": { | |
| "test": "echo \"Error: no test specified\" && exit 1" | |
| }, | |
| "author": "", | |
| "license": "ISC", | |
| "dependencies" : { | |
| "piecemaker-api-client" : "*" | |
| } | |
| } |
| body { | |
| font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; | |
| } | |
| div.videos-loaded { | |
| border-top: 1px solid gray; | |
| } | |
| div.video-element { | |
| border-bottom: 1px solid gray; | |
| padding: 0.2em 0 0.2em 0.2em; | |
| } | |
| div.message { | |
| color: orangered; | |
| } |