embed frontend files
This commit is contained in:
parent
2c969680e0
commit
c04a8d53c6
2
go.mod
2
go.mod
@ -9,6 +9,7 @@ require (
|
||||
github.com/bogdanfinn/tls-client v1.7.8
|
||||
github.com/btcsuite/btcutil v1.0.2
|
||||
github.com/gin-contrib/cors v1.7.2
|
||||
github.com/gin-contrib/multitemplate v1.0.1
|
||||
github.com/gin-gonic/gin v1.10.0
|
||||
github.com/redis/go-redis/v9 v9.7.0
|
||||
github.com/robfig/cron/v3 v3.0.1
|
||||
@ -40,7 +41,6 @@ require (
|
||||
github.com/cloudwego/iasm v0.2.0 // indirect
|
||||
github.com/dgryski/go-rendezvous v0.0.0-20200823014737-9f7001d12a5f // indirect
|
||||
github.com/gabriel-vasile/mimetype v1.4.6 // indirect
|
||||
github.com/gin-contrib/multitemplate v1.0.1 // indirect
|
||||
github.com/gin-contrib/sse v0.1.0 // indirect
|
||||
github.com/go-openapi/jsonpointer v0.21.0 // indirect
|
||||
github.com/go-openapi/jsonreference v0.21.0 // indirect
|
||||
|
||||
@ -1,6 +1,10 @@
|
||||
package server
|
||||
|
||||
import (
|
||||
"embed"
|
||||
"errors"
|
||||
"io/fs"
|
||||
"net/http"
|
||||
"path/filepath"
|
||||
"pcgamedb/crawler"
|
||||
"pcgamedb/db"
|
||||
@ -8,6 +12,7 @@ import (
|
||||
"pcgamedb/server/handler"
|
||||
"pcgamedb/server/middleware"
|
||||
"strconv"
|
||||
"strings"
|
||||
|
||||
"github.com/gin-contrib/cors"
|
||||
"github.com/gin-contrib/multitemplate"
|
||||
@ -21,6 +26,9 @@ import (
|
||||
ginSwagger "github.com/swaggo/gin-swagger"
|
||||
)
|
||||
|
||||
//go:embed templates templates/layouts static
|
||||
var frontendFS embed.FS
|
||||
|
||||
func initRoute(app *gin.Engine) {
|
||||
app.Use(cors.New(cors.Config{
|
||||
AllowAllOrigins: true,
|
||||
@ -31,30 +39,49 @@ func initRoute(app *gin.Engine) {
|
||||
}
|
||||
|
||||
func initFrontend(app *gin.Engine) {
|
||||
// Load static files
|
||||
staticFs, err := fs.Sub(frontendFS, "static")
|
||||
if err != nil {
|
||||
log.Logger.Fatal("Error loading static files", zap.Error(err))
|
||||
return
|
||||
}
|
||||
app.StaticFS("/static", http.FS(staticFs))
|
||||
|
||||
// Load templates
|
||||
// directly using templates app.LoadHTMLFiles() to load all templates leads to error
|
||||
// because use templates with same name in different html file will case overridden
|
||||
// so we need to load all templates manually and use multitemplate to render them
|
||||
r := multitemplate.NewRenderer()
|
||||
|
||||
app.Static("/static", "server/static")
|
||||
|
||||
layoutFiles, err := filepath.Glob("server/templates/layouts/*.html")
|
||||
layoutFiles, err := frontendFS.ReadDir("templates/layouts")
|
||||
if err != nil {
|
||||
log.Logger.Fatal("Error loading layout templates", zap.Error(err))
|
||||
return
|
||||
}
|
||||
|
||||
rootFiles, err := filepath.Glob("server/templates/*.html")
|
||||
rootFiles, err := frontendFS.ReadDir("templates")
|
||||
if err != nil {
|
||||
log.Logger.Fatal("Error loading root templates", zap.Error(err))
|
||||
return
|
||||
}
|
||||
|
||||
for _, rootFile := range rootFiles {
|
||||
name := filepath.Base(rootFile)
|
||||
r.AddFromFiles(name, append([]string{rootFile}, layoutFiles...)...)
|
||||
if rootFile.IsDir() {
|
||||
continue
|
||||
}
|
||||
name := filepath.Base(rootFile.Name())
|
||||
templateFiles := []string{"templates/" + name}
|
||||
for _, layout := range layoutFiles {
|
||||
if !layout.IsDir() {
|
||||
templateFiles = append(templateFiles, "templates/layouts/"+layout.Name())
|
||||
}
|
||||
}
|
||||
r.AddFromFS(name, frontendFS, templateFiles...)
|
||||
}
|
||||
|
||||
app.HTMLRender = r
|
||||
|
||||
// Load routes
|
||||
app.GET("/", func(ctx *gin.Context) {
|
||||
monthTop, err := crawler.GetSteam250MonthTop50Cache()
|
||||
if err != nil {
|
||||
@ -102,8 +129,9 @@ func initFrontend(app *gin.Engine) {
|
||||
app.GET("/search", func(ctx *gin.Context) {
|
||||
key := ctx.Query("key")
|
||||
page := ctx.Query("page")
|
||||
key = strings.TrimSpace(key)
|
||||
if len(key) < 2 {
|
||||
ctx.HTML(400, "400.html", nil)
|
||||
ctx.HTML(400, "400.html", errors.New("Search key should be at least 2 characters long"))
|
||||
return
|
||||
}
|
||||
if page == "" {
|
||||
@ -111,12 +139,7 @@ func initFrontend(app *gin.Engine) {
|
||||
}
|
||||
pageInt, err := strconv.Atoi(page)
|
||||
if err != nil {
|
||||
ctx.HTML(400, "400.html", nil)
|
||||
return
|
||||
}
|
||||
|
||||
if key == "" {
|
||||
ctx.HTML(400, "400.html", nil)
|
||||
ctx.HTML(400, "400.html", err)
|
||||
return
|
||||
}
|
||||
games, totalPage, err := db.SearchGameInfos(key, pageInt, 10)
|
||||
|
||||
BIN
server/static/favicon.png
Normal file
BIN
server/static/favicon.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 11 KiB |
7
server/templates/400.html
Normal file
7
server/templates/400.html
Normal file
@ -0,0 +1,7 @@
|
||||
{{template "base" .}}
|
||||
{{define "title"}}Bad Request{{end}}
|
||||
{{define "styles"}} {{end}}
|
||||
{{define "content"}}
|
||||
Bad Request
|
||||
{{.}}
|
||||
{{end}}
|
||||
@ -1,6 +1,6 @@
|
||||
{{template "base" .}}
|
||||
|
||||
{{define "title"}}{{.Name}} - 游戏详情{{end}}
|
||||
{{define "title"}}{{.Name}} - Details{{end}}
|
||||
|
||||
{{define "styles"}}
|
||||
<style>
|
||||
@ -54,7 +54,7 @@
|
||||
<img src="{{.Cover}}" class="img-fluid rounded game-cover" alt="{{.Name}}" />
|
||||
{{else}}
|
||||
<div class="game-cover bg-secondary d-flex align-items-center justify-content-center rounded">
|
||||
<span class="text-white">暂无封面</span>
|
||||
<span class="text-white">No Image</span>
|
||||
</div>
|
||||
{{end}}
|
||||
</div>
|
||||
@ -63,7 +63,7 @@
|
||||
|
||||
{{if .Aliases}}
|
||||
<div>
|
||||
<span class="info-label">别名：</span>
|
||||
<span class="info-label">Aliases:</span>
|
||||
{{range .Aliases}}
|
||||
<span class="tag">{{.}}</span>
|
||||
{{end}}
|
||||
@ -71,14 +71,14 @@
|
||||
{{end}}
|
||||
|
||||
<div>
|
||||
<span class="info-label">开发商：</span>
|
||||
<span class="info-label">Developers:</span>
|
||||
{{range .Developers}}
|
||||
<span class="tag">{{.}}</span>
|
||||
{{end}}
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<span class="info-label">发行商：</span>
|
||||
<span class="info-label">Publishers:</span>
|
||||
{{range .Publishers}}
|
||||
<span class="tag">{{.}}</span>
|
||||
{{end}}
|
||||
@ -86,7 +86,7 @@
|
||||
|
||||
{{if .Languages}}
|
||||
<div>
|
||||
<span class="info-label">支持语言：</span>
|
||||
<span class="info-label">Languages:</span>
|
||||
{{range .Languages}}
|
||||
<span class="tag">{{.}}</span>
|
||||
{{end}}
|
||||
@ -98,7 +98,7 @@
|
||||
{{end}} {{if .SteamID}}
|
||||
<div>
|
||||
<a href="https://store.steampowered.com/app/{{.SteamID}}" target="_blank" class="btn btn-primary">
|
||||
在 Steam 上查看
|
||||
Steam
|
||||
</a>
|
||||
</div>
|
||||
{{end}}
|
||||
@ -112,7 +112,7 @@
|
||||
<div class="swiper-wrapper">
|
||||
{{range .Screenshots}}
|
||||
<div class="swiper-slide">
|
||||
<img src="{{.}}" alt="游戏截图" />
|
||||
<img src="{{.}}" alt="screenshot" />
|
||||
</div>
|
||||
{{end}}
|
||||
</div>
|
||||
@ -126,7 +126,7 @@
|
||||
<!-- Download Links -->
|
||||
{{if .Games}}
|
||||
<div class="mb-4">
|
||||
<h3 class="mb-3">下载链接</h3>
|
||||
<h3 class="mb-3">Download</h3>
|
||||
<div class="row g-4">
|
||||
{{range .Games}}
|
||||
<div class="col-md-6">
|
||||
@ -135,34 +135,30 @@
|
||||
<h5 class="card-title">{{.RawName}}</h5>
|
||||
{{if .Size}}
|
||||
<div class="card-text">
|
||||
<small class="text-muted">文件大小：{{.Size}}</small>
|
||||
<small class="text-muted">Size: {{.Size}}</small>
|
||||
</div>
|
||||
{{end}}
|
||||
{{if .Author}}
|
||||
<div class="card-text">
|
||||
<small class="text-muted">来源：{{.Author}}</small>
|
||||
<small class="text-muted">Source: {{.Author}}</small>
|
||||
</div>
|
||||
{{end}}
|
||||
{{if .Password}}
|
||||
<div class="card-text">
|
||||
解压密码：<code>{{.Password}}</code>
|
||||
<small class="text-muted">Unzip password: <code>{{.Password}}</code></small>
|
||||
</div>
|
||||
{{end}}
|
||||
<div class="mt-2 d-flex justify-content-between align-items-center">
|
||||
<!-- <a href="{{.Download}}" class="btn btn-success" target="_blank">下载</a> -->
|
||||
<div class="input-group" style="max-width: 300px;">
|
||||
<input type="text" class="form-control form-control-sm" value="{{.Download}}" readonly>
|
||||
<button class="btn btn-outline-secondary btn-sm" type="button"
|
||||
onclick="copyToClipboard(this.previousElementSibling)">
|
||||
复制
|
||||
Copy
|
||||
</button>
|
||||
</div>
|
||||
<a href="{{.Url}}" class="btn btn-outline-primary" target="_blank">详情页</a>
|
||||
<a href="{{.Url}}" class="btn btn-outline-primary" target="_blank">Source Page</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card-footer text-muted">
|
||||
更新时间：{{.UpdatedAt.Format "2006-01-02 15:04:05"}}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{{end}}
|
||||
@ -196,7 +192,7 @@
|
||||
navigator.clipboard.writeText(input.value).then(() => {
|
||||
const button = input.nextElementSibling;
|
||||
const originalText = button.textContent;
|
||||
button.textContent = '已复制';
|
||||
button.textContent = 'Copied';
|
||||
button.classList.remove('btn-outline-secondary');
|
||||
button.classList.add('btn-success');
|
||||
|
||||
@ -206,7 +202,7 @@
|
||||
button.classList.add('btn-outline-secondary');
|
||||
}, 1500);
|
||||
}).catch(err => {
|
||||
console.error('复制失败:', err);
|
||||
console.error('Failed to copy:', err);
|
||||
});
|
||||
}
|
||||
</script>
|
||||
|
||||
@ -40,22 +40,6 @@
|
||||
{{end}}
|
||||
|
||||
{{define "content"}}
|
||||
<!-- Search Section -->
|
||||
<div class="bg-light py-4">
|
||||
<div class="container">
|
||||
<form action="/search" method="GET">
|
||||
<div class="row justify-content-center">
|
||||
<div class="col-md-8">
|
||||
<div class="input-group">
|
||||
<input type="text" class="form-control" name="key" placeholder="搜索游戏..." />
|
||||
<button class="btn btn-primary" type="submit">搜索</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Games Grid -->
|
||||
<div class="container py-4">
|
||||
<h2 class="mb-4">Month Top</h2>
|
||||
@ -67,7 +51,7 @@
|
||||
<img src="{{.Cover}}" class="card-img-top game-cover" alt="{{.Name}}" />
|
||||
{{else}}
|
||||
<div class="card-img-top game-cover bg-secondary d-flex align-items-center justify-content-center">
|
||||
<span class="text-white">暂无图片</span>
|
||||
<span class="text-white">No Image</span>
|
||||
</div>
|
||||
{{end}}
|
||||
<div class="card-body">
|
||||
@ -75,7 +59,7 @@
|
||||
<p class="card-text game-description">{{.Description}}</p>
|
||||
{{if .Publishers}}
|
||||
<div class="publishers mb-2">
|
||||
<small class="text-muted">发行商:</small>
|
||||
<small class="text-muted">Publishers:</small>
|
||||
{{range $index, $publisher := .Publishers}} {{if $index}}, {{end}}
|
||||
<small class="text-muted">{{$publisher}}</small>
|
||||
{{end}}
|
||||
@ -98,7 +82,7 @@
|
||||
<img src="{{.Cover}}" class="card-img-top game-cover" alt="{{.Name}}" />
|
||||
{{else}}
|
||||
<div class="card-img-top game-cover bg-secondary d-flex align-items-center justify-content-center">
|
||||
<span class="text-white">暂无图片</span>
|
||||
<span class="text-white">No Image</span>
|
||||
</div>
|
||||
{{end}}
|
||||
<div class="card-body">
|
||||
@ -106,7 +90,7 @@
|
||||
<p class="card-text game-description">{{.Description}}</p>
|
||||
{{if .Publishers}}
|
||||
<div class="publishers mb-2">
|
||||
<small class="text-muted">发行商:</small>
|
||||
<small class="text-muted">Publishers:</small>
|
||||
{{range $index, $publisher := .Publishers}} {{if $index}}, {{end}}
|
||||
<small class="text-muted">{{$publisher}}</small>
|
||||
{{end}}
|
||||
@ -120,7 +104,7 @@
|
||||
</div>
|
||||
|
||||
<div class="container py-4">
|
||||
<h2 class="mb-4">Best Of The Year</h2>
|
||||
<h2 class="mb-4">Best of the Year</h2>
|
||||
<div class="row g-4">
|
||||
{{range .BestOfTheYear}}
|
||||
<div class="col-12 col-sm-6 col-md-4 col-lg-5-item">
|
||||
@ -129,7 +113,7 @@
|
||||
<img src="{{.Cover}}" class="card-img-top game-cover" alt="{{.Name}}" />
|
||||
{{else}}
|
||||
<div class="card-img-top game-cover bg-secondary d-flex align-items-center justify-content-center">
|
||||
<span class="text-white">暂无图片</span>
|
||||
<span class="text-white">No Image</span>
|
||||
</div>
|
||||
{{end}}
|
||||
<div class="card-body">
|
||||
@ -137,7 +121,7 @@
|
||||
<p class="card-text game-description">{{.Description}}</p>
|
||||
{{if .Publishers}}
|
||||
<div class="publishers mb-2">
|
||||
<small class="text-muted">发行商:</small>
|
||||
<small class="text-muted">Publishers:</small>
|
||||
{{range $index, $publisher := .Publishers}} {{if $index}}, {{end}}
|
||||
<small class="text-muted">{{$publisher}}</small>
|
||||
{{end}}
|
||||
|
||||
@ -1,25 +1,23 @@
|
||||
{{define "base"}}
|
||||
<!DOCTYPE html>
|
||||
<html lang="zh-CN">
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||
<title>{{template "title" .}}</title>
|
||||
<link
|
||||
href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css"
|
||||
rel="stylesheet"
|
||||
/>
|
||||
<link
|
||||
rel="stylesheet"
|
||||
href="https://cdn.jsdelivr.net/npm/swiper@8/swiper-bundle.min.css"
|
||||
/>
|
||||
{{block "styles" .}}{{end}}
|
||||
</head>
|
||||
<body>
|
||||
{{template "header" .}} {{block "content" .}}{{end}} {{template "footer" .}}
|
||||
<html lang="zh-CN" data-bs-theme="dark">
|
||||
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||
<title>{{template "title" .}}</title>
|
||||
<link rel="icon" type="image/x-icon" href="/static/favicon.png">
|
||||
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet" />
|
||||
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/swiper@8/swiper-bundle.min.css" />
|
||||
{{block "styles" .}}{{end}}
|
||||
</head>
|
||||
|
||||
<body>
|
||||
{{template "header" .}} {{block "content" .}}{{end}} {{template "footer" .}}
|
||||
|
||||
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/js/bootstrap.bundle.min.js"></script>
|
||||
{{block "scripts" .}}{{end}}
|
||||
</body>
|
||||
|
||||
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/js/bootstrap.bundle.min.js"></script>
|
||||
{{block "scripts" .}}{{end}}
|
||||
</body>
|
||||
</html>
|
||||
{{end}}
|
||||
@ -1,10 +1,11 @@
|
||||
{{define "footer"}}
|
||||
<!-- Footer -->
|
||||
<footer class="bg-dark text-light py-4 mt-5">
|
||||
<footer class="text-light py-4 mt-5">
|
||||
<div class="container">
|
||||
<div class="col text-center">
|
||||
<a href="https://git.nite07.com/nite/pcgamedb" target="_blank">开源仓库</a> | <a href="/api/swagger/index.html">API
|
||||
文档</a>
|
||||
<div><a href="https://git.nite07.com/nite/pcgamedb" target="_blank">Open Source</a> | <a
|
||||
href="/api/swagger/index.html">API Doc</a></div>
|
||||
<div>Made by <a href="https://www.nite07.com" target="_blank">Nite</a></div>
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
@ -1,14 +1,21 @@
|
||||
{{define "header"}}
|
||||
<!-- Header -->
|
||||
<nav class="navbar navbar-expand-lg navbar-dark bg-dark">
|
||||
<nav class="navbar navbar-expand-lg">
|
||||
<div class="container">
|
||||
<a class="navbar-brand" href="/">游戏库</a>
|
||||
<a class="navbar-brand" href="/">GameDB</a>
|
||||
<div class="navbar-collapse" id="navbarNav">
|
||||
<ul class="navbar-nav">
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" href="https://www.nite07.com" target="_blank">博客</a>
|
||||
</li>
|
||||
<!-- <li class="nav-item"><a class="nav-link" href="https://www.nite07.com" target="_blank">Blog</a></li> -->
|
||||
</ul>
|
||||
|
||||
<div class="ms-auto">
|
||||
<form action="/search" method="GET" class="d-flex">
|
||||
<div class="input-group">
|
||||
<input type="text" class="form-control" name="key" placeholder="Input full english name of game" />
|
||||
<button class="btn btn-primary" type="submit">Search</button>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</nav>
|
||||
|
||||
@ -47,6 +47,7 @@
|
||||
</div>
|
||||
<!-- Games Grid -->
|
||||
<div class="container py-4">
|
||||
{{if .Games}}
|
||||
<div class="row g-4">
|
||||
{{range .Games}}
|
||||
<div class="col-12 col-sm-6 col-md-4 col-lg-5-item">
|
||||
@ -55,7 +56,7 @@
|
||||
<img src="{{.Cover}}" class="card-img-top game-cover" alt="{{.Name}}" />
|
||||
{{else}}
|
||||
<div class="card-img-top game-cover bg-secondary d-flex align-items-center justify-content-center">
|
||||
<span class="text-white">暂无图片</span>
|
||||
<span class="text-white">No Image</span>
|
||||
</div>
|
||||
{{end}}
|
||||
<div class="card-body">
|
||||
@ -63,7 +64,7 @@
|
||||
<p class="card-text game-description">{{.Description}}</p>
|
||||
{{if .Publishers}}
|
||||
<div class="publishers mb-2">
|
||||
<small class="text-muted">发行商:</small>
|
||||
<small class="text-muted">Publishers:</small>
|
||||
{{range $index, $publisher := .Publishers}} {{if $index}}, {{end}}
|
||||
<small class="text-muted">{{$publisher}}</small>
|
||||
{{end}}
|
||||
@ -74,6 +75,11 @@
|
||||
</div>
|
||||
{{end}}
|
||||
</div>
|
||||
{{else}}
|
||||
<div class="text-center py-5">
|
||||
<h4 class="text-muted">No results found for "{{.Key}}"</h4>
|
||||
</div>
|
||||
{{end}}
|
||||
</div>
|
||||
<!-- Pagination -->
|
||||
<div class="container py-4">
|
||||
|
||||
Loading…
Reference in New Issue
Block a user