*** Update code August 13, 2008 thanks to JFriend ***

Here's a GreaseMonkey script that will add thumbnails to the detail pages of StatCounter, for you StatCounter hawks.

Makes it look like this, so you won't have to click to see what's being looked at!


Here's the code, or install straight from my scripts on userscripts.org

// ==UserScript==
// @namespace     http://nimai.smugmug.com/statcounterthumbs
// @name          StatCounter SmugMug Thumbs
// @description   Adds thumbnails to the detailed view of StatCounter
// @include       http://*.statcounter.com/project/standard/*
// ==/UserScript==


// Update on Aug 11, 200 by John Friend
// Modified script so it works with any domain, including custom domains
// Added support for image Keys so it works with new galleries that required image Keys
// Added support for a number of addition URL formats that didn't previously work
// Added a thumbnail display for URLs that only have a gallery ID and key in them (and made them left aligned to distinguish them)
// Removed support for URLs that do not have an imageKey in them (they would only work on old galleries anyway)
// Added support for date query URLs that have an imageID and imageKey
// Combined popular, date and keyword regEx into one common expression



//--------------------------------------------------------------------------------
function getElementsByClass(searchClass,node,tag) {
  var classElements = new Array();
  if (node == null)
    node = document;
  if (tag == null)
    tag = '*';
  var els = node.getElementsByTagName(tag);
  var elsLen = els.length;
  var pattern = new RegExp("(^|\\s)"+searchClass+"(\\s|$)");
  for (i = 0, j = 0; i < elsLen; i++) {
    if (pattern.test(els[i].className) ) {
      classElements[j] = els[i];
      j++;
    }
  }
  return classElements;
}


//--------------------------------------------------------------------------------
var imgRegExp = new RegExp('(^[^/]+/)(?:gallery/[0-9]+_[0-9a-zA-Z]+(?:#|/[0-9]+/)([0-9]+_[0-9a-zA-Z]+)|(?:popular|date|keyword)/.*(?:#|/)([0-9]+_[0-9a-zA-Z]+)(?:(?:/|\-)[A-Za-z\-]+)*$)');
var galleryRegExp = new RegExp('(^[^/]+/)(?:gallery(/[0-9]+_[0-9a-zA-Z]+)(?:$|#P[\-0-9]+$))');

var cells = getElementsByClass( 'tableContent1Left|tableContent2Left' );
for( i=2; i<cells.length; i+=3 ) {
   var links = cells[i].getElementsByTagName('a');
   var link = links?((links.length>1)?links[1]:links[0]):null;
   if( link ) {
      var imgID = imgRegExp.exec( link.textContent );
      if (!imgID) {
          imgID = galleryRegExp.exec( link.textContent );
      }
      if( imgID ) {
         var host = imgID[1];
         // get the first match from the array that isn't null
         var ID = imgID[2]?imgID[2]:imgID[3];
         var ID = ID?ID:imgID[4];
         if (ID) {
           host = imgID[1];
           var thumb = document.createElement('img');
           // if ID starts with a / char, then it's a gallery ID
           if (ID.substr(0,1) == "/") {
               ID = ID.substr(1);                // remove leading slash
               var splitStr = ID.split("_");     // split id and key apart
               thumb.setAttribute( 'src', 'http://' + host + 'photos/random.mg?AlbumID=' + splitStr[0] + '&Size=Tiny&AlbumKey=' + splitStr[1] + '&rand=1');
               thumb.setAttribute( 'align', 'left' );
           } else {
               thumb.setAttribute( 'src', 'http://'+host+'photos/'+ID+'-Ti.jpg');
               thumb.setAttribute( 'align', 'right' );
           }
           thumb.setAttribute( 'border', '0' );
           thumb.setAttribute( 'alt', '' );
           var img = cells[i].getElementsByTagName('img');
           if( img && img[0] ) cells[i].removeChild( img[0] );
           cells[i].appendChild( thumb );
        }
      }
   }
}

