<section class="content-header">
    <h1><?= __('Social network plugin settings') ?></h1>
</section>

<section class="content">
    <form data-ajax class="form-focus" action="<?= admin_url_to('/social-network/config') ?>" method="post">
        <?= csrf_field() ?>

        <div class="nav-tabs-custom">
            <ul class="nav nav-tabs">
                <li class="active"><a href="#sn-facebook" data-toggle="tab">Facebook</a></li>
                <li><a href="#sn-google" data-toggle="tab">Google</a></li>
            </ul>

            <div class="tab-content">
                <div class="tab-pane active" id="sn-facebook">
                    <div class="section">
                        <div class="row">
                            <div class="col-lg-3 col-md-3 col-sm-4 col-xs-12">
                                <h5><?= __('Settings') ?></h5>
                            </div>

                            <div class="col-lg-9 col-md-9 col-sm-8 col-xs-12">
                                <div class="form-group">
                                    <label class="control-label" for="facebook-active"><?= __('Active') ?></label>
                                    <div>
                                        <input class="form-control toggle" type="checkbox" id="facebook-active"<?= config('sn.facebook.login') ? 'checked="checked"' : '' ?> value="1" name="facebook_active" />
                                    </div>
                                </div>

                                <div class="form-group">
                                    <label class="control-label" for="sn-facebook-id"><?= __('Client ID') ?></label>
                                    <input class="form-control" type="text" value="<?= config('sn.facebook.keys.id') ?>" name="facebook_id" id="sn-facebook-id" />
                                </div>

                                <div class="form-group">
                                    <label class="control-label" for="sn-facebook-secret"><?= __('Client secret') ?></label>
                                    <input class="form-control" type="text" value="<?= config('sn.facebook.keys.secret') ?>" name="facebook_secret" id="sn-facebook-secret" />
                                </div>
                            </div>
                        </div>
                    </div>
                </div>

                <div class="tab-pane" id="sn-google">
                    <div class="section">
                        <div class="row">
                            <div class="col-lg-3 col-md-3 col-sm-4 col-xs-12">
                                <h5><?= __('Settings') ?></h5>
                            </div>

                            <div class="col-lg-9 col-md-9 col-sm-8 col-xs-12">
                                <div class="form-group">
                                    <label class="control-label" for="google-active"><?= __('Active') ?></label>
                                    <div>
                                        <input class="form-control toggle" type="checkbox" id="google-active"<?= config('sn.google.login') ? 'checked="checked"' : '' ?> value="1" name="google_active" />
                                    </div>
                                </div>

                                <div class="form-group">
                                    <label class="control-label" for="sn-google-id"><?= __('Client ID') ?></label>
                                    <input class="form-control" type="text" value="<?= config('sn.google.keys.id') ?>" name="google_id" id="sn-google-id" />
                                </div>

                                <div class="form-group">
                                    <label class="control-label" for="sn-google-secret"><?= __('Client secret') ?></label>
                                    <input class="form-control" type="text" value="<?= config('sn.google.keys.secret') ?>" name="google_secret" id="sn-google-secret" />
                                </div>
                            </div>
                        </div>
                    </div>
                </div>

                <div class="box-footer">
                    <div class="row">
                        <div class="col-sm-offset-3" style="padding-left:10px">
                            <input type="submit" class="btn btn-primary" value="<?= __('Save') ?>" />
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </form>
</section>