Skip to content

Latest commit

 

History

History
96 lines (69 loc) · 3.13 KB

Readme.md

File metadata and controls

96 lines (69 loc) · 3.13 KB
Raw
page_type description products languages extensions contentType createdDate
sample
Microsoft Teams meeting extensibility sample for iteracting with Details Tab in-meeting
office-teams
office
office-365
nodejs
samples
07-07-2021 13:38:27

Meetings Details Tab

This sample app illustrates the implementation of Details Tab in Meeting. User can create a poll and post poll in meeting chat and participants can submit their feedback in Meeting.

Prerequisites

  • Node.js version 10.14 or higher

    # determine node version
node --version

  • Ngrok (Only for devbox testing) Latest (any other tunneling software can also be used)

     # run ngrok locally
ngrok http -host-header=localhost 3978

  • Teams Microsoft Teams is installed and you have an account

To try this sample

  1. Clone the repository

    git clone https://github.com/OfficeDev/Microsoft-Teams-Samples.git

    • In a terminal, navigate to samples/meetings-details-tab/nodejs

      cd samples/meetings-details-tab/nodejs

    • Install modules and Start the bot

    • Server will run on PORT: 4001

      npm run server

      This command is equivalent to: npm install > npm run build-client > npm start

    • Start client application

    • Client will run on PORT: 3978

      npm run client

      This command is equivalent to: cd client > npm install > npm start

Create a new Bot by following steps mentioned in Build a bot documentation.

Go to .env file and add BotId , BotPassword and BaseUrl as ngrok URL information. Update the manifest.json file with Microsoft-App-ID,BotId, BaseUrl as ngrok URL Install the app in Teams.

Interacting with the bot

Interact with Details Tab in Meeting.

  1. Install the Details Tab manifest in meeting chat.
  2. Add the Details Tab in Meeting
  3. Click on Add Agenda
  4. Newly added agenda will be added to Tab. Image
  5. Click on Send button in Agenda from Tab.
  6. An Adaptive Card will be posted in meeting chat for feedback. Image
  7. Participants in meeting can submit their response in adaptive card
  8. Response will be recorded and Bot will send an new adaptive card with response. Image
  9. Participants in meeting can view the results from meeting chat or Tab itself.