Gutenberg support

[r-a-y]

Let's get this ready for Gutenberg.

[r-a-y]

A first pass is ready for testing.

Bleeding-edge version of the Google Docs Shortcode plugin is required, since Gutenberg support was added to that plugin - cuny-academic-commons/google-docs-shortcode#13. For MEXP GDrive, a "Select From Drive" button will be added underneath the "Google Drive" block that is created from the Google Docs Shortcode plugin.

I just recorded a quick GIF to show what happens:

The sidebar controls (not shown in the GIF) and the "Type or Paste URL" input field are part of the Gutenberg support for the Google Docs Shortcode plugin. I have a feeling the "Type or Paste URL" field might not be mobile or touchscreen-friendly. Would be swell if you are able to test that.

Let me know if you encounter any problems.

[mrjarbenne]

Seems to be working well, even on mobile, where I can paste a URL from Google Drive without running into issues.

The only issue I'm seeing is from Mobile iOS the only way to interact with Google Drive is through their apps (they don't render in Safari, and push to install the apps when you try) and the app doesn't offer up the option to get the ?usp=sharing URL that seems to render the item as an embed (the copy URL functionality in the app doesn't include anything after the doc id), rather than an iframed version of the editor. Ends up this behaviour existed before, but I guess I wasn't as aware of it because the option to add via URL wasn't in the traditional workflow, and we didn't use it often, which I assume will continue to be the case. If it's possible to programmatically add the "?usp=sharing" to the end of the URL in instances where it doesn't exist, I can create a new issue for that.

Note also that adding via Link rather than MEXP picker, doesn't include the height and width tags in the embed code. This doesn't seem to be affecting their ability to render, but it might have other impacts on different file formats I haven't tested yet.

[mrjarbenne]

Still playing with this. Seeing an issue with a PDF document appearing in the editor, but not in the post. The document was added using both options, first with the link, then with the MEXP picker, and neither seems to render the document in the front end.

I'm going to leave the link published here: https://sandbox.commons.hwdsb.on.ca/2018/11/test-5/

[r-a-y]

The only issue I'm seeing is from Mobile iOS the only way to interact with Google Drive is through their apps (they don't render in Safari, and push to install the apps when you try) and the app doesn't offer up the option to get the ?usp=sharing URL that seems to render the item as an embed (the copy URL functionality in the app doesn't include anything after the doc id), rather than an iframed version of the editor.

Hmm, using iOS is an interesting use-case for the Google Docs Shortcode plugin.

The Google Docs Shortcode plugin has always needed a lengthy tutorial in order to fetch the correct sharing link for embedding. Check out the readme: https://github.com/cuny-academic-commons/google-docs-shortcode#how-to-use

Are you able to test those instructions with the Classic Editor on iOS to see if the shortcode works? If the problem persists with the Classic Editor, there isn't much more I can do, unless you are able to help me amend the instructions for iOS users.

The Paste URL option in the Gutenberg block is basically an easy-to-use version of the shortcode.

For our needs or for MEXP GDrive, do you think it would make sense to remove the "Paste URL" option entirely?