// sub-expressions
// 342986767_gsLLX                                    [0-9]+_[0-9a-zA-Z]+                                                   // image ID and key
// 342986767_gsLLX at end                             ([0-9]+_[0-9a-zA-Z]+)$                                                // image ID and key at end of the URL
// http://jfriend.smugmug.com/                        ^http://[^/]+/                                                        // http://domain
// jfriend.smugmug.com/                               ^[^/]+/                                                               // domain
// gallery/5589651_rU4bA                              gallery/[0-9]+_[0-9a-zA-Z]+                                           // gallery number
// gallery/5589651_rU4bA/1/342986767_gsLLX            or
// gallery/5589651_rU4bA/3/342986476_YYeu6/Medium     or
// gallery/5589651_rU4bA#342971777_3GE8Q              or
// gallery/5589651_rU4bA#342992308_jm3Wg-A-LB         or
// gallery/879690_N8UHS/2/66770280_dRonw#P-2-25       gallery/[0-9]+_[0-9a-zA-Z]+(?:#|/[0-9]+/)([0-9]+_[0-9a-zA-Z]+)        // gallery/gallery_number imageID_imageKey
// gallery/5589651_rU4bA#P-4-12                       gallery(/[0-9]+_[0-9a-zA-Z]+)#P[\-0-9]+$                              // just a gallery ID with gallery Key, we include leading slash on matched result so we can tell it's a gallery ID in the code
// gallery/5589651_rU4bA                              gallery(/[0-9]+_[0-9a-zA-Z]+)$

// Way to get random thumb for a gallery: http://jfriend.smugmug.com/photos/random.mg?AlbumID=5646334&Size=Tiny&AlbumKey=jFXoe&rand=1267


//Supported URL types:
// http://jfriend.smugmug.com/gallery/5589651_rU4bA/3/342986476_YYeu6/Medium
// http://jfriend.smugmug.com/gallery/5589651_rU4bA#342971777_3GE8Q
// http://jfriend.smugmug.com/gallery/5589651_rU4bA/1/342986767_gsLLX
// http://jfriend.smugmug.com/gallery/5589651_rU4bA#342992308_jm3Wg-A-LB
// http://jfriend.smugmug.com/gallery/879690_N8UHS/2/66770280_dRonw#P-2-25
// http://jfriend.smugmug.com/popular/#66768822_mLumi
// http://jfriend.smugmug.com/popular/1/66770280_dRonw#39934670_buaG8
// http://jfriend.smugmug.com/popular/8/66769006_dcwFT
// http://jfriend.smugmug.com/popular/1/66770280_dRonw/Large
// http://jfriend.smugmug.com/popular/#66769006_dcwFT-XL-LB
// http://www.moonriverphotography.com/date/2008-01-1/2008-12-1#245318676_gd5X5
// http://www.moonriverphotography.com/date/2008-01-1/2008-12-1#300157250_XXXTa-A-LB
// http://www.moonriverphotography.com/keyword/fine+art#342192111_dsYBa
// http://www.moonriverphotography.com/keyword/fine+art#2332717_QgjEK-A-LB
// http://jfriend.smugmug.com/gallery/5589651_rU4bA#P-4-12
 

// URL types that can't work except on old galleries because there's no image key
// http://jfriend.smugmug.com/gallery/5575096_C3nQ5#342362737
// http://jfriend.smugmug.com/popular/#66768822
 


// URL types that can't work because there's no imageID
// http://jfriend.smugmug.com/gallery/5589651_rU4bA/1
// http://jfriend.smugmug.com/gallery/5571152_5ARMa#P-6-12
// http://jfriend.smugmug.com/gallery/5589651_rU4bA
// http://jfriend.smugmug.com/Kenya
// http://jfriend.smugmug.com
// http://jfriend.smugmug.com/popular/#P-6-12
// http://www.moonriverphotography.com/keyword/fine+art#P-2-25
//

I haven't tried this with anyone else's StatCounter and SmugMug accounts, so if you do use it and find any problems, or just want to give it a thumbs-up, please respond to this thread.
Enjoy!

Very cool, works fine I just changed the include link to work for my pages.



Any chance you can get it to work with the links to the singleImage style and keywords as well?

Originally Posted by ivar Very cool, works fine I just changed the include link to work for my pages.

Ok, where's this include link and how do we apply it?

Wow! That's realy neat Nimai. Thanks.

