- Overrides app name to Biibaye via translations - Sets window title to Biibaye - Delivery System - Injects primary color #FF4500 and dark bg #343538 - Replaces favicons with custom assets (placeholder files) - Includes site.webmanifest with Biibaye config - Minimal Ember engine to satisfy Fleetbase extension system
87 lines
2.7 KiB
JavaScript
87 lines
2.7 KiB
JavaScript
export default {
|
|
setupExtension(appInstance, universe) {
|
|
const hookService = universe.getService('hook');
|
|
|
|
setDocumentTitle();
|
|
injectBrandStyles();
|
|
replaceFavicon();
|
|
|
|
hookService.registerHook('application:before-model', () => {
|
|
setDocumentTitle();
|
|
replaceFavicon();
|
|
});
|
|
},
|
|
};
|
|
|
|
function setDocumentTitle() {
|
|
document.title = 'Biibaye - Delivery System';
|
|
}
|
|
|
|
function injectBrandStyles() {
|
|
if (document.getElementById('biibaye-brand-styles')) {
|
|
return;
|
|
}
|
|
|
|
const style = document.createElement('style');
|
|
style.id = 'biibaye-brand-styles';
|
|
style.textContent = `
|
|
:root {
|
|
--primary: #FF4500;
|
|
--primary-hover: #e03d00;
|
|
}
|
|
body[data-theme="dark"] {
|
|
background-color: #343538 !important;
|
|
}
|
|
`;
|
|
document.head.appendChild(style);
|
|
}
|
|
|
|
function replaceFavicon() {
|
|
removeExistingFavicons();
|
|
addBiibayeFavicon();
|
|
updateMetaTags();
|
|
}
|
|
|
|
function removeExistingFavicons() {
|
|
document.querySelectorAll('link[rel*="icon"], link[rel="apple-touch-icon"], link[rel="mask-icon"]').forEach((el) => el.remove());
|
|
document.querySelectorAll('meta[name="msapplication-TileColor"], meta[name="theme-color"]').forEach((el) => el.remove());
|
|
const manifestLink = document.querySelector('link[rel="manifest"]');
|
|
if (manifestLink) {
|
|
manifestLink.href = '/favicon/site.webmanifest';
|
|
}
|
|
}
|
|
|
|
function addBiibayeFavicon() {
|
|
const faviconPath = '/favicon';
|
|
const links = [
|
|
{ rel: 'icon', type: 'image/png', sizes: '32x32', href: `${faviconPath}/favicon-32x32.png` },
|
|
{ rel: 'icon', type: 'image/png', sizes: '16x16', href: `${faviconPath}/favicon-16x16.png` },
|
|
{ rel: 'apple-touch-icon', sizes: '180x180', href: `${faviconPath}/apple-touch-icon.png` },
|
|
{ rel: 'icon', type: 'image/png', sizes: '192x192', href: `${faviconPath}/android-chrome-192x192.png` },
|
|
{ rel: 'icon', type: 'image/png', sizes: '256x256', href: `${faviconPath}/android-chrome-256x256.png` },
|
|
];
|
|
|
|
links.forEach(({ rel, type, sizes, href }) => {
|
|
const link = document.createElement('link');
|
|
link.rel = rel;
|
|
if (type) link.type = type;
|
|
if (sizes) link.sizes = sizes;
|
|
link.href = href;
|
|
document.head.appendChild(link);
|
|
});
|
|
}
|
|
|
|
function updateMetaTags() {
|
|
const metaTags = [
|
|
{ name: 'msapplication-TileColor', content: '#FF4500' },
|
|
{ name: 'theme-color', content: '#FF4500' },
|
|
];
|
|
|
|
metaTags.forEach(({ name, content }) => {
|
|
const meta = document.createElement('meta');
|
|
meta.name = name;
|
|
meta.content = content;
|
|
document.head.appendChild(meta);
|
|
});
|
|
}
|