const themeMod = require('../utils/theme')
// Resolve the active theme synchronously at module load so the first paint
// already has the correct CSS variables — avoids a flash of the default theme.
const _initialTheme = themeMod.getCurrentTheme()
const _initialThemeStyle = themeMod.getThemeStyle(_initialTheme)
// SVG icons as data URIs. We use two variants per icon:
// - *Fill*: solid filled (active state, theme color baked in at module load)
// - *Line*: outlined (inactive state, neutral gray)
// Themes are 5 fixed colors so we can bake the active color in at module init.
// If the user changes theme, the component re-renders via pageLifetimes.show.
// Solid (active) color from current theme
const _activeColor = _initialTheme.primary
// Inactive color
const _inactiveColor = '#999999'
const _svg = (path, fill) =>
'data:image/svg+xml,' + encodeURIComponent(
''
)
// 24x24 Material-style paths
const PATH_HOME = ''
const PATH_HOME_LINE = ''
const PATH_CALENDAR = ''
const PATH_CALENDAR_LINE = ''
const PATH_RANK = ''
const PATH_RANK_LINE = ''
const PATH_SETTINGS = ''
const PATH_SETTINGS_LINE = ''
const _buildIcons = (activeHex) => {
const a = activeHex
return {
home: _svg(PATH_HOME_LINE, _inactiveColor),
homeFill: _svg(PATH_HOME, a),
calendar: _svg(PATH_CALENDAR_LINE, _inactiveColor),
calendarFill: _svg(PATH_CALENDAR, a),
rank: _svg(PATH_RANK_LINE, _inactiveColor),
rankFill: _svg(PATH_RANK, a),
settings: _svg(PATH_SETTINGS_LINE, _inactiveColor),
settingsFill: _svg(PATH_SETTINGS, a)
}
}
Component({
data: {
selected: 0,
theme: _initialTheme,
themeStyle: _initialThemeStyle,
svgIcons: _buildIcons(_initialTheme.primary)
},
lifetimes: {
attached() {
themeMod.applyThemeToPage(this)
}
},
pageLifetimes: {
show() {
themeMod.applyThemeToPage(this)
const theme = themeMod.getCurrentTheme()
this.setData({ svgIcons: _buildIcons(theme.primary) })
}
},
methods: {
switchTab(e) {
const index = e.currentTarget.dataset.index
const pages = [
'/pages/index/index',
'/pages/records/records',
'/pages/leaderboard/leaderboard',
'/pages/settings/settings'
]
if (index === this.data.selected) return
wx.switchTab({ url: pages[index] })
}
}
})