Working with Data

Loading Data

Chat is a backend-oriented component and expects remote data loaded by URL:

 view: "chat", url: "remote/data"

Data Services

Chat uses the following services to work with data:

1. Local Data

  • stores data on the client side in Data Collections
  • provides methods for getting and repainting the data
  • provides methods for getting chats, users and messages
const local = $$("chat").getService("local");
const chats = local.chats(); // returns chats collection

2. Operations

  • provides methods for adding/leaving/updating chats and messages
const ops = $$("chat").getService("operations");
ops.addMessage(cid, origin, text); // adds a new message

3. Backend

  • provides methods for issuing requests to the backend to fetch data and save the changes back
const back = $$("chat").getService("backend");
back.users().then((data) => console.log(data));

4. Upload

  • provides methods for uploading the avatars for chats

5. Helpers

  • provides methods for view templates, dateFormats, etc
const helpers = $$("chat").getService("helpers");
helpers.dateChatFormat(date); // sets new date format

Study the models folder in the source code for method signatures.

Data Operations

Getting chats

All loaded chats are stored in DataCollection. To access the collection call the .chats() method of the Local service:

const chat = $$("ch");
chat.getService("backend").ready().then(() => {
  const chats = chat.getService("local")
  .chats() // getting the collection
  .serialize(); // serializing the collection to access data elements
});

Each chat object has the following fields:

  • avatar (string) - the URL to load chat avatar from;
  • date (object) - date object;
  • direct_id (number) - the id of the user with whom a private chat is active;
  • id (number) - the chat id;
  • message ("string") - the latest message in the chat;
  • name (string) - the chat name;
  • unread_count (number) - number of the unread messages in the chat (from the current user perspective);
  • users (array) - an array of users of the chat.

Chat object

{
  avatar: "remote/avatars/members.jpg",
  chat_id: 0,
  date: new Date(),
  direct_id: 0,
  id: 19,
  message: "Hi there",
  name: "Today's meeting",
  unread_count: 2,
  user_id: 2,
  users: [3, 4, 1]
}

Getting users

To get the users collection call the users() method of the Local service:

const chat = $$("ch");
chat.getService("backend").ready().then(() => {
  const users = chat.getService("local")
  .users() // getting the collection
  .serialize(); // serializing the collection to access data elements
});

A single user object has the following fields:

  • avatar (string) - URL to load user avatar from;
  • email (string) - the user email;
  • id (number) - the user id;
  • name (string) - the user name;
  • status (number) - the user status. Takes one of the following values:
    • 1 - "none",
    • 2 - "active",
    • 3 - "busy",
    • 4 - "away"

User object

  avatar: "remote/avatars/1.jpg"
  email: "alex@brown.com"
  id: 1
  name: "Alex Brown"
  status: 2

Getting messages

To access messages from a certain chat call the messages() method and pass the ID of the chat as a parameter:

const chat = $$("ch");
chat.getService("backend").ready().then(() => {
  chat.getService("local")
  .messages(6) // getting an array of messages from the chat with "id: 6"
  .then(messages => {
    console.log(messages); // messages array
  });
});

Related sample:  Chat: Data Operations

The method returns a promise that resolves with an array of messages from the specified chat. Each message object has the following fields:

Message object

{
  chat_id: 6,
  date: new Date(),
  id: 19,
  text: "Who is on duty today?",
  user_id: 2
}
  • chat_id (number) - the chat id;
  • date (object) - date object;
  • id (number) - the id of the message;
  • text (string) - the text of the message;
  • user_id (number) - the id of the user the message was left by.
Back to top