<?php
defined(page_security_key) or exit;

if (debug && debug_id == $_SESSION['authorization']['id']){
    ini_set('display_errors', '1');
    ini_set('display_startup_errors', '1');
    error_reporting(E_ALL);
}

include_once './assets/functions.php';
include_once './settings/settings_redirector.php';

//SET ORIGIN FOR NAVIGATION
$_SESSION['prev_origin_user'] = $_SERVER['REQUEST_URI'];

$hierarchyLevel = getHierarchyLevel(json_decode($_SESSION['authorization']['partnerhierarchy']));

$page = 'user';
//Check if allowed
if (isAllowed($page,$_SESSION['authorization']['permissions'],$_SESSION['authorization']['permission'],'R') === 0){
    header('location: index.php');
    exit;
}

//PAGE Security
$update_allowed = isAllowed($page ,$_SESSION['authorization']['permissions'],$_SESSION['authorization']['permission'],'U');
$delete_allowed = isAllowed($page ,$_SESSION['authorization']['permissions'],$_SESSION['authorization']['permission'],'D');
$create_allowed = isAllowed($page ,$_SESSION['authorization']['permissions'],$_SESSION['authorization']['permission'],'C');

//GET Details from URL
$user_ID = $_GET['id'] ?? '';

// Determine if this is a new user creation
$is_new_user = empty($user_ID);

//Helper function to convert service hex string to 1/0
function isServiceActive($service) {
    // If service is a valid hex string (50 chars from bin2hex(random_bytes(25))), return 1
    if (!empty($service) && ctype_xdigit($service)) {
        return 1;
    }
    return 0;
}

if ($is_new_user) {
    // Check create permission for new users
    if ($create_allowed !== 1) {
        header('location: index.php?page=users');
        exit;
    }
    // Create empty user object with default values
    $user = (object)[
        'rowID' => '',
        'username' => '',
        'email' => '',
        'userkey' => '1',
        'view' => 3,
        'settings' => '',
        'service' => 0,
        'language' => '',
        'login_count' => 0,
        'partnerhierarchy' => json_encode($_SESSION['authorization']['partnerhierarchy'] ?? new stdClass()),
        'created' => null,
        'updated' => null,
        'lastlogin' => null,
        'updatedby' => null
    ];
    $service_active = 0;
    $role_assignments = null;
} else {
    //CALL TO API FOR User information
    $api_url = '/v2/users/id='.$user_ID;
    $responses = ioServer($api_url,'');
    //Decode Payload
    if (!empty($responses)){$responses = json_decode($responses);}else{$responses = null;}
    $user = $responses[0] ?? null;

    // If user not found, redirect
    if ($user === null) {
        header('location: index.php?page=users');
        exit;
    }

    $service_active = isServiceActive($user->service);

    //CALL TO API FOR User Role Assignments
    $api_url = '/v2/user_role_assignments/user_id='.$user_ID;
    $role_assignments = ioServer($api_url,'');
    //Decode Payload
    if (!empty($role_assignments)){$role_assignments = json_decode($role_assignments);}else{$role_assignments = null;}
}

//CALL TO API FOR All Available Roles
$api_url = '/v2/user_roles/status=1&p=1';
$all_roles_response = ioServer($api_url,'');
//Decode Payload
if (!empty($all_roles_response)){
    $all_roles = json_decode($all_roles_response);
    if (!is_array($all_roles)){
        $all_roles = [];
    }
} else {
    $all_roles = [];
}

//------------------------------
// Handle POST for creating new user
//------------------------------
if (isset($_POST['create_user']) && $create_allowed === 1 && $is_new_user) {
    // Build user data for new user
    $user_data = [
        'userkey' => $_POST['userkey'] ?? 1,
        'username' => $_POST['username'] ?? '',
        'email' => $_POST['email'] ?? '',
        'view' => $_POST['view'] ?? 3,
        'settings' => $_POST['settings'] ?? '',
        'service' => $_POST['service'] ?? 0,
        'language' => $_POST['language'] ?? '',
        'login_count' => 0,
        'salesid' => $_POST['salesid'] ?? '',
        'soldto' => $_POST['soldto'] ?? '',
        'shipto' => $_POST['shipto'] ?? '',
        'location' => $_POST['location'] ?? ''
    ];

    $data = json_encode($user_data, JSON_UNESCAPED_UNICODE);
    $response = ioServer('/v2/users', $data);

    // Get the new user ID from the response
    $new_user = json_decode($response);
    $new_user_id = $new_user->id ?? null;

    // Save role assignments for new user if we have an ID and roles are selected
    if ($new_user_id && !empty($_POST['roles'])) {
        $role_data = [
            'batch_update' => true,
            'user_id' => (int)$new_user_id,
            'roles' => array_map('intval', $_POST['roles'])
        ];
        $data = json_encode($role_data, JSON_UNESCAPED_UNICODE);
        ioServer('/v2/user_role_assignments', $data);
    }

    if ($new_user_id) {
        header('Location: index.php?page=user&id='.$new_user_id.'&success_msg=1');
    } else {
        header('Location: index.php?page=users&success_msg=1');
    }
    exit;
}

