Create a custom Room booking screen

[powerappsEric]

Hello,

I am utilizing the Roombooking template and just wanted to customize the "Book without Meeting" option. Instead of just hit "Book" and exiting the app, I want to add one more screen to let users add: Descriptions, Coordinator, Attendees, Repeat time, Until Date of the booking.  

Any ideas would be very much appreciated!

[EricBLott]

The default functionality in that button is as follows:

Set(IsBooking, true);
Navigate(ConfirmationScreen, Cover)

What you'll want to do is change the ConfirmationScreen reference to your additional screen. On that screen, you'll need to have text inputs that collect the additional data you want to be stored in the booking. The OnChange properties of those inputs will need to Set() a global variable value to your data entries for use in the confirmation screen.

You'll need a button in your custom screen that eventually Navigate()s the user to the ConfirmationScreen, like the default formula of the Book button.

Next, let's look at the Confirmation Screen. The screen's OnVisible property fires off the meeting request.
See below:

If(IsBooking,
    UpdateContext({ShowLoading: true});
        If(!BookForMeeting,
            Office365.V2CalendarPostItem(MyCalendar, User().FullName & "'s Booking", StartDateTimeUTC, EndDateTimeUTC, 
            {RequiredAttendees:RoomsGallery.Selected.Email, Location: RoomsGallery.Selected.Name, Importance: "Normal", ShowAs: "Busy"}),
            
            ClearCollect(RequiredAttendeesNoRoom, Split(MeetingsGallery.Selected.RequiredAttendees, ";"));
            ForAll(AllRooms, RemoveIf(RequiredAttendeesNoRoom, Address = Result));
            ClearCollect(RequiredAttendeesNoRoom, Concat(RequiredAttendeesNoRoom, Result & ";"));
            ClearCollect(RequiredAttendeesNoRoom, Split(First(RequiredAttendeesNoRoom).Value, ";;"));
            Set(RequiredAttendeesFinal, First(RequiredAttendeesNoRoom).Result);
            Set(RequiredAttendeesTrue, RoomsGallery.Selected.Email & ";" & RequiredAttendeesFinal);
            Office365.V2CalendarPatchItem(MyCalendar, MeetingsGallery.Selected.Id, If(MeetingsGallery.Selected.Subject = User().FullName & "'s Skype Meeting", User().FullName & "'s Booking", MeetingsGallery.Selected.Subject), StartDateTimeUTC, EndDateTimeUTC, {RequiredAttendees: RequiredAttendeesTrue, OptionalAttendees: MeetingsGallery.Selected.OptionalAttendees, Body: "Room has been updated to " & RoomsGallery.Selected.Name, Location: RoomsGallery.Selected.Name, Importance: "Normal", ShowAs: "Busy"})
            );

    UpdateContext({ShowLoading: false})
);
Set(IsBooking, false)

Here, we'll need to inject the custom data elements you want to display by altering the Office365.V2CalendarPostItem call. For example, you can use Body for the meeting description like this (note the inclusion of varYourDescription):

If(IsBooking,
    UpdateContext({ShowLoading: true});
        If(!BookForMeeting,
            Office365.V2CalendarPostItem(MyCalendar, User().FullName & "'s Booking", StartDateTimeUTC, EndDateTimeUTC, 
            {RequiredAttendees:RoomsGallery.Selected.Email, Location: RoomsGallery.Selected.Name, Importance: "Normal", ShowAs: "Busy"
,Body:varYourDescription
            }),            
            ClearCollect(RequiredAttendeesNoRoom, Split(MeetingsGallery.Selected.RequiredAttendees, ";"));
            ForAll(AllRooms, RemoveIf(RequiredAttendeesNoRoom, Address = Result));
            ClearCollect(RequiredAttendeesNoRoom, Concat(RequiredAttendeesNoRoom, Result & ";"));
            ClearCollect(RequiredAttendeesNoRoom, Split(First(RequiredAttendeesNoRoom).Value, ";;"));
            Set(RequiredAttendeesFinal, First(RequiredAttendeesNoRoom).Result);
            Set(RequiredAttendeesTrue, RoomsGallery.Selected.Email & ";" & RequiredAttendeesFinal);
            Office365.V2CalendarPatchItem(MyCalendar, MeetingsGallery.Selected.Id, If(MeetingsGallery.Selected.Subject = User().FullName & "'s Skype Meeting", User().FullName & "'s Booking", MeetingsGallery.Selected.Subject), StartDateTimeUTC, EndDateTimeUTC, {RequiredAttendees: RequiredAttendeesTrue, OptionalAttendees: MeetingsGallery.Selected.OptionalAttendees, Body: "Room has been updated to " & RoomsGallery.Selected.Name, Location: RoomsGallery.Selected.Name, Importance: "Normal", ShowAs: "Busy"})
            );

    UpdateContext({ShowLoading: false})
);
Set(IsBooking, false)

