mirror/wakapi
1
0
Fork 0
mirror of https://github.com/muety/wakapi.git synced 2023-08-10 21:12:56 +03:00
Code Issues Projects Releases Wiki Activity

chore: minor changes to vibrant colors toggling

Browse Source
This commit is contained in:
Ferdinand Mütsch
2022-04-24 09:26:04 +02:00
parent 9048a8eb7a
commit 30a65b4de9
4 changed files with 28 additions and 29 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
static/assets/js/components/settings.js
View File

@ -2,7 +2,7 @@ PetiteVue.createApp({
//$delimiters: ['${', '}'], // https://github.com/vuejs/petite-vue/pull/100
activeTab: defaultTab,
selectedTimezone: userTimeZone,
vibrantColorEnabled: JSON.parse(localStorage.getItem('vibrant-color') || false),
vibrantColorsEnabled: JSON.parse(localStorage.getItem('wakapi_vibrant_colors') || false),
get tzOptions() {
return [defaultTzOption, ...tzs.sort().map(tz => ({ value: tz, text: tz }))]
},
@ -32,12 +32,8 @@ PetiteVue.createApp({
document.querySelector('#form-delete-user').submit()
}
},
toggleVibrantColor() {
let key = 'vibrant-color';
let value = !(JSON.parse(localStorage.getItem(key) || false));
localStorage.setItem(key, value);
this.vibrantColorEnabled = value;
return value;
onToggleVibrantColors() {
localStorage.setItem('wakapi_vibrant_colors', this.vibrantColorsEnabled)
},
mounted() {
this.updateTab()

26
static/assets/js/summary.js
View File

@ -87,7 +87,7 @@ function draw(subselection) {
.filter((c, i) => shouldUpdate(i))
.forEach(c => c.destroy())
let vibrantColor = JSON.parse(window.localStorage.getItem('vibrant-color') || false);
const vibrantColors = JSON.parse(window.localStorage.getItem('wakapi_vibrant_colors') || false);
let projectChart = projectsCanvas && !projectsCanvas.classList.contains('hidden') && shouldUpdate(0)
? new Chart(projectsCanvas.getContext('2d'), {
@ -99,11 +99,11 @@ function draw(subselection) {
.slice(0, Math.min(showTopN[0], wakapiData.projects.length))
.map(p => parseInt(p.total)),
backgroundColor: wakapiData.projects.map((p, i) => {
const c = hexToRgb(vibrantColor ? getRandomColor(p.key) : getColor(p.key, i % baseColors.length))
const c = hexToRgb(vibrantColors ? getRandomColor(p.key) : getColor(p.key, i % baseColors.length))
return `rgba(${c.r}, ${c.g}, ${c.b}, 1)`
}),
hoverBackgroundColor: wakapiData.projects.map((p, i) => {
const c = hexToRgb(vibrantColor ? getRandomColor(p.key) : getColor(p.key, i % baseColors.length))
const c = hexToRgb(vibrantColors ? getRandomColor(p.key) : getColor(p.key, i % baseColors.length))
return `rgba(${c.r}, ${c.g}, ${c.b}, 0.8)`
}),
}],
@ -154,11 +154,11 @@ function draw(subselection) {
.slice(0, Math.min(showTopN[1], wakapiData.operatingSystems.length))
.map(p => parseInt(p.total)),
backgroundColor: wakapiData.operatingSystems.map((p, i) => {
const c = hexToRgb(vibrantColor ? (osColors[p.key.toLowerCase()] || getRandomColor(p.key)) : getColor(p.key, i))
const c = hexToRgb(vibrantColors ? (osColors[p.key.toLowerCase()] || getRandomColor(p.key)) : getColor(p.key, i))
return `rgba(${c.r}, ${c.g}, ${c.b}, 1)`
}),
hoverBackgroundColor: wakapiData.operatingSystems.map((p, i) => {
const c = hexToRgb(vibrantColor ? (osColors[p.key.toLowerCase()] || getRandomColor(p.key)) : getColor(p.key, i))
const c = hexToRgb(vibrantColors ? (osColors[p.key.toLowerCase()] || getRandomColor(p.key)) : getColor(p.key, i))
return `rgba(${c.r}, ${c.g}, ${c.b}, 0.8)`
}),
borderWidth: 0
@ -191,11 +191,11 @@ function draw(subselection) {
.slice(0, Math.min(showTopN[2], wakapiData.editors.length))
.map(p => parseInt(p.total)),
backgroundColor: wakapiData.editors.map((p, i) => {
const c = hexToRgb(vibrantColor ? (editorColors[p.key.toLowerCase()] || getRandomColor(p.key)) : getColor(p.key, i))
const c = hexToRgb(vibrantColors ? (editorColors[p.key.toLowerCase()] || getRandomColor(p.key)) : getColor(p.key, i))
return `rgba(${c.r}, ${c.g}, ${c.b}, 1)`
}),
hoverBackgroundColor: wakapiData.editors.map((p, i) => {
const c = hexToRgb(vibrantColor ? (editorColors[p.key.toLowerCase()] || getRandomColor(p.key)) : getColor(p.key, i))
const c = hexToRgb(vibrantColors ? (editorColors[p.key.toLowerCase()] || getRandomColor(p.key)) : getColor(p.key, i))
return `rgba(${c.r}, ${c.g}, ${c.b}, 0.8)`
}),
borderWidth: 0
@ -268,11 +268,11 @@ function draw(subselection) {
.slice(0, Math.min(showTopN[4], wakapiData.machines.length))
.map(p => parseInt(p.total)),
backgroundColor: wakapiData.machines.map((p, i) => {
const c = hexToRgb(vibrantColor ? getRandomColor(p.key) : getColor(p.key, i))
const c = hexToRgb(vibrantColors ? getRandomColor(p.key) : getColor(p.key, i))
return `rgba(${c.r}, ${c.g}, ${c.b}, 1)`
}),
hoverBackgroundColor: wakapiData.machines.map((p, i) => {
const c = hexToRgb(vibrantColor ? getRandomColor(p.key) : getColor(p.key, i))
const c = hexToRgb(vibrantColors ? getRandomColor(p.key) : getColor(p.key, i))
return `rgba(${c.r}, ${c.g}, ${c.b}, 0.8)`
}),
borderWidth: 0
@ -305,11 +305,11 @@ function draw(subselection) {
.slice(0, Math.min(showTopN[5], wakapiData.labels.length))
.map(p => parseInt(p.total)),
backgroundColor: wakapiData.labels.map((p, i) => {
const c = hexToRgb(vibrantColor ? getRandomColor(p.key) : getColor(p.key, i))
const c = hexToRgb(vibrantColors ? getRandomColor(p.key) : getColor(p.key, i))
return `rgba(${c.r}, ${c.g}, ${c.b}, 1)`
}),
hoverBackgroundColor: wakapiData.labels.map((p, i) => {
const c = hexToRgb(vibrantColor ? getRandomColor(p.key) : getColor(p.key, i))
const c = hexToRgb(vibrantColors ? getRandomColor(p.key) : getColor(p.key, i))
return `rgba(${c.r}, ${c.g}, ${c.b}, 0.8)`
}),
borderWidth: 0
@ -342,11 +342,11 @@ function draw(subselection) {
.slice(0, Math.min(showTopN[6], wakapiData.branches.length))
.map(p => parseInt(p.total)),
backgroundColor: wakapiData.branches.map((p, i) => {
const c = hexToRgb(vibrantColor ? getRandomColor(p.key) : getColor(p.key, i % baseColors.length))
const c = hexToRgb(vibrantColors ? getRandomColor(p.key) : getColor(p.key, i % baseColors.length))
return `rgba(${c.r}, ${c.g}, ${c.b}, 1)`
}),
hoverBackgroundColor: wakapiData.branches.map((p, i) => {
const c = hexToRgb(vibrantColor ? getRandomColor(p.key) : getColor(p.key, i % baseColors.length))
const c = hexToRgb(vibrantColors ? getRandomColor(p.key) : getColor(p.key, i % baseColors.length))
return `rgba(${c.r}, ${c.g}, ${c.b}, 0.8)`
}),
}],