如何跟踪 Meteor.js 中的焦点变化

Question

我的应用程序中有一个页面，它是一种协作工作区。在此页面上，我想显示已登录用户的列表，以及他们当前是否关注此协作工作区。

简而言之：我想跟踪某个页面上的焦点。

以前有人做过吗？或者周围有包裹吗？我找到了 BenjaminRH/meteor-event-hooks，但这似乎已经停止支持 2 年了。我已经尝试过了，运行遇到了很多问题。

Answer 1

您可以使用 dpid:user-presence 来执行此操作。将它添加到您的应用程序应该添加一个名为 UserPresences 的集合，其中包含有关当前打开您网站的每个浏览器 window 的信息。

Answer 2

这是一个完整的工作解决方案

我添加了包，并在客户端设置了一个额外的字段

UserPresence.data = function() {
    return {
         focus: Iron.Location.get().path
    };
 }

我从 Meteor.users 中读取相关的用户并将它们传递给视图

Template.userstatus.helpers({
    'users':function(){
        var project    = Projects.findOne({_id:Session.get('active_project')});
        var userList   = Meteor.users.find( { $or: [ {_id:{$in:project.invited}},
        {_id:project.userId} ] } );
        return userList;
    }
});

<template name="userstatus">
  <div class="panel panel-default">
    <div class="panel-heading">
      <h3 class="panel-title">Teilnehmer Status</h3>
    </div>
    <div class="panel-body">
          {{#each users}}
              {{ >useronline }}
          {{/each}}
    </div>
  </div>
</template>


<template name="useronline">
        <span style="margin-right: 2px;" class="label {{labelClass}}">{{profile.name }} </span>
 </template>

需要第二个模板，因为我需要助手中的 "this" 上下文来 "implicit join" 数据。

用户在状态 online/offline/idle/focussed) 中的实际显示是在 useronline 帮助器中完成的（类是普通的 bootstrap）：

Template.useronline.helpers({
     labelClass: function() {
        var UP = UserPresences.findOne( {userId:this._id});

        if (UP === undefined)
            return "label-default";

        if (UP.data.focus === Iron.Location.get().path)
             return "label-warning";

        if (UP.state === 'idle')
            return "label-primary";
        else if (UP.state === 'online')
            return "label-success";
        else
            return "label-default";
    }
});

如何跟踪 Meteor.js 中的焦点变化

How to track a focus change in Meteor.js

meteor

hook