From cc451e1c0e474559d4b335218919450cedc608c8 Mon Sep 17 00:00:00 2001
From: TechnicalSuwako <technicalsuwako@noreply.codeberg.org>
Date: Thu, 8 Jun 2023 07:21:06 +0000
Subject: [PATCH] add language bar (#121)
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

#120

Co-authored-by: 諏訪子 <suwako@076.moe>
Reviewed-on: https://codeberg.org/gothub/gothub/pulls/121
Co-authored-by: TechnicalSuwako <technicalsuwako@noreply.codeberg.org>
Co-committed-by: TechnicalSuwako <technicalsuwako@noreply.codeberg.org>
---
 pages/repo.go         | 14 ++++++++++++--
 public/css/global.css | 14 ++++++++++++++
 views/repo.html       | 10 +++++++++-
 3 files changed, 35 insertions(+), 3 deletions(-)

diff --git a/pages/repo.go b/pages/repo.go
index c7dc8d6..908b82d 100644
--- a/pages/repo.go
+++ b/pages/repo.go
@@ -11,6 +11,12 @@ import (
 	"github.com/gofiber/fiber/v2"
 )
 
+type Languages struct {
+  Name          string
+  Percent       string
+  Color         string
+}
+
 type Repo struct {
 	Fullname      string
 	Description   string
@@ -19,7 +25,7 @@ type Repo struct {
 	Forks         string
 	CommitsBehind string
 	Watchers      string
-	Language      []string
+  Language      []Languages
 	License       string
 	DefaultBranch string
 	Readme        string
@@ -90,7 +96,11 @@ func HandleRepo(c *fiber.Ctx) error {
 	})
 	sc.OnHTML("div.BorderGrid-cell ul.list-style-none", func(e *colly.HTMLElement) {
 		e.ForEach("li.d-inline .d-inline-flex", func(i int, el *colly.HTMLElement) {
-			Scrape.Language = append(Scrape.Language, el.ChildText("span.text-bold")+" "+el.ChildText("span:contains('%')"))
+      var lang Languages
+      lang.Name = el.ChildText("span.text-bold")
+      lang.Percent = el.ChildText("span:contains('%')")
+      lang.Color = strings.ReplaceAll(strings.ReplaceAll(el.ChildAttr("svg", "style"), "color:", ""), ";", "")
+      Scrape.Language = append(Scrape.Language, lang)
 		})
 	})
 	sc.OnHTML("div#repository-container-header", func(e *colly.HTMLElement) {
diff --git a/public/css/global.css b/public/css/global.css
index b01effb..67e3ebf 100644
--- a/public/css/global.css
+++ b/public/css/global.css
@@ -211,6 +211,20 @@ a:hover {
   color: var(--text);
 }
 
+.lang-bar:last-child {
+  margin-bottom: 0;
+}
+
+.lang-bar {
+  width: 100%;
+  display: inherit;
+  height: 10px;
+  border-radius:4px;
+  overflow: hidden; /* To force the corners to be round. */
+  user-select: none; /* Prevent the selection */
+  -webkit-user-select: none; /* Safari specific fix. */
+}
+
 /* URI: /:user/:repo */
 .button {
   background-color: var(--background);
diff --git a/views/repo.html b/views/repo.html
index e5816de..ff1ff36 100644
--- a/views/repo.html
+++ b/views/repo.html
@@ -31,7 +31,15 @@
       {{.DefaultBranch}}
     </p>
     {{ end }} {{ if .Language }}
-    <p>🗒️ {{range .Language}} {{.}} {{end}}</p>
+    <p>
+      {{range $o := .Language}}{{$o.Name}} {{$o.Percent}}, {{end}}
+      <div class="lang-bar">{{range $i, $o := .Language}}
+        <span style="width: {{$o.Percent}}; background-color: {{$o.Color}}">
+          &nbsp;
+        </span>
+        {{end}}
+      </div>
+    </p>
     {{end}} {{ if .CommitsBehind }} This repository is {{.CommitsBehind}}
     commits behind its parent. {{end}}
   </div>