Proyectos de Subversion LeadersLinked - Backend

<?php 
$currentUser = $this->currentUserHelper();
$currentUser = $currentUser->getUser();

$routeTimeline = $this->url('feeds/timeline');


$this->headLink()->appendStylesheet($this->basePath('plugins/nprogress/nprogress.css'));
$this->inlineScript()->appendFile($this->basePath('plugins/nprogress/nprogress.js'));

$this->inlineScript()->appendFile($this->basePath('plugins/ckeditor/ckeditor.js'));


$this->headLink()->appendStylesheet($this->basePath('plugins/bootstrap-fileinput/css/fileinput.min.css'));
$this->headLink()->appendStylesheet($this->basePath('plugins/bootstrap-fileinput/themes/explorer-fa/theme.css'));

$this->inlineScript()->appendFile($this->basePath('plugins/bootstrap-fileinput/js/plugins/piexif.js'));
$this->inlineScript()->appendFile($this->basePath('plugins/bootstrap-fileinput/js/plugins/sortable.js'));
$this->inlineScript()->appendFile($this->basePath('plugins/bootstrap-fileinput/js/fileinput.js'));
$this->inlineScript()->appendFile($this->basePath('plugins/bootstrap-fileinput/js/locales/es.js'));
$this->inlineScript()->appendFile($this->basePath('plugins/bootstrap-fileinput/themes/fa/theme.js'));
$this->inlineScript()->appendFile($this->basePath('plugins/bootstrap-fileinput/themes/explorer-fa/theme.js'));


$this->inlineScript()->appendFile($this->basePath('plugins/jquery-validation/jquery.validate.js'));
$this->inlineScript()->appendFile($this->basePath('plugins/jquery-validation/additional-methods.js'));
$this->inlineScript()->appendFile($this->basePath('plugins/jquery-validation/localization/messages_es.js'));

$this->inlineScript()->appendFile($this->basePath('plugins/jsrender/jsrender.min.js'));


$this->inlineScript()->appendFile($this->basePath('plugins/bootbox/bootbox.all.min.js'));

