diff options
Diffstat (limited to 'src/frontend/components')
-rw-r--r-- | src/frontend/components/BaseBackButton.vue | 25 | ||||
-rw-r--r-- | src/frontend/components/BaseBreadcrumb.vue | 33 | ||||
-rw-r--r-- | src/frontend/components/CommitPatch.vue | 149 | ||||
-rw-r--r-- | src/frontend/components/HomeHeader.vue | 39 | ||||
-rw-r--r-- | src/frontend/components/RepositoryCloneDropdown.vue | 71 | ||||
-rw-r--r-- | src/frontend/components/RepositoryHeader.vue | 51 | ||||
-rw-r--r-- | src/frontend/components/RepositoryNavbar.vue | 54 | ||||
-rw-r--r-- | src/frontend/components/RepositoryTreeBlob.vue | 154 | ||||
-rw-r--r-- | src/frontend/components/RepositoryTreeTree.vue | 84 |
9 files changed, 0 insertions, 660 deletions
diff --git a/src/frontend/components/BaseBackButton.vue b/src/frontend/components/BaseBackButton.vue deleted file mode 100644 index 64b1286..0000000 --- a/src/frontend/components/BaseBackButton.vue +++ /dev/null @@ -1,25 +0,0 @@ -<template> - <div class="d-inline"> - <router-link :to="to"> - <svg - xmlns="http://www.w3.org/2000/svg" id="back" - height="24px" width="24px" - viewBox="0 0 24 24" fill="#ffffff"> - <path d="M0 0h24v24H0z" fill="none" /> - <path d="M20 11H7.83l5.59-5.59L12 4l-8 8 8 8 1.41-1.41L7.83 13H20v-2z" /> - </svg> - </router-link> - </div> -</template> - -<script> -export default { - name: "BaseBackButton", - props: { - to: { - type: String, - required: true - } - } -} -</script>
\ No newline at end of file diff --git a/src/frontend/components/BaseBreadcrumb.vue b/src/frontend/components/BaseBreadcrumb.vue deleted file mode 100644 index df82968..0000000 --- a/src/frontend/components/BaseBreadcrumb.vue +++ /dev/null @@ -1,33 +0,0 @@ -<template> - <nav aria-label="breadcrumb"> - <ol class="breadcrumb"> - <li - v-for="(item, index) in items" class="breadcrumb-item" - :key="index"> - <router-link :to="item.path"> - {{ item.name }} - </router-link> - </li> - <li class="breadcrumb-item active" aria-current="page"> - {{ activeItem }} - </li> - </ol> - </nav> -</template> - - -<script> -export default { - name: "BaseBreadcrumb", - props: { - items: { - type: Array, - required: true - }, - activeItem: { - type: String, - required: true - } - } -}; -</script>
\ No newline at end of file diff --git a/src/frontend/components/CommitPatch.vue b/src/frontend/components/CommitPatch.vue deleted file mode 100644 index 2c815ff..0000000 --- a/src/frontend/components/CommitPatch.vue +++ /dev/null @@ -1,149 +0,0 @@ -<script> -import { h } from "vue"; -import hljs from "highlight.js"; -import hljs_languages from "../util/hljs-languages"; - -export default { - name: "CommitPatch", - props: { - patch: { - type: Object, - required: true - } - }, - setup(props) - { - const commit_patch = [ - h("div", { "class": "commit-file-header" }, [ - h("span", { "class": "fw-bold"}, (props.patch["to"] === "/dev/null") ? props.patch["from"] : props.patch["to"]), - h("span", (props.patch["to"] === "/dev/null") ? "Deleted" : "" ), - h("div", { class: "commit-file-add-del" }, [ - h("span", `+${ props.patch["additions"] }`), - h("span", `-${ props.patch["deletions"] }`) - ]) - ]) - ]; - - if(props.patch["too_large"] === false) { - let all_hunks = props.patch["hunks"].map((hunk) => hunk["hunk"]); - - const language = hljs_languages.find((lang) => lang["extensions"].some((extension) => props.patch["to"].endsWith(extension))); - let highlighted = language ? hljs.highlight(language["name"], all_hunks.join("\n")) : hljs.highlightAuto(all_hunks.join("\n")); - console.log(highlighted); - highlighted = highlighted["value"].split("\n"); - - const highlighted_hunks = []; - let hunk_start = 0; - all_hunks.forEach((hunk) => - { - const hunk_row_cnt = hunk.split("\n").length; - highlighted_hunks.push(highlighted.slice(hunk_start, hunk_start + hunk_row_cnt)); - hunk_start = hunk_start + hunk_row_cnt; - }); - - all_hunks = all_hunks.map((hunk) => hunk.split("\n")); - - commit_patch.push(h("table", { cellspacing: "0px" }, [ - h("tbody", [ - props.patch["hunks"].map((hunk, hunk_index) => - { - let new_offset = 0; - let deleted_offset = 0; - const multiline_comments = []; - - return highlighted_hunks[hunk_index].map((line, line_index) => - { - if(/^@@ -[0-9,]+ \+[0-9,]+ @@/.test(all_hunks[hunk_index][line_index])) { - new_offset++; - deleted_offset++; - return h("tr", { class: "commit-file-pos-change" }, [ - h("td", { "patch-line-col-unsel": "..." }), - h("td", { "patch-line-col-unsel": "..." }), - h("td", { "patch-line-col-unsel": "..." }), - h("td", [ - h("code", all_hunks[hunk_index][line_index]) - ]) - ]); - } - else if(/^\\ No newline at end of file$/.test(all_hunks[hunk_index][line_index])) { - new_offset++; - deleted_offset++; - return h("tr", { class: "commit-file-no-newline" }, [ - h("td", ""), - h("td", ""), - h("td", ""), - h("td", [ - h("code", all_hunks[hunk_index][line_index]) - ]) - ]); - } - else { - let first_td; - let second_td; - let third_td; - - if(hunk['new'].includes(line_index)) { - first_td = h("td", ""); - second_td = h("td", { class: "line-highlight-new", "patch-line-col-unsel": Number(hunk["new_start"]) + line_index - new_offset }); - third_td = h("td", { class: "line-new", "patch-line-col-unsel": "+" }); - deleted_offset++; - } - else if(hunk['deleted'].includes(line_index)) { - first_td = h("td", { "patch-line-col-unsel": Number(hunk["old_start"]) + line_index - deleted_offset }); - second_td = h("td", { class: "line-highlight-deleted" }); - third_td = h("td", { class: "line-deleted", "patch-line-col-unsel": "-" }); - new_offset++; - } - else { - first_td = h("td", { class: "line-unchanged", "patch-line-col-unsel": Number(hunk["old_start"]) + line_index - deleted_offset }); - second_td = h("td", { class: "line-unchanged", "patch-line-col-unsel": Number(hunk["new_start"]) + line_index - new_offset }); - third_td = h("td", ""); - } - - let comment_open = line.match(/<span class="hljs-comment">/g); - const comment_open_cnt = (comment_open !== null) ? comment_open.length : 0; - comment_open = (comment_open !== null) ? comment_open[0] : ""; - - let comment_close = line.match(/<\/span>/g); - const comment_close_cnt = (comment_close !== null) ? comment_close.length : 0; - comment_close = (comment_close !== null) ? comment_close[0] : ""; - - if(comment_open_cnt > comment_close_cnt) { - line = line + "</span>"; - console.log("Öppning " + line); - multiline_comments.push(comment_open); - } - else if(comment_open_cnt < comment_close_cnt && multiline_comments.length !== 0) { - line = multiline_comments[multiline_comments.length - 1] + line; - console.log("Stängning " + line + " " + multiline_comments[multiline_comments.length - 1]); - multiline_comments.pop(); - } - else if(multiline_comments.length !== 0) { - line = multiline_comments[multiline_comments.length - 1] + line + "</span>"; - console.log("Mitt i " + line); - } - - return h("tr", [ - first_td, - second_td, - third_td, - h("td", [ - h("code", { innerHTML: line }) - ]) - ]); - } - }); - }) - ]) - ])); - } - else { - commit_patch.push(h("div", { class: "ps-3 pt-3 patch-too-large" }, [ - h("span", "Patch is too large to display.") - ])); - } - - return () => h("div", { class: "commit-file" }, commit_patch); - } -}; -</script>
\ No newline at end of file diff --git a/src/frontend/components/HomeHeader.vue b/src/frontend/components/HomeHeader.vue deleted file mode 100644 index 9a0688d..0000000 --- a/src/frontend/components/HomeHeader.vue +++ /dev/null @@ -1,39 +0,0 @@ -<template> - <div class="row mx-0"> - <div id="header" class="col d-flex mt-3 ms-2"> - <div class="d-inline ms-3"> - <span id="title" class="fs-1">{{ title }}</span> - <p id="about" class="mb-3 fs-4"> - {{ about }} - </p> - </div> - </div> - </div> -</template> - -<script> -import { watch, reactive, toRefs } from "vue"; - -export default { - name: "HomeHeader", - setup() - { - const state = reactive({ title: "", about: "" }); - - watch(() => - { - fetch(`${window.location.protocol}//${window.location.host}/api/v1/info`) - .then((res) => res.json()) - .then((data) => - { - state.title = data["data"]["title"], - state.about = data["data"]["about"] - }); - }); - - return { - ... toRefs(state) - }; - } -} -</script>
\ No newline at end of file diff --git a/src/frontend/components/RepositoryCloneDropdown.vue b/src/frontend/components/RepositoryCloneDropdown.vue deleted file mode 100644 index aaef5ef..0000000 --- a/src/frontend/components/RepositoryCloneDropdown.vue +++ /dev/null @@ -1,71 +0,0 @@ -<template> - <div id="clone" class="d-flex align-items-center"> - <div class="dropdown"> - <button - class="btn btn-primary btn-sm dropdown-toggle" type="button" - id="dropdownMenuButton1" data-bs-toggle="dropdown" - data-bs-auto-close="outside" aria-expanded="false"> - Clone - </button> - <ul class="dropdown-menu dropdown-menu-end dropdown-menu-dark" aria-labelledby="dropdownMenuButton1"> - <li class="pt-2"> - <span class="ms-2 fs-5 fw-bold">Clone with HTTP</span> - <label id="clone-url-copy"> - <input - type="text" :value="url" - class="form-control form-control-sm ms-2 me-2" readonly> - <svg - xmlns="http://www.w3.org/2000/svg" height="18px" - viewBox="0 0 24 24" width="18px" - fill="#FFFFFF" @click="copyToClipboard"> - <path d="M0 0h24v24H0z" fill="none" /> - <path d="M16 1H4c-1.1 0-2 .9-2 2v14h2V3h12V1zm3 4H8c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h11c1.1 0 2-.9 2-2V7c0-1.1-.9-2-2-2zm0 16H8V7h11v14z" /> - </svg> - </label> - </li> - </ul> - </div> - </div> -</template> - -<script> -import bootstrap from "bootstrap/dist/js/bootstrap.bundle"; - -export default { - name: "RepositoryCloneDropdown", - props: { - repository: { - type: String, - required: true - } - }, - methods: { - copyToClipboard(event) - { - const url_box = document.getElementById("clone").getElementsByTagName("input")[0]; - - url_box.select(); - url_box.setSelectionRange(0, 99999); - document.execCommand("copy"); - - event.stopPropagation(); - - var exampleEl = document.getElementById('clone-url-copy').getElementsByTagName("svg")[0]; - var tooltip = new bootstrap.Tooltip(exampleEl, { boundary: document.body, title: "Copied the URL", trigger: "manual" }); - tooltip.show(); - - const worker = new Worker("../util/worker.js"); - worker.postMessage({ work: "sleep", time: 1700 }); - - worker.onmessage = function() - { - tooltip.hide(); - } - } - }, - setup(props) - { - return { url: `${window.location.protocol}//${window.location.host}/${props.repository}` }; - } -} -</script>
\ No newline at end of file diff --git a/src/frontend/components/RepositoryHeader.vue b/src/frontend/components/RepositoryHeader.vue deleted file mode 100644 index 39ec00d..0000000 --- a/src/frontend/components/RepositoryHeader.vue +++ /dev/null @@ -1,51 +0,0 @@ -<template> - <div class="row mx-0"> - <div id="header" class="col d-flex mt-3 ms-2"> - <BaseBackButton to="/" /> - <div class="d-inline ms-3"> - <span id="title" class="fs-1">{{ title }}</span> - <p id="about" class="fs-4"> - {{ about }} - </p> - </div> - </div> - </div> -</template> - -<script> -import BaseBackButton from "./BaseBackButton"; - -import { watch, reactive, toRefs } from "vue"; - -export default { - name: "RepositoryHeader", - components: { - BaseBackButton - }, - props: { - repository: { - type: String, - required: true - } - }, - setup(props) - { - const state = reactive({ title: "", about: "" }); - - watch(() => - { - fetch(`${window.location.protocol}//${window.location.host}/api/v1/repos/${props.repository}`) - .then((res) => res.json()) - .then((data) => - { - state.title = data["data"]["name"]; - state.about = data["data"]["description"]; - }); - }); - - return { - ... toRefs(state) - }; - } -}; -</script>
\ No newline at end of file diff --git a/src/frontend/components/RepositoryNavbar.vue b/src/frontend/components/RepositoryNavbar.vue deleted file mode 100644 index 53e1bfa..0000000 --- a/src/frontend/components/RepositoryNavbar.vue +++ /dev/null @@ -1,54 +0,0 @@ -<template> - <div id="navbar" class="row mx-0"> - <div id="repo-navbar" class="col ms-4 ps-4"> - <nav class="navbar navbar-expand navbar-dark"> - <div class="container-fluid px-0"> - <div class="collapse navbar-collapse"> - <ul class="navbar-nav align-items-center flex-fill"> - <li - v-for="(item, index) in nav_items" :key="index" - class="nav-item"> - <router-link - class="nav-link fs-4" :class="{ active: activePage === item }" - :aria-current="(activePage === item) ? 'page' : ''" :to="'/' + repository + '/' + item"> - {{ item }} - </router-link> - </li> - <li class="nav-item ms-auto me-4"> - <RepositoryCloneDropdown :repository="repository" class="d-block" /> - </li> - </ul> - </div> - </div> - </nav> - </div> - </div> -</template> - -<script> -import RepositoryCloneDropdown from "./RepositoryCloneDropdown"; - -export default { - name: "RepositoryNavbar", - props: { - activePage: { - type: String, - required: true - }, - repository: { - type: String, - required: true - } - }, - components: { - RepositoryCloneDropdown - }, - data() - { - return { - nav_items: [ "log", "refs", "tree" ], - url: `${window.location.protocol}//${window.location.host}/${this.repository}` - }; - } -}; -</script>
\ No newline at end of file diff --git a/src/frontend/components/RepositoryTreeBlob.vue b/src/frontend/components/RepositoryTreeBlob.vue deleted file mode 100644 index f287f47..0000000 --- a/src/frontend/components/RepositoryTreeBlob.vue +++ /dev/null @@ -1,154 +0,0 @@ -<template> - <BaseBreadcrumb :items="[{ name: 'Tree', path: '/' + repository + '/tree' }]" :active-item="path" /> - <table cellspacing="0px"> - <tbody> - <tr v-for="(line, index) in content_lines" :key="index"> - <td :line="index + 1" /> - <td> - <code v-html="line" /> - </td> - </tr> - </tbody> - </table> -</template> - -<script> -import { ref } from "vue"; -import hljs from "highlight.js"; -import hljs_languages from "../util/hljs-languages"; -import path from "path"; - -export default { - name: "RepositoryTreeBlob", - props: { - repository: { - type: String, - required: true - }, - path: { - type: String, - required: true - }, - content: { - type: String, - required: true - } - }, - watch: { - content() { - this.initHighlightedContent(); - } - }, - mounted() - { - this.initHighlightedContent(); - }, - setup(props) - { - const content_lines = ref([]); - - const initHighlightedContent = async () => - { - const language = hljs_languages.find((lang) => lang["extensions"].some((extension) => path.extname(props.path) === extension)); - let highlighted = language ? hljs.highlight(language["name"], props.content) : hljs.highlightAuto(props.content); - - content_lines.value = highlighted.value.split("\n"); - }; - - return { content_lines, initHighlightedContent }; - - /* - Console.log(props.content); - const content_lines = props.content.split("\n"); - - const language = hljs_languages.find((lang) => lang["extensions"].some((extension) => path.extname(props.path) === extension)); - let highlighted = language ? hljs.highlight(language["name"], props.content) : hljs.highlightAuto(props.content); - console.log(highlighted.value); - Let all_hunks = props.patch["hunks"].map((hunk) => hunk["hunk"]); - - const language = hljs_languages.find((lang) => lang["extensions"].some((extension) => props.patch["to"].endsWith(extension))); - let highlighted = language ? hljs.highlight(language["name"], all_hunks.join("\n")) : hljs.highlightAuto(all_hunks.join("\n")); - console.log(highlighted); - highlighted = highlighted["value"].split("\n"); - - const highlighted_hunks = []; - let hunk_start = 0; - all_hunks.forEach((hunk) => - { - const hunk_row_cnt = hunk.split("\n").length; - highlighted_hunks.push(highlighted.slice(hunk_start, hunk_start + hunk_row_cnt)); - hunk_start = hunk_start + hunk_row_cnt; - }); - - all_hunks = all_hunks.map((hunk) => hunk.split("\n")); - - return h("table", { cellspacing: "0px" }, [ - h("tbody", [ - Props.patch["hunks"].map((hunk, hunk_index) => - { - const multiline_comments = []; - - return highlighted_hunks[hunk_index].map((line, line_index) => - { - else { - let first_td; - let second_td; - let third_td; - - if(hunk['new'].includes(line_index)) { - first_td = h("td", ""); - second_td = h("td", { class: "line-highlight-new" }, Number(hunk["new_start"]) + line_index - new_offset); - third_td = h("td", { class: "line-new" }, "+"); - deleted_offset++; - } - else if(hunk['deleted'].includes(line_index)) { - first_td = h("td", Number(hunk["old_start"]) + line_index - deleted_offset); - second_td = h("td", { class: "line-highlight-deleted" }); - third_td = h("td", { class: "line-deleted" }, "-"); - new_offset++; - } - else { - first_td = h("td", { class: "line-unchanged" }, Number(hunk["old_start"]) + line_index - deleted_offset); - second_td = h("td", { class: "line-unchanged" }, Number(hunk["new_start"]) + line_index - new_offset); - third_td = h("td", ""); - } - - let comment_open = line.match(/<span class="hljs-comment">/g); - const comment_open_cnt = (comment_open !== null) ? comment_open.length : 0; - comment_open = (comment_open !== null) ? comment_open[0] : ""; - - let comment_close = line.match(/<\/span>/g); - const comment_close_cnt = (comment_close !== null) ? comment_close.length : 0; - comment_close = (comment_close !== null) ? comment_close[0] : ""; - - if(comment_open_cnt > comment_close_cnt) { - line = line + "</span>"; - console.log("Öppning " + line); - multiline_comments.push(comment_open); - } - else if(comment_open_cnt < comment_close_cnt && multiline_comments.length !== 0) { - line = multiline_comments[multiline_comments.length - 1] + line; - console.log("Stängning " + line + " " + multiline_comments[multiline_comments.length - 1]); - multiline_comments.pop(); - } - else if(multiline_comments.length !== 0) { - line = multiline_comments[multiline_comments.length - 1] + line + "</span>"; - console.log("Mitt i " + line); - } - - return h("tr", [ - first_td, - second_td, - third_td, - h("td", [ - h("code", { innerHTML: line }) - ]) - ]); - } - }); - }) - ]) - ]);*/ - } -}; -</script>
\ No newline at end of file diff --git a/src/frontend/components/RepositoryTreeTree.vue b/src/frontend/components/RepositoryTreeTree.vue deleted file mode 100644 index 70c63eb..0000000 --- a/src/frontend/components/RepositoryTreeTree.vue +++ /dev/null @@ -1,84 +0,0 @@ -<template> - <table id="tree" class="fs-5"> - <thead> - <tr> - <th>Name</th> - <th>Last commit</th> - <th>Last updated</th> - </tr> - </thead> - <tbody> - <tr v-if="path !== ''" @click="$router.go(-1)"> - <td - class="d-flex align-items-center"> - <div class="tree-entry-padding" /> - .. - </td> - <td /> - <td /> - </tr> - <tr - v-for="(entry, entry_name, index) in tree" :key="index" - @click="$router.push(`/${repository}/tree${path ? '/' + path : ''}/${entry_name}`)"> - <td class="d-flex align-items-center"> - <svg - xmlns="http://www.w3.org/2000/svg" height="18px" - viewBox="0 0 24 24" width="18px" - fill="#FFFFFF" v-if="entry['type'] === 'tree'" - preserveAspectRatio="xMidYMin"> - <path d="M0 0h24v24H0z" fill="none" /> - <path d="M10 4H4c-1.1 0-1.99.9-1.99 2L2 18c0 1.1.9 2 2 2h16c1.1 0 2-.9 2-2V8c0-1.1-.9-2-2-2h-8l-2-2z" /> - </svg> - <span v-else class="tree-entry-padding" /> - <a @click="stopClick" :href="`/${repository}/tree${path ? '/' + path : ''}/${entry_name}`">{{ entry_name }}</a> - </td> - <td> - <a @click="routeToCommit(entry.last_commit.id, $event)" :href="`/${repository}/log/${entry.last_commit.id}`"> - {{ entry.last_commit.message }} - </a> - </td> - <td> - {{ getPrettyLastUpdated(entry.last_commit.time) }} - </td> - </tr> - </tbody> - </table> -</template> - -<script> -const { formatDistance } = require('date-fns'); - -export default { - name: "RepositoryTreeTree", - props: { - repository: { - type: String, - required: true - }, - path: { - type: String, - required: true - }, - tree: { - type: Object, - required: true - } - }, - methods: { - stopClick(event) - { - event.preventDefault(); - }, - routeToCommit(commit_id, event) - { - event.stopPropagation(); - event.preventDefault(); - this.$router.push(`/${this.repository}/log/${commit_id}`); - }, - getPrettyLastUpdated(date) - { - return formatDistance(new Date(), new Date(date)); - } - } -}; -</script>
\ No newline at end of file |