Statische Karten

Sie können statische Karten mit einfachen REST APIs einfügen, aktualisieren, lesen und löschen. Darüber hinaus können Sie Objekte an eine statische Karte anhängen, z. B. an einen Standort oder an Medien.

Funktionsweise

Statische Karten befinden sich standardmäßig rechts von der Glass-Uhr und enthalten zum Zeitpunkt der Lieferung relevante Informationen. Sie erfordern jedoch keine sofortige Aufmerksamkeit wie Livekarten und Nutzer können die Karte in ihrem eigenen Tempo lesen oder darauf reagieren.

Wenn Glassware statische Karten in die Zeitachse einfügt, kann Glass einen Benachrichtigungston abspielen, um Nutzer zu warnen. Alle vorherigen statischen Karten werden nach rechts verschoben und verschwinden nach 7 Tagen oder wenn 200 Karten neuer sind.

Verwendung

Statische Karten eignen sich hervorragend für wichtige regelmäßige Benachrichtigungen. Beispiel: Ein Nachrichtendienst, der aktuelle Top-Meldungen sendet. Statische Mirror API-Karten können über das Menüelement OPEN_URI auch Livekarten oder Immersionen starten. Auf diese Weise können Sie hybride Interaktionen erstellen, die statische Karten als Benachrichtigungen und eine Live-Karte oder ein interaktives Erlebnis verwenden.

Eine vollständige Liste der möglichen Vorgänge für Zeitachsenelemente finden Sie in der Referenzdokumentation.

Statische Karten einfügen

POSTEN Sie eine JSON-Darstellung eines Zeitachsenelements an den REST-Endpunkt, um statische Karten (Zeitachsenelemente) einzufügen.

Die meisten Felder in einem Zeitachsenelement sind optional. In ihrer einfachsten Form enthält ein Zeitachsenelement nur eine kurze SMS, wie in diesem Beispiel:

Rohes HTTP

POST /mirror/v1/timeline HTTP/1.1
Host: www.googleapis.com
Authorization: Bearer {auth token}
Content-Type: application/json
Content-Length: 26

{ "text": "Hello world" }

Java

TimelineItem timelineItem = new TimelineItem();
timelineItem.setText("Hello world");
service.timeline().insert(timelineItem).execute();

Python

timeline_item = {'text': 'Hello world'}
service.timeline().insert(body=timeline_item).execute()

Bei Erfolg erhalten Sie einen 201 Created-Antwortcode mit einer vollständigen Kopie des erstellten Elements. Für das vorherige Beispiel könnte eine erfolgreiche Antwort so aussehen:

Rohes HTTP

HTTP/1.1 201 Created
Date: Tue, 25 Sep 2012 23:30:11 GMT
Content-Type: application/json
Content-Length: 303

{
 "kind": "glass#timelineItem",
 "id": "1234567890",
 "selfLink": "https://www.googleapis.com/mirror/v1/timeline/1234567890",
 "created": "2012-09-25T23:28:43.192Z",
 "updated": "2012-09-25T23:28:43.192Z",
 "etag": "\"G5BI0RWvj-0jWdBrdWrPZV7xPKw/t25selcGS3uDEVT6FB09hAG-QQ\"",
 "text": "Hello world"
}

Das eingefügte Element, das auf der Zeitachse des Nutzers angezeigt wird, sieht folgendermaßen aus:

Zeitachsenelement mit Anhang einfügen

Ein Bild sagt mehr als tausend Worte – das ist weitaus mehr, als du in eine Zeitachse einbauen kannst. Zu diesem Zweck können Sie auch Bilder und Videos an ein Zeitachsenelement anhängen. Hier ein Beispiel für das Einfügen eines Zeitachsenelements mit einem Fotoanhang:

Rohes HTTP

POST /upload/mirror/v1/timeline HTTP/1.1
Host: www.googleapis.com
Authorization: Bearer {auth token}
Content-Type: multipart/related; boundary="mymultipartboundary"
Content-Length: {length}

--mymultipartboundary
Content-Type: application/json; charset=UTF-8

