<html xmlns="http://www.w3.org/1999/xhtml"
    xmlns:tal="http://xml.zope.org/namespaces/tal"
    xmlns:metal="http://xml.zope.org/namespaces/metal"
    metal:use-macro="api.community_layout">

    <div metal:fill-slot="content">

    <h1 metal:use-macro="api.snippets.macros['backto_link']"/>

    <div metal:use-macro="api.snippets.macros['status_message']"/>

    <div metal:use-macro="api.snippets.macros['lock']" />

    <h1 metal:use-macro="api.snippets.macros['page_title']"/>


    <div class="kbody">
        <table class="content-listing">
            <tr>
                <th>Date</th>
                <th>Editor</th>
                <th>Action</th>
            </tr>
            <tr tal:condition="not history">
                <td colspan="4">
                    No versions have been saved yet for this content.
                </td>
            </tr>
            <tr tal:repeat="v history" tal:condition="history">
                <td>${v['date']}</td>
                <td>
                    <a href="${v['editor']['url']}">
                        ${v['editor']['name']}
                    </a>
                </td>
                <td tal:condition="v['is_current']">
                    Current Version
                </td>
                <td tal:condition="not v['is_current']">
                    <a href="#" tal:condition="use_ajax"
                       onClick="preview('${v['preview_url']}');">Preview</a> 
                    <a tal:condition="not use_ajax"
                       href="${v['preview_url']}">Preview</a>

                    |

                    <a href="${v['restore_url']}">Restore</a>
                </td>
            </tr>
        </table>
    </div>

    <script language="javascript" type="text/javascript">
    //<![CDATA[
    function preview(url) {
        $.ajax({
            url: url,
            success: function(data) {
                if ('url' in data) {
                    window.location.href = data['url'];
                    return;
                }
                var page_title = $('.kscreentitle');
                var position = page_title.offset();
                position = [position.left, position.top + page_title.height()];
                var title = 'Preview Version from ' + data['date'] + ' by ' +
                            data['author'];
                var dialog = $('<div class="preview_dialog">' +
                                  '<p><b>' + data['title'] + '</b></p>' +
                                  '<div class="kbody">' + data['body'] + '</div>' +
                               '</div>')
                    .appendTo('body')
                    .hide()
                    .karldialog({
                        title: title,
                        width: 600,
                        position: position,
                        draggable: true // Draggable doesn't seem to work :(
                    });
                dialog.karldialog('open');
            }
        });
        return false;
    }
    //]]>
    </script>

    </div>

</html>
