[Javascript] Doesn't render correctly on Firefox

February 19, 2009

I'm part of a world of warcraft guild, with a website hosted on guildportal.com. While trying to improve our website, i've implemented a custom rss feed that would pull the most current WoW news from mmo-champion.com to my frontpage. The script works correctly, but the problem is that on firefox, the feed gets cut off, while on IE (7 or 8) and chrome, it displays the full feed correctly.

My script is:

&lt;div id="feed"&gt;&lt;/div&gt;

&lt;script type="text/javascript" src="https://www.google.com/jsapi"></script>;script type="text/javascript"&gt;
google.load("feeds");
$(document).ready(function() {
var myfeeds = new Array();

var feedBox = "feed";
var tooltipWidth = 560;

var previewMode = true;
var previewLength = 80000;
var readMoreMessage = "...&lt;br&gt;&lt;br&gt;&lt;img align=right src=http://i201.photobucket.com/albums/aa236/Mottie1/testsite/styles/moreinfo.gif>;";

myfeeds.push (["MMO-Champion","http://www.mmo-champion.com/index.php?type=rss;action=.xml;board=2.0;sa=news;",1// **************************************
// Do not change anything below this line
// **************************************
var ttcss = "#dhtmltooltip";
var ttBrdr = $(ttcss).css("border-width");
var ttBkgd = $(ttcss).css("background-color");
$("#"+feedBox)
 .mouseover(function(){$(ttcss).css("border-width","0").css("background-color","transparent")})
 .mouseout (function(){$(ttcss).css("border-width",ttBrdr).css("background-color",ttBkgd)});
 for (var k = 0; k &lt; myfeeds.length; k++) {
  feedResult(myfeeds[k]);
 }
function feedResult(currentFeed) {
 var feed = new google.feeds.Feed(currentFeed[1]);
 feed.setResultFormat(google.feeds.Feed.XML_FORMAT);
 feed.setNumEntries(currentFeed[2]);
 feed.load(function(result) {
  if (!result.error) {
   var ftitle = (currentFeed[0] == "") ? (result.xmlDocument.getElementsByTagName("title")[0].firstChild.nodeValue) : (currentFeed[0]);
   var feedText = "&lt;div class='feedTitle'&gt;" + ftitle + "&lt;/div&gt;";
   var items = result.xmlDocument.getElementsByTagName("item");

   for (var j = 0; j &lt; items.length; j++) {
	var titleElement = items[j].getElementsByTagName("title")[0];
	var xtitle = titleElement.firstChild.nodeValue;

	var titleElement = items[j].getElementsByTagName("link")[0];
	try {var xlink = titleElement.firstChild.nodeValue;} catch(e) {xlink = "";}

	var titleElement = items[j].getElementsByTagName("pubDate")[0];
	try {var pubDate = titleElement.firstChild.nodeValue;} catch(e) {pubDate = "";}

	var titleElement = items[j].getElementsByTagName("description")[0];
	try {var descript = titleElement.firstChild.nodeValue;} catch(e) {descript = "";}

	pubDate = pubDate.replace(/'/g,"\'").replace(/\"/g,'\"');
   descript = descript.replace(/'/g,"\'").replace(/\"/g,'\"');

	if (previewMode) {
	 var dStart = descript.indexOf("&lt;br&gt;") + previewLength;
	 if (descript.length &gt; dStart) {descript = descript.substring(0,dStart) +  readMoreMessage;}
	}

	var feedPopup = '&lt;div&gt;&lt;table class=tooltip&gt;&lt;tbody&gt;&lt;tr&gt;&lt;td class=tooltiplt&gt;';
	feedText += '&lt;div class=feedDate&gt;' + pubDate + '&lt;/div&gt;&lt;div class=feedDesc&gt;' + descript + '&lt;/div&gt;';
	feedText += '&lt;/td&gt;&lt;td class=tooltiprt&gt; &lt;/td&gt;&lt;/tr&gt;&lt;tr&gt;&lt;td class=tooltiplb&gt; &lt;/td&gt;';
	feedText += '&lt;td class=tooltiprb&gt; &lt;/td&gt;&lt;/tr&gt;&lt;/tbody&gt;&lt;/table&gt;&lt;/div&gt;';


   }
   feedText += '&lt;br&gt;';
   document.getElementById(feedBox).innerHTML += feedText;
  } else { alert ("feed error from " + currentFeed[0]); }
 });
 }
});
&lt;/script&gt;

Does anyone have a clue on what it might be wrong?

My guild website is cont.guildportal.com if you want to see the script live to confirm the bug, its just below the news on the frontpage.

Thanks in advance.

Edited February 25, 2009 by Koopie

February 21, 2009

Even if i don't like to do this, /bump.

Tried to switch around the code and still no luck,

February 24, 2009

Cant see any feed right now!!

February 25, 2009

karma said:
Cant see any feed right now!!

Sorry about that, was trying to change the code around yesterday and disabled it since the result was still the same. Its up now if you want to check.

February 25, 2009

It is not showing in Firefox because there is an error in the feed here

&lt;a target="_blank" href="http://static.mmo-champion.com/mmoc/images/news/2009/february/ulduarweap/ulduar_bow_01.jpg">;img src="https://static.mmo-champion.com/mmoc/images/news/200</div"/>;/a&gt;

that should be

&lt;a target="_blank" href="http://static.mmo-champion.com/mmoc/images/news/2009/february/ulduarweap/ulduar_bow_01.jpg">;img src="https://static.mmo-champion.com/mmoc/images/news/2009/february/ulduarweap/small/ulduar_bow_01.jpg" /&gt;
&lt;/a&gt;

Internet Explorer ignores it and carries out the rest of the presentation but Firefox stops at that point.

February 25, 2009

Well but thats the problem, the feed does not have errors, you can check the feed code directly from the feed link. http://www.mmo-champion.com/index.php?type...rd=2.0;sa=news;

Somehow, the code above is cutting the feed on firefox but not on chrome/ie and probably not on opera too.

Edit: Made the code display 2 feed entries so the problem is more visible. As you can see, the "description" field of the rss is getting cut on firefox but not on the rest of the browsers.

Edited February 25, 2009 by Koopie

February 25, 2009

what happens when you add that code to a page on its own without the rest of your site?

February 25, 2009

Still doesn't work, i tried to parse the javascript into a validator, it did found some errors but dont thing they are relevant (http://www.jslint.com/)

February 26, 2009

Try this for me please.

&lt;div id="feed"&gt;&lt;/div&gt;
&lt;script type="text/javascript" src="https://www.google.com/jsapi"></script>;script type="text/javascript"&gt;

google.load("feeds");
$(document).ready(function() {
var myfeeds = "new Array()";

var feedBox = "feed";
var tooltipWidth = 560;

var previewMode = true;
var previewLength = 80000;
var readMoreMessage = "...&lt;br&gt;&lt;br&gt;&lt;img align=right src=http://i201.photobucket.com/albums/aa236/Mottie1/testsite/styles/moreinfo.gif>;";

myfeeds.push (["MMO-Champion","http://www.mmo-champion.com/index.php?type=rss;action=.xml;board=2.0;sa=news;",1// **************************************
// Do not change anything below this line
// **************************************
var ttcss = "#dhtmltooltip";
var ttBrdr = $(ttcss).css("border-width");
var ttBkgd = $(ttcss).css("background-color");
$("#"+feedBox);
.mouseover(function(){$(ttcss).css("border-width","0").css("background-color","transparent")});
.mouseout (function(){$(ttcss).css("border-width",ttBrdr).css("background-color",ttBkgd)});
function feedResult(currentFeed) {
var feed = new google.feeds.Feed(currentFeed[1]);
feed.setResultFormat(google.feeds.Feed.XML_FORMAT);
feed.setNumEntries(currentFeed[2]);
feed.load(function(result) {
  if (!result.error) {
   var ftitle = (currentFeed[0] == "") ? (result.xmlDocument.getElementsByTagName("title")[0].firstChild.nodeValue) : (currentFeed[0]);
   var feedText = "&lt;div class='feedTitle'&gt;" + ftitle + "&lt;/div&gt;";
   var items = result.xmlDocument.getElementsByTagName("item");

   for (var j = 0; j &lt; items.length; j++) {
	var titleElement = items[j].getElementsByTagName("title")[0];
	var xtitle = titleElement.firstChild.nodeValue;

	var titleElement = items[j].getElementsByTagName("link")[0];
	try {var xlink = titleElement.firstChild.nodeValue;} catch(e) {xlink = "";}

	var titleElement = items[j].getElementsByTagName("pubDate")[0];
	try {var pubDate = titleElement.firstChild.nodeValue;} catch(e) {pubDate = "";}

	var titleElement = items[j].getElementsByTagName("description")[0];
	try {var descript = titleElement.firstChild.nodeValue;} catch(e) {descript = "";}

	pubDate = pubDate.replace(/'/g,"\'").replace(/\"/g,'\"');
   descript = descript.replace(/'/g,"\'").replace(/\"/g,'\"');

	if (previewMode) {
	 var dStart = descript.indexOf("&lt;br&gt;") + previewLength;
	 if (descript.length &gt; dStart) {descript = descript.substring(0,dStart) +  readMoreMessage;}
	}
for (var k = 0; k &lt; myfeeds.length; k++) {
  feedResult(myfeeds[k]);
}
	var feedPopup = '&lt;div&gt;&lt;table class=tooltip&gt;&lt;tbody&gt;&lt;tr&gt;&lt;td class=tooltiplt&gt;';
	feedText += '&lt;div class=feedDate&gt;' + pubDate + '&lt;/div&gt;&lt;div class=feedDesc&gt;' + descript + '&lt;/div&gt;';
	feedText += '&lt;/td&gt;&lt;td class=tooltiprt&gt; &lt;/td&gt;&lt;/tr&gt;&lt;tr&gt;&lt;td class=tooltiplb&gt; &lt;/td&gt;';
	feedText += '&lt;td class=tooltiprb&gt; &lt;/td&gt;&lt;/tr&gt;&lt;/tbody&gt;&lt;/table&gt;&lt;/div&gt;';


   }

   feedText += '&lt;br&gt;';
   document.getElementById(feedBox).innerHTML += feedText;
  } else { alert ("feed error from " + currentFeed[0]); }
});
}
});

&lt;/script&gt;

February 26, 2009

The feed doesn't load with that code. I did noticed you added a couple of ; and changed the array part and also deleted a few stuff, tried to revert things one by one and it did not loaded. I'm currently clueless why this problem happens. Appreciate your help karma.

February 26, 2009

Can you add the original code onto a blank page and link me to it please?

March 1, 2009

karma said:
Can you add the original code onto a blank page and link me to it please?

Sorry, been away for a little trip during this weekend, ill get this done when i reach my hands to a pc.

March 1, 2009

Try change this:

feed.load(function(result) {
  if (!result.error) {
   var ftitle = (currentFeed[0] == "") ? (result.xmlDocument.getElementsByTagName("title")[0].firstChild.nodeValue) : (currentFeed[0]);
   var feedText = "&lt;div class='feedTitle'&gt;" + ftitle + "&lt;/div&gt;";
   var items = result.xmlDocument.getElementsByTagName("item");

to this:

feed.load(function(result) {
  if (!result.error) {
   result.xmlDocument.normalize();
   var ftitle = (currentFeed[0] == "") ? (result.xmlDocument.getElementsByTagName("title")[0].firstChild.nodeValue) : (currentFeed[0]);
   var feedText = "&lt;div class='feedTitle'&gt;" + ftitle + "&lt;/div&gt;";
   var items = result.xmlDocument.getElementsByTagName("item");

It's hard for me to test because of all the linked Javascript files

March 3, 2009

Banjo said:

Try change this:

feed.load(function(result) {
   if (!result.error) {
	var ftitle = (currentFeed[0] == "") ? (result.xmlDocument.getElementsByTagName("title")[0].firstChild.nodeValue) : (currentFeed[0]);
	var feedText = "&lt;div class='feedTitle'&gt;" + ftitle + "&lt;/div&gt;";
	var items = result.xmlDocument.getElementsByTagName("item");

to this:

feed.load(function(result) {
   if (!result.error) {
	result.xmlDocument.normalize();
	var ftitle = (currentFeed[0] == "") ? (result.xmlDocument.getElementsByTagName("title")[0].firstChild.nodeValue) : (currentFeed[0]);
	var feedText = "&lt;div class='feedTitle'&gt;" + ftitle + "&lt;/div&gt;";
	var items = result.xmlDocument.getElementsByTagName("item");

It's hard for me to test because of all the linked Javascript files

This did the trick, however, only on firefox. With the "result.xmlDocument.normalize();", the feed does not load on IE.

Webpage error details

User Agent: Mozilla/4.0 (compatible; MSIE 8.0; Windows NT 6.1; WOW64; Trident/4.0; SLCC2; .NET CLR 2.0.50727; .NET CLR 3.5.30729; .NET CLR 3.0.30729; Media Center PC 6.0)
Timestamp: Tue, 3 Mar 2009 15:53:07 UTC


Message: Object doesn't support this property or method
Line: 685
Char: 4
Code: 0
URI: http://cont.guildportal.com/Guild.aspx?GuildID=51848&TabID=453954

Line 685 is the "result.xmlDocument.normalize();"

Just arrived home, so will try to make the blank page with the feed javascript only so its easier.

Sign In

[Javascript] Doesn't render correctly on Firefox

Question

Koopie

Link to comment

Share on other sites

13 answers to this question

Recommended Posts

Koopie

Link to comment

Share on other sites

karma

Link to comment

Share on other sites

Koopie

Link to comment

Share on other sites

karma

Link to comment

Share on other sites

Koopie

Link to comment

Share on other sites

karma

Link to comment

Share on other sites

Koopie

Link to comment

Share on other sites

karma

Link to comment

Share on other sites

Koopie

Link to comment

Share on other sites

karma

Link to comment

Share on other sites

Koopie

Link to comment

Share on other sites

Banjo

Link to comment

Share on other sites

Koopie

Link to comment

Share on other sites

Recently Browsing 0 members

Posts

Recent Achievements

Popular Contributors

Tell a friend