{ "text": "A solar eclipse of Saturn. Earth is also in this photo. Can you find it?" }
--mymultipartboundary
Content-Type: image/jpeg
Content-Transfer-Encoding: binary

[binary image data]
--mymultipartboundary--

Java

TimelineItem timelineItem = new TimelineItem();
timelineItem.setText("Hello world");
InputStreamContent mediaContent = new InputStreamContent(contentType, attachment);
service.timeline().insert(timelineItem, mediaContent).execute();

Python

timeline_item = {'text': 'Hello world'}
media_body = MediaIoBaseUpload(
    io.BytesIO(attachment), mimetype=content_type, resumable=True)
service.timeline().insert(body=timeline_item, media_body=media_body).execute()

Ein Zeitachsenelement mit angehängtem Bild sieht in Glass so aus:

Video wird angehängt

Wenn Sie Videodateien an Ihre Zeitachsenelemente anhängen, empfehlen wir, das Video zu streamen, anstatt die gesamte Nutzlast gleichzeitig hochzuladen. Die Google Mirror API unterstützt Streaming mit HTTP-Livestreaming, progressivem Download und RTSP (Real Time Streaming Protocol). RTSP wird häufig von Firewalls blockiert. Verwenden Sie daher nach Möglichkeit die anderen Optionen.

Verwenden Sie zum Streamen des Videos das integrierte Menüelement PLAY_VIDEO und geben Sie die URL des Videos als payload des Menüelements an. Weitere Informationen finden Sie unter Integrierte Menüelemente hinzufügen und Unterstützte Medienformate.

Seitenumbruch

Sie können Elemente auf der Zeitachse paginieren, die nicht auf eine einzelne Zeitachsenkarte passen, aber derselben Karte zugeordnet sein sollten. Diese Elemente haben denselben timeline.id und haben daher dieselben Menüelemente. Wenn ein Nutzer auf eine paginierte Zeitachse tippt, wird der Menüpunkt Weitere Informationen eingeblendet.

Glass nummeriert automatisch Zeitachsenelemente, die text anzeigen. Wenn Glass html automatisch paginieren soll, verwenden Sie das Tag article, wobei das Klassenattribut auf auto-paginate gesetzt ist. Beispiel:

<article class="auto-paginate">
 <h3>Very long list</h3>
 <ul>
   <li>First item</li>
   <li>Second item</li>
   <li>Third item</li>
   <li>Fourth item</li>
   <li>Fifth item</li>
   <li>Sixth item</li>
   <li>...</li>
 </ul>
<article>

Wenn Sie den Seitenumbruch manuell vornehmen möchten, verwenden Sie das Tag article für den Inhalt, den Sie auf den einzelnen Karten darstellen möchten. Glass zeigt den Inhalt jedes article-Tags auf einer separaten untergeordneten Zeitachse an. Sie können beispielsweise ein zeitgesteuertes Zeitachsenelement mit folgendem HTML-Code erstellen:

<article>
 <section>
   <p>First page</p>
 </section>
</article>

<article>
 <section>
   <p>Second page</p>
 </section>
</article>

<article>
 <section>
   <p>Third page</p>
 </section>
</article>

Standardmäßig wird die erste Karte der paginierten Zeitachse als Titelkarte und noch einmal angezeigt, wenn der Nutzer den Menüpunkt Weiterlesen auswählt. Damit die erste Karte nicht noch einmal erscheint, nachdem du auf Weitere Informationen getippt hast, kannst du die CSS-Klasse cover-only für das erste <article>-Tag angeben:

<article class="cover-only">
...

Die Klasse cover-only unterstützt auch automatisch paginierte Zeitachsenelemente:

<article class="auto-paginate cover-only">
...

Gruppierung

Mit der Gruppierung können Sie ähnliche, aber unterschiedliche Elemente gruppieren, z. B. für einzelne Nachrichten in einer E-Mail-Konversation. Sets haben eine Haupttitelkarte, auf die ein Nutzer tippt, um eine Unterzeitachse mit den anderen Karten im Bundle anzuzeigen. Sets unterscheiden sich von normalen Zeitachsenkarten durch einen Eckbogen in der rechten oberen Ecke der Titelkarte.

