30:T444,md` ## API Reference ### gDriveFile \`docs\`, \`sheets\`, \`slides\`, and \`pdf\` are provided as convenience functions: parameters are forwared to \`gDriveFile\` with appropriate \`type\` set. |Param|Description|default|Values| |-|-|-|-| |id|Google id for the file (see above)|none|\`1hr6CyVAciS2mRQSphyDe4EW6nmkrVE_Rjn6_XzAwsY8\` |w|Width of the iframe|\`width\`|integer |h|Height of the iframe|500|integer |domain|Domain the file appears in|none|'ucsd.edu', 'salesforce.com', etc. |type|Type of document, for special type of rendering|none|'sheets', 'docs','slides','pdf'
### gDriveFolder \`folder\` is given as a conveniece function - same as calling gDriveFolder directly, but easier to type and remember. |Param|Description|default|Values| |-|-|-|-| |id|Google id for the file (see above)|none|\`1hr6CyVAciS2mRQSphyDe4EW6nmkrVE_Rjn6_XzAwsY8\` |w|Width of the iframe|\`width\`|integer |h|Height of the iframe|500|integer |domain|Domain the file appears in|none|'ucsd.edu', 'salesforce.com', etc. |type|How to view contents of the folder|\`'list'\`|\`list\` or \`grid\`, `31:[] 2e:{"title":"Google Drive Embed in Observable","cells":[{"id":0,"value":"md`# Google Drive Embed in Observable`","pinned":false,"hidden":false,"mode":"ojs"},{"id":3,"value":"md`Viewers for Google Drive files and folders on Observables`","pinned":false,"hidden":false,"mode":"ojs"},{"id":237,"value":"md`\n![Thumnail containing google drive logos](https://gist.githubusercontent.com/asg017/39c218cfb5dcbcd3e1bee8a9cf7cadef/raw/50f908a5bb6a2f29bb5dbdcc9327ccf4121dc381/google-drive-thumbnail.png)\n`","pinned":false,"hidden":false,"mode":"ojs"},{"id":48,"value":"md`\n## Usage\nAll found examples found in [this drive folder](https://drive.google.com/drive/u/0/folders/1YZGlgoUjJFJk-1NmWdsqU6vecYmqFk7p)\n\\`\\`\\` javascript\nimport {docs,sheets,slides,pdf,folder} from '@asg017/google-drive'\n\\`\\`\\`\nEven better, add it to your [toolbox!](https://beta.observablehq.com/@asg017/toolbox)\n`","pinned":false,"hidden":false,"mode":"ojs"},{"id":60,"value":"examples = html`\n

Examples

\n
\n

\n\n

Slides

\n ${slides({id:'1z2uxddCl6dc7f4uEYw4APO_0kL93lxoC2RaABU0tM0U',w:width/2,h:300})}\n

\n\n

Sheets

\n ${sheets({id:'1u9RVx_rclqazlqFmxnKZPEWhoUuA4gItfBFjomE4uaM', w:width/2,h:300})}\n

\n\n

Docs

\n ${docs({id:'1KYGjtZOLgP_rPQxGysjrhBwuQock7qT1fXIVsbdjWI4', w:width/2,h:300})}\n

\n\n

PDF

\n ${pdf({id:'10-26OdEGsPlqcAgzX-21yPchtv8uvC-v', w:width/2,h:300})}\n

\n\n

Folder (List)

\n ${folder({id:'1YZGlgoUjJFJk-1NmWdsqU6vecYmqFk7p', type:'list', w:width/2, h:350})}\n

Folder (Grid)

\n ${folder({id:'1YZGlgoUjJFJk-1NmWdsqU6vecYmqFk7p', type:'grid', w:width/2, h:350})}\n

`","pinned":false,"hidden":false,"mode":"ojs"},{"id":67,"value":"md`\n## Why?\n\nSometimes, you need to share a quick file in an Observable notebook - maybe it's a simple PDF of homework solutions or \na live spreadsheet of game results. A link doesn't show anything and API's are a pain. These simple functions will get you going in no time!\n\n### Advantages\n- Privacy and security is handled by google drive sharing settings \n- Easier hosting and managing files\n\n### Disadvantages\n- Forms, Drawings not supported.\n- iFrame API may change in the future\n- getting id's and info can be a struggle \n`","pinned":false,"hidden":false,"mode":"ojs"},{"id":124,"value":"$30","pinned":false,"hidden":false,"mode":"ojs"},{"id":52,"value":"md`## Roadmap\n\n

Ideas

\n${md`\n- Forms and Drawing need support\n- Add more params for sheets and slides\n- Given full link, extract id\n`}\n

In Progress

\n${md`\n- Documentation\n- More domain examples\n- Google sheets iframe api has params that aren't exposed here\n- file's \\`type\\` does nothing\n`}\n

Bugs

\n${md`\n- None found (yet)\n`}\n

\n`","pinned":false,"hidden":false,"mode":"ojs"},{"id":112,"value":"md`## Definition`","pinned":false,"hidden":false,"mode":"ojs"},{"id":56,"value":"/*\n id - id of the google drive file - get from the link of the file, e.g. \"1YZGlgoUjJFJk-1NmWdsqU6vecYmqFk7p\"\n w - width of the ifram - default width value in observable\n h - height of the iframe - default 500\n domain - domain that the folder exists in (e.g. \"ucsd.edu\") \n type - not used as of now\n*/\ngDriveFile = (params) => {\n if (typeof(params)==='string') {\n params = {id:params}\n }\n let {id='', w=width, h=500, domain='', type='list'} = params;\n\n return html`\n\n` \n}","pinned":true,"hidden":false,"mode":"ojs"},{"id":6,"value":"/*\n id - id of the google drive folder - get from the link of the folder, e.g. \"1YZGlgoUjJFJk-1NmWdsqU6vecYmqFk7p\"\n w - width of the ifram - default width value in observable\n h - height of the iframe - default 500\n domain - domain that the folder exists in (e.g. \"ucsd.edu\") \n type - 'list' or 'grid', default 'grid'\n*/\n\ngDriveFolder = (params={}) => {\n if (typeof(params)==='string') {\n params = {id:params}\n }\n let {id='', w=width, h=500, domain='', type='list'} = params;\n return html`\n\n `\n}","pinned":true,"hidden":false,"mode":"ojs"},{"id":148,"value":"// Wrapper/convenience, delegates to gDriveFile\nsheets = (params) => {\n if (typeof(params)==='string') {\n params = {id:params}\n }\n return gDriveFile({...params, type:'sheets'})\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":163,"value":"// Wrapper/convenience, delegates to gDriveFile\nslides = (params) => {\n if (typeof(params)==='string') {\n params = {id:params}\n }\n return gDriveFile({...params, type:'slides'})\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":164,"value":"// Wrapper/convenience, delegates to gDriveFile\ndocs = (params) => {\n if (typeof(params)==='string') {\n params = {id:params}\n }\n return gDriveFile({...params, type:'docs'})\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":173,"value":"// Wrapper/convenience, delegates to gDriveFile\npdf = (params) => {\n if (typeof(params)==='string') {\n params = {id:params}\n }\n return gDriveFile({...params, type:'pdf'})\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":176,"value":"folder = (params) => gDriveFolder(params)","pinned":false,"hidden":false,"mode":"ojs"},{"id":251,"value":"md`## Appendix`","pinned":false,"hidden":false,"mode":"ojs"},{"id":205,"value":"html2canvas = require('https://bundle.run/html2canvas@1.0.0-alpha.12')","pinned":false,"hidden":false,"mode":"ojs"},{"id":246,"value":"import {signOff} from '@asg017/toolbox'","pinned":false,"hidden":false,"mode":"ojs"},{"id":249,"value":"signOff()","pinned":false,"hidden":false,"mode":"ojs"}],"files":"$W31","stdlib":"1","titling":"auto"}