Git Extentions によるバージョン管理のチュートリアル(Windows編)

 

Git Extensionsこんにちは、以前「[git] クローンからプルしてマージ、コミットしてプッシュする」分散バージョン管理がはじめての方に向けて、Git(ギット)の基本学習用チュートリアルを公開しました。

読んで頂いた方々からいろいろな要望を頂きました。
その中でも多くの方が Windows 環境で利用できる GUI クライアントツールの解説がほしい。という要望です。
Git の基礎勉強はコマンドベース(CUI)である Git をつかったバージョン管理の考え方と使い方を理解してもらうために作成しました。
バージョン管理の基礎を理解している人たちに向けて Windows 環境で利用できる GUI ツールのチュートリアルを作成しましたので公開します。

Git Extensions の基礎勉強 ~ Git Extensions によるバージョン管理 ~

Windows にて Git を使いたい方におすすめする Git Extensions のチュートリアルです。

課題がソースコードと連携していることのメリット

dev_trace

tracpath によるプロジェクト管理は、ガントチャートやWBSなどの管理者向けに開発されたツールではありません。開発チームにとって生産性向上と効率化するための仕組みを持った開発現場のためのツールです。

そのため、予算の管理、人材管理のための機能はありません。しかし、開発者や開発チームに必要なプロジェクト管理機能とソースコード管理があります。

大小を問わず、すべての開発チームに必須なツール

  • プロジェクトのマイルストーン管理、タスク管理–簡単に実現できる仕組み–
  • バグ専用のデータベース–それもシンプルで、カスタマイズ可能–
  • バージョン管理システム–Git / Subversion / Mercural–

tracpath の強みである「課題がソースコードと連携していること」のメリットを説明します。
メリットは3つあります。
 

1. 開発のトレーサビリティ(追跡)

 

tracpath はあなたのプロジェクトの過去と現在の「なぜ」を理解するのに役立ちます。

以前に解決したバグに関連したファイルに作成された特定の変更を瞬時に見つけることが出来ます。これはプロジェクトの過去、現在含めすべての期間においてソースコードレベルで追跡することが出来ることを意味します。

プロジェクトの開始時点から現在までをタイムマシーンをつかって過去に移動することや特定の1地点だけを戻すことができます。

ソースコードをバージョン管理し、いつでも前のバージョンに戻すことが出来る安心感をあなたのチームに提供することが出来ます。

 

2. 開発のアクティビティ(活動)

 

プロジェクトの開発状況をリアルタイムに知ることが出来ます。開発状況を把握し、必要ならタスク・課題あるいはチェンジセット(コミットログ)を閲覧することが出来ます。

ソースコードのバージョン管理システム用に開発された tracpath リポジトリビューアーでは

  • コミット履歴
  • ソースコードの閲覧
  • 差分表示
  • リポジトリのログ
  • コードレビューとコメント

が統合された機能として提供しています。

バージョン管理システムのクライアントツールを使わなくても、またコマンドを覚えなくても、ブラウザのみで同様の情報を取得することが出来ます。だれでも、簡単に利用できる機能を提供することで開発者以外のチームメンバーにも価値ある情報を共有することが出来ます。

さらに詳しく説明してます。「ブラウザでソースコードの変更履歴を管理する「リポジトリブラウザ」機能」をご覧下さい。

 

3. 開発のスマートな連携

 

開発チームはソフトウェア開発に必要な多くのアプリケーションを利用します。アプリケーションの切替を最小限にすることは、時間の節約と思考の切替によるロスを大きく削減します。

tracpath はコミットフックに対応しています。コミットフックによって開発者は簡単な構文をコミットログにメッセージとして追加するだけでワークフロー上のアクションを実行すること出来ます。

 $svn commit -m "fixes #40 に対応しました。"
 や
 $git commit -a -m "fixed #41 に対応した"

TortoiseGit によるバージョン管理のチュートリアル(Windows編)

 

git こんにちは、以前「[git] クローンからプルしてマージ、コミットしてプッシュする」分散バージョン管理がはじめての方に向けて、Git(ギット)の基本学習用チュートリアルを公開しました。

読んで頂いた方々からいろいろな要望を頂きました。
その中でも多くの方が Windows 環境で利用できる GUI クライアントツールの解説がほしい。という要望です。