Wenn Sie Zeitachsenelemente bündeln möchten, erstellen Sie diese mit demselben Wert für bundleId. Das zuletzt hinzugefügte Element ist die Titelkarte des Sets.

Die folgenden Bilder zeigen eine Set-Karte mit Sets-Clips, die auf der rechten Seite eine Ecke enthalten und darunter zwei Bundle-Karten sind.

Zeitachsenelemente lesen

Ihr Dienst kann auf alle von ihm erstellten Zeitachsenelemente und alle Zeitachsenelemente zugreifen, die für ihn freigegeben wurden. Im Folgenden finden Sie eine Liste der Zeitachsenelemente, die für Ihren Dienst sichtbar sind.

Rohes HTTP

GET /mirror/v1/timeline HTTP/1.1
Host: www.googleapis.com
Authorization: Bearer {auth token}

Java

TimelineItem timelineItem = new TimelineItem();
service.timeline().list().execute();

Python

service.timeline().list().execute()

Sie können andere REST-Vorgänge verwenden, um Zeitachsenelemente zu get, update und delete.

Auf Anhänge zugreifen

Sie können über ein Array-Attribut namens attachments auf Anhänge zu einem Zeitachsenelement zugreifen. Sie können dann die Binärdaten eines Anhangs über das Attribut contentUrl des Anhangs oder mit dem Anhangsendpunkt abrufen.

Rohes HTTP

GET /mirror/v1/timeline/{itemId}/attachments/{attachmentId} HTTP/1.1
Host: www.googleapis.com
Authorization: Bearer {auth token}

Java

TimelineItem item = service.timeline().get(itemId).execute();
String attachmentId = item.getAttachments().get(0).getId();
service.attachments().get(itemId, attachmentId).executeAsInputStream();

Menüpunkte erstellen

Mit Menüelementen können Nutzer Aktionen anfordern, die mit der Zeitachsenkarte zusammenhängen und zwei Typen haben: integrierte und benutzerdefinierte Menüelemente.

Integrierte Menüoptionen bieten Zugriff auf spezielle Funktionen von Glass, z. B. das Vorlesen einer Zeitachse, das Navigieren zu einem Ort, das Teilen eines Bildes oder das Antworten auf eine Nachricht:

Mit benutzerdefinierten Menüpunkten kann Ihre Anwendung speziell für Ihre Glassware verhalten. Sie können auch ein Symbol für ein Menüelement bereitstellen, das zu Ihrem Branding passt.

Integrierte Menüpunkte hinzufügen

Sie können Ihren Zeitachsenelementen integrierte Menüelemente hinzufügen. Dazu füllen Sie beim Einfügen die menuItems array. Wenn Sie einen integrierten Menüpunkt verwenden möchten, müssen Sie nur die action von jeder menuItem füllen.

Rohes HTTP

HTTP/1.1 201 Created
Date: Tue, 25 Sep 2012 23:30:11 GMT
Content-Type: application/json
Content-Length: 303

{
  "text": "Hello world",
  "menuItems": [
    {
      "action": "REPLY"
    }
  ]
}

Benutzerdefinierte Menüoptionen definieren

Wenn integrierte Menüpunkte für Sie nicht geeignet sind, können Sie benutzerdefinierte Menüelemente mit Ihren eigenen Aktionen erstellen. Gehen Sie dazu beim Einfügen oder Aktualisieren eines Zeitachsenelements so vor:

  • Geben Sie CUSTOM für menuItem.action an.
  • Geben Sie einen menuItem.id an. Wenn Nutzer auf das benutzerdefinierte Menüelement tippen, erhält Ihre Glassware eine Benachrichtigung mit menuItem.id. So können Sie die Quelle der Benachrichtigung ermitteln.
  • Geben Sie menuItem.values an, um iconUrl und displayName in Glass hinzuzufügen. Bewegen Sie den Mauszeiger auf ein 50 x 50 Pixel großes PNG-Bild, das weiß ist und einen transparenten Hintergrund für iconUrl hat.
  • Geben Sie einen displayTime an. Wenn Sie keinen displayTime angeben, wird das Zeitachsenelement nach vorne verschoben, wenn Nutzer auf das benutzerdefinierte Menüelement tippen.

