@extends('dashboard.base')

@section('content')
<div class="container mt-4">
    <h4>Edit Standard</h4>

    {{-- Display session messages --}}
    @if(session('success'))
        <div class="alert alert-success">{{ session('success') }}</div>
    @endif

    @if(session('error'))
        <div class="alert alert-danger">{{ session('error') }}</div>
    @endif

    {{-- Validation errors --}}
    @if ($errors->any())
        <div class="alert alert-danger">
            <ul class="mb-0">
                @foreach ($errors->all() as $error)
                    <li>{{ $error }}</li>
                @endforeach
            </ul>
        </div>
    @endif

    <form action="{{ route('standards.update', $standard->id) }}" method="POST" enctype="multipart/form-data" id="editStandardForm">
        @csrf
        @method('PUT')

        <!-- MS Number -->
        <div class="mb-3">
            <label for="code" class="form-label">MS Number</label>
            <input type="text" name="code" id="code" class="form-control" value="{{ old('code', $standard->code ?? '') }}" required>
            <small id="codeHelp" class="text-danger" style="display:none;">Invalid format. Use MS 19:2001</small>
        </div>

        <!-- Title -->
        <div class="mb-3">
            <label for="title" class="form-label">Title</label>
            <input type="text" name="title" id="title" class="form-control" value="{{ old('title', $standard->title ?? '') }}" required>
        </div>

        <!-- Sector -->
        <div class="mb-3">
            <label for="category_id" class="form-label">Sector</label>
            <select name="category_id" id="category_id" class="form-control" required>
                @foreach($categories as $category)
                    <option value="{{ $category->id }}" {{ old('category_id', $standard->category_id ?? '') == $category->id ? 'selected' : '' }}>
                        {{ $category->name }}
                    </option>
                @endforeach
            </select>
        </div>

        <!-- Number of Pages -->
        <div class="mb-3">
            <label for="number_of_pages" class="form-label">Number of Pages</label>
            <input type="number" name="number_of_pages" id="number_of_pages" class="form-control" value="{{ old('number_of_pages', $standard->number_of_pages ?? '') }}" required>
        </div>

        <!-- Price -->
        <div class="mb-3">
            <label for="price" class="form-label">Price (MWK)</label>
            <input type="text" id="price" class="form-control" value="" readonly>
            <input type="hidden" name="price_numeric" id="price_numeric" value="{{ old('price_numeric', $standard->price ?? 0) }}">
        </div>

        <!-- ✅ Date Gazetted -->
        <div class="mb-3">
            <label for="date_gazetted" class="form-label">Date Gazetted</label>
            <input type="date" name="date_gazetted" id="date_gazetted" class="form-control"
                value="{{ old('date_gazetted', $standard->date_gazetted ?? '') }}" required>
        </div>

        <!-- Description -->
        <div class="mb-3">
            <label for="type" class="form-label">Description</label>
            <input type="text" name="description" id="type" class="form-control" value="{{ old('type', $standard->description ?? '') }}" required>
        </div>

        <!-- File Upload -->
        <div class="mb-3">
            <label for="file" class="form-label">Upload PDF</label>
            <input type="file" name="file" id="file" class="form-control">
            <small id="expectedFilename" class="text-info"></small><br>
            <small id="fileHelp" class="text-danger" style="display:none;">Filename does not match the standard code format.</small>
        </div>

        <button type="submit" class="btn btn-success" id="submitBtn">Update Standard</button>
    </form>
</div>

<script>
const codeInput = document.getElementById('code');
const fileInput = document.getElementById('file');
const codeHelp = document.getElementById('codeHelp');
const fileHelp = document.getElementById('fileHelp');
const submitBtn = document.getElementById('submitBtn');
const expectedFilename = document.getElementById('expectedFilename');
const numberOfPagesInput = document.getElementById('number_of_pages');
const priceInput = document.getElementById('price');
const priceNumericInput = document.getElementById('price_numeric');

// Price table
const priceTable = [
    { min: 1, max: 2, price: 11250 },
    { min: 3, max: 4, price: 13125 },
    { min: 5, max: 6, price: 15000 },
    { min: 7, max: 8, price: 16875 },
    { min: 9, max: 10, price: 18750 },
    { min: 11, max: 13, price: 18750 },
    { min: 14, max: 16, price: 22500 },
    { min: 17, max: 19, price: 24375 },
    { min: 20, max: 22, price: 24375 },
    { min: 23, max: 25, price: 24375 },
    { min: 26, max: 28, price: 26250 },
    { min: 29, max: 30, price: 28125 },
    { min: 31, max: 35, price: 28125 },
    { min: 36, max: 40, price: 28125 },
    { min: 41, max: 45, price: 28125 },
    { min: 46, max: 50, price: 30000 },
    { min: 51, max: 60, price: 30000 },
    { min: 61, max: 70, price: 30000 },
    { min: 71, max: 80, price: 31875 },
    { min: 81, max: 90, price: 31875 },
    { min: 91, max: 100, price: 35625 },
    { min: 101, max: 120, price: 37500 },
    { min: 121, max: 140, price: 37500 },
    { min: 141, max: 160, price: 37500 },
    { min: 161, max: 180, price: 39375 },
    { min: 181, max: 200, price: 39375 },
    { min: 201, max: 225, price: 39375 },
    { min: 226, max: 250, price: 41875 },
    { min: 251, max: 275, price: 45000 },
    { min: 276, max: 300, price: 45000 }
];

// Format numbers
function formatNumberWithCommas(num) {
    return num.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",");
}

// Calculate price
function calculatePrice() {
    const pages = parseInt(numberOfPagesInput.value);
    const entry = priceTable.find(p => pages >= p.min && pages <= p.max);
    if (entry) {
        priceInput.value = formatNumberWithCommas(entry.price);
        priceNumericInput.value = entry.price;
    } else if (pages === 0 || isNaN(pages)) {
        priceInput.value = formatNumberWithCommas({{ $standard->price ?? 0 }});
        priceNumericInput.value = {{ $standard->price ?? 0 }};
    } else {
        priceInput.value = '';
        priceNumericInput.value = '';
    }
}

// Initialize
calculatePrice();
numberOfPagesInput.addEventListener('input', calculatePrice);

// Code & file validation
function validateCodeFormat(code) {
    return /^MS\s\d{1,4}:\d{4}$/.test(code);
}

function codeToFilename(code) {
    return code.replace(/[: ]/g, '_') + '.pdf';
}

function validateFile(file) {
    if (!file) return true;
    const expected = codeToFilename(codeInput.value);
    return file.name === expected;
}

function validateForm() {
    const codeValid = validateCodeFormat(codeInput.value);
    const fileValid = validateFile(fileInput.files[0]);

    codeHelp.style.display = codeValid ? 'none' : 'block';
    fileHelp.style.display = fileValid ? 'none' : 'block';

    expectedFilename.textContent = codeValid ? "Expected filename: " + codeToFilename(codeInput.value) : '';
    submitBtn.disabled = !(codeValid && fileValid);
}

codeInput.addEventListener('input', validateForm);
fileInput.addEventListener('change', validateForm);
validateForm();
</script>
@endsection