$this->inlineScript()->captureStart();
echo <<<JS
jQuery( document ).ready(function( $ ) {
    var feed_unique_shared = '';

    $.validator.addMethod('requiredContent', function (value, element, param) {
        value = $.trim($.fn.stripHtml(value));
        return value.length > 0;
    }, 'ERROR_REQUIRED');

    $.fn.reload = function(page) {
        NProgress.start();
        $.ajax({
            'dataType'  : 'json',
            'accept'    : 'application/json',
            'method'    : 'get',
            'data'      : {
                'page' : page
            },
            'url'       :  '$routeTimeline'
        }).done(function(response) {
            if(response['success']) {
                $('.posts-section').empty();

                $( ".posts-section" ).append(
                    $( "#feedTemplate" ).render( response['data']['current']['items'] )
                );
            

                if(response['data']['total']['pages'] > 1 ) {
             
                    $('#paginator-process-comm').show();
                    if(response['data']['current']['page']  > 1) {
                        $('#btn-page-previous').data('page', response['data']['current']['page'] - 1);
                        $('#btn-page-previous').show();
                    } else {
                         $('#btn-page-previous').hide();
                    } 
                    if(response['data']['current']['page'] <  response['data']['total']['pages']) {
                        $('#btn-page-next').data('page', response['data']['current']['page'] + 1);
                        $('#btn-page-next').show();
                    } else {
                         $('#btn-page-next').hide();
                    } 

                    $('#paginator-process-comm').show();
      
                } else {
                    $('#paginator-process-comm').hide();
                }
                            
    
            } else {
                $.fn.showError(response['data']);
            } 
        }).fail(function( jqXHR, textStatus, errorThrown) {
            $.fn.showError(textStatus);
        }).always(function() {
            NProgress.done();
        });

    }

    $('#btn-page-previous').click(function(e) {
        e.preventDefault();

        var page = $(this).data('page');
        $.fn.reload(page);
        
    });

    $('#btn-page-next').click(function(e) {
        e.preventDefault();

        var page = $(this).data('page');
        $.fn.reload(page);
        
    });

    $.validator.setDefaults({
        debug: true,
        highlight: function(element) {
            $(element).addClass('form-group-has-error');
        },
        unhighlight: function(element) {
            $(element).removeClass('form-group-has-error');
        },
        errorElement: 'div',
        errorClass: 'form-group-invalid-feedback',
        errorPlacement: function(error, element) {
            if(element.context.id == 'file') {
                error.insertAfter(element.parent().parent().parent());
            } else { 
               if(element.parent('.form-group').length) {
                    error.insertAfter(element.parent());
                } else {
                    error.insertAfter(element);
                }
            }

 
        }
    });
    
    $.fn.showFormErrorValidator = function(fieldname, errors) {
        var field = $(fieldname);
        if(field) {
            $(field).addClass('form-group-has-error');
            
            var error = $('<div id="' + fieldname +'-error" class="form-group-invalid-feedback">' + errors + '</div>');

            var element = $(fieldname)
            if(element.parent('.form-group').length) {
                error.insertAfter(element.parent());
            } else if(element.parent('.file-loading').length) {
                error.insertAfter(element.parent().parent());
            } else {
                error.insertAfter(element);
            }
        }
    };

    var validatorFeed = $('#form-feed').validate({
        debug: true,
        onclick: false,
        onkeyup: false,
        onfocusout: false,
        ignore: [],
        rules: {
            'shared_with' : {
                required: true,
            },
           'description': {
                updateCkeditor:function() {
                        CKEDITOR.instances.description_feed.updateElement();
                },
                required: true
            },
        },

        submitHandler: function(form)
        {
            $('input[type="submit"]').prop('disabled', true);
            NProgress.start();
            $.ajax({
                'dataType'  : 'json',
                'accept'    : 'application/json',
                'method'    : 'post',
                'url'       : $('#form-feed').attr('action'),
                'data'      : $('#form-feed').serialize(),
            }).done(function(response) {
                if(response['success']) {
                    var s = $( "#feedTemplate" ).render( response['data'] );
                    $(s).prependTo(".posts-section");                    

                   $('#form-feed')[0].reset()
                    $("#modal-feed-box").modal('hide'); 
                } else {
                    validatorFeed.resetForm();
                    if(jQuery.type(response['data']) == 'string') {
                        $.fn.showError(response['data']);
                    } else  {
                        $.each(response['data'], function( fieldname, errors ) {
                            $.fn.showFormErrorValidator('#form-feed #' + fieldname, errors);
                        });
                    }
                }
            }).fail(function( jqXHR, textStatus, errorThrown) {
                $.fn.showError(textStatus);
            }).always(function() {
                $('input[type="submit"]').prop('disabled', false);
                NProgress.done();
            });
            return false;
        },
        invalidHandler: function(form, validator) {
        
        }
    });

    $('.btn-modal-feed-close').click(function(e) {
        e.preventDefault();
        $('#form-feed')[0].reset()
        $('#modal-feed-box').modal('hide');
        return false;
    });

    $('#description-main, #btn-description-main').click(function(e) {
        e.preventDefault();

        $('#form-feed')[0].reset()
        validatorFeed.resetForm();
        $("#modal-feed-box").modal('show'); 
    })

    var validatorFeedImage = $('#form-feed-image').validate({
        debug: true,
        onclick: false,
        onkeyup: false,
        onfocusout: false,
        ignore: [],
        rules: {
            'shared_with' : {
                required: true,
            },
           'description': {
                updateCkeditor:function() {
                        CKEDITOR.instances.description_image.updateElement();
                },
                required: true
            },
           'file': {
                required: true,
                extension: 'jpg|jpeg|png',
                accept: 'image/jpg,image/jpeg,image/png'
            },
        },

        submitHandler: function(form)
        {
            var formdata = false;
            if (window.FormData){
                formdata = new FormData(form); //form[0]);
            }

            $('input[type="submit"]').prop('disabled', true);
            NProgress.start();
            $.ajax({
                'dataType'  : 'json',
                'accept'    : 'application/json',
                'method'    : 'post',
                'url'       :  $('#form-feed-image').attr('action'),
                'data'      : formdata ? formdata : $('#form-feed-image').serialize(),
                'processData': false,
                'contentType': false,
            }).done(function(response) {
                if(response['success']) {
                    

                    var s = $( "#feedTemplate" ).render( response['data'] );
                    $(s).prependTo(".posts-section");  

                    $("#modal-feed-image-box").modal('hide');
                } else {
                    validatorFeedImage.resetForm();
                    if(jQuery.type(response['data']) == 'string') {
                        $.fn.showError(response['data']);
                    } else  {
                        $.each(response['data'], function( fieldname, errors ) {
                            $.fn.showFormErrorValidator('#form-feed-image #' + fieldname, errors);
                        });
                    }
                }
            }).fail(function( jqXHR, textStatus, errorThrown) {
                $.fn.showError(textStatus);
            }).always(function() {
                $('input[type="submit"]').prop('disabled', false);
                NProgress.done();
            });
            return false;
        },
        invalidHandler: function(form, validator) {
        
        }
    });

    var validatorFeedVideo = $('#form-feed-video').validate({
        debug: true,
        onclick: false,
        onkeyup: false,
        onfocusout: false,
        ignore: [],
        rules: {
            'shared_with' : {
                required: true,
            },
           'description': {
                updateCkeditor:function() {
                        CKEDITOR.instances.description_video.updateElement();
                },
                required: true
            },
           'file': {
                required: true,
                extension: 'webm,mp4,webm',
                accept: 'video/webm,video/mpeg,video/mp4'
            },
        },

        submitHandler: function(form)
        {
            var formdata = false;
            if (window.FormData){
                formdata = new FormData(form); //form[0]);
            }

            $('input[type="submit"]').prop('disabled', true);
            NProgress.start();
            $.ajax({
                'dataType'  : 'json',
                'accept'    : 'application/json',
                'method'    : 'post',
                'url'       :  $('#form-feed-video').attr('action'),
                'data'      : formdata ? formdata : $('#form-feed-video').serialize(),
                'processData': false,
                'contentType': false,
            }).done(function(response) {
                if(response['success']) {
                    var s = $( "#feedTemplate" ).render( response['data'] );
                    $(s).prependTo(".posts-section");  

                    $("#modal-feed-video-box").modal('hide');
                } else {
                    validatorFeedVideo.resetForm();
                    if(jQuery.type(response['data']) == 'string') {
                        $.fn.showError(response['data']);
                    } else  {
                        $.each(response['data'], function( fieldname, errors ) {
                            $.fn.showFormErrorValidator('#form-feed-video #' + fieldname, errors);
                        });
                    }
                }
            }).fail(function( jqXHR, textStatus, errorThrown) {
                $.fn.showError(textStatus);
            }).always(function() {
                $('input[type="submit"]').prop('disabled', false);
                NProgress.done();
            });
            return false;
        },
        invalidHandler: function(form, validator) {
        
        }
    });

    var validatorFeedDocument = $('#form-feed-document').validate({
        debug: true,
        onclick: false,
        onkeyup: false,
        onfocusout: false,
        ignore: [],
        rules: {
            'shared_with' : {
                required: true,
            },
           'description': {
                updateCkeditor:function() {
                        CKEDITOR.instances.description_document.updateElement();
                },
                required: true
            },
           'file': {
                required: true,
                extension: 'pdf',
                accept: 'application/pdf'
            },
        },

        submitHandler: function(form)
        {
            var formdata = false;
            if (window.FormData){
                formdata = new FormData(form); //form[0]);
            }

            $('input[type="submit"]').prop('disabled', true);
            NProgress.start();
            $.ajax({
                'dataType'  : 'json',
                'accept'    : 'application/json',
                'method'    : 'post',
                'url'       :  $('#form-feed-document').attr('action'),
                'data'      : formdata ? formdata : $('#form-feed-document').serialize(),
                'processData': false,
                'contentType': false,
            }).done(function(response) {
                if(response['success']) {
                    var s = $( "#feedTemplate" ).render( response['data'] );
                    $(s).prependTo(".posts-section");  

                    $("#modal-feed-document-box").modal('hide');
                } else {
                    validatorFeedDocument.resetForm();
                    if(jQuery.type(response['data']) == 'string') {
                        $.fn.showError(response['data']);
                    } else  {
                        $.each(response['data'], function( fieldname, errors ) {
                            $.fn.showFormErrorValidator('#form-feed-document #' + fieldname, errors);
                        });
                    }
                }
            }).fail(function( jqXHR, textStatus, errorThrown) {
                $.fn.showError(textStatus);
            }).always(function() {
                $('input[type="submit"]').prop('disabled', false);
                NProgress.done();
            });
            return false;
        },
        invalidHandler: function(form, validator) {
        
        }
    });

    



    $('a.fa-file').on('click', function(e){
        e.preventDefault();

        $('#form-feed-document #shared_with').val('');
        $('#form-feed-document #file').val('');
        CKEDITOR.instances.description_document.setData('');

        $('#form-feed-document')[0].reset()
        validatorFeedDocument.resetForm();
        $('#modal-feed-document-box').modal('show');
    });

    $('#form-feed-document #file').fileinput({
        theme: 'fa',
        language: 'es',
        showUpload: false,
        dropZoneEnabled: false,
        maxFileCount: 1,
        allowedFileExtensions: ['pdf'],
    });

    
    $('.btn-modal-feed-document-close').on('click', function(e){
        e.preventDefault();
            
        $('#modal-feed-document-box').modal('hide');
        return false;
    });


    $('a.fa-camera').on('click', function(e){
        e.preventDefault();

        $('#form-feed-image #shared_with').val('');
        $('#form-feed-image #file').val('');
        CKEDITOR.instances.description_image.setData('');

        $('#form-feed-image')[0].reset()
        validatorFeedImage.resetForm();
        $('#modal-feed-image-box').modal('show');
    });

    $('#form-feed-image #file').fileinput({
        theme: 'fa',
        language: 'es',
        showUpload: false,
        dropZoneEnabled: false,
        maxFileCount: 1,
        allowedFileExtensions: ['jpg', 'jpeg', 'png', 'gif'],
    });

    
    $('.btn-modal-feed-image-close').on('click', function(e){
        e.preventDefault();
            
        $('#modal-feed-image-box').modal('hide');
        return false;
    });


    $('a.fa-video-camera').on('click', function(e){
        e.preventDefault();

        $('#form-feed-video #shared_with').val('');
        $('#form-feed-video #file').val('');
        CKEDITOR.instances.description_video.setData('');


        $('#form-feed-video')[0].reset()
        validatorFeedVideo.resetForm();
        $('#modal-feed-video-box').modal('show');
    });

    $('#form-feed-video #file').fileinput({
        theme: 'fa',
        language: 'es',
        showUpload: false,
        dropZoneEnabled: false,
        maxFileCount: 1,
        allowedFileExtensions: ['mp4', 'mpeg','webm'],
    });

    
    $('.btn-modal-feed-video-close').on('click', function(e){
        e.preventDefault();
            
        $('#modal-feed-video-box').modal('hide');
        return false;
    });

    $('body').on('click', 'a.btn-indicator', function(e) {
    
        e.preventDefault();
    });



   


    $('body').on('submit', 'form.form-comment-feed', function(e) {
        e.preventDefault();

        var form = $(this);
        var url = form.attr('action');
        var unique  = $(this).data('feed-unique');

        NProgress.start();
        $.ajax({
            'dataType'  : 'json',
            'accept'    : 'application/json',
            'method'    : 'post',
            'url'       :  url,
            'data'      : form.serialize(),
        }).done(function(response) {
            if(response['success']) {
                $('#comment-' + unique).val('');

                var s = $( "#commentTemplate" ).render( response['data'] );
                $(s).appendTo('.comment-sec-' + unique + ' ul');  

                $('#btn-comments-' + unique).html('<i class="fa fa-comments"></i> ' + response['total_comments']);

                $('form.form-comment-feed > input[name="comment"]').val('');
                
            } else {
               $.fn.showError(response['data']);
            }
        }).fail(function( jqXHR, textStatus, errorThrown) {
            $.fn.showError(textStatus);
        }).always(function() {
            NProgress.done();
        });
        return false;

    });


    $.fn.deleteFeed = function(url, feed_unique) {


        NProgress.start();
        $.ajax({
            'dataType'  : 'json',
            'accept'    : 'application/json',
            'method'    : 'post',
            'url'       :  url,
        }).done(function(response) {
            if(response['success']) {
              $('.post-bar-' +  feed_unique).remove();

                $.fn.showSuccess(response['data']);
            } else {
                $.fn.showError(response['data']);
            } 
        }).fail(function( jqXHR, textStatus, errorThrown) {
            $.fn.showError(textStatus);
        }).always(function() {
            NProgress.done();
        });

    }

    $('body').on('click', 'a.btn-feed-trash', function(e) {
        e.preventDefault();
        var url = $(this).data('link');
        var feed_unique = $(this).data('feed-unique');

        


        bootbox.confirm({
            message: 'Esta seguro de borrar esta publicación',
            buttons: {
                confirm: {
                    label: 'Si',
                    className: 'btn-danger'
                },
                cancel: {
                    label:  'No',
                    className: 'btn-default'
                }
            },
            callback: function (result) {
               if(result) {
                    $.fn.deleteFeed(url, feed_unique);
                }
            }
        });
    });


    $.fn.deleteComment = function(url, unique) {

         var feed_unique = $('.comment-' + unique).closest('div.comment-sec').data('feed-unique');

        NProgress.start();
        $.ajax({
            'dataType'  : 'json',
            'accept'    : 'application/json',
            'method'    : 'post',
            'url'       :  url,
        }).done(function(response) {
            if(response['success']) {

                $('.comment-' + unique).closest('li').remove();
                $('#btn-comments-' + feed_unique).html('<i class="fa fa-comments"></i> ' + response['data']['total_comments']);
            
                $.fn.showSuccess(response['data']['message']);
            } else {
                $.fn.showError(response['data']);
            } 
        }).fail(function( jqXHR, textStatus, errorThrown) {
            $.fn.showError(textStatus);
        }).always(function() {
            NProgress.done();
        });


    }


    $('body').on('click', 'a.btn-comment-trash', function(e) {
        e.preventDefault();
        var url = $(this).data('link');
        var unique = $(this).data('comment-unique');
        

        bootbox.confirm({
            message: 'Esta seguro de borrar este comentario',
            buttons: {
                confirm: {
                    label: 'Si',
                    className: 'btn-danger'
                },
                cancel: {
                    label:  'No',
                    className: 'btn-default'
                }
            },
            callback: function (result) {
               if(result) {
                   $.fn.deleteComment(url, unique);
                }
            }
        });
    });


    $('div.modal').on("hide.bs.modal", function() {
        $(".wrapper").removeClass("overlay");
    })


    $.fn.reload(1);

    CKEDITOR.replace('description_feed');
    CKEDITOR.replace('description_video');
    CKEDITOR.replace('description_image');
    CKEDITOR.replace('description_document');


});


