<style>
    #colour-picker input {
        margin-right: 5px;
    }
</style>

<input type="hidden" name="livesupportid" id="livesupportid" />
<input type="hidden" name="isAddGroup" value="1" />
<input type="hidden" name="groupId" value ="<?php echo $this->groupId; ?>" />

<div class="mb-3">
    <label for="groupName" class="form-label"><?php echo $this->user->lang("Name"); ?></label>
    <input type="text" class="form-control required" id="groupName" name="groupName" value="<?php echo $this->name; ?>" />
</div>

<div class="mb-3">
    <label for="groupDescription" class="form-label"><?php echo $this->user->lang("Description"); ?></label>
    <textarea class="form-control" id="groupDescription" name="groupDescription" rows="4"><?php echo $this->description; ?></textarea>
</div>

<div class="form-check mb-3">
    <input class="form-check-input" type="checkbox" name="useDefault" id="useDefault" checked>
    <label class="form-check-label" for="useDefault">
        <?php echo $this->user->lang('Use Default Group Color?'); ?>
    </label>
</div>

<div class="mb-3" id="hex_row" style="display: none;">
    <span id="colour-picker">
        <select class="form-select rounded" name="groupColor" id="groupColor">
            <?php
                $cs = array('00', '33', '66', '99', 'CC', 'FF');
                for($i=0; $i<6; $i++) {
                    for($j=0; $j<6; $j++) {
                        for($k=0; $k<6; $k++) {
                            $c = $cs[$i] .$cs[$j] .$cs[$k];
                            $selected = ($this->defaultGroupColor == 0 && '#' . $c == $this->groupColor) ? 'selected' : '';
                            echo "<option value=\"$c\" $selected>#$c</option>\n";
                        }
                    }
                }
            ?>
        </select>
    </span>
</div>

<script data-cfasync="false" type="text/javascript">
$(document).ready(function() {

    $('#useDefault').click(function() {
        if ($(this).is(':checked')) {
            $('#hex_row').hide();
        } else {
            $('#hex_row').show();
        }
    });

    $('#groupColor').colourPicker({
        ico: '../templates/admin/images/colorPicker.gif',
        title: false
    });

    <?php if ($this->defaultGroupColor == 0) { ?>
        $('#useDefault').prop('checked', false);
        $('#hex_row').show();
    <?php } ?>

});
</script>
