eleventy-plugin-repoviewer

Files snapshot from ui-experiment
./js_templates/common/htmlPage.ts

              
              Show last line change
            

            1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
          

            7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
ec91a0 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
ec91a0 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
ec91a0 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
87bcc2 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
ec91a0 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
88b515 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
ec91a0 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
6bdf18 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
6bdf18 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
6bdf18 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
58a5e0 Tucker McKnight
ec91a0 Tucker McKnight
073785 Tucker McKnight
ec91a0 Tucker McKnight
ec91a0 Tucker McKnight
ec91a0 Tucker McKnight
073785 Tucker McKnight
ec91a0 Tucker McKnight
ec91a0 Tucker McKnight
ec91a0 Tucker McKnight
ec91a0 Tucker McKnight
ec91a0 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
612263 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
88b515 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
be0819 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
d44a18 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
87bcc2 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
7f8822 Tucker McKnight
          

            
              import { type ReposConfiguration } from '../../src/configTypes.ts'
import { type Repository } from '../../src/dataTypes.ts'
import { NavHelper } from '../helpers/nav.ts'
import branchesListItems from './branchesListItems.ts'

export default async (reposConfig: ReposConfiguration, eleventyConfig: any, pageContent: Function) => {
  return async (data) => {
    // this still necessary?
    if (data.currentRepo === '') {
      return
    }

    const repo: Repository = data.currentRepo
    const branch: Repository['branches'][0] = data.currentBranch

    const slugify = eleventyConfig.getFilter("slugify")
    const nav = NavHelper(reposConfig, slugify, repo.name, branch.name)

    const branchesWithHrefs = repo.branches.map((branch) => {
      return {
        name: branch.name,
        href: nav.repoBranchHome(branch.name) + '/' + data.nav.path,
        date: repo.commits.get(branch.head).date.toDateString(),
      }
    })

    return `
      <!doctype html>
      <html lang="en">
        <head>
          <meta charset="utf-8">
          <meta name="viewport" content="width=device-width, initial-scale=1">
          <title>${repo.name}</title>
          <link rel="stylesheet" href="/css/design-board.css">
          <script>
            window.branchesWithHrefs = ${JSON.stringify(branchesWithHrefs)};
            window.defaultBranch = "${repo.defaultBranch}";
            window.currentBranch = "${branch.name}";
            window.cloneUrl = "${repo.cloneUrl}";
          </script>
          <script src="${nav.rootPath()}frontend/top.js"></script>
          <link rel="stylesheet" id="prism-theme" type="text/css" href="${data.reposPath}/vendor/prism.css" />
        </head>
        <body>
          <div class="container">
            <div class="row">
              <div class="col">
                <nav class="navbar navbar-expand">
                  <ul class="navbar-nav flex-wrap">
                    <li class="nav-item">
                      <a class="nav-link" href="${nav.rootPath()}">&larr; All repositories</a>
                    </li>
                    <li class="nav-item">
                      <a class="nav-link" href="${nav.repoCurrentBranchHome()}">${repo.name}</a>
                    </li>
                    <li class="nav-item">
                      <span class="nav-link d-inline-block">Branch:</span>
                      <div class="branch-selector dropdown-center d-inline-block">
                        <button class="branches nav-link d-inline-block btn btn-bg dropdown-toggle" data-bs-toggle="dropdown" data-bs-auto-close="outside" aria-expanded="false">
                          ${branch.name}
                        </button>
                        <div class="dropdown-menu">
                          <form class="mx-3 my-1">
                            <input type="text" class="form-control" id="dropdownBranchSearch" placeholder="Search branches...">
                            <div>
                              <div class="row mt-3">
                                <div class="col">
                                  <label class="form-label">Sort by:</label>
                                </div>
                              </div>
                              <div class="sortRadioButtons">
                                <div class="sortRadioButton pe-1">
                                  <input class="form-check-input sort-filter" type="radio" name="branchSort" value='date' id="branchSortByDate" checked>
                                  <label class="form-check-label" for="branchSortByDate">
                                    Last commit
                                  </label>
                                </div>
                                <div class="sortRadioButton ps-1">
                                  <input class="form-check-input sort-filter" type="radio" name="branchSort" value='name' id="branchSortByName">
                                  <label class="form-check-label" for="branchSortByName">
                                    Name
                                  </label>
                                </div>
                              </div>
                            </div>
                          </form>
                          <div class="dropdown-divider"></div>
                          <div id="dropdown-branches-results" class="dropdown-branches">
                            ${branchesListItems(branchesWithHrefs, repo.defaultBranch, branch.name, 'date')}
                          </div>
                        </div>
                      </div>
                    </li>
                  </ul>
                </nav>
              </div>
              <div class="col-auto pt-2">
                <div class="dropdown">
                  <button class="dropdown-toggle btn btn-bg" id="dark-mode-switch" type="button" data-bs-toggle="dropdown" aria-expanded="false">
                    <span>&#xFE0F;</span>
                  </button>
                  <ul class="dropdown-menu">
                    <li><button class="btn shadow-none" data-theme-pref="light" onclick="toggleDarkMode(this)"><span class="me-1">&#x1F31E;</span>Light</button></li>
                    <li><button class="btn shadow-none" data-theme-pref="dark" onclick="toggleDarkMode(this)"><span class="me-1">&#x1F319;</span>Dark</button></li>
                    <li><button class="btn shadow-none" data-theme-pref="auto" onclick="toggleDarkMode(this)"><span class="me-1">&#x1F5A5;&#xFE0F;</span>Match OS</button></li>
                  </ul>
                </div>
              </div>
            </div>
            <div class="row">
              <div class="col">
                <nav class="navbar navbar-expand">
                  <ul class="main-nav navbar-nav flex-wrap">
                    <li class="nav-item">
                      <a class="nav-link ${data.navTab === 'home' ? 'active' : ''}" aria-current="page" href="${nav.repoCurrentBranchHome()}">Home</a>
                    </li>
                    <li class="nav-item">
                      <a class="nav-link ${data.navTab === 'files' ? 'active' : ''}" href="${nav.repoCurrentBranchFiles()}">Files</a>
                    </li>
                    <li class="nav-item">
                      <a class="nav-link ${data.navTab === 'commits' ? 'active' : ''}" href="${nav.repoCurrentBranchCommits()}">Commits</a>
                    </li>
                    <li class="nav-item">
                      <a class="nav-link ${data.navTab === 'branches' ? 'active' : ''}" href="${nav.repoCurrentBranchBranches()}">Branches</a>
                    </li>
                  </ul>
                </nav>
              </div>
            </div>

            <div class="row">
              <div class="col-12">
                ${await pageContent(eleventyConfig, data, nav)}
              </div>
            </div>

          </div>
          <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.8/dist/js/bootstrap.bundle.min.js" integrity="sha384-FKyoEForCGlyvwx9Hj09JcYn3nv7wiPVlz7YYwJrWVcXK/BmnVDxM+D2scQbITxI" crossorigin="anonymous"></script>
          <script src="${nav.rootPath()}frontend/main-frontend.bundle.js"></script>
        </body>
      </html>
      `
  }
}
            
          