It appears attendees is already built out, and you'll need to do some testing to see where your other data elements may fit, but that's the high level of how it would be done.

[EricBLott]

At a high level, you'll need to change the Navigate() function on the Book button so that it navigates to a custom screen.

There, you'll need to have text inputs for the user to enter the custom data values. Those will need to be Set() On Change of the inputs to global variables for reference in the confirmation screen.

Lastly, you'll need to alter the formula in the On Visible property of the ConfirmationScreen to capture those variables in the Office365.V2CalendarPostItem call in that property. You can do this by adding the Body column to the record passed to that action. For example:

Office365.V2CalendarPostItem(MyCalendar, User().FullName & "'s Booking", StartDateTimeUTC, EndDateTimeUTC, 
            {RequiredAttendees:RoomsGallery.Selected.Email, Location: RoomsGallery.Selected.Name, Importance: "Normal", ShowAs: "Busy",Body:varYourDescription})

[powerappsEric]

Thanks a lot for your detail instruction @EricBLott . I really appreciate it!

Your way is exactly what I am thinking. Would you mind elaborating on how to include the other data input as well? I need that new screen has dropdown lists to select who is the Coordinator, who are the attendees of the booking, what is the recurrence (daily, weekly, monthly) , and the recurrence end time. This screen is for the Room manager, who can go here and select on behalf of all attendees. 

[EricBLott]

@powerappsEric There is a lot to unpack with this solution.

First, how to reference the values - the inputs (dropdowns, text inputs, etc..) will need an OnChange property formula that uses Set() to capture their value as a global variable (alternatively, you could just reference each control from the other form, but I don't think that's ideal). So the OnChange of a dropdown may look like this:

Set(varCoordinator,Self.SelectedText)

This stores the selected coordinator in the variable varCoordinator. However, looking at the documentation here https://docs.microsoft.com/en-us/connectors/office365/#create-event-(v2)-[deprecated]

I don't know which value you would set for the coordinator unless this is just something you want to stick in the body of the invite. It's also worth mentioning that this method is deprecated and you should use the v4 method here https://docs.microsoft.com/en-us/connectors/office365/#create-event-(v4)

In the v2 documentation, you'll see references to the other options you mention such as Recurrence, end of Recurrence, etc.. You'll use the same method I mentioned in my other response to just add those values to the record you pass the CreateEvent call.

[powerappsEric]

"It appears attendees is already built out, and you'll need to do some testing to see where your other data elements may fit, but that's the high level of how it would be done."

Just additional info, the attendees that the system picked is just the Room email itself (it gets from AvailableRoomEmails collection). So I would like to pick the person instead for the booking. 

[powerappsEric]

Thanks @EricBLott . Your explanation is quite easy to understand. I am doing it right now and I have decided to use the Combo Box instead os Dropdown list, as the Combo allows me to choose several attendees at once. Butthe problem now is I can not call the varAttendees on Onchange method like your suggestion, as it contains more than once in the record. Could you let me know how to deal with this Combo box? 

[EricBLott]

@powerappsEric Try this in the combo box OnChange property (change yourValueColumn to whichever value you want to capture, such as email). This will give you a semicolon separated list of the selected items.

Set(varAttendees,Concat(Self.SelectedItems,yourValueColumn,";"))

[powerappsEric]

I have changed as your suggestion, but the Onvisible of the Confirm screen keep saying the varAttendees was specified more than once in this record. As method is quite good for capture multiple emails, but seem the V2CalendarPostItem does not understand how to let multiple records work. Do you have any idea? @EricBLott 

[EricBLott]

@powerappsEric That means the RequiredAttendees field was included multiople times in that record reference. Check inside the {curly brackets} to see what the other value being passed for RequiredAtendees is. You can combine them using Concatenate() or the & symbol. You will need to add a semicolon between the values.