JS;
$this->inlineScript()->captureEnd();

?>

    <section class="content-header">
        <div class="container-fluid">
                <div class="row mb-2">
                <div class="col-sm-12">
                        <h1>LABEL_FEEDS</h1>
                        </div>
                </div>
        </div><!-- /.container-fluid -->
    </section>

    
    <section class="content">
        <div class="container-fluid">
                <div class="feed-container">
                <div class="">
                    <div class="main-ws-sec">
                        <div class="">
                            <div class="">
                                <div class="post-bar">
                                    <form id="form-main" name="form-main">
                                        <div class="post_topbar">

                                            <div class="mar-top clearfix">
                                                <div class="form-group">
                                                </div>
                                                <div class="form-group">
                                                    <textarea id="description-main" name="description-main" placeholder="¿Qué tienes en mente?" class="form-control" readonly="readonly" rows="2"></textarea> 
                                                </div>
                                            </div>      
                                            <div class="mar-top clearfix">
                                                <button class="btn btn-sm btn-primary pull-right" type="button" id="btn-description-main"><i class="fa fa-pencil fa-fw"></i> LABEL_SHARE </button>
                                                <a class="btn btn-trans btn-icon fa fa-video-camera add-tooltip" href="#"></a>
                                                <a class="btn btn-trans btn-icon fa fa-camera add-tooltip" href="#"></a>
                                                <a class="btn btn-trans btn-icon fa fa-file add-tooltip" href="#"></a>
                                            </div>
                                        </div>
                                    </form>
                                </div>
                            </div>
                        </div>
                            <!--posts-section star-->
                        <div class="posts-section" >
                            
                        </div>
                            
                        <div class="process-comm" id="paginator-process-comm" style="display: none"> 
                            <button class="btn btn-sm btn-primary" data-page="0" id="btn-page-previous"> <i class="fa fa-chevron-left" aria-hidden="true"></i> LABEL_PREVIOUS </button>
                            <button class="btn btn-sm btn-primary" data-page="0" id="btn-page-next"> LABEL_NEXT <i class="fa fa-chevron-right" aria-hidden="true"></i> </button>
                        </div>
                            <!--posts-section end-->
                    </div>
                </div> <!--main-ws-sec end-->
                    </div>
            </div>
    </section>                  


