1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
|
import { resolveComponent, h } from "vue";
const Blubber = {
init() {
const blubberPage = document.querySelector('#blubber-index, #messenger-course, .blubber_panel.vueinstance');
if (blubberPage !== null) {
const blubberPanel = document.querySelector('.blubber_panel');
if (blubberPanel !== null) {
connectBlubber(blubberPanel, 'BlubberCommunityPage');
}
}
$(document).on('dialog-open', function (event, { dialog }) {
const blubberPanel = dialog.querySelector('.blubber_panel');
if (blubberPanel !== null) {
connectBlubber(blubberPanel, 'BlubberDialogPanel');
}
});
function connectBlubber(blubberPanel, componentName) {
return Promise.all([window.STUDIP.Vue.load(), Blubber.plugin()]).then(
([{ createApp, store }, BlubberPlugin]) => {
const { initialThreadId, search } = blubberPanel.dataset;
const app = createApp({
render: () => h(resolveComponent(componentName), { initialThreadId, search }),
});
app.use(BlubberPlugin, { store });
app.mount(blubberPanel);
return app;
}
);
}
},
plugin() {
return import('@/vue/plugins/blubber.js').then(({ BlubberPlugin }) => BlubberPlugin);
},
refreshThread(data) {
STUDIP.eventBus.emit('studip:select-blubber-thread', data.thread_id);
},
followunfollow(thread_id, follow) {
const elements = $(`.blubber_panel .followunfollow[data-thread_id="${thread_id}"]`);
if (follow === undefined) {
follow = elements.hasClass('unfollowed');
}
elements.addClass('loading');
return STUDIP.Vue.load().then(async ({ store }) => {
return store.dispatch('studip/blubber/changeThreadSubscription', {
id: thread_id,
subscribe: follow,
});
}).then(() => {
elements.attr('aria-pressed', follow ? 'true' : 'false');
elements.toggleClass('unfollowed', !follow);
}).finally(() => {
elements.removeClass('loading');
});
},
Composer: {
vue: null,
init() {
STUDIP.Vue.load()
.then(({ createApp }) => {
let components = STUDIP.Blubber.components;
return createApp({
el: '#blubber_contact_ids',
data() {
return {
users: [],
};
},
methods: {
addUser: function (user_id, name) {
this.users.push({
user_id: user_id,
name: name,
});
},
removeUser(event) {
let user_id = $(event.target).closest('li').find('input').val();
this.users = this.users.filter(user => user.user_id !== user_id);
},
clearUsers: function () {
this.users = [];
},
},
components,
});
})
.then((app) => {
STUDIP.Blubber.Composer.vue = app;
});
},
},
};
export default Blubber;
|
