メタブ表示

    @@ -5,6 +5,7 @@ * @license MIT License * @require */ +//// (function(){ //////////////////////////////////////////////////////////// @@ -250,25 +251,8 @@ var domifyUsermetab = function(bm, entry){ var ph = doc.createElement('span'); - var user = bm.user; - reserveUserMetab(user, function(entry){ - if(!entry) return; - var a = doc.createElement('a'); - a.appendChild(doc.createTextNode(entry.count + ' users')); - a.className = 'metab-count'; - a.href = 'javascript:undefined;'; - a.target = null; - a.addEventListener('click', function(e){ - e.stopPropagation(); - e.preventDefault(); -console.log('click', user); - popupUserMetab(user); - }, false); - (function(){ - if(!ph.parentNode){ - setTimeout(arguments.callee, 100); - return; } - ph.parentNode.replaceChild(a, ph); })(); }); + ph.className = 'user-metab-ph'; + ph.setAttribute('title', bm.user); return ph;}; var domifyTags = function(bm){ @@ -469,6 +453,31 @@ var addBehaviors = function(node){ if(! node.tagName) return node; addStars(node); + forEach(node.querySelectorAll('span.user-metab-ph'), function(ph){ + var user = ph.getAttribute('title'); + reserveUserMetab(user, function(entry){ + if(!entry){ + if(ph.parentNode) ph.parentNode.removeChild(ph); + return; + } + var a = doc.createElement('a'); + a.appendChild(doc.createTextNode(entry.count + ' users')); + a.className = 'metab-count'; + a.href = 'javascript:undefined;'; + a.addEventListener('click', function(e){ + e.stopPropagation(); + e.preventDefault(); + popupUserMetab(user); + }, false); + (function(){ + if(!ph.parentNode){ + setTimeout(arguments.callee, 100); + return; } + //console.log(user, '<-', ph.parentNode, a); + //ph.appendChild(a); + ph.parentNode.replaceChild(a, ph); + })(); }); + }); return node;}; @@ -608,23 +617,37 @@ var updateStarBehavior = function(n){ var a = n.parentNode; if(String(a.tagName).toLowerCase() != 'a') return; - n.style.border = 'solid rgba(0,0,0,0.5) 1px'; - n.style.borderRadius = '6px'; - n.style.width = '16px'; - n.style.height = '16px'; + n.style.width = '8px'; + n.style.height = '8px'; var user = (function(m){return m[1];})(a.href.match(/([^\/]*)\/?$/)); - n.src = profileIconUrl(user); - reserveUserMetab(user, function(entry){ + a.style.borderRadius = '6px'; + a.style.border = 'solid rgba(0,0,0,0.5) 3px'; + a.style.margin = '1px'; + a.style.display = 'inline-block'; + a.style.width = '24px'; + a.style.height = '24px'; + a.style.backgroundSize = '24px 24px'; + a.style.backgroundImage = 'url('+profileIconUrl(user)+')'; + reserveUserMetab( user, function(entry){ if(entry){ - n.style.borderColor = 'rgba(255,0,0,0.5)'; + a.style.borderColor = 'rgba(255,0,0,0.5)'; a.addEventListener('click', function(ev){ ev.stopPropagation(); ev.preventDefault(); popupUserMetab(user);}, false);} else{ - n.style.border = null;}});}; + a.style.border = null;}});}; + + var expandHatenaStar = function(n){ + n.dispatchEvent(new win.MouseEvent('click'));}; //////////////////////////////////////////////////////////// + var classnameActions = { + 'profile-icon': showCommentMetab, + 'hatena-star-inner-count': expandHatenaStar, + 'hatena-star-star': updateStarBehavior + }; + var observeMutation = function(){ var modify = function(n, selector, modifier){ if(n.className == selector) setTimeout(function(){modifier(n);},100); @@ -632,26 +655,22 @@ setTimeout(function(){modifier(n);}, 100);});}; var mo = new win.MutationObserver(function(ms){ms.forEach(function(m){ + var cn,act; switch(m.type){ case 'childList':{ forEach(m.addedNodes, function(n){ if(!n.tagName) return; - modify(n, '.profile-icon', showCommentMetab); - modify(n, '.hatena-star-star', updateStarBehavior);}); + for(cn in classnameActions){ + modify(n, '.'+cn, classnameActions[cn]);}}); break;} case 'attributes':{ var n = m.target, av; switch(m.attributeName){ case 'class':{ - switch(n.className){ - case 'profile-icon':{ - setTimeout(function(){showCommentMetab(n);},100); - break;} - case 'hatena-star-star':{ - updateStarBehavior(n); - break;} - default:{ - break;}} + for(cn in classnameActions){ + if(cn != n.className) continue; + setTimeout( function(){ + classnameActions[n.className].call(null,n);},100);} break;} default:{ break;}} @@ -669,20 +688,23 @@ //////////////////////////////////////////////////////////// var main = function(){ applyStyle(); - forEach(doc.querySelectorAll('a.profile-icon'), showCommentMetab); - forEach(doc.querySelectorAll('.hatena-star-star'), updateStarBehavior); + for(var cn in classnameActions) + forEach(doc.querySelectorAll('.'+cn), classnameActions[cn]); observeMutation(); }; - - if(typeof(win.GM_info) === 'undefined'){ main();}else{ - var src = '(' + arguments.callee.toSource() + ')();'; + var gm_main = function(field){ + var src = '(' + field.toSource() + ').call(this);'; var script = doc.createElement('script'); script.type = 'text/javascript'; script.appendChild(doc.createTextNode(src)); - doc.querySelector('head').appendChild(script);} + doc.querySelector('head').appendChild(script); }; + + if(typeof(win.GM_info) === 'undefined') main(); + else gm_main(arguments.callee); }).call(this); // Local Variables: // mode: hatena-let +// coding: utf-8-dos // End:
  • /*
     * @title メタブ表示
     * @description メタブ表示
     * @include http://b.hatena.ne.jp/*
     * @license MIT License
     * @require 
     */
    ////
    (function(){
    
      ////////////////////////////////////////////////////////////
      var win = this,
          doc = this.document,
          loc = this.location,
          con = this.console;
      var setTimeout = this.setTimeout;
    
      var DEBUG        = true;
    
      ////////////////////////////////////////////////////////////
    
      var HATEB_DOMAIN = "http://b.hatena.ne.jp";
      var API_DOMAIN   = "//b.hatena.ne.jp";
      var ICON_DOMAIN  = "http://cdn1.www.st-hatena.com/users/";
      var JSONP_MAX_BYTES = 1800;
      var LOADING_GIF     = HATEB_DOMAIN + '/images/loading.gif';
    
      ////////////////////////////////////////////////////////////
      var CSS = [
        '.metab-popup-locker {',
        '  position:   fixed;',
        '  top:        0px;',
        '  left:       0px;',
        '  width:      100%;',
        '  height:     100%;',
        '  z-index:    9000;',
        '  background: rgba(0,0,0,0.25);',
        '}',
        '.metab-popup {',
        '  height:        90%;',
        '  width:         600px;',
        '  margin:        2.5% auto;',
        '  padding:       10px;',
        '  border-radius: 20px;',
        '  overflow:      auto;',
        '  background:    #F8F8F8;',
        '}',
        '.metab-container {',
        '  margin:        5px;',
        '  padding:       5px;',
        '  border: solid   #9CF 1px;',
        '  border-radius: 10px;',
        '}',
        '.metab-container > .metab-title > .title{',
        '  display:   inline-block;',
        '  margin:    0px 10px 0px 0px;',
        '  font-size: 11px;',
        '  color:     #69F;',
        '}',
        '.metab-container > ul > li > span.head-part >  .metab-count, ',
        '.metab-container > .metab-title > .metab-count{',
        '  font-size:        10px;',
        '  font-weight:      900;',
        '  color:            #F00;',
        '  background-color: #FCC;',
        '  display:          inline-block;',
        '  text-decoration:  none;',
        '  line-height:      12px !important;',
        '  padding:          2px;',
        '  margin:           10px 0px;',
        '}',
        '.metab-container > .metab-title > .metab-count-detail{',
        '  display:   inline-block;',
        '  margin:    0px 10px;',
        '  font-size: 11px;',
        '  color:     rgb(153, 153, 153);',
        '}',
        '.metab-container > ul{',
        '  display: block;',
        '  margin: 0px;',
        '  padding: 0px;',
        '}',
        '.metab-container > ul > li{',
        '  margin:        0px;',
        '  padding:       11px 0px 11px 30px;',
        '  border-bottom: solid #CCC 1px;',
        '}',
        '.metab-container > ul.comments > li{',
        '  width:      auto !important;',
        '  display:    block;',
        '  list-style: none;',
        '}',
        '.metab-container > ul.no-comments > li{',
        ' width:      auto !important;',
        ' margin:     0px 11px 0px 0px;',
        ' border:     none;',
        ' list-style: none;',
        ' display:    inline-block;',
        '}',
    
        '.metab-container > ul > li > span.head-part > a.profile-icon {',
        '  margin-left: -30px;',
        '}',
    
        '.metab-container > ul > li > span.head-part >  a.profile-icon > img{',
        '  width:  24px;',
        '  height: 24px;',
        '}',
    
        '.metab-container > ul > li > span.head-part >  a.username{',
        '  font-size: 12px;',
        '  display: inline-block;',
        '  margin:  0px 11px;',
        '}',
    
        '.metab-container > ul > li >  span.tags{',
        '  display: inline-block;',
        '  margin:  0px 11px 0px 0px;',
        '}',
    
        '.metab-container > ul > li > span.comment{',
        '  font-size: 12px;',
        '}',
    
        '.metab-container .user-comment-meta{',
        '  font-size: 11px;',
        '  color: rgb(153,153,153);',
        '}',
        '.metab-container a{',
        '  color: rgb(0, 143, 222);',
        '}',
        '.metab-container a.user-comment-link {',
        '  background-image: url("/images/v3/comment-link.png");',
        '  background-position: left center;',
        '  background-repeat: no-repeat;',
        '  background-size: 15px 15px;',
        '  color: rgb(153, 153, 153);',
        '  font-size: 11px;',
        '  font-weight: normal;',
        '  margin: 0 8px 0 -1px;',
        '  padding-left: 16px;',
        '  text-decoration: none;',
        '}',
        ''].join("\n");
    
      ////////////////////////////////////////////////////////////
      var PageType = ((function(pn){
        if(pn.match(/^\/entry\//)){
          if(pn.match(/^\/entry\/\d+\/comment\//)) return 'comment';
          return 'entry';}
        return 'other';
      })(String(loc.pathname)));
    
    
      ////////////////////////////////////////////////////////////
      
      var p = function p() {
        if ( !DEBUG ) return;
        con.log.apply(con, arguments);};
    
    
      var forEach = function forEach(a,f){
        if(!a) return;
        for (var i=0,l=a.length;i<l;i++){
          if(f(a[i]) === false) break;}};
    
      var gensym = (function(){
        var rnd = function(){return Math.floor(Math.random() * (1<<30)).toString(16);};
        var cnt = 0;
        var prefix = 'metabsym_' + Date.now().toString(16) + '_' + rnd() + '_';
        return function gensym(){ return prefix + (cnt++).toString(16); };})();
    
      var receiver = function receiver(cb){
        var name = gensym();
        win[name] = function(){
          delete win[name];
          cb.apply(this, arguments);};
        return name;};
    
    
      var jsonp = function jsonp(url, opt){
        var query = '';
        for(var f in opt){
          var v = opt[f];
          if(v instanceof Function) v = receiver(v);
          query += '&' + encodeURIComponent(f) + '=' + encodeURIComponent(v);}
        url += query.replace(/^./, url.match(/\?/) ? '&' : '?');
    
        var script = doc.createElement('script');
        script.src = url;
        script.type = 'text/javascript';
        doc.querySelector('head').appendChild(script);};
    
      ////////////////////////////////////////////////////////////
    
      var withHatena = function(cb){(function(){
        if(typeof(win.Hatena) === 'undefined'){
          setTimeout(arguments.callee, 100);
          return;}
        cb(win.Hatena);})();};
    
      var withStar = function(cb){
        withHatena(function(Hatena){(function(){
          if(typeof(Hatena.Star) === 'undefined'){
            setTimeout(arguments.callee, 100);
            return;}
          cb(Hatena.Star, Hatena);})();});};
    
      var withBookmark = function(cb){
        withHatena(function(Hatena){(function(){
          if(typeof(Hatena.Bookmark) == 'undefined'){
            setTimeout(arguments.callee, 100);
            return;}
          cb(Hatena.Bookmark, Hatena);})();});};
    
      ////////////////////////////////////////////////////////////
      var profileIconUrl = function(user){
        return ICON_DOMAIN + '/' + user.substring(0,2) + '/' + user +
          '/profile_l.gif'; };
    
      var profileIcon = function(user){
        var a  = doc.createElement('a');
        a.href      = HATEB_DOMAIN + '/' + user + '/';
        a.target    = '_blank';
        a.title     = user;
        a.className = 'profile-icon';
        var icon = doc.createElement('img');
        icon.src = profileIconUrl(user);
        icon.alt = user;
        a.appendChild(icon);
        return a; };
    
      ////////////////////////////////////////////////////////////
      var PageEid = (function(){
        var ucl = doc.querySelector('a.user-comment-link');
        if(!ucl) return null;
        return String(ucl.href).replace(/^\/entry\//,'').replace(/\/comments\/.*/,'');});
    
      var domifyIcon = function(bm){
        return profileIcon(bm.user);};
    
      var domifyUsername = function(bm, entry){
        var a  = doc.createElement('a');
        var date    = String(bm.timestamp).replace(/ .+$/,'').replace(/\//g,'');
        a.href      = '/' + bm.user + '/' + date + '#bookmark-' + entry.eid ;
        a.target    = '_blank';
        a.title     = bm.user;
        a.className = 'username';
        a.appendChild(doc.createTextNode(bm.user));
        return a;};
    
      var domifyUsermetab = function(bm, entry){
        var ph = doc.createElement('span');
        ph.className = 'user-metab-ph';
        ph.setAttribute('title', bm.user);
        return ph;};
    
      var domifyTags = function(bm){
        var tags = bm.tags || [];
        if(tags.length < 1) return doc.createDocumentFragment();
        var tagSpan = doc.createElement('span');
        tagSpan.className = 'tags';
        forEach(tags , function(tagName){
          var tagLink = doc.createElement('a');
          tagLink.className = 'user-tag';
          tagLink.href =
            HATEB_DOMAIN + '/' + bm.user + '/' + encodeURIComponent(tagName);
          tagLink.appendChild(doc.createTextNode(tagName));
          tagSpan.appendChild(tagLink);});
        return tagSpan;};
    
      var domifyComment = (function(){
    
        var reURL = (function(){
          var RE_HEX    = '%[a-fA-F0-9][a-fA-F0-9]';
          var RE_SCHEME = '[a-z]+:';
          var RE_CHAR   = '(?:[a-zA-Z0-9\-_\.]|' + RE_HEX + ')';
          var RE_STR    = RE_CHAR + '+';
          var RE_STR0   = RE_CHAR + '*';
          var RE_HOST   = RE_STR;
          var RE_PATH   = '(?:/(?:' + RE_STR + '/)*' + RE_STR0 + ')';
          var RE_QV     = RE_STR0 + '=' + RE_STR0;
          var RE_QUERY  = '(?:\\?(?:(?:' + RE_QV + '&)*'+RE_QV+')?|'+RE_QV+')';
          var RE_HASH   = '(?:#' + RE_STR0 + ')';
          var RE_URL    = 'https?://' + RE_HOST + RE_PATH +'?' +
                RE_QUERY + '?' + RE_HASH + '?';
          return  new RegExp('(.*?)(' + RE_URL + ')(.*)');
        })();
    
        return function(bm){
          var comment = bm.comment;
          var R = doc.createElement('span');
          R.className = 'comment';
          while(comment.length > 0){
            var match = comment.match(reURL);
            if(!match){
              if(comment.length > 0) R.appendChild(doc.createTextNode(comment));
              break;
            }
            var head = match[1];
            var url  = match[2];
            comment = match[3];
            if(head.length > 0) R.appendChild(doc.createTextNode(head));
            var a = doc.createElement('a');
            a.href = url;
            a.target = '_blank';
            a.appendChild(doc.createTextNode(url));
            R.appendChild(a);
          }
          return R;};})();
    
      var domifyMeta = function(bm, entry){
        var meta = doc.createElement('div');
        meta.className = 'user-comment-meta';
    
        var plink = doc.createElement('a');
        plink.className = 'user-comment-link';
        plink.href  = '/entry/' + entry.eid + '/comment/' + bm.user;
        plink.title = 'パーマリンク';
        plink.target = '_blank';
        plink.appendChild(doc.createTextNode('リンク'));
        meta.appendChild(plink);
    
        var tspan = doc.createElement('span');
        tspan.className = 'timestamp';
        tspan.appendChild(doc.createTextNode(bm.timestamp));
        meta.appendChild(tspan);
    
        var star = doc.createElement('span');
        star.className = 'hatena-bookmark-star';
        meta.appendChild(star);
        return meta;};
    
      var domifyCount = function(entry){
        var count = entry.count;
        var frgn = doc.createDocumentFragment();
        var a = doc.createElement('a');
        a.className = 'metab-count';
        a.href = entry.entry_url;
        a.target = "_blank";
        a.appendChild(doc.createTextNode(String(count) + " users"));
        frgn.appendChild(a);
        var bmc = (entry.bookmarks || []).length;
        if(count != bmc){
          var span = doc.createElement('span');
          span.className = 'metab-count-detail';
          span.appendChild(doc.createTextNode(String(bmc) + " comments + " +
                                              String(count - bmc)));
          frgn.appendChild(span);}
        return frgn;};
    
      var domifyBookmarks = function(entry){
        var node = doc.createDocumentFragment();
        if((entry.bookmarks || []).length < 1) return node;
        var comments   = doc.createElement('ul');
        comments.className = 'comments';
        var noComments = doc.createElement('ul');
        noComments.className = 'no-comments';
        forEach(entry.bookmarks, function(bm){
          var li = doc.createElement('li');
          li.className = 'metab';
          var headPart = doc.createElement('span');
          headPart.className = 'head-part';
          headPart.appendChild(domifyIcon(     bm, entry));
          headPart.appendChild(domifyUsername( bm, entry));
          headPart.appendChild(domifyUsermetab(bm, entry));
          li.appendChild(headPart);
          li.appendChild(domifyTags(    bm, entry));
          li.appendChild(domifyComment( bm, entry));
          li.appendChild(domifyMeta(    bm, entry));
          (String(bm.comment).length > 0 // || tags.length > 0
           ? comments : noComments).appendChild(li);});
        if(comments.firstChild)  node.appendChild(comments);
        if(noComments.firstChild) node.appendChild(noComments);
        return node;};
    
      var domifyTitle = function(entry, title){
        if(!(title && title.length > 0)) return doc.createDocumentFragment();
        var node = doc.createElement('div');
        node.className = 'metab-title';
        var tspan = doc.createElement('span');
        tspan.appendChild(doc.createTextNode(title));
        tspan.className = 'title';
        node.appendChild(tspan);
        node.appendChild(domifyCount(     entry));
        return node; };
    
      var domifyEntry = function(entry, title){
        if((entry || {count:0}).count < 1) return doc.createDocumentFragment();
        var node = doc.createElement('div');
        node.className = 'metab-container';
        node.appendChild(domifyTitle(entry, title));
        node.appendChild(domifyBookmarks( entry));
        return node;};
    
      var addStars = function(node){ withStar(function(Star, Hatena){
        var entries = [];
        forEach(node.querySelectorAll('li.metab') || [], function(li){
          var uri = li.querySelector('a.username').href;
          //        var uri = li.querySelector('a.user-comment-link').href;
          var sc = li.querySelector('.hatena-bookmark-star');
          var cc = doc.createElement('span');
          sc.parentNode.insertBefore(cc, sc);
          var earg = {
            entryNode:         li,
            uri:               uri,
            title:             Star.EntryLoader.scrapeTitle(li) || '',
            comment_container: cc,
            star_container:    sc};
          var e = new Star.Entry(earg);
          e.showButtons();
          entries.push(e);});
    
        //
        var receive = function(res){
          var entries_ = res.entries;
          var encodedUriToEntryInfoMap = {};
          if (!entries_) entries_ = [];
          forEach(entries_, function(entryInfo){
            if ( !entryInfo.uri ) return;
            var eURI = entryInfo.eURI;
            if ( !eURI ) eURI = entryInfo.eURI = encodeURIComponent( entryInfo.uri );
            encodedUriToEntryInfoMap[eURI] = entryInfo;});
          forEach(entries, function(e){
            if ( e.hasBoundToStarEntry() ) return;
            if ( !e.eURI ) e.eURI = encodeURIComponent(e.uri);
            var entryInfo = entryInfo = encodedUriToEntryInfoMap[e.eURI];
            if ( entryInfo ) e.bindStarEntry( entryInfo );
            if (typeof(e.can_comment) == 'undefined') e.setCanComment(res.can_comment);
            e.showStars();
            e.showCommentButton();});
          if (res.rks) {
            if (!Hatena.Visitor || typeof(Hatena.Visitor) == 'undefined') {
              Hatena.Visitor = {};}
            if (!Hatena.Visitor.RKS) {
              Hatena.Visitor.RKS = res.rks;}}
          Hatena.Star.User.RKS.ready(res.rks);};
    
        // getStarEntries
        (function(){
          if (!entries.length) return;
          var jsonpBase = Star.BaseURL.replace(
              /^http:/, Star.BaseURLProtocol) + 'entries.json?';
          var url = jsonpBase;
          for (var i = 0; i < entries.length; i++) {
            if (url.length > JSONP_MAX_BYTES) {
              jsonp(url, {callback: receive});
              url = jsonpBase;}
            url += 'uri=' + encodeURIComponent(entries[i].uri) + '&';}
          if (!Hatena.Visitor) url += 'timestamp=1';
          jsonp(url, {callback: receive});})();});};
    
      var addBehaviors = function(node){
        if(! node.tagName) return node;
        addStars(node);
        forEach(node.querySelectorAll('span.user-metab-ph'), function(ph){
          var user = ph.getAttribute('title');
          reserveUserMetab(user, function(entry){
            if(!entry){
              if(ph.parentNode) ph.parentNode.removeChild(ph);
              return;
            }
            var a = doc.createElement('a');
            a.appendChild(doc.createTextNode(entry.count + ' users'));
            a.className = 'metab-count';
            a.href = 'javascript:undefined;';
            a.addEventListener('click', function(e){
              e.stopPropagation();
              e.preventDefault();
              popupUserMetab(user);
            }, false);
            (function(){
              if(!ph.parentNode){
                setTimeout(arguments.callee, 100);
                return; }
              //console.log(user, '<-', ph.parentNode, a);
              //ph.appendChild(a);
              ph.parentNode.replaceChild(a, ph);
            })(); });
        });
        return node;};
    
    
      ////////////////////////////////////////////////////////////
      var metabToDOM, receivedMetab, reserveMetab;
    
      (function(){
        var entries = {};
    
        metabToDOM = function(entry, uri, title){
          var slot = entries[uri];
          var node = slot.dom || (slot.dom = node = domifyEntry(entry,title));
          return addBehaviors(node.cloneNode(true));};
    
        receivedMetab = function(entry, uri, title){
          var slot = entries[uri];
          slot.entry = entry || false;
          slot.cont.forEach(function(c){c(entry, uri, title);});};
    
        reserveMetab = function(uri, cont_, title_){
          var slot = (entries[uri] ||
                      (entries[uri] = {entry: null, cont:[], req: false}));
          var title = title_ || '';
          var cont = cont_ instanceof Function ? cont_ : (function(){
            var container = cont_;
            if(container.className == 'metab-popup'){
              var e = new Error();
              console.log(e.stack);
              throw e;
            }
            return function(entry){
              container.appendChild(metabToDOM(entry, uri, title));};})();
          if(slot.entry !== null){
            cont(slot.entry, uri, title);
            return; }
          slot.cont.push(cont || function(){});
          if(slot.req) return;
          slot.req = true;
          jsonp(API_DOMAIN + '/entry/jsonlite/',
                {url: uri,
                 callback: function(entry){receivedMetab(entry, uri, title);}});};})();
    
      var reserveUserMetab = function reserveUserMetab(user, cont_, title_){
        var uri = HATEB_DOMAIN + '/' + user + '/';
        var title = title_ ||  'metab for id:'+user;
        reserveMetab(uri, cont_, title);};
    
      ////////////////////////////////////////////////////////////
      var popupUserMetab = (function(){
        var popups = {};
        var locker = null;
        var makeLocker = function(){
          var div = doc.createElement('div');
          div.className = 'metab-popup-locker';
          div.addEventListener('click', function(e){
            if(e.target !== div) return;
            hidePopup();});
          return div;};
        var getLocker = function(){ return locker || (locker = makeLocker()); };
    
        var lockPage,
            unlockPage;
        (function(){
          var html = null,        body = null,
              cssTextHtml = null, cssTextBody = null;
          var init = function(){
            if(html) return;
            html = doc.querySelector('html');
            body = doc.body;
            cssTextHtml = html.style.cssText;
            cssTextBody = body.style.cssText;};
          lockPage = function(){
            init();
            html.style.cssText = 'overflow: hidden;';
            body.style.cssText = 'overflow: hidden;';};
          unlockPage = function(){
            init();
            html.style.cssText = cssTextHtml;
            body.style.cssText = cssTextBody;};})();
    
        var showLocker = function(){
          var locker = getLocker();
          lockPage();
          doc.body.appendChild(locker);
          return locker; };
        var hideLocker = function(){
          var locker = getLocker();
          unlockPage();
          doc.body.appendChild(locker);
          return locker;; };
    
        var makePopup = function(user){
          var popup = doc.createElement('div');
          popup.className = 'metab-popup';
          popup.appendChild(profileIcon(user));
          reserveUserMetab(user, function(entry, uri, title){
            var metabdom  = metabToDOM(entry, uri, title);
            if(!popup.querySelector('.metab-container')){
              popup.appendChild(metabdom);}});
          return popup; };
    
        var showPopup = function(popup){
          hidePopup();
          showLocker().appendChild(popup);};
    
        var hidePopup = function(){
          var locker = hideLocker();
          locker.innerHTML = '';
          locker.parentNode.removeChild(locker);};
    
        return function(user){
          var popup = popups[user] || (popups[user]=makePopup(user));
          showPopup(popup); };})();
        
    
      ////////////////////////////////////////////////////////////
    
      var applyStyle = function(){
        var style = doc.createElement('style');
        style.type = 'text/css';
        style.appendChild(doc.createTextNode(CSS));
        doc.querySelector('head').appendChild(style);};
    
    
      var showCommentMetab = function(n){
        if(PageType != 'entry') return;
        var nparent = n.parentNode;
        if(nparent.className == 'metab-popup') return;
        var cl = nparent.querySelector('a.user-comment-link');
        if(!cl) return;
        reserveMetab(cl.href, nparent, 'metab for this comment');
        var user = n.href.match(/([^\/]+)\/$/)[1];
        reserveUserMetab(user, nparent);};
    
    
      ////////////////////////////////////////////////////////////
      var updateStarBehavior = function(n){
        var a = n.parentNode;
        if(String(a.tagName).toLowerCase() != 'a') return;
        n.style.width   = '8px';
        n.style.height  = '8px';
        var user = (function(m){return m[1];})(a.href.match(/([^\/]*)\/?$/));
        a.style.borderRadius    = '6px';
        a.style.border          = 'solid rgba(0,0,0,0.5) 3px';
        a.style.margin          = '1px';
        a.style.display         = 'inline-block';
        a.style.width           = '24px';
        a.style.height          = '24px';
        a.style.backgroundSize  = '24px 24px';
        a.style.backgroundImage = 'url('+profileIconUrl(user)+')';
        reserveUserMetab( user, function(entry){
          if(entry){
            a.style.borderColor = 'rgba(255,0,0,0.5)';
            a.addEventListener('click', function(ev){
              ev.stopPropagation();
              ev.preventDefault();
              popupUserMetab(user);}, false);}
          else{
            a.style.border = null;}});};
    
      var expandHatenaStar = function(n){
        n.dispatchEvent(new win.MouseEvent('click'));};
    
      ////////////////////////////////////////////////////////////
      var classnameActions = {
        'profile-icon':            showCommentMetab,
        'hatena-star-inner-count': expandHatenaStar,
        'hatena-star-star':        updateStarBehavior
      };
    
      var observeMutation = function(){
        var modify = function(n, selector, modifier){
          if(n.className == selector) setTimeout(function(){modifier(n);},100);
          forEach(n.querySelectorAll(selector), function(n){
            setTimeout(function(){modifier(n);}, 100);});};
    
        var mo = new win.MutationObserver(function(ms){ms.forEach(function(m){
          var cn,act;
          switch(m.type){
          case 'childList':{
            forEach(m.addedNodes, function(n){
              if(!n.tagName) return;
              for(cn in classnameActions){
                modify(n, '.'+cn, classnameActions[cn]);}});
            break;}
          case 'attributes':{
            var n = m.target, av;
            switch(m.attributeName){
            case 'class':{
              for(cn in classnameActions){
                if(cn != n.className) continue;
                setTimeout( function(){
                  classnameActions[n.className].call(null,n);},100);}
              break;}
            default:{
              break;}}
            break;}
          default: {
            break;}}});});
        mo.observe(doc.body, {
          subtree: true,
          childList: true,
          attributes: true,
          attributeFilter: ['class']});};
    
    
    
      ////////////////////////////////////////////////////////////
      var main = function(){
        applyStyle();
        for(var cn in classnameActions)
          forEach(doc.querySelectorAll('.'+cn), classnameActions[cn]);
        observeMutation(); };
    
      var gm_main = function(field){
        var src = '(' + field.toSource() + ').call(this);';
        var script = doc.createElement('script');
        script.type = 'text/javascript';
        script.appendChild(doc.createTextNode(src));
        doc.querySelector('head').appendChild(script);  };
    
      if(typeof(win.GM_info) === 'undefined')    main();
      else                                    gm_main(arguments.callee);
    
    }).call(this);
    
    // Local Variables:
    // mode: hatena-let
    // coding: utf-8-dos
    // End:
    
  • Permalink
    このページへの個別リンクです。
    RAW
    書かれたコードへの直接のリンクです。
    Packed
    文字列が圧縮された書かれたコードへのリンクです。
    Userscript
    Greasemonkey 等で利用する場合の .user.js へのリンクです。
    Loader
    @require やソースコードが長い場合に多段ロードする Loader コミのコードへのリンクです。
    Metadata
    コード中にコメントで @xxx と書かれたメタデータの JSON です。

History

  1. 2016/08/15 20:22:44 - 2016-08-15
  2. 2016/08/02 21:43:13 - 2016-08-02
  3. 2016/07/11 19:41:45 - 2016-07-11
  4. 2016/07/11 06:44:39 - 2016-07-11
  5. 2016/07/11 03:34:28 - 2016-07-11
  6. 2016/07/11 03:12:04 - 2016-07-11
  7. 2016/07/11 02:59:16 - 2016-07-11
  8. 2016/07/03 09:28:27 - 2016-07-03
  9. 2016/07/02 06:31:25 - 2016-07-02
  10. 2016/07/01 10:22:11 - 2016-07-01
  11. 2016/06/28 10:16:34 - 2016-06-28
  12. 2016/06/27 09:43:45 - 2016-06-27
  13. 2016/06/27 09:41:26 - 2016-06-27
  14. 2016/06/25 17:14:17 - 2016-06-25
  15. 2016/06/18 13:39:29 - 2016-06-18
  16. 2016/06/18 10:40:52 - 2016-06-18
  17. 2016/06/17 06:47:34 - 2016-06-17