//------------------------------
// Handle POST for inline edit (user AND roles)
//------------------------------
if (isset($_POST['save_user']) && $update_allowed === 1 && !$is_new_user) {
    // Build user data using existing field names
    $user_data = [
        'id' => $user_ID,
        'userkey' => $_POST['userkey'] ?? 1,
        'username' => $_POST['username'] ?? '',
        'email' => $_POST['email'] ?? '',
        'view' => $_POST['view'] ?? 3,
        'settings' => $_POST['settings'] ?? '',
        'service' => $_POST['service'] ?? 0,
        'language' => $_POST['language'] ?? '',
        'login_count' => $_POST['login_count'] ?? 0,
        'salesid' => $_POST['salesid'] ?? '',
        'soldto' => $_POST['soldto'] ?? '',
        'shipto' => $_POST['shipto'] ?? '',
        'location' => $_POST['location'] ?? ''
    ];

    $data = json_encode($user_data, JSON_UNESCAPED_UNICODE);
    ioServer('/v2/users', $data);

    // Also save role assignments
    $role_data = [
        'batch_update' => true,
        'user_id' => (int)$user_ID,
        'roles' => isset($_POST['roles']) ? array_map('intval', $_POST['roles']) : []
    ];
    $data = json_encode($role_data, JSON_UNESCAPED_UNICODE);
    ioServer('/v2/user_role_assignments', $data);

    // Redirect to refresh
    header('Location: index.php?page=user&id='.$user_ID.'&success_msg=2');
    exit;
}

// Handle password reset
if (isset($_POST['reset']) && $update_allowed === 1) {
    $data = json_encode(['id' => $user_ID, 'reset' => 'reset'], JSON_UNESCAPED_UNICODE);
    ioServer('/v2/users', $data);
    header('Location: index.php?page=user&id='.$user_ID.'&success_msg=4');
    exit;
}

// Handle unblock
if (isset($_POST['unblock']) && $update_allowed === 1) {
    $data = json_encode(['id' => $user_ID, 'login_count' => '0'], JSON_UNESCAPED_UNICODE);
    ioServer('/v2/users', $data);
    header('Location: index.php?page=user&id='.$user_ID.'&success_msg=5');
    exit;
}

// Handle delete
if (isset($_POST['delete']) && $delete_allowed === 1) {
    $data = json_encode(['id' => $user_ID, 'delete' => 'delete'], JSON_UNESCAPED_UNICODE);
    ioServer('/v2/users', $data);
    header('Location: index.php?page=users&success_msg=3');
    exit;
}

//------------------------------
//Variables
//------------------------------
$is_blocked = ($user->login_count > 4);
$is_active = ($user->userkey && $user->userkey != '');

if ($is_blocked) {
    $status_text = ($User_block ?? 'Blocked');
    $status_class = 'id0';
} elseif ($is_active) {
    $status_text = ($enabled ?? 'Active');
    $status_class = 'id1';
} else {
    $status_text = ($disabled ?? 'Inactive');
    $status_class = 'id0';
}

// Handle success messages
if (isset($_GET['success_msg'])) {
    if ($_GET['success_msg'] == 1) {
        $success_msg = ($message_user_1 ?? 'User created successfully');
    }
    if ($_GET['success_msg'] == 2) {
        $success_msg = ($message_user_2 ?? 'User updated successfully');
    }
    if ($_GET['success_msg'] == 3) {
        $success_msg = ($message_user_3 ?? 'User deleted successfully');
    }
    if ($_GET['success_msg'] == 4) {
        $success_msg = ($message_user_4 ?? 'Password reset successfully');
    }
    if ($_GET['success_msg'] == 5) {
        $success_msg = ($message_user_5 ?? 'User unblocked successfully');
    }
    if ($_GET['success_msg'] == 6) {
        $success_msg = ($message_user_6 ?? 'Roles updated successfully');
    }
}

