Feature #24922

Support high resolution images in formatted content

Added by Jan from Planio www.plan.io 5 months ago. Updated 5 months ago.

Status:ClosedStart date:
Priority:NormalDue date:
Assignee:Jean-Philippe Lang% Done:

0%

Category:Text formatting
Target version:3.4.0
Resolution:Fixed

Description

Today, many computers have high resolution displays (e.g. Apple's retina screens) and it would be nice if images embedded into Redmine via the !image.png! syntax would make use of the higher resolution.

It has become quite common to use @2x in the filename of such hi-res images, e.g. image@2x.png would indicate that this image is meant for a hi-res display with a device pixel ratio of 2. Similarly, @3x would be used for a DPR of 3.

Modern browsers support supplying these image files in img tags via the srcset attribute and will scale the images automatically on hi-res displays.

The attached patch implements recognition of hi-res images by looking for @2x, @3x, etc. in the file name and will add a srcset attribute accordingly.

As an example, have a look at this wiki page - the embedded images are using the mechanism and look crisp and sharp on hi-res displays.

0001-Add-support-for-2x-3x-etc.-hires-images.patch Magnifier (1.51 KB) Jan from Planio www.plan.io, 2017-01-25 17:12

screenshot-24922.png (81.2 KB) Go MAEDA, 2017-01-26 01:49


Related issues

Related to Redmine - Feature #24927: Render high resolution Gravatars and Thumbnails Closed
Related to Redmine - Feature #11757: Add support for HDPI screens (retina) New

Associated revisions

Revision 16311
Added by Jean-Philippe Lang 5 months ago

Add support for @2x, @3x, etc. hires images (#24922).

Patch by Jan Schulz-Hofen.

Revision 16312
Added by Jean-Philippe Lang 5 months ago

Adds a test for #24922.

History

#1 Updated by Go MAEDA 5 months ago

Thank you for the patch.

I am always annoyed whit this @2x images issue. When I attach screenshots which was taken with Mac, I have to half the resolution of the image before upload to prevent the images are displayed at too large size.

With this patch, what I have to do is only renaming the file name to "*@2x.(jpg|png)". It would be great if the patch is merged.

#2 Updated by Go MAEDA 5 months ago

Most browsers even Microsoft Edge supports srcset attribute: http://caniuse.com/#search=srcset

#3 Updated by Jan from Planio www.plan.io 5 months ago

  • Related to Feature #24927: Render high resolution Gravatars and Thumbnails added

#4 Updated by Jan from Planio www.plan.io 5 months ago

Related: I've also provided patches for hi-res support in Gravatars and Thumbnails, see #24927.

#5 Updated by Go MAEDA 5 months ago

  • Related to Feature #11757: Add support for HDPI screens (retina) added

#6 Updated by Go MAEDA 5 months ago

  • Target version changed from Candidate for next minor release to 3.4.0

Setting target version to 3.4.0 along with #24927.

#7 Updated by Jean-Philippe Lang 5 months ago

  • Status changed from New to Closed
  • Assignee set to Jean-Philippe Lang
  • Resolution set to Fixed

Committed with a test, thanks.

Also available in: Atom PDF