forked from cory/tildefriends
52 lines
2.1 KiB
JavaScript
52 lines
2.1 KiB
JavaScript
|
Vue.component('tf-user', {
|
||
|
|
data: function() { return {users: g_data.users, show_user_dialog: false, show_follow_dialog: false} },
|
||
|
|
props: ['id'],
|
||
|
|
mounted: function() {
|
||
|
|
window.parent.postMessage({user: this.id}, '*');
|
||
|
|
},
|
||
|
|
computed: {
|
||
|
|
following: {
|
||
|
|
get: function() {
|
||
|
|
return g_data.users[g_data.whoami] &&
|
||
|
|
g_data.users[g_data.whoami].following &&
|
||
|
|
g_data.users[g_data.whoami].following.indexOf(this.id) != -1;
|
||
|
|
},
|
||
|
|
set: function(newValue) {
|
||
|
|
if (g_data.users[g_data.whoami] &&
|
||
|
|
g_data.users[g_data.whoami].following) {
|
||
|
|
if (newValue && g_data.users[g_data.whoami].following.indexOf(this.id) == -1) {
|
||
|
|
window.parent.postMessage({appendMessage: {type: "contact", following: true, contact: this.id}}, '*');
|
||
|
|
} else if (!newValue) {
|
||
|
|
window.parent.postMessage({appendMessage: {type: "contact", following: false, contact: this.id}}, '*');
|
||
|
|
}
|
||
|
|
}
|
||
|
|
},
|
||
|
|
},
|
||
|
|
},
|
||
|
|
template: `<span @click="show_user_dialog = true">
|
||
|
|
{{users[id] && users[id].name ? users[id].name : id}}
|
||
|
|
<md-tooltip v-if="users[id] && users[id].name">{{id}}</md-tooltip>
|
||
|
|
<md-dialog :md-active.sync="show_user_dialog">
|
||
|
|
<md-dialog-title>{{users[id] && users[id].name ? users[id].name : id}}</md-dialog-title>
|
||
|
|
<md-dialog-content v-if="users[id]">
|
||
|
|
<div v-if="users[id].image"><img :src="'/' + users[id].image + '/view'"></div>
|
||
|
|
<div v-if="users[id].name">{{id}}</div>
|
||
|
|
<div>{{users[id].description}}</div>
|
||
|
|
<div><md-switch v-model="following">Following</md-switch></div>
|
||
|
|
<md-list>
|
||
|
|
<md-subheader>Followers</md-subheader>
|
||
|
|
<md-list-item v-for="follower in (users[id] || []).followers" v-bind:key="'follower-' + follower">
|
||
|
|
<tf-user :id="follower"></tf-user>
|
||
|
|
</md-list-item>
|
||
|
|
<md-subheader>Following</md-subheader>
|
||
|
|
<md-list-item v-for="user in (users[id] || []).following" v-bind:key="'following-' + user">
|
||
|
|
<tf-user :id="user"></tf-user>
|
||
|
|
</md-list-item>
|
||
|
|
</md-list>
|
||
|
|
</md-dialog-content>
|
||
|
|
<md-dialog-actions>
|
||
|
|
<md-button @click="show_user_dialog = false">Close</md-button>
|
||
|
|
</md-dialog-actions>
|
||
|
|
</md-dialog>
|
||
|
|
</span>`,
|
||
|
|
});
|