{"thread":{"id":"35820","subject":"[PATCH] gitweb: Avoid overflowing page body frame with large images","startedAt":"2014-02-07T03:31:20Z","lastAt":"2014-02-19T19:32:55Z","messageCount":7,"participants":["Andrew Keller","Vincent van Ravesteijn","Tony Finch","Junio C Hamano"],"isPatch":true,"patchVersion":1,"patchTotal":null},"messages":[{"id":"234432","messageId":"2452A253-A926-4A40-9F08-6E28EFF229F3@kellerfarm.com","threadId":"35820","inReplyTo":null,"subject":"[PATCH] gitweb: Avoid overflowing page body frame with large images","fromName":"Andrew Keller","fromEmail":"andrew@kellerfarm.com","sentAt":"2014-02-07T03:31:20Z","receivedAt":"2014-02-07T03:31:20Z","isPatch":true,"sender":{"key":"andrew@kellerfarm.com","avatar":"https://avatars.githubusercontent.com/u/304204?v=4"},"body":"When displaying a blob in gitweb, if it's an image, specify constraints for\nmaximum display width and height to prevent the image from overflowing the\nframe of the enclosing page_body div.\n\nThis change assumes that it is more desirable to see the whole image without\nscrolling (new behavior) than it is to see every pixel without zooming\n(previous behavior).\n\nSigned-off-by: Andrew B Keller \n---\n\nI recently used Git to archive a set of scanned photos, and I used gitweb to provide access to them. Overall, everything worked well, but I found it undesirable that I had to zoom out in my browser on every photo to see the whole photo. In the spirit of making the default behavior the most likely correct behavior, this patch seems to be a good idea.\n\nHowever, I'm not an expert on the use cases of gitweb. In order for the maximum size constraints to take effect, the image would have to be at least the size of the web browser window (minus a handful of pixels), so the affected images are usually going to be pretty big. Are there any common use cases for displaying a large image without scaling (and hence, with scrolling)?\n\nThanks,\nAndrew\n\n\n gitweb/gitweb.perl | 2 +-\n gitweb/static/gitweb.css | 5 +++++\n 2 files changed, 6 insertions(+), 1 deletions(-)\n\ndiff --git a/gitweb/gitweb.perl b/gitweb/gitweb.perl\nindex 3bc0f0b..2c6a77f 100755\n--- a/gitweb/gitweb.perl\n+++ b/gitweb/gitweb.perl\n@@ -7094,7 +7094,7 @@ sub git_blob {\n \tgit_print_page_path($file_name, \"blob\", $hash_base);\n \tprint \"
\\n\";\n \tif ($mimetype =~ m!^image/!) {\n-\t\tprint qq!\"!.esc_attr($file_name).qq!\" When displaying a blob in gitweb, if it's an image, specify constraints for\n> maximum display width and height to prevent the image from overflowing the\n> frame of the enclosing page_body div.\n> \n> This change assumes that it is more desirable to see the whole image without\n> scrolling (new behavior) than it is to see every pixel without zooming\n> (previous behavior).\n> \n> Signed-off-by: Andrew B Keller \n> ---\n> \n> I recently used Git to archive a set of scanned photos, and I used gitweb to provide access to them. Overall, everything worked well, but I found it undesirable that I had to zoom out in my browser on every photo to see the whole photo. In the spirit of making the default behavior the most likely correct behavior, this patch seems to be a good idea.\n> \n> However, I'm not an expert on the use cases of gitweb. In order for the maximum size constraints to take effect, the image would have to be at least the size of the web browser window (minus a handful of pixels), so the affected images are usually going to be pretty big. Are there any common use cases for displaying a large image without scaling (and hence, with scrolling)?\n> \n> Thanks,\n> Andrew\n> \n> \n> gitweb/gitweb.perl | 2 +-\n> gitweb/static/gitweb.css | 5 +++++\n> 2 files changed, 6 insertions(+), 1 deletions(-)\n> \n> diff --git a/gitweb/gitweb.perl b/gitweb/gitweb.perl\n> index 3bc0f0b..2c6a77f 100755\n> --- a/gitweb/gitweb.perl\n> +++ b/gitweb/gitweb.perl\n> @@ -7094,7 +7094,7 @@ sub git_blob {\n> \tgit_print_page_path($file_name, \"blob\", $hash_base);\n> \tprint \"
\\n\";\n> \tif ($mimetype =~ m!^image/!) {\n> -\t\tprint qq! +\t\tprint qq! \t\tif ($file_name) {\n> \t\t\tprint qq! alt=\"!.esc_attr($file_name).qq!\" title=\"!.esc_attr($file_name).qq!\"!;\n> \t\t}\n> diff --git a/gitweb/static/gitweb.css b/gitweb/static/gitweb.css\n> index 3b4d833..cd57c2f 100644\n> --- a/gitweb/static/gitweb.css\n> +++ b/gitweb/static/gitweb.css\n> @@ -32,6 +32,11 @@ img.avatar {\n> \tvertical-align: middle;\n> }\n> \n> +img.image_blob {\n\nI wonder if simply \"blob\" is a better style name here. \"image_blob\" stands out a bit amongst the existing code, and \"blob\" appears to be specific enough for the needs.\n\n> +\tmax-height: 100%;\n> +\tmax-width: 100%;\n> +}\n> +\n> a.list img.avatar {\n> \tborder-style: none;\n> }\n> -- \n> 1.7.7.1\n\n - Andrew\n"},{"id":"234440","messageId":"CAAH6HY92SGAjMMcrw_HwA_Uh_3=AWFFF9K9WAnNAPcyUpDkbwQ@mail.gmail.com","threadId":"35820","inReplyTo":"2452A253-A926-4A40-9F08-6E28EFF229F3@kellerfarm.com","subject":"Re: [PATCH] gitweb: Avoid overflowing page body frame with large images","fromName":"Vincent van Ravesteijn","fromEmail":"vfr@lyx.org","sentAt":"2014-02-07T12:35:52Z","receivedAt":"2014-02-07T12:35:52Z","isPatch":true,"sender":{"key":"vfr@lyx.org","avatar":"https://avatars.githubusercontent.com/u/687868?v=4"},"body":"On Fri, Feb 7, 2014 at 4:31 AM, Andrew Keller wrote:\n> I recently used Git to archive a set of scanned photos, and I used gitweb to provide access to them. Overall, everything worked well, but I found it undesirable that I had to zoom out in my browser on every photo to see the whole photo. In the spirit of making the default behavior the most likely correct behavior, this patch seems to be a good idea.\n>\n> However, I'm not an expert on the use cases of gitweb. In order for the maximum size constraints to take effect, the image would have to be at least the size of the web browser window (minus a handful of pixels), so the affected images are usually going to be pretty big. Are there any common use cases for displaying a large image without scaling (and hence, with scrolling)?\n>\n> Thanks,\n> Andrew\n>\n\nIt sounds like your usecase is exactly what camlistore.org tries to achieve.\n\nVincent\n"},{"id":"234443","messageId":"85BCA9A4-5EC3-4488-A4E4-4F86739B6450@kellerfarm.com","threadId":"35820","inReplyTo":"CAAH6HY92SGAjMMcrw_HwA_Uh_3=AWFFF9K9WAnNAPcyUpDkbwQ@mail.gmail.com","subject":"Re: [PATCH] gitweb: Avoid overflowing page body frame with large images","fromName":"Andrew Keller","fromEmail":"andrew@kellerfarm.com","sentAt":"2014-02-07T14:32:55Z","receivedAt":"2014-02-07T14:32:55Z","isPatch":true,"sender":{"key":"andrew@kellerfarm.com","avatar":"https://avatars.githubusercontent.com/u/304204?v=4"},"body":"On Feb 7, 2014, at 7:35 AM, Vincent van Ravesteijn wrote:\n\n> On Fri, Feb 7, 2014 at 4:31 AM, Andrew Keller wrote:\n>> I recently used Git to archive a set of scanned photos, and I used gitweb to provide access to them. Overall, everything worked well, but I found it undesirable that I had to zoom out in my browser on every photo to see the whole photo. In the spirit of making the default behavior the most likely correct behavior, this patch seems to be a good idea.\n>> \n>> However, I'm not an expert on the use cases of gitweb. In order for the maximum size constraints to take effect, the image would have to be at least the size of the web browser window (minus a handful of pixels), so the affected images are usually going to be pretty big. Are there any common use cases for displaying a large image without scaling (and hence, with scrolling)?\n>> \n>> Thanks,\n>> Andrew\n>> \n> \n> It sounds like your usecase is exactly what camlistore.org tries to achieve.\n\nYes.\n\nWith that said, I don't think it's unreasonable for a software project to contain images larger than a browser window. And, when that happens, I'm pretty confident that the default behavior should be to scale the image down so the user can see the whole thing.\n\n - Andrew\n"},{"id":"234444","messageId":"alpine.LSU.2.00.1402071458040.15645@hermes-1.csi.cam.ac.uk","threadId":"35820","inReplyTo":"85BCA9A4-5EC3-4488-A4E4-4F86739B6450@kellerfarm.com","subject":"Re: [PATCH] gitweb: Avoid overflowing page body frame with large images","fromName":"Tony Finch","fromEmail":"dot@dotat.at","sentAt":"2014-02-07T15:02:04Z","receivedAt":"2014-02-07T15:02:04Z","isPatch":true,"sender":{"key":"dot@dotat.at","avatar":"https://avatars.githubusercontent.com/u/68429?v=4"},"body":"Andrew Keller wrote:\n>\n> With that said, I don't think it's unreasonable for a software project\n> to contain images larger than a browser window. And, when that happens,\n> I'm pretty confident that the default behavior should be to scale the\n> image down so the user can see the whole thing.\n\nRight. And if you want to see the unscaled version of the image you can\nview the blob_plain version instead of the (scaled html-wrapped) blob.\n\nSeems sensible in principle to me but I have not reviewed the code.\n\nTony.\n-- \nf.anthony.n.finch http://dotat.at/\nForties, Cromarty: East, veering southeast, 4 or 5, occasionally 6 at first.\nRough, becoming slight or moderate. Showers, rain at first. Moderate or good,\noccasionally poor at first.\n"},{"id":"234925","messageId":"C66B1A3C-7148-4514-B385-537E0BB6E187@kellerfarm.com","threadId":"35820","inReplyTo":"A4E05D52-1CED-46FC-B137-BCDFAD638E1D@kellerfarm.com","subject":"[PATCH] gitweb: Avoid overflowing page body frame with large images","fromName":"Andrew Keller","fromEmail":"andrew@kellerfarm.com","sentAt":"2014-02-17T14:25:13Z","receivedAt":"2014-02-17T14:25:13Z","isPatch":true,"sender":{"key":"andrew@kellerfarm.com","avatar":"https://avatars.githubusercontent.com/u/304204?v=4"},"body":"When displaying a blob in gitweb, if it's an image, specify constraints for\nmaximum display width and height to prevent the image from overflowing the\nframe of the enclosing page_body div.\n\nThis change assumes that it is more desirable to see the whole image without\nscrolling (new behavior) than it is to see every pixel without zooming\n(previous behavior).\n\nSigned-off-by: Andrew Keller \n---\n\nThis is an updated copy of this patch.\n\nCould I request a thumbs up, thumbs down, or thumbs sideways from those who develop gitweb?\n\nThanks,\nAndrew Keller\n\n gitweb/gitweb.perl | 2 +-\n gitweb/static/gitweb.css | 5 +++++\n 2 files changed, 6 insertions(+), 1 deletion(-)\n\ndiff --git a/gitweb/gitweb.perl b/gitweb/gitweb.perl\nindex 3bc0f0b..79057b7 100755\n--- a/gitweb/gitweb.perl\n+++ b/gitweb/gitweb.perl\n@@ -7094,7 +7094,7 @@ sub git_blob {\n \tgit_print_page_path($file_name, \"blob\", $hash_base);\n \tprint \"
\\n\";\n \tif ($mimetype =~ m!^image/!) {\n-\t\tprint qq!\"!.esc_attr($file_name).qq!\" writes:\n\n> When displaying a blob in gitweb, if it's an image, specify constraints for\n> maximum display width and height to prevent the image from overflowing the\n> frame of the enclosing page_body div.\n>\n> This change assumes that it is more desirable to see the whole image without\n> scrolling (new behavior) than it is to see every pixel without zooming\n> (previous behavior).\n>\n> Signed-off-by: Andrew Keller \n> ---\n>\n> This is an updated copy of this patch.\n>\n> Could I request a thumbs up, thumbs down, or thumbs sideways from those who develop gitweb?\n\nI do not develop gitweb, but the change looks reasonable to me.\n\n> gitweb/gitweb.perl | 2 +-\n> gitweb/static/gitweb.css | 5 +++++\n> 2 files changed, 6 insertions(+), 1 deletion(-)\n>\n> diff --git a/gitweb/gitweb.perl b/gitweb/gitweb.perl\n> index 3bc0f0b..79057b7 100755\n> --- a/gitweb/gitweb.perl\n> +++ b/gitweb/gitweb.perl\n> @@ -7094,7 +7094,7 @@ sub git_blob {\n> \tgit_print_page_path($file_name, \"blob\", $hash_base);\n> \tprint \"
\\n\";\n> \tif ($mimetype =~ m!^image/!) {\n> -\t\tprint qq! +\t\tprint qq! \t\tif ($file_name) {\n> \t\t\tprint qq! alt=\"!.esc_attr($file_name).qq!\" title=\"!.esc_attr($file_name).qq!\"!;\n> \t\t}\n> diff --git a/gitweb/static/gitweb.css b/gitweb/static/gitweb.css\n> index 3b4d833..3212601 100644\n> --- a/gitweb/static/gitweb.css\n> +++ b/gitweb/static/gitweb.css\n> @@ -32,6 +32,11 @@ img.avatar {\n> \tvertical-align: middle;\n> }\n> \n> +img.blob {\n> +\tmax-height: 100%;\n> +\tmax-width: 100%;\n> +}\n> +\n> a.list img.avatar {\n> \tborder-style: none;\n> }\n"}]}