Git の基礎勉強はコマンドベース(CUI)である Git をつかったバージョン管理の考え方と使い方を理解してもらうために作成しました。
バージョン管理の基礎を理解している人たちに向けて Windows 環境で利用できる GUI ツールのチュートリアルを作成しましたので公開します。

TortoiseGit の基礎勉強 ~ TortoiseGit によるバージョン管理 ~

Windows にて Git を使いたい方におすすめする TortoiseGit のチュートリアルです。

JavaScript での IE11 判定を User-Agent を見ずに行う

おおまえです。ふたたび IE11 の話です。タイトルの結論は一番最後にあります。

Internet Explorer 11 がリリースされてしばらく経ち、少しずつ IE11 からアクセスされるようになってきました。Compatibility changes in IE11 (Windows) を見ると User-Agent 文字列の変更はともかくとして IE 独自の API を排除し、いまどきのブラウザが持つような標準に沿った API をちゃんと実装してきている…ようです。

モダンブラウザ用のコードでそのまま動くのを期待していいよね…? と思いたいところですが TracWysiwygPlugin で実際に試してみると、他のブラウザには普通ある API がなくてこの機能が動かないよ…? とかあるわけです。TracWysiwygPlugin IE11 対応を行った際に気づいた点を上げてみました。

1. document.execCommmand(‘inserthtml’) が使えない

WYSIWYG エディタ機能を持つライブラリは、この document.execCommand を用いて色々な文字装飾や任意の HTML を追加したりします。ボールドや斜体などは定義済みのコマンドがあり、第1引数に "bold", "italic" を渡すと選択文字列がコマンドに応じた処理を行ってくれます。また、定義済みのコマンドにないような機能は基本的に "inserthtml" コマンドを用いて必要な HTML を追加します。

しかし IE にはこの inserthtml がありません。IE11 でもありません。他のブラウザにはあるんですが…。また、よくないことに処理しできないコマンドを document.execCommand に渡しても例外などは上げてこないため「エラーになったから代替用のメソッドを…」みたいなことができません。

2. document.selection.createRange ができない

inserthtml の代替手段が document.selection.createRange から TextRange を作成し pasteHTML を呼び出す方法です。これにより inserthtml とほぼ同等のことが実現できます。こんなふうになっています。

TracWysiwyg.prototype._msieInsertHTML = function(html) {
    this.contentWindow.focus();
    var selection = this.contentDocument.selection;
    var range = selection.createRange();
    range.pasteHTML(html.replace(/\t/g, "	"));
    range.collapse(false);
    range.select();
};

しかし IE11 では document.selection がなくなり window.getSelection を使えとあるのですが、このオブジェクトには pasteHTML メソッドがありません。

仕方がないので、以下のようにして Range.createContextualFragmentRange.insertNode を用いて実装するようにしています。もともとこのコードは inserthtml を持たない Safari 2 のために書いたコードです。(消さなくてよかった…)

TracWysiwyg.prototype._fragmentInsertHTML = function(html) {
    var range = this.getNativeSelectionRange();
    if (range) {
        var d = this.contentDocument;
        var tmp = d.createRange();
        tmp.setStart(d.body, 0);
        tmp.setEnd(d.body, 0);
        var fragment = tmp.createContextualFragment(html);
        range.deleteContents();
        range.insertNode(fragment);
        range.detach();
        tmp.detach();
    }
};

3. Selection.containsNode がない

このメソッドは選択領域が指定の要素を内包しているかどうかの判定をしてくれるメソッドです。これが他のブラウザにはあるんですが IE11 にはありません。仕方ないので、これは Range.compareBoundaryPoints を使って、Range オブジェクトと対象の要素の前後関係を順番に調べるというような処理に書き換えました。


ということで、ここまでを踏まえれば User-Agent を見ないで「IE11 判定できそう」と思ったので書いてみました。

    if (!window.TextRange) {
         alert('non IE browser');
    }
    else if (!window.getSelection) {
        alert('IE 8 or early');
    }
    else if (!document.selection) {
        alert('IE 11');
    }
    else {
        alert('IE 9 or 10');
    }

実際にこのコードそのものを使っているわけではないので、何か抜けがあるような気がします。

IE11 のとき Trac チケット詳細の textarea が折り返されない…の解消方法