<div class="modal" tabindex="-1" role="dialog" id="modal-feed-image-box">
        <div class="modal-dialog" role="document">
                <?php 
                $form = $this->formFeed;
        $form->setAttributes([
            'method' => 'post',
            'action' => $this->url('feeds/add'),
            'name' => 'form-feed-image',
            'id' => 'form-feed-image',
            'enctype' => 'multipart/form-data' 
        ]);
        $form->prepare();
        echo $this->form()->openTag($form);
        
        
        ?> 
                <div class="modal-content">
                <div class="modal-header">
                        <h3 class="modal-title">LABEL_SHARE_IMAGE</h3>
                </div>
                        <div class="modal-body">
                <div class="form-group">
                        <?php 
                    $element = $form->get('description');
                    $element->setAttributes(['id' => 'description_image', 'rows' => '2', 'placeholder' => '¿Qué tienes en mente?', 'class' => 'form-control']);
                    echo $this->formTextArea($element);
                    ?>
                                </div>
                                <div class="form-group">
                        <div class="file-loading">
                                <?php 
                        $element = $form->get('file');
                        $element->setAttributes(['accept' => 'image/jpg,image/jpeg,image/png']);
                        echo $this->formFile($element);
                        ?>
                        </div>
                        </div>
                </div>  
                <div class="modal-footer">
                        <button type="submit" class="btn btn-sm btn-primary save">LABEL_UPLOAD</button>
                <button type="button" class="btn btn-sm btn-default cancel btn-modal-feed-image-close">LABEL_CANCEL</button>
                        </div>
                        
                </div>  
        <a href="#" title="" class="close-box btn-feed-image-close"><i class="la la-close"></i></a>
        <?php echo $this->form()->closeTag($form); ?>           
        </div>
