@extends('front-layout.default')
@section('content')
    <div class="progress-bar-container">
        <div class="progress-center-image">
            <a href="{!! route('home-page') !!}" title="Click here to go Home Page">
                <img style="width:150px; height:150px;display:none;" id="imgHome" src="Content/images/logoglobe.png" />
            </a>
        </div>
        <div style="padding-top:100px;">
            <div><span id="spnLoading" class="spnLoading"></span></div>
            <div id="progressbar"></div>
        </div>
    </div>
@stop

@section('scripts')
    <script type="text/javascript">
        $('.navbar-nav').css('display','none');
        $(document).ready(function () {
            $("#progressbar").progressbar({
                value: 0
            });
            var value = $("#progressbar").progressbar("option", "value");
            $('#spnLoading').text('Loading... ' + value + '%');
            var interval = setInterval(function () {
                var value = $("#progressbar").progressbar("option", "value");
                $('#spnLoading').text('Loading... ' + value + '%');
                if (parseInt(value) == 100) {
                    $('#imgHome').show();
                    $('#spnLoading').hide();
                    $("#progressbar").hide();
                    clearInterval(interval);
                }
                $("#progressbar").progressbar("option", "value", value + 10);
                var value1 = $("#progressbar").progressbar("option", "value");
                $('#spnLoading').text('Loading... ' + value1 + '%');

            }, 1000);
        });
    </script>
@stop