Skip to content

Commit 2949043

Browse files
SohnyBohnytechknowlogick
SohnyBohny
authored and
techknowlogick
committed
Create Progressive Web App (#4730)
* Create manifest and serviceworker * Create templates and add AppSubUrl * Add JSRenderer * fix ctx type * Add JSRenderer to static.go * Complete adding {{AppSubUrl}} * Add more fonts to urlsToCache * Add 512px and 192px icons * Hardcode font MD5 * Default theme doesn't have a specific CSS file
1 parent e09fe48 commit 2949043

File tree

9 files changed

+152
-0
lines changed

9 files changed

+152
-0
lines changed

‎Makefile

+2
Original file line numberDiff line numberDiff line change
@@ -347,6 +347,8 @@ update-translations:
347347
generate-images:
348348
mkdir -p $(TMPDIR)/images
349349
inkscape -f $(PWD)/assets/logo.svg -w 880 -h 880 -e $(PWD)/public/img/gitea-lg.png
350+
inkscape -f $(PWD)/assets/logo.svg -w 512 -h 512 -e $(PWD)/public/img/gitea-512.png
351+
inkscape -f $(PWD)/assets/logo.svg -w 192 -h 192 -e $(PWD)/public/img/gitea-192.png
350352
inkscape -f $(PWD)/assets/logo.svg -w 120 -h 120 -jC -i layer1 -e $(TMPDIR)/images/sm-1.png
351353
inkscape -f $(PWD)/assets/logo.svg -w 120 -h 120 -jC -i layer2 -e $(TMPDIR)/images/sm-2.png
352354
composite -compose atop $(TMPDIR)/images/sm-2.png $(TMPDIR)/images/sm-1.png $(PWD)/public/img/gitea-sm.png

‎modules/templates/dynamic.go

+12
Original file line numberDiff line numberDiff line change
@@ -45,6 +45,18 @@ func JSONRenderer() macaron.Handler {
4545
})
4646
}
4747

48+
// JSRenderer implements the macaron handler for serving JS templates.
49+
func JSRenderer() macaron.Handler {
50+
return macaron.Renderer(macaron.RenderOptions{
51+
Funcs: NewFuncMap(),
52+
Directory: path.Join(setting.StaticRootPath, "templates"),
53+
AppendDirectories: []string{
54+
path.Join(setting.CustomPath, "templates"),
55+
},
56+
HTMLContentType: "application/javascript",
57+
})
58+
}
59+
4860
// Mailer provides the templates required for sending notification mails.
4961
func Mailer() *template.Template {
5062
for _, funcs := range NewFuncMap() {

‎modules/templates/static.go

+9
Original file line numberDiff line numberDiff line change
@@ -129,6 +129,15 @@ func JSONRenderer() macaron.Handler {
129129
})
130130
}
131131

132+
// JSRenderer implements the macaron handler for serving JS templates.
133+
func JSRenderer() macaron.Handler {
134+
return macaron.Renderer(macaron.RenderOptions{
135+
Funcs: NewFuncMap(),
136+
TemplateFileSystem: NewTemplateFileSystem(),
137+
HTMLContentType: "application/javascript",
138+
})
139+
}
140+
132141
// Mailer provides the templates required for sending notification mails.
133142
func Mailer() *template.Template {
134143
for _, funcs := range NewFuncMap() {

‎public/img/gitea-192.png

8.53 KB
Loading

‎public/img/gitea-512.png

25.1 KB
Loading

‎routers/routes/routes.go

+9
Original file line numberDiff line numberDiff line change
@@ -791,6 +791,15 @@ func RegisterRoutes(m *macaron.Macaron) {
791791
}
792792
})
793793

