{% extends "YOUCommercantBundle::layout.html.twig" %}

{% block container %}

<div class="mes-clients">


    {% import 'YOUCommercantBundle::macros.html.twig' as macros %}

    <br/>
    {{ macros.ariane({
    'Tableau de bord':{'url':path('you_commercant_secured_homepage')},
    'Mes spécialités':{}
    }) }}


    <div class="container-fluid padded">

        <h1 class="titretdb">Devis : mes spécialités</h1>
<br/><br/>        <br/>

        <div class="alert alert-info">
            <button type="button" class="close" data-dismiss="alert">×</button>
            Indiquez pour quelles spécialités vous aimeriez recevoir des demandes de devis !
            <br/>Pour cela, cliquez sur "Ajouter spécialité". Ajoutez-en autant que nécessaire.
        </div>
        <ul id="list-specialites" class="clearfix">
            {% include 'YOUCommercantBundle:Devis:specialites-liste.html.twig' %}
        </ul>
        <br/><br/>
        <div>
            <select id="rootCat" onchange="setCat(this.value);">
                <option value="">Rubrique</option>
                {% for item in cat %}
                    <option value="{{ item.id }}">{{ item.title }}</option>
                {% endfor %}
            </select>
            <select id="cat" onchange="setSousCat(this.value);">
                <option value="">Catégorie 1</option>
            </select>
            <select id="sousCat">
                <option value="">Catégorie 2 </option>
            </select>

            <a href="#" id="addBtn" class="btn btn-blue"><i class="icon icon-plus"></i> Ajouter spécialités</a>
        </div>
<br/>
        <a target="_blank" href="{{ path('you_pagecontent_afficher',{slug:'contact'}) }}">Vous ne trouvez pas votre spécialité ? Proposez-nous vos suggestions en cliquant ici</a>
    </div>
</div>
    <br/><br/>
    <br/><br/>
    <br/><br/>


{% endblock %}

{% block append_javascript %}

    <script>
        var url = '{{ path('you_commercant_specialites_select',{id:'__id__',level:'__lvl__'}) }}';
        var urlAdd = '{{ path('you_commercant_specialites_add',{id:'__id__'}) }}';

        function setCat(parent){
            $('#cat').html('<option value="">Catégorie 1</option>');
            $('#sousCat').html('<option value="">Catégorie 2</option>');
            if(parent == '') {
                return false;
            }
            $.ajax({url:url.replace(/__id__/gi,parent).replace(/__lvl__/,1),success:function(data){
                $('#cat').html('<option value="">Catégorie 1</option>'+data);
            }});
        }
        function setSousCat(parent){
            $('#sousCat').html('<option value="">Catégorie 2</option>');

            $.ajax({url:url.replace(/__id__/gi,parent).replace(/__lvl__/,2),success:function(data){
                $('#sousCat').html('<option value="">Catégorie 2</option>'+data);
            }});
        }

        $('#addBtn').click(function(e){
            e.preventDefault();
            value = "";
            value = $('#sousCat').val();
            if(!value){
                value = $('#cat').val();
            }
            if(!value){
                value = $('#rootCat').val();
            }

            $.ajax({url:urlAdd.replace(/__id__/gi,value),dataType:"json",success:function(data){
                if(data.error){
                    alert(data.error);
                }else{
                    $('#list-specialites').html(data.html);
                }
            }});
        });

        function removeThisDevis(elem){

            $.ajax({url:$(elem).attr('href'),dataType:"json",success:function(data){
                if(data.error){
                    alert(data.error);
                }else{
                    $('#list-specialites').html(data.html);
                }
            }});

            return false;
        }

    </script>

{% endblock %}