JavaScript integration

JavaScript SDK will let you integrate with React, Meteor, AngularJS and more. Enter to see how to use widget methods, enable events etc.

Integracja JavaScript

How to set it up?

Widget:
Widget methods are available through global window object UE. To Enable events, pass them as properties for main widget configuration object.
Please note that this is a JavaScript API/SDK documentation, for the REST API please head to this url.
Use attributes:
W ciągu UE.init(), UE.refresh() and UE.pageHit() metody możesz używać tych samych atrybutów co w window.civchat obiekt (w tym atrybuty niestandardowe).
Here’s a list of just a few attributes you could use (default ones):
Methods:

Deprecated methods:

UE.init() i UE.refesh(). Those has been merged into one method: UE.pageHit(). The rest remain as it is.

UE.pageHit()

Initialize the widget or send PING signal to main server. Equivalent of navigating to new page in "standard" HTTP installations.

<script>
  UE.pageHit({
    apiKey: 'YOUR_API_KEY',
    name: "John Doe",
    email: "myemail@example.org",
    gender: 2,
    status: 2,
    phone_number: "+48754123434", // Must be a valid E.164 format
    score: 0,
    company: {
      revenue: "$239.9 billion",
      employees: 32
    },
    source_context: {
      foo: "bar",
      john: "doe"
    }
  });
</script>

UE.destroy()

Destroy current widget instance and remove window from DOM. This method takes no arguments. After current widget instance has been destroyed, you cannot refer to the ue methods.

UE.destroy({}); 

UE.resetAuth(data)

This function resets __ca__chat cookie, then creating new one or assigning existing one based on email adress (if provided). Parameter data is an JSON object with email key and value.

Technicznie rzecz ujmując, możesz usunąć plik cookie używając tej funkcjonalności i stworzyć od razu nowy.

UE.resetAuth({
  apiKey: "YOUR_API_KEY",
  email: "johndoe@mydomain.com"
});

Eventy

onLoad()

Wyzwalanie kiedy otwierane jest okienko widgetu.

UE.pageHit({
  apiKey: "YOUR_API_KEY",
  email: "johndoe@example.com",
  name: "John Doe",
  phone_number: "+48123456789",
  source_context: {
    foo: "bar",
    john: "doe"
  },
  onLoad() {
    alert("Widget loaded!");
  }
});

onMessage()

Działa dla każdej przychodzącej wiadomości. Obiekt wiadomości będzie przekazany wewnątrz wyzwolonej funkcji.

UE.init({
  apiKey: "YOUR_API_KEY",
  email: "johndoe@example.com",
  name: "John Doe",
  phone_number: "+48123456789",
  source_context: {
    foo: "bar",
    john: "doe"
  },
  onMessage() {
    alert("Received a message!");
  }
});

Przykłady obiektu wiadomości:

{
  content: "Hello, world!",
  isAdmin: false
}

Jeśli isAdmin is set to true, it means that message came from backend side, otherwise it will be set to false and it means that message came from front-end widget.' %}

onOpen()

Włączony kiedy otwierane jest okienko widgetu.

UE.pageHit({
  apiKey: "YOUR_API_KEY",
  email: "johndoe@example.com",
  name: "John Doe",
  phone_number: "+48123456789",
  source_context: {
    foo: "bar",
    john: "doe"
  },
  onOpen() {
    alert("Opened a chat!");
  }
});

onClose()

Włączony kiedy zamykane jest okienko widgetu.

UE.pageHit({
  apiKey: "YOUR_API_KEY",
  email: "johndoe@example.com",
  name: "John Doe",
  phone_number: "+48123456789",
  onClose() {
    alert("Closed a chat!");
  }
});