Bug 12220

Summary: bootstrap not responsive on all devices
Product: Koha Reporter: Nicole C. Engard <nengard>
Component: OPACAssignee: Owen Leonard <oleonard>
Status: CLOSED FIXED QA Contact: Testopia <testopia>
Severity: normal    
Priority: P5 - low CC: asakovich, gmcharlt, tomascohen, viktor.sarge
Version: Main   
Hardware: All   
OS: All   
Change sponsored?: --- Patch complexity: Trivial patch
Documentation contact: Documentation submission:
Text to go in the release notes:
Version(s) released in:
Circulation function:
Attachments: Bug 12220 - bootstrap not responsive on all devices
Bug 12220 - bootstrap not responsive on all devices
Bug 12220 - bootstrap not responsive on all devices

Description Nicole C. Engard 2014-05-08 20:59:03 UTC
I'm reporting this for a library since I'm not sure if this is the issue or if there is another problem:
----------------

There's a header meta-tag being shoved to browsers that I think is preventing some mobile devices from properly resizing their screens. From any OPAC session on catalog.hmcpl.org, you'll find the following in the <head>:

<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">

I believe the "maximum-scale=1" is the cause of this.

This is problematic for us as we are just starting to roll out a new OPAC design, using wall-mounted iPads. The 10" screen is not a problem if a patron can easily zoom in on the info they need -- the setting above prevents that.
Comment 1 Nicole C. Engard 2014-06-06 15:15:35 UTC
Anyone have any ideas on this?
Comment 2 Viktor Sarge 2014-06-17 06:56:47 UTC
(In reply to Nicole C. Engard from comment #1)
> Anyone have any ideas on this?

My understanding is that they have indeed found the problem and that the maximum-scale attribute is often used to prevent content from being blown up and get blurry images on for example iPad. It would be easy to remove I guess, but since it will have all manners of effects on different platform I think there should be more discussion on the issue.
Comment 3 Aaron Sakovich 2014-06-25 16:28:25 UTC
FYI, I wrote the original comment Nicole quoted above in a query to her.

Viktor, in retrospect, I don't think the problem is so much iPads, as it is phones. If the responsive design has flipped into phone mode, then I know some designers want to prevent zooming. Unfortunately, this meta-tag doesn't discriminate between a narrow-screened phone-mode and a wide-screened iPad-mode.

Perhaps a 'maximum-scale=2' or '...=4' would be more appropriate than saying "Nein! Ist verboten!!"? Or is there another way to programmatically determine if the responsive display is in a narrow-screen phone-mode and then enforce the restriction, leaving the larger-screen iPads unimpeded?

(I've always been averse to having a server tell users what they can't do on their device's UI, so we were dismayed when we discovered we couldn't pinch-to-zoom on iPads. Personally, I'd remove it completely if it were left to me -- which I know it's not. Fortunately.)

Open to suggestions!
Comment 4 Owen Leonard 2014-06-25 17:13:45 UTC Comment hidden (obsolete)
Comment 5 Chris Cormack 2014-06-26 03:55:39 UTC Comment hidden (obsolete)
Comment 6 Jonathan Druart 2014-06-26 14:04:19 UTC
Created attachment 29285 [details] [review]
Bug 12220 - bootstrap not responsive on all devices

The bootstrap theme includes a meta tag attribute which disables zooming
on some devices. This was unintentional and not desirable. This patch
removes the problematic attribute.

See:
http://blog.javierusobiaga.com/stop-using-the-viewport-tag-until-you-know-ho

To test: Apply the patch and view the OPAC on a device with a touch
interface. Attempt to zoom in on any OPAC page. Zooming should work.

Signed-off-by: Chris Cormack <chrisc@catalyst.net.nz>

Signed-off-by: Jonathan Druart <jonathan.druart@biblibre.com>
Reproduced using a smartphone.
Comment 7 Tomás Cohen Arazi (tcohen) 2014-07-03 13:40:40 UTC
Patch pushed to master.

Thanks Owen!
Comment 8 Nicole C. Engard 2014-07-15 15:09:05 UTC
This would be great in 3.14 and 3.16 as well if it won't break things.
Comment 9 Galen Charlton 2014-07-23 21:34:29 UTC
Pushed to 3.16.x for inclusion in 3.16.2.