@extends('layouts.app')

@section('title', ($product->id > 0 ? 'Edit Kit' : 'Add Kit').' | Products')

@section('extrastyles')
    <link rel="stylesheet" href="{{ asset('plugins/summernote/summernote.css') }}">
    <link rel="stylesheet" href="{{ asset('plugins/summernote/summernote-bs3.css') }}">
    <link rel="stylesheet" href="{{ asset('plugins/select2/select2.css') }}">
    <link href="{{ asset('/plugins/dropzone/basic.css') }}" rel="stylesheet">
    <link href="{{ asset('/plugins/dropzone/dropzone.css') }}" rel="stylesheet">
    <link rel="stylesheet" href="{{ asset('/plugins/bootstrap-datetimepicker/css/bootstrap-datetimepicker.min.css') }}" />
    <style>
        .modal-backdrop{
            opacity: 0.5 !important;
        }
        .note-editable ,.note-editing-area{
            min-height: 200px;
        }
        .mogo_image_gallery {
            overflow-y: hidden;
            overflow-x: hidden;
        }
        #image_gallery_listing li {
            position: relative;
        }
        #image_gallery_listing li input[type=checkbox] {
            position: absolute;
            left:0px;
            top:-3px;
        }
        .head_label {
            font-size: 17px !important;
        }
        #attributeIds {
            min-height: 300px;
        }
        .form-control option[disabled]{
            cursor: not-allowed;
            color: rgb(194, 194, 194);
        }
        .dropzone {
            min-height: 250px;
        }
        .options-pro input {
            width: 100px;
            display: inline-block;
        }
        #option-items-list .options-pro{
            margin-bottom: 15px;
        }
        #option-items-list .meta_title{
            padding-top: 9px;
        }
        .loader-image img,.product_option_image_list li img{
            max-width: 150px;
            max-height: 150px;
        }
        .product_media ,.product_option_image_list{
            width: 100%;
            float: left;
            list-style: none;
            padding: 0px;
            margin: 0px;
            margin-top: 15px;
        }
        .product_media li , .product_option_image_list li{
            float: left;
            list-style: none;
            margin-right: 10px;
            margin-bottom: 10px;
            position: relative;
            max-width: 150px;
        }
        .product_media li a.remove-image ,.product_option_image_list li .remove_slide_image{
            position: absolute;
            right: 6px;
            top: 0px;
            color: red;
            font-size: 15px;
        }
        .product_option_image_list li.selected {
            border: 2px solid red;
        }
        #option-items-list .product_option_image_btn {
            margin-right: 10px;
        }
        p.attribute strong {
            min-width: 125px;
            float: left;
        }
        .ibox-custom .panel-custom {
            display: block !important;
        }
        .meta_title_preview {
            font-size: 16px;
            line-height: 2.1rem;
            color: #1a0dab;
            margin-bottom: .2rem;
        }
        .meta_description_preview{
            color: #4d5156;
            line-height: 1.58;
            word-wrap: break-word;
            font-size: 14px;
        }
        .meta_url_preview {
            line-height: 1.6rem;
            color: #006621;
            font-size: 14px;
        }
        .pro_tab_panel_head {
            font-size: 16px;
            padding: 5px 20px;
        }
        .pro_tab_panel_head .tabTitle {
            margin-left: 5px;
        }
        .select2-container {
            z-index: 99999;
        }
    </style>
@endsection

