67147 - berculo.com - Javascript-powered menu doesn't function

Status: RESOLVED FIXED

(Tech Evangelism Graveyard :: Dutch, defect, P3)

Description

[Reinout van Schouwen]

The Javascript menu on the left hand side of this page works great with IE and
NS 4.x, however Mozilla can't execute it. No messages in the Javascript console
either.

Comment 1

[Henrik Gemal]

I'm pretty sure it's because of the use of layers in the javascript menu.
Mozilla does not now and will never support layers.

Comment 2

[HJ]

The file 'dynlayer.js' contains a browser sniffer. Here's a snap of that code:

this.ns = (this.b=="ns" && this.v>=4)
this.ns4 = (this.b=="ns" && this.v==4)
this.ns5 = (this.b=="ns" && this.v==5)

And here's the line that is causing the bug effect:

if (arguments.length>=6 && color!=null) str += (is.ns)? '
layer-background-color:'+color+';' : ' background-color:'+color+';'

If you replace "writeCSS(collapse.css)" with "writeCSS(collapse.css,1)" you will
see that it's writing layer-background-color.

This is not a bug in Mozilla, but in the Javascript. 

Reinhout, if you need help [e-mail]

Comment 3

[HJ]

"&& !is.ns5" will do the trick.

Comment 4

[Keyser Sose]

Marking INVALID. Not our problemm its the sites problem.

Comment 5

[HJ]

But that won't help the reporter, right?

Comment 6

[Phil Schwartau]

This is a valid bug for the Evangelism component - reopening - 

Comment 7

[Phil Schwartau]

Reassigning to Evangelism component -

Comment 8

[HJ]

Thank you very much Phil.

Note: "is.ns" should not be valid, if the browser version equals 5, that's the
problem here. The check "&& this.v>=4)" is true for version 5 and that's why
it's matching 'layer-background-color', in stead of 'background-color' for
Mozilla/Netscape (5)

Comment 9

[Phil Schwartau]

I will attach a file below that includes all the HTML and JavaScript in-line!
I have added some debugging code, all marked by lots of //////////////'s.


The debugging code shows the properties of the "is" object, which 
contains the results of the browser-sniffing. As H-J points out,
the dynamic CSS writes out "layer-background-color" no matter what
the version of NS:


// CSS Function
function css(id,left,top,width,height,color,vis,z,other) {
 if (id=="START") return '<STYLE TYPE="text/css">\n'
 else if (id=="END") return '</STYLE>'

 var str = (left!=null && top!=null)? '#'+id+' {position:absolute;   
 left:'+left+'px; top:'+top+'px;' : '#'+id+' {position:relative;'
 
 if (arguments.length>=4 && width!=null) str += ' width:'+width+'px;'
 if (arguments.length>=5 && height!=null) 
 {
   str += ' height:'+height+'px;'
   if (arguments.length<9 || other.indexOf('clip')==-1)
   { 
      str += ' clip:rect(0px '+width+'px '+height+'px 0px);'
   }
  }

  if (arguments.length>=6 && color!=null) str += (is.ns)? 
            'layer-background-color:'+color+';' : ' background-color:'+color+';'

  if (arguments.length>=7 && vis!=null) str += ' visibility:'+vis+';'
  if (arguments.length>=8 && z!=null) str += ' z-index:'+z+';'
  if (arguments.length==9 && other!=null) str += ' '+other
  
  str += '}\n'
  return str
}



However, I put in a regular-expression to change "layer-background-color"
to "background-color", which is W3C-compliant. It makes no difference for me,
the attachment works in NN4.7 but not in Mozilla. 


So I'm still not sure of the exact error - anyone feel free to continue
debugging this. At least this file has all the JavaScript in-line ...

Comment 10

[Phil Schwartau]

Attachment: HTML with all JavaScript in-line, + some debugging code

Comment 11

[Phil Schwartau]

Try the attachment and compare NN4.7 (or IE4.7) with Mozilla.


In Mozilla, you get no errors in the JavaScript console - but none
of the lower-level menu items are visible. Perhaps someone could 
debug how visibility of these items is controlled - 


In the meantime, also note Evangelism bug 54458,
"List of XBDHTML sites based on Dan Steinman's Dynamic Duo API".


This site is using the Dan Steinman API - 

Comment 12

[Phil Schwartau]

Note Mozilla handles the attachment slightly differently on Linux.

On WinNT or Mac, I only see the "Home" icon. On Linux, part of lower 
icons are visible (for example "Aktiviteiten"), but are not functional.

Again, not sure what the exact problem is here. The attachment above
seems to show it is not the use of "layer-background-color" in the <STYLE>.
It changes that to "background-color", yet the problems still occur -

Comment 13

[Reinout van Schouwen]

