My old rubbish code is laughable

Most of yesterday I was adding a warning message to my old website to point out that the website was archived, with a link to the same page on the current website. Today I carried on with this task, and came across a file in the website directory named "Java.js".

I wondered what this could be, a javascript file that is named Java? Opening it up, it contained the following:

<script type="text/javascript" language="javascript">
<!--
if (top == self) location.replace("http://archive.domain.co.uk");
-->
</script>

Wha???? What are those HTML script tags doing in a javascript file?

Then I checked to see if this file was actually linked to anywhere in the website. I found two pages that mentioned Java.js in their source. When I opened them, they contained the following line:

<link rel="javascript" href="../Java.js">

Eh? I didn't think you could include a javascript file by a link statement, that's just for including CSS isn't it? Well, I checked, and my assumption is correct. So I had a file named Java that is actually a javascript file. The javascript file that wouldn't do anything as it contained HTML. And the link to the javascript file wouldn't work anyway as you don't include javascript using a link tag.

I wrote the site myself, so I only have myself to blame. I find it quite funny just how wrong I got it though.

Most of the rest of the day I was doing some wordpress work.

Website stats checking

For the last few weeks I have been trying to buy Pikmin 3 and Super Luigi U on eBay. I haven't had much luck so far as the prices always go up too high. One thing I noticed though, is that there seems to be a variety of age ratings printed on the covers.

In the screenshot from eBay above for Pikmin 3 listings, you can see the bottom copy is rated E (Everyone), above that the copy is rated 3, the copy above that is rated 7, and the top copy is rated E, but has a different cover design to the other ones. Seems a bit strange that they would produce so many different covers. (And actually there was another copy further down the page rated RP).

I was going through my website stats again today, and one of my sites had a lot of 406 Document not acceptable to client errors. I checked the logs and they appeared to be mostly to /wp-login.php and /wp-comments-post.php. I checked that I could comment okay, and I could. So I suspect these error codes are actually coming from bots. There shouldn't be any hits on /wp-login.php coming from humans (other than me, and I've never had a 406 error when logging in).

Another error I found was HEAD requests from PaperLiBot that were generating 500 internal server errors. PaperLi is a content curation service, not a spam / hacking bot. I tried the same request myself, and got 1 200 response (with the headers as expected).

After looking into this problem for quite a while, I found that actually the problem must have been the server going down for a bit. There were lots of these errors, but then further down in the log HEAD requests from PaperLiBot were being responded to with a 200 response code.

Looking at further errors, I found another block of 500 errors, this time for normal GET requests, but again for a bot. It looks like when lots of requests are received around the same time, then the server starts responding with 500 errors. As the site in question is on a shared HostGator account, I am not sure if there is anything I can do about it.

I think that probably HG forks a new apache process for each request, but after a certain number / memory usage, they stop spawning any new processes. You'd hope that any extra requests would be queued, but it could be that they just get a 500 error instead. I think I will have to check with HostGator to see what the issue is, and if there is anything I can do about it.

WordPresSing

Today I was doing more wordpress stuff. I looked at how to get the itemprop="name" added to the title of the page (using a plugin so it will work with any theme). This was actually quite difficult, as the only thing you can do to modify it is to add a filter to the_title(), or otherwise read the page into the output buffer and then use a regex or dom manipulations to locate the title and modify it. the_title() may be called various times in a page, not always relating to the current page's title, and sometimes as an attribute value rather than a text node.

When I'd got something reasonable set up, I then found that wordpress does some extra processing on the title that is passed into the filter compared the post_title of the $post object. Eventually I managed to figure out something that seems to work reasonably okay with the themes I have installed.

After that I worked on developing the minimal code social sharing buttons covered in this article: How to Add Fat-Free Social Buttons to Your Pages into a Wordpress plugin. I was actually hoping that someone else would do it, but it seems that no-one else has yet, so I thought I should get on with it.

When I was processing my panos on Monday I noticed that one of the cube faces (once prepared for web) has some strange banding. The banding was more similar to the banding you sometimes get in RAW files than what is typically referred to as JPEG banding. However, when I opened the image in Photoshop, the strange banding was nowhere to be seen. The banding was only visible in Windows Photo Viewer.

Here are a couple of pics that show the same area of the image in both Windows Photo Viewer and Photoshop. In one version I've increased the contrast greatly to make the banding really obvious.

It's annoying that Windows Photo Viewer shows the image like this. Still, it is a fast way to view images, and this sort of problem isn't very common. At least now I know about the issue I can always just open an image in PS to check it if it appears problematic.

Jimmy laddox

This morning I processed a pano from last year's holiday in Bavaria.

In the afternoon I was looking into how to modify my websites so that G+ would pick up the title of a blog post properly. I started working on a wordpress plugin to do it and also add meta tags, replacing the Platinum SEO pack plugin I use at the moment.

But when I started to get into it, I realized that the Platinum SEO pack has quite a lot of options and does more than just inserting a couple of meta tags. So I thought that rather than spending a long time re-creating the functionality of the Platinum SEO pack, I'd be better off to just modify it slightly to add the extra properties to the meta tags I need.

