improve handling of contributors gravatars

Place the gravatars inside the links, so when active the gravatars still show. Also make the javascript idempotent, and handle the gravatar not existing.
metacpan · Sep 19, 2014 · b6ed077 · b6ed077
1 parent c73e9d1
commit b6ed077
Show file tree

Hide file tree

Showing 2 changed files with 26 additions and 16 deletions.
diff --git a/root/static/js/contributors.js b/root/static/js/contributors.js
@@ -10,22 +10,31 @@ $(function(){
             if ( typeof data.name == 'undefined' ) {
                 return;
             }
-            // TODO make this an :before pseudo-class
-            var gravatar = data.gravatar_url;
-            gravatar = gravatar.replace( 
-                "^https?://([a-z0-9.-]+\.)?gravatar\.com/",
-                "https://secure.gravatar.com/",
-                "i"
-            ).replace(
-                /s=\d+/,
-                's=20'
-            );
-            var $img = $('<img />').attr( 'src', gravatar )
-                .attr( 'width', 20 )
-                .attr( 'height', 20 );
+            $anchor.attr( 'data-cpan-author', data.pauseid );
+            $anchor.attr( 'href', '/author/' + data.pauseid );
             $anchor.text( data.name );
-            $anchor.parent().addClass('gravatar');
-            $anchor.before( $img );
+
+            var gravatar = data.gravatar_url;
+            if (gravatar) {
+                gravatar = gravatar.replace(
+                    "^https?://([a-z0-9.-]+\.)?gravatar\.com/",
+                    "https://secure.gravatar.com/",
+                    "i"
+                ).replace(
+                    /s=\d+/,
+                    's=20'
+                );
+
+                var $img = $anchor.find('img.gravatar');
+                if (!$img.length) {
+                    $img = $('<img />')
+                        .attr( 'width', 20 )
+                        .attr( 'height', 20 );
+                    $anchor.prepend( $img );
+                }
+                $img.addClass( 'gravatar' );
+                $img.attr( 'src', gravatar )
+            }
         });
     });
 });
diff --git a/root/static/less/global.less b/root/static/less/global.less
@@ -255,8 +255,9 @@ ul {
         position: relative;
         text-align: left;
         padding-left: 22px;
+        min-height: 20px;
 
-        &.gravatar img {
+        img.gravatar {
             left: 0;
             position: absolute;
         }