@extends("layouts.app")
@section("title")
Customize Dashboard
@endsection
@section("content")
  <style type="text/css">
    div#kt_content{
          margin-top: 3px;
    }
        .login-content
    {
        height: auto !important;
    }
    .login-content .login-form {
    max-width: 100% !important;
    text-align: left;
    }
    .bg-signup
    {
        background-color: #f4f4f4;
        border-radius: 4px;
        padding: 16px 15px;
        margin-bottom: 20px;
    }
    span.required {
    color: red;
}

.btn_save2
{
  -webkit-transition: 0.5s;
    transition: 0.5s;
    padding: 13px 25px 12px 25px;
    background-color: #388cc8;
    color: #ffffff;
    border-width: 2px;
    border-style: solid;
    border-color: #388cc8;
    border-radius: 5px;
    font-size: 14.5px;
    font-weight: 700;
}
  </style>
    <div class="">
        <div class="row">
            <div class="col-md-12">
                <div class="kt-portlet">
                   
                    <div class="kt-portlet__body">

                        <div class="kt-login__form bg-signup">
                          <form class="m-login__form m-form" id="signup_form" method="POST" action="{{ url('chooseKeyword') }}">
                            <div class="row">
                                  <div class="col-md-6">
                                     <div class="form-group required">
                                        <!-- remove class control-label -->
                                    
                                          <div class="checkbox">

                                             <label class='control-label'> 
                                               Major Area of Interest <span class="required"> * </span>
                                             </label>
                                          </div>
                                  

                                           <select class="form-control" name="main_keyword1" id="main_keyword1">
                                              <option value="">Major Area of Interest</option>
                                              @foreach($main_keywords as $main_keyword)
                                               <option value="{{$main_keyword->id}}" {{Auth::user()->main_keyword1==$main_keyword->id?"selected":""}}>{{$main_keyword->keyword_en}}</option>
                                              @endforeach
                                           </select>
                                                            <div style="color: red;" id="main_keyword1E"></div>
                           
                                    </div>
                                  </div>
                                  <div class="col-md-6">
                                    <div class="form-group required">
                                        <!-- remove class control-label -->
                                       <div class="col-md-12">
                                          <div class="checkbox">
                                             <label class='control-label'> 
                                               Major Keywords <span class="required"> * </span>
                                             </label>
                                          </div>
                                       </div>


                                           <select class="form-control" multiple name="keywords1[]" id="keywords1">
                                              @foreach($keywords as $keyword)
                                               <option data-chained="{{$keyword->parent_id}}"  {{in_array($keyword->id, explode(",", Auth::user()->keywords1))?"selected":""}} value="{{$keyword->id}}">{{$keyword->keyword_en}}</option>
                                              @endforeach
                                           </select>
                                                            <div style="color: red;" id="keywords1E"></div>
                                    </div>  
                                  </div>  
                                  <div class="col-md-6">                                   
                                    <div class="form-group">
                                        <!-- remove class control-label -->
                                       <div class="col-md-12">
                                          <div class="checkbox">
                                             <label class='control-label'>Secondary Area of Interest <span >(optional)</span>
                                             </label>
                                          </div>
                                       </div>

                                           <select class="form-control" name="main_keyword2" id="main_keyword2">
                                              <option value="">Secondary Area of Interest</option>
                                              @foreach($main_keywords as $main_keyword)
                                               <option value="{{$main_keyword->id}}" {{Auth::user()->main_keyword2==$main_keyword->id?"selected":""}}>{{$main_keyword->keyword_en}}</option>
                                              @endforeach
                                           </select>
                                                            <div style="color: red;" id="main_keyword2E"></div>

                                    </div>
                                  </div>
                                  <div class="col-md-6">
                                    <div class="form-group">
                                        <!-- remove class control-label -->
                                       <div class="col-md-12">
                                          <div class="checkbox">
                                             <label class='control-label'>Secondary Keywords  <span >(optional)</span>
                                             </label>
                                          </div>
                                       </div>


                                           <select class="form-control" multiple name="keywords2[]" id="keywords2">
                                              @foreach($keywords as $keyword)
                                               <option data-chained="{{$keyword->parent_id}}" {{in_array($keyword->id, explode(",", Auth::user()->keywords2))?"selected":""}} value="{{$keyword->id}}">{{$keyword->keyword_en}}</option>
                                              @endforeach
                                           </select>
                                                            <div style="color: red;" id="keywords2E"></div>

                                    </div>  
                                </div>
                                <div class="col-md-6">
                                    <div class="form-group">
                                        <!-- remove class control-label -->
                                       <div class="col-md-12">
                                          <div class="checkbox">
                                             <label class='control-label'> 
                                               Rss
                                             </label>
                                          </div>
                                       </div>

                                           <select class="form-control" multiple name="rss[]" id="rss">
                                              @foreach($rss as $rss_datum)
                                               <option  value="{{$rss_datum->id}}" {{in_array($rss_datum->id, explode(",", Auth::user()->rss))?"selected":""}} >{{$rss_datum->name}}</option>
                                              @endforeach
                                           </select>
                                    </div>  
                                  </div>
                                  <div class="col-md-6">                              
                                    <div class="form-group">
                                        <!-- remove class control-label -->
                                       <div class="col-md-12">
                                          <div class="checkbox">
                                             <label class='control-label'> 
                                               Sources
                                             </label>
                                          </div>
                                       </div>


                                           <select class="form-control" multiple name="sources[]" id="sources">
                                              @foreach($sources as $source)
                                               <option  {{in_array($source->name, explode(",", Auth::user()->sources))?"selected":""}} value="{{$source->name}}">{{$source->descriptive_name}}</option>
                                              @endforeach
                                           </select>

                                                            <div style="color: red;" id="sourcesE"></div>

                                    </div>
                                  </div>
                                </div>
                                      {{--  <div class="form-group row">
                                      <div class="text-center" style="width: 100%;">
                                          <label class="kt-checkbox">
                                            <input type="hidden" name="article_notification" value="0">
                                        
                                            <input name="article_notification" value="1" {{ Auth::user()->article_notification==1?"checked":""}} type="checkbox"> Subscribe to new articles notifications
                                                                                       <span></span> 
                                                                                       
                                          </label>
                                     
                                      </div>
                                    </div>--}}
                                {{ csrf_field() }}
                            </form>
                            <div class="kt-login__center text-center col-md-12" style="width: 100%;margin-bottom: 20px">
                                <button type="button" id="kt_login_signin_submit"
                                        class="btn_save2">Save
                                </button>
                            </div>
                        </div>
                    </div>
                </div>
            </div>


        </div>
    </div>