Annoying

This morning one of my backup drives filled up. So I had to do some file re-arranging to split the folder that was being backed up to that drive, so part of that folder could be backed up to a different drive instead. This took quite a while, since I had to backup the part I split off to a different drive that had more space on it.

After that I tried debugging my photo website on my Nexus 7 tablet. The buttons to license an image weren't showing up on the tablet, so I wanted to find out why. The first issue was modifying the hosts file on the tablet so I could access my local dev copy of my website. ES File Explorer would let me edit the hosts file, but wouldn't let me save it.

After some googling I found some instructions, but they didn't make sense. Eventually I found that you need to hold the tablet in landscape orientation for the ES File Explorer Settings options to be available. Then you need to go to Tools and choose to enable root explorer. Then you need to do a long press on the root explorer option to bring up more options and enable r/w on / and /system. (Though hosts is in /etc, it still wouldn't let me save it when I only enabled r/w on /).

Setting up Chrome on Android debugging was very easy, just install an extension for Desktop Chrome and connect the tablet to PC via USB. The extension then lets you open a Chrome Developer tools window for any tab open in Chrome on the tablet.

With this set up, I found that the buttons were actually showing up on my dev site, so there was no problem to debug. I checked the live site and they were showing up on that as well now. I did make some changes on the live site recently, so I must have inadvertently fixed whatever the problem was.

Most of the day I spent writing descriptions for some photos.

In the afternoon there was a white butterfly in the garden. I thought it would be good to try and get a UV photo of it since it wasn't moving (it was quite cool). But then it started raining. I tried getting an umbrella set up for a bit, but couldn't make it work, and gave up.

In the evening I was uploading some pics to Wikipedia. But the uploader wizard wouldn't save the images after adding the descriptions, categories, etc. for them all. So I had to add them all again one by one. I also opened a bug report for the issue, which obviously took some time as well.

ImageMagicking

Most of today I was trying to fix some issues I was having with ImageMagick. The first issue was my image thumbnails generated with my new 'workflow' were much larger than the old ones. While debugging this I noticed that when I applied a second transformation to an image with an orientation exif/xmp property that had been converted using auto-orient, the new image would be rotated wrongly (it would be rotated correctly as per the first image, but then also have the orientation exif property so that it gets rotated again).

I managed to solve the rotation issue by setting the xmp-tiff:orientation to horizontal (using exiftool) after the first transformation with auto-orient. The main issue of thumbnail size I did a range of tests and found that when the image was resized to 500 px wide / tall before creating a thumbnail made the thumbnail smaller in file size. But I couldn't work out why.

Before posting to the ImageMagick forum I thought I better try with the latest version in case it was an old bug that had been fixed. But when I built the latest ImageMagick it had no JPEG or TIFF support. I then spent a long time trying to get the dependencies and ImageMagick built correctly. I didn't manage to get LZMA support working, but I did get JPEG and TIFF support (though there were a various warnings when building that the lib files looked like they'd been moved).

When I then tried ImageMagick again, it still wouldn't work and said it needed lcms. So I built lcms (can get it from the ImageMagick delegates downloads, and then had to build ImageMagick again. (Building each dependency and ImageMagick typically takes quite a bit of time).

ImageMagick now didn't error out, but froze. I checked with top, which said the process was sleeping. Using -debug All gave useful output so I could see what was happening. There was some errors to do with Registry value shred-passes not being defined or something. After looking it up, I set it to 0. I also noticed that the tmp directory I was telling ImageMagick to use didn't exist. Whoops! Strange how the previous version worked okay with the same command though.

Now ImageMagick would just freeze after removing the tmp files, no errors. I tried various iterations of input image sizes. It worked with extremely small images, so after much experimentation I found approximately the smallest image it would break with - a 25px x 38px jpeg. I modified the command to remove the various options and operations, and found that it would work when the application of an ICC profile (color profile conversion) was missed out.

After much debugging I checked the ImageMagick info and found that the limit memory and memory-map options are meant to be specified with the unit of measurement. I had 64 and 128 as the values, so it was using bytes as the unit of measurement. I wonder if this is something that has changed, since the old version worked okay with those values, and it seems odd (though it is a possibility) that I would have missed off the unit of measurement. Changing them to even very small values e.g. 64kiB and 128kiB, and now ImageMagick worked fine.

I am not sure whether the memory-map value refers to RAM or disk, so I set 32MiB for both values for actual use. Hopefully that will be a reasonable amount without pushing me over my memory limits on my shared webhosting account.

After posting my issue on the thumbnail sizes I got a reply pretty quickly that pointed out the issue was the quality setting. On the 500px image I had set quality to 80, and was not setting quality on the thumbnail. So the thumbnail produced from the larger image had the same quality (98), and the thumbnail produced from the 500px resized image had the same quality (80), leading to a smaller file size. It was obvious once it was pointed out.

