@extends('layouts.app')

@section('content')

{{--
<h1 class="text-center">{{ __('contract.draft.title') }}</h1>
<hr class="my-4 scroll-step" />
--}}

<input id="ajaxContract" type="hidden" value="{!! base64_encode(json_encode($contract ?? '', JSON_UNESCAPED_SLASHES)) !!}">

<input id="ajaxContractId" type="hidden" value="{{ $contract['id'] }}">

<input id="contractType" type="hidden" value="{{ $contractType }}">

<div class="contractCreationHeader d-flex justify-content-center position-relative">

    <div id="prevQuestionGroup" class="m-0 p-0 align-items-center d-none justify-content-center pointer fly-to-top">
        <div class="m-0 p-0 align-items-center pt-1 pr-1 pointer">
            <i class="fa fa-chevron-left align-items-center pointer" style="font-size:16px;"></i>
        </div>
    </div>
    @if( $login )
        <button class="btn btn-outline-secondary pt-1 m-0 p-0 btn-abandon-contract close-contract position-absolute" data-backdrop="true" data-toggle="modal" data-target="#abandonCreateContract" style="background:none; right: 0px; box-shadow: none; z-index: 1000; top: -20px;">
            <img src="{{ asset('img/icon_exit.png') }}" width="25px" height="25px">
        </button>
    @endif
    <div class="container-fluid" style="height: 90px;">

        <div class="contract-creaction-progressbar">
            <div class="col-lg-9 mx-auto">
                <input type="hidden" id="progressbarMaxGroup" value="{{ count($contract['questionGroups']) + 1 }}">
                @foreach ( $contract['questionGroups'] as $group )
                    <div id="progressbarTitle_{{  $loop->index }}" class="progressbarTitle @if ($loop->iteration != 1) d-none @endif align-items-center"><span class="steps mr-2">{{  $loop->iteration }}/{{ count($contract['questionGroups']) + 1 }}</span> {{ $group['label'] }}</div>
                @endforeach
                <div id="progressbarTitle_{{ count($contract['questionGroups']) }}" class="progressbarTitle d-none align-items-center">
                    <span class="steps mr-2"> {{ count($contract['questionGroups']) + 1 }}/{{ count($contract['questionGroups']) + 1 }}</span>
                    @if( $contractType == 'hash' )
                        {{ __('contract.draft.stepPreview.title') }}
                    @else
                        {{ __('contract.draft.stepSummary.title') }}
                    @endif
                </div>
                <div id="progressbarTitle_{{ count($contract['questionGroups']) + 1 }}" class="progressbarTitle d-none align-items-center">
                    <span class="steps mr-2">{{ count($contract['questionGroups']) + 1 }}/{{ count($contract['questionGroups']) + 1 }}</span>
                    @if( $contractType == 'hash' )
                        {{ __('contract.draft.stepHashBlockchain.title') }}
                    @else
                        {{ __('contract.draft.stepWaitingForResponse.title') }}
                    @endif
                </div>
                <div class="progress">
                    <div class="progress-bar" role="progressbar" aria-valuenow="0" aria-valuemin="0" aria-valuemax="100" style="width:0%">
                        <span class="sr-only"></span>
                    </div>
                    <div class="EPprogressbarSlider position-relative">
                        <!--<div class="progressbarRounded"></div>-->
                        <div class="progressbarSlider">
                            <div class="progressbarTriangle mt-4"></div>
                            <div id="progressbarPrecentValue">0%</div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

<hr class="contractCreationHeader my-4" />

