- var page_class = 'project'
include ../../partials/header.jade

script(type="text/ng-template",id="folder_template.html")
    span(ng-click="folder_click(_folder)")
        span.name
            i.folder
            | {{_folder.name}}
    ul
        li.folder(ng-repeat="_folder in _folder.folders",ng-include="'folder_template.html'",ng-class="_folder.active ? 'active' : 'inactive'")
        li.file(ng-repeat="(_key,_file) in _folder.files",ng-class="_file.data.active ? 'active' : 'inactive'")
            span(ng-click="file_click(_file)")
                span.name
                    i(ng-class="_file.data.icon")
                    | {{_file.name}}
                span.notif.new-file(ng-if="_file.data.new")
                    |  new
                span.notif.new-version(ng-if="_file.data.notif")
                    |  {{_file.data.notif}}

div(ng-controller="ProjectController as controller",ng-init="init('" + project_slug + "')")

    header
        .logo
            .disks
                .disk.index-4
                .disk.index-3
                .disk.index-2
                .disk.index-1
                .disk.index-0
            a.title(href="/")
                | Keppler


    aside.aside
        header.aside-header
            .name
                | {{project.name}}
            .details
                .detail
                    .label
                        | created at
                    .value
                        | {{project.date_formated}}
                .detail
                    .label
                        | last update
                    .value
                        | {{project.last_update_date_formated}}
                .detail
                    .label
                        | files
                    .value
                        | {{project.files_count}}

        .aside-tree
            nav.files-tree-nav
                ul
                    li.folder(ng-repeat="_folder in project.tree.folders",ng-include="'folder_template.html'",ng-class="_folder.active ? 'active' : 'inactive'")

        footer.aside-footer
            .button-container
                a.button.switch.always-last-version-toggle(ng-click="always_last_version_toggle_click()",ng-class="always_last_version ? 'active' : 'inactive'",href="#")
                    .switch-icon
                        .bar
                        .disk
                    | Always last version
            .button-container
                a.button.switch.show-differences-toggle(ng-click="show_differences_toggle_click()",ng-class="show_differences ? 'active' : 'inactive'",href="#")
                    .switch-icon
                        .bar
                        .disk
                    | Show differences
            .button-container
                a.button.default.mark-all-as-read(ng-click="mark_all_as_read_click()",href="#")
                    | Mark all as read

    section.main
        section.no-file(ng-if="!file")
            .text
                | Choose a file
        section.file(ng-if="file")
            nav.versions-nav
                a.version(href="#",ng-repeat="_version in file.versions",ng-click="version_click(_version)",ng-class="_version.active ? 'active' : 'inactive'")
                    .background
                    .content
                        .label
                            | created at
                        .date
                            | {{_version.date_formated}}
                        .time-from-now
                            | {{_version.time_from_now}}
                        .differences
                            .label
                                | changes
                            .bar
                                .fill(style="width:{{_version.diff_percent}};")
                            .percent(style="width:{{_version.diff_percent}};")
                                | {{_version.diff_percent}}
            header.file-header
                .content
                    span.path
                        | {{file.path.directory}}/
                    span.name
                        | {{file.name}}
            section.code
                .lines
                    pre
                        code
                            .line(ng-repeat="_line in version.lines")
                                | {{ _line }}
                .current(hljs,hljs-source="version.content")
                .differences
                    pre
                        code(ng-if="version.diff",ng-class="show_differences ? 'active' : 'inactive'")
                            span(ng-repeat="_difference in version.diff",ng-class="{removed: _difference.removed, added: _difference.added}")
                                span.value
                                    | {{ _difference.value }}


include ../../partials/footer.jade