Loading ...
Sorry, an error occurred while loading the content.
 

YUI TreeView workaround for Safari

Expand Messages
  • kehlpeter
    Hi YUI community, recent update of Safari 3.1.1 on Mac OS X 10.5 Leopard broke it, so when you use YUI TreeView and you click a node to collapse it or expand
    Message 1 of 2 , Apr 30, 2008
      Hi YUI community,

      recent update of Safari 3.1.1 on Mac OS X 10.5 Leopard broke it, so
      when you use YUI TreeView and you click a node to collapse it or
      expand it, it doesn't redraw. If you want to see it collapsed or
      expanded, you have to scroll the page down and up...

      That's obviously Safari's fault. Until Apple fixes it, I created below
      workaround. It only activates for Safari. Tested on both Mac OS 10.4
      and 10.5.

      Hope it saves hassle for some of you :)

      /** Add this to the top of treeview.js and treeview-min.js
      Following detects whether we're using Safari 3.1.*. Safari 3.1.1
      on OS X 10.5.2 behaves
      differently than other browsers, and it doesn't redraw trees when you
      click at
      TreeView toggle link.
      */
      use_hack_for_safari= window.navigator.userAgent.indexOf( 'Safari' ) >-1
      && window.navigator.appVersion.indexOf( '/3.1' ) >-1;

      function redraw_elem_by_id( element_id ) {
      //Thanks God for Google and
      http://www.webmasterworld.com/forum91/453.htm and

      //http://www.quirksmode.org/bugreports/archives/2007/01/Changing_col_style_properties_via_javascript_cause.html
      // Somehow $(element_id) doesn't work on Safari in this context
      element= document.getElementById( element_id );
      //element.style.display = 'none';
      //element.style.display = 'block';
      element.innerHTML = element.innerHTML + " ";
      }

      /** Then down in the same file, replace existing getToggleLink
      function by:
      */
      getToggleLink: function() {
      return "YAHOO.widget.TreeView.getNode(\'" + this.tree.id +
      "\'," +
      this.index + ").toggle()" +
      /** Following is a hack for Safari to make it refresh the tree.
      */
      ( use_hack_for_safari
      ? ";redraw_elem_by_id('" +this.tree.id+ "')"
      : ''
      );
      /* Instead of generating a call to redraw_elem_by_id() here,
      I've tried to run the following in toggle function, along with
      defining redraw() function (not here), but that
      somehow didn't work.
      if( use_hack_for_safari ) {
      redraw( this.tree );
      */
      }
    • Adam Moore
      I ve tested the same configuration against the current release, and I can t reproduce the issue. Please file a bug with details about how to reproduce it.
      Message 2 of 2 , Apr 30, 2008
        I've tested the same configuration against the current release, and I
        can't reproduce the issue. Please file a bug with details about how to
        reproduce it.

        http://developer.yahoo.com/yui/#filingbugs

        Thanks,

        -Adam

        On Wed, Apr 30, 2008 at 10:55:42AM -0000, kehlpeter wrote:
        > Hi YUI community,
        >
        > recent update of Safari 3.1.1 on Mac OS X 10.5 Leopard broke it, so
        > when you use YUI TreeView and you click a node to collapse it or
        > expand it, it doesn't redraw. If you want to see it collapsed or
        > expanded, you have to scroll the page down and up...
        >
        > That's obviously Safari's fault. Until Apple fixes it, I created below
        > workaround. It only activates for Safari. Tested on both Mac OS 10.4
        > and 10.5.
        >
        > Hope it saves hassle for some of you :)
        >
        > /** Add this to the top of treeview.js and treeview-min.js
        > Following detects whether we're using Safari 3.1.*. Safari 3.1.1
        > on OS X 10.5.2 behaves
        > differently than other browsers, and it doesn't redraw trees when you
        > click at
        > TreeView toggle link.
        > */
        > use_hack_for_safari= window.navigator.userAgent.indexOf( 'Safari' ) >-1
        > && window.navigator.appVersion.indexOf( '/3.1' ) >-1;
        >
        > function redraw_elem_by_id( element_id ) {
        > //Thanks God for Google and
        > http://www.webmasterworld.com/forum91/453.htm and
        >
        > //http://www.quirksmode.org/bugreports/archives/2007/01/Changing_col_style_properties_via_javascript_cause.html
        > // Somehow $(element_id) doesn't work on Safari in this context
        > element= document.getElementById( element_id );
        > //element.style.display = 'none';
        > //element.style.display = 'block';
        > element.innerHTML = element.innerHTML + " ";
        > }
        >
        > /** Then down in the same file, replace existing getToggleLink
        > function by:
        > */
        > getToggleLink: function() {
        > return "YAHOO.widget.TreeView.getNode(\'" + this.tree.id +
        > "\'," +
        > this.index + ").toggle()" +
        > /** Following is a hack for Safari to make it refresh the tree.
        > */
        > ( use_hack_for_safari
        > ? ";redraw_elem_by_id('" +this.tree.id+ "')"
        > : ''
        > );
        > /* Instead of generating a call to redraw_elem_by_id() here,
        > I've tried to run the following in toggle function, along with
        > defining redraw() function (not here), but that
        > somehow didn't work.
        > if( use_hack_for_safari ) {
        > redraw( this.tree );
        > */
        > }
        >
        >
        >
        > ------------------------------------
        >
        > Yahoo! Groups Links
        >
        >
        >

        --
      Your message has been successfully submitted and would be delivered to recipients shortly.