@extends('base')

@section('title', 'Search result')

@section('content')

    {{--<div class="ui large header">Large Header</div>--}}
    {{--<br>--}}
    <div class="ui basic segment">
        <div class="ui grid">
            <div class="two wide column"></div>
            <div class="ten wide column">
                <div class="ui breadcrumb">
                    <a href="{{ route('home') }}" class="section">{{ __('Home') }}</a>
                    <i class="right angle icon divider"></i>
                    <div class="active section">{{ __('Search') }}</div>
                </div>
            </div>
        </div>
    </div>


    <div class="ui grid">
        <div class="row">
            <div class="two wide column"></div>
            <div class="three wide column">
                <div class="ui basic segment">
                    <h2 class="ui header">{{ __('Search') }}</h2>
                </div>
            </div>
        </div>
    </div>

    <div class="ui grid">
        <div class="four wide column"></div>
        <div class="ten wide column full-width">
            <div class="ui secondary menu">
                <div class="item">
                    <div class="ui action input searchbar-large">
                        <div class="searchbar-input" id="#uniName" contenteditable="true"></div>
                        {{--<span class="placeholder visible">{{__('Search by name...')}}</span>--}}
                        <button class="ui button" onclick="search()">{{ __('Search') }}</button>
                        {{--<div class="ui dropdown predictions">--}}
                            {{--<div class="menu" id="predictions"></div>--}}
                        {{--</div>--}}
                    </div>
                </div>
                <div class="right item" style="opacity: 0; visibility: hidden">
                    <h4 class="ui header">
                        <div class="content">
                            Sort by
                            <div class="ui inline dropdown icon">
                                <div class="text" id="sort">{{ __('Popularity') }}</div>
                                <i class="chevron down icon"></i>
                                <div class="menu" style="left: -30px">
                                    <div class="active item" data-text="Popularity" >{{ __('Popularity') }}</div>
                                    <div class="item" data-text="Ranking">{{ __('Times Ranking') }}</div>
                                </div>
                            </div>
                        </div>
                    </h4>
                </div>
            </div>
        </div>
    </div>

    <div class="ui grid">
        <div class="two wide column"></div>
        <div class="two wide column"></div>

        <div class="ten wide column search-results" id="table">

            @if (!$universities->isEmpty())
                {{-- Universities Result --}}
                @include('catalog.universitiesSearchResult')
                {{-- End Universities Result --}}
            @endif

            @if (!$courses->isEmpty())
                 {{--Courses Result--}}
                @include('catalog.coursesSearchResult')
                 {{--End Courses Result--}}
            @endif


            @if ($universities->isEmpty() && $courses->isEmpty())
            {{-- No Result --}}
            <div class="ui basic segment">
                <h3>{{ __('We are sorry, we could not find anything to match your search') }}
                    </h3>
            </div>
            {{-- End No Result --}}
            @endif


        </div>


    </div>

    <script>
        $(function(){
            var loc = (location.toString()).split('search?q=')[1];
            $('.searchbar-input').empty().append(loc);
        });

        window.search = function () {
            window.location = '/search\?q=' + $('.searchbar-input').text();
        };
    </script>


@endsection




@section('document_ready_scripts')

    $('.ui.checkbox').checkbox();


@endsection