{% extends 'App/Pdf/_include/_layout.pdf.html.twig' %}

{% block content %}
    {% for sticker in stickers %}
    {% enfor %}
    {%  macro sticker_draw(config, kanban) %}
        <script>
        </script>

    {% endmacro %}
{% endblock %}

{% block javascript_footer %}
    {{ parent() }}
    <script>
        $(document).ready(function(){


            function draw_box(box_config, content) {
                let div = document.createElement('div');
                div.id = box_config.id;
                div.classList.add('box_resize_drag');
                div.style.top = box_config.dimension.top + 'px';
                div.style.left = box_config.dimension.left + 'px';
                div.style.width = box_config.dimension.width + 'px';
                div.style.height = box_config.dimension.height + 'px';
                let div_content = document.createElement('div');
                div_content.classList.add('box_content');
                div_content.innerHTML = content;
                applyStyle(div, box_config);
                div.append(div_content);
                return div;
            }

            function applyStyle(div, box_config) {
                if (box_config.style.align === 'center') div.classList.add('text-center');
                else if (box_config.style.align === 'right') div.classList.add('text-right');
                else div.classList.add('text-left');
                div.classList.add(font_size[eval(box_config.style.font_size)]);
                div.classList.add(font_weight[eval(box_config.style.font_weight)]);

                if (eval(box_config.style.border.top)) div.classList.add('bd-top');
                if (eval(box_config.style.border.left)) div.classList.add('bd-left');
                if (eval(box_config.style.border.right)) div.classList.add('bd-right');
                if (eval(box_config.style.border.bottom)) div.classList.add('bd-bottom');
            }

            function draw_sticker(config, kanban){
                config.boxes.forEach(function (box_config, index) {
                    let content = '';
                    if( box_config.type === 'field_main'){
                        if(box_config.code === 'article_name_short') {
                            content = kanban
                        }
                    }
                });
            }
        });
    </script>
{% endblock %}