<commit_before>@model Inspicio.Controllers.ImagesController.CreatePageModel

<h3> New Review </h3>

<form asp-action="Create">
    <div asp-validation-summary="ModelOnly" class="text-danger"></div>
    <div class="form-group">
        <!-- Review Title -->
        <label class="control-label">Review Title</label>
        <input asp-for="@Model.Image.Title" type="text" class="form-control" placeholder="#7634 ... .. .">
        <span asp-validation-for="@Model.Image.Title" class="text-danger"></span>
    </div>

    <div class="form-group">
        <!-- Review Description -->
        <label class="control-label">Review Description</label>
        <textarea asp-for="@Model.Image.Description" class="form-control" rows="4" placeholder="Reviewees please provide feedback regarding the fix for #7634 ... .. ."></textarea>
        <span asp-validation-for="@Model.Image.Description" class="text-danger"></span>
    </div>

    @{
        if (Model.Users.Count > 0)
        {
            <div class="form-group">
            <!-- Reviewees -->
                <label for="reviewees_id" class="control-label">Reviewees</label><br />

                <label for="filter_reviewees_id">Filter</label>
                <input type="text" class="form-control" id="filter_reviewees_id" name="filter_reviewees" onkeyup="filterUsers()" placeholder="No Filter"><br />

                <div id="reviewees_id" style="height:100px; overflow-y:scroll" >
                    <ul id="users">
                        @for (var i = 0; i < Model.Users.Count; i++)
                        {
                            <li>
                                <input type="checkbox" asp-for="@Model.Users[i].IsSelected" />
                                <label asp-for="@Model.Users[i].IsSelected">@Model.Users[i].Email</label>
                                <input type="hidden" asp-for="@Model.Users[i].Id" />
                                <br />
                            </li>
                        }
                    </ul>
                </div>
            </div>
            }
        }

    <div class="form-group">
    
        <!--input below will be used to temp store the base64 encoding of the image-->
        <input id="b64" asp-for="@Model.Image.Content" type="hidden" />
        
        <!-- Dropzone Image Upload-->
        <label for="image_upload_id" class="control-label">Review Screenshot</label>
        <div id="dropzoneDiv">
            <div class="dropzone needsclick dz-clickable" id="uploader">
                <div class="dz-message needsclick">
                    Drop files here or click to upload.
                </div>
            </div>
        </div>
    </div>

    <div class="form-group">
        <!-- Submit Button -->
        <button type="submit" class="btn btn-primary">Create Review</button>
    </div>

</form>

<!-- SCRIPTS -->
<!--encodeBase64
    This function take the chosen file (image file) and 
    converts it to base64encoding. This is then used to 
    set a temp input tag value. This is then sent to 
    the server when create new is pressed.
-->
<script>

    function encodeBase64(file) {

        if (file) {
            var FR = new FileReader();
            FR.addEventListener("load", function (e) {

                document.getElementById("b64").value = e.target.result;
                $(".dropzone").css("background-image", "url(" + e.target.result + ")");
            });

            FR.readAsDataURL(file);
        }
    }

    Dropzone.autoDiscover = false;
    var myDropzone = new Dropzone(".dropzone", {

        maxFiles: 1,
        autoProcessQueue: false,
        thumbnailWidth: null,
        thumbnailHeight: null,
        init: function () {

            this.on("addedfile", function (file) {

                encodeBase64(myDropzone.files[0]);
            });
        },

        // Function to be called on the server
        url: "doNothing"
    });

    myDropzone.on("maxfilesexceeded", function (file) {
        this.removeAllFiles();
        this.addFile(file);
    });


    function filterUsers() {
        // Declare variables
        var input, filter, ul, li, a, i;
        input = document.getElementById('filter_reviewees_id');
        filter = input.value.toUpperCase();
        ul = document.getElementById("users");
        li = ul.getElementsByTagName('li');

        // Loop through all list items, and hide those who don't match the search query
        for (i = 0; i < li.length; i++)
        {
            a = li[i].getElementsByTagName("label")[0];

            if (a.innerHTML.toUpperCase().indexOf(filter) > -1)
            {
                li[i].style.display = "";
            }
            else
            {
                li[i].style.display = "none";
            }
        }
    }

</script>

@section Scripts {
    @{await Html.RenderPartialAsync("_ValidationScriptsPartial");}
}

<style>
    .dropzone {
        height: 200px;
        width: 200px;
    }

    ul {
        margin: 0;
        list-style: none;
        float: left;
    }<commit_msg>Inital UI changes for create a new review<commit_after>@model Inspicio.Controllers.ImagesController.CreatePageModel

<h3> New Review </h3>