Rohes HTTP

HTTP/1.1 201 Created
Date: Tue, 25 Sep 2012 23:30:11 GMT
Content-Type: application/json
Content-Length: 303

{
  "text": "Hello world",
  "displayTime": "2013-08-08T22:47:31-07:00",
  "menuItems": [
    {
      "action": "CUSTOM",
      "id": "complete"
      "values": [{
        "displayName": "Complete",
        "iconUrl": "http://example.com/icons/complete.png"
      }]
    }
  ]
}

Nutzern erlauben, deine Zeitachsenkarte anzupinnen

Sie können einen Menüpunkt erstellen, mit dem Nutzer die Zeitachsenkarte anpinnen können. Sie zeigt die Karte dauerhaft links neben der Hauptuhr an. Nutzer können die Karte auch über denselben Menüpunkt loslösen.

Das Menüelement zum Anpinnen ist ein integrierter Menüpunkt. Du musst also nur die TOGGLE_PINNED action für ein menuItem angeben.

Rohes HTTP

HTTP/1.1 201 Created
Date: Tue, 25 Sep 2012 23:30:11 GMT
Content-Type: application/json
Content-Length: 303

{
  "text": "You can pin or unpin this card.",
 "menuItems": [
    {
      "action": "TOGGLE_PINNED"
    }
  ...
 ]
}

Abos

Mit der Mirror API können Sie Benachrichtigungen abonnieren, die gesendet werden, wenn der Nutzer bestimmte Aktionen für ein Zeitachsenelement ausführt oder wenn der Nutzerstandort aktualisiert wurde. Wenn Sie eine Benachrichtigung abonnieren, geben Sie eine Callback-URL an, über die die Benachrichtigung verarbeitet wird.

Benachrichtigungen erhalten

Eine Benachrichtigung von der Mirror API wird als POST-Anfrage an den abonnierten Endpunkt gesendet, der einen JSON-Anfragetext enthält.

Rohes HTTP

{
  "collection": "timeline",
  "itemId": "3hidvm0xez6r8_dacdb3103b8b604_h8rpllg",
  "operation": "UPDATE",
  "userToken": "harold_penguin",
  "verifyToken": "random_hash_to_verify_referer",
  "userActions": [
    {
      "type": "<TYPE>",
      "payload": "<PAYLOAD>"
    }
  ]
}

Java

import com.google.api.client.json.JsonFactory;
import com.google.api.client.json.jackson.JacksonFactory;
import com.google.api.services.mirror.model.Notification;

import java.io.IOException;
import java.io.InputStream;
// ...

public class MyClass {
  // ...

  /**
    * Parse a request body into a Notification object.
    *
    * @param requestBody The notification payload sent by the Mirror API.
    * @return Parsed notification payload if successful, {@code null} otherwise.
    */
  static Notification parseNotification(InputStream requestBody) {
    try {
      JsonFactory jsonFactory = new JacksonFactory();

      return jsonFactory.fromInputStream(requetBody, Notification.class);
    } catch (IOException e) {
      System.out.println("An error occurred: " + e);
      return null;
    }
  }

  // ...
}

Python

import json

def parse_notification(request_body):
  """Parse a request body into a notification dict.

  Params:
    request_body: The notification payload sent by the Mirror API as a string.
  Returns:
    Dict representing the notification payload.
  """
  return json.load(request_body)

Wenn kein Fehler aufgetreten ist, muss der Dienst an die API mit dem HTTP-Statuscode 200 OK antworten. Wenn Ihr Dienst mit einem Fehlercode antwortet, versucht die Mirror API möglicherweise, die Benachrichtigung noch einmal an Ihren Dienst zu senden.

Benachrichtigungstypen

Die Mirror API sendet eine andere Benachrichtigungsnutzlast für verschiedene Ereignisse.

Antworten

Der Nutzer hat über das integrierte Menüelement REPLY auf deine Zeitachse reagiert:

{
  "collection": "timeline",
  "itemId": "3hidvm0xez6r8_dacdb3103b8b604_h8rpllg",
  "operation": "INSERT",
  "userToken": "harold_penguin",
  "verifyToken": "random_hash_to_verify_referer",
  "userActions": [
    {
      "type": "REPLY"
    }
  ]
}

