{extends file="admin-layout.tpl"}

{block name="no-return-functions"}
    {$admin_current_location = 'folder'}
{/block}

{block name="page-title"}{intl l='Folders'}{/block}

{block name="check-resource"}admin.folder{/block}
{block name="check-access"}view{/block}

{block name="main-content"}
    <div class="folders">

    <div id="wrapper" class="container">

    {include file="includes/folder-breadcrumb.html" folder_id=$parent }

    {hook name="folders.top" location="folders_top" }

    <div class="row">
        <div class="col-md-12">
            <div class="general-block-decorator">
                <div class="table-responsive">
                    <table class="table table-striped table-condensed" id="folder_list">
                        <caption>
                            {* display parent folder name, and get current folder ID *}
                            {loop name="folder_title" type="folder" visible="*" id=$parent}
                                {intl l="Folders in %fold" fold={$TITLE}}
                                {$fold_id = $ID}
                            {/loop}
                            {elseloop rel="folder_title"}
                                {intl l="Top level folders"}
                            {/elseloop}

                            {hook name="folders.caption" location="folder_list_caption" }

                            {include file='renderer/buttons.html' btn_group=false buttons=[
                                [
                                    'type' => 'create',
                                    'class' => 'action-btn',
                                    'title' => {intl l='Add a new folder'},
                                    'href' => '#folder_creation_dialog',
                                    'auth' => ['resource' => 'admin.folder'],
                                    'data' => [
                                        'toggle' => 'modal'
                                    ]
                                ]
                            ]}
                        </caption>

                        {ifloop rel="folder_list"}
                            <thead>
                            <tr>
                                <th class="object-title">
                                    {admin_sortable_header
                                    current_order=$folder_order
                                    order='id'
                                    reverse_order='id_reverse'
                                    path={url path='/admin/folders' parent=$parent}
                                    request_parameter_name='folder_order'
                                    label="{intl l='ID'}"
                                    }
                                </th>

                                <th class="object-image">&nbsp;</th>

                                <th class="object-title">
                                    {admin_sortable_header
                                    current_order=$folder_order
                                    order='alpha'
                                    reverse_order='alpha_reverse'
                                    path={url path='/admin/folders' parent=$parent}
                                    request_parameter_name='folder_order'
                                    label="{intl l='Folder title'}"
                                    }
                                </th>

                                {hook name="folders.header" location="folder_list_header" }

                                <th>
                                    {admin_sortable_header
                                    current_order=$folder_order
                                    order='visible'
                                    reverse_order='visible_reverse'
                                    path={url path='/admin/folders' parent=$parent}
                                    request_parameter_name='folder_order'
                                    label="{intl l='Online'}"
                                    }
                                </th>

                                <th>
                                    {admin_sortable_header
                                    current_order=$folder_order
                                    order='manual'
                                    reverse_order='manual_reverse'
                                    path={url path='/admin/folders' parent=$parent}
                                    request_parameter_name='folder_order'
                                    label="{intl l='Position'}"
                                    }
                                </th>

                                <th class="actions">{intl l='Actions'}</th>
                            </tr>
                            </thead>

                            <tbody>
                            {loop name="folder_list" type="folder" visible="*" parent=$parent order=$folder_order backend_context="1" lang=$lang_id return_url=false}
                                <tr>
                                    <td>{$ID}</td>

                                    <td>
                                        {loop type="image" name="folder_image" source="folder" source_id="$ID" limit="1" width="50" height="50" resize_mode="crop" backend_context="1"}
                                            <a href="{url path='admin/folders' parent=$OBJECT_ID}" title="{intl l='Browse this folder'}"><img class="img-thumbnail" src="{$IMAGE_URL nofilter}" alt="{$TITLE}" /></a>
                                        {/loop}
                                    </td>

                                    <td class="object-title">
                                        <a href="{url path='admin/folders' parent=$ID}" title="{intl l='Browse this folder'}">
                                            {$TITLE}
                                        </a>
                                    </td>

                                    {hook name="folders.row" location="folder_list_row" folder_id={$ID} }

                                    <td>
                                        {loop type="auth" name="can_change" role="ADMIN" resource="admin.folder" access="UPDATE"}
                                            <div class="make-switch switch-small folderVisibleToggle" data-id="{$ID}"  data-on="success" data-off="danger" data-on-label="<i class='glyphicon glyphicon-ok'></i>" data-off-label="<i class='glyphicon glyphicon-remove'></i>">
                                                <input type="checkbox" class="folderVisibleToggle" {if $VISIBLE == 1}checked="checked"{/if}>
                                            </div>
                                        {/loop}

                                        {elseloop rel="can_change"}
                                            <div class="make-switch switch-small" data-on="success" data-off="danger" data-on-label="<i class='glyphicon glyphicon-ok'></i>" data-off-label="<i class='glyphicon glyphicon-remove'></i>">
                                                <input type="checkbox" class="disabled" disabled="disabled" {if $VISIBLE == 1}checked="checked"{/if}>
                                            </div>
                                        {/elseloop}
                                    </td>

                                    <td>
                                        {admin_position_block
                                            resource="admin.folder"
                                            access="UPDATE"
                                            path={url path='admin/folders/update-position' folder_id=$ID}
                                            url_parameter="folder_id"
                                            in_place_edit_class="folderPositionChange"
                                            position=$POSITION
                                            id=$ID
                                        }
                                    </td>

                                    <td class="actions">
                                        {include file='renderer/buttons.html' buttons=[
                                            [
                                                'type' => 'folder-open',
                                                'title' => {intl l='Browse this folder'},
                                                'href' => {url path='admin/folders' parent=$ID}
                                            ],
                                            [
                                                'type' => 'edit',
                                                'title' => {intl l='Edit this folder'},
                                                'href' => {url path="/admin/folders/update/%id" id=$ID},
                                                'auth' => ['resource' => 'admin.folder']
                                            ],
                                            [
                                                'type' => 'delete',
                                                'class' => 'folder-delete',
                                                'title' => {intl l='Delete this folder and all its contents'},
                                                'href' => '#folder_delete_dialog',
                                                'data' => [
                                                    'id' => $ID,
                                                    'toggle' => 'modal'
                                                ],
                                                'auth' => ['resource' => 'admin.folder']
                                            ]
                                        ]}
                                    </td>
                                </tr>
                            {/loop}
                            </tbody>
                        {/ifloop}

                        {elseloop rel="folder_list"}
                            <thead>
                            <tr>
                                <td class="message">
                                    <div class="alert alert-info">
                                        {loop type="auth" name="can_create" role="ADMIN" resource="admin.folder" access="CREATE"}
                                        {intl l="This folder has no sub-folders. To create a new one, click the + button above."}
                                        {/loop}

                                        {elseloop rel="can_create"}
                                        {intl l="This folder has no sub-folders."}
                                        {/elseloop}
                                    </div>
                                </td>
                            </tr>
                            </thead>
                        {/elseloop}
                    </table>
                </div>
            </div>
        </div>
    </div>

    {* -- CONTENT MANAGEMENT ---------------------------------------------------- *}

    {* No content outsie a folder *}
    {if $parent > 0}
    <div class="row">
        <div class="col-md-12">
            <div class="general-block-decorator">
                <div class="table-responsive">
                    <table class="table table-striped table-condensed">
                        <caption>
                            {* display parent folder name *}
                            {loop name="folder_title" type="folder" visible="*" id=$parent}
                            {intl l="Contents in %fold" fold={$TITLE}}
                            {/loop}

                            {elseloop rel="folder_title"}
                            {intl l="Top level Contents"}
                            {/elseloop}

                            {hook name="contents.caption" location="content_list_caption" }

                            {include file='renderer/buttons.html' btn_group=false buttons=[
                                [
                                    'type' => 'create',
                                    'class' => 'action-btn',
                                    'title' => {intl l='Add a new content'},
                                    'href' => '#content_creation_dialog',
                                    'auth' => ['resource' => 'admin.content'],
                                    'data' => [
                                        'toggle' => 'modal'
                                    ]
                                ]
                            ]}
                        </caption>

                        {ifloop rel="content_list"}
                            <thead>
                            <tr>
                                <th class="object-title">
                                    {admin_sortable_header
                                    current_order=$content_order
                                    order='id'
                                    reverse_order='id_reverse'
                                    request_parameter_name='content_order'
                                    path={url path='/admin/folders' parent=$parent target='contents'}
                                    label={intl l='ID'}
                                    }

                                <th>&nbsp;</th>

                                <th class="object-title">
                                    {admin_sortable_header
                                    current_order=$content_order
                                    order='alpha'
                                    reverse_order='alpha_reverse'
                                    request_parameter_name='content_order'
                                    path={url path='/admin/folders' parent=$parent target='contents'}
                                    label={intl l='Content title'}
                                    }

                                    {hook name="contents.header" location="content_list_header" }

                                <th>
                                    {admin_sortable_header
                                    current_order=$content_order
                                    order='visible'
                                    reverse_order='visible_reverse'
                                    request_parameter_name='content_order'
                                    path={url path='/admin/folders' parent=$parent target='contents'}
                                    label={intl l='Online'}
                                    }
                                </th>

                                <th>
                                    {admin_sortable_header
                                    current_order=$content_order
                                    order='manual'
                                    reverse_order='manual_reverse'
                                    request_parameter_name='content_order'
                                    path={url path='/admin/folders' parent=$parent target='contents'}
                                    label={intl l='Position'}
                                    }
                                </th>

                                <th>&nbsp;</th>
                            </tr>
                            </thead>

                            <tbody>
                            {loop name="content_list" type="content" visible="*" folder=$parent order=$content_order return_url=false}
                                <tr>
                                    <td>{$ID}</td>

                                    <td>
                                        {loop type="image" name="folder_image" source="content" source_id="$ID" limit="1" width="50" height="50" resize_mode="crop" backend_context="1"}
                                            <a href="{url path="admin/content/update/%id" id=$OBJECT_ID}" title="{intl l='Edit this content'}">
                                                <img src="{$IMAGE_URL nofilter}" alt="{$TITLE}" />
                                            </a>
                                        {/loop}

                                    <td class="object-title"><a href="{url path="/admin/content/update/%id" id=$ID}" title="{intl l='Edit this content'}">{$TITLE}</a></td>

                                    {hook name="contents.row" location="content_list_row" }

                                    <td>
                                        {loop type="auth" name="can_change" role="ADMIN" resource="admin.content" access="UPDATE"}
                                            <div class="make-switch switch-small contentVisibleToggle" data-id="{$ID}"  data-on="success" data-off="danger" data-on-label="<i class='glyphicon glyphicon-ok'></i>" data-off-label="<i class='glyphicon glyphicon-remove'></i>">
                                                <input type="checkbox" class="contentVisibleToggle" {if $VISIBLE == 1}checked="checked"{/if}>
                                            </div>
                                        {/loop}

                                        {elseloop rel="can_change"}
                                            <div class="make-switch switch-small" data-on="success" data-off="danger" data-on-label="<i class='glyphicon glyphicon-ok'></i>" data-off-label="<i class='glyphicon glyphicon-remove'></i>">
                                                <input type="checkbox" class="disabled" disabled="disabled" {if $VISIBLE == 1}checked="checked"{/if}>
                                            </div>
                                        {/elseloop}
                                    </td>

                                    <td>
                                        {admin_position_block
                                            resource="admin.content"
                                            access="UPDATE"
                                            path={url path='/admin/content/update-position' content_id=$ID folder_id=$parent}
                                            url_parameter="content_id"
                                            in_place_edit_class="contentPositionChange"
                                            position=$POSITION
                                            id=$ID
                                        }
                                    </td>

                                    <td class="actions">
                                         {include file='renderer/buttons.html' buttons=[
                                            [
                                                'type' => 'edit',
                                                'title' => {intl l='Edit this content'},
                                                'href' => {url path='/admin/content/update/%id' id=$ID},
                                                'auth' => ['resource' => 'admin.content']
                                            ],
                                            [
                                                'type' => 'delete',
                                                'class' => 'content-delete',
                                                'title' => {intl l='Delete this content'},
                                                'href' => '#content_delete_dialog',
                                                'data' => [
                                                    'id' => $ID,
                                                    'toggle' => 'modal'
                                                ],
                                                'auth' => ['resource' => 'admin.content']
                                            ]
                                        ]}
                                    </td>
                                </tr>
                            {/loop}
                            </tbody>
                        {/ifloop}

                        {elseloop rel="content_list"}
                            <thead>
                            <tr>
                                <td class="message"><div class="alert alert-info">{intl l="This folder doesn't contains any contents. To add a new content, <strong>click the + button</strong> above."}</div></td>
                            </tr>
                            </thead>
                        {/elseloop}
                    </table>
                </div>

            </div>
        </div>
    </div>
    {else}
        <div class="alert alert-info">{intl l="To create a new content, select an existing folder, or create a new one."}</div>
    {/if}

    {hook name="folders.bottom" location="folders_bottom" }

    </div>

    </div>