Internet Explorer 11 で Trac のチケット作成フォームにある textarea の中身が折り返されないようになっている、という内容が2週間ほど前に trac-dev メーリングリストに投稿がありました。確認してみると確かに折り返されません。(Trac 0.12, 1.0 も同様)

IE11

どうも IE11 は以下のような HTML があるときに textarea が上位の要素にある white-space を参照するようです。IE10 以前や他のブラウザはこのような挙動になりません。

<div style="whtie-space:nowrap">
  <div>
    <textarea></textarea>
  </div>
</div>

とりあえずの対処として trac/htdocs/css/ticket.css に以下のパッチを当てると解消できます。

diff --git a/trac/htdocs/css/ticket.css b/trac/htdocs/css/ticket.css
index 7e18e20..5f873c1 100644
--- a/trac/htdocs/css/ticket.css
+++ b/trac/htdocs/css/ticket.css
@@ -214,6 +214,7 @@ form .field div.trac-resizable { width: 100% }

 #propertyform { margin-bottom: 2em; }
 #properties { white-space: nowrap; line-height: 160%; padding: .5em }
+#properties textarea { white-space: pre-wrap }
 #properties table { border-spacing: 0; width: 100%; padding: 0 .5em }
 #properties table th {
  padding: .4em;

IE11 (パッチ後)

もし、この対処で何か問題を見つけた場合、http://trac.edgewall.org/ticket/11376 まで報告、もしくはここにコメントをしてもらえるとありがたいです。

tracpath のセキュリティ対策をまとめてみた

 

こんにちは、tracpath はエンタープライズ向けに Git / Subversion / Mercurial のソースコード管理サービスを提供しています。エンタープライズ向けに求められるデータの安全性とセキュリティ対策についてまとめました。tracpath を運営している株式会社オープングルーヴの取り組みについても説明します。
 

はじめに

利用者のデータを扱う上で tracpath が備えているセキュリティ機能と tracpath を運営するオープングルーヴの情報セキュリティ管理方針の基本になる2つがあります。
 

セキュリティ機能

 セキュリティ機能は tracpath がセキュリティ向上のために標準で備えているセキュリティ機能です。全てのプランの標準機能として提供しています。
 

1. SSLによる暗号化通信

 tracpathはインターネット上の通信データをすべて暗号化します。詳しくはこちら

2. IPアドレスの接続制限

 IP接続制限による、指定したグローバルIPからアクセスを許可することでセキュリティを向上させます。詳しくはこちら
 

3. アカウントのロックアウト

 アカウントのロックアウトは不正な操作、異常な操作(主にパスワードの試行)が行われたアカウントに対してアクセスを自動的に遮断します。詳しくはこちら
 

4. アカウントアクティビティ

 アカウントアクティビティとは tracpath に関する最近のアクセス状況が表示されます。 これは、あたなのアカウントによる tracpath へのアクセス状況を確認することで不正にアクセスされていないか、知らない場所からの不正なアクセスがないか、調べることができます。詳しくはこちら

利用者様が利用するセキュリティ対策の機能を説明しました。ブログではさらに詳しく解説していますのでセキュリティ記事を参照してください。
 

情報セキュリティ管理

 情報セキュリティ管理とはサービスを運営する当社社員に関係する利用者データの安全性を担保するために設けている決まりです。セキュリティ行動規範として常にアップデートし、インターネットに公開しています。

 

5. 当社のセキュリティ行動規範

 セキュリティ行動規範は「tracpath」を運営している株式会社オープングルーヴが社内のセキュリティ管理のために利用する文書です。 当サービスにおける情報セキュリティの取り組み状況について現状を通知するために公開しております。

 

6. セキュリティ管理方針

 tracpathのクラウドサービスは、エンタープライズ環境において求められる高いレベルの安全対策が施されたサービスとして設計しています。お客様の大切なソースコードや設計情報を守るために実施しているtracpathクラウドサービスのセキュリティ対策とセキュリティ管理について詳細を公開しています。

  1. 共通セキュリティ仕様
  2. 物理的なセキュリティ(Amazon EC2)
  3. セキュリティ管理
  4. データ冗長性
  5. ネットワークセキュリティ
  6. アカウント管理とセキュリティ
  7. 外部からの攻撃に対する対策
  8. データのセキュリティ

 

