@page "/code111"

<Title Value="网站源码 - 个人文章分享"></Title>
<div class="container">
    <h1 class="nav-map">
        <span>
            网站源码
        </span>
        <a href="/" class="n1">网站首页</a>
        <a href="/code" class="n2">源码</a>
    </h1>

    @if (_isLoading)
    {
        <MudCard>
            <MudCardContent>
                <MudSkeleton Width="30%" Height="42px;"/>
                <MudSkeleton Width="80%"/>
                <MudSkeleton Width="100%"/>
                <MudSkeleton Width="100%"/>
                <MudSkeleton SkeletonType="SkeletonType.Rectangle" Height="200px"/>
                <MudSkeleton Width="100%"/>
                <MudSkeleton Width="100%"/>
                <MudSkeleton Width="100%"/>
            </MudCardContent>
            <MudCardActions>
                <MudSkeleton Width="64px" Height="40px" Class="ml-2"/>
                <MudSkeleton Width="105px" Height="40px" Class="ml-3"/>
            </MudCardActions>
        </MudCard>
    }
    else
    {
        <div class="code-box">
            <div class="box-header">
                <div class="details-container">
                    <div class="icon">
                        <img style="width:24px;height: 24px" alt="website" src="https://dpangzi.com/core/images/logo-removebg.png"/>
                    </div>
                    <div class="desc">
                        站点相关全部源代码，隐藏了一些关于服务器的信息
                    </div>
                </div>
            </div>
            <div class="box-rows">
                @if (!_treeData.IsRoot)
                {
                    <div class="row prev">
                        <div class="header">
                            <a href="javascript:;" @onclick="() => LoadTreeData(null)">
                                <span style="min-width: 16px">[Root]</span>
                            </a>
                            <span>/</span>
                            @{
                                var steps = new List<string>();
                            }
                            @for (var i = 0; i < _treeData.CurrentPaths.Count; i++)
                            {
                                if (i == _treeData.CurrentPaths.Count - 1)
                                {
                                    <span>@_treeData.CurrentPaths[i]</span>
                                    break;
                                }
                                var item = _treeData.CurrentPaths[i];
                                steps.Add(item);
                                var temp = string.Join("/", steps);
                                <a href="javascript:;" @onclick="() => LoadTreeData(temp.Split('/'))">
                                    <span style="min-width: 16px">@item</span>
                                </a>
                                <span>/</span>
                            }
                        </div>
                    </div>
                }
                @if (!_treeData.IsDirectory)
                {
                    <CodePreview Code="@_treeData.CodeContainer"></CodePreview>
                }
                else
                {
                    @foreach (var item in _treeData.Directories)
                    {
                        <div class="row">
                            <div class="icon">
                                <svg height="16" class="git-dir" color="blue-3" aria-label="Directory" viewBox="0 0 16 16" width="16" role="img">
                                    <path d="M1.75 1A1.75 1.75 0 000 2.75v10.5C0 14.216.784 15 1.75 15h12.5A1.75 1.75 0 0016 13.25v-8.5A1.75 1.75 0 0014.25 3h-6.5a.25.25 0 01-.2-.1l-.9-1.2c-.33-.44-.85-.7-1.4-.7h-3.5z"></path>
                                </svg>
                            </div>
                            <div class="header">
                                <span>
                                    @{
                                        var next = _treeData.CurrentPaths.ToList();
                                        next.Add(item.Name);
                                    }
                                    <a href="javascript:;" title="@item.Name" @onclick="() => LoadTreeData(next)">
                                        <span style="min-width: 16px">@item.Name</span>
                                    </a>
                                </span>
                            </div>
                            <div class="desc">
                                <span>
                                    <a title="@item.Note">@(item.Note)</a>
                                </span>
                            </div>
                            <div class="time">
                                <time datetime="@item.LastUpdateTime" title="@item.LastUpdateTime">@item.LastUpdateTime.TimeAgo()</time>
                            </div>
                        </div>
                    }
                    @foreach (var item in _treeData.Files)
                    {
                        <div class="row">
                            <div class="icon">
                                <svg height="16" class="git-file" color="gray-light" aria-label="File" viewBox="0 0 16 16" width="16" role="img">
                                    <path d="M3.75 1.5a.25.25 0 00-.25.25v11.5c0 .138.112.25.25.25h8.5a.25.25 0 00.25-.25V6H9.75A1.75 1.75 0 018 4.25V1.5H3.75zm5.75.56v2.19c0 .138.112.25.25.25h2.19L9.5 2.06zM2 1.75C2 .784 2.784 0 3.75 0h5.086c.464 0 .909.184 1.237.513l3.414 3.414c.329.328.513.773.513 1.237v8.086A1.75 1.75 0 0112.25 15h-8.5A1.75 1.75 0 012 13.25V1.75z"></path>
                                </svg>
                            </div>
                            <div class="header">
                                <span>
                                    @{
                                        var next = _treeData.CurrentPaths.ToList();
                                        next.Add(item.Name);
                                    }
                                    <a href="javascript:;" @onclick="() => LoadTreeData(next)" title="@item.Name">@item.Name</a>
                                </span>
                            </div>
                            <div class="desc">
                                <span>
                                    <a title="@item.Note">@item.Note</a>
                                </span>
                            </div>
                            <div class="time">
                                <time datetime="@item.LastUpdateTime" title="@item.LastUpdateTime">@item.LastUpdateTime.TimeAgo()</time>
                            </div>
                        </div>
                    }
                }
                @if (!string.IsNullOrEmpty(_treeData.ReadmeContent))
                {
                    <div class="row last-row">
                        <MarkdownPreview Markdown="@_treeData.ReadmeContent"></MarkdownPreview>
                    </div>
                }
            </div>

        </div>
        {
            var relation = string.Join("/", _treeData.CurrentPaths);
            relation = string.IsNullOrEmpty(relation) ? "/" : relation;
            <Comment Node="CommentNode.Code" Relation="@relation"></Comment>
        }
    }
</div>