{* -- Adding a new folder ------------------------------------------------- *}

    {form name="thelia.admin.folder.creation"}

    {* Capture the dialog body, to pass it to the generic dialog *}
    {capture "folder_creation_dialog"}

        {form_hidden_fields}

        {form_field field='success_url'}
        {* on success, redirect to the edition page, _ID_ is replaced with the created object ID, see controller  *}
            <input type="hidden" name="{$name}" value="{url path='/admin/folders/update/_ID_'}" />
        {/form_field}

        {form_field field='parent'}
            <input type="hidden" name="{$name}" value="{$parent}" />
        {/form_field}

        {form_field field='title'}
            <div class="form-group {if $error}has-error{/if}">
                <label for="{$label_attr.for}" class="control-label">{$label} : </label>
                {loop type="lang" name="default-lang" default_only="1"}
                    <div class="input-group">
                        <input type="text" id="{$label_attr.for}" required="required" name="{$name}" class="form-control" value="{$value}" title="{intl l='Folder title'}" placeholder="{intl l='Name'}">
                        <span class="input-group-addon"><img src="{image file="assets/img/flags/{$CODE}.png"}" alt="{$TITLE}" /></span>
                    </div>

                    <div class="help-block">{intl l='Enter here the folder name in the default language (%title)' title="{$TITLE}"}</div>

                {* Switch edition to the current locale *}
                    <input type="hidden" name="edit_language_id" value="{$ID}" />

                {form_field field='locale'}
                    <input type="hidden" name="{$name}" value="{$LOCALE}" />
                {/form_field}
                {/loop}
            </div>
        {/form_field}

        {form_field field='visible'}
            <div class="form-group {if $error}has-error{/if}">
                <div class="checkbox">
                    <label>
                        <input type="checkbox" id="{$label_attr.for}" name="{$name}" value="1" checked="checked">
                        {$label}
                    </label>
                </div>
            </div>
        {/form_field}

        {hook name="folder.create-form" location="folder_create_form" }

    {/capture}

        {include
        file = "includes/generic-create-dialog.html"

        dialog_id    = "folder_creation_dialog"
        dialog_title = {intl l="Create a new folder"}
        dialog_body  = {$smarty.capture.folder_creation_dialog nofilter}

    dialog_ok_label     = {intl l="Create this folder"}

    form_action        = {url path='/admin/folders/create'}
    form_enctype       = {form_enctype}
    form_error_message = $form_error_message
    }
    {/form}

