Goal
Get access to https://calendar.google.com/ (Google Calendar) in a Google Web App HTML page that can be altered with HTML/CSS/JavaScript.
Questions
How do you place a google service directly into a GAS web app? Are there any indirect methods to achieve this?
Background:
I have been developing full stack Google web apps for businesses for a few years and repeatedly have clients asking to have Google Calendars or other google services integrated into these tools. When it comes to the maps service there is currently full functionality. However when it comes to calendar, there only seems to be an option to embed a limited and simplified version. It lacks the capability to be edited directly within the webpage, the style overrides any CSS attempts I have made, and the ability to even set the color of the events within a displayed calendar are unavailable. I've tried to open https://calendar.google.com/ directly into an iframe through Google Apps Script (GAS) and altering restrictions but all attempts made return an error.
Other questions I have seen on this topic only ever discuss embedding that dumbed-down calendar. That is not what I am after.
I also cannot use most third party resources due to the sensitive nature of the company data that will be in use.
Thank you for your time.
I believe there are 3 ways in achieving this:
embed an iframe, google has instructions here there are some limited customisation you can do via the google settings page.
build your own calendar page, and use google calendar API to fetch calendars and events for that calendar, integrating it into your calendar page
(as pointed out in the comment, which i was also not aware of before), GAS has some internal API which can access calendar
There isn't any easy way to embed and have full control (style or function) over google calendar aside from approach #2 as far as i am aware of. Hope this answer your question.
Edit: Add option 3 as pointed out in the comment.