{{template "layout.html" .}}

{{define "content"}}
<link rel="stylesheet" href="{{asset "/template/default/assets/css/admin-pages.css"}}">

{{template "admin-hero-styles" .}}

<div class="featurecfg-page">
    <details class="admin-hero">
        <summary class="admin-hero-bar">
            <span class="admin-hero-icon" aria-hidden="true"><i class='bx bx-toggle-left'></i></span>
            <span class="admin-hero-intro">{{T "admin_feature_config_page_hint"}}</span>
            <span class="admin-hero-toggle">
                <span class="admin-hero-toggle-label"><i class='bx bx-info-circle' aria-hidden="true"></i> {{T "admin_usage_title"}}</span>
                {{template "admin-hero-help-meta" .}}
            </span>
        </summary>
        <div class="admin-hero-body">
            <ul class="admin-hero-field-grid">
                <li class="admin-hero-field-item"><strong>{{T "admin_feature_config_usage_comments"}}</strong>{{T "admin_feature_config_usage_comments_desc"}}</li>
                <li class="admin-hero-field-item"><strong>{{T "admin_feature_config_usage_audit"}}</strong>{{T "admin_feature_config_usage_audit_desc"}}</li>
            </ul>
        </div>
    </details>

    <div class="featurecfg-topbar">
        <div class="featurecfg-stats">
            <span class="badge {{if .Data.CommentsEnabled}}bg-success{{else}}bg-secondary{{end}}" id="featureCommentsBadge">
                {{if .Data.CommentsEnabled}}{{T "admin_comments_master_on"}}{{else}}{{T "admin_comments_master_off"}}{{end}}
            </span>
            <span class="badge {{if .Data.CommentAudit}}bg-warning text-dark{{else}}bg-light text-dark border{{end}}" id="featureAuditBadge">
                {{if .Data.CommentAudit}}{{T "admin_feature_enable_comment_audit"}}{{else}}{{T "admin_feature_config_audit_off"}}{{end}}
            </span>
        </div>
    </div>

    <div class="featurecfg-card">
        <div class="card-body">
            <div class="settings-head">
                <h6><i class='bx bx-message-square-dots'></i> {{T "admin_feature_config_title"}}</h6>
            </div>
            <p class="settings-desc">{{T "admin_feature_config_desc"}}</p>
            <form id="featureConfigForm">
                <div class="featurecfg-item">
                    <div class="form-check form-switch">
                        <input class="form-check-input" type="checkbox" id="enable_document_comments" name="enable_document_comments" {{if .Data.CommentsEnabled}}checked{{end}}>
                        <label class="form-check-label" for="enable_document_comments">
                            <strong>{{T "admin_feature_enable_comments"}}</strong>
                            <div class="text-muted">{{T "admin_feature_enable_comments_desc"}}</div>
                        </label>
                    </div>
                </div>
                <div class="featurecfg-item">
                    <div class="form-check form-switch">
                        <input class="form-check-input" type="checkbox" id="enable_comment_audit" name="enable_comment_audit" {{if .Data.CommentAudit}}checked{{end}}>
                        <label class="form-check-label" for="enable_comment_audit">
                            <strong>{{T "admin_feature_enable_comment_audit"}}</strong>
                            <div class="text-muted">{{T "admin_feature_enable_comment_audit_desc"}}</div>
                        </label>
                    </div>
                </div>
                <div class="featurecfg-save-hint">
                    <i class='bx bx-info-circle'></i> {{T "admin_feature_config_autosave_hint"}}
                </div>
            </form>
        </div>
    </div>
</div>
{{end}}

{{define "scripts"}}
<script>
var FeatureConfigI18n = {
    saved: {{json (T "admin_feature_config_saved")}},
    masterOn: {{json (T "admin_comments_master_on")}},
    masterOff: {{json (T "admin_comments_master_off")}},
    auditOn: {{json (T "admin_feature_enable_comment_audit")}},
    auditOff: {{json (T "admin_feature_config_audit_off")}},
    saveFailed: {{json (T "admin_failed")}}
};
function showFeatureFlashToast(msg, type) {
    if (!msg || typeof BootstrapModal === 'undefined') return;
    BootstrapModal.flash(msg, type, 2000);
}
$(function() {
    function updateBadges() {
        var commentsOn = $('#enable_document_comments').is(':checked');
        var auditOn = $('#enable_comment_audit').is(':checked');
        var $commentsBadge = $('#featureCommentsBadge');
        var $auditBadge = $('#featureAuditBadge');
        if (commentsOn) {
            $commentsBadge.removeClass('bg-secondary').addClass('bg-success').text(FeatureConfigI18n.masterOn);
        } else {
            $commentsBadge.removeClass('bg-success').addClass('bg-secondary').text(FeatureConfigI18n.masterOff);
        }
        if (auditOn) {
            $auditBadge.removeClass('bg-light border').addClass('bg-warning text-dark').text(FeatureConfigI18n.auditOn);
        } else {
            $auditBadge.removeClass('bg-warning text-dark').addClass('bg-light text-dark border').text(FeatureConfigI18n.auditOff);
        }
    }

    function saveFeatureConfig() {
        return $.ajax({
            url: '/admin/feature-config-save',
            method: 'POST',
            contentType: 'application/json',
            data: JSON.stringify({
                enable_document_comments: $('#enable_document_comments').is(':checked') ? '1' : '0',
                enable_comment_audit: $('#enable_comment_audit').is(':checked') ? '1' : '0'
            })
        }).done(function(res) {
            if (res.success) {
                updateBadges();
                showFeatureFlashToast(res.message || FeatureConfigI18n.saved, 'success');
            } else {
                showFeatureFlashToast(res.message || FeatureConfigI18n.saveFailed, 'danger');
            }
        }).fail(function() {
            showFeatureFlashToast(FeatureConfigI18n.saveFailed, 'danger');
        });
    }

    $('#enable_document_comments, #enable_comment_audit').on('change', function() {
        saveFeatureConfig();
    });

    $('#featureConfigForm').on('submit', function(e) {
        e.preventDefault();
        saveFeatureConfig();
    });
});
</script>
{{end}}