{% extends '@AGrid/base.html.twig' %}

{% block head %}
    {{ parent() }}
{% endblock %}

{% block title %}AGrid Content!{% endblock %}

{% block stylesheets %}
    {{ parent() }}
{% endblock %}

{% block body %}

    <h2>{{ 'agrid_bundle.agrid_page.title.page_title'|trans }} {{ page.id }}</h2>

    <div class="row">
        <a class="waves-effect waves-light btn-small agrid-darken" href="javascript:add_row('{{ page.id }}',0);"><i class="material-icons left">content_paste</i> Add</a>
        <a href="#" data-target="slide-referencement" class="waves-effect waves-light btn-small agrid-darken sidenav-trigger">SEO</a>
        <a href="{{ path('agrid_page_loader', {'lang':seo_element.lang, 'slugPage':seo_element.slug}) }}"  class="waves-effect waves-light btn-small agrid-darken sidenav-trigger" target="_blank">{{ 'agrid_bundle.agrid_page.button.show_the_page'|trans }}</a>
    </div>


    <div id="page-{{ page.id }}">
        {% include '@AGrid/include/agrid_element.html.twig' with {'mode': mode,'rows': page.content.rows, 'parent':'page'} %}
    </div>
    {% include '@AGrid/referencement.html.twig' %}