template_header(($user_title ?? 'User'), 'user', 'view');

if ($is_new_user) {
    $page_title = ($user_new ?? 'New User');
} else {
    $page_title = ($user_h2 ?? 'User').' - '.$user->username;
}

$view = '
    <div class="content-title responsive-flex-wrap responsive-pad-bot-3">
        <h2 class="responsive-width-100">'.$page_title.'</h2>
        <a href="index.php?page='.($_SESSION['origin'] ?? 'users').'&p='.($_SESSION['p'] ?? '1').($_SESSION['status'] ?? '').($_SESSION['sort'] ?? '').($_SESSION['search'] ?? '').'" class="btn alt mar-right-2">←</a>
';

if ($is_new_user) {
    // New user mode - show save button directly
    $view .= '<button type="submit" form="userForm" id="saveBtn" class="btn">💾</button>';
} elseif ($update_allowed === 1) {
    // Edit mode - show edit/save toggle
    $view .= '<a href="javascript:void(0);" id="editBtn" class="btn mar-right-2" onclick="toggleUserEdit()">✏️</a>';
    $view .= '<button type="submit" form="userForm" id="saveBtn" class="btn" style="display:none;">💾</button>';
}

$view .= '</div>';

if (isset($success_msg)){
    $view .= ' <div class="msg success">
                    <i class="fas fa-check-circle"></i>
                    <p>'.$success_msg.'</p>
                    <i class="fas fa-times"></i>
                </div>';
}

// Start form wrapper for edit mode
$form_action = $is_new_user ? 'create_user' : 'save_user';
$view .= '<form id="userForm" action="" method="post">
            <input type="hidden" name="'.$form_action.'" value="1">
            <input type="hidden" name="id" value="'.$user_ID.'">';

$view .= '<div class="content-block-wrapper">';

// Display styles for view/edit mode (new users start in edit mode)
$view_style = $is_new_user ? 'display:none;' : '';
$edit_style = $is_new_user ? '' : 'display:none;';

// User Information Block
$view .= '  <div class="content-block order-details">
                <div class="block-header">
                <i class="fa-solid fa-circle-info"></i>'.($view_user_information ?? 'User Information').'
                </div>
                <div class="order-detail">
                    <h3>'.($general_status ?? 'Status').'</h3>
                    <p>
                        <span class="view-mode status '.$status_class.'" style="'.$view_style.'">'.$status_text.'</span>
                        <select class="edit-mode" name="userkey" style="'.$edit_style.'">
                            <option value="1"'.($is_active ? ' selected' : '').'>'.($enabled ?? 'Active').'</option>
                            <option value="0"'.(!$is_active ? ' selected' : '').'>'.($disabled ?? 'Inactive').'</option>
                        </select>
                    </p>
                </div>
                <div class="order-detail">
                    <h3>'.($User_username ?? 'Username').'</h3>
                    <p>
                        <span class="view-mode" style="'.$view_style.'">'.$user->username.'</span>
                        <input type="text" class="edit-mode" name="username" value="'.$user->username.'" style="'.$edit_style.'" pattern="^\S+$" required>
                    </p>
                </div>
                <div class="order-detail">
                    <h3>'.($User_email ?? 'Email').'</h3>
                    <p>
                        <span class="view-mode" style="'.$view_style.'">'.$user->email.'</span>
                        <input type="email" class="edit-mode" name="email" value="'.$user->email.'" style="'.$edit_style.'" required>
                    </p>
                </div>
                <div class="order-detail">
                    <h3>'.($User_language ?? 'Language').'</h3>
                    <p>
                        <span class="view-mode" style="'.$view_style.'">'.($user->language ?? '-').'</span>
                        <select class="edit-mode" name="language" style="'.$edit_style.'">
                            <option value="">-</option>';
                            foreach ($supportedLanguages as $language){
                                $view .= '<option value="'.$language.'"'.(($user->language == $language) ? ' selected' : '').'>'.$language.'</option>';
                            }
$view .= '              </select>
                    </p>
                </div>
            </div>
';

// Role Assignments Block
$view .='<div class="content-block order-details" id="rolesBlock">
            <div class="block-header">
                <i class="fa-solid fa-user-shield fa-sm"></i>'.($view_user_roles ?? 'Assigned Roles').'
            </div>
            <div class="view-mode-roles" style="'.($is_new_user ? 'display:none;' : '').'">';