7. セキュリティに対するお願い

 tracpathが提供しているセキュリティ対策以外に利用者に守っていただきたいルールがあります。利用者のプロジェクトチームや会社で徹底することを期待しています。

  • プロジェクトに必要なくなったユーザアカウントが残っている場合、ロックするか削除してください。
  • チームメンバーに定期的にパスワードを更新するように注意喚起してください。(1~3ヶ月毎の更新がおすすめです)
  • 管理アカウントを利用すれば、すべてのアカウントをロックしたり、パスワードを強制的に変更することができます。厳密な管理をおすすめします。
  • パスワードの有効期限機能を活用してください。
  • 強いパスワードを作成するようにしてください。Microsoftが推奨する強いパスワードのページを参照してください。

 

さらに、エンタープライズ向けのサービス(セキュリティ編)

 主に大規模な開発プラットフォームとして、tracpath を利用するお客様に向けたサービスがあります。
tracpath Enterprise Planはお客様の要望に合わせたソリューションを提供しております。

例えば、自社のデータセンターとtracpathをVPNによるセキュアな環境を構築したり、開発チームのアクセスログ、統計情報を提供するサービスなど….

tracpath を社内の開発チームに導入することが可能です。
セキュリティに対するご質問・お問い合せはこちらからお問い合せ下さい。

ブラウザでソースコードの変更履歴を管理する「リポジトリブラウザ」機能

 

tracpathはプロジェクトの履歴を追跡し、インシデント管理(チケットシステム)と同じくらい価値のあるソースコードの変更履歴をブラウザで簡単に見ることが出来ます。
リポジトリブラウザの機能について紹介します。

tracpathのリポジトリブラウザは、ソースコードのチェンジセット、リビジョン、ブランチ、タグ、差分を閲覧するための効率的な機能を提供しています。

さらに、tracpathはソースコードとチケット、Wiki、マイルストーンが密に連携したり、Git / Mercurial / Subversionのリポジトリに対応しています。

 

プロジェクトの概要:コミット履歴

 
プロジェクトの概要:コミット履歴

プロジェクトの活動状況をすぐに把握することができるダッシュボード機能があります。
ダッシュボードはあなた専用のプロジェクト一覧機能を提供します。あなたが関わっているプロジェクトの活動状況だけを簡単に確認することが出来ます。
さらに詳細を知りたい場合はプロジェクト毎のページに遷移してください。

ダッシュボードでは主に、Wikiの状況、ロードマップ(マイルストーン)の状況、リポジトリの状況、チケットの状況を簡単な数字にして教えてくれます。
ダッシュボードのグラフでは最近の活動状況ーー画像では2ヶ月間のコミット状況を表示ーーを表示しています。

 

ソースコードを閲覧

 
ソースコードを閲覧 ソースコードを閲覧

どんなブラウザからでも簡単にソースコードにアクセスすることが出来ます。チェンジセット、リビジョン、ブランチ、タグ、差分を閲覧できます。

tracpathのリポジトリは分散バージョン管理システムの「Git」「Mercurial」と集中バージョン管理である「Subversion」を利用することが出来ます。

 

複数リポジトリの管理

 

複数リポジトリの管理

tracpathはプロジェクトに複数リポジトリを作成することが出来ます。

マルチリポジトリは1つのプロジェクト内に複数の開発チームが存在するときや複数のモジュールを開発するときに利用すると便利です。開発チーム、運用チーム毎にメインリポジトリ、開発リポジトリ、リリースリポジトリを作成することも出来ます。

チームの方法に合わせて柔軟で強力なtracpathの複数リポジトリ機能を活用できます。

 

ソースコードの変更履歴

 

ソースコードの変更履歴 ソースコードの変更履歴

tracpathのバージョン管理システムは全てのソースコード、バイナリ、文書の変更履歴を保存し続けます。

あなたの開発環境からバージョン管理システムにアクセスすることは当然ですが、ブラウザからでもすべてのチェンジセット、履歴、差分を閲覧できることはとても大切です。

tracpathはGoogle Chrome / Firefox / Internet Explorerであれば効率的なユーザインターフェースを提供しています。

 

リポジトリの活動状況

 

リポジトリの活動状況

