# CSS flexbox markup for \`WebSDK-sample-angular\` project **URL:** \ **Category:** Web\ **Created:** [September 25, 2020, 6:22am UTC](https://devforum.zoom.us/t/css-flexbox-markup-for-websdk-sample-angular-project/31276 "2020-09-25T06:22:23Z")\ **Posts on this page:** 9\ **Page:** 1
**Author:** ![mlininkl](https://avatars.discourse-cdn.com/v4/letter/m/35a633/32.png) [@mlininkl](https://devforum.zoom.us/u/mlininkl)\ **Post date:** [September 25, 2020, 6:22am UTC](https://devforum.zoom.us/t/css-flexbox-markup-for-websdk-sample-angular-project/31276/1 "2020-09-25T06:22:23Z")
> [@All modern browsers reject camera and microphone when loading through SAME origin iframe - Bug clearly visible in Zoom Web SDK example app](https://devforum.zoom.us/t/all-modern-browsers-reject-camera-and-microphone-when-loading-through-same-origin-iframe-bug-clearly-visible-in-zoom-web-sdk-example-app/28171/7): > > Hey @tlock, @nvivot, Thanks for your feedback. We are working to make the Web SDK more customizable, not override styles, and not have dependencies like jQuery. We realize the current functionality is not ideal for custom implementations, and are working to improve it. slight_smile Thanks, Tommy Is anyone working on an Angular/Ionic project with the WebSDK? @tommy I put together another crack at CSS for containing Zoom inside a flexbox (see below). But I’m having problems catching the “joining meeting” screen because it flashes by so quickly. ![Screen Shot 2020-09-25 at 8.12.19 AM](https://us1.discourse-cdn.com/flex016/uploads/zoomdeveloper/original/2X/a/a947ac2d5a1ea668a7e0cdf090a3d2032c62ce64.png) ![Screen Shot 2020-09-25 at 8.16.55 AM](https://us1.discourse-cdn.com/flex016/uploads/zoomdeveloper/original/2X/6/6a8d789b1140085de49c95bdfa47ab85f0112fce.png) Not everything is working yet, (e.g. the chat window, font-sizes, etc), but here’s the repo. Has anyone got any further on this? Is an `IFrame` implementation a better solution? > **[GitHub - mixuala/zoom-websdk-sample-angular: Use the Zoom Web SDK in an Angular App](https://github.com/mixuala/zoom-websdk-sample-angular)** > > Use the Zoom Web SDK in an Angular App ```auto ## clone the repo and add your zoom credentials to try for yourself export const environment = { production: false, zoom: { signatureEndpoint: '', apiKey: '', meetingNumber: 123456789, role: 0, leaveUrl: 'http://localhost:4200', userName: 'Angular', userEmail: '', passWord: '', } }; ``` ---
**Author:** ![tommy](https://sea2.discourse-cdn.com/flex016/user_avatar/devforum.zoom.us/tommy/32/72769_2.png) [@tommy](https://devforum.zoom.us/u/tommy)\ **Post date:** [September 29, 2020, 4:16pm UTC](https://devforum.zoom.us/t/css-flexbox-markup-for-websdk-sample-angular-project/31276/2 "2020-09-29T16:16:00Z")
Hey @mlininkl, Thanks for sharing this! The community will find this helpful! 🙂 Maybe you could add a debugger stop line to catch the loading screen. Also we do not suggest using the Web SDK inside an iFrame because we did not design it to work with iFrames, so some things may not work. -Tommy ---
**Author:** ![mlininkl](https://avatars.discourse-cdn.com/v4/letter/m/35a633/32.png) [@mlininkl](https://devforum.zoom.us/u/mlininkl)\ **Post date:** [October 23, 2020, 10:42am UTC](https://devforum.zoom.us/t/css-flexbox-markup-for-websdk-sample-angular-project/31276/3 "2020-10-23T10:42:30Z")
Tommy, I’m still struggling to add zoom video to a `flexbox` that sits alongside my game page using the WebSDK. Building on `angular` instead of `react` may add to the difficulty. But even if I get it to work, it’s still not a fully functional Zoom session with GridView. Rather than trying to put Zoom inside my webpage, would I have better luck putting my webpage inside Zoom with the newly announced `ZApp` API? When will that be made available to independent developers? ---
**Author:** ![tommy](https://sea2.discourse-cdn.com/flex016/user_avatar/devforum.zoom.us/tommy/32/72769_2.png) [@tommy](https://devforum.zoom.us/u/tommy)\ **Post date:** [October 27, 2020, 4:07pm UTC](https://devforum.zoom.us/t/css-flexbox-markup-for-websdk-sample-angular-project/31276/4 "2020-10-27T16:07:00Z")
Hey @mlininkl, > [@mlininkl](#): > > I’m still struggling to add zoom video to a `flexbox` that sits alongside my game page using the WebSDK. Building on `angular` instead of `react` may add to the difficulty. But even if I get it to work, it’s still not a fully functional Zoom session with GridView. The Web SDK has limited customization, so this will be hard to do. > [@mlininkl](#): > > Rather than trying to put Zoom inside my webpage, would I have better luck putting my webpage inside Zoom with the newly announced `ZApp` API? When will that be made available to independent developers? That being said, we have released the new Customizable SDK which would be perfect for this use case, you can get started here: [https://marketplace.zoom.us/docs/sdk/custom/web](https://marketplace.zoom.us/docs/sdk/custom/web) Or, you can also look into [building a Zapp](https://devforum.zoom.us/t/zapps-publicly-availability-timeline/33350/3). 🙂 Thanks, Tommy ---
**Author:** ![mlininkl](https://avatars.discourse-cdn.com/v4/letter/m/35a633/32.png) [@mlininkl](https://devforum.zoom.us/u/mlininkl)\ **Post date:** [October 27, 2020, 4:49pm UTC](https://devforum.zoom.us/t/css-flexbox-markup-for-websdk-sample-angular-project/31276/5 "2020-10-27T16:49:21Z")
@tommy that’s great news. Can you tell me which option will have better odds of working in mobile - Web custom SDK or Zappa? Where should I invest my time? ---
**Author:** ![tommy](https://sea2.discourse-cdn.com/flex016/user_avatar/devforum.zoom.us/tommy/32/72769_2.png) [@tommy](https://devforum.zoom.us/u/tommy)\ **Post date:** [October 29, 2020, 6:59am UTC](https://devforum.zoom.us/t/css-flexbox-markup-for-websdk-sample-angular-project/31276/6 "2020-10-29T06:59:10Z")
Hey @mlininkl, Well Zapps work inside the actual Zoom App, and the custom SDK are video and audio APIs that you can use inside your own app. Does that make sense? Thanks, Tommy ---
**Author:** ![mlininkl](https://avatars.discourse-cdn.com/v4/letter/m/35a633/32.png) [@mlininkl](https://devforum.zoom.us/u/mlininkl)\ **Post date:** [October 29, 2020, 8:45am UTC](https://devforum.zoom.us/t/css-flexbox-markup-for-websdk-sample-angular-project/31276/7 "2020-10-29T08:45:48Z")
Hey @tommy, I completed the signup forms for early access to both `Zapps` and the `(Web) fully customizable SDK`. But in reviewing the **Web** customizable SDK, I notice that `Browser Support` does not include sending video/audio from IOS 13+ mobile devices. Will `Zapps` be supported on the IOS client? What can you do to get me early access? ---
**Author:** ![tommy](https://sea2.discourse-cdn.com/flex016/user_avatar/devforum.zoom.us/tommy/32/72769_2.png) [@tommy](https://devforum.zoom.us/u/tommy)\ **Post date:** [October 30, 2020, 8:26pm UTC](https://devforum.zoom.us/t/css-flexbox-markup-for-websdk-sample-angular-project/31276/8 "2020-10-30T20:26:49Z")
Hey @mlininkl, Yes, Zapps will be supported on the iOS Client. Our ISV team will be reviewing your submissions and you will hear back once you have access. 🙂 Thanks, Tommy ---
**Author:** ![system](https://us1.discourse-cdn.com/flex016/uploads/zoomdeveloper/original/3X/6/1/614bdd549b610bbaa46ff934617683a02bdaa03c.png) [@system](https://devforum.zoom.us/u/system)\ **Post date:** [November 30, 2020, 6:26am UTC](https://devforum.zoom.us/t/css-flexbox-markup-for-websdk-sample-angular-project/31276/9 "2020-11-30T06:26:51Z")
This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.