へっぽこプログラマーの備忘録

各ブラウザのタブ幅は 8 がデフォルトなので、ブラウザ上でソースコードを見るととても見づらかったりします。
GitHub でタブ幅を変える方法はいろいろ見つかりますが、GitLab でタブ幅を変える方法は意外と少なかったので記事にしてみました。

GitLab 側の設定を変更することでタブ幅を変更することもできるようですが、タブというのはただのインデントで、その幅がどのくらいかは個人で好きなように設定できるべきだと思うので、ここではブラウザのアドオンで変更する方法について述べます。

私が使用しているブラウザは Firefox ですので、Firefox で説明していますが、CSS の書き方自体は他のブラウザのアドオンにも適用できると思います。

使用するアドオン

Firefox では Stylish というアドオンがあるので、これを使います。

設定方法

アドオンをインストールしたら画面右上に Stylish のアイコンが表示されます。
アイコンをクリックし、「新しいスタイルを書く」からスタイルを作成します。

例えば、以下のようにスタイルを記述することで GitLab のタブ幅を変更できます。

@-moz-document url-prefix("http://example.com/") {
  code, .tab-content{
    -moz-tab-size: 4 !important;
    -webkit-tab-size: 4 !important;
    -o-tab-size: 4 !important;
    tab-size: 4 !important;
  }
}

書き方についての詳細はググってください。
code のタグはファイルを単体で表示したとき用に指定しています。
tab-content のクラスはマージリクエスト時など、ソースを差分表示したとき用に指定しています。
ここらへんは GitLab のページの HTML ソースを解析して割り出しましたが、もしかしたらもっと良い指定方法があるかもしれません。

参考URL

• http://qiita.com/sue738/items/c68bf768f4aa30e88682
• http://rosylilly.hatenablog.com/entry/2014/06/26/152913
• http://nekonenene.hatenablog.com/entry/2015/09/13/100819

※ Qiita にも投稿しています。

Jenkins 2 の Pipeline 機能を試してたのですが、bat コマンドを実行するといつまで経っても処理が終了しないという状況になってしまいました。
環境は Windows 7 で、Jenkins のバージョンは 2.33 です。
何かのプラグインが悪さをしているのかと思い、いろいろ試してみましたが、一向に原因がわからず、かなりはまりました。
しかし、結局は Pipeline に付けた名前に日本語が含まれていることが原因という、しょうもないオチでしたとさ。

Jenkins 2 で追加された　Pipeline の機能を使ってみようと思ったのですが、「新規ジョブ作成」を押しても Pipeline の項目がありません。
いろいろ悩みましたが、以下のようにして解決しました。

原因

Jenkins 2 を新規インストールしたのではなく、1.6 系から 2.0 系にバージョンアップしていたのが原因ではないかと。
Jenkins はバージョンアップ後もいつでも元のバージョンに戻せるようになっているため、Jenkins 2 以降でしか使用できない Pipeline がインストールされていないのだろうと推測します。

解決方法

手動で Pipeline をインストールします。

1. [Jenkinsの管理]>[プラグインの管理]を選択します。
2. 「利用可能」タブを選択し、「Pipeline」で検索します。
3. 「Pipeline」というプラグインが表示されるので、チェックを入れてインストールします。

基本的にはこれで OK だと思うのですが、私の環境ではプラグインインストール時にエラーがでました。
Jenkins のバージョンが 2.26 だったのですが、2.32 がリリースされていたので、一度 Pipeline をアンインストールし、Jenkins アップグレード後に再度 Pipeline をインストールしました。
今のところこれで一応動いています。

環境

• Windows 7
• Bitnami Redmine 3.3.0
• テキストの書式は Markdown を使用

現象

Redmine のテキストが記述できる箇所（例えばチケットの説明など）において、記述内容によっては Redmine が Internal Error となったり、最悪 Redmine が落ちたりします。
バグっぽいので、現状では以下の記述を行わないように注意するしかありません。
もしこのような状況になってしまったら、該当のページは開かずに直接編集ページへ移動して修正します。
例えばチケットであれば、チケットの画面は開かずに、チケットの一覧画面で該当のチケットを右クリックして「編集」を選択すれば、編集画面を開くことができます。

以下にエラーとなったパターンを紹介します。

外部リンクの記述

リンクテキストの後に URL を記述していなかった場合、エラーとなってしまいます。

• NGパターン

  [リンクテキスト]()

