<div class="form-group">

      <h4>${_('Built-in Mercurial Hooks (Read-Only)')}</h4>

      % for hook in c.hooks:

        <% input_id = hook.ui_key.replace('.', '_') %>

            <label class="control-label" for="${input_id}" title="${hook.ui_key}">${hook.ui_key}</label>

            <div>

              ${h.text(hook.ui_key,hook.ui_value,id=input_id,size=60,readonly="readonly",class_='form-control')}

            </div>

      % endfor

      </div>

</div>

% if c.visual.allow_custom_hooks_settings:

${h.form(url('admin_settings_hooks'), method='post')}

<div class="form">

        <h4>${_('Custom Hooks')}</h4>

        <span class="help-block">${_('Hooks can be used to trigger actions on certain events such as push / pull. They can trigger Python functions or external applications.')}</span>

        %for hook in c.custom_hooks:

            <div class="form-group form-inline" id="${'id%s' % hook.ui_id }">

                <% input_id = hook.ui_key.replace('.', '_') %>

                    <label class="control-label" for="${input_id}" title="${hook.ui_key}">${hook.ui_key}</label>

                    <div>

                        ${h.hidden('hook_ui_key',hook.ui_key,id='hook_ui_key_'+input_id)}

                        ${h.hidden('hook_ui_value',hook.ui_value,id='hook_ui_value_'+input_id)}

                        <button type="button" class="btn btn-default btn-xs"

                            onclick="delete_hook(${hook.ui_id},'${'id%s' % hook.ui_id }')">

                            <i class="icon-trashcan"></i>

                            ${_('Delete')}

                        </button>

                    </div>

            </div>

        %endfor

        <div class="form-group form-inline">

            <label>

                ${h.text('new_hook_ui_key',size=15,class_='form-control')}

            </label>

            <div>

            </div>

        </div>

        <div class="form-group">

            <div class="buttons">

                ${h.submit('save',_('Save'),class_="btn btn-default")}

            </div>

        </div>

</div>

${h.end_form()}

% endif

<script type="text/javascript">

function delete_hook(hook_id, field_id) {

    var sUrl = ${h.js(h.url('admin_settings_hooks_delete'))};

    var success = function (o) {

            $('#' + field_id).remove();

        };

    var failure = function (o) {

            alert(${h.js(_('Failed to remove hook'))});

        };

    var postData = {'hook_id': hook_id};

    ajaxPOST(sUrl, postData, success, failure);

};

</script>