{* -- Adding a new content -------------------------------------------------- *}

    {form name="thelia.admin.content.creation"}

    {* Capture the dialog body, to pass it to the generic dialog *}
{capture "content_creation_dialog"}

{form_hidden_fields}

{* Be sure to get the folder_id, even if the form could not be validated *}
<input type="hidden" name="parent" value="{$parent}" />

    {form_field field='success_url'}
    {* on success, redirect to the edition page, _ID_ is replaced with the created object ID, see controller  *}
        <input type="hidden" name="{$name}" value="{url path='/admin/content/update/_ID_' }" />
    {/form_field}

    {form_field field='default_folder'}
        <input type="hidden" name="{$name}" value="{$parent}" />
    {/form_field}

    {form_field field='title'}
<div class="form-group {if $error}has-error{/if}">
    <label for="{$label_attr.for}" class="control-label">{$label} : </label>
    {loop type="lang" name="default-lang" default_only="1"}
    <div class="input-group">
        <input type="text" id="{$label_attr.for}" required="required" name="{$name}" class="form-control" value="{$value}" title="{$label}" placeholder="{intl l='Title'}">
                        <span class="input-group-addon"><img src="{image file="assets/img/flags/`$CODE`.png"}" alt="{$TITLE}" /></span>
                            </div>

                            <div class="help-block">{intl l='Enter here the content name in the default language (%title)' title={$TITLE}}</div>

                            {* Switch edition to the current locale *}
                            <input type="hidden" name="edit_language_id" value="{$ID}" />

                    {form_field field='locale'}
                        <input type="hidden" name="{$name}" value="{$LOCALE}" />
                    {/form_field}
                {/loop}
            </div>
        {/form_field}

        {form_field field='visible'}
            <div class="form-group {if $error}has-error{/if}">
                <div class="checkbox">
                    <label>
                        <input type="checkbox" id="{$label_attr.for}" name="{$name}" value="1" checked="checked">
                        {$label}
                    </label>
                </div>
            </div>
        {/form_field}

        {hook name="content.create-form" location="content_create_form" }

    {/capture}

    {include
                            file = "includes/generic-create-dialog.html"

                            dialog_id    = "content_creation_dialog"
                            dialog_title = {intl l="Create a new content"}
                            dialog_body  = {$smarty.capture.content_creation_dialog nofilter}

                            dialog_ok_label     = {intl l="Create this content"}

                            form_action        = {url path='/admin/content/create'}
                            form_enctype       = {form_enctype}
                            form_error_message = $form_error_message
                            }
{/form}