{% endblock %}

 {% block scripts %}
     {{ parent() }}
     <script>
         update_sortable_items('{{ content.id }}', '{{ csrf_token(content.id) }}');
            // $( document ).ready(function() {
            //     var image_module_id = 0;
            //     $('.fixed-action-btn').floatingActionButton();
            //     $(".btn-save-websee-editor").hide();
            //     $("#add_a_new_route").hide();
            //
            //     sidenav_init();
            //     synchro_inputs();
            //     slider_init();
            //     // $('#file-manager-agrid-upload').on('change', function () {
            //     //     file_manager_upload();
            //     // })
            //
            //     // $('#title-type , #title-text, #title_class').on('change', function () {
            //     //     module_title();
            //     // });
            // });

            // function slider_init(){
            //     $('.carousel.carousel-slider').carousel({
            //         fullWidth: true,
            //         indicators: true
            //     });
            //     setInterval(function () {
            //         $('.carousel.carousel-slider').carousel('next');
            //     },4000);
            // }

            // function sidenav_init(){
            //     $(".sidenav").sidenav({
            //             onOpenStart : function () {
            //                 $(".sidenav.opened").each(function(){
            //                     $(this).close();
            //                 });
            //         },
            //         onOpenEnd : function(){
            //             var id = $(this).attr("id");
            //             $("#"+id).addClass('opened');
            //         },
            //         onCloseStart : function () {
            //             var id = $(this).attr("id");
            //             $("#"+id).removeClass('opened');
            //         }
            //     });
            //
            //     $('#sidenav-right').sidenav({
            //         edge: 'right',
            //     });
            // }

            // function editor(id){
            //     $(".btn-open-websee-editor").hide();
            //     $("#btn-save-websee-editor-"+id).show();
            //     $("#websee-editor-"+id).websee({
            //          // toolbar: toolbar,
            //         height: 350,
            //         minHeight: 100,
            //         defaultBackColor: '#fff',
            //         lang: 'fr-FR',
            //         focus:true
            //     });
            //
            // }

          {#function save_editor(id){#}
          {#    $(".btn-save-websee-editor").hide();#}
          {#    var markup = $("#websee-editor-"+id).websee('code');#}
          {#    $("#websee-editor-"+id).websee('destroy');#}
          {#    $(".btn-open-websee-editor").show();#}


          {#    $.ajax({#}
          {#        url: "{{ path('agrid_page_col_save_editor',{'page':page.id}) }}",#}
          {#        type: 'POST',#}
          {#        data: {#}
          {#            token: "{{ csrf_token(page.id) }}",#}
          {#            module : id,#}
          {#            html: markup#}
          {#        },#}
          {#        success: function (data) {#}

          {#        }#}
          {#    });#}
          {#}#}

         // $('#select_lang').change(function(){
         //     location.href = $(this).val();
         // });
         //
         // $('#page_mode').change(function(){
         //     location.href = $(this).val();
         // });
         //
         // $("#screen-emulator-size").change(function(){
         //
         //     $(".screen-emulator").removeClass("min-screen").removeClass("max-screen");
         //
         //     if($("#screen-emulator-size").is(":checked")){
         //         $(".screen-emulator").addClass("max-screen");
         //     } else {
         //         $(".screen-emulator").addClass("min-screen");
         //     }
         //
         // });

         // update_sortable_items();

         {#function update_sortable_items() {#}

         {#    $('select').formSelect();#}
         {#    $('.dropdown-trigger').dropdown();#}


         {#    $(".sortable-cols").sortable({#}
         {#        connectWith: ".sortable-cols",#}
         {#        cancel: ".disable-sorting",#}
         {#        handle: ".handle-col",#}
         {#        receive: function (event, ui) {#}
         {#            var parentElement = ui.item[0].parentElement.id;#}
         {#            var element = ui.item[0].id;#}

         {#            $.ajax({#}
         {#                url: "{{ path('agrid_page_cols_switch',{'page':page.id}) }}",#}
         {#                type: 'POST',#}
         {#                data: {#}
         {#                    token: "{{ csrf_token(page.id) }}",#}
         {#                    row: parentElement,#}
         {#                    col: element#}
         {#                },#}
         {#                success: function (data) {#}
         {#                    update_col_order(parentElement);#}
         {#                }#}
         {#            });#}
         {#        },#}
         {#        stop: function (event, ui) {#}
         {#            var parentElement = ui.item[0].parentElement.id;#}
         {#            update_col_order(parentElement);#}
         {#        }#}
         {#    });#}

         {#    $(".sortable-rows").sortable({#}
         {#        cancel: ".disable-sorting",#}
         {#        handle: ".handle-row",#}
         {#        receive: function (event, ui) {#}
         {#            var parentElement = ui.item[0].parentElement.id;#}
         {#            var element = ui.item[0].id;#}
         {#            console.log("receive", parentElement, element);#}

         {#        },#}
         {#        stop: function (event, ui) {#}
         {#            var parentElement = ui.item[0].parentElement.id;#}
         {#            update_row_order(parentElement);#}
         {#        }#}
         {#    });#}

         {#}#}

         {#function update_col_order(parentElement){#}
         {#    var new_order = {};#}
         {#    $("#"+parentElement+ " .col").each(function( index ){#}
         {#        new_order[index] = $( this ).attr('id');#}
         {#    });#}

         {#    $.ajax({#}
         {#        url: "{{ path('agrid_page_cols_order',{'page':page.id}) }}",#}
         {#        type: 'POST',#}
         {#        data: {#}
         {#            token: "{{ csrf_token(page.id) }}",#}
         {#            row : parentElement,#}
         {#            cols : new_order#}
         {#        },#}
         {#        success: function (data) {#}

         {#        }#}
         {#    });#}
         {#}#}

         {#function update_row_order(parentElement){#}
         {#    var new_order = {};#}
         {#    $("#"+parentElement+ " .row").each(function( index ){#}
         {#        new_order[index] = $( this ).attr('id');#}
         {#    });#}

         {#    $.ajax({#}
         {#        url: "{{ path('agrid_page_row_order',{'page':page.id}) }}",#}
         {#        type: 'POST',#}
         {#        data: {#}
         {#            token: "{{ csrf_token(page.id) }}",#}
         {#            rows : new_order#}
         {#        },#}
         {#        success: function (data) {#}

         {#        }#}
         {#    });#}
         {#}#}


         {#function set_col_size(col_id, size_int){#}
         {#    $.ajax({#}
         {#        url: "{{ path('agrid_page_col_size',{'page':page.id}) }}",#}
         {#        type: 'POST',#}
         {#        data: {#}
         {#            token: "{{ csrf_token(page.id) }}",#}
         {#            col : col_id,#}
         {#            mode : "{{ mode }}",#}
         {#            size : size_int#}
         {#        },#}
         {#        success: function (data) {#}
         {#            $("#col-"+col_id).attr('class',data);#}
         {#            $("#col-mod-"+col_id).text('s'+size_int);#}
         {#        }#}
         {#    });#}
         {#}#}


         {#function delete_col(col_id){#}
         {#    $.ajax({#}
         {#    url: "{{ path('agrid_page_delete_col',{'page':page.id}) }}",#}
         {#    type: 'POST',#}
         {#    data: {#}
         {#    token: "{{ csrf_token(page.id) }}",#}
         {#    col : col_id#}
         {#    },#}
         {#    success: function (data) {#}
         {#       $("#col-"+col_id).remove();#}
         {#    }#}
         {#    });#}
         {#}#}

         {#function delete_row(row_id){#}
         {#    $.ajax({#}
         {#        url: "{{ path('agrid_page_delete_row',{'page':page.id}) }}",#}
         {#        type: 'POST',#}
         {#        data: {#}
         {#            token: "{{ csrf_token(page.id) }}",#}
         {#            row : row_id#}
         {#        },#}
         {#        success: function (data) {#}
         {#            $("#row-"+row_id).remove();#}
         {#        }#}
         {#    });#}
         {#}#}

         {#function add_row(page_id, col_id){#}
         {#    $.ajax({#}
         {#        url: "{{ path('agrid_page_add_row',{'page':page.id}) }}",#}
         {#        type: 'POST',#}
         {#        data: {#}
         {#            token: "{{ csrf_token(page.id) }}",#}
         {#            col : col_id,#}
         {#            mode : "{{ mode }}"#}
         {#        },#}
         {#        success: function (data) {#}
         {#            if(col_id == 0)#}
         {#                $(".screen-emulator").append(data);#}
         {#            else#}
         {#                $("#col-"+col_id+" .sortable-rows").append(data);#}

         {#            update_sortable_items();#}
         {#        }#}
         {#    });#}
         {#}#}

         {#function add_col(row_id){#}
         {#    $.ajax({#}
         {#        url: "{{ path('agrid_page_add_col',{'page':page.id}) }}",#}
         {#        type: 'POST',#}
         {#        data: {#}
         {#            token: "{{ csrf_token(page.id) }}",#}
         {#            row : row_id,#}
         {#            mode : "{{ mode }}"#}
         {#        },#}
         {#        success: function (data) {#}
         {#            $("#row-"+row_id).html(data);#}
         {#            update_sortable_items();#}
         {#        }#}
         {#    });#}
         {#}#}

         {#function add_module(col_id, type){#}
         {#    $.ajax({#}
         {#        url: "{{ path('agrid_page_add_module',{'page':page.id}) }}",#}
         {#        type: 'POST',#}
         {#        data: {#}
         {#            token: "{{ csrf_token(page.id) }}",#}
         {#            col : col_id,#}
         {#            type : type,#}
         {#            mode : "{{ mode }}"#}
         {#        },#}
         {#        success: function (data) {#}
         {#            $("#col-"+col_id).replaceWith(data);#}
         {#            $("#col-"+col_id+" .btn-save-websee-editor").hide();#}
         {#            update_sortable_items();#}
         {#            $("#slide-module").sidenav("close");#}
         {#        }#}
         {#    });#}
         {#}#}


         {#function add_route(){#}

         {#    $.ajax({#}
         {#        url: "{{ path('agrid_page_add_route',{'page':page.id,'lang':lang}) }}",#}
         {#        type: 'POST',#}
         {#        data: {#}
         {#            token: "{{ csrf_token(page.id) }}",#}
         {#            url: $("#add_route").val()#}
         {#        },#}
         {#        success: function (data) {#}
         {#            $("#slide-referencement").html(data);#}
         {#            // M.updateTextFields();#}
         {#            synchro_inputs();#}
         {#        }#}
         {#    });#}
         {#}#}

         // function synchro_inputs(){
         //     $("#seo_title").keyup(function(){
         //         let newData = $("#seo_title").val();
         //         $("#seo_og_title").val(newData);
         //         $("#seo_twitter_title").val(newData);
         //     });
         //
         //     $("#seo_description").keyup(function(){
         //         let newData = $("#seo_description").val();
         //         $("#seo_og_description").val(newData);
         //         $("#seo_twitter_description").val(newData);
         //     });
         //
         //     $("#seo_og_image").keyup(function(){
         //         let newData = $("#seo_og_image").val();
         //         $("#seo_twitter_image").val(newData);
         //     });
         // }


         {#function delete_301(name){#}
         {#    $.ajax({#}
         {#        url: "{{ path('agrid_page_delete_route',{'page':page.id,'lang':lang}) }}",#}
         {#        type: 'POST',#}
         {#        data: {#}
         {#            token: "{{ csrf_token(page.id) }}",#}
         {#            name: name#}
         {#        },#}
         {#        success: function (data) {#}
         {#            $("#redirections-301").html(data);#}
         {#        }#}
         {#    });#}
         {#}#}



         // function update_route(){
         //     $("#add_route").val('');
         //     $("#add_a_new_route").slideToggle("slow");
         // }

        {# function save_seo(){#}

        {#     $.ajax({#}
        {#         url: "{{ path('agrid_page_save_seo',{'page':page.id,'lang':lang}) }}",#}
        {#         type: 'POST',#}
        {#         data: {#}
        {#             token: "{{ csrf_token(page.id) }}",#}
        {#             title: $("#seo_title").val(),#}
        {#             description: $("#seo_description").val(),#}
        {#             image: $("#seo_og_image").val(),#}
        {#             og_type: $("#seo_og_type").val(),#}
        {#             sitename: $("#seo_og_sitename").val(),#}
        {#             twittercard: $("#seo_twitter_card").val(),#}
        {#             keywords: $("#seo_keywords").val()#}
        {#         },#}
        {#         success: function (data) {#}

        {#         }#}
        {#     });#}
        {# }#}

        {#function show_files_manager(callback_function){#}
        {#    $.ajax({#}
        {#        url: '{{ path('net15_file_manager_get_photo_box') }}',#}
        {#        type: 'post',#}
        {#        data: {#}
        {#            callback_function : callback_function#}
        {#        },#}
        {#        success: function (data) {#}
        {#            $('#file-manager-content').html(data);#}
        {#            $('#sidenav-right').sidenav('open');#}
        {#            $('.materialboxed').materialbox();#}
        {#        }#}
        {#    });#}
        {#}#}

        {#function select_module(id_col){#}
        {#    $.ajax({#}
        {#        url: '{{ path('agrid_module_select') }}',#}
        {#        type: 'post',#}
        {#        data: {#}
        {#            id_col : id_col#}
        {#        },#}
        {#        success: function (data) {#}
        {#            $("#slide-module").html(data);#}
        {#            $("#slide-module").sidenav("open");#}
        {#        }#}
        {#    });#}
        {#}#}


        {#function open_module(module_public_key){#}
        {#    $.ajax({#}
        {#        url: '{{ path('agrid_module_init') }}',#}
        {#        type: 'post',#}
        {#        data: {#}
        {#            module_public_key : module_public_key#}
        {#        },#}
        {#        success: function (data) {#}
        {#            $("#slide-module").html(data);#}
        {#            $("#slide-module").sidenav("open");#}
        {#            // module_title();#}
        {#            M.updateTextFields();#}
        {#            // $('.carousel.carousel-slider').carousel({#}
        {#            //     fullWidth: true,#}
        {#            //     indicators: true#}
        {#            // });#}
        {#        }#}
        {#    });#}
        {#}#}


        {#function module_callback_photos(file_guid){#}
        {#    $("#slide-photos").sidenav("close");#}

        {#    $.ajax({#}
        {#        url: '{{ path('agrip_module_photos_callback') }}',#}
        {#        type: 'post',#}
        {#        data: {#}
        {#            module_public_key : $("#module_public_key").val(),#}
        {#            file_guid : file_guid#}
        {#        },#}
        {#        success: function (data) {#}
        {#            location.reload();#}
        {#            // $("#slide-module").sidenav("close");#}
        {#            // $("#sidenav-right").sidenav("close");#}

        {#        }#}
        {#    });#}
        {#}#}

        {#function module_callback_slider(file_guid){#}
        {#    $.ajax({#}
        {#        url: '{{ path('agrip_module_slider_callback') }}',#}
        {#        type: 'post',#}
        {#        data: {#}
        {#            module_public_key : $("#module_public_key").val(),#}
        {#            file_guid : file_guid#}
        {#        },#}
        {#        success: function (data) {#}
        {#            $("#slide-module").html(data);#}
        {#            $('.carousel.carousel-slider').carousel({#}
        {#                fullWidth: true,#}
        {#                indicators: true#}
        {#            });#}
        {#            // $("#slide-module").sidenav("close");#}
        {#            // $("#sidenav-right").sidenav("close");#}

        {#        }#}
        {#    });#}
        {#}#}

        {#function module_title(){#}
        {#    $('#title-type , #title-text, #title_class').on('change', function () {#}
        {#        $.ajax({#}
        {#            url: '{{ path('agrip_module_title') }}',#}
        {#            type: 'post',#}
        {#            data: {#}
        {#                module_public_key : $("#module_public_key").val(),#}
        {#                title_type: $('#title-type').val(),#}
        {#                title_text: $('#title-text').val(),#}
        {#                title_class: $('#title_class').val()#}
        {#            },#}
        {#            success: function (data) {#}
        {#                $("#title-view").html(data);#}
        {#            }#}
        {#        });#}
        {#    });#}
        {#}#}

        // function validate_module(){
        //     $("#slide-module").sidenav("close");
        //     location.reload();
        // }
        //
        // function new_module() {
        //
        // }


     </script>
 {% endblock %}