<?php
/**
 * Created by PhpStorm.
 * User: michael.kirchner
 * Date: 21.06.18
 * Time: 13:29
 */

$icons = '<li><input type="radio" id="icon-none-{{PLACEHOLDER}}" class="icon" name="icon-{{PLACEHOLDER}}" value=""/><label for="icon-none-{{PLACEHOLDER}}">' . __('None', 'orcas-responsive-wiki') . '</label></li>';

foreach($iconList as $i) {
    $icons .= '<li><input type="radio" id="icon-' . $i . '-{{PLACEHOLDER}}" value="fa ' . $i . '" class="icon" name="icon-{{PLACEHOLDER}}"/><label for="icon-' . $i . '-{{PLACEHOLDER}}"><i class="fa ' . $i . '"></i></label></li>';
}

$categoryTemplate = '<li class="dd-item dd3-item" id="{{ID}}" data-icon="{{ICON}}" data-old="{{NAME}}" data-new="{{NAME}}">
           
            <div class="position-relative">
                <div class="dd-handle dd3-handle">Drag</div>
                <div class="dd3-content">
                    <input type="text" class="editable-category-name" value="{{NAME}}"/>
                    <div class="icons-my-container">
                        <div class="open-icons">' . __("Icons", "responsive-wiki") . '</div>
                        <div class="icon-selection-container">
                            <ul class="icon-selection">{{ICON_LIST}}</ul>
                            <div class="button button-primary close-icon-list">' .__("Ok", "orcas-responsive-wiki") . '</div>
                        </div>
                    </div>
                    <div class="button button-primary remove-icon">' . __("Remove", "orcas-responsive-wiki") . '</div>
                </div>
            </div>
            {{SUBLIST}}
        </li>';
?>

<div class="wiki-categories">
    <h3><?php echo __('Categories', 'orcas-responsive-wiki'); ?></h3>
    <ul>
        <li><input id="listing-type-alphabetical" type="radio" name="listing-type" value="alphabetical" <?php echo $sorting=='alphabetical'?'checked':'';?> /><label for="listing-type-alphabetical"><?php echo __('Alphabetical', 'orcas-responsive-wiki'); ?></label></li>
        <li><input id="listing-type-category" type="radio" name="listing-type" value="category" <?php echo $sorting=='category'?'checked':'';?> /><label for="listing-type-category"><?php echo __('Categories', 'orcas-responsive-wiki'); ?></label></li>
        <li><input id="listing-type-category-box" type="radio" name="listing-type" value="category-box" <?php echo $sorting=='category-box'?'checked':'';?> /><label for="listing-type-category-box"><?php echo __('Categories box', 'orcas-responsive-wiki'); ?></label></li>
    </ul>
    <div>
        <div>
            <label for="add-new-category"><?php echo __('New category', 'orcas-responsive-wiki'); ?></label>
            <input id="add-new-category" type="text" placeholder="<?php echo __('New category', 'orcas-responsive-wiki'); ?>" />
            <div id="add-new-category-submit"><?php echo __('Add', 'orcas-responsive-wiki'); ?></div>
            <div id="category-exist-error"><?php echo __('Category already existing', 'orcas-responsive-wiki'); ?></div>

            <div id="category-placeholder"><?php echo str_replace('{{ICON_LIST}}', $icons, $categoryTemplate); ?></div>
        </div>
    </div>
</div>

<?php
    function renderList($categories, $icons = '', $tpl) {
        ob_start();
        foreach($categories as $cat) {
            $childTpl = '';
            $collapse = '';
            $randId = rand(0, 1000);
            if(isset($cat['child']) && count($cat['child']) > 0) {
                $childTpl = '<ol class="dd-list">' . renderList($cat['child'], $icons, $tpl) . '</ol>';
                $collapse = '<button data-action="collapse" type="button">Collapse</button>
                <button data-action="expand" type="button" style="display: none;">Expand</button>';
            }

            $iconTpl = str_replace('{{PLACEHOLDER}}', $randId, $icons);

            echo str_replace(array('{{NAME}}', '{{ICON}}', '{{COLLAPSE}}', '{{SUBLIST}}', '{{ID}}', '{{ICON_LIST}}'), array($cat['name'], $cat['icon'], $collapse, $childTpl, str_replace(' ', '-', strtolower($cat['name'])), $iconTpl), $tpl);
        }
        $content = ob_get_contents();
        ob_end_clean();

        return $content;
    }
?>

<div class="dd" id="nestable3">
    <ol class="dd-list" id="categories">
        <?php echo renderList($categories, $icons, $categoryTemplate); ?>

    </ol>
    <input type="hidden" name="categories" id="categories-form-list" value="" />
</div>

<div>
    <input <?php echo $everyOneCanCreateCategories ? 'checked' : ''; ?> type="checkbox" name="frontend-creation" id="user-can-create-categories"/><label for="user-can-create-categories"><?php echo __('Every one can create categories.', 'orcas-responsive-wiki'); ?></label>
</div>