I also mailed the sites' author on this issue, and he has incorporated some of
your suggestions on http://www.berculo.com/awepa/web (different site, same
menu). On OS/2 (the platform I'm on at the moment) this makes a difference in
that some of the menu items are displayed, though it looks messy and the links
still don't work. 

Comment 14

[HJ]

Ok, after reading my e-mail, I took a second look, and this time a bit longer.

The biggest pain on this site is that document.getElementById( id ) not the
expected "[object HTMLDivElement]" returns but, yes I know it sounds odd, but
for real, it return "{}". And thats why the height is not set correctly for the
menu items, and as result you don't see a thing.

After poking a bit in the source, I now have a visual menu, and can also open
the first menu "Activiteiten" I only need some directions why that stupid
document and node are returned as "{}". I', sure I can get this thing working,
if I know how to fix that problem.

note, in left.html is something as: if(is.ns) blabla put that into an alert, and
you will see the first problem!

Most friendly, HJ.

Comment 15

[HJ]

Blurp, I have a working menu. Now I need to check if this works with MSIE and
Netscape 4.x. But that's for next week. Now it's party time.

Comment 16

[HJ]

Attachment: dynlayer.js

Comment 17

[HJ]

Attachment: collapsemenu.js

Comment 18

[HJ]

Attachment: dynlayer-common.js

Comment 19

[HJ]

Attachment: dynlayer-glide.js

Comment 20

[HJ]

Attachment: left.html

Comment 21

[HJ]

Ok, I'm not flying Learjet but, this seems to work pretty well.

Comment 22

[Phil Schwartau]

H-J, nice work!!! We can now see that to get the given site to work, 

            http://www.berculo.com/aureus/left.html

all we have to do is change the URLs for its four included JS files
to the four attachments you have placed above. 

Now all we need to know is: did you have to change all four JS files, 
or just dynlayer.js? What is the MINIMUM change necessary in the JS files 
to make everything work? 


Again, great job on your part. Thanks!


I know the 

Comment 23

[HJ]

I would say just replace dynlayer.js and dynlayer-common.js. This files contain
the most important changes. But I will post a new dynlayer.js. There where still
some leftovers, alerts, and a small fix in function DynLayerSlideStart().

In general it's all about better browser selection, the is.ns5 and !is.ns5 stuff
in the sources. And some other small javascript corrections. The most important
changes I made in the  function: DynLayer(), DynLayerSlideStart(),
DynLayerGetContentHeight(), DynLayerInit(), 
.

BTW: I've spend the most time with a new javascript bug, yet to be filed.

Comment 24

[HJ]

Attachment: New version of dynlayer.js (no alerts and a small fix)

Comment 25

[HJ]

Attachment: That other site

Comment 26

[HJ]

Next.

Comment 27

[HJ]

Huh, once again. "Next." should be a complete comment about all the other sites
using the same library.

Comment 28

[Phil Schwartau]

Note Evangelism bug 54458 -

"List of XBDHTML sites based on Dan Steinman's Dynamic Duo API".

Comment 29

[Blake Ross]

Reassigning evangelism bugs to [e-mail].

Comment 30

[Bob Clary [:bc] (inactive)]

I checked the above url and it still is getting layer related errors as well as
errors trying to write to read only properties.

Dan Steinman no longer supports this project. Please see the updated project at
http://dynapi.sourceforge.net/dynapi/

Setting dependency on the DYNAPI tracking bug and assigning to Zach since he
owns the tracking bug. Zach if you want to hand this one off or recruit help,
let me know.

Bob

Comment 31

[HJ]

>I checked the above url and it still is getting layer related errors as well as
>errors trying to write to read only properties.

Yes, but that's only because that this site is not using the new library :)
On my own Apache server it looks great and works faster now. They should replace
the old library with the changed one, that's all.

>Dan Steinman no longer supports this project. Please see the updated project at
>http://dynapi.sourceforge.net/dynapi/

I rewrote/changed the library to make it work, without any errors :)

/HJ

Comment 32

[Bob Clary [:bc] (inactive)]

All Evangelism Bugs are now in the Product Tech Evangelism. See bug 86997 for
details.

Comment 33

[Zach Lipton [:zach]]

Why do I own this. Get rid of it.

Comment 34

[Bob Clary [:bc] (inactive)]

-> euro west

Comment 35

[Tristan Nitot]

Confirming on Win2K.

Page takes several minutes to load in IE and does not work in Netscape 6.2. 
Priority : P3.

HJ : you mention a library they should use. Where is it ? I'd be glad to send
them the URL so they do the fix.

Contact : [e-mail]

Comment 36

[Pascal Chevrel (relman team) -> :pascalc]

New Component

Comment 37

[Reinout van Schouwen]

Seems no longer relevant.