// Get list of already assigned role IDs
$assigned_role_ids = [];
if (!empty($role_assignments)){
    foreach ($role_assignments as $assignment){
        if ($assignment->is_active == 1){
            $assigned_role_ids[] = $assignment->role_id;
        }
    }
}

// VIEW MODE - Show only assigned roles
if (!empty($role_assignments)){
    $has_active_roles = false;
    foreach ($role_assignments as $assignment){
        if ($assignment->is_active == 1){
            $has_active_roles = true;
            $view .= '<div class="order-detail">
                        <h3>'.$assignment->role_name.'</h3>';
            if (!empty($assignment->role_description)){
                $view .= '<p>'.$assignment->role_description.'</p>';
            }
            $view .= '</div>';
        }
    }
    if (!$has_active_roles){
        $view .= '<div class="order-detail">
                    <h3>-</h3>
                    <p>'.($no_roles_assigned ?? 'No roles assigned to this user').'</p>
                </div>';
    }
} else {
    $view .= '<div class="order-detail">
                <h3>-</h3>
                <p>'.($no_roles_assigned ?? 'No roles assigned to this user').'</p>
            </div>';
}

$view .= '</div>'; // Close view-mode-roles

// EDIT MODE - Show all roles with checkboxes (only if user has edit permission or is new user)
if (($update_allowed === 1 || $is_new_user) && !empty($all_roles)){
    $view .= '<div class="edit-mode-roles" style="'.($is_new_user ? '' : 'display:none;').'">';

    foreach ($all_roles as $role){
        $is_checked = in_array($role->rowID, $assigned_role_ids) ? ' checked' : '';

        $view .= '<div class="order-detail" style="display: flex; align-items: center; gap: 10px;">
                    <input type="checkbox"
                           name="roles[]"
                           value="'.$role->rowID.'"
                           id="role_'.$role->rowID.'"'.$is_checked.'>
                    <label for="role_'.$role->rowID.'" style="margin: 0; cursor: pointer; flex: 1;">
                        <h3 style="margin: 0;">'.$role->name.'</h3>
                        <p style="margin: 5px 0 0 0; font-size: 0.9em; color: #666;">'.($role->description ?? '').'</p>
                    </label>
                </div>';
    }

    $view .= '</div>'; // Close edit-mode-roles
}

$view .= '</div>'; // Close content-block

$view .= '</div>'; // Close content-block-wrapper

// Permissions Block
$view .= '<div class="content-block" style="display:none">
            <div class="block-header">
                <i class="fa-solid fa-key fa-sm"></i>'.($view_user_permissions ?? 'Permissions').'
            </div>
            <div class="table order-table">
                <table>
                    <tr>
                        <td style="width:25%;">'.($User_permission ?? 'Permission Level').'</td>
                        <td>
                            <span class="view-mode" style="'.$view_style.'">';

// Display permission level text
switch($user->view){
    case 1: $view .= ($permission1 ?? 'View'); break;
    case 2: $view .= ($permission2 ?? 'Edit'); break;
    case 3: $view .= ($permission3 ?? 'Admin'); break;
    case 4: $view .= ($permission4 ?? 'Super Admin'); break;
    case 5: $view .= ($permission5 ?? 'System'); break;
    default: $view .= '-';
}

$view .= '</span>
                            <select class="edit-mode" name="view" style="'.$edit_style.'">
                                <option value="3"'.($user->view == 3 ? ' selected' : '').'>'.($permission3 ?? 'Admin').'</option>
                                <option value="2"'.($user->view == 2 ? ' selected' : '').'>'.($permission2 ?? 'Edit').'</option>
                                <option value="1"'.($user->view == 1 ? ' selected' : '').'>'.($permission1 ?? 'View').'</option>';

if ($hierarchyLevel == 1){
    $view .= '<option value="4"'.($user->view == 4 ? ' selected' : '').'>'.($permission4 ?? 'Super Admin').'</option>';
}
if ($hierarchyLevel == 0){
    $view .= '<option value="4"'.($user->view == 4 ? ' selected' : '').'>'.($permission4 ?? 'Super Admin').'</option>
              <option value="5"'.($user->view == 5 ? ' selected' : '').'>'.($permission5 ?? 'System').'</option>';
}

$view .= '              </select>
                        </td>
                    </tr>
                    <tr>
                        <td style="width:25%;">'.($User_profile ?? 'Profile').'</td>
                        <td>
                            <span class="view-mode" style="'.$view_style.'">'.($user->settings ?? '-').'</span>';


