<?php 

use yii\helpers\Html;
use yii\helpers\Url;

$base_url = json_encode(Url::base(true));

$this->registerCssFile('@web/css/themes/proton/style.css');
$this->registerJsFile('@web/js/jstree.js');

$script =<<< JS
    var currentSelectedNode = $('#selected-node-span').html();

    $(document).ready(function(){

        $('#data')
            .on('loaded.jstree', function(e, data){
                $("#data").jstree('open_all');

                // The root mustn't be selected, if the user will be a Root member, then he/she is an admin!
                $("#data").jstree().disable_node('Root');

                if(currentSelectedNode != ''){
                    $('#data').jstree(true).select_node(currentSelectedNode);
                }
            })
            .jstree({
                'core' : {
                    "multiple": false,
                    'themes': {
                        'name': 'proton',
                    },
                    'data': $data
                }
        });

        $('.select-btn').click(function(e){
            e.preventDefault();
            var selectedNode = $('#data').jstree('get_selected');
            $('#selected-node-span').html(selectedNode);
            $('#selected-node-input').val(selectedNode);
            $('#selected-node-section').show();
            $('#tree-modal').modal('hide');
        });
    });

JS;

$this->registerJs($script);

?>

<h2><?= 'Select owner node for the submitted data' ?></h2>
<div id="data" style="margin-bottom: 10px;"></div>

<div class="modal-footer">
    <?= Html::a('Select', [''], ['class' => 'btn btn-success btn-expanded select-btn']) ?>
    <?= Html::a('Close', [''], ['class' => 'btn btn-default btn-expanded', 'data-dismiss' => 'modal']) ?>
</div>
