Both users see the same page but only one can modify it


I am building a video chat page for my app. And trying to figure out how to make the following thing.

There is a parent thing called meeting which contains information about users involved in in this meeting“s video chat and unique appearin room link. Example of this page is below.

The question is how to make that both users see the same version of the page. In other words, let“s assume that these two users have two roles: interviewer (can change topic (dropdown) and questions (by clicking back and next)) and interviewee (can only see current question which is set by interviewer and no dropdown and buttons). What is more, there should be an option to swap the roles (additional button that is absent in the example). Any ideas on how to do this?

Currently (without any settings) both users can manage current topic and question on their own and they are not synchronized.


Its exactly like you say, add a field ‘role’ to the user Thing.

Then put everything that you need to hide from user X inside a group and hide the group. Then use a condition on the group that says: when current user’s role is Y, this group is visible.

You can play around with this. This is one option, you could set a state of a group to something on page load depending on the user’s role etc. But it starts with identifying the users by adding a field of ‘role’.

Btw, are you embedding the room through an iframe?

Thank you for the idea I will try it now.

Concerning I did the same as it is described here (Building a videoconferencing app on Bubble?).

I tried and the problem is that each user controls state of the group (which includes questions not controls) independently. For example, when interviewer goes to the next question (meaning that state of this group changed for him), the displayed to interviewee question remains the same (there is no change happened in the current state for him).

Is there a way to synchronize this?

So you want the role to change dynamically during a session? You could add a button ‘switch’ that just changes the user’s role on the spot.

You can easily change the current user. For the other user, you can add a ‘do search for’ user or you make that user the current page’s user.

However, you could also work with custom states and you won’t need roles. You could set a group to custom state ‘control’ which would be a field of User. There are a couple of ways to do this. Simplest would be with a ‘take control’ and ‘give control’ button.

There will be two constraints when you click the ‘give control’ button: if Group A’s control = current user > set Group A’s control to blank (no value, basically releasing the controls).

(you can then add a condition to the button to change the text: when Group A’s control is empty, text: Take control.

Then the other constraint is: when button ‘take’ control’ is clicked and Group A’s control is not current user (or group’s control is empty) > set group’s control = current user.

Then Group A will have two conditions:

when this group’s control is empty: not visible
when this group’s control is not empty: visible

This is the easiest way that does not take into consideration any user roles. It also means that you cannot give control, because that requires a bit more input (selecting the user to provide control to).

1 Like

@vincent56 I understood how to hide/ show controls using roles. Thank you for this. But still there is another question. May be I mentioned it not very clear. The thing is when i log in the meeting from two devices by different profiles. Controls are hiden for one user based on roles. There are no problems here anymore. However, when a user with controls (who is supposed to manage the current question that is displayed for both of them) clicks “back” and “next” buttons, questions only on his page change and current question of the second user remains the same. So i need situation when user with controls moves from one question to another the same changes appeared at second user’s screen.

At the moment when back and next buttons are clicked state of the group is changed:

The controls are session based, so they allow for the same interaction for different users. You need to handle this with states as well or even with database entries to ‘remember’ the state when a page is refreshed.

1 Like

I think @vincent56 is correct that you’ll need to store state in the database. Here’s one way you might do this.

I don’t know your database structure but I’m going to assume that:

a) You have data types for the following or similar:

  • Interview (holds details of the two users engaging in an interview, plus date etc)
  • Question (holds a reusable set of questions)
  • Interview Question (holds details of questions asked in a given Interview, as well as answers etc)

b) When two users are in session, they are interacting on the equivalent of an Interview page (or in an Interview group if you’re building a single-page app). Or something similar anyway.

Based on the above assumptions, you could try something like the following:

  1. Add a a current (yes/no) field to the Interview Question table in the database
  2. At the start of a session, set the first Interview Question to Current = ‘yes’
  3. When the interviewer advances to a new Interview Question, set current to ‘no’ on the previous Interview Question and to yes on the newly currrent Interview Question
  4. Use a Repeating Group with a fixed number of cells = 1 and a source of do a search for Interview Questions where (constraints): Interview = Current Page’s Interview (or Parent Group’s Interview) AND Current = ‘yes’.
1 Like

Thanks a lot @vincent56 and @louisadekoya ! You helped me much!

I decided to manage show/hide controls using states and similarity of questions using additional data base entries and a repeating group.

1 Like

This topic was automatically closed after 70 days. New replies are no longer allowed.