Das Attribut itemId ist auf ID des Elements festgelegt, das Folgendes enthält:

  • inReplyTo-Attribut, das auf ID des Zeitachsenelements festgelegt ist, auf das es eine Antwort ist.
  • Das Attribut text ist auf die Texttranskription festgelegt.
  • Das Attribut recipients, das auf creator des Zeitachsenelements festgelegt ist, auf das es eine Antwort ist, sofern vorhanden.

Beispiel:

{
  "kind": "glass#timelineItem",
  "id": "3hidvm0xez6r8_dacdb3103b8b604_h8rpllg",
  "inReplyTo": "3236e5b0-b282-4e00-9d7b-6b80e2f47f3d",
  "text": "This is a text reply",
  "recipients": [
    {
      "id": "CREATOR_ID",
      "displayName": "CREATOR_DISPLAY_NAME",
      "imageUrls": [
        "CREATOR_IMAGE_URL"
      ]
    }
  ]
}

Löschen

Der Nutzer hat ein Zeitachsenelement gelöscht:

{
  "collection": "timeline",
  "itemId": "3hidvm0xez6r8_dacdb3103b8b604_h8rpllg",
  "operation": "DELETE",
  "userToken": "harold_penguin",
  "verifyToken": "random_hash_to_verify_referer",
  "userActions": [
    {
      "type": "DELETE"
    }
  ]
}

Das Attribut itemId ist auf die ID des gelöschten Elements festgelegt. Das Element enthält außer der ID und dem Attribut isDeleted keine Metadaten mehr.

Benutzerdefinierter Menüpunkt ausgewählt

Der Nutzer hat einen benutzerdefinierten Menüpunkt ausgewählt, der von Ihrem Dienst festgelegt wurde:

{
  "collection": "timeline",
  "itemId": "3hidvm0xez6r8_dacdb3103b8b604_h8rpllg",
  "operation": "UPDATE",
  "userToken": "harold_penguin",
  "userActions": [
    {
      "type": "CUSTOM",
      "payload": "PING"
    }
  ]
}

Das Attribut itemId ist auf die ID des Menüelements festgelegt, das der Nutzer ausgewählt hat.

Das Array userActions enthält die Liste der benutzerdefinierten Aktionen, die der Nutzer für dieses Element ausgeführt hat. Ihr Dienst sollte diese Aktionen entsprechend bearbeiten.

Standortaktualisierung

Für den aktuellen Nutzer ist ein neuer Standort verfügbar:

{
  "collection": "locations",
  "itemId": "latest",
  "operation": "UPDATE",
  "userToken": "harold_penguin",
  "verifyToken": "random_hash_to_verify_referer"
}

Wenn Ihre Glassware ein Standortupdate erhält, senden Sie eine Anfrage an den Endpunkt glass.locations.get, um den neuesten bekannten Standort abzurufen. Ihre Glassware erhält alle zehn Minuten Standortupdates.

Sprachbefehl

Ihr Nutzer hat einen Sprachbefehl aktiviert. Beispiel: „Ok Glass, notieren Sie sich, Cat Stream, Chipotle hat morgen Geburtstag“. Die folgende Benachrichtigung wird an Ihr Glassware gesendet:

{
  "collection": "timeline",
  "operation": "INSERT",
  "userToken": "chipotle's_owner",
  "verifyToken": "mew mew mew",
  "itemId": "<ITEM_ID>",
  "userActions": [
    {“type”: "LAUNCH"}
  ]
}

Diese Benachrichtigung unterscheidet sich von anderen Benachrichtigungen durch den Wert LAUNCH in der Property userActions.

Sie können dann den Wert in itemId verwenden, um das Zeitachsenelement abzurufen:

{
  "id": "<ITEM_ID>",
  "text": "Chipotle's birthday is tomorrow",
  "recipients": [
    {"id": "CAT_STREAM"}
  ]
}

Das Attribut recipients enthält die id des Kontakts, der den verwendeten Sprachbefehl darstellt.