So I decided to set a quality of 60 on the thumbnails, which is probably more than good enough. It also made me realise that I wasn't applying a quality to my larger images, which should have been set to quality 80. So I corrected that as well.

Angry Aardvarks Advancing Along An Arrow

This morning I had a bad headache so I went back to bed after having some ibuprofen. Later in the morning my headache wasn't so bad so I got up, but it had wasted a couple of hours of my day.

onOne had sent me an email announcing their Photo Suite 8, so I thought I should update the ad for their software on my photo tips website. The ads they had on their affiliate area were just box shots, so I had to do a bit of work copying some text from their email and styling it slightly to make an ad that wasn't just a box shot with no other info.

I started getting ready to update my website with the new watermarked images. This involved changing various css and javascript files that added borders to the images. (The watermark includes an integrated border in the image whereas previously a border was added round the plain images using CSS). The files need minifying, version numbers need updating, and any references to my local (testing) domain need updating to the live domain before uploading. And of course it needs testing before and after going live.

An issue I found was that the site navigation on the map page was showing up underneath the map navigation, rather than above it. So I spent a long time trying to fix this until I eventually worked out the problem (a change in the maps API).

For part of the afternoon I made a cake.

In the evening I prepared my pog website update for Sunday.

Weighting

Today I was mostly waiting while my computer processed my website photos to add a 'watermarked' border to them. I did make a few mistakes with the script to begin with, but it seems to be working fine now. It does take a long time for the processing to run though. By the end of the day I should have 1500 photos processed.

Due to the free space on my VM, I am only processing 500 images a time, rather than just running it and then waiting for all images to be processed.

While I was waiting I read some photography magazines on issuu. I also took some photos to try an illustrate one of my photography articles.

One thing that one of the articles in a magazine that I read said, was that pixiq had closed down. I didn't really visit pixiq much, but was aware of it. I didn't know it had shut down. Apparently the site was shut down without much notice, and no reason given for its closure. It was made up of articles from a variety of contributors, and many contributors lost their work they'd written for pixiq because of the sudden closure.

Another thing I was alerted to was a device called the Flash Bender. This looks very useful (though quite expensive given what it is). You can buy cheap knock-offs of the bender on eBay, but not the diffusion panel attachment that turns the bender into a mini softbox. Possibly I might try one of the cheap knock offs anyway.

Watermarking

The last few days I have been working on creating a watermark for my photo website. I decided to add one so that my images would be branded when shared on sites such as pinterest, even if the pinner does not link back to my site.

I did quite a bit of research on watermarks in terms of design, size, placement. One of the best articles I read was this one: Watermarks: Protecting Your Images, or Damaging Your Business?. Make sure to check out the linked examples and buyer's guide survey as well.

In the end I decided to go for a border with my name and website address in, rather than a watermark over the photo. Once I'd decided on a design, I then had to mess about with it to suit different sizes and orientations of images. Next I had to work out how to apply the design using ImageMagick.

I had to update the image processing script for my website and test it quite a bit to make sure it was working properly. And then I had to write a script to process all my old images to add the border to them. I've not finished that yet. Once that's done I'll need to change the css for my website to remove the css border currently added to images.

I have had to do quite a bit of reading on ImageMagick in order to get it to add the border / watermark to my images as I want. One thread I read it was stated that the PHP imagick extension is not officially supported, and it is (generally) better to use the commandline tools: Imagick read MPC error "unable to persist pixel cache"

Imagick is not supported well if at all any more and was not created by the ImageMagick team. So I am not sure what to tell you at this point other than to just use PHP exec() for everything. You are not gaining much if anything from Imagick and it does not support many of the newer Imagemagick features.

So I am happy that this is what I have already been doing.

I had an issue with ImageMagick in that it was not respecting the opacity setting of a shape in an SVG file. (This was related to adding a standard style watermark, not the border I am actually implementing). It seems that others also have this problem: Imagick doesn't render svg opacity properly. I am going to try updating ImageMagick and see if that fixes the issue. (I have already tried fill-opacity instead of opacity in the SVG but it didn't make any difference).

On an unrelated note, I found this website that covers photography on the cheap: Larry Becker's Cheap Shots 2.0. While a nice idea, I must admit that I haven't found what I have read of it so far that useful. Most of the specific deals are US only, and other info tends to be stuff I already know about (e.g. adding a PC sync socket to a flash or camera with an adapter).

One idea that they linked to, which does seem quite good, is this DIY Beauty Dish - for £1. I haven't tried making it yet, but I like the idea.

In the evening I finished writing my script for re-processing old images to add a border / watermark to them. However, after completing it, I thought that my webhost might not be too happy with me running it. It would run for quite a long time (nearly 4000 images) and would probably use up a bit of CPU (image sizes to be resized down mostly around 10 megapixels, but some over 50 megapixels). It should be okay on memory, though I'm not sure how well PHP / my script would handle on the memory front when running for so many loops.

So I think that probably I will run the script on my local machine, and then just FTP the updated files to the server. But this does mean that the script will need modifying. A job for tomorrow.