Handle Favicon in UI
This commit is contained in:
parent
0c668ef226
commit
a25a7a571a
|
@ -0,0 +1,52 @@
|
||||||
|
defmodule Mobilizon.Web.ManifestController do
|
||||||
|
use Mobilizon.Web, :controller
|
||||||
|
|
||||||
|
alias Mobilizon.Config
|
||||||
|
alias Mobilizon.Medias.Media
|
||||||
|
|
||||||
|
@spec manifest(Plug.Conn.t(), any) :: Plug.Conn.t()
|
||||||
|
def manifest(conn, _params) do
|
||||||
|
favicons = case Config.instance_favicon() do
|
||||||
|
%Media{file: %{url: url}, metadata: metadata} ->
|
||||||
|
[Map.merge(
|
||||||
|
%{
|
||||||
|
src: url,
|
||||||
|
},
|
||||||
|
case metadata do
|
||||||
|
%{width: width} -> %{sizes: "#{width}x#{width}"}
|
||||||
|
_ -> %{}
|
||||||
|
end
|
||||||
|
)]
|
||||||
|
_ -> [
|
||||||
|
%{
|
||||||
|
src: "./img/icons/android-chrome-512x512.png",
|
||||||
|
sizes: "512x512",
|
||||||
|
type: "image/png"
|
||||||
|
},
|
||||||
|
%{
|
||||||
|
src: "./img/icons/android-chrome-192x192.png",
|
||||||
|
sizes: "192x192",
|
||||||
|
type: "image/png"
|
||||||
|
}
|
||||||
|
]
|
||||||
|
end
|
||||||
|
json(conn, %{
|
||||||
|
name: Config.instance_name(),
|
||||||
|
start_url: "/",
|
||||||
|
scope: "/",
|
||||||
|
display: "standalone",
|
||||||
|
background_color: "#ffffff",
|
||||||
|
theme_color: "#ffd599",
|
||||||
|
orientation: "portrait-primary",
|
||||||
|
icons: favicons
|
||||||
|
})
|
||||||
|
end
|
||||||
|
|
||||||
|
@spec favicon(Plug.Conn.t(), any) :: Plug.Conn.t()
|
||||||
|
def favicon(conn, _params) do
|
||||||
|
case Config.instance_favicon() do
|
||||||
|
%Media{file: %{url: url}} -> redirect(conn, external: url)
|
||||||
|
_ -> redirect(conn, to: "/img/icons/favicon.ico")
|
||||||
|
end
|
||||||
|
end
|
||||||
|
end
|
|
@ -19,7 +19,7 @@ defmodule Mobilizon.Web do
|
||||||
|
|
||||||
def static_paths,
|
def static_paths,
|
||||||
do:
|
do:
|
||||||
~w(index.html manifest.json manifest.webmanifest service-worker.js css fonts img js favicon.ico robots.txt assets)
|
~w(index.html service-worker.js css fonts img js robots.txt assets)
|
||||||
|
|
||||||
def controller do
|
def controller do
|
||||||
quote do
|
quote do
|
||||||
|
|
|
@ -113,6 +113,12 @@ defmodule Mobilizon.Web.Router do
|
||||||
get("/nodeinfo/:version", NodeInfoController, :nodeinfo)
|
get("/nodeinfo/:version", NodeInfoController, :nodeinfo)
|
||||||
end
|
end
|
||||||
|
|
||||||
|
scope "/", Mobilizon.Web do
|
||||||
|
get("/manifest.webmanifest", ManifestController, :manifest)
|
||||||
|
get("/manifest.json", ManifestController, :manifest)
|
||||||
|
get("/favicon.ico", ManifestController, :favicon)
|
||||||
|
end
|
||||||
|
|
||||||
scope "/", Mobilizon.Web do
|
scope "/", Mobilizon.Web do
|
||||||
pipe_through(:activity_pub_and_html)
|
pipe_through(:activity_pub_and_html)
|
||||||
pipe_through(:activity_pub_signature)
|
pipe_through(:activity_pub_signature)
|
||||||
|
|
|
@ -1,36 +1,40 @@
|
||||||
<!DOCTYPE html>
|
<!DOCTYPE html>
|
||||||
<html lang={Map.get(assigns, :locale, "en")} dir={language_direction(assigns)}>
|
<html lang={Map.get(assigns, :locale, "en" )} dir={language_direction(assigns)}>
|
||||||
<head>
|
|
||||||
<meta charset="utf-8" />
|
<head>
|
||||||
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
|
<meta charset="utf-8" />
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
|
||||||
<link rel="apple-touch-icon" href="/img/icons/apple-touch-icon-152x152.png" sizes="152x152" />
|
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||||
<link rel="mask-icon" href="/img/icons/safari-pinned-tab.svg" color={theme_color()} />
|
<link rel="apple-touch-icon" href={favicon_url()} sizes={favicon_sizes()} />
|
||||||
<link rel="manifest" href="/manifest.webmanifest" />
|
<link rel="icon" href={favicon_url()} sizes={favicon_sizes()} />
|
||||||
<meta name="theme-color" content={theme_color()} />
|
<link rel="mask-icon" href="/img/icons/safari-pinned-tab.svg" color={theme_color()} />
|
||||||
<script>
|
<link rel="manifest" href="/manifest.webmanifest" />
|
||||||
if (localStorage.theme === 'dark' || (!('theme' in localStorage) && window.matchMedia('(prefers-color-scheme: dark)').matches)) {
|
<meta name="theme-color" content={theme_color()} />
|
||||||
document.documentElement.classList.add('dark')
|
<script>
|
||||||
} else {
|
if (localStorage.theme === 'dark' || (!('theme' in localStorage) && window.matchMedia('(prefers-color-scheme: dark)').matches)) {
|
||||||
document.documentElement.classList.remove('dark')
|
document.documentElement.classList.add('dark')
|
||||||
}
|
} else {
|
||||||
</script>
|
document.documentElement.classList.remove('dark')
|
||||||
<%= if root?(assigns) do %>
|
}
|
||||||
<link rel="preload" href="/img/shape-1.svg" as="image" />
|
</script>
|
||||||
<link rel="preload" href="/img/shape-2.svg" as="image" />
|
<%= if root?(assigns) do %>
|
||||||
<link rel="preload" href="/img/shape-3.svg" as="image" />
|
<link rel="preload" href="/img/shape-1.svg" as="image" />
|
||||||
<% end %>
|
<link rel="preload" href="/img/shape-2.svg" as="image" />
|
||||||
<%= tags(assigns) || assigns.tags %>
|
<link rel="preload" href="/img/shape-3.svg" as="image" />
|
||||||
<%= Vite.vite_client() %>
|
<% end %>
|
||||||
<%= Vite.vite_snippet("src/main.ts") %>
|
<%= tags(assigns) || assigns.tags %>
|
||||||
</head>
|
<%= Vite.vite_client() %>
|
||||||
<body>
|
<%= Vite.vite_snippet("src/main.ts") %>
|
||||||
<noscript>
|
</head>
|
||||||
<strong>
|
|
||||||
We're sorry but Mobilizon doesn't work properly without JavaScript enabled. Please enable it to continue.
|
<body>
|
||||||
</strong>
|
<noscript>
|
||||||
</noscript>
|
<strong>
|
||||||
<div id="app"></div>
|
We're sorry but Mobilizon doesn't work properly without JavaScript enabled. Please enable it to continue.
|
||||||
<!-- built files will be auto injected -->
|
</strong>
|
||||||
</body>
|
</noscript>
|
||||||
|
<div id="app"></div>
|
||||||
|
<!-- built files will be auto injected -->
|
||||||
|
</body>
|
||||||
|
|
||||||
</html>
|
</html>
|
||||||
|
|
|
@ -6,6 +6,7 @@ defmodule Mobilizon.Web.PageView do
|
||||||
use Mobilizon.Web, :view
|
use Mobilizon.Web, :view
|
||||||
|
|
||||||
alias Mobilizon.Actors.Actor
|
alias Mobilizon.Actors.Actor
|
||||||
|
alias Mobilizon.Config
|
||||||
alias Mobilizon.Discussions.{Comment, Discussion}
|
alias Mobilizon.Discussions.{Comment, Discussion}
|
||||||
alias Mobilizon.Events.Event
|
alias Mobilizon.Events.Event
|
||||||
alias Mobilizon.Posts.Post
|
alias Mobilizon.Posts.Post
|
||||||
|
@ -91,4 +92,23 @@ defmodule Mobilizon.Web.PageView do
|
||||||
def root?(assigns) do
|
def root?(assigns) do
|
||||||
assigns |> Map.get(:conn, %{request_path: "/"}) |> Map.get(:request_path, "/") == "/"
|
assigns |> Map.get(:conn, %{request_path: "/"}) |> Map.get(:request_path, "/") == "/"
|
||||||
end
|
end
|
||||||
|
|
||||||
|
defp favicon do
|
||||||
|
case Config.instance_favicon() do
|
||||||
|
%{file: %{url: url}, metadata: metadata} -> %{
|
||||||
|
src: url,
|
||||||
|
sizes: case metadata do
|
||||||
|
%{width: width} -> "#{width}x#{width}"
|
||||||
|
_ -> "any"
|
||||||
|
end
|
||||||
|
}
|
||||||
|
_ -> %{
|
||||||
|
src: "/img/icons/apple-touch-icon-152x152.png",
|
||||||
|
sizes: "152x152"
|
||||||
|
}
|
||||||
|
end
|
||||||
|
end
|
||||||
|
|
||||||
|
def favicon_url, do: Map.get(favicon(), :src)
|
||||||
|
def favicon_sizes, do: Map.get(favicon(), :sizes)
|
||||||
end
|
end
|
||||||
|
|
Before Width: | Height: | Size: 15 KiB After Width: | Height: | Size: 15 KiB |
Loading…
Reference in New Issue