プロジェクトの履歴や活動状況だけではありません。リポジトリの活動状況を瞬時に表示します。
さらに、チェンジセット、ファイル、リポジトリパスは自動でリンクされ詳細を確認することが出来ます。ソースコードの歴史を簡単に追跡できる機能を提供しています。

 

リポジトリのログ

 

リポジトリのログ

リビジョンログを一覧表示することができます。リポジトリの活動状況と同じようにチェンジセット、ファイル、リポジトリパスは自動でリンクされ詳細を確認することが出来ます。

ソースコードの歴史を簡単に追跡できる機能を提供しています。

 

リポジトリブラウザ

 

リポジトリブラウザ

リポジトリブラウザはソースコードの階層構造を表示し、簡単に利用することが出来ます。
デフォルトリポジトリはプロジェクトのメインリポジトリであり、リポジトリ一覧に表示されているリポジトリはサブ機能毎のリポジトリ(マルチリポジトリ)です。

Windows エクスプローラーのようにツリービューとファイル一覧からすぐにファイルを見つけることが出来ます。

 

プロジェクトを始めるときに大切なビジョンを共有する

 

すべてのプロジェクトで必ずやっておくべき大切なことがある。それはプロジェクトのビジョンを共有することである。新サービスの開発プロジェクトやパッケージのバージョンアップ開発プロジェクト、顧客向けフルスクラッチのシステム開発などすべてでやるべき仕事である。

プロジェクトのビジョンを共有する必要がある人たちは、プロジェクトに関わる全ての登場人物であり、開発者、顧客・経営者、管理者である。プロジェクトのビジョンを文書として作成することで、このプロジェクトでチームが重視しようとしていることや目指していること、顧客の重視していることや優先順位がまとめられ、プロジェクトのビジョンとして共有される。このビジョンを確立して共有するときに関係者内の利害関係や力の関係でたくさんの意見が出るかもしれない。

関係者に共有することが思いの外難しく時間がかかるかもしれない。

でも、この工程はとても重要なので今使う時間はプロジェクトが佳境に入ったときに使う時間と同じくらい大切である。このビジョンはプロジェクト計画立案や要件定義等の工程でその土台になるべき重要な要素と考える。

私たちがプロジェクトのビジョンを策定するときのフォーマットは以下のようなタイトルが並ぶ。

これを雛形にして、プロジェクト管理者が作成するようにしている。

== ○○プロジェクトのビジョン
 1. 目的
 2. 要件
 3. 目標
 4. プロジェクトの進め方
 5. 予算・リソース・工数・スケジュール感

 

1. 目的

 
1. 目的

はじめにプロジェクトの背景や必要とされる理由が説明されるべきであり、プロジェクトをチームで進めていくためのベースの考えとして共有される目的を明示する。これによりチームは積極的な参加と正しいと思われる方向性を示すことがある。プロジェクトマネージャーが共感しやすい目的やビジョンを説明出来ることは、プロジェクトの価値を関係者に周知する強力なツールとなり、価値ある仕事と言うことを思い出させてくれる。
これまでプロジェクトのビジョン策定後、自分のチームに説明し顧客に説明することで、顧客自身がプロジェクトで達成したいこと、何を求めているのか、がはっきりすることが多々あった。

 

2. 要件

 
2. 要件

要件はプロジェクトに課せられることであり、顧客やチームが重視すべきことをまとめる。重視すべき点として予算内に収まるようにすべきか(コスト)、来年の2月までにサービスインすることか(期限)、現場の全ての声に対応した機能か、これらが複数定義されているか、を明示する。

私たちは箇条書きで思いつく要件を書き出し、優先度が高いと思われるリストに並び替えて整理したりする。

 

3. 目標

 
3. 目標

目標はプロジェクトで達成したいことーー自分たちのチームがこのプロジェクトを進める上で達成したいことーーを書いておく。

顧客の目的とは関係ない場合もある点を頭に入れておくべきである。

具体的な例として、すでに稼働しているシステムのバージョンアッププロジェクトでは「過去のコードのリファクタリングによるコードの最適化」「DBライブラリのバージョンアップ、チューニング」「Webアプリケーション用フレームワークのチューニング」などがある。その他にも「ペアプログラミングを実践」「コードレビューによるコードの品質を担保する」「テストの自動化ツールをプロジェクトに導入」などがある。

 

4. プロジェクトの進め方

 
4. プロジェクトの進め方

プロジェクトマネージャーを中心にプロジェクトのビジョンが策定され、成果物として必要なことが見えてくる。プロジェクトの進め方では、今回のプロジェクトにおいて最適と思われる開発方法ーーアジャイル開発?ウォーターフォール?ーーやチーム体制、責任の範囲、役割分担などが見えてくる。

自分のチームが得意としている方法・体制を明示する。

 

5. 予算・リソース・工数・スケジュール感

 
5. 予算・リソース・工数・スケジュール感

必須ではないがチームで共有できる場合、プロジェクトの予算、人的リソースーーだれが参加するのかーー、全体のスケジュール感(詳細なスケジュールはこれから計画されるはずであるが、おおよそのスケジュール感)を共有することは大切なことである。

 

さいごに

 

プロジェクトのビジョンはプロジェクト計画前に作っておくことをオススメする。プロジェクトが始まる前にマネージャーが時間を確保し作成することでプロジェクト管理の指針になる。

このプロジェクトのビジョンはプロジェクトが進行中も更新されチームメンバーに共有される。

当社ではいつでも見られるようにtracpathのWikiによりメンテナンスされている。

 
 

Wiki による開発チームの情報共有

 

社内の情報共有を推進して、ナレッジを蓄積する。社員の暗黙知を形式知にする。

 

と言われるような固い話題では無く、開発チームという比較的小さなグループでの情報共有に Wiki を活用している話をしたいと思う。

 
WikiというシステムはWikipediaが有名である。ブラウザを使ってだれでも簡単に文書編集ができるウェブアプリケーションである。
このWikiシステムは小さな開発チームの情報共有にとても有効に機能する。
tracpath 開発チームでは、開発初期からWikiを使って情報共有をしてきた。

 
Wikiを導入するに当たって、当社の場合は厳密な運用ルール、記載ルールなどほとんど設けなかった。利用者が好きなように使ってイイですよ。というスタンスでかるく始めた。

 

  唯一のルールと言えるものは、プロジェクトに関するすべての情報 ー技術情報、仕様、ミーティング議事、顧客の声、Excel/PowerPoint/PDFなどーをすべて一元化すること、である。

 
この唯一のルールは今も変わらず続いている。
このルールのおかげで何度も助けられたことがあるのでプロジェクトが始まるタイミングで開発チームにとっての情報集約できる場を用意しておくことの重要性がみんなに理解された。

 

ブログのように一般に受け入れられるのは難しく、だれでもすぐに使えるというツールではないのかもしれない。
Wikiのメリットである、Wiki記法を使えるようになって初めて文書作成の簡単さ ー文章の内容だけに集中して書くことが出来る、Word や PowerPoint の書式や改ページと戦う必要が無いー が理解できると思う。
 
最近のWikiシステムは必ずWYSIWYG機能というワープロのように文書を作成出来るツールも提供されているが、Wikiのよさを殺している気がしておすすめしない。やはり、Wiki記法によるスピーディな文書作成がWikiシステムの重要な点だと考えている。
 

 
プロジェクトに関するその時の情報をできるだけ記録しておくことで、数ヶ月後に発生するトラブルに対処できるかもしれないし、将来のメンバーにとって役に立つかもしれない。
このような気持ちで文書を残すことを考えると、Wikiシステムは最適だと思う。

 
当社のプロジェクト管理サービス「tracpath」は Wiki 機能を標準提供しているので、Wikiのみをフルで使いたいと言う場合、無料で利用することが出来るのでオススメです。

 
過去のブログで具体的な機能を紹介しているのでそちらも参考にしてください。
Tracマクロによる仕事に使える厳選マクロと使い方
 
 

Tracプラグイン: TracpathThemeでTracのデザインをtracpath風にする

Tracのデザインをtracpath風に変更するTracpathThemeプラグインを紹介します。このプラグインを使うと、Tracのデフォルトのデザインがtracpath風のデザインに変わります。

https://github.com/opengroove/tracpaththeme

デフォルト状態のtrac TracpathThemeの導入後
デフォルトテーマ Tracparth_blueテーマ
blueテーマ

