Really annoying Internet Exploder/iPhone/Xalan2 interlocking bugsproblem

Discussion in 'XML' started by Simon Brooke, Sep 25, 2010.

  1. Simon Brooke

    Simon Brooke Guest

    The designers of the iPhone browser, for reasons of their own, chose not
    to honour the 'media="handheld"' attribute of style sheet links (and the
    designers of the Android browser have slavishly followed the iPhone in
    this, to my mind, poor decision). Consequently you have to use obscure
    and nasty hacks with media queries in order to get iPhone and Android to
    select the right style sheet:

    <link rel="stylesheet" href="/scenehere/styles/handheld.css"
    type="text/css">
    <xsl:attribute name="media">
    <xsl:value-of
    select="normalize-space( concat('only screen and (max-device-width:
    ', $switch-width - 1, 'px)'))" />
    </xsl:attribute>
    </link>
    <!-- tell iPhone not to shrink mobile website -->
    <meta name="viewport"
    content="width=320; initial-scale=1.0; maximum-scale=1.0;
    user-scalable=0;" />

    Unfortunately, all versions of Internet Explorer up to and including the
    latest beta of Internet Explorer 9 throw a paddy when they see the media
    query and refuse to load any style sheet at all.

    There's a workaround, documented here:
    http://www.iphonemicrosites.com/tutorials/using-media-query-to-declare-
    css-for-iphone/

    which is that you surround the bits that Internet Explorer can't parse
    with proprietary markup:

    <!--[if !IE]>-->
    <link type="text/css" rel="stylesheet" media="only screen and (max-device-
    width: 480px)" href="iPhone.css">
    <!--<![endif]-->

    I've tried three different methods of generating this markup with XSL.
    Putting it in a <![CDATA[ ]]> fails because it ends up generating
    &lt;,&gt; instead of <,>. Enclosing it in <xsl:comment></xsl:comment>
    fails because in the proprietary markup the *lack* of whitespace after
    the double hyphen is significant! Marking it all up using character
    entities in place of angle brackets works perfectly with xsltproc
    1.1.24-2; however, what I'm using on my production system is Xalan (Java)
    2.7.1-2, and it stops processing when it encounters this markup.

    I'm not actually sure whether the behaviour of xsltproc or the behaviour
    of Xalan is correct. The proprietary markup required by Internet Explorer
    is (probably deliberately) not well formed, so it isn't surprising that
    it's very difficult to generate.

    Does anyone have a solution, or suggestions of some further avenues I
    might explore?

    --

    ;; Semper in faecibus sumus, sole profundam variat
    Simon Brooke, Sep 25, 2010
    #1
    1. Advertising

  2. Simon Brooke

    Simon Brooke Guest

    Partial solution (was Re: Really annoying InternetExploder/iPhone/Xalan2 interlocking bugs problem)

    On Sat, 25 Sep 2010 08:58:55 +0000, Simon Brooke wrote:

    Following up to myself, bad form, I know.

    Brief summary of the problem: iPhone needs media queries in order to
    select the right style sheet; Internet Exploder can't parse the media
    query, and barfs; there is proprietary markup which allows Internet
    Exploder to ignore the stuff it can't parse, but that's very difficult to
    generate with XSL.

    I now have a partial solution. It's not a complete solution, so I'm still
    looking for other people's ideas. My solution is this:

    <xsl:comment>[if IE]&gt;</xsl:comment>
    <link href="/scenehere/styles/default.css" rel="stylesheet"
    type="text/css" media="screen"/>
    <xsl:comment>&lt;![endif]</xsl:comment>
    <xsl:comment>[if !IE]&gt;</xsl:comment>
    <link href="/scenehere/styles/default.css" rel="stylesheet"
    type="text/css">
    <xsl:attribute name="media">
    <xsl:value-of
    select="normalize-space( concat('screen and (min-device-width:
    ', $switch-width, 'px)'))" />
    </xsl:attribute>
    </link>
    <link rel="stylesheet" href="/scenehere/styles/handheld.css"
    type="text/css">
    <xsl:attribute name="media">
    <xsl:value-of
    select="normalize-space( concat('only screen and (max-device-
    width: ', $switch-width - 1, 'px)'))" />
    </xsl:attribute>
    </link>
    <xsl:comment>&lt;![endif]</xsl:comment>

    which generates this:

    <!--[if IE]>-->
    <link type="text/css" rel="stylesheet" media="screen"
    href="/scenehere/styles/default.css">
    <!--<![endif]-->
    <!--[if !IE]>-->
    <link type="text/css" rel="stylesheet"
    href="/scenehere/styles/default.css"
    media="screen and (min-device-width: 481px)">
    <link type="text/css" rel="stylesheet"
    href="/scenehere/styles/handheld.css"
    media="only screen and (max-device-width: 480px)">
    <!--<![endif]-->

    This renders without problem on Chrome, Epiphany, Firefox, and Opera
    browsers on Linux; on Chrome, Firefox, Opera and Safari on Windows and on
    the native Android browser and Opera Mini on Android. It's not yet tested
    on iPhone. On Internet Explorer 9 on Windows, it renders but with a stray
    '-->' appearing in the rendered display.

    Konqueror 3.5.9 on Linux selects the right style sheet using this
    solution, but fails to fully render my pages for other reasons.

    --

    ;; Semper in faecibus sumus, sole profundam variat
    Simon Brooke, Sep 25, 2010
    #2
    1. Advertising

  3. Simon Brooke

    Simon Brooke Guest

    Re: Really annoying Internet Exploder/iPhone/Xalan2 interlockingbugs problem

    On Sat, 25 Sep 2010 11:05:41 +0000, Lewis wrote:

    > Just so you know, if you don't give iPhone users a way to view the
    > regular page instead of your 'mobile optimized page' you will piss off a
    > lot of users.


    There is absolutely no way at all that the users could use the 'regular
    page'. On an iPhone screen the selection resolution required would mean
    you'd need to select with the tip of a fine stylus, a fingertip simply
    isn't going to work.

    Don't believe me? Here it is:
    http://sh.scenehere.info/scenehere/showmap
    (note: this version currently does NOT work with Internet Explorer)

    --

    ;; Semper in faecibus sumus, sole profundam variat
    Simon Brooke, Sep 25, 2010
    #3
  4. Re: Partial solution (was Re: Really annoying Internet Exploder/iPhone/Xalan2interlocking bugs problem)

    Simon Brooke wrote:

    > <!--[if IE]>-->
    > <link type="text/css" rel="stylesheet" media="screen"
    > href="/scenehere/styles/default.css">
    > <!--<![endif]-->
    > <!--[if !IE]>-->
    > <link type="text/css" rel="stylesheet"
    > href="/scenehere/styles/default.css"
    > media="screen and (min-device-width: 481px)">
    > <link type="text/css" rel="stylesheet"
    > href="/scenehere/styles/handheld.css"
    > media="only screen and (max-device-width: 480px)">
    > <!--<![endif]-->
    >
    > This renders without problem on Chrome, Epiphany, Firefox, and Opera
    > browsers on Linux; on Chrome, Firefox, Opera and Safari on Windows and on
    > the native Android browser and Opera Mini on Android. It's not yet tested
    > on iPhone. On Internet Explorer 9 on Windows, it renders but with a stray
    > '-->' appearing in the rendered display.


    I think I saw a demo recently suggesting that IE 9 supports CSS media
    queries
    (http://msdn.microsoft.com/en-us/library/ms530813(v=VS.85).aspx also
    says that although that is for CSS rules and not for the link media
    attribute) so you might want to test and change the conditional comment
    to say
    if lt IE 9


    --

    Martin Honnen
    http://msmvps.com/blogs/martin_honnen/
    Martin Honnen, Sep 25, 2010
    #4
  5. Simon Brooke

    Simon Brooke Guest

    Re: Really annoying Internet Exploder/iPhone/Xalan2 interlockingbugs problem

    On Sat, 25 Sep 2010 09:21:54 -0500, Jolly Roger wrote:

    > In article <>,
    > Simon Brooke <> wrote:
    >
    >> On Sat, 25 Sep 2010 11:05:41 +0000, Lewis wrote:
    >>
    >> > Just so you know, if you don't give iPhone users a way to view the
    >> > regular page instead of your 'mobile optimized page' you will piss
    >> > off a lot of users.

    >>
    >> There is absolutely no way at all that the users could use the 'regular
    >> page'. On an iPhone screen the selection resolution required would mean
    >> you'd need to select with the tip of a fine stylus, a fingertip simply
    >> isn't going to work.
    >>
    >> Don't believe me? Here it is:
    >> http://sh.scenehere.info/scenehere/showmap (note: this version
    >> currently does NOT work with Internet Explorer)

    >
    > It works fine on my iPhone 4. I can zoom in an out of the map easily,
    > and enter criteria in the filter as well - all without having to
    > pinch/zoom.
    >
    > It's slow as hell to load, but that's the case even on a dual quad-core
    > Xeon Mac Pro desktop computer - LOL!
    >
    > Maybe you should actually try an iPhone out sometime before making such
    > assumptions. ; )


    And can you accurately select one flag from among a group of flags? If
    you can't, the whole app doesn't work.

    Yes, I know it's slow. It's running on an old pentium box in my study at
    home, so you're browsing it over the wrong end of an ADSL line.

    What I am impressed by this afternoon is how well Opera Mini supports
    such a complicated user interface. You (obviously) can't scroll the map,
    which is a big limitation, but everything else works.

    --

    ;; Semper in faecibus sumus, sole profundam variat
    Simon Brooke, Sep 25, 2010
    #5
  6. Simon Brooke

    nospam Guest

    Re: Really annoying Internet Exploder/iPhone/Xalan2 interlocking bugs problem

    In article <>, Simon Brooke
    <> wrote:

    > And can you accurately select one flag from among a group of flags? If
    > you can't, the whole app doesn't work.


    yes, just zoom in and tap. very simple.
    nospam, Sep 25, 2010
    #6
  7. Re: Really annoying Internet Exploder/iPhone/Xalan2 interlocking bugs problem

    In article <>,
    Simon Brooke <> wrote:

    > > Maybe you should actually try an iPhone out sometime before making
    > > such assumptions. ; )

    >
    > And can you accurately select one flag from among a group of flags? If
    > you can't, the whole app doesn't work.


    Yes,you can accurately select one flag. And it scrolls just fine.

    --
    Check out the Hot Cocoa Party
    <http://www.hotcocoaparty.info>
    Michelle Steiner, Sep 26, 2010
    #7
    1. Advertising

Want to reply to this thread or ask your own question?

It takes just 2 minutes to sign up (and it's free!). Just click the sign up button to choose a username and then you can ask your own questions on the forum.
Similar Threads
  1. Replies:
    1
    Views:
    1,707
    Martin Honnen
    Oct 5, 2005
  2. Stainless

    interlocking class definitions?

    Stainless, Mar 7, 2006, in forum: C++
    Replies:
    3
    Views:
    383
    Stainless
    Mar 7, 2006
  3. Sergio Harem
    Replies:
    0
    Views:
    237
    Sergio Harem
    Jan 17, 2008
  4. Replies:
    1
    Views:
    401
    Randy Webb
    Nov 19, 2006
  5. Replies:
    0
    Views:
    569
Loading...

Share This Page