TurboGearsでメモ帳アプリを作る 4

Python TurboGears

前回で「メイン画面」にファイルの一覧を表示する機能とファイルの内容を表示する機能を追加した。

今回はまず「メイン画面」に残りのコマンドへのリンクを作成する。

「pynote/templates/index.kid」を開く。

pynote/templates/index.kid

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:py="http://purl.org/kid/ns#"
    py:extends="'master.kid'">
<head>
    <meta content="text/html; charset=utf-8" http-equiv="Content-Type" py:replace="''"/>
    <title>PyNote</title>
</head>
<body>
<div id="pynote">
    <div id="pynote_sidebar">
        <ul>
            <li py:for="f in files">
                <a href="index?file=${f}" py:content="f">item</a>
            </li>
        </ul>
    </div>
    
    <div id="pynote_main">
        <div id="pynote_command">
            <a href="new">新規作成</a>
            <!-- ファイルが選択された時のみ表示  -->
            <div py:if="edit_file != ''" style="display: inline;">
                <a href="edit?file=${edit_file}">編集</a>
                <a href="delete?file=${edit_file}"
                    onclick="return confirm('本当に削除しますか？')">削除</a>
                <a href="index">閉じる</a>
            </div>
        </div>
        <div id="pynote_content">
            <pre py:content="edit_text">
            </pre>
        </div>
    </div>
</div>
</body>
</html>

「edit_file」が空文字列でない時だけその下の要素（コマンド）を表示する。

「pynote/controllers.py」を開いて、開いているファイルのファイル名を戻り値のディクショナリに追加する。

class Root(controllers.RootController):
    @expose(template="pynote.templates.index")
    def index(self, file=""):
        return dict(
            files=os.listdir(contents_dir),
            edit_text=readText(file), edit_file=file)


これで「メイン画面」にアクセスして、ファイル名をクリックすると以下のようにコマンドが表示される。

次は各コマンドを実装する。
まずは「削除」コマンドから、これは「delete」というURLにマッピングするので「pynote/controllers.py」を開いて、「delete」というメソッドを定義する。

class Root(controllers.RootController):
    # 省略...
    
    @expose()
    def delete(self, file):
        os.remove(contents_dir + file)

        flash(u"「%s」 を削除しました。" % file)
        return redirect("index")

ファイルを削除するだけ。

次は「編集」コマンド、これは「edit」というURLにマッピングするので「edit」というメソッドを定義する。

class Root(controllers.RootController):
    # 省略...
    
    @expose(template="pynote.templates.edit")
    def edit(self, file):
        eform = PyNoteForm(
            action="update",
            submit_text="更新",
            fields=[
                widgets.Label(label=u"ファイル名", default=file),
                widgets.TextArea("text", u"内容", default=readText(file))
            ],
            hidden_fields=[
                widgets.HiddenField("name", default=file)
            ]
        )
        return dict(eform=eform)

入力フォームを作成して、それを返すだけ。ファイル名は変更できないので、widgets.Labelを使う。POSTするデータとしてはファイル名が必要なので、widgets.HiddenFieldを使って隠しフィールドして定義する。

これのテンプレートファイル「pynote/templates/edit.kid」

pynote/templates/edit.kid

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:py="http://purl.org/kid/ns#"
    py:extends="'master.kid'">
<head>
    <meta content="text/html; charset=utf-8" http-equiv="Content-Type" py:replace="''"/>
    <title>PyNote - Edit</title>
</head>
<body>
    <div id="pynote">
        ${eform.display()}
    </div>
</body>
</html>

これで「メイン画面」にアクセスして、「編集」をクリックすると以下のように表示される。

目次