Tuesday 30 March 2010

Websiting and Pretzel Making

Today I was just doing more work on my pano website.

In the afternoon I spent quite a while trying to figure out why Opera would highlight (blue overlay) the flash object (pano) when you click and drag in the flash object. Initially after looking at others sites that worked fine, I saw that they all used <embed> tags instead of the standards compliant <object> tags that SWFObject 2 generates.

Initially I tried debugging using Opera Dragonfly. I used the javascript console in Dragonfly to replace the flash <object> in my page with an <embed> version of the same tag. The <embed> flash pano did seem to work properly without getting highlighted when you click and drag, but the close icon in the top right hand corner, which is an image in the HTML absolutely positioned above the flash object, disappeared behind the <embed> object.

I spent quite a while trying to figure out what the problem was, then eventually I closed Dragonfly, and the icon popped back in front of the <embed>. So it seems it was just some weird thing with Dragonfly that was causing the close icon to be behind the <embed>. Now knowing that <embed> worked okay, I looked to see how I could get SWFObject 2 to generate an <embed> tag instead of a standards compliant <object> tag. Unfortunately it didn't seem that you could.

I decided to make a test case that I could use to either support the case that SWFObject should have a method of using the <embed> tag, and/or that Opera wasn't handling <object>s properly. So I loaded up the pano 'lightbox' in Firefox, then saved the page, which saved the generated HTML with the pano already open. I opened the saved page in Opera, and found I had to make a few changes to some URLs in the page to get the pano working.

I tested the page in Opera again, and the pano was now working, and had the selection problem. I replaced the <object> tag with the equivalent <embed> tag, refreshed the page, and surprisingly the pano would still get highlighted when I clicked and dragged. So obviously the problem wasn't down to the <object> tag, and couldn't be fixed by using the <embed> tag instead.

Then I gradually removed parts of the HTML, refreshing the page in Opera after each change, to check if the highlighting/selection problem was still occuring. Eventually I got to a point where nearly all the HTML had been removed, and now the pano worked without getting highlighted. Reverting my previous change, and then removing the HTML again, but in smaller sections, I found that the problem was caused when text existed behind the div that the panorama was contained in.

I made a quick test case with a page of text and an absolutely positioned <div> in the middle above the text. In Opera, when you click and drag inside the absolutely positioned <div>, the text behind the <div> is selected, but in the other browsers I tried (FF, Chrome, Arora, IE7, IE8), the text isn't selected. It's kind of like the <div> is invisible to the cursor in Opera.

I planned on reporting the problem to Opera, but before doing so I wanted to get my pano website online so I could show that it is a real-life problem. The test case I made doesn't show that it's a problem - just that Opera's behaviour is different in this aspect to all other browsers.

Knowing how long it's taken me before to upload a copy of a Wordpress installation to the web server, I decided to just create a (gzipped) tarball of my site and upload that. I didn't have any existing files for the site on the web server anyway.

In the late afternoon I started helping L make some Chocolate Pretzels.

After dinner I helped L finish cooking the Pretzels, then tried to get my pano website online. L and Clare Chocolate coated the Pretzels, then me, L, and Mauser watched an episode of Star Trek while eating some of the Pretzels.

After that I finished getting my pano website online. I had been accessing my local copy of the site using the correct domain name, but now I need the domain to point to the real site, and also a fake domain to point to my local copy of the site (for development), so I had to make some changes to make that possible.

Initially when I tried to access the live site (after changing my hosts file so the domain didn't go to my local copy of the site), I just got a DNS error from my ISP. After waiting for a bit, I could access the site, and just got a big 'Database error' message. I had copied across the database to the web server, but forgotten to set up the user for the database. So I did that, and then the website loaded up properly.

I clicked to load up a pano, but it was blank. So I opened up firebug, then either clicked to go through to a different page on the site or refreshed the current page (can't remember which), and was greeted by my ISP's DNS error page again. I tried a few more times to get on my site, but was still getting my ISP's DNS error page. I checked the static subdomain of my site, and that was resolving okay.

I tried accessing my site again, but still no luck. I checked the server logs for the domain, and the last access entry for the domain was when the site had loaded successfully. The error log just had about a favicon being missing. The main access and error log didn't have anything in either. I tried accessing the site again, but still got the DNS error page from my ISP.

I checked the settings in my webhost's web control panel interface, and everything looked okay. I was about to write a post in their forum asking if a DNS entry could be propagated and then reversed, but then I checked my site again, and it worked.

There were a few more problems with the site, but I think I fixed them now. I'm quite sleepy now, so I'll probably post my question on the Opera forums tomorrow.

The weather was rainy all morning. In the afternoon it was a mixture of clouds, sun, and rain, then later in the afternoon and evening it rained again. Apparently in the Highlands of Bonnie Scotland there's been lots of snow.

Food
Breakfast: Bowl of Choco Moons Cereal; Cup o' Tea.
Lunch: Herby Sausage with French Brie Cheese and Mayonnaise Sandwich; Apple; Chocolate Caramel Wafer Biscuit; Cup o' Tea.
Dinner: Spaghetti; Meatballs in Tomato Sauce Stuff; Cheese Sauce; Ground Black Pepper. Pudding was 2x Home-made Chocolate Pretzels. Coffee.

No comments: