Bookmarklets from Borom

[Let] はてなブログ用ASIN記法取得

Borom — 2015-01-13T06:52:41Z

/*
 * @title はてなブログ用ASIN記法取得
 * @description Amazon.co.jp商品ページではてなブログ用のASIN記法を取得する。
 * @include http://*.amazon.*
 * @license MIT License
 */

$(function (){
  $("td.label").each(function () {
    var $elem = $(this);
    var asinString = "[asin:";
    if( $elem.text() === "ASIN" ){
      asinString += $elem.next().text();
      asinString += ":detail]";
      prompt("ASIN記法取得", asinString);
      return false;
    }
  });
});

[Let] HaikuImagePopup

Borom — 2014-09-21T16:16:42Z

HaikuImagePopup

/*
 * @title HaikuImagePopup
 * @description はてなハイクの画像をポップアップ（オーバーレイ）表示に変更
 * @include http://h.hatena.ne.jp/*
 * @license MIT License
 * @require http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js
 */
/* 
    これは、はてなハイク（http://h.hatena.ne.jp/）にアップロードされたイメージを、
    オーバーレイ表示に切り替えて拡大表示しやすくするブックマークレットです。

    既知の不具合
    - ハイク・スクリプト読み込み完了前に画像をクリックすると普通にページ遷移してしまう
    - 大きい画像を開くと見切れてしまう
    - Safari for iPhoneで影をタップしても閉じられない

    今後の修正予定
    - 大きい画像を開いた場合、最大サイズをウィンドウサイズ基準で表示
    - カーソルキーやナビゲーションボタンなどで連続して画像を切り替えられるようにしたい

    ver.0.0.2 (2014年9月22日)
    0.0.1を破棄、jQueryプラグイン方式で書き直し
    シャドウまたはEscキーで終了出来るようにした

    ver.0.0.1 (2014年9月22日)
    プロトタイプ公開

*/



 // プラグイン部分
(function ( $ ){
  $.fn.haikuImagePopup = function ( imgSrc, options ) {
    // オプション設定
    var settings = $.extend({}, {
      // デフォルトパラメータ指定
      openAnimation: false,
      closeAnimation: true,

      shadowName: "let-overlay-shadow",
      shadowZIndex: 99998,
      shadowOpacity: 0.6,
      shadowColor: "#999",

      contentName: "let-overlay-content",
      contentClassName: "let-overlay",
      contentZIndex: 99999,
      contentColor: "#fff",
      contentRadius: "10px",
      contentWidth: 400,
      contentHeight: 300,

      disableShadowStyle: false,
      disableContentStyle: false,

      closeButtonClassName: "let-close",
    }, options);


    // プラグイン動作の記述


    // オーバーレイ生成処理
    if( !$("." + settings.contentClassName ).length){
      createOverlay(imgSrc, settings);
    }

    // オーバーレイ削除処理
    $(document).on("keydown", "body", function( e ){
      if( e.keyCode == 27 ) {
        removeOverlay( settings.contentClassName );
      }
    });

    // ウィンドウリサイズ時のサイズ・位置調整
    var windowTimer = false;
    $(window).resize(function(){
      if ( windowTimer !== false) {
        clearTimeout ( windowTimer );
      }
      windowTimer = setTimeout(function() {
        restyleContent( settings );
      },200);
    });


    $(document).on("click", "#" + settings.shadowName + " , ." + settings.closeButtonClassName , function() {
      removeOverlay( settings.contentClassName );
    });


    // -------------------------------------------------------
    // オーバーレイ生成関数
    function createOverlay ( imgURL, param ){
      // 生成用HTMLテキスト
      var htmlShadow = "<div id=\"" + param.shadowName + "\" class=\"" + param.contentClassName + "\"></div>";
      var htmlContent = "<div id=\"" + param.contentName + "\" class=\"" + param.contentClassName + "\"><img src=\"" + imgURL + "\"> " +  "</div>";
      var htmlOverlay = htmlShadow + htmlContent;

      var windowSize = {
        height: 0,
        width: 0,
      };
      var contentSize = {
        height: 0,
        width: 0,
      };

      windowSize.width = $(window).width();
      windowSize.height = $(window).height();



      // ウィンドウ幅が指定コンテンツサイズ未満だった場合、
      // コンテンツ幅をウィンドウ幅-40に指定
      if (windowSize.width < param.contentWidth){
        contentSize.width = windowSize.width - 40;
      } else {
        contentSize.width = param.contentWidth;
      }

      var contentPosition = {
        top: 10,
        left: 10,
      }

      // ウィンドウ高さが指定コンテンツサイズ以下だった場合、
      // コンテンツ高さをウィンドウ幅-40に指定
      if (windowSize.height < param.contentHeight){
        contentSize.height = windowSize.height - 40;
      } else {
        contentSize.height = param.contentHeight;
      }

      var cssSettings = {
        shadow: {
          background: param.shadowColor,
          opacity: param.shadowOpacity,
          position: "fixed",
          top: 0,
          left: 0,
          width: "100%",
          height: "100%",
          zIndex: param.shadowZIndex,
        }, 
        content : {
          background: param.contentColor,
          borderRadius: param.contentRadius,
          position: "fixed",
          top: contentPosition.top,
          left: contentPosition.left,
          zIndex: param.contentZIndex,
        }
      };
      cssSettings.content = $.extend( cssSettings.content, getContentSize(param) );

      // body 末尾にオーバーレイ用HTMLを追加
      $("body").append(htmlOverlay);

      // シャドウ・コンテンツの各オブジェクト取得
      var elemShadow = $("#" + param.shadowName);
      var elemContent = $("#" + param.contentName);

      // シャドウのCSS指定
      if(!param.disableShadowStyle){
        elemShadow.css(cssSettings.shadow);
      }
      // コンテンツのCSS指定
      if(!param.disableContentStyle){
        elemContent.css(cssSettings.content);
      }

    };
    // -------------------------------------------------------

    // コンテンツ領域の再描画関数
    // リサイズとポジション修正を行う
    function restyleContent ( param ){
      var elemContent = $( "#" + param.contentName );
      var fixSize = getContentSize( param );
      elemContent.css(fixSize);
      return false;
    }
    // -------------------------------------------------------

    // オーバーレイ削除関数
    function removeOverlay( overlayClass ) {
      $("." + overlayClass).remove();
      return false;
    };
    // -------------------------------------------------------

    // サイズ・ポジション取得関数
    function getContentSize ( param ){
      var fixSize = {
        width: 0,
        height: 0,
        top: 0,
        left: 0
      }
      var elemWindow = $(window);
      var elemContent = $("#" + param.contentName);
      var windowSize = {
        width: elemWindow.width(),
        height: elemWindow.height()
      }

      // コンテンツ領域サイズ指定
      if(windowSize.width < param.contentWidth){
        fixSize.width = windowSize.width - 40;
      } else {
        fixSize.width = param.contentWidth;
      }
      if(windowSize.height < param.contentHeight){
        fixSize.height = windowSize.height - 40;
      } else {
        fixSize.height = param.contentHeight;
      }

      // ポジション修正
      fixSize.left = Math.floor((windowSize.width - fixSize.width) /2);
      fixSize.top = Math.floor((windowSize.height - fixSize.height) / 2);

      return fixSize;
    }
    // -------------------------------------------------------

  };
}( jQuery ) );