</div>


<div class="modal" tabindex="-1" role="dialog" id="modal-feed-video-box">
        <div class="modal-dialog" role="document">
                <?php 
                $form = $this->formFeed;
        $form->setAttributes([
            'method' => 'post',
            'action' => $this->url('feeds/add'),
            'name' => 'form-feed-video',
            'id' => 'form-feed-video',
            'enctype' => 'multipart/form-data' 
        ]);
        $form->prepare();
        echo $this->form()->openTag($form);
        

        ?> 
                <div class="modal-content">
                <div class="modal-header">
                        <h3 class="modal-title">LABEL_SHARE_VIDEO</h3>
                </div>
                        <div class="modal-body">
                <div class="form-group">
                        <?php 
                    $element = $form->get('description');
                    $element->setAttributes(['id' => 'description_video', 'rows' => '2', 'placeholder' => '¿Qué tienes en mente?', 'class' => 'form-control']);
                    echo $this->formTextArea($element);
                    ?>
                                </div>
                                <div class="form-group">
                        <div class="file-loading">
                                <?php 
                        $element = $form->get('file');
                        $element->setAttributes(['accept' => 'video/webm,video/mpeg,video/mp4']);
                        echo $this->formFile($element);
                        ?>
                        </div>
                        </div>
                </div>
                <div class="modal-footer">
                <button type="submit" class="btn btn-sm btn-primary save">LABEL_UPLOAD</button>
                <button type="button" class="btn btn-sm btn-default cancel btn-modal-feed-video-close">LABEL_CANCEL</button>
                </div>
                        
                </div>  
        <a href="#" title="" class="close-box btn-feed-video-close"><i class="la la-close"></i></a>
        <?php echo $this->form()->closeTag($form); ?>           
        </div>
