How To Get Rid Of Javascript Unknown Class Error

I have a javascript that calls a function in an external .js document, it appears to work fine but when I run a syntax check via my html editor it returns a "unknown class" error message.  Since this page does well in the search engines I don't want to jinx it by having a code error on the page.  

In the head of my .htm document I have
<SCRIPT LANGUAGE="JavaScript" SRC="show.js" TYPE="text/javascript"></SCRIPT>

Further down where the slide show appears I have the following to call the function in the external .js file
<script type="text/javascript">new fadeshow(fadeimages, 142, 100, 0, 3000, 0, "");</script>

In the external .js file the function starts with
function fadeshow(theimages, fadewidth, fadeheight, borderwidth, delay, pause, displayorder){

As mentioned above the code "works" but I want to be sure the syntax is viewed as correct when checked for errors.  Thanks in advance for any help you might be able to offer.
ontrackprofessionalsAsked:
Who is Participating?
 
BadotzConnect With a Mentor Commented:
If the function is defined in the external .JS file, then as far as the browser is concerned, it is the same as if it were included directly. (Actually, it is included, just behind the scenes).



btw: Since the error returned by ace is:

javascript: unknown class name "fadeshow"

I would say - with 99% certainty - that ace isn't smart enough to examine external files. If you paste the JavaScript into your page and ace doesn't whine, then you can be 100% sure there is no error (that ace can find, anyways).
0
 
HonorGodCommented:
can you attach show.js for us to review?

Does the validation tell you which class is unknown?
0
 
ontrackprofessionalsAuthor Commented:
Sure, please find attached,

On the htm page it lists the error as ...

javascript: unknown class name "fadeshow"
var fadeimages=new Array()
//SET IMAGE PATHS. Extend or contract array as needed
fadeimages[0]=["show/image0.gif", "a.htm", ""] 
fadeimages[1]=["show/image1.gif", "b.htm", ""] //image with link syntax
fadeimages[2]=["show/image2.gif", "c.htm", ""] 
fadeimages[3]=["show/image3.gif", "d.htm", ""] 
fadeimages[4]=["show/image4.gif", "e.htm", ""] 
 
var fadebgcolor="white"
 
////NO need to edit beyond here/////////////
 
var fadearray=new Array() //array to cache fadeshow instances
var fadeclear=new Array() //array to cache corresponding clearinterval pointers
 
var dom=(document.getElementById) //modern dom browsers
var iebrowser=document.all
 
function fadeshow(theimages, fadewidth, fadeheight, borderwidth, delay, pause, displayorder){
this.pausecheck=pause
this.mouseovercheck=0
this.delay=delay
this.degree=10 //initial opacity degree (10%)
this.curimageindex=0
this.nextimageindex=1
fadearray[fadearray.length]=this
this.slideshowid=fadearray.length-1
this.canvasbase="canvas"+this.slideshowid
this.curcanvas=this.canvasbase+"_0"
if (typeof displayorder!="undefined")
theimages.sort(function() {return 0.5 - Math.random();}) //thanks to Mike (aka Mwinter) :)
this.theimages=theimages
this.imageborder=parseInt(borderwidth)
this.postimages=new Array() //preload images
for (p=0;p<theimages.length;p++){
this.postimages[p]=new Image()
this.postimages[p].src=theimages[p][0]
}
 
var fadewidth=fadewidth+this.imageborder*2
var fadeheight=fadeheight+this.imageborder*2
 
if (iebrowser&&dom||dom) //if IE5+ or modern browsers (ie: Firefox)
document.write('<div id="master'+this.slideshowid+'" style="position:relative;width:'+fadewidth+'px;height:'+fadeheight+'px;overflow:hidden;"><div id="'+this.canvasbase+'_0" style="position:absolute;width:'+fadewidth+'px;height:'+fadeheight+'px;top:0;left:0;filter:progid:DXImageTransform.Microsoft.alpha(opacity=10);opacity:0.1;-moz-opacity:0.1;-khtml-opacity:0.1;background-color:'+fadebgcolor+'"></div><div id="'+this.canvasbase+'_1" style="position:absolute;width:'+fadewidth+'px;height:'+fadeheight+'px;top:0;left:0;filter:progid:DXImageTransform.Microsoft.alpha(opacity=10);opacity:0.1;-moz-opacity:0.1;-khtml-opacity:0.1;background-color:'+fadebgcolor+'"></div></div>')
else
document.write('<div><img name="defaultslide'+this.slideshowid+'" src="'+this.postimages[0].src+'"></div>')
 
if (iebrowser&&dom||dom) //if IE5+ or modern browsers such as Firefox
this.startit()
else{
this.curimageindex++
setInterval("fadearray["+this.slideshowid+"].rotateimage()", this.delay)
}
}
 
function fadepic(obj){
if (obj.degree<100){
obj.degree+=10
if (obj.tempobj.filters&&obj.tempobj.filters[0]){
if (typeof obj.tempobj.filters[0].opacity=="number") //if IE6+
obj.tempobj.filters[0].opacity=obj.degree
else //else if IE5.5-
obj.tempobj.style.filter="alpha(opacity="+obj.degree+")"
}
else if (obj.tempobj.style.MozOpacity)
obj.tempobj.style.MozOpacity=obj.degree/101
else if (obj.tempobj.style.KhtmlOpacity)
obj.tempobj.style.KhtmlOpacity=obj.degree/100
else if (obj.tempobj.style.opacity&&!obj.tempobj.filters)
obj.tempobj.style.opacity=obj.degree/101
}
else{
clearInterval(fadeclear[obj.slideshowid])
obj.nextcanvas=(obj.curcanvas==obj.canvasbase+"_0")? obj.canvasbase+"_0" : obj.canvasbase+"_1"
obj.tempobj=iebrowser? iebrowser[obj.nextcanvas] : document.getElementById(obj.nextcanvas)
obj.populateslide(obj.tempobj, obj.nextimageindex)
obj.nextimageindex=(obj.nextimageindex<obj.postimages.length-1)? obj.nextimageindex+1 : 0
setTimeout("fadearray["+obj.slideshowid+"].rotateimage()", obj.delay)
}
}
 
fadeshow.prototype.populateslide=function(picobj, picindex){
var slideHTML=""
if (this.theimages[picindex][1]!="") //if associated link exists for image
slideHTML='<a href="'+this.theimages[picindex][1]+'" target="'+this.theimages[picindex][2]+'">'
slideHTML+='<img src="'+this.postimages[picindex].src+'" border="'+this.imageborder+'px">'
if (this.theimages[picindex][1]!="") //if associated link exists for image
slideHTML+='</a>'
picobj.innerHTML=slideHTML
}
 
 
fadeshow.prototype.rotateimage=function(){
if (this.pausecheck==1) //if pause onMouseover enabled, cache object
var cacheobj=this
if (this.mouseovercheck==1)
setTimeout(function(){cacheobj.rotateimage()}, 100)
else if (iebrowser&&dom||dom){
this.resetit()
var crossobj=this.tempobj=iebrowser? iebrowser[this.curcanvas] : document.getElementById(this.curcanvas)
crossobj.style.zIndex++
fadeclear[this.slideshowid]=setInterval("fadepic(fadearray["+this.slideshowid+"])",50)
this.curcanvas=(this.curcanvas==this.canvasbase+"_0")? this.canvasbase+"_1" : this.canvasbase+"_0"
}
else{
var ns4imgobj=document.images['defaultslide'+this.slideshowid]
ns4imgobj.src=this.postimages[this.curimageindex].src
}
this.curimageindex=(this.curimageindex<this.postimages.length-1)? this.curimageindex+1 : 0
}
 
fadeshow.prototype.resetit=function(){
this.degree=10
var crossobj=iebrowser? iebrowser[this.curcanvas] : document.getElementById(this.curcanvas)
if (crossobj.filters&&crossobj.filters[0]){
if (typeof crossobj.filters[0].opacity=="number") //if IE6+
crossobj.filters(0).opacity=this.degree
else //else if IE5.5-
crossobj.style.filter="alpha(opacity="+this.degree+")"
}
else if (crossobj.style.MozOpacity)
crossobj.style.MozOpacity=this.degree/101
else if (crossobj.style.KhtmlOpacity)
crossobj.style.KhtmlOpacity=this.degree/100
else if (crossobj.style.opacity&&!crossobj.filters)
crossobj.style.opacity=this.degree/101
}
 
 
fadeshow.prototype.startit=function(){
var crossobj=iebrowser? iebrowser[this.curcanvas] : document.getElementById(this.curcanvas)
this.populateslide(crossobj, this.curimageindex)
if (this.pausecheck==1){ //IF SLIDESHOW SHOULD PAUSE ONMOUSEOVER
var cacheobj=this
var crossobjcontainer=iebrowser? iebrowser["master"+this.slideshowid] : document.getElementById("master"+this.slideshowid)
crossobjcontainer.onmouseover=function(){cacheobj.mouseovercheck=1}
crossobjcontainer.onmouseout=function(){cacheobj.mouseovercheck=0}
}
this.rotateimage()
}

Open in new window

0
The new generation of project management tools

With monday.com’s project management tool, you can see what everyone on your team is working in a single glance. Its intuitive dashboards are customizable, so you can create systems that work for you.

 
ontrackprofessionalsAuthor Commented:
The javascript was originally intended to go in the head of the document, but I've tried to move it to an external .js so I suppose that is what is creating the error message.  I do not get the error message when the js is in the head area.

So I guess the answer lies in how to switch it to an external .js properly.
0
 
BadotzCommented:
How do you get the error? I mean, are you running the page through some kind of validator?

Do you get the error when you run the page from your server? Or is this some artificial error because your IDE isn't smart enough to include your .JS file?
0
 
ontrackprofessionalsAuthor Commented:
I'm using Ace HTML syntax checker and it is returning the js error, I don't have a way to check it on the server that I know of, it is possible that the Ace HTML checker is not smart enough to include the .js file.  Do you think that's what it is?
0
 
ontrackprofessionalsAuthor Commented:
It is my understanding that if the Search Engines detect an error in your code then it can hurt your rankings, hence my concern, I'm thinking if Ace picks it up as an error then the search engines might too.
0
 
BadotzCommented:
Do you know for a fact there IS an error on your page? I mean, do you GET an error when you serve it to your browser?

I would say the fault lies with the syntax checker, but for confirmation you should really get an answer from the author(s).

I feel your pain re: no response to your emails, but there isn't much more I can do for you, sorry.
0
 
BadotzCommented:
Except to say this: do not use UPPER CASE html element names - the XHTML spec forbids them (I believe). Thus:

<SCRIPT LANGUAGE="JavaScript" SRC="show.js" TYPE="text/javascript"></SCRIPT>

should be:

<script type="text/javascript" src="show.js"></script>

The "language" attribute has been deprecated, too (I believe).
0
 
ontrackprofessionalsAuthor Commented:
No, it works in the browser okay, as a knowledgable Javascript professional does the call to the function on the external .js look okay to you with the exception of the Upper Case which will now go fix :)
0
 
ontrackprofessionalsAuthor Commented:
Sounds good, but do you think the search engines can make the same mistake?
0
 
BadotzCommented:
Grade "B" - was I bad?
0
 
ontrackprofessionalsAuthor Commented:
No not at all, I really appreciate your help, thank you, I just hadn't heard back from you opinion wise regarding whether or not search engines could make the same mistake when checking the syntax of a page.
0
 
BadotzCommented:
Right. I'm just wondering why the "B" grade?
0
All Courses

From novice to tech pro — start learning today.