if ($hierarchyLevel == 0 || $hierarchyLevel == 1){
    $view .= '<select class="edit-mode" name="settings" style="'.$edit_style.'">
                <option value="">-</option>';
    foreach ($all_profiles as $profile) {
        $view .= '<option value="'.$profile.'"'.($user->settings == $profile ? ' selected' : '').'>'.$profile.'</option>';
    }
    $view .= '</select>';
} else {
    $view .= '<input type="hidden" name="settings" value="'.$user->settings.'">';
}

$view .= '          </td>
                    </tr>
                    <tr>
                        <td style="width:25%;">'.($User_service ?? 'Service Access').'</td>
                        <td>
                            <span class="view-mode" style="'.$view_style.'">'.(($service_active == 1) ? ($enabled ?? 'Enabled') : ($disabled ?? 'Disabled')).'</span>
                            <select class="edit-mode" name="service" style="'.$edit_style.'">
                                <option value="1"'.(($service_active == 1) ? ' selected' : '').'>'.($enabled ?? 'Enabled').'</option>
                                <option value="0"'.(($service_active == 0) ? ' selected' : '').'>'.($disabled ?? 'Disabled').'</option>
                            </select>
                        </td>
                    </tr>
                </table>
            </div>
        </div>';

// Partner Hierarchy Block
$partner_data = json_decode($user->partnerhierarchy) ?? json_decode($_SESSION['authorization']['partnerhierarchy']);

$view .= '<div class="content-block">
            <div class="block-header">
                <i class="fa-solid fa-building fa-sm"></i>'.($view_user_partners ?? 'Partner Hierarchy').'
            </div>
            <div class="table order-table">
                <table>';

if ($hierarchyLevel == 0 || $hierarchyLevel == 1){
    $salesid_dropdown = listPartner('salesid', $partner_data->salesid ?? '', '', $_SESSION['authorization']['permission']);
    $soldto_dropdown = listPartner('soldto', $partner_data->soldto ?? '', '', $_SESSION['authorization']['permission']);

    $view .= '<tr>
                <td style="width:25%;">'.($general_salesid ?? 'Sales ID').'</td>
                <td>
                    <span class="view-mode" style="'.$view_style.'">'.($partner_data->salesid ?? '-').'</span>
                    <span class="edit-mode" style="'.$edit_style.'">'.$salesid_dropdown.'</span>
                </td>
              </tr>
              <tr>
                <td style="width:25%;">'.($general_soldto ?? 'Sold To').'</td>
                <td>
                    <span class="view-mode" style="'.$view_style.'">'.($partner_data->soldto ?? '-').'</span>
                    <span class="edit-mode" style="'.$edit_style.'">'.$soldto_dropdown.'</span>
                </td>
              </tr>';
}

$shipto_dropdown = listPartner('shipto', $partner_data->shipto ?? '', '', $_SESSION['authorization']['permission']);
$location_dropdown = listPartner('location', $partner_data->location ?? '', '', $_SESSION['authorization']['permission']);

$view .= '<tr>
            <td style="width:25%;">'.($general_shipto ?? 'Ship To').'</td>
            <td>
                <span class="view-mode" style="'.$view_style.'">'.($partner_data->shipto ?? '-').'</span>
                <span class="edit-mode" style="'.$edit_style.'">'.$shipto_dropdown.'</span>
            </td>
          </tr>
          <tr>
            <td style="width:25%;">'.($general_location ?? 'Location').'</td>
            <td>
                <span class="view-mode" style="'.$view_style.'">'.($partner_data->location ?? '-').'</span>
                <span class="edit-mode" style="'.$edit_style.'">'.$location_dropdown.'</span>
            </td>
          </tr>
        </table>
    </div>
</div>';

// Metadata Block (hide for new users)
if (!$is_new_user) {
    $view .= '<div class="content-block">
        <div class="block-header">
            <i class="fa-solid fa-bars fa-sm"></i>'.($tab3 ?? 'Details').'
        </div>
        <div class="table order-table">
            <table>
                <tr>
                    <td style="width:25%;">'.($general_created ?? 'Created').'</td>
                    <td>'.getRelativeTime($user->created).'</td>
                </tr>
                <tr>
                    <td style="width:25%;">'.($User_lastlogin ?? 'Last Login').'</td>
                    <td>'.($user->lastlogin ? getRelativeTime($user->lastlogin) : '-').'</td>
                </tr>
                <tr>
                    <td style="width:25%;">'.($general_updated ?? 'Updated').'</td>
                    <td>'.($user->updated ? getRelativeTime($user->updated) : '-').'</td>
                </tr>
                <tr>
                    <td style="width:25%;">'.($general_updatedby ?? 'Updated By').'</td>
                    <td>'.($user->updatedby ?? '-').'</td>
                </tr>
                <tr>
                    <td style="width:25%;">'.($User_pw_login_count ?? 'Login Attempts').'</td>
                    <td>
                        <span class="view-mode">'.$user->login_count.'</span>';

    if ($hierarchyLevel == 0 || $hierarchyLevel == 1){
        $view .= '<input type="number" class="edit-mode" name="login_count" value="'.$user->login_count.'" style="display:none; width: 80px;">';
    } else {
        $view .= '<input type="hidden" name="login_count" value="'.$user->login_count.'">';
    }

    $view .= '      </td>
                </tr>
            </table>
        </div>
    </div>';
}
$view .= '</form>
';

