Skip to content

Commit

Permalink
Add option for custom branding
Browse files Browse the repository at this point in the history
  • Loading branch information
rhamilto committed May 2, 2019
1 parent 2846493 commit 1fb3305
Show file tree
Hide file tree
Showing 7 changed files with 96 additions and 45 deletions.
10 changes: 10 additions & 0 deletions cmd/bridge/config.go
Expand Up @@ -55,6 +55,8 @@ type Auth struct {
type Customization struct {
Branding string `yaml:"branding"`
DocumentationBaseURL string `yaml:"documentationBaseURL"`
CustomProductName string `yaml:"customProductName"`
CustomLogoFile string `yaml:"customLogoFile"`
}

// SetFlagsFromConfig sets flag values based on a YAML config file.
Expand Down Expand Up @@ -175,4 +177,12 @@ func addCustomization(fs *flag.FlagSet, customization *Customization) {
if customization.DocumentationBaseURL != "" {
fs.Set("documentation-base-url", customization.DocumentationBaseURL)
}

if customization.CustomProductName != "" {
fs.Set("custom-product-name", customization.CustomProductName)
}

if customization.CustomLogoFile != "" {
fs.Set("custom-logo-file", customization.CustomLogoFile)
}
}
10 changes: 10 additions & 0 deletions cmd/bridge/main.go
Expand Up @@ -84,6 +84,8 @@ func main() {

fDexAPIHost := fs.String("dex-api-host", "", "Target host and port of the Dex API service.")
fBranding := fs.String("branding", "okd", "Console branding for the masthead logo and title. One of okd, openshift, ocp, online, dedicated, or azure. Defaults to okd.")
fCustomProductName := fs.String("custom-product-name", "", "Custom product name for console branding.")
fCustomLogoFile := fs.String("custom-logo-file", "", "Custom product image for console branding.")
fDocumentationBaseURL := fs.String("documentation-base-url", "", "The base URL for documentation links.")
fGoogleTagManagerID := fs.String("google-tag-manager-id", "", "Google Tag Manager ID. External analytics are disabled if this is not set.")

Expand Down Expand Up @@ -152,13 +154,21 @@ func main() {
flagFatalf("branding", "value must be one of okd, openshift, ocp, online, dedicated, or azure")
}

if *fCustomLogoFile != "" {
if _, err := os.Stat(*fCustomLogoFile); err != nil {
log.Fatalf("could not read logo file: %v", err)
}
}

srv := &server.Server{
PublicDir: *fPublicDir,
TectonicVersion: *fTectonicVersion,
BaseURL: baseURL,
LogoutRedirect: logoutRedirect,
TectonicCACertFile: caCertFilePath,
Branding: branding,
CustomProductName: *fCustomProductName,
CustomLogoFile: *fCustomLogoFile,
DocumentationBaseURL: documentationBaseURL,
GoogleTagManagerID: *fGoogleTagManagerID,
LoadTestFactor: *fLoadTestFactor,
Expand Down
5 changes: 3 additions & 2 deletions frontend/public/components/about-modal.tsx
Expand Up @@ -16,6 +16,7 @@ const AboutModal_: React.FC<AboutModalProps> = ({isOpen, closeAboutModal, cluste
}, []);

const details = getBrandingDetails();
const customBranding = (window as any).SERVER_FLAGS.customLogoURL || (window as any).SERVER_FLAGS.customProductName;

return (
<PfAboutModal
Expand All @@ -25,8 +26,8 @@ const AboutModal_: React.FC<AboutModalProps> = ({isOpen, closeAboutModal, cluste
brandImageSrc={details.logoImg}
brandImageAlt={details.productName}
>
<p>OpenShift is Red Hat&apos;s container application platform that allows developers to quickly develop, host,
and scale applications in a cloud environment.</p>
{!customBranding && <p>OpenShift is Red Hat&apos;s container application platform that allows developers to quickly develop, host,
and scale applications in a cloud environment.</p>}
<br />
<TextContent>
<TextList component="dl">
Expand Down
6 changes: 6 additions & 0 deletions frontend/public/components/masthead.jsx
Expand Up @@ -39,6 +39,12 @@ export const getBrandingDetails = () => {
logoImg = okdLogoImg;
productName = 'OKD';
}
if (window.SERVER_FLAGS.customLogoURL) {
logoImg = window.SERVER_FLAGS.customLogoURL;
}
if (window.SERVER_FLAGS.customProductName) {
productName = window.SERVER_FLAGS.customProductName;
}
return { logoImg, productName };
};

Expand Down
77 changes: 41 additions & 36 deletions frontend/public/index.html
Expand Up @@ -5,43 +5,48 @@
<base href="[[ .BasePath ]]">
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
[[ if eq .Branding "okd" ]]
<title>OKD</title>
<meta name="application-name" content="OKD">
[[ end ]]
[[ if eq .Branding "openshift" ]]
<title>Red Hat OpenShift</title>
<meta name="application-name" content="Red Hat OpenShift">
[[ end ]]
[[ if eq .Branding "ocp" ]]
<title>Red Hat OpenShift Container Platform</title>
<meta name="application-name" content="Red Hat OpenShift Container Platform">
[[ end ]]
[[ if eq .Branding "online" ]]
<title>Red Hat OpenShift Online</title>
<meta name="application-name" content="Red Hat OpenShift Online">
[[ end ]]
[[ if eq .Branding "dedicated" ]]
<title>Red Hat OpenShift Dedicated</title>
<meta name="application-name" content="Red Hat OpenShift Dedicated">
[[ end ]]
[[ if eq .Branding "azure" ]]
<title>Azure Red Hat OpenShift</title>
<meta name="application-name" content="Azure Red Hat OpenShift">
[[ end ]]

[[ if eq .Branding "okd" ]]
<link rel="shortcut icon" href="<%= require('./imgs/okd-favicon.png') %>">
<link rel="apple-touch-icon-precomposed" sizes="144x144" href="<%= require('./imgs/okd-apple-touch-icon-precomposed.png') %>">
<link rel="mask-icon" href="<%= require('./imgs/okd-mask-icon.svg') %>" color="#DB242F">
<meta name="msapplication-TileColor" content="#000000">
<meta name="msapplication-TileImage" content="<%= require('./imgs/okd-mstile-144x144.png') %>">
[[ if .CustomProductName ]]
<title>[[ .CustomProductName ]]</title>
<meta name="application-name" content="[[ .CustomProductName ]]">
[[ else ]]
<link rel="shortcut icon" href="<%= require('./imgs/openshift-favicon.png') %>">
<link rel="apple-touch-icon-precomposed" sizes="144x144" href="<%= require('./imgs/openshift-apple-touch-icon-precomposed.png') %>">
<link rel="mask-icon" href="<%= require('./imgs/openshift-mask-icon.svg') %>" color="#DB242F">
<meta name="msapplication-TileColor" content="#000000">
<meta name="msapplication-TileImage" content="<%= require('./imgs/openshift-mstile-144x144.png') %>">
[[ if eq .Branding "okd" ]]
<title>OKD</title>
<meta name="application-name" content="OKD">
[[ end ]]
[[ if eq .Branding "openshift" ]]
<title>Red Hat OpenShift</title>
<meta name="application-name" content="Red Hat OpenShift">
[[ end ]]
[[ if eq .Branding "ocp" ]]
<title>Red Hat OpenShift Container Platform</title>
<meta name="application-name" content="Red Hat OpenShift Container Platform">
[[ end ]]
[[ if eq .Branding "online" ]]
<title>Red Hat OpenShift Online</title>
<meta name="application-name" content="Red Hat OpenShift Online">
[[ end ]]
[[ if eq .Branding "dedicated" ]]
<title>Red Hat OpenShift Dedicated</title>
<meta name="application-name" content="Red Hat OpenShift Dedicated">
[[ end ]]
[[ if eq .Branding "azure" ]]
<title>Azure Red Hat OpenShift</title>
<meta name="application-name" content="Azure Red Hat OpenShift">
[[ end ]]

[[ if eq .Branding "okd" ]]
<link rel="shortcut icon" href="<%= require('./imgs/okd-favicon.png') %>">
<link rel="apple-touch-icon-precomposed" sizes="144x144" href="<%= require('./imgs/okd-apple-touch-icon-precomposed.png') %>">
<link rel="mask-icon" href="<%= require('./imgs/okd-mask-icon.svg') %>" color="#DB242F">
<meta name="msapplication-TileColor" content="#000000">
<meta name="msapplication-TileImage" content="<%= require('./imgs/okd-mstile-144x144.png') %>">
[[ else ]]
<link rel="shortcut icon" href="<%= require('./imgs/openshift-favicon.png') %>">
<link rel="apple-touch-icon-precomposed" sizes="144x144" href="<%= require('./imgs/openshift-apple-touch-icon-precomposed.png') %>">
<link rel="mask-icon" href="<%= require('./imgs/openshift-mask-icon.svg') %>" color="#DB242F">
<meta name="msapplication-TileColor" content="#000000">
<meta name="msapplication-TileImage" content="<%= require('./imgs/openshift-mstile-144x144.png') %>">
[[ end ]]
[[ end ]]

<meta name="description" content="">
Expand Down
3 changes: 2 additions & 1 deletion frontend/public/style/_overrides.scss
Expand Up @@ -264,11 +264,12 @@ tags-input .autocomplete .suggestion-item em {

.pf-c-about-modal-box {
&__brand {
align-items: flex-start; // so logos don't stretch vertically
min-width: 220px;
}

&__brand-image {
height: auto !important;
height: auto !important; // allow logo to be taller
}
}

Expand Down
30 changes: 24 additions & 6 deletions server/server.go
Expand Up @@ -32,6 +32,7 @@ const (
prometheusProxyEndpoint = "/api/prometheus"
prometheusTenancyProxyEndpoint = "/api/prometheus-tenancy"
alertManagerProxyEndpoint = "/api/alertmanager"
customLogoEndpoint = "/custom-logo"
)

var (
Expand All @@ -54,6 +55,8 @@ type jsGlobals struct {
PrometheusTenancyBaseURL string `json:"prometheusTenancyBaseURL"`
AlertManagerBaseURL string `json:"alertManagerBaseURL"`
Branding string `json:"branding"`
CustomProductName string `json:"customProductName"`
CustomLogoURL string `json:"customLogoURL"`
DocumentationBaseURL string `json:"documentationBaseURL"`
GoogleTagManagerID string `json:"googleTagManagerID"`
LoadTestFactor int `json:"loadTestFactor"`
Expand All @@ -72,6 +75,8 @@ type Server struct {
KubeAPIServerURL string
DocumentationBaseURL *url.URL
Branding string
CustomProductName string
CustomLogoFile string
GoogleTagManagerID string
LoadTestFactor int
DexClient api.DexClient
Expand Down Expand Up @@ -108,13 +113,15 @@ func (s *Server) HTTPHandler() http.Handler {

fn := func(loginInfo auth.LoginJSON, successURL string, w http.ResponseWriter) {
jsg := struct {
auth.LoginJSON `json:",inline"`
LoginSuccessURL string `json:"loginSuccessURL"`
Branding string `json:"branding"`
auth.LoginJSON `json:",inline"`
LoginSuccessURL string `json:"loginSuccessURL"`
Branding string `json:"branding"`
CustomProductName string `json:"customProductName"`
}{
LoginJSON: loginInfo,
LoginSuccessURL: successURL,
Branding: s.Branding,
LoginJSON: loginInfo,
LoginSuccessURL: successURL,
Branding: s.Branding,
CustomProductName: s.CustomProductName,
}

tpl := template.New(tokenizerPageTemplateName)
Expand Down Expand Up @@ -162,6 +169,12 @@ func (s *Server) HTTPHandler() http.Handler {
staticHandler := http.StripPrefix(proxy.SingleJoiningSlash(s.BaseURL.Path, "/static/"), http.FileServer(http.Dir(s.PublicDir)))
handle("/static/", gzipHandler(securityHeadersMiddleware(staticHandler)))

if s.CustomLogoFile != "" {
handleFunc(customLogoEndpoint, func(w http.ResponseWriter, r *http.Request) {
http.ServeFile(w, r, s.CustomLogoFile)
})
}

// Scope of Service Worker needs to be higher than the requests it is intercepting (https://stackoverflow.com/a/35780776/6909941)
handleFunc("/load-test.sw.js", func(w http.ResponseWriter, r *http.Request) {
http.ServeFile(w, r, path.Join(s.PublicDir, "load-test.sw.js"))
Expand Down Expand Up @@ -254,6 +267,7 @@ func (s *Server) indexHandler(w http.ResponseWriter, r *http.Request) {
LogoutRedirect: s.LogoutRedirect.String(),
KubeAPIServerURL: s.KubeAPIServerURL,
Branding: s.Branding,
CustomProductName: s.CustomProductName,
DocumentationBaseURL: s.DocumentationBaseURL.String(),
GoogleTagManagerID: s.GoogleTagManagerID,
LoadTestFactor: s.LoadTestFactor,
Expand All @@ -276,6 +290,10 @@ func (s *Server) indexHandler(w http.ResponseWriter, r *http.Request) {
s.Auther.SetCSRFCookie(s.BaseURL.Path, &w)
}

if s.CustomLogoFile != "" {
jsg.CustomLogoURL = proxy.SingleJoiningSlash(s.BaseURL.Path, customLogoEndpoint)
}

tpl := template.New(indexPageTemplateName)
tpl.Delims("[[", "]]")
tpls, err := tpl.ParseFiles(path.Join(s.PublicDir, indexPageTemplateName))
Expand Down

0 comments on commit 1fb3305

Please sign in to comment.