bookmarklet(s) in browser

bookmarklet.md

記錄一些自用的 bookmarklet scripts

Codepen details.js

// get codepen stats in `/pen/` & `/full/` page
/* globals fetch */
javascript: (function () {
  var dialogId = 'stat-dialog';
  var dialog = document.getElementById(dialogId);

  if (!dialog) {
    dialog = document.createElement('dialog');
    dialog.id = dialogId;
    dialog.style.position = 'fixed';
    dialog.style.top = '5em';
    dialog.style.left = '25em';
    dialog.style.right = 'auto';
    dialog.style.zIndex = '1000';
    dialog.style.width = 'auto';
    dialog.style.padding = '10px';
    dialog.onclick = () => {
      dialog.close();
    };
    document.body.appendChild(dialog);
  }

  fetch(window.location.href.replace(/(\/pen\/|\/full\/)/gi, '/details/'))
  .then((response) => response.text())
  .then((text) => {
    var doc = document.implementation.createHTMLDocument();
    doc.body.innerHTML = text;
    var stat = [].map.call(doc.querySelectorAll('#pen-stat-numbers li'), (li) => {
      return li.innerText.trim().replace(/\s+/g, ' ');
    }).join('<br>');

    dialog.innerHTML = stat;
    dialog.showModal();
  });
})();

getReTweetText.js

javascript:(() => {
  let title = document.title || '';
  let getContent = (query) => {
    return (document.querySelector(query) || {content: ''}).content;
  };
  let author = getContent('meta[name="author"]');
  let date = getContent('meta[name="date"]') || getContent('meta[property="article:published_time"]');
  let url = getContent('meta[property="twitter:url"]');
  if (!url) {
    url = document.querySelector('link[rel="canonical"]');
    url = url && url.href || document.location.href.split('?utm')[0];
  }

  let dialog = document.createElement('dialog');
  dialog.style.whiteSpace = 'pre';
  dialog.innerHTML = `${title}\nby ${author} ${date}\n${url}\n#f2etw`;
  dialog.onclick = () => {
    document.execCommand('SelectAll', false, null);
    document.execCommand('copy', false, null);
    dialog.close();
  };
  document.body.appendChild(dialog);
  dialog.showModal();
})();

outline.js

/* via: https://gist.github.com/addyosmani/fd3999ea7fce242756b1 */
javascript: (function () {
  [].forEach.call(document.querySelectorAll('*'), function (a) {
    a.style.outline = '1px solid #' + (~~(Math.random() * (1 << 24))).toString(16);
  });
}());

twitter-mobile-load-thumb.js

javascript: (() => {
  var allPics = [].slice.call(document.querySelectorAll('.has-expanded-path:not(.xx)'));

  allPics.forEach((pic) => {
    let path = pic.getAttribute('data-expanded-path').replace();
    let url = `https://mobile.twitter.com${path}`.match(/.+?status\/\d+/)[0];
    fetch(url).then((response) => {
      return response.text();
    })
    .then((html) => {
      var doc = document.implementation.createHTMLDocument();
      doc.body.innerHTML = html;
      /* normal picture & video thumb */
      var img = doc.body.querySelector('.CroppedPhoto-img, .VideoPreview-image');

      if (img && img.src) {
        pic.classList.add('xx');
        let _img = document.createElement('img');
        _img.style.display = 'block';
        /* :small | :orig | :large */
        _img.src = img.src + ':small';
        pic.appendChild(_img);
      }
    });
  });
})();

twitter-zh-tw.js

javascript: (function() {
  var setZhTW = function() {
    [].forEach.call(document.querySelectorAll('[data-dest-lang]'), function(i) {
      i.setAttribute('data-dest-lang', 'zh-tw');
    });
  };

  setZhTW();

  document.body.addEventListener('click', function(e) {
    if (e.target.classList.contains('translate-label')) {
      setZhTW();
    }
  });
})();

wecatch-auto-refresh.js

window.log = {};
const timeInterval = 5.5; // minute(s)
const filters = {
  '/B/': 'iv80+',
  '/G/': 'iv90+',
  '/W/': 'iv0',
  '/R/': 'iv100',
  '/349.': '醜醜魚',
  '/143.': '卡比獸',
  '/147.': '迷你龍',
  '/148.': '哈克龍',
  '/149.': '快龍',
  '/113.': '吉利蛋',
  '/242.': '幸福蛋',
  '/345.': '觸手百合',
};
var checkGoodItems = () => {
  var imgSrcs = [...document.querySelectorAll('img.leaflet-marker-icon')].map(i => i.src);

  var result = Object.keys(filters).reduce((all, f) => {
    all[f] = imgSrcs.filter(src => src.indexOf(f) !== -1);
    return all;
  }, {});

  var noticeStrings = Object.keys(result)
    .map(i => result[i].length ? `${filters[i]}: ${result[i].length}` : '')
    .filter(Boolean);

  if (noticeStrings.length) {
    let n = new Notification('', { body: noticeStrings.join('\n') });
    n.onshow = setTimeout(() => { n.close()}, 10000);
    n.onclick = () => {
      window.focus();
      n.close();
    };
  }

  window.log[new Date().toString()] = { noticeStrings, result };
};

let clickclick = () => {
  refreshBtn.click();
};

var checkLater = () => {
  // refreshBtn.click();
  setTimeout(checkGoodItems, 5000);
};

let refreshBtn = document.querySelector('#custom-control');
let refreshTimer;

refreshBtn.addEventListener('click', () => {
  if (refreshTimer) {
    window.clearTimeout(refreshTimer);
    refreshTimer = null;
  }

  checkLater();
  refreshTimer = setTimeout(clickclick, timeInterval * 60 * 1000);
});

youtube-m3u-maker.js

javascript:(() => {
  var m3u = {};
  m3u.header = '#EXTM3U\n# Playlist created by SMPlayer 16.1.0\n\n';
  m3u.list = [].map.call(document.querySelectorAll('.pl-video.yt-uix-tile:not([data-title="[已刪除的影片]"]):not([data-title="[私人影片]"]) .pl-video-title-link'), (a) => {
    return `#EXTINF:0,${a.textContent.trim()}\n${a.href}`;
  }).join('\n\n');

  /* create a link with download url */
  var a = document.createElement('a');
  a.style = 'display: none';
  var aFileParts = [m3u.header + m3u.list];
  var oMyBlob = new Blob(aFileParts, {type: 'text/plain'});
  var url = window.URL.createObjectURL(oMyBlob);
  a.href = url;
  a.download = `${document.title}.m3u`;

  /* append in DOM & trigger click */
  document.body.appendChild(a);
  a.click();

  /* disable URL & remove hidden link */
  window.URL.revokeObjectURL(url);
  a.remove();
})();

之後不更新了~
改移到 github repo 裡~
https://github.com/Rplus/bookmarklets