@extends('admin.layouts.header')
@section('styles') 
<style>
    .dropzone-row {
        height: 200px;
        overflow-y: auto;
    }
   
</style>  
@endsection
@section('content')

<main class="admin-dashbaord-content">

    <h3 class="sub-heading mt-4">My Idea</h3>

    <div class="content-wrap">

        <div class="form-wizard container">

            
            

                <div class="form-wizard-header">

                    <ul class="list-unstyled form-wizard-steps clearfix">

                        <li id="w_1" class="activated"><a href=""><i class="far fa-lightbulb"></i></a></li>

                        <li id="w_2" class="active"><a href=""><i class="fas fa-pencil-alt"></i></a></li>

                        <li id="w_3" ><a href=""><i class="far fa-user"></i></a></li>

                        <li id="w_4" ><a href=""><i class="far fa-eye"></i></a></li>

                    </ul>

                </div>
                @if(!empty($project_details))
                @foreach($project_details as $project)
                    <form action="{{route('edit-project-admin')}}"  enctype="multipart/form-data" id="editform1" method="post">
                    {{ csrf_field() }}
                        <!-- @if ($errors->any())
                            <div class="alert alert-danger">
                                <ul>
                                    @foreach ($errors->all() as $error)
                                        <li>{{ $error }}</li>
                                    @endforeach
                                </ul>
                            </div>
                        @endif
                        @if($message = Session::get('success'))
                            <div class="alert alert-success alert-dismissible fade show" role="alert">{{ $message }}
                                <button type="button" class="close" data-dismiss="alert" aria-label="Close">
                                    <span aria-hidden="true">&times;</span>
                                </button>
                            </div>
                        @endif

                        @if($message = Session::get('error'))
                            <div class="alert alert-danger alert-dismissible fade show" role="alert">{{ $message }}
                                <button type="button" class="close" data-dismiss="alert" aria-label="Close">
                                    <span aria-hidden="true">&times;</span>
                                </button>
                            </div>
                        @endif -->

                        <fieldset class="wizard-fieldset show" id="page_2">
                        

                        <div class="row mb-5 pb-2 border-light-bottom">

                            <div class="col-3">

                                <h5 class="wizard-heading text-center">Project Detail</h5>

                            </div>

                            <div class="col-3">

                                <h5 class="wizard-heading text-center">Project Description</h5>

                            </div>

                        </div>

                        <h2 class="start-title text-center"><i class="fas fa-pen-fancy bulb me-3"></i>Tell About Project Description</h2>

                        <div class="row border-light-bottom pb-3 mb-5">

                            <p class="detail-desc mb-3">Lorem ipsum dolor, sit amet consectetur adipisicing elit. Mollitia distinctio ut dolorum assumenda in debitis natus sapiente, autem cumque?</p>

                            <p class="detail-desc">Lorem ipsum dolor, sit amet consectetur adipisicing elit. Mollitia dolor odit nostrum pariatur illum animi eaque velit, vero delectus sit distinctio ut dolorum assumenda in debitis natus sapiente, autem tt distinctio ut dolorum assumenda in debitis natus sapiente, aut cumque?</p>

                        </div>

                        <div class="pb-3 mb-5">
                            <input type="hidden" name="project_id" class="project_id" value="{{ $project->id }}">
                            <input type="hidden" name="user_id" class="user_id" value="{{ $project->inventor_id }}">
                            <textarea name="project_desc" class="project_desc" id="editor1" rows="10" cols="80">
                                @if(!empty($project->project_desc)){{ $project->project_desc }}
                                @endif

                            </textarea>
                            <div id="project_desc_error" style="color:red">{{ $errors->first('project_desc') }}</div>
                            <!-- @if($message = Session::get('error'))
                                <div id="project_desc_error" style="color:red">{{ $message }}</div>
                            @endif  -->
                        </div>

                        <div class="form-group clearfix text-end">

                        @php $ide = Crypt::encrypt($project->id); @endphp
                            <a href="{{ route('prev-one-admin', $ide  )}}" id="previous__one" class="form-wizard-previous-btn me-4 float-left">Previous</a>

                            <button type="submit"  id="editProject_Btn1" class="form-wizard-next-btn float-right border-0">Next</button>

                        </div>


                    </fieldset> 

                    </form>
                @endforeach
                        
                @endif

            <!-- </form> -->

        </div>
    </div>
<!--</main>-->

