はてなブログのカスタマイズスクリプト

gistfile1.js

//
// はてなブログカスタマイズスクリプト
//
// 【作者】 S.F.
//
// 【機能】
//  ・ブログ記事の終わりにAdsenseバナー広告を最大3個表示する
//  ・サイドバーのモジュール表示をBootstrapのNavbarに変換して表示する
// 【制約】
//  ・このスクリプトを実行するにはHTMLヘッダに下記モジュールをインポートする必要がある
//  <link href="//maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css" rel="stylesheet">
//  <link rel="stylesheet" type="text/css" href="css/main.min.css" />
//  <script src="//ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
//  <script src="//maxcdn.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"></script>
//  ・すべてのサイドバーモジュールには対応していない。

$().ready(function () {

  // ヘッダーNavbar 作成

  var head =
    '<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-collapse">' +
      '<span class="sr-only">Toggle navigation</span>' +
      '<span class="icon-bar"></span>' +
      '<span class="icon-bar"></span>' +
      '<span class="icon-bar"></span>' +
    '</button>' +
    '<a class="navbar-brand" href="#">Menu</a>';

  // はてなブログモジュールの取得
  var dt = $('#box2 .hatena-module');

  var navdt = [];
  var navbar = $('<nav>', { 'role': 'navigation' })
    .addClass('navbar navbar-default navbar-fixed-top')
    .append(
        $('<div>').addClass('container').append(
          $('<div>').addClass('navbar-header').html(head)
        )
      .append(
        $('<div>', { 'id': 'bs-collapse' })
        .addClass('collapse navbar-collapse')
        .append($('<ul>').attr('id', 'nav-inner').addClass('nav navbar-nav'))
      )
    )
    .insertAfter('#blog-title');
  var mainMenu = $('#nav-inner');
  var menuParent = $('#bs-collapse');

  // $('<li>').addClass('dropdown')
  //   .append($('<a>',{'class':'dropdown-toggle','data-toggle':'dropdown','href':'#'}).html('Main <span class="caret"></span>'))
  //   .append(mainMenu)
  //   .appendTo('#nav-inner');

  dt.each(function () {
    var t = $(this);
    if (t.hasClass('hatena-module-profile')) {
      $('<li>')
        // プロフィール ////
        .append($('<a>', { 'href': 'http://profile.hatena.ne.jp/sfpgmr/', 'target': '_blank' }).text('Profile'))
        .appendTo(mainMenu);

    } else if (t.hasClass('hatena-module-search-box')) {

      // 検索ボックス ////
      var searchForm = t.children('.hatena-module-body').children('form');
      searchForm
        .children('.search-module-input')
        .addClass('form-control');
      searchForm
        .children('.search-module-button')
        .addClass('btn btn-default');

      searchForm
        .addClass('navbar-form navbar-right')
        .attr('role', 'search')
        .appendTo(menuParent);

    } else if (t.hasClass('hatena-module-recent-entries')) {

      // 最近のエントリ
      $('<li>').addClass('dropdown')
        .append($('<a>', { 'class': 'dropdown-toggle', 'data-toggle': 'dropdown', 'href': '#' }).html('Recent<span class="caret"></span>'))
        .append($('<ul>', { 'id': 'recent', 'class': 'dropdown-menu' }))
        .appendTo('#nav-inner');
      var recentDropDown = $('#recent');
      t.find('.recent-entries-item-inner').each(function () {
        recentDropDown.append($('<li>').append($(this).html()));
      });
    } else if (t.hasClass('hatena-module-category')) {
      // カテゴリ -------------
      $('<li>').addClass('dropdown')
        .append($('<a>', { 'class': 'dropdown-toggle', 'data-toggle': 'dropdown', 'href': '#' }).html('Category<span class="caret"></span>'))
        .append($('<ul>', { 'id': 'category', 'class': 'dropdown-menu' }))
        .appendTo('#nav-inner');
      var category = $('#category').css('overflow', 'auto').css('height', '400px');
      t.find('li').each(function () {
        category.append($('<li>').append($(this).html()));
      });
      // ---------------------
    } else if (t.hasClass('hatena-module-archive')) {
      console.log('aa');
      // 月別アーカイブ /////
      $('<li>').addClass('dropdown')
        .append($('<a>', { 'class': 'dropdown-toggle', 'data-toggle': 'dropdown', 'href': '#' }).html('Archive <span class="caret"></span>'))
        .append($('<ul>', { 'id': 'archive', 'class': 'dropdown-menu' }))
        .appendTo('#nav-inner');
      var archive = $('#archive').css('overflow', 'auto').css('max-height', '400px');
      $.ajax({
        type: 'get',
        url: Hatena.Diary.URLGenerator.user_blog_url('/archive_module'),
        dataType: 'html'
      }).done(function (r) {
        var res = $(r);
        res.find('.archive-module-year').each(function () {
          var yyyy = $(this);
          var yyyyHref = yyyy.find('.archive-module-year-title');
          archive.append($('<li>').append(yyyyHref));
/*          archive
            .append($('<li>')
            .addClass('dropdown')
            .append($('<a>', { 'class': 'dropdown-toggle', 'data-toggle': 'dropdown', 'href': '#' }).html(yyyyHref.text() + ' <span class="caret"></span>'))
            .append($('<ul>', { 'id': 'month-' + yyyy.attr('data-year'), 'class': 'dropdown-menu' })));
          var menuYM = $('#month-' + yyyy.attr('data-year'));*/
          yyyy.find('.archive-module-month-title').each(function () {
            var mm = $(this);
            archive.append($('<li>').append(mm.prepend('&nbsp;&nbsp;')));
          });
        });
      });
      t.children('.archive-module-year').each(function () {
        archive.append($('<li>').append($(this).children('.archive-module-button').html()));
      });
    } else if (t.hasClass('hatena-module-links')) {
      // リンク ////
      $('<li>').addClass('dropdown')
        .append($('<a>', { 'class': 'dropdown-toggle', 'data-toggle': 'dropdown', 'href': '#' }).html('Links <span class="caret"></span>'))
        .append($('<ul>', { 'id': 'links', 'class': 'dropdown-menu' }))
        .appendTo('#nav-inner');
      var links = $('#links').css('overflow', 'auto').css('max-height', '400px');
      t.find('.hatena-urllist li').each(function () {
        links.append($('<li>').append($(this).html()));
      });
    }
  });
});