{"id":18782975,"url":"https://github.com/webex/embeddedappkitchensink","last_synced_at":"2025-04-13T12:09:09.897Z","repository":{"id":37889159,"uuid":"377920093","full_name":"webex/EmbeddedAppKitchenSink","owner":"webex","description":"The \"kitchen sink\" sample app for Webex Embedded Apps","archived":false,"fork":false,"pushed_at":"2025-02-06T14:57:59.000Z","size":2309,"stargazers_count":14,"open_issues_count":0,"forks_count":19,"subscribers_count":10,"default_branch":"main","last_synced_at":"2025-04-13T12:08:57.280Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":"https://webex.github.io/EmbeddedAppKitchenSink","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"other","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/webex.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2021-06-17T18:03:40.000Z","updated_at":"2025-02-06T14:58:04.000Z","dependencies_parsed_at":"2024-11-07T20:39:54.180Z","dependency_job_id":"35671aef-63df-4fe6-af57-c2beb8f99f69","html_url":"https://github.com/webex/EmbeddedAppKitchenSink","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/webex%2FEmbeddedAppKitchenSink","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/webex%2FEmbeddedAppKitchenSink/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/webex%2FEmbeddedAppKitchenSink/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/webex%2FEmbeddedAppKitchenSink/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/webex","download_url":"https://codeload.github.com/webex/EmbeddedAppKitchenSink/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":248710448,"owners_count":21149190,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":[],"created_at":"2024-11-07T20:37:40.153Z","updated_at":"2025-04-13T12:09:09.873Z","avatar_url":"https://github.com/webex.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# Hello, developer!\n\nThis is a basic web application enabled with the [Webex Embedded Apps Framework](https://developer.webex.com/docs/embedded-apps).  As most \"kitchen sink\" applications do, it exercises all the events and methods that the framework offers. Be creative! the real magic happens in your own imagination. 🦄\n\n## What's in this project?\n\n- `README.md`: That's this file, an intro to what each file is and the details about the project.\n- `style.css`: CSS files add styling rules to your content. We intentionally left things a bit sparse; feel free to expand on the look and feel as you see fit.\n- `index.html`: This is the root page of the site; it also happens to be the \"host\" configuration page where an app is set up and prepared to be \"pushed\" (deployed) to the participants!\n- `index.js`: This page contains the JavaScript which makes the index page do its magic. Feel free to poke around and see how simple it is to call methods and receive events!\n- `participant.html`: This is the page that is pushed out to a participant; it has similar methods and events as the main page!\n- `participant.js`: This page contains the JavaScript which feeds the participant experience. Feel free to poke around and see how simple it is to call methods and receive events!\n- `utils.js`: This page contains the JavaScript with common utilities and functions across the applications.\n- `loginWithWebex.js`: This page contains the JavaScript which handles the [Login with Webex](https://developer.webex.com/docs/login-with-webex) functionality.\n\n\n## Next steps 🚀\n\nBuild an app! You can fork this project or start from scratch. Simply replace the default app URL in the Webex app with your own app URL... super easy!\n\n- Need more help? [Check out our Help Center](https://support.webex.com/) for answers to any common questions.\n- Ready to launch? [Deploy your app today](https://apphub.webex.com) to reach webex users in unique and clever ways, be the hero you always wanted to be.\n\n## Onboarding and testing the KitchenSink app\n\nYou can use the deployed instance of the kitchen sink app ([https://webexsamples.github.io/EmbeddedAppSample](https://webexsamples.github.io/EmbeddedAppSample)) for testing in your own Webex meeting or messaging space.\n\n* [Onboarding the app](#onboarding-the-app)\n* [Test app in-space](#test-app-in-space)\n* [Test app in-meeting](#test-app-in-meeting)\n\n### Onboarding the app\n\n**To on-board the kitchen sink app**:\n\n1. Open the [New Embedded App](https://developer.webex.com/my-apps/new/embedded-app) page on the [Developer Portal](https://developer.webex.com/).\n2. Enter or select the following app configuration options:\n\n    * **Where does your app work?** \u0026mdash; Select both **Meeting** and **Messaging** options\n    * **Embedded app name** \u0026mdash; Enter `Kitchen sink app`\n    * **Description** \u0026mdash; Enter `Kitchen sink app description`\n    * **Tag line** \u0026mdash; Enter `Kitchen sink app tag line`\n    * **Icon** \u0026mdash; Select one of the default icons (or upload your own).\n    * **Valid domains** \u0026mdash; Enter `webexsamples.github.io`\n    * **Start page URL** \u0026mdash; Enter `https://webexsamples.github.io/EmbeddedAppSample`\n\n    Leave **In-Meeting start page URL** and **Space start page URL** at their default (empty) values.\n\n    \u003ca href=\"https://raw.githubusercontent.com/tstatler/EmbeddedAppSample/onboarding-steps/images/new_embedded-app-2.png\"\u003e\u003cimg src=\"images/new_embedded-app-2.png\" alt=\"Girl in a jacket\" height=\"800\"\u003e\u003c/a\u003e\n\n3. Click **Add Embedded App**.\n\nNext, test the app in a Webex messaging space or meeting. To fully test the experience in a meeting you will need to invite another participant to your meeting.\n\n### Test app in-space\n\n**To test the app in a Messaging space**:\n\n1. In the Webex App, open an existing messaging space or create a new one for testing purposes. (Note: All users in the space will be able to see and open the app).\n\n2. Click **+ Apps** space tab to open the **Apps** tray.\n\n    ![](images/app-tray-space.png)\n\n3. Click the Kitchen sink app to open its specified start page URL.\n\n    Because your app hasn't been approved for use by your Webex site administrator a dialog appears asking if you'd like to share your personal information with the app or not. See [Personally Identifiable Information (PII) and Embedded Apps](https://developer.webex.com/docs/api/guides/embedded-apps-guide#personally-identifiable-information-pii-and-embedded-apps) for more information.\n\n4. Select **Open and share my personal information** then click **Open**.\n\n    ![](images/pii-dialog.png)\n\n5. Click the **setShareURL** button, which makes the **Add to tab** button appear.\n\n    ![](images/add-to-tab.png)\n\n6. Click **Add to tab**. The app at the shared URL opens as a new tab.\n\n    ![](images/space-tab-added.png)\n\n### Test app in-meeting\n\n**To test the app in a meeting:**\n\n1. Start a meeting and invite a participant to join.\n2. Click the **Apps** button to open the **Apps** tray.\n\n    ![](images/ea-meetings-static-hero.png)\n\n3. Click **Kitchen sink app** and in the confirmation dialog select **Open and share my personal information** then click **Open**, as in the messaging space.\n\n    The start page URL opens in a sidebar window.\n\n4. Click **setShareUrl**. The **Open together** button appears.\n\n5. Click **Open together** to open the shared URL for the meeting participant in a window.\n\n6. To stop the session for the participant, click **Stop session**.\n\n    ![](images/stop-session.png)\n\n## Local Development\n\nTo start development locally with this sample application, clone the repo and install dependencies: \n\n- `git clone https://github.com/WebexSamples/EmbeddedAppSample.git`\n- `npm install`\n\n### Starting the Application\n\nThe application has a web server ready to use, run `npm start` to host on https://localhost:3000\n\n### Login With Webex\n\nIn order to utilize the Login with Webex functionality locally, follow the steps on the [Login with Webex](https://developer.webex.com/docs/login-with-webex) documentation page to create a new integration.\n\nAdd the following URIs to the Redirect URI section:\n- https://localhost:3000\n- https://localhost:3000/participant.html\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fwebex%2Fembeddedappkitchensink","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fwebex%2Fembeddedappkitchensink","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fwebex%2Fembeddedappkitchensink/lists"}