Working with can-connect

[marshallswain]

Here's an example that works with can-connect. This example is a supermodel created by running donejs add supermodel then adding the realtime stuff and providing the methods for the data-url behavior.

import can from 'can';
import superMap from 'can-connect/can/super-map/';
import tag from 'can-connect/can/tag/';
import 'can/map/define/define';
import feathers from 'feathers-client';
import io from 'steal-socket.io';

var token = '';
const url = 'http://localhost:8080/';
if(window.localStorage){
  token = window.localStorage.getItem('authToken');
}

const socket = io(url, {
  query: 'token=' + token,
  transports:['websocket']
});
var app = feathers(url)
  .configure(feathers.socketio(socket));
var prefService = app.service('/preferences');

export const Preference = can.Map.extend({
  define: {}
});

Preference.List = can.List.extend({
  Map: Preference
}, {});

export const preferenceConnection = superMap({
  idProp: '_id',
  Map: Preference,
  List: Preference.List,
  name: 'preference',
  url: {
    getListData(params){
      return new Promise(function(success, error){
        return prefService.find(params, function(err, data) {
          if (err) {
            return error(err);
          }
          console.log('Found the following data', data);
          return success(data);
        });
      });
    },
    getData(params){
      return new Promise(function(success, error){
        return prefService.get(params._id, params, function(err, data) {
          if (err) {
            return error(err);
          }
          console.log('Got the following data', data);
          return success(data);
        });
      });
    },
    createData(data){
      console.log(data);
      return new Promise(function(success, error){
        return prefService.create(data, function(err, data){
          if (err) {
            return error(err);
          }
          console.log('Created data', data);
          return success(data);
        });
      });
    },
    updateData(data){
      return new Promise(function(success, error){
        return prefService.update(data, function(err, data){
          if(err){
            return error(err);
          }
          console.log('Updated data', data);
          return success(data);
        });  
      });
    },
    destroyData(id){
      return new Promise(function(success, error){
        return prefService.remove(id, function(err, data){
          if(err){
            return error(err);
          }
          console.log('Removed data', data);
          return success(data);
        });  
      });
    }    
  }
});

tag('preference-model', preferenceConnection);

socket.on('preferences created', preference => preferenceConnection.createInstance(preference));
socket.on('preferences updated', preference => preferenceConnection.updateInstance(preference));
socket.on('preferences removed', preference => preferenceConnection.destroyInstance(preference));

export default Preference;

This will be a lot more elegant once #7 is complete. In this particular case in the app I'm building, I have it checking for a preferences object for the current user on page load. If it doesn’t exist, it creates one, but it all happens before the socket is connected, which will be easy to fix with Promises.

[daffl]

Promises are now supported in the 0.3.0 release. The plugin is also using ES6 now. Let me know if you run into any issues upgrading the can-connect adapter!

[marshallswain]

👍