You shouldn't need to change anything. I tried to avoid any specific reference to my SmugMug account in the script, except for the namespace, which I think is only used for unique-ification of scripts.
Glad to see there's some interest in this!

I'll reply here when I get popular and keyword links working too.

Some RegExp tweaks, and now it should work for popular and keyword hits too.

Code has been updated in the initial post. Thanks for the suggestion!

Originally Posted by Nimai You shouldn't need to change anything. I tried to avoid any specific reference to my SmugMug account in the script, except for the namespace, which I think is only used for unique-ification of scripts. Glad to see there's some interest in this!

I had to change the include from http://*.statcounter.com/project/standard/magnify.php?* to http://*.statcounter.com/project/standard/* to work. I don't have the magnify in my url? It may be because I have multiple projects set up?

Originally Posted by Nimai Some RegExp tweaks, and now it should work for popular and keyword hits too. Code has been updated in the initial post. Thanks for the suggestion!

popular
keywords

Originally Posted by ivar popular keywords

Haha- nice.

Well, I went ahead just now and changed the @include to take out the magnify. As for the keywords... Mine are showing up like this:

keyword/2007-cheerleading-hcms/1/200166550/Medium

I see your's are showing up with a # before the image id.

keyword/naples#109172182

I tried to make the RegExp accomodating of both, but I didn't have a #-style page to test against... I'll keep you posted.

ivar - could you try the code that's up there now? There was about a 60 second window when I first updated the code, then immediately found I needed to change something, and updated it again hoping maybe no one noticed. ;) Maybe you got it in that time!
I just tried the script with a URL from your gallery, and I got a thumb, so I'm hoping it works now.

Originally Posted by Nimai but I didn't have a #-style page to test against...

You should now

Originally Posted by Nimai ivar - could you try the code that's up there now? There was about a 60 second window when I first updated the code, then immediately found I needed to change something, and updated it again hoping maybe no one noticed. ;) Maybe you got it in that time! I just tried the script with a URL from your gallery, and I got a thumb, so I'm hoping it works now.

Nice work!

Guessing links in before adding js wil not have thumbs.
Waiting is hard.


And just updated to latest js.

Nope, none showing Ivar. Must be something I'm not doing.

Originally Posted by Allen Guessing links in before adding js wil not have thumbs. Waiting is hard. And just updated to latest js.

Greasemonkey

Originally Posted by ivar Greasemonkey

Guess I don't understand any of this, gota install it huh?

Edit: installed and enabled, now what? wait?

Originally Posted by Allen Guess I don't understand any of this, gota install it huh?

Yep, install it, it's a firefox addon.

It lives in tools menu.
Add a new script, use the above code

Originally Posted by ivar Yep, install it, it's a firefox addon. It lives in tools menu. Add a new script, use the above code

Oh! I put that in my js, not right? Need to add new GM user script?
Not sure how to do that.

Originally Posted by Allen Oh! I put that in my js, not right?

right, not right

Originally Posted by Allen Need to add new GM user script? Not sure how to do that.

In Firefox, Tools>Greasemonkey>New user script

The first time you may need to associate GM with a texteditor. Use notepad (windows) or texteditor (mac) or similar. It will automatically ask for this if I remember correctly.

Originally Posted by ivar right, not right In Firefox, Tools>Greasemonkey>New user script The first time you may need to associate GM with a texteditor. Use notepad (windows) or texteditor (mac) or similar. It will automatically ask for this if I remember correctly.

" associate GM with a texteditor" lost me

I assume I go to the statcounter page and pick "new user script" so it's
assocaited with that page or site? The magnifiy page or summary page?

The popup box has name, namespace, desc, includes (has SC site address) and exclude. Where's script go?

Originally Posted by Allen I assume I go to the statcounter page and pick "new user script" so it's assocaited with that page or site? The magnifiy page or summary page?

Nope, not needed, the idea is that it will only work for the pages that you specify under 'include'

Originally Posted by Allen The popup box has name, namespace, desc, includes (has SC site address) and exclude. Where's script go?

first enter all that stuff.

If you don't get a texteditor popping up, go to tools>greasmonkey>manage user scripts>edit