<?php
/**
 * Modern Create/Edit Card View
 */
if ( ! defined( 'ABSPATH' ) ) { exit; }

$cloudi7_icg_is_edit = ( $cloudi7_icg_card ) ? true : false;
$cloudi7_icg_extra_data = $cloudi7_icg_is_edit ? json_decode( $cloudi7_icg_card->extra_data, true ) : array();

$cloudi7_icg_cf1_label = get_option( 'cloudi7_icg_custom_field_1_label', '' );
$cloudi7_icg_cf2_label = get_option( 'cloudi7_icg_custom_field_2_label', '' );
$cloudi7_icg_cf3_label = get_option( 'cloudi7_icg_custom_field_3_label', '' );
?>

<div class="cloudi7-icg-form-wrap">
    
    <!-- Page Header -->
    <header class="cloudi7-icg-form-header">
        <h1><?php echo $cloudi7_icg_is_edit ? esc_html__( 'Edit ID Card', 'cloudi7-id-card-generator' ) : esc_html__( 'Create New ID Card', 'cloudi7-id-card-generator' ); ?></h1>
        <p><?php esc_html_e( 'Fill in the details to generate a new professional ID card.', 'cloudi7-id-card-generator' ); ?></p>
    </header>

    <form method="post" action="">
        <?php wp_nonce_field( 'cloudi7_icg_action', 'cloudi7_icg_nonce' ); ?>
        <input type="hidden" name="id" value="<?php echo $cloudi7_icg_is_edit ? esc_attr( $cloudi7_icg_card->id ) : ''; ?>">

        <div class="cloudi7-icg-form-grid">
            
            <!-- Left Side: Form Sections -->
            <div class="cloudi7-icg-form-left">
                
                <!-- Section 1: Basic Information -->
                <div class="cloudi7-icg-form-section">
                    <h2><span class="dashicons dashicons-admin-users"></span> <?php esc_html_e( 'Basic Information', 'cloudi7-id-card-generator' ); ?></h2>
                    <table class="form-table">
                        <tr>
                            <th scope="row"><label for="name"><?php esc_html_e( 'Full Name', 'cloudi7-id-card-generator' ); ?></label></th>
                            <td><input name="name" type="text" id="name" value="<?php echo $cloudi7_icg_is_edit ? esc_attr( $cloudi7_icg_card->name ) : ''; ?>" placeholder="e.g. John Doe" required></td>
                        </tr>
                        
                        <tr>
                            <th scope="row"><label for="photo"><?php esc_html_e( 'Profile Photo', 'cloudi7-id-card-generator' ); ?></label></th>
                            <td>
                                <div class="cloudi7-icg-upload-box">
                                    <input name="photo" type="text" id="photo" value="<?php echo $cloudi7_icg_is_edit ? esc_attr( $cloudi7_icg_card->photo ) : ''; ?>" class="cloudi7-icg-photo-url">
                                    <div class="cloudi7-icg-upload-placeholder cloudi7-icg-upload-button" data-input="#photo" data-preview=".cloudi7-icg-photo-preview" style="cursor: pointer;">
                                        <span class="dashicons dashicons-upload"></span>
                                        <span><?php esc_html_e( 'Click to upload or select photo', 'cloudi7-id-card-generator' ); ?></span>
                                    </div>
                                    <button type="button" class="button cloudi7-icg-remove-button" data-input="#photo" data-preview=".cloudi7-icg-photo-preview" style="margin-top: 10px; display: <?php echo $cloudi7_icg_is_edit && $cloudi7_icg_card->photo ? 'inline-block' : 'none'; ?>;"><?php esc_html_e( 'Remove Photo', 'cloudi7-id-card-generator' ); ?></button>
                                </div>
                            </td>
                        </tr>

                        <tr>
                            <th scope="row"><label for="organization_type"><?php esc_html_e( 'Organization Type', 'cloudi7-id-card-generator' ); ?></label></th>
                            <td>
                                <select name="organization_type" id="organization_type">
                                    <?php 
                                    $cloudi7_icg_types = array( 'School', 'Corporate', 'Event', 'Club', 'Custom' );
                                    foreach ( $cloudi7_icg_types as $cloudi7_icg_type_item ) : 
                                        $cloudi7_icg_selected_val = ( $cloudi7_icg_is_edit && isset( $cloudi7_icg_card->organization_type ) ) ? $cloudi7_icg_card->organization_type : '';
                                    ?>
                                        <option value="<?php echo esc_attr( $cloudi7_icg_type_item ); ?>" <?php selected( $cloudi7_icg_selected_val, $cloudi7_icg_type_item ); ?>><?php echo esc_html( $cloudi7_icg_type_item ); ?></option>
                                    <?php endforeach; ?>
                                </select>
                            </td>
                        </tr>

                        <tr>
                            <th scope="row"><label for="dob"><?php esc_html_e( 'Date of Birth', 'cloudi7-id-card-generator' ); ?></label></th>
                            <td><input name="dob" type="date" id="dob" value="<?php echo $cloudi7_icg_is_edit ? esc_attr( $cloudi7_icg_card->dob ) : ''; ?>"></td>
                        </tr>
                        <tr>
                            <th scope="row"><label for="blood_group"><?php esc_html_e( 'Blood Group', 'cloudi7-id-card-generator' ); ?></label></th>
                            <td><input name="blood_group" type="text" id="blood_group" value="<?php echo $cloudi7_icg_is_edit ? esc_attr( $cloudi7_icg_card->blood_group ) : ''; ?>" placeholder="e.g. O+"></td>
                        </tr>
                        <tr>
                            <th scope="row"><label for="gov_id"><?php esc_html_e( 'Gov ID Number', 'cloudi7-id-card-generator' ); ?></label></th>
                            <td><input name="gov_id" type="text" id="gov_id" value="<?php echo $cloudi7_icg_is_edit ? esc_attr( $cloudi7_icg_card->gov_id ) : ''; ?>"></td>
                        </tr>
                        <tr>
                            <th scope="row"><label for="parent_name"><?php esc_html_e( 'Parent/Guardian Name', 'cloudi7-id-card-generator' ); ?></label></th>
                            <td><input name="parent_name" type="text" id="parent_name" value="<?php echo $cloudi7_icg_is_edit ? esc_attr( $cloudi7_icg_card->parent_name ) : ''; ?>"></td>
                        </tr>
                        <tr>
                            <th scope="row"><label for="parent_phone"><?php esc_html_e( 'Parent Phone', 'cloudi7-id-card-generator' ); ?></label></th>
                            <td><input name="parent_phone" type="text" id="parent_phone" value="<?php echo $cloudi7_icg_is_edit ? esc_attr( $cloudi7_icg_card->parent_phone ) : ''; ?>"></td>
                        </tr>
                        <tr>
                            <th scope="row"><label for="email"><?php esc_html_e( 'Email Address', 'cloudi7-id-card-generator' ); ?></label></th>
                            <td><input name="email" type="email" id="email" value="<?php echo $cloudi7_icg_is_edit ? esc_attr( $cloudi7_icg_card->email ) : ''; ?>" placeholder="name@example.com"></td>
                        </tr>
                        <tr>
                            <th scope="row"><label for="phone"><?php esc_html_e( 'Phone Number', 'cloudi7-id-card-generator' ); ?></label></th>
                            <td><input name="phone" type="text" id="phone" value="<?php echo $cloudi7_icg_is_edit ? esc_attr( $cloudi7_icg_card->phone ) : ''; ?>" placeholder="+1 234 567 890"></td>
                        </tr>
                        <tr>
                            <th scope="row"><label for="address"><?php esc_html_e( 'Address', 'cloudi7-id-card-generator' ); ?></label></th>
                            <td><textarea name="address" id="address" rows="2" placeholder="Street, City, Country"><?php echo $cloudi7_icg_is_edit ? esc_textarea( $cloudi7_icg_card->address ) : ''; ?></textarea></td>
                        </tr>
                        <?php if ( $cloudi7_icg_cf1_label ) : ?>
                        <tr>
                            <th scope="row"><label for="custom_field_1"><?php echo esc_html( $cloudi7_icg_cf1_label ); ?></label></th>
                            <td><input name="custom_field_1" type="text" id="custom_field_1" value="<?php echo isset( $cloudi7_icg_extra_data['custom_field_1'] ) ? esc_attr( $cloudi7_icg_extra_data['custom_field_1'] ) : ''; ?>"></td>
                        </tr>
                        <?php endif; ?>
                        <?php if ( $cloudi7_icg_cf2_label ) : ?>
                        <tr>
                            <th scope="row"><label for="custom_field_2"><?php echo esc_html( $cloudi7_icg_cf2_label ); ?></label></th>
                            <td><input name="custom_field_2" type="text" id="custom_field_2" value="<?php echo isset( $cloudi7_icg_extra_data['custom_field_2'] ) ? esc_attr( $cloudi7_icg_extra_data['custom_field_2'] ) : ''; ?>"></td>
                        </tr>
                        <?php endif; ?>
                        <?php if ( $cloudi7_icg_cf3_label ) : ?>
                        <tr>
                            <th scope="row"><label for="custom_field_3"><?php echo esc_html( $cloudi7_icg_cf3_label ); ?></label></th>
                            <td><input name="custom_field_3" type="text" id="custom_field_3" value="<?php echo isset( $cloudi7_icg_extra_data['custom_field_3'] ) ? esc_attr( $cloudi7_icg_extra_data['custom_field_3'] ) : ''; ?>"></td>
                        </tr>
                        <?php endif; ?>
                    </table>
                </div>

                <!-- Section 2: Organization Details (Dynamic) -->
                <div class="cloudi7-icg-form-section highlighted">
                    <h2><span class="dashicons dashicons-building"></span> <?php esc_html_e( 'Organization Details', 'cloudi7-id-card-generator' ); ?></h2>
                    <table class="form-table">
                        <!-- School Dynamic Fields -->
                        <tbody id="fields-School" class="org-fields">
                            <tr>
                                <th scope="row"><label for="school_class"><?php esc_html_e( 'Class / Grade', 'cloudi7-id-card-generator' ); ?></label></th>
                                <td><input name="school_class" type="text" id="school_class" value="<?php echo isset( $cloudi7_icg_extra_data['class'] ) ? esc_attr( $cloudi7_icg_extra_data['class'] ) : ''; ?>"></td>
                            </tr>
                            <tr>
                                <th scope="row"><label for="school_blood_group"><?php esc_html_e( 'Blood Group', 'cloudi7-id-card-generator' ); ?></label></th>
                                <td><input name="school_blood_group" type="text" id="school_blood_group" value="<?php echo isset( $cloudi7_icg_extra_data['blood_group'] ) ? esc_attr( $cloudi7_icg_extra_data['blood_group'] ) : ''; ?>"></td>
                            </tr>
                            <tr>
                                <th scope="row"><label for="school_father_guardian_name"><?php esc_html_e( 'Father/Guardian Name', 'cloudi7-id-card-generator' ); ?></label></th>
                                <td><input name="school_father_guardian_name" type="text" id="school_father_guardian_name" value="<?php echo isset( $cloudi7_icg_extra_data['father_guardian_name'] ) ? esc_attr( $cloudi7_icg_extra_data['father_guardian_name'] ) : ''; ?>"></td>
                            </tr>
                        </tbody>
                        
                        <!-- Corporate Dynamic Fields -->
                        <tbody id="fields-Corporate" class="org-fields">
                            <tr>
                                <th scope="row"><label for="corp_department"><?php esc_html_e( 'Department', 'cloudi7-id-card-generator' ); ?></label></th>
                                <td><input name="corp_department" type="text" id="corp_department" value="<?php echo isset( $cloudi7_icg_extra_data['department'] ) ? esc_attr( $cloudi7_icg_extra_data['department'] ) : ''; ?>"></td>
                            </tr>
                            <tr>
                                <th scope="row"><label for="corp_designation"><?php esc_html_e( 'Designation', 'cloudi7-id-card-generator' ); ?></label></th>
                                <td><input name="corp_designation" type="text" id="corp_designation" value="<?php echo isset( $cloudi7_icg_extra_data['designation'] ) ? esc_attr( $cloudi7_icg_extra_data['designation'] ) : ''; ?>"></td>
                            </tr>
                            <tr>
                                <th scope="row"><label for="corp_employee_id"><?php esc_html_e( 'Employee ID', 'cloudi7-id-card-generator' ); ?></label></th>
                                <td><input name="corp_employee_id" type="text" id="corp_employee_id" value="<?php echo isset( $cloudi7_icg_extra_data['employee_id'] ) ? esc_attr( $cloudi7_icg_extra_data['employee_id'] ) : ''; ?>"></td>
                            </tr>
                        </tbody>
                        
                        <!-- Event Dynamic Fields -->
                        <tbody id="fields-Event" class="org-fields">
                            <tr>
                                <th scope="row"><label for="event_name"><?php esc_html_e( 'Event Name', 'cloudi7-id-card-generator' ); ?></label></th>
                                <td><input name="event_name" type="text" id="event_name" value="<?php echo isset( $cloudi7_icg_extra_data['event_name'] ) ? esc_attr( $cloudi7_icg_extra_data['event_name'] ) : ''; ?>"></td>
                            </tr>
                            <tr>
                                <th scope="row"><label for="event_role"><?php esc_html_e( 'Role', 'cloudi7-id-card-generator' ); ?></label></th>
                                <td><input name="event_role" type="text" id="event_role" value="<?php echo isset( $cloudi7_icg_extra_data['role'] ) ? esc_attr( $cloudi7_icg_extra_data['role'] ) : ''; ?>"></td>
                            </tr>
                            <tr>
                                <th scope="row"><label for="event_organization"><?php esc_html_e( 'Organization', 'cloudi7-id-card-generator' ); ?></label></th>
                                <td><input name="event_organization" type="text" id="event_organization" value="<?php echo isset( $cloudi7_icg_extra_data['organization'] ) ? esc_attr( $cloudi7_icg_extra_data['organization'] ) : ''; ?>"></td>
                            </tr>
                        </tbody>

                        <!-- Club Dynamic Fields -->
                        <tbody id="fields-Club" class="org-fields">
                            <tr>
                                <th scope="row"><label for="club_member_id"><?php esc_html_e( 'Membership ID', 'cloudi7-id-card-generator' ); ?></label></th>
                                <td><input name="club_member_id" type="text" id="club_member_id" value="<?php echo isset( $cloudi7_icg_extra_data['membership_id'] ) ? esc_attr( $cloudi7_icg_extra_data['membership_id'] ) : ''; ?>"></td>
                            </tr>
                            <tr>
                                <th scope="row"><label for="club_role"><?php esc_html_e( 'Role', 'cloudi7-id-card-generator' ); ?></label></th>
                                <td><input name="club_role" type="text" id="club_role" value="<?php echo isset( $cloudi7_icg_extra_data['role'] ) ? esc_attr( $cloudi7_icg_extra_data['role'] ) : ''; ?>"></td>
                            </tr>
                            <tr>
                                <th scope="row"><label for="club_join_date"><?php esc_html_e( 'Join Date', 'cloudi7-id-card-generator' ); ?></label></th>
                                <td><input name="club_join_date" type="date" id="club_join_date" value="<?php echo isset( $cloudi7_icg_extra_data['join_date'] ) ? esc_attr( $cloudi7_icg_extra_data['join_date'] ) : ''; ?>"></td>
                            </tr>
                        </tbody>

                        <!-- Custom Dynamic Fields -->
                        <tbody id="fields-Custom" class="org-fields">
                            <tr>
                                <th scope="row"><label for="custom_department"><?php esc_html_e( 'Department', 'cloudi7-id-card-generator' ); ?></label></th>
                                <td><input name="custom_department" type="text" id="custom_department" value="<?php echo isset( $cloudi7_icg_extra_data['department'] ) ? esc_attr( $cloudi7_icg_extra_data['department'] ) : ''; ?>"></td>
                            </tr>
                            <tr>
                                <th scope="row"><label for="custom_role"><?php esc_html_e( 'Role', 'cloudi7-id-card-generator' ); ?></label></th>
                                <td><input name="custom_role" type="text" id="custom_role" value="<?php echo isset( $cloudi7_icg_extra_data['role'] ) ? esc_attr( $cloudi7_icg_extra_data['role'] ) : ''; ?>"></td>
                            </tr>
                            <tr>
                                <th scope="row"><label for="custom_notes"><?php esc_html_e( 'Notes', 'cloudi7-id-card-generator' ); ?></label></th>
                                <td><textarea name="custom_notes" id="custom_notes" rows="2"><?php echo isset( $cloudi7_icg_extra_data['notes'] ) ? esc_textarea( $cloudi7_icg_extra_data['notes'] ) : ''; ?></textarea></td>
                            </tr>
                        </tbody>
                    </table>
                </div>

                <!-- Section 3: Card Validity -->
                <div class="cloudi7-icg-form-section">
                    <h2><span class="dashicons dashicons-calendar-alt"></span> <?php esc_html_e( 'Card Validity', 'cloudi7-id-card-generator' ); ?></h2>
                    <table class="form-table">
                        <tr>
                            <th scope="row"><label for="issue_date"><?php esc_html_e( 'Issue Date', 'cloudi7-id-card-generator' ); ?></label></th>
                            <td><input name="issue_date" type="date" id="issue_date" value="<?php echo $cloudi7_icg_is_edit ? esc_attr( $cloudi7_icg_card->issue_date ) : ''; ?>"></td>
                        </tr>
                        <tr>
                            <th scope="row"><label for="expiry_date"><?php esc_html_e( 'Expiry Date', 'cloudi7-id-card-generator' ); ?></label></th>
                            <td><input name="expiry_date" type="date" id="expiry_date" value="<?php echo $cloudi7_icg_is_edit ? esc_attr( $cloudi7_icg_card->expiry_date ) : ''; ?>"></td>
                        </tr>
                    </table>
                </div>

            </div>

            <!-- Right Side: Sidebar Preview -->
            <aside class="cloudi7-icg-sidebar-preview">
                <div class="cloudi7-icg-preview-card-box">
                    <h3><?php esc_html_e( 'Photo Preview', 'cloudi7-id-card-generator' ); ?></h3>
                    <div class="cloudi7-icg-form-photo-preview cloudi7-icg-photo-preview">
                        <?php if ( $cloudi7_icg_is_edit && $cloudi7_icg_card->photo ) : ?>
                            <img src="<?php echo esc_url( $cloudi7_icg_card->photo ); ?>" id="cloudi7-icg-main-photo-preview">
                        <?php else : ?>
                            <div class="cloudi7-icg-upload-placeholder" style="padding: 40px 0; border: 1px solid #eee; border-radius: 8px;">
                                <span class="dashicons dashicons-admin-users" style="font-size: 60px; width: 60px; height: 60px; color: #eee;"></span>
                                <p style="color:#ccc;"><?php esc_html_e( 'No photo uploaded', 'cloudi7-id-card-generator' ); ?></p>
                            </div>
                        <?php endif; ?>
                    </div>
                </div>

                <div class="cloudi7-icg-preview-card-box" style="margin-top: 20px;">
                    <h3><?php esc_html_e( 'Preview Tip', 'cloudi7-id-card-generator' ); ?></h3>
                    <p class="description"><?php esc_html_e( 'Once saved, you can view the full front and back design on the preview page.', 'cloudi7-id-card-generator' ); ?></p>
                </div>
            </aside>

            <!-- Submit Button -->
            <div class="cloudi7-icg-submit-row">
                <input type="submit" name="cloudi7_icg_save_card" id="submit" class="button button-primary button-hero" value="<?php echo $cloudi7_icg_is_edit ? esc_attr__( 'Update ID Card', 'cloudi7-id-card-generator' ) : esc_attr__( 'Create ID Card', 'cloudi7-id-card-generator' ); ?>">
            </div>

        </div>
    </form>
</div>
