Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Issue 48 - Use high resolution assets when possible #52

Merged
merged 5 commits into from
Aug 24, 2023

Conversation

tmathern
Copy link

@tmathern tmathern commented Aug 23, 2023

Fix #48

Allows higher resolution selections by allowing more mimetypes to be picked as the rendition to use than only PNG.
When a JPEG asset is picked, it is converted into a PNG blog using a canvas.

Currently only JPEG and PNG mimetypes are supported, but the list can be extended in the future as the support for image conversion improves, and once we test and validate that it works.

@tmathern tmathern self-assigned this Aug 23, 2023
@aem-code-sync
Copy link

aem-code-sync bot commented Aug 23, 2023

Hello, I'm Franklin Bot and I will run some test suites that validate the page speed.
In case there are problems, just click the checkbox below to rerun the respective action.

  • Re-run PSI Checks

@@ -63,6 +63,13 @@ const REL_RENDITIONS = 'http://ns.adobe.com/adobecloud/rel/rendition';
// TODO: change this to Asset Link IMS client ID
const IMS_CLIENT_ID = 'p66302-franklin';
const ASSET_SELECTOR_ID = 'asset-selector';
const CLIPBOARD_SUPPORTED_BINARY_MIMETYPES = [
Copy link
Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Mimetypes supported "natively" by the clipboard API (from the browser)

const CLIPBOARD_SUPPORTED_BINARY_MIMETYPES = [
'image/png',
];
const SUPPORTED_RENDITIONS_FORMATS = [
Copy link
Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Renditions mimetypes that we can use in Franklin documents (needed for filtering).

.forEach((rendition) => {
if ((!maxRendition || maxRendition.width < rendition.width)) {
if (SUPPORTED_RENDITIONS_FORMATS.includes(rendition.type)
Copy link
Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Only look at mimetypes we can convert to use with the clipboard APIs...

@@ -325,9 +375,9 @@ export async function copyAssetWithRapi(asset) {
logMessage('Rendition download JSON not provided');
return false;
}
await copyToClipboardWithBinary(downloadJson.href, downloadJson.type);
await copyToClipboardWithBinary(downloadJson.href, downloadJson.type, asset);
Copy link
Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Asset info is needed to give the canvas the proper size

Copy link
Collaborator

@sdmcraft sdmcraft left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Thanks! Couple of minor questions:
I noticed a bit of latency in the image paste process in the recording. Is it because of the conversion?
Also does it retain the image quality as such?

Also please address linting errors and PSI failure before merging.

@tmathern
Copy link
Author

tmathern commented Aug 24, 2023

Thanks! Couple of minor questions: I noticed a bit of latency in the image paste process in the recording. Is it because of the conversion? Also does it retain the image quality as such?

Also please address linting errors and PSI failure before merging.

No, the latency seems to come from AEM things loading. I had (high) latency with copying and loading the whole day, before and after making those changes, before and after those changes. (I often hit intial loading times of 5-10 mins for the screen listing the assets).

@tmathern tmathern merged commit 380f068 into main Aug 24, 2023
1 of 2 checks passed
@tmathern tmathern deleted the load-high-res-assets branch August 24, 2023 16:07
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Allow higher resolution renditions
2 participants