[REQ] Could someone check this page for me?

randombar

Not working in i.e. 7 and I don't know why?

http://www.ratemypub.ie/county.php?countyid=10

mneylon

Try getting it to validate first. It looks like there are some A HREF tags that aren't properly declared

Bob the Builder

Internet explorer cannot open the following webpage
http://.....

Operation Aborted.
Renders okay in Firefox although.

Bob the Builder

Just checked through the page using Firefox Web Developer Plugin Error Console, and there are numerous problems in relation to the html, etc. Firefox fixes the bugs, but IE 7 just cant be arsed.

CSS is perfecto.

HTML:
That might be an answer:
http://validator.w3.org/check?verbose=1&uri=http%3A%2F%2Fwww.ratemypub.ie%2Fcounty.php%3Fcountyid%3D10
Result: Failed validation, 1960 Errors

randombar

All those validation errors were for alt tags or else the closign of a tags withing google, but they shouldnt matter?

Can't figure this out for the life of me?

randombar

Removed the google maps app now and still not rendering?

http://browsershots.org/http://www.ratemypub.ie/Cork/

Added all the alt tags and all that still no joy!

http://validator.w3.org/check?uri=http%3A%2F%2Fwww.ratemypub.ie%2Fdublin%2F&charset=%28detect+automatically%29&doctype=Inline&group=0

pontovic

Ok look in your javascript tags if you use any, because incorrectly closed tags can stop a page rendering in IE.

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

is wrong, even though it looks right. Use the following instead

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

ianhobo

I'm pretty sure the googla analytics code is *supposed* to go at the end of your page regardless, just before the closing body tag. THere could be page performance issues with it being at the top

Also, you javascript functions, they shouldn't be in the body, they should ideally be in the head section with all the other script stuff (apart from the google bit I just mentioned)

ianhobo

again back the google stuff, this may of course have changed in the months since I used google maps, but it may help anyway....
I'd move all the javascript stuff to the head section and have just one or two opening and closing script tags.