<div class="container">
    <div class="row justify-content-center">
        <div class="highlight-tutorial col-lg-9">
            <div style="min-height: 250px !important">
                <form id="new_contract">

                <input id="next_toggle" type="hidden" name="next_toggle" value="{{ $toggle['next'] }}">
                <input id="prev_toggle" type="hidden" name="prev_toggle" value="{{ $toggle['prev'] }}">

                @foreach ( $contract['questionGroups'] as $group )
                    <div class="question_group" style="display:none;">
                        <div class="question_group_name"><h2>{{ $group['label'] }}</h2></div>
                        @foreach ( $group['questions'] as $question )
                            {!! $form->index( 'create', $question ) !!}
                        @endforeach
                    </div>
                    @if( $loop->last )
                    @if( $summary )
                    <div class="question_group contract_summary" style="display:none;">
                        {{-- Summary --}}
                        @if( $contractType == 'hash' )
                        <div class="question_group_name"><h2>{{ __('contract.summary.certificationPreview') }}</h2></div>
                        <p>{{ __('contract.summary.certificationPreviewReady') }}</p>
                        @endif

                        <div id="ajaxSummary"></div>
                        @if( $hashBlockchain )
                        <!-- <h5 class="mt-5">{{ __('contract.summary.nameOfTheContract') }}</h5> -->

                        <div class="form-group bmd-form-group" id="question-contractName">
                            <div class="component required">
                                <label for="contractNameAjax" class="component-label mb-0">{{ __('contract.summary.inputNameOfTheCertification') }}</label>
                                <input id="contractNameAjax" type="input" class="col-md-12 form-control" name="contractNameAjax" value="" autocomplete="off" placeholder="{{ __('contract.summary.inputNameOfTheCertificationPlaceholder') }}" required>
                                <span class="invalid-feedback" role="alert" style="display: none;"></span>
                            </div>
                        </div>
                        @endif
                    </div>
                    @endif
                    @if( $hashBlockchain )
                    <div class="question_group hash_blockchain" style="display:none;">
                        {{-- Hash --}}
                        <div id="ajaxHashBlockchain"></div>
                    </div>
                    @endif
                    @if( $instructions )
                    <div class="question_group contract_waiting" style="display:none;">
                        {{-- Waiting --}}

                        <h1 class="mb-3">{{ __('contract.draft.success.label') }}</h1>

                        {{ __('contract.draft.successSentTo') }} <span id="contract_slave_mail" class="font-weight-bold"></span>

                        <div class="d-flex justify-content-center">
                            @if( Session::has('user') )
                            <div class="btn btn-secondary btn-change-data change-data-button d-flex align-items-center justify-content-center" data-backdrop="true" data-toggle="modal" data-target="#wrongEmail"><i class="fa fa-edit"></i> {{ __('contract.draft.buttonWrongEmail') }}</div>
                            @else
                            <button class="btn btn-secondary btn-change-data change-data-button py-0" style="font-size: 13px; height: 44px;" disabled><i class="fa fa-edit"></i>{{ __('contract.draft.buttonWrongEmail') }}</button>
                            @endif
                        </div>

                        <div class="container mt-5">
                            <div class="row">
                                <h2 class="happenrow mb-3">{{ __('contract.draft.whatsGoingToHappen.label') }}</h2>
                            </div>
                            @foreach ($instructions as $instruction)
                            <div class="row happenrow">
                                <div class="mr-3 mb-2"><img src="{{ $instruction['iconURL'] }}" alt=""></div>
                                <div>
                                    <div class="event_div">
                                        {{ $instruction['title'] }}
                                    </div>
                                    <p class="paragraph_text">{{ $instruction['description'] }}</p>
                                </div>
                            </div>
                            @endforeach
                        </div>

                    </div>
                    @endif
                    @endif
                @endforeach

                </form>

                <div id="ajaxSet"></div>
            </div>

            <div class="container" style="border: 1px solid white;">
                <div class="row">
                    <div class="col-lg-12 m-0 p-0">
                        @if( $contractType == 'hash' )
                            @if( $login )
                                <a href="" id="hashDownload"  target="_blank" class="btn btn-secondary btn-save btn_little_save w-100 d-none">{{ __('button.certificationDownload') }}</a>
                                <button class="btn btn-primary w-100 fly-to-top" id="nextQuestionGroup" disabled> {{ __('button.continue') }}</button>
                                <button class="btn btn-primary w-100 d-none" id="backToDashboard" onclick="window.location='{{ route('dashboard.contracts', app()->getLocale()) }}'"> {{ __('button.backToDashboard') }}</button>

                                {{-- @if( Session::get('user')['contracts_count'] > 0 ) {{-- Van szerződése? --}}
                                {{--@if( 1 ) {{-- Most ingyen van -}}
                                    <a href="" id="hashDownload"  target="_blank" class="btn btn-secondary btn-save btn_little_save w-100 d-none">{{ __('button.certificationDownload') }}</a>
                                    <button class="btn btn-primary w-100 fly-to-top" id="nextQuestionGroup" disabled> {{ __('button.continue') }}</button>
                                    <button class="btn btn-primary w-100 d-none" id="backToDashboard" onclick="window.location='{{ route('dashboard.contracts', app()->getLocale()) }}'"> {{ __('button.backToDashboard') }}</button>
                                @else
                                    <button class="btn btn-primary w-100 fly-to-top" id="trialContractBtn" onclick="subscriptionModalShow()" data-toggle="modal" data-target="#trialModal"> {{ __('button.continue') }}</button>
                                @endif--}}
                            @else
                                <button class="btn btn-primary w-100 fly-to-top save_hash_cookie" id="nextQuestionGroup"> {{ __('button.continue') }}</button>
                                <button class="btn btn-primary w-100 d-none fly-to-top login-msgShow" id="sendContractLogin" onclick="signupModalShow()"> {{ __('button.continue') }}</button>
                            @endif
                        @else
                            <button class="btn btn-primary w-100 fly-to-top save_contract_cookie" id="backToSummary" style="display:none;"> {{ __('button.backToSummary') }}</button>
                            <button class="btn btn-primary w-100 fly-to-top" id="nextQuestionGroup"> {{ __('button.continue') }}</button>
                            <button class="btn btn-primary w-100 d-none" id="backToDashboard" onclick="window.location='{{ route('dashboard.contracts', app()->getLocale()) }}'"> {{ __('button.backToDashboard') }}</button>
                            @if( $login )
                                <button class="btn btn-primary w-100 d-none sendContractBtn fly-to-top" id="sendContract" data-redirect=""> {{ __('button.send') }}</button>
                                {{--@if( Session::get('user')['contracts_count'] > 0 ) {{-- Van szerződése -}}
                                    <button class="btn btn-primary w-100 d-none sendContractBtn fly-to-top" id="sendContract" data-redirect=""> {{ __('button.send') }}</button>
                                @else
                                    <button class="btn btn-primary w-100 d-none fly-to-top" id="trialContractBtn" data-redirect=""> {{ __('button.send') }}</button>
                                    <!--
                                        <button class="btn btn-primary w-100 d-none fly-to-top" id="trialContractBtn" onclick="trialModalShow()" data-toggle="modal" data-target="#trialModal"> {{-- __('button.send') -}}</button>
                                    -->
                                @endif--}}
                            @else
                                <button class="btn btn-primary w-100 d-none fly-to-top login-msgShow" id="sendContractLogin" onclick="signupModalShow()"> {{ __('button.send') }}</button>
                            @endif
                        @endif
                    </div>
                </div>
            </div>

            <div class="form-group text-center mt-5 backToDashboard d-none">
                <button onclick="window.location='