{* -- Delete folder confirmation dialog ----------------------------------- *}

{capture "folder_delete_dialog"}
    <input type="hidden" name="folder_id" id="folder_delete_id" value="" />

    {hook name="folder.delete-form" location="folder_delete_form" }

{/capture}

{include
                            file = "includes/generic-confirm-dialog.html"

                            dialog_id       = "folder_delete_dialog"
                            dialog_title    = {intl l="Delete folder"}
                            dialog_message  = {intl l="Do you really want to delete this folder and all its content ?"}

                            form_action         = {token_url path='/admin/folders/delete'}
                            form_content        = {$smarty.capture.folder_delete_dialog nofilter}
                            }

{* -- Delete content confirmation dialog ------------------------------------ *}

{capture "content_delete_dialog"}
    <input type="hidden" name="content_id" id="content_delete_id" value="" />
    <input type="hidden" name="folder_id" value="{$parent}" />

    {hook name="content.delete-form" location="content_delete_form" }

{/capture}

{include
                            file = "includes/generic-confirm-dialog.html"

                            dialog_id       = "content_delete_dialog"
                            dialog_title    = {intl l="Delete content"}
                            dialog_message  = {intl l="Do you really want to delete this content ?"}

                            form_action         = {token_url path='/admin/content/delete'}
                            form_content        = {$smarty.capture.content_delete_dialog nofilter}
                            }
{/block}