// 実行
$(function(){
  $(document).on("click",".entry-body-content a img",function(){
    var sourceURL = $(this);
    var imgOrigin = new Image();
    imgOrigin.src = sourceURL.attr('src');
    var sourceImageSize = {
      width: imgOrigin.width,
      height: imgOrigin.height,
    }
    
    $().haikuImagePopup(imgOrigin.src,{
      contentWidth: sourceImageSize.width,
      contentHeight: sourceImageSize.height
    });
    return false;
  });
});

[Let] OverlayTemplate

Borom — 2014-09-21T15:31:07Z

OverlayTemplate

/*
 * @title OverlayTemplate
 * @description オーバーレイ表示の基本テンプレート
 * @include http://*
 * @license MIT License
 * @require http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js
 */

// ToDo
// [ ] 表示・削除処理をフェードアウトに

 // プラグイン部分
(function ( $ ){
  $.fn.letOverlay = function ( options ) {
    // オプション設定
    var settings = $.extend({}, {
      // デフォルトパラメータ指定
      openAnimation: false,
      closeAnimation: true,

      shadowName: "let-overlay-shadow",
      shadowZIndex: 99998,
      shadowOpacity: 0.6,
      shadowColor: "#999",

      contentName: "let-overlay-content",
      contentClassName: "let-overlay",
      contentZIndex: 99999,
      contentColor: "#fff",
      contentRadius: "10px",
      contentWidth: 400,
      contentHeight: 300,

      disableShadowStyle: false,
      disableContentStyle: false,

      closeButtonClassName: "let-close",
    }, options);


    // プラグイン動作の記述


    // オーバーレイ生成処理
    if( !$("." + settings.contentClassName ).length){
      createOverlay(settings);
    }

    // オーバーレイ削除処理
    $(document).on("keydown", "body", function( e ){
      if( e.keyCode == 27 ) {
        removeOverlay( settings.contentClassName );
      }
    });

    // ウィンドウリサイズ時のサイズ・位置調整
    var windowTimer = false;
    $(window).resize(function(){
      if ( windowTimer !== false) {
        clearTimeout ( windowTimer );
      }
      windowTimer = setTimeout(function() {
        restyleContent( settings );
      },200);
    });


    $(document).on("click", "#" + settings.shadowName + " , ." + settings.closeButtonClassName , function() {
      removeOverlay( settings.contentClassName );
    });


    // -------------------------------------------------------
    // オーバーレイ生成関数
    function createOverlay ( param ){
      // 生成用HTMLテキスト
      var htmlShadow = "<div id=\"" + param.shadowName + "\" class=\"" + param.contentClassName + "\"></div>";
      var htmlContent = "<div id=\"" + param.contentName + "\" class=\"" + param.contentClassName + "\"></div>";
      var htmlOverlay = htmlShadow + htmlContent;

      var windowSize = {
        height: 0,
        width: 0,
      };
      var contentSize = {
        height: 0,
        width: 0,
      };

      windowSize.width = $(window).width();
      windowSize.height = $(window).height();



      // ウィンドウ幅が指定コンテンツサイズ未満だった場合、
      // コンテンツ幅をウィンドウ幅-40に指定
      if (windowSize.width < param.contentWidth){
        contentSize.width = windowSize.width - 40;
      } else {
        contentSize.width = param.contentWidth;
      }

      var contentPosition = {
        top: 10,
        left: 10,
      }

      // ウィンドウ高さが指定コンテンツサイズ以下だった場合、
      // コンテンツ高さをウィンドウ幅-40に指定
      if (windowSize.height < param.contentHeight){
        contentSize.height = windowSize.height - 40;
      } else {
        contentSize.height = param.contentHeight;
      }

      var cssSettings = {
        shadow: {
          background: param.shadowColor,
          opacity: param.shadowOpacity,
          position: "fixed",
          top: 0,
          left: 0,
          width: "100%",
          height: "100%",
          zIndex: param.shadowZIndex,
        }, 
        content : {
          background: param.contentColor,
          borderRadius: param.contentRadius,
          position: "fixed",
          top: contentPosition.top,
          left: contentPosition.left,
          zIndex: param.contentZIndex,
        }
      };
      cssSettings.content = $.extend( cssSettings.content, getContentSize(param) );

      // body 末尾にオーバーレイ用HTMLを追加
      $("body").append(htmlOverlay);

      // シャドウ・コンテンツの各オブジェクト取得
      var elemShadow = $("#" + param.shadowName);
      var elemContent = $("#" + param.contentName);

      // シャドウのCSS指定
      if(!param.disableShadowStyle){
        elemShadow.css(cssSettings.shadow);
      }
      // コンテンツのCSS指定
      if(!param.disableContentStyle){
        elemContent.css(cssSettings.content);
      }

    };
    // -------------------------------------------------------

    // コンテンツ領域の再描画関数
    // リサイズとポジション修正を行う
    function restyleContent ( param ){
      var elemContent = $( "#" + param.contentName );
      var fixSize = getContentSize( param );
      elemContent.css(fixSize);
      return false;
    }
    // -------------------------------------------------------

    // オーバーレイ削除関数
    function removeOverlay( overlayClass ) {
      $("." + overlayClass).remove();
      return false;
    };
    // -------------------------------------------------------

    // サイズ・ポジション取得関数
    function getContentSize ( param ){
      var fixSize = {
        width: 0,
        height: 0,
        top: 0,
        left: 0
      }
      var elemWindow = $(window);
      var elemContent = $("#" + param.contentName);
      var windowSize = {
        width: elemWindow.width(),
        height: elemWindow.height()
      }

      // コンテンツ領域サイズ指定
      if(windowSize.width < param.contentWidth){
        fixSize.width = windowSize.width - 40;
      } else {
        fixSize.width = param.contentWidth;
      }
      if(windowSize.height < param.contentHeight){
        fixSize.height = windowSize.height - 40;
      } else {
        fixSize.height = param.contentHeight;
      }

      // ポジション修正
      fixSize.left = Math.floor((windowSize.width - fixSize.width) /2);
      fixSize.top = Math.floor((windowSize.height - fixSize.height) / 2);

      return fixSize;
    }
    // -------------------------------------------------------

  };
}( jQuery ) );


// 実行
$(function(){
  $().letOverlay({
    contentWidth: 800,
    contentHeight: 600,
    disableContentStyle: false,
    disableShadowStyle: false,
  });
});

[Let] markdownurl

Borom — 2014-09-11T02:55:37Z

markdownurl

/*
 * @title markdownurl
 * @description 現在開いているページを、Markdownのリンク形式で取得できます。
 * @license MIT License
 * @require 
 */

prompt("コピーしてください","[" + document.title.replace("[","\\[").replace("]","\\]") + "](" +  document.location.href.replace("(","%28").replace(")","%29") + ")");