地球ウォーカー2

Scala, Python の勉強日記

Googleの検索ボックスをページ上方に固定するGreasemonkey

Google検索結果ページで検索ボックスを固定するGreasemonkeyを作ってみた。
既に誰か作ってそうだけど、Greasemonkeyの勉強ということで。

機能

  • 検索ボックスの上方固定
    • ページの下方に移動すると検索ボックスがついてくる。
    • ページの上方に移動すると元に戻る。
  • 閾値(しきいち)設定
    • 閾値とは、「どれだけスクロールしたら検索ボックスを固定するか」の値。
    • デフォルトは2ページ目以降。
    • ユーザスクリプトコマンド「register threshold」で設定可能。
    • デフォルトに戻す場合、コマンドでブランクを入力する。

イメージ

初期状態
f:id:hysa:20090809230927j:image
検索ボックス固定状態
f:id:hysa:20090809230928j:image
閾値設定プロンプト
f:id:hysa:20090809230926j:image

ソース

ファイル名:FixSearchBox.user.js

// ==UserScript==
// @name Fix SearchBox
// @description fix search box on google search
// @namespace http://d.hatena.ne.jp/hysa/
// @include http://www.google.co.jp/search*
// ==/UserScript==
(function() {
  // Initialize
  var header = document.getElementById('header');
  header.style.top = '0';
  header.style.width = '100%';
  header.style.backgroundColor = '#FFFFFF';
  header.style.zIndex = '254';

  // Fix Header Element
  function fix() {
    header.style.position = 'fixed';
    header.style.borderBottom = '1px solid #6B90DA';
  }

  // Unfix Header Element
  function unfix() {
    header.style.position = 'static';
    header.style.borderBottom = '0';
  }

  var defaultValue = window.getComputedStyle(document.getElementById('res'), null).height.replace(/px/, '');
  var threshold = GM_getValue('threshold') || defaultValue;
  var currentPosition = document.documentElement;

  document.addEventListener('scroll',
                            function() {
                              if (currentPosition.scrollTop > threshold) fix();
                              else unfix();
                            }, false);

  // User Script Command
  GM_registerMenuCommand('Fixed SearchBox - register threshold',
                         function() {
                           var value = prompt('Current threshold is ' + threshold + 'px. \nregist new threshold.');
                           if (value && parseInt(value, 10)) {
                             threshold = value;
                           } else {
                             threshold = defaultValue;
                           }
                           GM_setValue('threshold', threshold);
                         });
})();