عرض الصور بالحجم الكامل

We’re running a graphics community, and members often post (very) high res images. Currently, when you click on an image it will enlarge it, loading the original image but scaled to the viewport. Clicking the enlarged image will take you to the next image in the post, and users have to “right click → view image in new tab” to see it at full, original size (or download the image).

Is there a way to either change this behavior so that clicking an enlarged image will open it at full-size? Alternatively (and perhaps nicer), is it feasible to create a theme component that adds a “view full size” option below the enlarged image?

Thanks!

I never understood the difference between this and the download link, aren’t they the same thing? We have an existing discussion on this here on meta already..

You may not want to actually have the file in your downloads folder just to take a quick look at something. Also, it requires at least one additional click to download and then view. ArtStation has an elegant solution for this (example link), and I use it all the time:

I think in most browsers the download icon just opens the raw image URL in a new browser tab and it’s not saved anywhere (outside of your cache) unless you right click… so I guess the labeling might be a bit misleading?

Hmm maybe I’m missing something, but for me, it always actually downloads the file. Is it a configuration thing? Opening image files in a new tab would be :ok_hand:

oh hmm maybe it’s OS level then? Safari/Chrome/Firefox on MacOS open the image URL in the browser whenever I click download

Wow, it does here, but not on my site (example link). I checked in safe mode and it still downloads there, suggesting some site setting. I’ll dig in, if you have any ideas I’d love to hear.

And yes, is opening the file in a new tab is the expected behavior then ‘download’ might not be an accurate label.

Ah I see, so your site isn’t directly linking the image with the extension, the URL is https://blenderartists.org/uploads/default/0dea5b078999bf99ae583dfc353e31dde79bf764

It has the same behavior in safe mode with all themes/plugins disabled… so it must be a difference in the image handling configuration

The difference is in expected behavior. At least to me, “Download” implies saving an asset and is something I reserve for some kind of later usage or project, whereas something like “View Full” implies a quick means to do just that.

They’re different enough that equating them can apparently cause confusion.

It would be ideal to offer both behaviors for a given image, like the ArtStation example. There’s no ambiguity there.

Hmm, I did some digging (warning: I’m a Ruby noob) and from what I see the download URL is taken from the data-download-href on the image. It seems to be defined here:

But this attribute only contains the ‘upload.sha1’, and no file extension. The image a href’s in this topic don’t contain the data-download-href attribute, I wonder if this is because the image I just shared above is too small to be resized and didn’t trigger a rebake. I’ll upload a larger one below for testing (CC0 licensed):

Maybe it’s because BlenderArtists doesn’t use a CDN (!?) so they get the content-disposition from our service that tell the browser to download it, and the Meta CDN is stripping it? :thinking:

We use Cloudflare for images only. I just checked on another Discourse server (one that I know does not use a CDN), and see the same download behavior there - example link.

هل يجب علينا نقل هذه المنشور إلى #bug؟

يمكنني التأكيد على أن هذا يحدث بالفعل بدون شبكة توصيل محتوى (CDN).

بصراحة، أنصحك باستخدام شبكة توصيل محتوى (CDN)، فهي توفر دفعة كبيرة في الأداء لمستخدميك وتقلل أيضًا من العبء على خادمك.

أدرك المزايا - خاصةً إذا استخدمت خدمة ذات نقاط نهاية قريبة من مستخدميك. حتى الآن، يعمل التخزين المؤقت من Cloudflare بشكل جيد بما يكفي بالنسبة لنا (فهو سريع إلى حد ما ويخفف العبء عن خادمنا في تقديم الصور)، وما زلنا نعمل بميزانية محدودة جدًا.

يجب أن يكون لدينا تكافؤ هنا.

لا ينبغي أن يتصرف زر “تحميل” للصورة بشكل مختلف إذا كان CDN مفعّلاً وبشكل آخر إذا كان معطلاً. @pmusaraj لقد قضيت وقتًا طويلاً في هذا المجال، هل هناك سبب لعدم وجود شيء خاص لتحديد محتوى المحتوى هنا (حيث لدينا CDN S3 مُعرّف) بينما يتم تحديد محتوى المحتوى في التثبيتات المحلية؟

@codinghorror أعتقد أن الكلمة التي نستخدمها هنا والأيقونة غير صحيحة نوعًا ما. اجعلها تقول فقط :link: original ولا تستخدم أيًا من تلك الأشياء المتعلقة بـ “التصرف” للتحميل. ببساطة، عند النقر عليها، تأخذك مباشرة إلى عنوان URL الذي توجد فيه الصورة دون أي شروط. هذا أيضًا يبسط تنفيذ CDN كميزة إضافية.

حسناً، لا، إن التوجيه الصحيح والتحميل عند النقر هو جزء مما يجعل هذه الميزة مميزة.

حسنًا، إذن نحتاج إلى تمرير الترتيب إلى AWS CDN هنا @pmusaraj، وأظن أن التطبيق سيحتاج إلى تقديم التحميل. (أيضًا تأكد من أنه يعمل مع CDN العادي)

بشأن المنشور الأصلي، أظن أنه إذا كنت تريد رابطًا :link: بالحجم الكامل في نافذة العرض الخفيفة الخاصة بك @bartv، فستحتاج إلى مكون من السمات.

لا أرى مشكلة حقيقية هنا في وجود سلوكيات مختلفة. يمكن أن يحصل CDN على سلوك التنزيل المتقدم، بينما يحصل النظام بدون CDN على السلوك الأبسط.