@extends('frame')

@section('title', 'The Dash | '. $title)

@section('main-content')
    <article class="settings">
        <section class="member-settings">
            <div class="member-avatar">
                <div class="avatar" style="background: url({{ $member['avatar'] }} ) no-repeat center center / cover"></div>
                <input id="avatar-upload" type="file" name="avatar-upload"/>
            </div>
            <div class="site-background">
                <div class="background" style="background: url({{ $background }} ) no-repeat center center / cover"></div>
                <input id="background-upload" type="file" name="backgrond-upload"/>
            </div>
            <div>
                <input type='text' name='handle' id='settings-handle' placeholder='handle' value="{{ $member['handle'] }}" autofocus/>
                <input type='text' name='email' id='settings-email' placeholder='email' value="{{ $member['email'] }}" autofocus/>
                <input type='text' name='base-url' id='settings-url' placeholder='url' value="{{ $baseUrl }}" autofocus/>
                <input type='text' name='base-title' id='settings-title' placeholder='site title' value="{{ $siteTitle }}" autofocus/>
                <textarea id="settings-desc" type='text' name='settings_desc' class='settings-dec' placeholder='description stuff' , autofocus>{{ $desc }}</textarea>
            </div>

            <div>
                <button id="create-backup">
                    <svg id="nav-menu-icon" class="icon">
                        <use id="nav-menu-icon" xlink:href="/assets/images/global/sprite.svg#entypo-back-in-time"/>
                    </svg>
                    <span>CREATE BACKUP</span>
                </button><br/>
                @if($lastBackup != '')
                    LAST BACK UP<br/>
                    <a href="/api/v1/files">{{ $lastBackup }}</a><br/>
                @else
                    <span>span No back ups. Frowny face.</span>
                @endif
            </div>
            <div class="features">
                @if(isset($apiStatus) && $apiStatus == 'true')
                    <button id="api-access-toggle" title="allow external api" data-enabled="true">
                        <svg id="nav-menu-icon" class="icon">
                            <use id="nav-menu-icon" xlink:href="/assets/images/global/sprite.svg#entypo-landline"/>
                        </svg>
                        <span id="api-status">API ACCESS ENABLED</span>
                    </button>
                @else
                    <button id="api-access-toggle" title="allow external api" data-enabled="false">
                        <svg id="nav-menu-icon" class="icon">
                            <use id="nav-menu-icon" xlink:href="/assets/images/global/sprite.svg#entypo-landline"/>
                        </svg>
                        <span id="api-status">API ACCESS NOT ENABLED</span>
                    </button>

                @endif
                @if(isset($dynamicRenderStatus) && $dynamicRenderStatus == 'true')
                    <button id="dynamic-render-toggle" title="allow external api" data-enabled="true">
                        <svg id="nav-menu-icon" class="icon">
                            <use id="nav-menu-icon" xlink:href="/assets/images/global/sprite.svg#entypo-cycle"/>
                        </svg>
                        <span id="dynamic-render-status">DYNAMIC PAGE RENDERING</span>
                    </button>

                @else
                    <button id="dynamic-render-toggle" title="allow external api" data-enabled="false">
                        <svg id="nav-menu-icon" class="icon">
                            <use id="nav-menu-icon" xlink:href="/assets/images/global/sprite.svg#entypo-cycle"/>
                        </svg>
                        <span id="dynamic-render-status">STATIC PAGE RENDERING</span>
                    </button>

                @endif
            </div>
            <div class="theme">
                <label>Themes</label><br/>
                @foreach($themes as $theme)
                    @if($theme['name'] == $currentTheme)
                        <button id="{{ $theme['name'] }}" class="theme-select" data-enabled="true">
                            <svg id="nav-menu-icon" class="icon">
                                <use id="nav-menu-icon" xlink:href="/assets/images/global/sprite.svg#entypo-palette"/>
                            </svg>
                            <span>{{ $theme['display-name'] }}</span>
                        </button>
                    @else
                        <button href="#" id="{{ $theme['name'] }}" class="theme-select" data-enabled="false">
                            <svg id="nav-menu-icon" class="icon">
                                <use id="nav-menu-icon" xlink:href="/assets/images/global/sprite.svg#entypo-palette"/>
                            </svg>
                            <span>{{ $theme['display-name'] }}</span>
                        </button>
                    @endif
                @endforeach
            </div>
            <div class="mail">
                <label>Email</label><br/>
                @if($mailOption == "option-none" or $mailOption == "")
                    <a href="#" class="mail-option" id="option-none" data-enabled="true">NONE</a>
                @else
                    <a href="#" class="mail-option" id="option-none" data-enabled="false">NONE</a>
                @endif
                @if($mailOption == "option-mg" or $mailOption == "")
                    <a href="#" class="mail-option" id="option-mg" data-enabled="true">MAILGUN</a>
                @else
                    <a href="#" class="mail-option" id="option-mg" data-enabled="false">MAILGUN</a>
                @endif
                @if($mailOption == "option-smtp" or $mailOption == "")
                    <a href="#" class="mail-option" id="option-smtp" data-enabled="true">SMTP</a>
                @else
                    <a href="#" class="mail-option" id="option-smtp" data-enabled="false">SMTP</a>
                @endif
                @include('forms.mailforms')
                <button id="send-mail">
                    <svg id="nav-menu-icon" class="icon">
                        <use id="nav-menu-icon" xlink:href="/assets/images/global/sprite.svg#entypo-mail-with-circle"/>
                    </svg>
                    <span>TEST MAIL</span>
                </button>
            </div>
            <div>
                <label>API KEY</label>
                <br/>
                {{ $member['key'] }}
                <br/>
                <label>FORM TOKEN</label><br/>
                {{ $ftoken }}
            </div>
        </section>
    </article>
@endsection
  @section('scripting')
    <script type="module" src="/assets/scripts/dash/app/EditSettings.js"></script>
  @endsection