diff --git a/src/App.js b/src/App.js index e9248967..a052e058 100644 --- a/src/App.js +++ b/src/App.js @@ -2,6 +2,7 @@ import UserPanel from './components/user_panel/user_panel.vue' import NavPanel from './components/nav_panel/nav_panel.vue' import Notifications from './components/notifications/notifications.vue' import UserFinder from './components/user_finder/user_finder.vue' +import WhoToFollowPanel from './components/who_to_follow_panel/who_to_follow_panel.vue' import InstanceSpecificPanel from './components/instance_specific_panel/instance_specific_panel.vue' import ChatPanel from './components/chat_panel/chat_panel.vue' @@ -12,8 +13,9 @@ export default { NavPanel, Notifications, UserFinder, - ChatPanel, - InstanceSpecificPanel + WhoToFollowPanel, + InstanceSpecificPanel, + ChatPanel }, data: () => ({ mobileActivePanel: 'timeline' @@ -27,6 +29,7 @@ export default { style () { return { 'background-image': `url(${this.background})` } }, sitename () { return this.$store.state.config.name }, chat () { return this.$store.state.chat.channel.state === 'joined' }, + showWhoToFollowPanel () { return this.$store.state.config.showWhoToFollowPanel }, showInstanceSpecificPanel () { return this.$store.state.config.showInstanceSpecificPanel } }, methods: { diff --git a/src/App.vue b/src/App.vue index a8d17fa7..923d411b 100644 --- a/src/App.vue +++ b/src/App.vue @@ -24,6 +24,7 @@ + diff --git a/src/components/who_to_follow_panel/who_to_follow_panel.js b/src/components/who_to_follow_panel/who_to_follow_panel.js new file mode 100644 index 00000000..47952d21 --- /dev/null +++ b/src/components/who_to_follow_panel/who_to_follow_panel.js @@ -0,0 +1,130 @@ +function showWhoToFollow (panel, users, aHost, aUser) { + var cn + var index = 0 + var random = Math.floor(Math.random() * 10) + for (cn = random; cn < users.length; cn = cn + 10) { + var user + user = users[cn] + var host + host = user.host + var username + if (user.username) { + username = user.username + } else { + username = user.user + } + var img + if (user.avatar) { + img = user.avatar + } else { + img = '/images/avi.png' + } + var name = username + '@' + host + if ((!user.following) && + (!user.blacklisted) && + (!(host === aHost && username === aUser))) { + if (index === 0) { + panel.img1 = img + panel.name1 = name + panel.$store.state.api.backendInteractor.externalProfile(name) + .then((externalUser) => { + if (!externalUser.error) { + panel.$store.commit('addNewUsers', [externalUser]) + panel.id1 = externalUser.id + } + }) + } else if (index === 1) { + panel.img2 = img + panel.name2 = name + panel.$store.state.api.backendInteractor.externalProfile(name) + .then((externalUser) => { + if (!externalUser.error) { + panel.$store.commit('addNewUsers', [externalUser]) + panel.id2 = externalUser.id + } + }) + } else if (index === 2) { + panel.img3 = img + panel.name3 = name + panel.$store.state.api.backendInteractor.externalProfile(name) + .then((externalUser) => { + if (!externalUser.error) { + panel.$store.commit('addNewUsers', [externalUser]) + panel.id3 = externalUser.id + } + }) + } + index = index + 1 + if (index > 2) { + break + } + } + } +} + +function getWhoToFollow (panel) { + var user = panel.$store.state.users.currentUser.screen_name + if (user) { + panel.name1 = 'Loading...' + panel.name2 = 'Loading...' + panel.name3 = 'Loading...' + var host = window.location.hostname + var url = 'https://vinayaka.distsn.org/cgi-bin/vinayaka-user-match-simple-api.cgi?' + + encodeURIComponent(host) + '+' + encodeURIComponent(user) + window.fetch(url, {mode: 'cors'}).then(function (response) { + if (response.ok) { + return response.json() + } else { + panel.name1 = '' + panel.name2 = '' + panel.name3 = '' + } + }).then(function (users) { + showWhoToFollow(panel, users, host, user) + }) + } +} + +const WhoToFollowPanel = { + data: () => ({ + img1: '/images/avi.png', + name1: '', + id1: 0, + img2: '/images/avi.png', + name2: '', + id2: 0, + img3: '/images/avi.png', + name3: '', + id3: 0 + }), + computed: { + user: function () { + return this.$store.state.users.currentUser.screen_name + }, + moreUrl: function () { + var host = window.location.hostname + var user = this.user + var url = 'https://vinayaka.distsn.org/?' + + encodeURIComponent(host) + '+' + encodeURIComponent(user) + return url + }, + showWhoToFollowPanel () { + return this.$store.state.config.showWhoToFollowPanel + } + }, + watch: { + user: function (user, oldUser) { + if (this.showWhoToFollowPanel) { + getWhoToFollow(this) + } + } + }, + mounted: + function () { + if (this.showWhoToFollowPanel) { + getWhoToFollow(this) + } + } +} + +export default WhoToFollowPanel diff --git a/src/components/who_to_follow_panel/who_to_follow_panel.vue b/src/components/who_to_follow_panel/who_to_follow_panel.vue new file mode 100644 index 00000000..021b9557 --- /dev/null +++ b/src/components/who_to_follow_panel/who_to_follow_panel.vue @@ -0,0 +1,37 @@ + + + + + diff --git a/src/main.js b/src/main.js index 7ca34adf..a40c51f2 100644 --- a/src/main.js +++ b/src/main.js @@ -88,10 +88,11 @@ window.fetch('/api/statusnet/config.json') window.fetch('/static/config.json') .then((res) => res.json()) .then((data) => { - const {theme, background, logo, showInstanceSpecificPanel} = data + const {theme, background, logo, showWhoToFollowPanel, showInstanceSpecificPanel} = data store.dispatch('setOption', { name: 'theme', value: theme }) store.dispatch('setOption', { name: 'background', value: background }) store.dispatch('setOption', { name: 'logo', value: logo }) + store.dispatch('setOption', { name: 'showWhoToFollowPanel', value: showWhoToFollowPanel }) store.dispatch('setOption', { name: 'showInstanceSpecificPanel', value: showInstanceSpecificPanel }) if (data['chatDisabled']) { store.dispatch('disableChat') diff --git a/static/config.json b/static/config.json index 5cf4cdec..2c495142 100644 --- a/static/config.json +++ b/static/config.json @@ -5,5 +5,6 @@ "redirectRootNoLogin": "/main/all", "redirectRootLogin": "/main/friends", "chatDisabled": false, + "showWhoToFollowPanel": false, "showInstanceSpecificPanel": false }