@extends('layouts.app')

@section('content')

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<script>
    var i=0; 
    
    var a = '';
$(document).ready(function(){
  $("#newform").click(function(){
    $("#kk").css("height","400px");
    // console.log(i);
        // a = '<form action="{{ route('questions.store') }}" method="POST" ><div class="col-xs-12 col-sm-12 col-md-12"><div class="form-group"><strong class="pull-left">Title:</strong>';
        a = '<div class="col-xs-12 col-sm-12 col-md-12"><div class="form-group"><strong class="pull-left">Title:</strong>';
        // a += "<textarea type='text' name='relatedquestion[title]' class='form-control' placeholder='title'>{{old('relatedquestion.title')}} </textarea></div> </div>";
        a += "<textarea class='form-control' style='height:50px' name='relatedquestion[title]' placeholder='title'>{{old('relatedquestion.title')}}</textarea></div> </div>";
        a += '<div class="col-xs-12 col-sm-12 col-md-12"><div class="form-group"><strong class="pull-left">Description:</strong>';
        // a += "<textarea type='text' name='relatedquestion[description]' class='form-control' placeholder='title'> {{old('relatedquestion.description')}} </textarea></div> </div>";
        a += "<textarea class='form-control' style='height:50px' name='relatedquestion[description]' placeholder='description'>{{old('relatedquestion.description')}}</textarea></div> </div>";
        a += '<div class="col-xs-12 col-sm-12 col-md-12"><div class="form-group"><strong class="pull-left">Score:</strong>';
        // a += "<textarea type='text' name='relatedquestion[score]' class='form-control' placeholder='title'> {{old('relatedquestion.score')}}</textarea></div></div>";
        a += "<textarea class='form-control' style='height:50px' name='relatedquestion[score]' placeholder='score'>{{old('relatedquestion.score')}}</textarea></div></div>";
        a += "<div class='col-xs-12 col-sm-12 col-md-12'><div class='form-group'><strong class='pull-left'>Info:</strong> <textarea class='form-control' style='height:50px' name='relatedquestion[info]' placeholder='optional'>{{old('relatedquestion.info')}}</textarea></div></div>"
    // var
    i++; 
    // ii++;

// height: 400px;overflow: scroll;$("p").css("background-color");

if(i<=1){
    $("#kk").append(a);
}

    
        // <div class="col-xs-12 col-sm-12 col-md-12"> <div class="col-xs-12 col-sm-12 col-md-12"><div class="form-group"><strong class="pull-left">Title:</strong><input type="text" name="relatedquestion[xx]['i+1']" class="form-control" placeholder="title"> </div> </div><div class="col-xs-12 col-sm-12 col-md-12"><div class="form-group"><strong class="pull-left">Description:</strong><textarea class="form-control" style="height:50px" name="relatedquestion[xx]['i+1']" placeholder="description"></textarea></div></div> <div class="col-xs-12 col-sm-12 col-md-12"><div class="form-group"><strong class="pull-left">Score:</strong><textarea class="form-control" style="height:50px" name="relatedquestion[xx]['i+1']" placeholder="score"></textarea></div></div></div>' 

      









        
    
  });
  
});
</script>


<div class="content">
    <div class="container">
        <div class="row">
            <div class="col-lg-12 margin-tb">
                <div class="h2">
                    <h2>Edit Question</h2>
                </div>
            </div>
        </div>

        @if ($errors->any())
            <div class="alert alert-danger">
                <strong>Whoops!</strong> There were some problems with your input.<br><br>
                <ul>
                    @foreach ($errors->all() as $error)
                        <li>{{ $error }}</li>
                    @endforeach
                </ul>
            </div>
        @endif

        <form action="{{ route('questions.update', $questionmd->id) }}" method="POST">
            @csrf
            @method('POST')

            <div class="add_question_catagory">
                <div class="row">
                    <div class="col-xs-12 col-sm-12 col-md-12">
                        <div class="form-group">
                            <strong>Title:</strong>
                            <input type="text" name="title" value="{{ $questionmd->title }}" class="form-control" placeholder="Title">
                        </div>
                    </div>
                    <div class="col-xs-12 col-sm-12 col-md-12">
                        <div class="form-group">
                            <strong>Description:</strong>
                            <textarea class="form-control" style="height:50px" name="description"
                                placeholder="description">{{ $questionmd->description }}</textarea>
                        </div>
                    </div>

                     <div class="col-xs-12 col-sm-12 col-md-12">
                        <div class="form-group">
                            <strong>Score:</strong>
                            <textarea class="form-control" style="height:50px" name="score"
                                placeholder="description">{{ $questionmd->score }}</textarea>
                        </div>
                    </div>
                    @if(!empty($questionmd->refs_info))
                    <div class="col-xs-12 col-sm-12 col-md-12">
                        <div class="form-group">
                            <strong>Info:</strong>
                            <textarea class="form-control" style="height:50px" name="info"
                                placeholder="optional">{{ $questionmd->refs_info->detail }}</textarea>
                        </div>
                        </div>
                        
                        @else
                        <div class="col-xs-12 col-sm-12 col-md-12">
                        <div class="form-group">
                            <strong>Info:</strong>
                            <textarea class="form-control" style="height:50px" name="info"
                                placeholder="optional"></textarea>
                        </div>
                        
                    </div>
@endif

