{% extends "base.html" %}
{% block title %}Method List{% endblock %}
{% block body %}
<div class="container-fluid">
    <div class="row">
        <h1 class="text-center">Method List</h1>
    </div>
    <div class="row">
        <div class="col-xs-2">
            <ul id="method-list" class="list-group">
            {% for method in data.method_list %}
                <a href="#" data-method="{{ method | escape }}"><li class="list-group-item">{{ method }}</li></a>
            {% endfor %}
            </ul>
        </div>
        <div class="col-xs-10">
            <div class="row">
                <div class="panel panel-default">
                    <div class="panel-body" id="path"></div>
                </div>
            </div>
            <div class="row">
                <pre id="docstring"></pre>
            </div>
            <div class="row">
                <div id="arg-spec">
                </div>
            </div>
            <div class="row">
                <pre id="method-info">
                </pre>
            </div>
        </div>
    </div>
</div>
{% raw %}
<script id="arg-spec-tmpl" type="text/x-mustache-template">
<table class="table">
    <tr>
        <th>参数名</th>
        <th>参数默认值（仅供参考）</th>
        <th>Required（仅供参考）</th>
    </tr>
    {{#.}}
    <tr>
        <td>{{ name }}</td>
        <td>{{ default }}</td>
        <td>{{ required }}</td>
    </tr>
    {{/.}}
</table>
</script>
{% endraw %}
<script>
    $(function() {
        $('#method-list a').on('click', function() {
            var method = $(this).attr('data-method');
            $.get('../method-info/', {'name': method}, function(data) {
                $('#path').text(data.path);
                $('#method-info').text(JSON.stringify(data, null, 4));
                $('#docstring').text(data.__doc__);

                var arg_spec = _.map(data.arg_spec, function(x) {
                    return {
                        name: x.name,
                        default: JSON.stringify(x.default),
                        required: x.required
                    };
                });
                var arg_spec_tmpl = $('#arg-spec-tmpl').html();
                $('#arg-spec').html(Mustache.render(arg_spec_tmpl, arg_spec));
            });
        });
    })
</script>
{% endblock %}