</div>

<div class="modal" tabindex="-1" role="dialog" id="modal-feed-document-box">
        <div class="modal-dialog" role="document">
                <?php 
                $form = $this->formFeed;
        $form->setAttributes([
            'method' => 'post',
            'action' => $this->url('feeds/add'),
            'name' => 'form-feed-document',
            'id' => 'form-feed-document',
            'enctype' => 'multipart/form-data' 
        ]);
        $form->prepare();
        echo $this->form()->openTag($form);
        

        
        ?> 
                <div class="modal-content">
                <div class="modal-header">
                        <h3 class="modal-title">LABEL_SHARE_DOCUMENT</h3>
                </div>
                        <div class="modal-body">
                <div class="form-group">
                        <?php 
                    $element = $form->get('description');
                    $element->setAttributes(['id' => 'description_document', 'rows' => '2', 'placeholder' => '¿Qué tienes en mente?', 'class' => 'form-control']);
                    echo $this->formTextArea($element);
                    ?>
                                </div>
                                <div class="form-group">
                        <div class="file-loading">
                                <?php 
                        $element = $form->get('file');
                        $element->setAttributes(['accept' => 'application/pdf']);
                        echo $this->formFile($element);
                        ?>
                        </div>
                        </div>
                </div>  
            <div class="modal-footer">
                <button type="submit" class="btn btn-sm btn-primary save">LABEL_UPLOAD</button>
                <button type="button" class="btn btn-sm btn-default cancel btn-modal-feed-document-close">LABEL_CANCEL</button>
            </div>
                </div>  
        <a href="#" title="" class="close-box btn-feed-document-close"><i class="la la-close"></i></a>
        <?php echo $this->form()->closeTag($form); ?>           
        </div>