@endsection
@section('scripts') 
 
    <script type="text/javascript">
        Dropzone.autoDiscover = false;
        jQuery(document).ready(function() {
            $("div#myAwesomeDropzone").dropzone({
                url: "/file/post"
            });

        });
        
     </script>
    <script>
        $(document).on('click', '.btn-add-new', function(e) {
          
          e.preventDefault();

          var controlForm = $('.my-controls:first'),

              currentEntry = $(this).parents('.entry:first'),

              newEntry = $(currentEntry.clone()).appendTo(controlForm);
              
              
          newEntry.find('input').val('');

          controlForm.find('.entry:not(:last) .btn-add-new')

              .removeClass('btn-add-new').addClass('btn-remove')

              .removeClass('btn-success').addClass('btn-danger')

              .html('<span class="fa fa-trash text-white"> </span>');

      }).on('click', '.btn-remove', function(e) {

          $(this).parents('.entry:first').remove();

          e.preventDefault();

          return false;

      });
    </script>
    <script>
        var myDropzone = new Dropzone("#file__upload", {
        url: "#", // Set the url for your upload script location
        paramName: "file", // The name that will be used to transfer the file
        maxFiles: 10,
        maxFilesize: 10, // MB
        addRemoveLinks: true,
        accept: function(file, done) {
          
            if (file.name == "wow.jpg") {
                done("Naha, you don't.");
            } else {
                done();
            }
        }
    });
    </script>
    <!-- <script src="{{ URL::asset('assets/js/dropzone.min.js') }}"></script> -->
    <script>
        $(document).ready(function(){
            // $("#city_section").hide();
            var option = '';
            option += "<option value=''>Select Category First</option>";
            $('#project_category').change(function(){ 
            var id = $(this).val();
            
                $.ajax({
                    url: "{{url('getSubCategories/register')}}/"+id,  
                    type: 'get',
                    
                    success: function(response){ 
                    var len = response.length;
                    var option = '';
                        if(len > 0){
                            for(var i=0; i<len; i++){
                                var id = response[i].id;
                                var name = response[i].name;
                                option += "<option value='"+id+"'>"+name+"</option>"; 
                            }
                            $("#project_subcategory").html(option); 
                           //  $("#city_section").show();
                        }
                    }
                });
            });
        });
    </script>

