Google検索の結果にFacebookのシェア数を表示するブックマークレット

by laiso 2020-03-22 [2020/03/22 17:55:18]

同上

@@ -4,73 +4,69 @@
  * @include https://www.google.*
  * @license MIT License
  */
-(function(document){
 
-function queryIds(nodes, text) {
-  var n = nodes.pop();
-  var url = n.href.replace(/,/g, '%252C');
-  if (nodes.length == 0) {
-    var t = text + url;
-    var q = t.replace(/#/g, '%23').replace(/&/g, '%26').replace(/=/g, '%3D').replace(/\?/g, '%3F');
-    return q;
-  }
-
-  var t = text + url + ',';
-  return queryIds(nodes, t);
-}
+(function(global){
+  var document = global.document;
+
+  var nodes = Array.from(document.querySelectorAll('h3.r > a[onmousedown]'));
+  var ids = nodes.reduce((ids, node, i) => {
+    var t = ids + node.href.replace(/,/g, '%252C');;
+    if (i == nodes.length - 1) {
+      return t.replace(/#/g, '%23').replace(/&/g, '%26').replace(/=/g, '%3D').replace(/\?/g, '%3F');
+    }
+
+    return t + ',';
+  }, '');
 
-function loadJSONP(url) {
   var script = document.createElement('SCRIPT');
-  script.src = url;
+  script.src = 'https://graph.facebook.com/?ids='+ids+'&callback=callback';
   document.body.insertBefore(script, null);
-}
 
-function counter(info) {
-  var STYLE = "padding: 0 0.5em;\nmargin: 0 0.5em;\ncolor: #fff;\ntext-shadow: 0 1px 0 white;\nbackground-color: #4e69a2;\nfont-weight: bold;\ntext-decoration-line: none;";
-  var counter = document.createElement('A');
-  counter.setAttribute('style', STYLE);
-  if (info) {
-    counter.href = info.id;
-    counter.innerText = info.shares || 0;
-  } else {
-    counter.style.setProperty('background-color', '#FF1000');
-    counter.innerText = 'X';
-  }
-  
-  return counter;
-}
-
-function infoFrom(response, key){
-  var id = Object.keys(response).filter( (k) => {
-    return key.indexOf(k) > -1;
-  })[0];
-  return response[id];
-}
-
-window.callback = function(data){
-  if (data.error) {
-    alert('[FB]'+data.error.message);
-    return;
-  }
-
-  nodes.map((a) => {
-    let u; 
-    try {
-      u = decodeURIComponent(a.href); 
-    } catch (e){
-      u = a.href;
+  global.callback = function(data){
+    if (data.error) {
+      alert('[FB]'+data.error.message);
+      return;
+    }
+
+    nodes.map((a) => {
+      let u; 
+      try {
+        u = decodeURIComponent(a.href); 
+      } catch (e){
+        u = a.href;
+      }
+      var url = u.replace(/,/g, '\u00252C');
+      var info = infoFrom(data, url); 
+      var c = counter(info);
+      var parentNode = a.parentNode;
+      parentNode.style.setProperty('overflow', 'visible');
+      parentNode.appendChild(c);
+    });
+
+    function counter(info) {
+      var STYLE = "padding: 0 0.5em;\nmargin: 0 0.5em;\ncolor: #fff;\ntext-shadow: 0 1px 0 white;\nbackground-color: #4e69a2;\nfont-weight: bold;\ntext-decoration-line: none;";
+      var counter = document.createElement('A');
+      counter.setAttribute('style', STYLE);
+      if (info) {
+        counter.href = info.id;
+        counter.innerText = info.shares;
+        if (info.share){
+          counter.innerText = info.share.share_count;
+        }
+      } else {
+        counter.style.setProperty('background-color', '#FF1000');
+        counter.innerText = 'X';
+      }
+
+      return counter;
+    }
+
+    function infoFrom(response, key){
+      var id = Object.keys(response).filter( (k) => {
+        return key.indexOf(k) > -1;
+      })[0];
+      return response[id];
     }
-    var url = u.replace(/,/g, '\u00252C');
-    var info = infoFrom(data, url); 
-    var c = counter(info);
-    var parentNode = a.parentNode;
-    parentNode.style.setProperty('overflow', 'visible');
-    parentNode.appendChild(c);
-  });
-};
-
-var nodes = Array.from(document.querySelectorAll('h3.r > a[onmousedown]'));
-var ids = queryIds(nodes.slice(), "");
-loadJSONP('https://graph.facebook.com/?ids='+ids+'&callback=callback');
+  };
 
-})(document);
+})(window);

• /*
   * @title Google検索の結果にFacebookのシェア数を表示するブックマークレット
   * @description 同上
   * @include https://www.google.*
   * @license MIT License
   */
  
  (function(global){
    var document = global.document;
  
    var nodes = Array.from(document.querySelectorAll('h3.r > a[onmousedown]'));
    var ids = nodes.reduce((ids, node, i) => {
      var t = ids + node.href.replace(/,/g, '%252C');;
      if (i == nodes.length - 1) {
        return t.replace(/#/g, '%23').replace(/&/g, '%26').replace(/=/g, '%3D').replace(/\?/g, '%3F');
      }
  
      return t + ',';
    }, '');
  
    var script = document.createElement('SCRIPT');
    script.src = 'https://graph.facebook.com/?ids='+ids+'&callback=callback';
    document.body.insertBefore(script, null);
  
    global.callback = function(data){
      if (data.error) {
        alert('[FB]'+data.error.message);
        return;
      }
  
      nodes.map((a) => {
        let u; 
        try {
          u = decodeURIComponent(a.href); 
        } catch (e){
          u = a.href;
        }
        var url = u.replace(/,/g, '\u00252C');
        var info = infoFrom(data, url); 
        var c = counter(info);
        var parentNode = a.parentNode;
        parentNode.style.setProperty('overflow', 'visible');
        parentNode.appendChild(c);
      });
  
      function counter(info) {
        var STYLE = "padding: 0 0.5em;\nmargin: 0 0.5em;\ncolor: #fff;\ntext-shadow: 0 1px 0 white;\nbackground-color: #4e69a2;\nfont-weight: bold;\ntext-decoration-line: none;";
        var counter = document.createElement('A');
        counter.setAttribute('style', STYLE);
        if (info) {
          counter.href = info.id;
          counter.innerText = info.shares;
          if (info.share){
            counter.innerText = info.share.share_count;
          }
        } else {
          counter.style.setProperty('background-color', '#FF1000');
          counter.innerText = 'X';
        }
  
        return counter;
      }
  
      function infoFrom(response, key){
        var id = Object.keys(response).filter( (k) => {
          return key.indexOf(k) > -1;
        })[0];
        return response[id];
      }
    };
  
  })(window);

• Permalink RAW Packed Userscript LOADER Metadata ?

  Permalink

  このページへの個別リンクです。

  RAW

  書かれたコードへの直接のリンクです。

  Packed

  文字列が圧縮された書かれたコードへのリンクです。

  Userscript

  Greasemonkey 等で利用する場合の .user.js へのリンクです。

  Loader

  @require やソースコードが長い場合に多段ロードする Loader コミのコードへのリンクです。

  Metadata

  コード中にコメントで @xxx と書かれたメタデータの JSON です。