<form asp-action="Create">
    <div asp-validation-summary="ModelOnly" class="text-danger"></div>
    <div class="form-group">
        <!-- Review Title -->
        <label class="control-label">Review Title</label>
        <input asp-for="@Model.Image.Title" type="text" class="form-control" placeholder="#7634 ... .. .">
        <span asp-validation-for="@Model.Image.Title" class="text-danger"></span>
    </div>

    <div class="form-group">
        <!-- Review Description -->
        <label class="control-label">Review Description</label>
        <textarea asp-for="@Model.Image.Description" class="form-control" rows="4" placeholder="Reviewees please provide feedback regarding the fix for #7634 ... .. ."></textarea>
        <span asp-validation-for="@Model.Image.Description" class="text-danger"></span>
    </div>

    @{
        if (Model.Users.Count > 0)
        {
            <div class="form-group">
            <!-- Reviewees -->
                <label for="reviewees_id" class="control-label">Reviewees</label><br />

                <label for="filter_reviewees_id">Filter</label>
                <input type="text" class="form-control" id="filter_reviewees_id" name="filter_reviewees" onkeyup="filterUsers()" placeholder="No Filter"><br />

                <div id="reviewees_id" style="height:60px; overflow-y:scroll" >
                    <ul id="users">
                        @for (var i = 0; i < Model.Users.Count; i++)
                        {
                            <li>
                                <input type="checkbox" asp-for="@Model.Users[i].IsSelected" />
                                <label asp-for="@Model.Users[i].IsSelected"> @Model.Users[i].ProfileName</label>
                                <label asp-for="@Model.Users[i].IsSelected"> @Model.Users[i].Email</label><input type="hidden" asp-for="@Model.Users[i].Id" />
                                <br />
                            </li>
                        }
                    </ul>
                </div>
            </div>
            }
        }

    <div class="form-group">
    
        <!--input below will be used to temp store the base64 encoding of the image-->
        <input id="b64" asp-for="@Model.Image.Content" type="hidden" />
        
        <!-- Dropzone Image Upload-->
        <label for="image_upload_id" class="control-label">Review Screenshot</label>
        <div id="dropzoneDiv">
            <div class="dropzone needsclick dz-clickable" id="uploader">
                <div class="dz-message needsclick">
                    Drop files here or click to upload.
                </div>
            </div>
        </div>
    </div>

    <div class="form-group">
        <!-- Submit Button -->
        <button type="submit" class="btn btn-primary">Create Review</button>
    </div>

</form>

<!-- SCRIPTS -->
<!--encodeBase64
    This function take the chosen file (image file) and 
    converts it to base64encoding. This is then used to 
    set a temp input tag value. This is then sent to 
    the server when create new is pressed.
-->
<script>

    function encodeBase64(file) {

        if (file) {
            var FR = new FileReader();
            FR.addEventListener("load", function (e) {

                document.getElementById("b64").value = e.target.result;
                $(".dropzone").css("background-image", "url(" + e.target.result + ")");
            });

            FR.readAsDataURL(file);
        }
    }

    Dropzone.autoDiscover = false;
    var myDropzone = new Dropzone(".dropzone", {

        maxFiles: 1,
        autoProcessQueue: false,
        init: function () {

            this.on("addedfile", function (file) {

                encodeBase64(myDropzone.files[0]);
            });
        },

        // Function to be called on the server
        url: "doNothing"
    });

    myDropzone.on("maxfilesexceeded", function (file) {
        this.removeAllFiles();
        this.addFile(file);
    });


    function filterUsers() {
        // Declare variables
        var input, filter, ul, li, a, i;
        input = document.getElementById('filter_reviewees_id');
        filter = input.value.toUpperCase();
        ul = document.getElementById("users");
        li = ul.getElementsByTagName('li');

        // Loop through all list items, and hide those who don't match the search query
        for (i = 0; i < li.length; i++)
        {
            a = li[i].getElementsByTagName("label")[0];

            if (a.innerHTML.toUpperCase().indexOf(filter) > -1)
            {
                li[i].style.display = "";
            }
            else
            {
                li[i].style.display = "none";
            }
        }
    }

</script>

@section Scripts {
    @{await Html.RenderPartialAsync("_ValidationScriptsPartial");}
}

<style>
    .dropzone {
        height: 300px;
        width: auto;
        background-size: contain;
    }

    ul {
        margin: 0;
        list-style: none;
        float: left;
    }
{'fraction_non_alphanumeric': 0.1450441609421001, 'fraction_numerical': 0.007850834151128557, 'mean_word_length': 1.7723068552774754, 'pattern_counts': {'":': 0, '<': 143, '<?xml version=': 0, '>': 143, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '4493912', 'n_tokens_mistral': 2993, 'n_tokens_neox': 2822, 'n_words': 634}