<div class="col-xs-12 col-sm-12 col-md-12">
                                    <div class="ad_w200">
                                    <div class="form-group">
                                        <label for="usr">Category Selection:</label><br>
                                        @if(count($cat) > 0)
                                            @foreach($cat as $cat)
                                                <div class="checkbox">
                                                @if($cat->id == $questionmd->cat)
                                                    <label><input name="cat" type="radio" checked value="{{$cat->id}}">{{$cat->title}}</label>
                                                    @else
                                                    <label><input name="cat" type="radio" value="{{$cat->id}}">{{$cat->title}}</label>
                                                    @endif
                                                </div>
                                                
                                            @endforeach
                                        @else
                                            <div class="checkbox">
                                                <h4 class="modal-title text-center">No category found !!</h4>
                                            </div>
                                        @endif
                                    </div>
                                    </div>
                                </div>

<div class="col-xs-12 col-sm-12 col-md-12">
                        <div class="form-group">
                            <strong>Question Type:</strong><br>
                            <label for="questions"><strong>Choose a Question Type:</strong></label>

                            <select name="q_type" id="questiontype">
                                @if ($questionmd->q_type=="direct_ask")
                                <option value="direct_ask" selected='true'> Direct Ask </option>
                                <option value="dont_ask" > Dont Ask </option>
                                <option value="indirect_ask" > Indirect Ask </option>
                                @elseif($questionmd->q_type=="dont_ask")
                                <option value="dont_ask" selected='true'> Dont Ask </option>
                                <option value="direct_ask" > Direct Ask </option>
                                <option value="indirect_ask" > Indirect Ask </option>
                                @elseif($questionmd->q_type=="indirect_ask")
                                <option value="indirect_ask" selected='true'> Indirect Ask </option>
                                <option value="dont_ask" > Dont Ask </option>
                                <option value="direct_ask" > Direct Ask </option>

                                @else
                                <option value="direct_ask"> Direct Ask </option>
                                <option value="dont_ask"> Dont Ask </option>
                                <option value="indirect_ask"> Indirect Ask </option>
                               
                                @endif
                                
                            </select>

                           
                        </div>
                        </div>

                     @if(count($questionmd->relatedquestions) >=1)
                     <div class="col-xs-12 col-sm-12 col-md-12" style="height: 400px;overflow-y: auto;overflow-x:hidden">
                       
                     <div class="col-xs-12 col-sm-12 col-md-12">
                        <div class="form-group">
                            <strong>Related questions:</strong>
                        </div>
                    </div>
                    <!--@foreach($questionmd->relatedquestions as $key => $value) q_type -->
                    <form action="" method="POST">
                    <div class="col-xs-12 col-sm-12 col-md-12">
                        <div class="form-group">
                            <strong>Title:</strong>
                            <input type="text" name="relatedquestion[title]" value="{{ $rel_info->title }}" class="form-control" placeholder="Title">
                        </div>
                    </div>
                    <div class="col-xs-12 col-sm-12 col-md-12">
                        <div class="form-group">
                            <strong>Description:</strong>
                            <textarea class="form-control" style="height:50px" name="relatedquestion[description]"
                                placeholder="description">{{ $rel_info->description }}</textarea>
                        </div>
                    </div>

                     <div class="col-xs-12 col-sm-12 col-md-12">
                        <div class="form-group">
                            <strong>Score:</strong>
                            <textarea class="form-control" style="height:50px" name="relatedquestion[score]"
                                placeholder="description">{{ $rel_info->score }}</textarea>
                        </div>
                    </div>

                    
                    
                    
                    @if(!empty($rel_info->refs_info))
                    <div class="col-xs-12 col-sm-12 col-md-12">
                        <div class="form-group">
                            <strong>Info:</strong>
                            <textarea class="form-control" style="height:50px" name="info1"
                                placeholder="optional">{{ $rel_info->refs_info->detail }}</textarea>
                        </div>
                        </div>
                        
                        @else
                        <div class="col-xs-12 col-sm-12 col-md-12">
                        <div class="form-group">
                            <strong>Info:</strong>
                            <textarea class="form-control" style="height:50px" name="info1"
                                placeholder="optional"></textarea>
                        </div>
                        
                    </div>
@endif
                    
                    
                     <div class="col-xs-12 col-sm-12 col-md-12">
                        <div class="form-group">
                            
                           <input name="relatedquestion[question_id]" value="{{ $value->question_id }}" style="display:none"/>
                        </div>
                    </div>
                     <div class="col-xs-12 col-sm-12 col-md-12">
                        <div class="form-group">
                             <input name="relatedquestion[id]" value="{{ $value->id }}" style="display:none"/>
                        </div>
                    </div>
                     </div>
                 </form>
                        
                    <!--@endforeach-->

                    @else
                    <div class="col-xs-12 col-sm-12 col-md-12 text-right">

<div class="pull-left">
<strong>Add Related Questions:</strong>
</div>


<div class="pull-right">

<!--  <button type="button" class="btn btn-primary" id="newform" data-toggle="modal" data-target="#exampleModal">Add <span class="material-icons">
playlist_add
</span></button> -->

<button type="button" class="btn btn-primary" id="newform" >Add <span class="material-icons">
playlist_add
</span></button>



</div>
</div>


                    @endif


                   
                   

                  

<div class="col-xs-12 col-sm-12 col-md-12 text-right">

<div id='kk' style="height: 0px;overflow-y: auto;overflow-x:hidden">
    </div>
</div>

                    <div class="col-xs-12 col-sm-12 col-md-12">                        
                        <div class="pull-left">
                            <a class="btn btn-primary" href="{{ route('questions.index') }}" title="Go back">  Cancel</a>
                        </div>
                        <div class="pull-right">
                            <button type="submit" class="btn btn-primary">Submit</button>
                        </div>
                    </div>
                </div>
            </div>

        </form>
    @endsection
    </div>
</div>