Privacy

Note: If you skipped ahead to this section, click here to download a zip of the tutorial at this point.

Right now all the chats are published to all the clients which is not very safe for privacy. Let's fix that.

First thing we need to do inorder to stop all the automatic publication of information is to remove the autopublish package from the Meteor server. Type in the command line:

$ meteor remove autopublish

We will add now the publish-composite package which will help us implement joined collection pubications.

$ meteor add reywood:publish-composite

Now we need to explicitly define our publications. Let's start by sending the users' information.

Create a file named publications.js under the api/server with the following contents:

6.3 Add new chat service src/services/new-chat.service.js

import { Service } from 'angular-ecmascript/module-helpers';

export default class NewChatService extends Service {

  static $inject = ['$rootScope', '$ionicModal']

  static $name = 'NewChat'

  constructor() {

    super(...arguments);

    this.templateUrl = 'templates/new-chat.html';

  showModal() {

    this.scope = this.$rootScope.$new();

    this.$ionicModal.fromTemplateUrl(this.templateUrl, {

      scope: this.scope

})

    .then((modal) => {

      this.modal = modal;

      this.modal.show();

});

  hideModal() {

    this.scope.$destroy();

    this.modal.remove();

Improve this code

For the users collection we only defined a query for publication, and for the chats we defined a composite publication where each user will get his relevant chats.

And of course we need to modify some of the client side code, we need to make sure that the client is subscribed to the published data, so let's do so in NewChatCtrl, because this is where we need the users data:

6.4 Load new chat service src/app.js

import SettingsCtrl from './controllers/settings.controller';

import InputDirective from './directives/input.directive';

import CalendarFilter from './filters/calendar.filter';

import NewChatService from './services/new-chat.service';

import Routes from './routes';

const App = 'whatsapp';

...some lines skipped...

  .load(SettingsCtrl)

  .load(InputDirective)

  .load(CalendarFilter)

  .load(NewChatService)

  .load(Routes);

Ionic.Platform.ready(() => {

Improve this code

Now we will add a subscription to the chats data in the client:

6.5 Add new chat view www/templates/new-chat.html

<ion-modal-view ng-controller="NewChatCtrl as chat">

  <ion-header-bar>

    <h1 class="title">New Chat</h1>

    <div class="buttons">

      <button class="button button-clear button-positive" ng-click="chat.hideNewChatModal()">Cancel</button>

    </div>

  </ion-header-bar>

  <ion-content>

    <div class="list">

      <a ng-repeat="user in chat.users" ng-click="chat.newChat(user._id)" class="item">

        <h2>{{user.profile.name}}</h2>

<p>

          Hey there! I am using meteor-Whatsapp with meteor.

        </p>

      </a>

    </div>

  </ion-content>

</ion-modal-view>

Improve this code

WhatsApp Clone with Meteor and Ionic CLI

https://github.com/Urigo/IonicCLI-Meteor-WhatsApp

Privacy