// Actions Block (outside form for separate actions, hide for new users)
if ($update_allowed === 1 && !$is_new_user){
$view .= '<div class="content-block">
    <div class="block-header">
        <i class="fa-solid fa-bolt fa-sm"></i>'.($general_actions ?? 'Actions').'
    </div>
    <div class="table order-table">
        <table>
            <tr>
                <td style="width:25%;">'.($User_pw_reset ?? 'Reset Password').'</td>
                <td>
                    <form action="" method="post" style="display:inline;">
                        <input type="hidden" name="id" value="'.$user_ID.'">
                        <button type="submit" name="reset" class="btn alt" onclick="return confirm(\''.($confirm_reset_password ?? 'Are you sure you want to reset this user\'s password?').'\')">
                            <i class="fa-solid fa-key"></i>
                        </button>
                    </form>
                </td>
            </tr>';

if ($is_blocked){
$view .= '  <tr>
                <td style="width:25%;">'.($User_unblock ?? 'Unblock User').'</td>
                <td>
                    <form action="" method="post" style="display:inline;">
                        <input type="hidden" name="id" value="'.$user_ID.'">
                        <button type="submit" name="unblock" class="btn alt" onclick="return confirm(\''.($confirm_unblock ?? 'Are you sure you want to unblock this user?').'\')">
                            <i class="fa-solid fa-unlock"></i>
                        </button>
                    </form>
                </td>
            </tr>';
}

if ($delete_allowed === 1){
$view .= '  <tr>
                <td style="width:25%;">'.($general_delete ?? 'Delete User').'</td>
                <td>
                    <form action="" method="post" style="display:inline;">
                        <input type="hidden" name="id" value="'.$user_ID.'">
                        <button type="submit" name="delete" class="btn red" onclick="return confirm(\''.($confirm_delete_user ?? 'Are you sure you want to delete this user?').'\')">
                            <i class="fa-solid fa-trash"></i>
                        </button>
                    </form>
                </td>
            </tr>';
}

$view .= '  </table>
    </div>
</div>';
}

//OUTPUT
echo $view;

$js = 'var userEditMode = false;

function toggleUserEdit() {
    userEditMode = !userEditMode;
    var editBtn = document.getElementById("editBtn");
    var saveBtn = document.getElementById("saveBtn");
    var viewElements = document.querySelectorAll(".view-mode");
    var editElements = document.querySelectorAll(".edit-mode");
    var viewRolesElements = document.querySelectorAll(".view-mode-roles");
    var editRolesElements = document.querySelectorAll(".edit-mode-roles");
    var i;
    if (userEditMode) {
        // Enter edit mode for user info AND roles
        for (i = 0; i < viewElements.length; i++) { viewElements[i].style.display = "none"; }
        for (i = 0; i < editElements.length; i++) { editElements[i].style.display = "inline"; }
        for (i = 0; i < viewRolesElements.length; i++) { viewRolesElements[i].style.display = "none"; }
        for (i = 0; i < editRolesElements.length; i++) { editRolesElements[i].style.display = "block"; }
        editBtn.style.display = "none";
        saveBtn.style.display = "inline-block";
    } else {
        // Exit edit mode
        for (i = 0; i < viewElements.length; i++) { viewElements[i].style.display = "inline"; }
        for (i = 0; i < editElements.length; i++) { editElements[i].style.display = "none"; }
        for (i = 0; i < viewRolesElements.length; i++) { viewRolesElements[i].style.display = "block"; }
        for (i = 0; i < editRolesElements.length; i++) { editRolesElements[i].style.display = "none"; }
        editBtn.style.display = "inline-block";
        saveBtn.style.display = "none";
    }
}';

template_footer($js);