<script>
        $(document).ready(function(){
            // $("#city_section").hide();
            var option = '';
            option += "<option value=''>Select Category First</option>";
            $('#project_category_2').change(function(){ 
            var id = $(this).val();
            
                $.ajax({
                    url: "{{url('getSubCategories/register')}}/"+id,  
                    type: 'get',
                    
                    success: function(response){ 
                    var len = response.length;
                    var option = '';
                        if(len > 0){
                            for(var i=0; i<len; i++){
                                var id = response[i].id;
                                var name = response[i].name;
                                option += "<option value='"+id+"'>"+name+"</option>"; 
                            }
                            $("#project_subcategory_2").html(option); 
                           //  $("#city_section").show();
                        }
                    }
                });
            });
        });
    </script>
    <script>
       $(document).ready(function(){
            
            $('#savedataform').on('submit',(function(e) {
                e.preventDefault();
                 let project_title = $('#project_title').val();
                 let project_short_desc = $('#project_short_desc').val();
                 let project_category = $('#project_category').val();
                 let project_subcategory = $('#project_subcategory').val();
                 let project_category_2 = $('#project_category_2').val();
                 let project_subcategory_2 = $('#project_subcategory_2').val();
                 let user_id = $('#user_id').val();
                 $('#project_title_error').text("");
                 $('#project_short_desc_error').text("");
                 $('#project_category_error').text("");
                 $('#project_subcategory_error').text("");

                 if( project_title == "" ){ 
                    $('#project_title_error').append("Project title is required");
                    $('#page_1').addClass('show');
                    $('#w_2').removeClass('active');
                    $('#w_1').removeClass('activated');
                    $('#w_1').addClass('active');
                   
                     
                 }else if( project_short_desc == "" ){ 
                    $('#project_short_desc_error').append("Project short description is required");
                    $('#page_1').addClass('show');
                    $('#w_2').removeClass('active');
                    $('#w_1').removeClass('activated');
                    $('#w_1').addClass('active');

                 }else if( project_category == "" ){ 
                    $('#project_category_error').append("Please select project category");
                    $('#page_1').addClass('show');
                    $('#w_2').removeClass('active');
                    $('#w_1').removeClass('activated');
                    $('#w_1').addClass('active');
                   
                 }else if( project_subcategory == "" ){ 
                    $('#project_subcategory_error').append("Please select project sub category");
                    $('#page_1').addClass('show');
                    $('#w_2').removeClass('active');
                    $('#w_1').removeClass('activated');
                    $('#w_1').addClass('active');
                    
                     
                 }else{ 
                //  let project_id = $('.project_id').val();
                

                var formData = new FormData(this);

                // var more_video =  $('.more_video').map((_,el) => el.value).get()
                  
                  $.ajax({
                    type: "POST", 
                    headers: {
                        'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                    },

                    url: "{{route('save-project')}}",
                    // data:{user_id:user_id, more_video:more_video, project_id:project_id, project_title:project_title, project_short_desc:project_short_desc, project_category:project_category, project_subcategory:project_subcategory ,project_subcategory_2:project_subcategory_2, project_category_2:project_category_2},
                    data:formData,

                    cache:false,

                    contentType: false,

                    processData: false,
                    success:function(response){
                      if(response.success){
                        $('.project_id').val(response.id);
                        $('.more_video').val('');
                        $('#page_1').removeClass('show');
                        $('#page_2').addClass('show');
                       
                      }else{
                          alert("Error");
                      }
                    },
                    error:function(error){
                      console.log(error);
                    }

                  });
                // event.preventDefault();
                }
            }));
            
        });
 
    </script>

    <script>
       $(document).ready(function(){
            
            $('#editProjectBtn1').click(function(){ 
            
                 let project_desc = $('.project_desc').val();
                 let project_id = $('.project_id').val();
       
                  $.ajax({
                    type: "POST", 
                    headers: {
                        'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                    },

                    url: "{{route('edit-project-first')}}",
                    data:{project_desc:project_desc, project_id:project_id},

                    success:function(response){
                      if(response.success){
                        $('.project_id').val(response.id);
                        //   alert(response.id);
                      }else{
                          alert("Error");
                      }
                    },
                    error:function(error){
                      console.log(error);
                    }

                  });
                event.preventDefault();
            });
            
        });
 
    </script>

    <script>
       $(document).ready(function(){
            
            $('#editProjectBtn2').click(function(){ 
            
                 let name = $('#name').val();
                 let last_name = $('#last_name').val();
                 let email = $('#email').val();
                 let company_role = $('#company_role').val();
                 let company_website = $('#company_website').val();
                 let address = $('#address').val();
                 let linkedin_url = $('#linkedin_url').val();
                 let biography = $('#biography').val();
                 let contact_no = $('#contact_no').val();
                 let project_id = $('.project_id').val();
                 let user_id = $('#user_id').val();
         
                  $.ajax({
                    type: "POST", 
                    headers: {
                        'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                    },

                    url: "{{route('edit-user')}}",
                    data:{user_id:user_id, project_id:project_id, contact_no:contact_no, name:name, last_name:last_name, email:email, company_role:company_role, company_website:company_website, address:address, linkedin_url:linkedin_url, biography:biography },

                    success:function(response){
                      if(response.success){
                        $('#project_title_preview').val(response.project[0].project_title);
                        $('#project_short_desc_preview').val(response.project[0].project_short_desc);
                        $('#project_category_preview').val(response.project[0].project_category);
                        $('#project_subcategory_preview').val(response.project[0].project_subcategory);
                        if(response.project[0].project_category_2 == null){
                            $('.category_hide_show').css('display','none');
                        }
                        $('#project_category_preview_2').val(response.project[0].project_category_2);
                        $('#project_subcategory_preview_2').val(response.project[0].project_subcategory_2);
                        $('.project_desc_preview').val(response.project[0].project_desc);

                        $('.name').val(response.user[0].name);
                        $('.last_name').val(response.user[0].last_name);
                        $('.contact_no').val(response.user[0].contact_no);
                        $('.company_role').val(response.user[0].company_role);
                        $('.company_website').val(response.user[0].company_website);
                        $('.address').val(response.user[0].address);
                        $('.linkedin_url').val(response.user[0].linkedin_url);
                        $('.biography').val(response.user[0].biography);
                        $('.email').val(response.user[0].email);

                            var len = response.project_images.length;
                            var imgdiv = '';
                            if(len > 0){
                                for(var i=0; i<len; i++){
                                    var APP_URL = {!! json_encode(url('/')) !!};
                                    var id = response.project_images[i].id;
                                    var media = response.project_images[i].media;
                                    imgdiv += "<div class='me-3 mb-3'> <img src='"+APP_URL+"/"+media+"'alt='' class='img-fluid review-img'></div>"; 
                                }
                                $("#img_preview").html(imgdiv); 
                          
                            }

                            var lenv = response.project_videos.length;
                            var videodiv = '';
                            if(lenv > 0){
                                for(var i=0; i<len; i++){
                                    var APP_URL = {!! json_encode(url('/')) !!};
                                    var id = response.project_videos[i].id;
                                    var media = response.project_videos[i].video_url;
                                    videodiv += "<div class='me-3 mb-3'>"+media+"</div>"; 
                                }
                                
                                $("#video_div").html(videodiv); 
                          
                            }
                       
                           
                      }else{
                          alert("Error");
                      }
                    },
                    error:function(error){
                      console.log(error);
                    }

                  });
                event.preventDefault();
            });
            
        });
 
    </script>

<script>
       $(document).ready(function(){
            
            $('#submitProjecttoadminBtn').click(function(){ 

                 let project_id = $('.project_id').val();
         
                  $.ajax({
                    type: "POST", 
                    headers: {
                        'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                    },

                    url: "{{route('submit-project-to-admin')}}",
                    data:{project_id:project_id },

                    success:function(response){
                      if(response.success){
                       
                          alert("Project Idea submitted to admin, Get back to you soon");
                           
                      }else if(response.failTemp){

                        var pp = response.projectPercentage;

                        alert(pp);
                      }else{
                          alert("Error");
                      }
                    },
                    error:function(error){
                      console.log(error);
                    }

                  });
                event.preventDefault();
            });
            
        });
 
    </script>

    <script>
       $(document).ready(function(){
            
            $('#previous_three').click(function(){ 

                 let project_id = $('.project_id').val();
         
                  $.ajax({
                    type: "POST", 
                    headers: {
                        'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                    },

                    url: "{{route('edit-project-first')}}",
                    data:{project_id:project_id },

                    success:function(response){
                      if(response.success){
                        $('.project_id').val(response.id);
                   
                      }else{
                          alert("Error");
                      }
                    },
                    error:function(error){
                      console.log(error);
                    }

                  });
                event.preventDefault();
            });
            
        });


        $(document).ready(function(){
            
            $('#previous_two').click(function(){ 

                 let project_id = $('.project_id').val();
         
                  $.ajax({
                    type: "POST", 
                    headers: {
                        'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                    },

                    url: "{{route('previous-to-sec')}}",
                    data:{project_id:project_id },

                    success:function(response){
                      if(response.success){
                        $('.project_id').val(response.id);
                   
                      }else{
                          alert("Error");
                      }
                    },
                    error:function(error){
                      console.log(error);
                    }

                  });
                event.preventDefault();
            });
            
        });

        $(document).ready(function(){
            
            $('#previous_one').click(function(){ 

                 let project_id = $('.project_id').val();
         
                  $.ajax({
                    type: "POST", 
                    headers: {
                        'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                    },

                    url: "{{route('review-project')}}",
                    data:{project_id:project_id },

                    success:function(response){
                      if(response.success){
                        $('.project_id').val(response.id);
                        $('#page_2').removeClass('show');
                        $('#page_1').addClass('show');
                   
                      }else{
                          alert("Error");
                      }
                    },
                    error:function(error){
                      console.log(error);
                    }

                  });
                event.preventDefault();
            });
            
        });
 
    </script>

    <script>
        $(document).ready(function() {

          $(".add-plus-btn").click(function() {

            $(".add-categories-inputs").addClass("show-input");

          });

        });
    </script>


    <!-- <script type="text/javascript">
        $(document).ready(function (e) {
            $.ajaxSetup({
                headers: {
                'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                }
            });
            $('#project_idea_form').submit(function(e) {
                e.preventDefault();
                var formData = new FormData(this);
                let TotalFiles = $('#files')[0].files.length; //Total files
                let files = $('#files')[0];
                for (let i = 0; i < TotalFiles; i++) {
                    formData.append('files' + i, files.files[i]);
                }
                 formData.append('TotalFiles', TotalFiles);
                $.ajax({
                    type:'POST',
                    url: "{{ url('store-multi-file-ajax')}}",
                    data: formData,
                    cache:false,
                    contentType: false,
                    processData: false,
                    dataType: 'json',
                    success: (data) => {
                    this.reset();
                    alert('Files has been uploaded using jQuery ajax');
                    },
                    error: function(data){
                    alert(data.responseJSON.errors.files[0]);
                    console.log(data.responseJSON.errors);
                    }
                });
            });
        });
    </script> -->
    
@endsection