TracpathThemeプラグインでは上のblueテーマ以外にも以下の4色のテーマも使用できるようになります。

Tracpath_purpleテーマ Tracpath_yellowテーマ Tracpath_greenテーマ Tracpath_redテーマ
purpleテーマ yellowテーマ greenテーマ redテーマ

それではTracpathThemeプラグインの導入方法を説明します。なお、TracpathThemeプラグインはTrac 0.12かTrac 1.0で使用することができます。

1. ThemeEngineプラグインのインストールと有効化

TracLightningテーマ
TracLightning3.2.0
のMac風デザイン

Tracでデザインを変更する方法はいくつかありますが、一番簡単なのはThemeEngineプラグインを使うことでしょう。このプラグインを使用することで、複数のテーマを自由に切り替えてデザインを変更することができるようになります。Trac Lightningでは最初からインストールされていて、デフォルトのMac風のデザインにはこのプラグイン用に作成されたテーマが使用されています。TracpathThemeプラグインThemeEngineプラグイン用のテーマとして作成されています。

インストール

ThemeEngineプラグインeasy_installpipを使って簡単にインストールできます。なお、Trac Lightningには最初からインストールされているのでこの手順は不要です。

> easy_install --always-unzip TracThemeEngine

あるいは

> pip install TracThemeEngine

有効化

インストールが完了したらtrac-adminコマンドでプラグインを有効にします。この手順もTrac Lightningでは不要です。

> trac-admin /path/to/projenv config set components "themeengine.*" enabled

2. TracpathThemeプラグインのインストールと有効化

インストール

TracpathThemeプラグインeasy_installあるいはpipを使ってインストールします。

> easy_install --always-unzip https://github.com/opengroove/tracpaththeme/archive/trunk.zip

あるいは

> pip install https://github.com/opengroove/tracpaththeme/archive/trunk.zip

有効化

インストールが完了したらこれも同様にtrac-adminコマンドで有効化します。

> trac-admin /path/to/projenv config set components "tracpaththeme.*" enabled

3. Tracの再起動


上で行った設定をTracに認識させるために、Tracを動作させているWebサーバを再起動します。

4. テーマを切り替える


テーマの切り替えは管理コンソールから行います。最初はこんな状態になっています。

テーマ切り替え
中央の大きな空白部分には本来はデフォルトテーマのスクリーンショット画像が表示されるのですが、残念ながらこのブログの執筆時点のThemeEngineプラグインではインストールスクリプトに問題があってスクリーンショット画像がインストールされません。このままでも動作に支障はないのですがスクリーンショット画像を手動でインストールすることもできます。

まずソースコードリポジトリからスクリーンショット画像の画像ファイルを入手します。

> svn export http://trac-hacks.org/svn/themeengineplugin/trunk/themeengine/htdocs/default_screenshot.png

このファイルをThemeEngineプラグインのインストール先にあるhtdocsディレクトリにコピーします。

> python -c "from os.path import join, dirname; from shutil import move; import themeengine; move('default_screenshot.png', join(dirname(themeengine.__file__), 'htdocs'))"

左右の矢印ボタンでテーマを切り替えてUse this themeボタンでテーマを選択します。Tracpath_blueテーマを選択すると以下のようになります。

テーマ切り替え後

選択した結果はすぐに画面に反映されます。

このテーマ切り替え機能ですが、これまた残念ながらThemeEngineプラグインに問題があって、選択したテーマによってはその後のテーマ切り替え時に全てのテーマが表示されない場合があります。もしそのような状態になってしまった場合にはいったん別のテーマを選択することで改善するので試してみて下さい。

あるいは、インストールしたThemeEngineプラグインのソースコードを修正することで解決することもできます。

まず、修正が必要なファイルの場所をを見つけます。

> python -c 'import themeengine; import os.path; print os.path.dirname(themeengine.__file__)'

上記のコマンドで見つけたディレクトリにあるadmin.pyファイルの63行目を以下のように変更します。

    data['themeengine']['current_index'] = index
  
    data['themeengine']['info'] = data['themeengine']['info'][index:] + data['themeengine']['info'][:index];
    data['themeengine']['current_index'] = 0
  

修正後に、Tracを動作させているWebサーバを再起動してください。なお上記の修正方法はThemeEngineプラグインのバージョン2.2.0を対象にしています。