@model Account
@using Newtonsoft.Json
@using System.Text
@{
    ViewData["Title"] = "Account details";
}
<table class="table">
    <tbody>
        <tr>
            <th scope="row">belongs to user</th>
            <td>@Model.IsUser.DisplayName</td>
            <td><button alt="to do" disabled>separate</button></td>
        </tr>
        <tr>
            <th scope="row">Seen in channel</th>
            <td><div class="protocol-icon">&nbsp;</div>@Model.SeenInChannel.LineageSummary<a href="/Channels/Details/@Model.SeenInChannel.Id">@Model.SeenInChannel.DisplayName</a></td>
        </tr>
        <tr>
            <th scope="row">Permission Tags</th>
            <td>
                <div id="tagsTree"></div>
            </td>
        </tr>
    </tbody>
</table>

@section Scripts{

    <script type="text/javascript">
        @{
            var accountAsString = JsonConvert.SerializeObject(Model, new JsonSerializerSettings
            {
                ReferenceLoopHandling = ReferenceLoopHandling.Ignore
            });
        }
          const userOnLoad = @Html.Raw(accountAsString);
        function jsonifyUser() {
            var userNow = structuredClone(userOnLoad);
            userNow.Accounts = null;
            userNow.DisplayName = document.querySelector("#displayName").value;
            console.log(userNow);
            return userNow;
        }

        function getTagsTree() {
        @{
            var sb = new StringBuilder();
            sb.Append("[{text: \"permission tags\", \"expanded\":true, nodes: [");
            var first = true;
            for (int i = 0; i < 1; i++)
            {
                if (!first)
                    sb.Append(',');
                sb.Append($"{{text: \"<input type=\\\"checkbox\\\" > is goated (w/ sauce)</input>\"}}");
                first = false;
            }
            sb.Append("]}]");
        }
            console.log(@Html.Raw(sb.ToString()));
            var tree = @Html.Raw(sb.ToString());
            return tree;
        }
        $('#tagsTree').bstreeview({ data: getTagsTree() });
        document.querySelectorAll("input[type=checkbox]").forEach(node => { node.onchange = () => { patchModel(jsonifyUser(), '/api/Users/') } });
    </script>
}