@section('content')
    <div id="updatePage">
        {!! Form::open(['novalidate' => 'novalidate', 'onsubmit' => 'return savePage(this);']) !!}
        <input type="hidden" name="page_id" value="" />
        <div class="clearfix"></div>
        <div class="studio98_websters">
            <div class="row">
                <div class="col-lg-8">
                    <div class="ibox float-e-margins">
                    <div class="ibox-title2">
                        <h5>{{ $product->id > 0 ? 'Edit Kit' : 'Add Kit' }}</h5>
                        <div class="ibox-tools">
                            <a class="collapse-link" href="">
                                <i class="fa fa-angle-up"></i>
                            </a>
                        </div>
                    </div>
                        <div class="ibox-content p-md">
                            @include('flash::message')
                            @include('errors._form')
                            <div class="col-lg-12">
                                <div class="clearfix"></div>
                                <div class="form-group">
                                    {!! Form::label('title','Title') !!}
                                    {!! Form::text('title' , $product->title , ['class' => 'form-control','placeholder' => 'Title','required'=>'true']) !!}
                                </div>
                                <div class="form-group">
                                    {!! Form::label('description','Description') !!}
{{--                                    <div class="summernote">{!!  $product->content !!}</div>--}}
{{--                                    <input type="hidden" id="post-content" name="content" value="" />--}}
{{--                                    <div class="clearfix"></div>--}}
                                    {!! RTEForm::rte('content', $product->content) !!}
                                </div>
                            </div>
                        </div>
                    </div>
	                                    @if( !empty($apiKey) )
                        @include('Product::product._partials_form.ds_errors')
                    @endif
                    @include('Product::product._partials_form.basic_info')
                    @include('Product::product._partials_form._pricing')
                    @include('Product::product._partials_form._upload')
                    @if($product->id > 0)
                        @include('Product::kitting.kit_setting')
                        @include('Product::product._partials_form._tabs')
                    @endif
                </div>
                <div class="col-lg-4">
                    @include('Product::product._partials_form.publish')
                    @include('Product::product._partials_form._categories')
                    @include('Product::product._partials_form.subscription')
                    @include('Product::product._partials_form.attribute_form')
                    @include('Product::product._partials_form.product_specification')
                    @if($product->id)
                        @include('Product::product._partials_form.product_tag')
                    @endif
                    @include('Product::product._partials_form.advance')
                </div>
            </div>
        </div>
    </div>
    {!! Form::close() !!}

    @include('Product::product._product_popup')

    @include('Website::layout._gallery_popup')
@endsection