You seem to be directly calling some of the google stuff, but according to them (when I last used it), you are supposed to have a div with an id called "map" (didn't see one?), and you are supposed to have a function call in the opening body tag to the google load()function which they provide.

I'm not saying yours is wrong, its just quite different and messier to what I've read before?

I can pm you a link some pages iv done before for companies where I've used the map if you want?

ianhobo

This might have something to do with it......

<table width="100%" border="0" align="center">
	<tr>
	    <td  width="30%"><h2>Pub Name</h2></td>

	    <td rowspan="5000" bgcolor="#4E8A01" width="1"></td>
            <td align="center" width="35%"><h2>Pub Location</h2></td>
	    <td rowspan="5000" bgcolor="#4E8A01" width="1"></td>
	    <td align="center" width="15%"><h2>Pub Type</h2></td>
	    <td rowspan="5000" bgcolor="#4E8A01" width="1"></td>
	    <td align="center" width="20%"><h2>Avg Rating</h2></td>
         ............................

...a rowspan of 5000!!! Surely that can't be correct? is that intentional?

randombar

Right I've removed all the javascript I changed the rowpsan thing (changed it back cause it messed up the look) and still nothing!

The thing is i've made no changes over the last couple of days?

I moved the page over to my gearoidcorcoran.com site an database and still nothing

i used a new google api id on that still nothing?

I'm stumped?

SHyland

Seems to work ok for me although the 2 boxes at the top are blank, not sure if that's meant to be (or if thats the problem you have)......version of IE used 7.0.5450.4

ianhobo

im using ie 7.0.5730.13

The strange thing is, if you save all the html locally and then open the page it opens fine...?

Could the php be taking to long to serve, or messing something up? I don't know anything about php

I'll try a few other things and let you know............

SHyland

Seems to work perfectly now with those boxes populated correctly...list and map. Just thought Id say that there is a significant pause while it loads (both this time and before)...about 20 seconds....before the full page is visible.

SHyland

Perfectly that is until you try to click on the little balloon things on the map after loading....you get errors reported in the status bar at the bottom of the browser. Sorry.....bringer of bad news, etc......

randombar

SHyland wrote: »

Perfectly that is until you try to click on the little balloon things on the map after loading....you get errors reported in the status bar at the bottom of the browser. Sorry.....bringer of bad news, etc......

Ah ya listen lads thanks very much for your help today, saved my skin here!

Sorted out the click on icons, reckon i'll have to go through the new stuff with a fine tooth comb now before I launch it.

Is the page very slow?

SHyland

Balloon things working (well done)........but still a little slow....not much shy of 20 seconds or so and its the map that takes up the time.

randombar

The problem at the moment is if I call the google maps function within initialize, how can I call the mapping functions dynamically?

I.E. in my ajax I actually call to remove old markers and add new ones? But since the javascript variables are embedded in the initialize function, the ajax call can't use them?

randombar

Right think I got everything sorted anyways lads, thanks a lot for helping me out. If any of ye are around the galloping green I'll sort ye out for a pint!

So finally opinions:

1 - Why is it better to have JS in the header?

2 - Is there a nice way of making the loading slide thing that google have?

remember PINTS!!!

ianhobo

do you mean have the map slide a bit when it initially loads?

I think if you set the initial map location to a set of co-ordinates, then have a balloon open whos co-ordinates are just slighlty different, the map will slide from the initial location to the new ones

putting all your JS functions inthe head is good practice and keep everything tidy, particularly helpful when debugging!

You usually only place a script in the middle of html if you want if to run there when the browser actually gets to that piece of code in the page.
Google provide you with a load() function so that you dont have to have google code, markers, gpoints etc sprinkled throughout your code, it allows you to keep it all centralised. You can then use the DOM to call the relevant functions -> onload onclick, onfocus etc. much tidier

randombar

Hi Ian,

I was really talking about that red loading banner at the top right of the google page when you are adding attatchments and the likes. I'm thinking maybe just a gif now or something?

Ya I'm starting to see now about this centralization, definitely make sense and a lot more tidy.

Unfortunately with my new site, I use the google maps initialize function to set up the map and so on, I can't then use ajax to populate the map further as all the map variables have been called within the function and are function specific

(Curse my lack of javascript knowledge!)

ianhobo

crap, i did that exact thing for my friend last year, but I dont have the code.
I think all of the points were just in the xml file and all got reloaded with every request? I'll have to check.....

I reckon the loading things is just a css positioned div thats turned on and off?

randombar

ya I was thinking of writing some code that would create a new xml file every time with the relevant points and info in it. Could be an ok work around!

Apparently the google maps has gone a bit wonky for a load of people (Draggable markers stopped working in IE)

very strange?

ianhobo

off the top of my head, 26 xml files.
a.xml
b.xml
.
.
z.xml

each with the relevant markers for all the a, or b or z named pubs

On your page, clicking on one of your letter links which has a name="a" attribute, calls a function calles a functtion which gets that html link name attribute ("a", or "b"), adds ".xml" on to it, and you now have the name of the relevant xml file for all those pointers. pass that to your ajax function and hey presto. only the relevant pub markers loaded.

Do you understand that? Or do you want me to elaborate? Sorry, its a bit rushed.....

randombar

I get ya all right had a couple of versions of something like that going before, the thing is sometimes the pub list will be a list of the search result, and i'm integrating pagination into the new site so I'll probably just generate the xml on the fly.

How will I get google maps to reload with the new file though? Will that not need access to the variables in the initialize function anyway?

Hopefully not!

mewso

Good scripting practice means putting the js in a seperate file. Putting it in the head is just a slight improvement over having it inline imo.

randombar

musician wrote: »

Good scripting practice means putting the js in a seperate file. Putting it in the head is just a slight improvement over having it inline imo.

Ya threw it all into a new script there (new version), how do you use separate parts of the script for each page? or do you just have separate versions of the same script?

randombar

Right been looking at the xml importer and it basically has the same problem

        GDownloadUrl("./include/data.xml", function(data) {
          var xml = GXml.parse(data);
          var markers = xml.documentElement.getElementsByTagName("marker");
          for (var i = 0; i < markers.length; i++) {
            var latlng = new GLatLng(parseFloat(markers[i].getAttribute("lat")),
                                    parseFloat(markers[i].getAttribute("lng")));
            map.addOverlay(new GMarker(latlng));
          }

The "map.addOverlay(new GMarker(latlng));" command has to be run within the initialize function or else it too won't be recognised!

Balls!

mewso

GaryCocs wrote: »

how do you use separate parts of the script for each page? or do you just have separate versions of the same script?

In theory you would only have a link to a js file that is relevent to that page. In practice because of templates I usually end up with script that won't be relevent to other pages so you script has to do the checking. i.e. var elem = document.getElementById("myelement")
if (elem) {
//proceed
}

Because I will have more than one script it also encourages good unobtrusive script like using proper event management particularly with stuff for when the page loads just in case other script trys to assign code to the same events.

randombar

Nice one for that musician will have to do a bit more work on my javascript but good for tidying up my code.

Any suggestions for the google maps problem? How can I generate markers dynamically?

mewso

GaryCocs wrote: »

Any suggestions for the google maps problem? How can I generate markers dynamically?

I won't pretend to know anything about google maps but if you explained what you need to do I'd be willing to have a think about it. I'm not certain what the problem is that you mentioned about the addOverlay command.

randombar

Basically, the google maps api loads in an initialize function, this then creates crate marker functions within this initialize function. I would like to run these functions via ajax after the page has loaded but unfortunately can't get at the variables within the initialize function?

You can see the error on this page:

http://www.ratemypub.ie/template/county.php?countyid=10

Thanks for your time musician.

mewso

Is it not possible to declare the map object as global and then use it anywhere?:-

<script type="text/javascript">
[B]var map = null;
[/B]function initialize() {
 if (GBrowserIsCompatible()) {
  [B]map = new GMap2(document.getElementById("map"));
[/B]  map.addControl(new GSmallMapControl());
  map.setCenter(new GLatLng(53.3833,-6.15234), 8);
  var bounds = new GLatLngBounds();
  function clearBounds() {
  var bounds = new GLatLngBounds();
  }
  function addsmallmappoint(lat,lon,html) {
  var point = new GLatLng(lat, lon);
  map.addOverlay(createSmallMarker(point, html));
  bounds.extend(point);
  map.setZoom(map.getBoundsZoomLevel(bounds));
  map.setCenter(bounds.getCenter());
  }
 }
}
</script>
....
<script type="text/javascript">
if (map){
  //do my stuff
} 
</script>

randombar

I've made that change there, thanks. But how do you make internal functions global?

Thanks
Gary

mewso

GaryCocs wrote: »

I've made that change there, thanks. But how do you make internal functions global?

Maybe take it out and create it as a function on it's own then make any vars it references global like map.

randombar

EDIT:

YESSSSSSSSSSSSSSSSSSSSSSSSSSSSSS

Ian hobo and musician, I def owe the two of ye a couple of pints! Savage Stuff!!

Also how do I block my js file from prying eyes?

mewso

GaryCocs wrote: »

EDIT:

Also how do I block my js file from prying eyes?

Well you can't really block folks from seeing your files but you can pack them or even obfuscate them. Do a google search for javascript obfuscation or something.