Files
database-pertani-web/public/assets/js/config.js
T
2026-10-16 10:29:42 +07:00

163 lines
6.0 KiB
JavaScript

/**
* Config
* -------------------------------------------------------------------------------------
* ! IMPORTANT: Make sure you clear the browser local storage In order to see the config changes in the template.
* ! To clear local storage: (https://www.leadshook.com/help/how-to-clear-local-storage-in-google-chrome-browser/).
*/
'use strict';
/* JS global variables
!Please use the hex color code (#000) here. Don't use rgba(), hsl(), etc
*/
window.config = {
// global color variables for charts except chartjs
colors: {
primary: window.Helpers.getCssVar('primary'),
secondary: window.Helpers.getCssVar('secondary'),
success: window.Helpers.getCssVar('success'),
info: window.Helpers.getCssVar('info'),
warning: window.Helpers.getCssVar('warning'),
danger: window.Helpers.getCssVar('danger'),
dark: window.Helpers.getCssVar('dark'),
black: window.Helpers.getCssVar('pure-black'),
white: window.Helpers.getCssVar('white'),
cardColor: window.Helpers.getCssVar('paper-bg'),
bodyBg: window.Helpers.getCssVar('body-bg'),
bodyColor: window.Helpers.getCssVar('body-color'),
headingColor: window.Helpers.getCssVar('heading-color'),
textMuted: window.Helpers.getCssVar('secondary-color'),
borderColor: window.Helpers.getCssVar('border-color')
},
colors_label: {
primary: window.Helpers.getCssVar('primary-bg-subtle'),
secondary: window.Helpers.getCssVar('secondary-bg-subtle'),
success: window.Helpers.getCssVar('success-bg-subtle'),
info: window.Helpers.getCssVar('info-bg-subtle'),
warning: window.Helpers.getCssVar('warning-bg-subtle'),
danger: window.Helpers.getCssVar('danger-bg-subtle'),
dark: window.Helpers.getCssVar('dark-bg-subtle')
},
chartColors: {
series: ['#9D8EF0', '#6FD68F', '#FFB46F', '#5FC7D6', '#F47C86', '#9EA6B0', '#65D8BD', '#63C7E0'],
semantic: {
primary: '#9D8EF0',
secondary: '#9EA6B0',
success: '#6FD68F',
info: '#5FC7D6',
warning: '#FFB46F',
danger: '#F47C86',
purple: '#9D8EF0',
teal: '#65D8BD',
pink: '#F47C86',
gray: '#9EA6B0'
},
text: {
primary: '#7367F0',
secondary: '#808390',
success: '#28C76F',
info: '#00BAD1',
warning: '#FF9F43',
danger: '#FF4C51',
purple: '#7367F0',
teal: '#20C997',
pink: '#FF4C51',
gray: '#808390'
},
categories: {
coffee: '#6FD68F',
vanilla: '#FFB46F',
cacao: '#9D8EF0',
candlenut: '#9EA6B0',
shade: '#65D8BD',
policyPurple: '#9D8EF0',
policyPink: '#F47C86',
marketGreen: '#6FD68F',
marketRed: '#F47C86',
marketBlue: '#5FC7D6'
},
grid: '#ECF0F6'
},
fontFamily: window.Helpers.getCssVar('font-family-base'),
enableMenuLocalStorage: true // Enable menu state with local storage support
};
// Choose the label color with the higher contrast against each chart slice.
window.config.chartTextColor = function (color) {
let hex = String(color || '').trim().replace(/^#/, '');
if (/^[0-9a-f]{3}$/i.test(hex)) {
hex = hex.split('').map(value => value + value).join('');
}
if (!/^[0-9a-f]{6}$/i.test(hex)) return '#212529';
const luminance = function (value) {
const channels = value.match(/../g).map(channel => {
const srgb = parseInt(channel, 16) / 255;
return srgb <= 0.04045 ? srgb / 12.92 : Math.pow((srgb + 0.055) / 1.055, 2.4);
});
return channels[0] * 0.2126 + channels[1] * 0.7152 + channels[2] * 0.0722;
};
const background = luminance(hex);
const dark = luminance('212529');
const darkContrast = (Math.max(background, dark) + 0.05) / (Math.min(background, dark) + 0.05);
const lightContrast = 1.05 / (background + 0.05);
return darkContrast >= lightContrast ? '#212529' : '#ffffff';
};
window.assetsPath = document.documentElement.getAttribute('data-assets-path');
window.templateName = document.documentElement.getAttribute('data-template');
/**
* TemplateCustomizer
* ! You must use(include) template-customizer.js to use TemplateCustomizer settings
* -----------------------------------------------------------------------------------------------
*/
/**
* TemplateCustomizer settings
* -------------------------------------------------------------------------------------
* displayCustomizer: true(Show customizer), false(Hide customizer)
* lang: To set default language, Add more languages and set default. Fallback language is 'en'
* defaultPrimaryColor: '#7367F0' | Set default primary color
* defaultSkin: 0(Default), 1(Bordered)
* defaultTheme: 'light', 'dark', 'system'
* defaultSemiDark: true, false (For dark menu only)
* defaultContentLayout: 'compact', 'wide' (compact=container-xxl, wide=container-fluid)
* defaultHeaderType: 'static', 'fixed' (for horizontal layout only)
* defaultMenuCollapsed: true, false (For vertical layout only)
* defaultNavbarType: 'sticky', 'static', 'hidden' (For vertical layout only)
* defaultTextDir: 'ltr', 'rtl' (Direction)
* defaultFooterFixed: true, false (For vertical layout only)
* defaultShowDropdownOnHover : true, false (for horizontal layout only)
* controls: [ 'color', 'theme', 'skins', 'semiDark', 'layoutCollapsed', 'layoutNavbarOptions', 'headerType', 'contentLayout', 'rtl' ] | Show/Hide customizer controls
*/
if (typeof TemplateCustomizer !== 'undefined') {
window.templateCustomizer = new TemplateCustomizer({
displayCustomizer: false,
lang: localStorage.getItem('templateCustomizer-' + templateName + '--Lang') || 'en', // Set default language here
defaultPrimaryColor: '#2a7233',
// defaultSkin: 1,
// defaultTheme: 'system',
// defaultSemiDark: true,
defaultContentLayout: 'wide',
// defaultHeaderType: 'static',
// defaultMenuCollapsed: true,
// defaultNavbarType: 'static',
// defaultTextDir: 'rtl',
// defaultFooterFixed: false,
// defaultShowDropdownOnHover: false,
controls: [
'color',
'theme',
'skins',
'semiDark',
'layoutCollapsed',
'layoutNavbarOptions',
'headerType',
'contentLayout',
'rtl'
]
});
}