@endsection
<!-- end:: Page -->
<!--begin::Global Theme Bundle -->
{{--         <script src="{{url('')}}/assets/vendors/base/vendors.bundle.js" type="text/javascript"></script>
 --}}
@section('script')
    <script src="{{url("")}}/assets/demo/base/scripts.bundle.js" type="text/javascript"></script>

    <!--end::Global Theme Bundle -->
    <!--begin::Page Scripts -->
    <script src="{{url('')}}/assets/snippets/custom/pages/user/login.js" type="text/javascript"></script>
    <script src="{{url('')}}/assets/vendors/general/jquery_chained-2.x/jquery.chained.min.js"
            type="text/javascript"></script>
    <script src="{{url('')}}/assets/vendors/general/select2/dist/js/select2.full.js" type="text/javascript"></script>
    <script src="{{url("")}}/assets/vendors/general/toastr/toastr.js" type="text/javascript"></script>

    <script type="text/javascript">

        $("#keywords1").chained("#main_keyword1");
        $("#keywords2").chained("#main_keyword2");

        $("#main_keyword1").select2();
        $("#keywords1").select2();
        $("#main_keyword2").select2();
        $("#keywords2").select2();
        $("#sources").select2();
        $("#rss").select2();




        $("#kt_login_signin_submit").on("click", function () {
            $("#signup_form").ajaxSubmit({
                beforeSubmit: function (arr, $form, options) {
                    toastr.warning('Please wait!');
                },
                success: function () {
                    toastr.success('Success');

                    window.location.href = "{{url("/?view=dashboard")}}";

                },
                error: function (e) {
                    error = $.parseJSON(e.responseText);
                    var errors = "";
                    $.each(error, function (index, value) {

                        errors += value + "<br>";
                    });

                    toastr.error(errors, "Invalid data!");

                }

            });

        })
    </script>
@endsection