stephen/donsol-js
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Add Settings panel with a button to change themes

Browse source 
Only 2 themes besides the default are implemented for now.
More to come!
This commit is contained in:
Stephen Jianu 2023-12-31 16:29:17 -06:00
commit 729c71fac0
6 changed files with 74 additions and 8 deletions
Download patch file Download diff file Expand all files Collapse all files

26
sources/scripts/donsol.js
View file

@ -7,7 +7,7 @@ const SPADE = 'spade'
const JOKER = 'joker'
function Donsol () {
const defaultTheme = {
this.defaultTheme = {
background: '#000000',
f_high: '#000000',
f_med: '#a93232',
@ -18,8 +18,30 @@ function Donsol () {
b_low: '#333333',
b_inv: '#a93232'
}
this.gameboyTheme = {
background: '#9BBC0F',
f_high: '#0F380F',
f_med: '#0F380F',
f_low: '#306230',
f_inv: '#9BBC0F',
b_high: '#8BAC0F',
b_med: '#8BAC0F',
b_low: '#9BBC0F',
b_inv: '#0F380F'
}
this.nightowlTheme = {
background: '#011627',
f_high: '#7fdbca',
f_med: '#82aaff',
f_low: '#c792ea',
f_inv: '#637777',
b_high: '#5f7e97',
b_med: '#456075',
b_low: '#2f4759',
b_inv: '#7fdbca'
}
this.theme = new Theme(defaultTheme)
this.theme = new Theme(this.defaultTheme)
this.deck = new Deck()
this.board = new Board()

21
sources/scripts/player.js
View file

@ -5,6 +5,7 @@ function Player () {
this.health = new Gage_Health('Health', 21, '#ff0000')
this.shield = new Gage_Shield('Shield', 0, '#72dec2')
this.experience = new Gage('Experience', 0, '#ffffff')
this.settings = new Settings()
this.can_drink = true
this.has_escaped = false
@ -33,11 +34,12 @@ function Player () {
}
this.install = function () {
this.element.appendChild(this.settings.install())
this.element.appendChild(this.experience.install())
this.element.appendChild(this.shield.install())
this.element.appendChild(this.health.install())
this.escape_button.setAttribute('class', 'escape')
this.escape_button.setAttribute('class', 'escape button')
this.escape_button.innerHTML = 'Escape'
this.element.appendChild(this.escape_button)
this.timeline_element.setAttribute('class', 'timeline')
@ -145,6 +147,23 @@ function Player () {
donsol.timeline.add_event('Escaped the room!')
}
this.change_theme = function (theme_value) {
let new_theme = ''
if (theme_value.localeCompare('theme') === 0) {
new_theme = donsol.defaultTheme
}
if (theme_value.localeCompare('gameboy') === 0) {
new_theme = donsol.gameboyTheme
}
if (theme_value.localeCompare('nightowl') === 0) {
new_theme = donsol.nightowlTheme
}
donsol.theme = new Theme(new_theme)
donsol.theme.load(new_theme)
donsol.theme.install(document.body)
donsol.theme.start()
}
this.update = function () {
if (this.health.value < 1) {
this.escape_button.innerHTML = 'Restart'

22
sources/scripts/settings.js Normal file
View file

@ -0,0 +1,22 @@
'use strict'
function Settings () {
this.element = null
this.theme_button = null
this.install = function () {
this.element = document.createElement('div')
this.element.setAttribute('class', 'settings')
this.theme_button = document.createElement('select')
this.theme_button.setAttribute('class', 'theme button')
this.theme_button.innerHTML = '<option value=\"theme\">Theme (default)</option>'
this.theme_button.innerHTML += '<option value=\"gameboy\">Game Boy</option>'
this.theme_button.innerHTML += '<option value=\"nightowl\">Night Owl</option>'
this.theme_button.addEventListener('mousedown', () => { donsol.player.change_theme(this.theme_button.value) })
this.element.appendChild(this.theme_button)
return this.element
}
}