Creating your First App
This guide walk you through how to build a new JavaScript app that will enable in-app user-to-user chat between platforms.
Create a new App
- Go to Magnet Studio.
- Click the + (add) icon in the navigation bar
- Enter a name for your app. Click Save to create your new app.
- In your
index.html file, add a script tag reference to the Magnet Max JavaScript SDK.
<script type="text/javascript" src="http://cdn.magnet.com/downloads/magnet-max-sdk.min.js"></script>
Initialize the SDK by providing the OAuth Client Id and Oauth Secret from the Settings page in the Max.init function.
Max.init({
clientId: '<your client id>',
clientSecret: '<your client secret>'
});
Make sure the SDK is initialized before adding any application logic:
// On Max initialized
Max.onReady(function() {
// your application logic
});
Register yourself as a Magnet Message User.
var user = {
userName: 'jane.doe',
firstName: 'Jane',
lastName: 'Doe',
password: 'magnet'
};
Max.User.register(user).success(function(newUser) {
// registration completed
}).error(function(err) {
// registration err
console.log(JSON.stringigy(err));
});
Login with the user created in the previous step.
var username = 'jane.doe';
var password = 'magnet';
Max.User.login(username, password).success(function() {
// start listening for messages
Max.start();
}).error(function(err) {
// login error
});
Get the current user after logging in with the code below.
//getCurrentUser() will return null if not currently logged in
var user = Max.getCurrentUser();
Get Users. To get a User by searching for their username, use the code below.
var usernames = ['jack.doe', 'jane.doe'];
Max.User.getUsersByUserNames(usernames).success(function(users) {
// do something with users
}).error(function(err) {
// handle error
});
Find Users. For example, to find all users whose display-name starts with a J, use the code below.
var query = {userName: 'J*'};
var limit = 10;
var offset = 0;
Max.User.search(query, limit, offset).success(function(users) {
// do something with users
}).error(function(err) {
// handle error
});
Create a chat channel.
Max.Channel.create({
name: 'myNewPrivateChannel',
summary: 'my new private channel',
isPublic: false,
publishPermission: 'subscribers'
}).success(function(newChannel) {
// do something with new channel
}).error(function(err) {
// handle error
});
Send the message.
var msg = new Max.Message({
myCustomKey: 'message to channel'
});
myChannel.publish(msg).success(function() {
// message has been published!
}).error(function(err) {
// handle error
});
Add a listener to receive the message and chat invitation.
var listener = new Max.EventListener('myListener', {
message: function(receivedMessage) {
// message has been received
alert('received message: ' + receivedMessage.messageContent);
},
invite: function(myInvite) {
// invitation has been received
},
inviteResponse: function(inviteResponse) {
// invitation response has been received
}
});
Max.registerListener(listener);
//be sure to make the corresponding call to Max.unregisterListener('myListener') to prevent leaking the listener
Invite more users into the chat using the same invitation process used in Private Discussion Group.
Get the chat history for the last 24 hours.
var startDate = new Date();
startDate = startDate.setDate(startDate.getDate() - 1);
var endDate = new Date();
var limit = 10;
var offset = 0;
var ascending = true;
myChannel.getMessages(startDate, endDate, limit, offset, ascending).success(function(messages) {
// do something with messages
}).error(function(err) {
// handle error
});
Get all chat recipients.
myChannel.getAllSubscribers().success(function(users) {
// do something with users
}).error(function(err) {
// handle error
});
Next Steps
See how to send Rich Message in your app.
