Redmine - チケットページの長くなりすぎたコメント履歴を省略する

はじめに

Redmineのチケットのコメント履歴が長すぎて困っていたので、
ページ表示時点では最新10件だけを表示するようなjsを書きました。

適用後のイメージ

設定

使用したプラグイン

view_customize(github)

このプラグインを使うとRedmineのsourceを変更せずに、動的にjavascriptを埋め込めるので使いました。
入ってない場合は、ページに直接埋め込むなどでもOK。

code

/// Path: `/issues/[^\/]+`
/// Redmine - チケットページの長くなりすぎたコメント履歴を省略する v2017.08.25
;$(function() {
  var journals = $('.journal');

  var do_hide = function (start, end) {
    var current_journals = journals.slice(start, end);
    var div = $('<div />', {
      css: {
        'overflow': 'auto',
        'padding-right': '5px',
      }
    });

    var on_style = function(hide) {
      div.empty();

      if (hide) {
        current_journals.hide();
        div.append(
          $('<div />', {
            css: {
              '-webkit-border-radius': '10px',
              'border': 'solid 2px #41719c',
              'background-color': '#dae3f3',
              'margin-bottom': '10px',
              'width': '100%',
              'text-align': 'center',
            }
          }).append(
            $('<p />', {
              text: '省略された履歴(#' + (start+1) + '〜#' + end + ')を表示する',
              css: {
                'color': '#717171',
                'cursor': 'pointer',
                'display': 'inline-block',
                'font-weight': 'bold',
              }
            }).on('click', function () {
              on_style(current_journals.first().is(':visible'));
            })
          )
        );
      }
      else {
        current_journals.show();

        div.append(
          $('<div />', {
            css: {
              'width': '100%',
              'text-align': 'center',
            }
          }).append(
            $('<p />', {
              text: 'ここまでの履歴を非表示にする',
              css: {
                'color': '#bbb',
                'cursor': 'pointer',
                'display': 'inline-block',
                'font-style': 'italic',
              }
            }).on('click', function () {
              on_style(current_journals.first().is(':visible'));
            })
          )
        );
      }
    }

    div.insertAfter(current_journals.last());
    on_style(true)
  };

  {
    var not_hidden_length  = 10;
    var all_hidden_length = journals.length - not_hidden_length;
    var block_length = 30;

    for (var i = 0 ; i < all_hidden_length ; i += block_length)
      do_hide(i, (all_hidden_length < i + block_length ? all_hidden_length : i + block_length));
  }
});

追記

2017.08.25 codeを修正：

• 再表示された箇所がぱっと見で分かり難かったので、フッターを付け、どこまで再表示されたか分かるようにした。
• ついでに表示On/Offをトグルできるようにした。
• あまりにも履歴が多い場合に備えて、（30件ごとに）小分けするようにした。