{block name="javascript-initialization"}

    {javascripts file='assets/js/bootstrap-switch/bootstrap-switch.js'}
        <script src="{$asset_url}"></script>
    {/javascripts}

    {javascripts file='assets/js/bootstrap-editable/bootstrap-editable.js'}
        <script src="{$asset_url}"></script>
    {/javascripts}

    <script>
        $(function() {

            // Set proper folder ID in delete from
            $('a.folder-delete').click(function(ev) {
                $('#folder_delete_id').val($(this).data('id'));
            });

            // Set proper content ID in delete from
            $('a.content-delete').click(function(ev) {
                $('#content_delete_id').val($(this).data('id'));
            });

            // JS stuff for creation form
            {include
                            file      = "includes/generic-js-dialog.html"
                            dialog_id = "folder_creation_dialog"
                            form_name = "thelia.admin.folder.creation"
                            }

            {include
                            file      = "includes/generic-js-dialog.html"
                            dialog_id = "content_creation_dialog"
                            form_name = "thelia.admin.content.creation"
                            }

            {* Toggle object visibility *}

            $(".folderVisibleToggle").on('switch-change', function(event, data) {
                $.ajax({
                   url : "{url path='admin/folders/toggle-online'}",
                            data : {
                       folder_id : $(this).data('id'),
                       action : 'visibilityToggle'
                   }
                });
            });


            $(".contentVisibleToggle").on('switch-change', function(event, data) {
                $.ajax({
                   url : "{url path='admin/content/toggle-online'}",
                   data : {
                       content_id : $(this).data('id'),
                       action : 'visibilityToggle'
                   }
                });
            });

                            {* Inline editing of object position using bootstrap-editable *}

                            $('.folderPositionChange').editable({
                type        : 'text',
                title       : '{intl l="Enter new folder position"}',
                mode        : 'popup',
                inputclass  : 'input-mini',
                placement   : 'left',
                success     : function(response, newValue) {
                    // The URL template
                    var url = "{url noamp=1 path='/admin/folders/update-position' folder_id='__ID__' position='__POS__'}";

                            // Perform subtitutions
                            url = url.replace('__ID__', $(this).data('id'))
                            .replace('__POS__', newValue);

                            // Reload the page
                            location.href = url;
                            }
                            });

                            $('.contentPositionChange').editable({
                type        : 'text',
                title       : '{intl l="Enter new content position"}',
                mode        : 'popup',
                inputclass  : 'input-mini',
                placement   : 'left',
                success     : function(response, newValue) {
                    // The URL template
                    var url = "{url noamp=1 path='/admin/content/update-position' content_id='__ID__' position='__POS__' folder_id=$parent}";

                    // Perform subtitutions
                    url = url.replace('__ID__', $(this).data('id'))
                    .replace('__POS__', newValue);

                    // Reload the page
                    location.href = url;
                }
            });

            {* Change default status *}

            $('.change-default').change(function(ev) {
                var url = "{url path='/admin/folders/set-default' folder_id='__ID__'}";

                // Perform ID subtitutions
                url = url.replace('__ID__', $(this).val());

                // Reload the page
                location.href = url;
            });

        });
    </script>
{/block}

{block name="javascript-last-call"}
    {hook name="folders.js" location="folders-js" }
{/block}