</div>

<div class="modal" tabindex="-1" role="dialog" id="modal-feed-box">
        <div class="modal-dialog" role="document">
                <?php 
                $form = $this->formFeed;
        $form->setAttributes([
            'method' => 'post',
            'action' => $this->url('feeds/add'),
            'name' => 'form-feed',
            'id' => 'form-feed',
        ]);
        $form->prepare();
        echo $this->form()->openTag($form);
        

        
        ?> 
                <div class="modal-content">
                <div class="modal-header">
                        <h3 class="modal-title">LABEL_SHARE</h3>
                </div>
                        <div class="modal-body">
                <div class="form-group">
                        <?php 
                    $element = $form->get('description');
                    $element->setAttributes(['id' => 'description_feed', 'rows' => '2', 'placeholder' => '¿Qué tienes en mente?', 'class' => 'form-control']);
                    echo $this->formTextArea($element);
                    ?>
                                </div>
                        </div>  
            <div class="modal-footer">
                <button type="submit" class="btn btn-sm btn-primary save">LABEL_SAVE</button>
                <button type="button" class="btn btn-sm btn-default cancel btn-modal-feed-close">LABEL_CANCEL</button>
            </div>
                </div>  
        <a href="#" title="" class="close-box btn-modal-feed-close"><i class="la la-close"></i></a>
        <?php echo $this->form()->closeTag($form); ?>           
        </div>
</div>




<script id="commentTemplate" type="text/x-jsrender">
                    <li>
                                        <div class="comment-list">
                                                         <div class="comment comment-{{:unique}}" >
                                                 <a href="{{>user_url}}"><h3>{{>user_name}}</h3>
                                                     <span><img src="<?php echo $this->basePath('images/clock.png') ?>" alt="">{{>time_elapsed}} 
                                {{if link_delete}}
                                    <a href="#" class="btn-comment-trash" data-link="{{:link_delete}}" data-comment-unique="{{>unique}}"><i class="fa fa-trash"></i></a> 
                                {{/if}}
                                 </span>
                                
                                                                 <p>{{>comment}}</p>
                                                     </div>
                           </div>
                       </li>
</script>