• OKパターン

  [リンクテキスト](http://hoge/)

メールアドレスの記述

Redmine ではメールアドレスを記述すると自動でリンクを作成してくれますが、以下のような記述をした場合、エラーとなってしまいます。

• NGパターン

  社員番号@example.com

• OKパターン（エラーにはならないが、リンクも貼られない）

  社員番号＋@example.com

Jenkins のジョブの設定内容を変更した際に、ビルドに失敗するようになってしまったときのために変更履歴を残しておくためのプラグインです。

インストール方法

1. Jenkins にログインします。
2. 「Jenkinsの管理」>「プラグインの管理」を選択します。
3. 「利用可能」タブを選択します。
4. フィルダーに「Job Configuration History Plugin」と入力して Enter を押します。
5. 「Job Configuration History Plugin」が表示されるはずなので、チェックを入れ、インストールを行います。

これでサイドバーに「設定の変更履歴」が表示されるようになります。

参考URL

• http://sustainablepace.okadatech.com/sustainablepace/android/開発環境/jenkins/Jenkinsのインストールと初期設定#i-6
• http://d.hatena.ne.jp/tyuki39/20110303/1299108685

Sphinx には only ディレクティブというのがあり、これを使用することで出力フォーマットに応じて処理を分けることができます。
これを使用し、以下のように出力フォーマットに応じて処理を分けてみます。

• HTML で出力する場合には SVG の画像を読み込む
• LaTeX 経由で PDF を出力する場合には分割された PNG の画像を読み込む

Sphinx のコードは以下のようになります。

.. only:: html

   .. image:: img/01.svg

.. only:: latex

   .. image:: img/01.png
   .. image:: img/01_001.png
   .. image:: img/01_002.png

うーん、面倒ですね。
他にも AutoImage という拡張もあるのですが、出力フォーマットに応じて読み込む画像を変えるということはできなさそうでした。

参考URL

• http://qiita.com/mas0061/items/ebae758ed82172d51351

PlantUML にはプリプロセッサの機能があり、C言語と同じように定数定義や ifdef などが使用できます。
これを使用し、以下のように出力フォーマットに応じて処理を分けてみます。

• PNG で出力する場合には newpage により画像を分割して出力する
• PNG 以外で出力する場合には画像を分割しない

定数の定義の仕方

PlantUML のコード上では、以下のように定義します。

!define _PROJECT_NAME_ ProjectName

また、コマンドライン引数でも定数は定義できます。

> plantuml.jar -DPNG="png" hoge.puml

-D が定数定義するオプションで、その後に続く文字が定義する文字列です。
つまり、上記は以下の定義と同じ意味です。

!define PNG "png"

これで、上記のようにコマンドライン引数で定数を定義しつつ、PlantUML 内のコードに以下のように記述すれば、PNG で出力するときのみ画像が分割されることになります。

!ifdef PNG
newpage
!endif

参考URL

• http://plantuml.com/preprocessing

Sphinx でドキュメントを作成する際、テーマを設定することができます。
デフォルトで用意されているテーマは一応全て試してみましたが、どれも気に入りませんでした。
なので、私はいつも Read the Docs のテーマ (sphinx_rtd_theme) を使用しています。
しかし、sphinx_rtd_theme にも気に入らない点がいくつかあります。

気に入らない点

見出しが分かりづらい

見出しのレベルによる違いが文字の大きさだけなので、どこが見出しの境目なのか分かりづらいと思います。
ちなみに Docker のドキュメントも sphinx_rtd_theme を使用していますが、こちらはカスタマイズされているようで、見出しにアンダーラインが引かれています。
これは分かりやすくなっていて良いと思います。

画面の横幅が固定されている

レスポンシブ対応のためか、sphinx_rtd_theme は PC のブラウザで閲覧したときに横幅が MAX まで広がりません。
PC でしか閲覧しないなら横幅 MAX まで広げたいところです。

テーブルにスクロールバーが表示される

レスポンシブ対応のためか、テーブルでセル内の文字数が多い場合に自動改行されず、横スクロールバーが表示されてしまいます。
こちらも PC でしか閲覧しないなら折り返して全体を表示してほしいところです。

テーブルのカラムが等幅になる

これは sphinx_rtd_theme ではなく Sphinx の仕様ですが、テーブル作成時に widths 属性を設定しなかった場合、各カラムは等幅になります。

解決方法

HTML 作成後に CSS を上書きするようにしてやります。
以下のような内容で _static/css/my_theme.css を作成します。

@import url("theme.css");
 
.wy-nav-content {
    max-width: none;
}

h1,h2,h3,h4,h5,h6 {
    border-bottom: 1px solid #ccc;
}

.wy-table-responsive table td, .wy-table-responsive table th {
    white-space: normal;
}

colgroup {
    display: none;
}

conf.py に以下の設定を追加します。

html_style = "css/my_theme.css"

以上で完了です。

参考URL

• sphinx の Read The Docs（RTD）テーマで横幅制限をなくす方法
• Sphinxでテーマをカスタマイズしたときの備忘録
• Wide table handling is not flexible, how to override the CSS?