794+
// Progressive Web App
795+
m.Get("/manifest.json", templates.JSONRenderer(), func(ctx *context.Context) {
796+
ctx.HTML(200, "pwa/manifest_json")
797+
})
798+
799+
m.Get("/serviceworker.js", templates.JSRenderer(), func(ctx *context.Context) {
800+
ctx.HTML(200, "pwa/serviceworker_js")
801+
})
802+
794803
// prometheus metrics endpoint
795804
if setting.Metrics.Enabled {
796805
c := metrics.NewCollector()

‎templates/base/head.tmpl

+17
Original file line numberDiff line numberDiff line change
@@ -5,6 +5,23 @@
55
<meta name="viewport" content="width=device-width, initial-scale=1">
66
<meta http-equiv="x-ua-compatible" content="ie=edge">
77
<title>{{if .Title}}{{.Title}} - {{end}}{{AppName}}</title>
8+
<link rel="manifest" href="{{AppSubUrl}}/manifest.json">
9+
10+
<script>
11+
if ('serviceWorker' in navigator) {
12+
window.addEventListener('load', function() {
13+
navigator.serviceWorker.register('{{AppSubUrl}}/serviceworker.js').then(function(registration) {
14+
// Registration was successful
15+
console.log('ServiceWorker registration successful with scope: ', registration.scope);
16+
}, function(err) {
17+
// registration failed :(
18+
console.log('ServiceWorker registration failed: ', err);
19+
});
20+
});
21+
}
22+
23+
</script>
24+
825
<meta name="theme-color" content="{{ThemeColorMetaTag}}">
926
<meta name="author" content="{{if .Repository}}{{.Owner.Name}}{{else}}{{MetaAuthor}}{{end}}" />
1027
<meta name="description" content="{{if .Repository}}{{.Repository.Name}}{{if .Repository.Description}} - {{.Repository.Description}}{{end}}{{else}}{{MetaDescription}}{{end}}" />

‎templates/pwa/manifest_json.tmpl

+31
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,31 @@
1+
{
2+
"short_name": "Gitea",
3+
"name": "Gitea - Git with a cup of tea",
4+
"icons": [
5+
{
6+
"src": "{{AppSubUrl}}/img/gitea-lg.png",
7+
"type": "image/png",
8+
"sizes": "880x880"
9+
},
10+
{
11+
"src": "{{AppSubUrl}}/img/gitea-sm.png",
12+
"type": "image/png",
13+
"sizes": "120x120"
14+
},
15+
{
16+
"src": "{{AppSubUrl}}/img/gitea-512.png",
17+
"type": "image/png",
18+
"sizes": "512x512"
19+
},
20+
{
21+
"src": "{{AppSubUrl}}/img/gitea-192.png",
22+
"type": "image/png",
23+
"sizes": "192x192"
24+
}
25+
],
26+
"start_url": "{{AppSubUrl}}/",
27+
"scope": "{{AppSubUrl}}/",
28+
"background_color": "#FAFAFA",
29+
"display": "standalone",
30+
"theme_color": "{{ThemeColorMetaTag}}"
31+
}

‎templates/pwa/serviceworker_js.tmpl

+72
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,72 @@
1+
var STATIC_CACHE = 'static-cache-v1';
2+
var urlsToCache = [
3+
// js
4+
'{{AppSubUrl}}/vendor/plugins/jquery.areyousure/jquery.are-you-sure.js',
5+
'{{AppSubUrl}}/vendor/plugins/jquery/jquery.min.js',
6+
'{{AppSubUrl}}/vendor/plugins/semantic/semantic.min.js',
7+
'{{AppSubUrl}}/js/index.js?v={{MD5 AppVer}}',
8+
'{{AppSubUrl}}/js/draw.js',
9+
'{{AppSubUrl}}/vendor/plugins/clipboard/clipboard.min.js',
10+
'{{AppSubUrl}}/vendor/plugins/gitgraph/gitgraph.js',
11+
'{{AppSubUrl}}/vendor/plugins/vue/vue.min.js',
12+
'{{AppSubUrl}}/vendor/plugins/emojify/emojify.min.js',
13+
'{{AppSubUrl}}/vendor/plugins/cssrelpreload/loadCSS.min.js',
14+
'{{AppSubUrl}}/vendor/plugins/cssrelpreload/cssrelpreload.min.js',
15+
'{{AppSubUrl}}/vendor/plugins/dropzone/dropzone.js',
16+
'{{AppSubUrl}}/vendor/plugins/highlight/highlight.pack.js',
17+
'{{AppSubUrl}}/vendor/plugins/jquery.datetimepicker/jquery.datetimepicker.js',
18+
'{{AppSubUrl}}/vendor/plugins/jquery.minicolors/jquery.minicolors.min.js',
19+
'{{AppSubUrl}}/vendor/plugins/codemirror/addon/mode/loadmode.js',
20+
'{{AppSubUrl}}/vendor/plugins/codemirror/mode/meta.js',
21+
'{{AppSubUrl}}/vendor/plugins/simplemde/simplemde.min.js',
22+
23+
// css
24+
'{{AppSubUrl}}/vendor/assets/font-awesome/css/font-awesome.min.css',
25+
'{{AppSubUrl}}/vendor/assets/octicons/octicons.min.css',
26+
'{{AppSubUrl}}/vendor/plugins/simplemde/simplemde.min.css',
27+
'{{AppSubUrl}}/vendor/plugins/gitgraph/gitgraph.css',
28+
'{{AppSubUrl}}/vendor/plugins/tribute/tribute.css',
29+
'{{AppSubUrl}}/vendor/plugins/semantic/semantic.min.css',
30+
'{{AppSubUrl}}/css/index.css?v={{MD5 AppVer}}',
31+
'{{AppSubUrl}}/vendor/plugins/highlight/github.css',
32+
'{{AppSubUrl}}/vendor/plugins/jquery.minicolors/jquery.minicolors.css',
33+
'{{AppSubUrl}}/vendor/plugins/jquery.datetimepicker/jquery.datetimepicker.css',
34+
'{{AppSubUrl}}/vendor/plugins/dropzone/dropzone.css',
35+
{{if ne DefaultTheme "gitea"}}
36+
'{{AppSubUrl}}/css/theme-{{DefaultTheme}}.css',
37+
{{end}}
38+
39+
// img
40+
'{{AppSubUrl}}/img/gitea-sm.png',
41+
'{{AppSubUrl}}/img/gitea-lg.png',
42+
43+
// fonts
44+
'{{AppSubUrl}}/vendor/plugins/semantic/themes/default/assets/fonts/icons.woff2',
45+
'{{AppSubUrl}}/vendor/assets/octicons/octicons.woff2?ef21c39f0ca9b1b5116e5eb7ac5eabe6',
46+
'{{AppSubUrl}}/vendor/assets/lato-fonts/lato-v14-latin-regular.woff2',
47+
'{{AppSubUrl}}/vendor/assets/lato-fonts/lato-v14-latin-700.woff2'
48+
];
49+
50+
self.addEventListener('install', function (event) {
51+
// Perform install steps
52+
event.waitUntil(
53+
caches.open(STATIC_CACHE)
54+
.then(function (cache) {
55+
return cache.addAll(urlsToCache);
56+
})
57+
);
58+
});
59+
60+
self.addEventListener('fetch', function (event) {
61+
event.respondWith(
62+
caches.match(event.request)
63+
.then(function (response) {
64+
// Cache hit - return response
65+
if (response) {
66+
return response;
67+
}
68+
return fetch(event.request);
69+
}
70+
)
71+
);
72+
});

0 commit comments

Comments
 (0)