@section('footer')
    <script src="{{ asset('/plugins/dropzone/dropzone.js') }}"></script>
    <script src="{{ asset('/plugins/select2/select2.js') }}"></script>
    <script src="{{ asset('/plugins/summernote/summernote.min.js') }}"></script>
    <script src="{{ asset('/plugins/dateRangePicker/moment.js') }}" ></script>
    <script src="{{ asset('/plugins/bootstrap-datetimepicker/js/bootstrap-datetimepicker.min.js') }}" ></script>

    <script>

        $(document).on('click', '.add_product', function (){
            productSelect();
            $('#add_kitting_product').modal('show');
        });

        function productSelect(){
            $( ".product_id_select" ).select2({
                multiple: true,
                placeholder: "-- Select Product --",
                minimumInputLength: 2,
                maximumSelectionLength: 10,
                tags: false,
                ajax: {
                    url: "{{ ecommerce_url('kitting/search-product')}}",
                    dataType: 'json',
                    data: function (params) {

                        var queryParameters = {
                            term: params.term
                        }
                        return queryParameters;
                    },
                    processResults: function (data) {
                        return {
                            results: $.map(data, function (item,id) {
                                return {
                                    text: item,
                                    id: id
                                }
                            })
                        };
                    }
                }
            });
        }


        function addKittingProduct(){
            var data = $("#add_kitting_product form").serialize();
            var btn = $("#add_kitting_product button[type=submit]");

            processBtnDisable(btn);
            var btn_text = 'Save';
            $.ajax({
                method: 'POST',
                url: '{{ ecommerce_url('kitting/add-product/'.$product->id)}}',
                data: data,
                dataType: "json"
            }).done(function(response) {
                revertProcessBtnDisable(btn, btn_text);
                toastrShow("Product has been saved Successfully!", "Success");
                location.reload();
            }).fail(function(response) {
                toastrShow("Error occurred", "Success");
                response = response.responseJSON;
                $.each(response.errors, function(i, item) {
                    $('#product_option_add #'+i).css('border-color','red');
                });
                revertProcessBtnDisable(btn,btn_text);
            });
            return false;
        }

        function deleteKitProduct(id){
            if(confirm('Are you sure you want to delete?')) {
                $.ajax({
                    method: 'POST',
                    url: '{{ ecommerce_url('kitting/delete-product/')}}/'+id,
                }).done(function(response) {
                    toastrShow('Product has been deleted Successfully!','Success');
                    $('.kit_product_'+id).remove();
                });
            }
        }

        $(document).on('click', '.remove_tab_item', function () {
            $(this).closest('.panel-default').remove();
        });
        $(document).on('change', '.pro_tab_title', function () {
            var tabTitle = $(this).val();
            $(this).closest('.panel-default').find('.tabTitle').text(tabTitle);
        });
        $(document).on('change', 'select[name=region_id], select[name=currency_id]', function () {
            var region_id = $('select[name=region_id]').val();
            var currency_id = $('select[name=currency_id]').val();
            $('.region_price').hide();
            $('#region-'+region_id+'-currency-'+currency_id).show();
        });

        $(document).ready(function () {
            initializeSummerNote();
            @if( !empty($apiKey) )
                syncDsErrors();
            @endif
            $('select[name=region_id]').change();

            $( "#accordion" ).sortable({
                axis: 'y',
                handle: '.child-item-drag-icon',
            });

            $('.add_pro_tab').click(function () {
                var copy    = $('#default_tab_one').html();
                var random  = Math.floor( Math.random() * 100000 );
                try {
                    copy = copy.replaceAll("collapseOne", "collapse" + random);
                } catch (e) {
                    copy = copy.replace("collapseOne", "collapse" + random);
                }
                if(copy.indexOf("collapseOne") > -1) {
                    copy = copy.replace("collapseOne", "collapse" + random);
                }
                copy = copy.replace('summernote_default_tab_one', 'summernote');
                $('#accordion').append('<div class="panel panel-default">'+copy+'</div>');

                $( "#accordion" ).sortable({
                    axis: 'y',
                    handle: '.child-item-drag-icon',
                });
                initializeSummerNote();


                var lastItem = $('#accordion').find('.panel:last-child');
                const uniqueId = Math.floor(Math.random() * 100);
                const rteId = $(lastItem).find('.rte-form-editor').attr('id');
                $(lastItem).find('.rte-form-editor').attr('id', rteId + '_' + uniqueId);
                initFormRteEditorAgain($(lastItem).find('.rte-form-editor').attr('id'));


                $('input[name=tb_is_builder]').change(function (e) {
                    const value = $(this).val();
                    $('.newTabDuplicate').hide();
                    $('.newTabDesc').hide();
                    if(value == 1) {
                        $('.newTabDuplicate').show();
                    } else {
                        $('.newTabDesc').show();
                    }
                })
            });

            $('#role_id,#region_id,.options-pro select').select2();

            $('.slug_txt').keyup(function() {
                var value = clearUrl($(this).val());
                $(this).val(value);
            });

            $('#pro_slug').keyup(function() {
                var value = clearUrl($(this).val());
                $(this).val(value);
                $('#pro_slug_preview').text(value);
            });

            $('#slug_brand').keyup(function() {
                var value = clearUrl($(this).val());
                $(this).val(value);
                $('#brand_slug_preview').text(value);
            });

            $('#slug_sku').keyup(function() {
                var value = clearUrl($(this).val());
                $(this).val(value);
                $('#sku_slug_preview').text(value);
            });
            $('#pro_meta_title').keyup(function() {
                var lenghtStr = $(this).val().length;
                $('.meta_title_preview').text($(this).val());
                $(this).closest('.form-group').find('p').text(lenghtStr+' of 70 Characters used');
            });
            $('#pro_meta_description').keyup(function() {
                var lenghtStr = $(this).val().length;
                $('.meta_description_preview').text($(this).val());
                $(this).closest('.form-group').find('p').text(lenghtStr+' of 160 Characters used');
            });

            @if($product->id > 0)

            @else
                $('input[name=title]').keyup(function() {
                    var title = clearUrl($(this).val());
                    $('input[name=str_slug]').val(title);
                });
                $('input[name=basic_sku]').keyup(function() {
                    var text = $(this).val();
                    $('input[name=slug_sku]').val(text);
                });

                $('#ecommerce_brand').change(function() {
                    var brand = $(this).children("option:selected").text();
                    brand  = brand == 'Select' ? '' : brand;
                    brand = clearUrl(brand);
                    $('input[name=slug_brand]').val(brand);
                });
            @endif

            dateTimePicker('#published_date', 'YYYY-MM-DD HH:mm:ss');

            $('.pro_specs').click(function () {
                var spec_name = $('#spec_name').val();
                var spec_value = $('#spec_value').val();
                var isProPrivate = $('.proSpecification input[name=isProPrivate]').is(':checked');
                var specsValue = spec_name;
                if(isProPrivate == true){
                    specsValue = '_'+spec_name;
                }
                if(spec_name !== '' && spec_value !== '') {
                    var html = '<div class="row pro-data product-spec mb-4"><p class="clearfix product-spec">\n' +
                        '        <div class="pro-spec-name col-lg-5"><input type="text" name="pro_specification_name" class="pro_specification_name form-control" value="'+spec_name+'"></div>\n' +
                        '        <div class="pro-specification-value col-lg-5"><input type="text" name="pro_specification_value" class="pro_specification_value form-control" value="'+spec_value+'"></div>\n' +
                        '        <div class="col-lg-2"><input class="mt-2 isPrivate" name="isPrivate" type="checkbox" value="1" '+((isProPrivate == true) ? 'checked' : '')+' />' +
                        '        <a href="javascript:void(0)" class="remove-spec pull-right" title="Delete"><i class="fa fa-trash-o"></i></a>\n' +
                        '        <input type="hidden" name="product_specs[]" value="'+specsValue+'|'+spec_value+'">\n' +
                        '    </p></div>';
                    $('#product-specs-list').append(html);
                    $('#spec_name').val('');
                    $('#spec_value').val('');
                    $('.proSpecification input[name=isProPrivate]').prop('checked',false);
                }
            });

            $(document).on('blur', '.product-specs-list input', function (){
                var pro_specification_name = $(this).closest('.pro-data').find('.pro_specification_name').val();
                var pro_specification_value = $(this).closest('.pro-data').find('.pro_specification_value').val();
                var isProPrivate = $(this).closest('.row').find('input[name=isProPrivate]').is(':checked');
                if (isProPrivate == true){
                    pro_specification_name = '_'+pro_specification_name;
                }
                $(this).closest('.pro-data').find('.product_specs_data').val(pro_specification_name + '|' + pro_specification_value);
            });

            $('.product_media').sortable({
                forcePlaceholderSize: true,
                opacity: 1,
                update: function (event, ui) {
                    var order = $(this).sortable('serialize');
                    $.ajax({
                        data: order,
                        type: 'POST',
                        url: "{{ ecommerce_url('product/image-order/'.$product->id)  }}&_token={{ csrf_token() }}"
                    });
                }
            }).disableSelection();

            $(document).on('click', '.sync_stock', function (){
                    $.ajax({
                        method: 'POST',
                        url: '{{ ecommerce_url('product/stock-sync/'.$product->id)}}',
                        data: '_token='+csrf_token
                    }).done(function() {
                        toastrShow('Sync job is queued!','Success');
                    });
            });
            $(document).on('click', '.sync_product', function (){
                    $.ajax({
                        method: 'POST',
                        url: '{{ ecommerce_url('product/product-sync/'.$product->id)}}',
                        data: '_token='+csrf_token
                    }).done(function() {
                        toastrShow('Sync job is queued!','Success');
                    });
            });

        });

        function addTabProduct() {
            var data = $('#accordion .grs-form :input,#accordion .grs-form :selected').serialize();
            $.ajax({
                method: 'POST',
                url: '{{ ecommerce_url('product/new-tab/'.$product->id)}}',
                data: data
            }).done(function() {
                location.reload();
            }).fail(function(response) {
                response = response.responseJSON;
                var message = '';
                $.each(response.errors, function(i, item) {
                    $('[name='+i+']').css('border-color','red').focus();
                    message += item[0]+'<br />';
                });
                if(message != '') {
                    toastrShowError(replaceAll(message, 'tb ', ''),'Error');
                }
            });
            return false;
        }

        function replaceAll(str, find, replace) {
            return str.replace(new RegExp(find, 'g'), replace);
        }

        function syncDsErrors() {
            $.ajax({
                type: 'POST',
                url: '{{ ecommerce_url('product/ds-errors/' . $product->id) }}',
                data: '_token={{ csrf_token() }}',
                dataType: 'json',
            }).done(function (response) {
                const errors = response.errors;
                if( errors.role || errors.region || errors.prices || errors.type ) {
                    $('.errors-list').html();
                    $('.price_errors').hide();
                    $('.price_errors').find('.tbody').html('');
                    $('.product-ds-errors').show();
                    if( errors.type ) {
                        $('.errors-list').append(`<li class="bold">${errors.type}</li>`);
                    }
                    if( errors.role ) {
                        $('.errors-list').append(`<li class="bold">${errors.role}</li>`);
                    }
                    if( errors.region ) {
                        $('.errors-list').append(`<li class="bold">${errors.region}</li>`);
                    }
                    if( !!errors.prices.length ) {
                        $.each(errors.prices, function (index, error) {
                            $('.price_errors').find('tbody').append(`
                                <tr>
                                    <td>${error.region}</td>
                                    <td>${error.type}</td>
                                    <td>${error.roles}</td>
                                    <td>Prices are not available in Direct Scale</td>
                                </tr>
                            `);
                        });
                        $('.price_errors').show();
                    }
                }else{
                    $('.product-ds-success').show();
                }
            });
        }

        Dropzone.options.dropzoneForm = {
            paramName: "file",
            maxFilesize: 20, // MB
            dictDefaultMessage: "<strong>Drop files here or click to upload. </strong>",
            uploadMultiple: true,
            acceptedFiles: ".jpeg,.jpg,.png,.gif",
            maxFiles: 50,
            parallelUploads: 50,
            params : {_token : csrf_token },
            dictFileTooBig: 'Image size has a 20MB Limit. Please upload a smaller image.if someone tries to upload a larger one.',
            url: '{{ ecommerce_url('product/upload-file/'.$product->id)  }}',
            init: function () {
                this.on('maxfilesreached', function () {
                    toastrShow('Error!','Image size has a 20MB Limit. Please upload a smaller image.if someone tries to upload a larger one.');
                    return false;
                });
                this.on('maxfilesexceeded', function () {
                    toastrShow('Error!','Image size has a 20MB Limit. Please upload a smaller image.if someone tries to upload a larger one.');
                    return false;
                });
                this.on("successmultiple", function(file, response) {
                    response = JSON.parse(response);

                    $(response).each(function(i,filePath) {
                        $('.upload-media-main ul.product_media').append('<li id="image-'+filePath.id+'" class="loader-image" data-id="'+filePath.id+'"><input type="hidden" name="pro_upload_files[]" value=\'' + JSON.stringify(filePath.additional_data) + '\'><a href="javascript:void(0)" class="remove-image"> x </a><img src="'+filePath.file_path+'"></li>');
                    });
                });
            },
        };

        $(document).on('click', '.remove-image', function (){
            if(confirm('Are you sure you want to delete?')) {
                var potta = $(this).closest('li');
                var media_id = potta.data('id');
                var item_id = potta.data('item');
                $.ajax({
                    method: 'POST',
                    url: '{{ ecommerce_url('product/media-delete/'.$product->id)}}',
                    data: 'media_id='+media_id+'&_token='+csrf_token+'&item_id='+item_id,
                }).done(function() {
                    potta.remove();
                });
            }
        });

        function clearUrl(text) {
            text = text.replace(' ','-');
            text = text.toLowerCase();
            return text.replace(/[^a-zA-Z0-9-\/]/g,'-');
        }
        function savePage(object)
        {
            /*var sHTML = $('.summernote').summernote('code');
            $('#post-content').val(sHTML);
            $('.proDbTabs').find('.summernote').each(function () {
                var sHTML = $(this).summernote('code');
                $(this).closest('.form-group').find('input[type="hidden"]').val(sHTML);
            });*/

            return true;
        }

        function embedProductVideo(object)
        {
            const link = $("#product_embed_video form").find('#video_link').val();
            if(!validURL(link)) {
                toastrShowError('Error','Please provide a valid link');
                return false;
            }
            var data = $("#product_embed_video form").serialize();
            var btn = $("#product_embed_video button[type=submit]");
            processBtnDisable(btn);
            var btn_text = 'Embed Video';
            $.ajax({
                method: 'POST',
                url: "{{ ecommerce_url('product/embed-video/'.$product->id)  }}",
                data: data,
                dataType: "json"
            }).done(function(response) {
                if(!response.success) {
                    let message = 'Please provide a valid link';
                    if(response.messsage) {
                        message = response.messsage;
                    }
                    toastrShowError('Error',message);
                    return false;
                } else{
                    $(response.data).each(function(i,filePath) {
                        $('.upload-media-main ul.product_media').append('<li id="image-'+filePath.id+'" class="loader-image" data-id="'+filePath.id+'"><input type="hidden" name="pro_upload_files[]" value=\'' + JSON.stringify(filePath.additional_data) + '\'><a href="javascript:void(0)" class="remove-image"> x </a><img src="'+filePath.file_path+'"></li>');
                    });
                }
                $("#product_embed_video form").trigger("reset");
                $('#product_embed_video').modal('hide');
                revertProcessBtnDisable(btn, btn_text);
                toastrShow("Link has been saved Successfully!", "Success");
            }).fail(function(response) {
                toastrShow("Error occurred", "Success");
                response = response.responseJSON;
                $.each(response.errors, function(i, item) {
                    $('#product_option_add #'+i).css('border-color','red');
                });
                revertProcessBtnDisable(btn,btn_text);
            });
            return false;
        }

        function validURL(str) {
            var pattern = new RegExp('^(https?:\\/\\/)?'+ // protocol
                '((([a-z\\d]([a-z\\d-]*[a-z\\d])*)\\.)+[a-z]{2,}|'+ // domain name
                '((\\d{1,3}\\.){3}\\d{1,3}))'+ // OR ip (v4) address
                '(\\:\\d+)?(\\/[-a-z\\d%_.~+]*)*'+ // port and path
                '(\\?[;&a-z\\d%_.~+=-]*)?'+ // query string
                '(\\#[-a-z\\d_]*)?$','i'); // fragment locator
            return !!pattern.test(str);
        }
        function openOptionPrice(optionId)
        {
            var region_id = $('select[name=region_id]').val();
            var currency_id = $('select[name=currency_id]').val();
            $.ajax({
                method: 'GET',
                url: '{{ ecommerce_url('product/update-tier-price/'.$product->id)}}',
                data: 'option_id='+optionId+'&region_id='+region_id+'&currency_id='+currency_id,
            }).done(function(html)
            {
                $('#option_price_modal .modal-body').html(html);
                $('#option_price_modal').modal('show');
                $('#option_price_modal').find('#option_id').val(optionId);
            });
        }
        function saveOptionPrice()
        {
            var data = $("#option_price_modal form").serialize();
            var btn = $("#option_price_modal button[type=submit]");
            processBtnDisable(btn);
            var btn_text = 'Save';
            $.ajax({
                method: 'POST',
                url: '{{ ecommerce_url('product/update-tier-price/'.$product->id)}}',
                data: data,
                dataType: "json"
            }).done(function(response) {
                $('#option_price_modal').modal('hide');
                $("#option_price_modal form").trigger("reset");
                revertProcessBtnDisable(btn, btn_text);
                toastrShow("Prices has been saved Successfully!", "Success");
            }).fail(function(response) {
                toastrShow("Error occurred", "Success");
                response = response.responseJSON;
                $.each(response.errors, function(i, item) {
                    $('#product_option_add #'+i).css('border-color','red');
                });
                revertProcessBtnDisable(btn,btn_text);
            });
            return false;
        }
        function saveMaximumQty()
        {
            var data = $("#maximum_quantity_modal form").serialize();
            var btn = $("#maximum_quantity_modal button[type=submit]");
            processBtnDisable(btn);
            var btn_text = 'Save';
            $.ajax({
                method: 'POST',
                url: '{{ ecommerce_url('product/update-qty/'.$product->id)}}',
                data: data,
                dataType: "json"
            }).done(function(response) {
                $('#maximum_quantity_modal').modal('hide');
                revertProcessBtnDisable(btn, btn_text);
                toastrShow("Maixmum quantity has been saved Successfully!", "Success");
            }).fail(function(response) {
                toastrShow("Error occurred", "Success");
                response = response.responseJSON;
                $.each(response.errors, function(i, item) {
                    $('#product_option_add #'+i).css('border-color','red');
                });
                revertProcessBtnDisable(btn,btn_text);
            });
            return false;
        }

        $('#product_tag').select2({
            placeholder: 'Add or Select the Tag',
        });

        function tagAdd(tag,tagTitle,product_id,newTag = true){
            $.ajax({
                method: "POST",
                url: '{{ ecommerce_url('tag/create') }}',
                data: {
                    tag :tag,
                    tagIds: tagTitle,
                    product_id: product_id,
                },
                dataType: "json",
            }).done(function(data) {
                $('#product_tag').select2();
                if (data.success == true){
                    toastrShow("Tag added successfully", "Success");
                }
                if(data.success == true && newTag){
                    var data = {
                        id: data.tagData.id,
                        text: data.tagData.name
                    };
                    var newOption = new Option(data.text, data.id, true, true);
                    $('#product_tag').append(newOption).trigger('change');
                }
                else {
                    toastrShow(data.msg)
                }
            });
        }

        $(document).on('keyup', '.select2-search__field', function (e) {
            if (e.which === 13) {
                var tag = $(e.currentTarget).val();
                var tagTitle = $('.product_tag').val();
                var product_id = {{ $product->id }}
                tagAdd(tag,tagTitle,product_id);
            }
        });

        $('.product_tag').on('select2:select', function (e) {
            var tag = $(e.currentTarget).val();
            var tagTitle = $('.product_tag').val();
            var product_id = {{ $product->id }}
            tagAdd('',tagTitle,product_id,false);
        });


        $('.product_tag').on('select2:unselect',function (e) {
            var tag = $(this).val();
            var product_id = {{ $product->id }}
            $.ajax({
                method: "POST",
                url: '{{ ecommerce_url('tag/remove') }}',
                data: {
                    tag :tag,
                    product_id: product_id,
                },
                dataType: "json",
            }).done(function(data) {
                if(data.success == true) {
                    toastrShow("Tag removed successfully", "Success");
                }
            });
        });
    </script>
    @include('Product::product.script.attribute')
    @include('Product::product.script.subscription')
    @if($product->id > 0)
        @include('Product::product.script.option')
    @endif
@endsection