<script id="feedTemplate" type="text/x-jsrender">
    <div class="post-bar post-bar-{{>feed_unique}}">
        <div class="post_topbar">
            <div class="usy-dt">
                <a href="{{>owner_url}}">
                    <img src="{{>owner_image}}" alt="" style="width:50px; height: auto">
                    <div class="usy-name">
                        <h3>{{>owner_name}}</h3>
                        <span>
                            <img src="<?php echo $this->basePath('images/clock.png') ?>" alt="">
                            {{>owner_time_elapse}} 
                            {{if feed_delete_url}}  
                                <a href="#" class="btn-feed-trash" data-link="{{:feed_delete_url}}" data-feed-unique="{{>feed_unique}}"><i class="fa fa-trash"></i></a>
                            {{/if}}
                        </span>  
                    </div>
                </a>
            </div>
        </div>
        <div class="job_descp">
            <p>
            <div  class="show-read-more">{{:owner_description}}</div>
            </p>
            {{if owner_file_image}}
             <img src="{{>owner_file_image}}" class="Entradas">
            {{/if}}
            {{if owner_file_video}}
             <video src="{{>owner_file_video}}" controls  poster="{{>owner_file_image_preview}}">
            {{/if}}
            {{if owner_file_document}}
                <a href="{{>owner_file_document}}" target="_blank">Descargar</a>
            {{/if}}

    {{if shared_name}}
    <div class="post-bar">
        <div class="post_topbar">
            <div class="usy-dt">
                <img src="{{>shared_image}}" alt="" style="width:50px; height: auto">
                <div class="usy-name">
                    <h3>{{>shared_name}}</h3>
                    <span><img style="width: 12px; height: auto" src="<?php echo $this->basePath('images/clock.png') ?>" alt="">{{>shared_time_elapse}}</span>       
                </div>
            </div>
        </div>
        <div class="job_descp">
            <p>
            <div  class="show-read-more">{{:shared_description}}</div>
            </p>
            {{if shared_file_image}}
             <img src="{{>shared_file_image}}" class="Entradas">
            {{/if}}
            {{if shared_file_video}}
             <video src="{{>shared_file_video}}" controls  poster="{{>shared_file_image_preview}}">
            {{/if}}
            {{if shared_file_document}}
                <a href="{{>shared_file_document}}" target="_blank">Descargar</a>
            {{/if}}
        </div>
    </div>
    {{/if}}


        </div>
        <div class="job-status-bar">
            <ul class="like-com">
                <li>
                    <a href="#" id="btn-comments-{{>feed_unique}}" class="btn-indicator"><i class="fa fa-comments"></i> {{>owner_comments}}</a>
                </li>
                <li>
                    <a href="#" id="btn-share-{{>feed_unique}}" class="btn-indicator"><i class="fa fa-share"></i> {{>owner_shared}}</a>
                </li>
            </ul>
         
        </div>
        {{if comments}}
            <div class="comment-section">
                <div class="comment-sec comment-sec-{{>feed_unique}}" data-feed-unique="{{>feed_unique}}">
                    <ul>
                        {{for comments}}
                            <li>
                                <div class="comment-list">
                                    <div class="comment comment-{{:unique}}" >
                                        <span><img src="<?php echo $this->basePath('images/clock.png') ?>" alt="">{{>time_elapsed}} 
                                        <a href="{{>user_url}}"><h3>{{>user_name}}</h3>
                                        {{if link_delete}}
                                            <a href="#" class="btn-comment-trash" data-link="{{:link_delete}}" 
                                                data-comment-unique="{{>unique}}"><i class="fa fa-trash"></i></a> 
                                        {{/if}}
                                        </span>
                                        
                                        <p>{{>comment}}</p>
                                    </div>
                                </div>
                            </li>
                        {{/for}}
                    </ul>
                </div>
            </div>
        {{/if}}
        <div class="comment_box">
            <form  class="form-comment-feed" data-feed-unique="{{>feed_unique}}"  action="{{>comment_add_url}}">
                <input type="text" name="comment" id="comment-{{>feed_unique}}" maxlength="256"  placeholder="LABEL_WRITE_A_COMMENT">
                <button type="submit">LABEL_SEND</button>
            </form>
        </div>
    </div>
</script>