icon and image for volume buttons
This commit is contained in:
112
controldeck.py
112
controldeck.py
@@ -70,13 +70,37 @@ def config_load():
|
|||||||
#print(config.sections())
|
#print(config.sections())
|
||||||
return config
|
return config
|
||||||
|
|
||||||
|
def svg_element(image):
|
||||||
|
svg = ''
|
||||||
|
if path.isfile(path.expanduser(image)):
|
||||||
|
try:
|
||||||
|
with open(path.expanduser(image)) as f:
|
||||||
|
svg = f.read()
|
||||||
|
except Exception as e:
|
||||||
|
print(f"{e}")
|
||||||
|
try: # svg with custom tags, as inkscape is using, cannot be interpreted
|
||||||
|
_svg = parse_html(svg)
|
||||||
|
#print(dir(tmp_svg)) # add_attribute
|
||||||
|
#print(tmp2.attributes)
|
||||||
|
# set width and height to viewBox to update width and height for scaling
|
||||||
|
w = _svg.width if hasattr(_svg, 'width') else "64"
|
||||||
|
h = _svg.height if hasattr(_svg, 'height') else "64"
|
||||||
|
vb = _svg.viewBox if hasattr(_svg, 'viewBox') else '0 0 ' + w + ' ' + h
|
||||||
|
_svg.viewBox = vb
|
||||||
|
_svg.width = 64
|
||||||
|
_svg.height = 64
|
||||||
|
except Exception as e:
|
||||||
|
print(f"[Error SVG]: {e}")
|
||||||
|
_svg = None
|
||||||
|
return _svg
|
||||||
|
|
||||||
class Button(Div):
|
class Button(Div):
|
||||||
btype = None
|
btype = None
|
||||||
command = None
|
command = None
|
||||||
color_bg = ''
|
color_bg = ''
|
||||||
color_fg = ''
|
color_fg = ''
|
||||||
icon = ''
|
icon = ''
|
||||||
icon_image = ''
|
image = ''
|
||||||
def __init__(self, **kwargs):
|
def __init__(self, **kwargs):
|
||||||
super().__init__(**kwargs)
|
super().__init__(**kwargs)
|
||||||
#print(dir(self))
|
#print(dir(self))
|
||||||
@@ -106,29 +130,11 @@ class Button(Div):
|
|||||||
process(self.command, False)
|
process(self.command, False)
|
||||||
self.on('click', click)
|
self.on('click', click)
|
||||||
|
|
||||||
if self.icon_image:
|
if self.image:
|
||||||
self.text = ''
|
self.text = ''
|
||||||
svg = ''
|
tmp = svg_element(self.image)
|
||||||
if path.isfile(path.expanduser(self.icon_image)):
|
if tmp is not None:
|
||||||
try:
|
self.add(tmp)
|
||||||
with open(path.expanduser(self.icon_image)) as f:
|
|
||||||
svg = f.read()
|
|
||||||
except Exception as e:
|
|
||||||
print(f"{e}")
|
|
||||||
try: # svg with custom tags, as inkscape is using, cannot be interpreted
|
|
||||||
_svg = parse_html(svg)
|
|
||||||
#print(dir(tmp_svg)) # add_attribute
|
|
||||||
#print(tmp2.attributes)
|
|
||||||
# set width and height to viewBox to update width and height for scaling
|
|
||||||
w = _svg.width if hasattr(_svg, 'width') else "64"
|
|
||||||
h = _svg.height if hasattr(_svg, 'height') else "64"
|
|
||||||
vb = _svg.viewBox if hasattr(_svg, 'viewBox') else '0 0 ' + w + ' ' + h
|
|
||||||
_svg.viewBox = vb
|
|
||||||
_svg.width = 64
|
|
||||||
_svg.height = 64
|
|
||||||
self.add(_svg)
|
|
||||||
except Exception as e:
|
|
||||||
print(f"[Error SVG]: {e}")
|
|
||||||
|
|
||||||
elif self.icon:
|
elif self.icon:
|
||||||
self.inner_html = f"<i class='fa-2x {self.icon}'><i>"
|
self.inner_html = f"<i class='fa-2x {self.icon}'><i>"
|
||||||
@@ -138,17 +144,51 @@ class ButtonSound(Div):
|
|||||||
name = None
|
name = None
|
||||||
description = None
|
description = None
|
||||||
volume = None
|
volume = None
|
||||||
button_style = None
|
decrease_icon = ''
|
||||||
|
decrease_image = ''
|
||||||
|
increase_icon = ''
|
||||||
|
increase_image = ''
|
||||||
|
mute_icon = ''
|
||||||
|
mute_image = ''
|
||||||
|
|
||||||
def __init__(self, **kwargs):
|
def __init__(self, **kwargs):
|
||||||
super().__init__(**kwargs)
|
super().__init__(**kwargs)
|
||||||
self.classes = "grid-rows-2"
|
self.classes = "grid-rows-2"
|
||||||
self.div = Div(classes="flex")
|
self.div = Div(classes="flex")
|
||||||
Button(inner_html='- 5%', click=self.decrease, a=self.div)
|
|
||||||
Button(inner_html='+ 5%', click=self.increase, a=self.div)
|
if self.decrease_image:
|
||||||
Button(inner_html='toggle mute', click=self.mute, a=self.div)
|
tmp = svg_element(self.decrease_image)
|
||||||
|
if tmp is not None:
|
||||||
|
Button(click=self.decrease, a=self.div).add(tmp)
|
||||||
|
elif self.decrease_icon:
|
||||||
|
Button(inner_html=f"<i class='fa-2x {self.decrease_icon}'><i>",
|
||||||
|
click=self.decrease, a=self.div)
|
||||||
|
else:
|
||||||
|
Button(inner_html='- 5%', click=self.decrease, a=self.div)
|
||||||
|
|
||||||
|
if self.increase_image:
|
||||||
|
tmp = svg_element(self.increase_image)
|
||||||
|
if tmp is not None:
|
||||||
|
Button(click=self.increase, a=self.div).add(tmp)
|
||||||
|
elif self.increase_icon:
|
||||||
|
Button(inner_html=f"<i class='fa-2x {self.increase_icon}'><i>",
|
||||||
|
click=self.increase, a=self.div)
|
||||||
|
else:
|
||||||
|
Button(inner_html='+ 5%', click=self.increase, a=self.div)
|
||||||
|
|
||||||
|
if self.mute_image:
|
||||||
|
tmp = svg_element(self.mute_image)
|
||||||
|
if tmp is not None:
|
||||||
|
Button(click=self.mute, a=self.div).add(tmp)
|
||||||
|
elif self.mute_icon:
|
||||||
|
Button(inner_html=f"<i class='fa-2x {self.mute_icon}'><i>",
|
||||||
|
click=self.mute, a=self.div)
|
||||||
|
else:
|
||||||
|
Button(inner_html='toggle mute', click=self.mute, a=self.div)
|
||||||
|
|
||||||
self.add(self.div)
|
self.add(self.div)
|
||||||
self.volume = Div(text=f"{self.description}: {volume(self.name)}", classes="text-gray-600 text-center -mt-2", a=self)
|
self.volume = Div(text=f"{self.description}: {volume(self.name)}",
|
||||||
|
classes="text-gray-600 text-center -mt-2", a=self)
|
||||||
|
|
||||||
async def decrease(self, msg):
|
async def decrease(self, msg):
|
||||||
self.volume.text = f'{self.description}: {volume_decrease(self.name)}'
|
self.volume.text = f'{self.description}: {volume_decrease(self.name)}'
|
||||||
@@ -199,7 +239,11 @@ def application(request):
|
|||||||
'color-fg': config.get(i, 'color-fg', fallback=''),
|
'color-fg': config.get(i, 'color-fg', fallback=''),
|
||||||
'name': config.get(i, 'name', fallback=None),
|
'name': config.get(i, 'name', fallback=None),
|
||||||
'decrease-icon': config.get('default', 'volume-decrease-icon', fallback=''),
|
'decrease-icon': config.get('default', 'volume-decrease-icon', fallback=''),
|
||||||
'decrease-icon-image': config.get('default', 'volume-decrease-icon-image', fallback='')}]
|
'decrease-image': config.get('default', 'volume-decrease-image', fallback=''),
|
||||||
|
'increase-icon': config.get('default', 'volume-increase-icon', fallback=''),
|
||||||
|
'increase-image': config.get('default', 'volume-increase-image', fallback=''),
|
||||||
|
'mute-icon': config.get('default', 'volume-mute-icon', fallback=''),
|
||||||
|
'mute-image': config.get('default', 'volume-mute-image', fallback='')}]
|
||||||
try:
|
try:
|
||||||
volume_dict[id] += tmp
|
volume_dict[id] += tmp
|
||||||
except KeyError:
|
except KeyError:
|
||||||
@@ -213,7 +257,7 @@ def application(request):
|
|||||||
'color-fg': config.get(i, 'color-fg', fallback=''),
|
'color-fg': config.get(i, 'color-fg', fallback=''),
|
||||||
'command': config.get(i, 'command', fallback=None),
|
'command': config.get(i, 'command', fallback=None),
|
||||||
'icon': config.get(i, 'icon', fallback=''),
|
'icon': config.get(i, 'icon', fallback=''),
|
||||||
'icon-image': config.get(i, 'icon-image', fallback='')}]
|
'image': config.get(i, 'image', fallback='')}]
|
||||||
try:
|
try:
|
||||||
button_dict[id] += tmp
|
button_dict[id] += tmp
|
||||||
except KeyError:
|
except KeyError:
|
||||||
@@ -227,7 +271,11 @@ def application(request):
|
|||||||
color_bg = f"background-color:{j['color-bg']};" if ishexcolor(j['color-bg']) else ''
|
color_bg = f"background-color:{j['color-bg']};" if ishexcolor(j['color-bg']) else ''
|
||||||
color_fg = f"color:{j['color-fg']};" if ishexcolor(j['color-fg']) else ''
|
color_fg = f"color:{j['color-fg']};" if ishexcolor(j['color-fg']) else ''
|
||||||
ButtonSound(name=j['name'], description=j['description'],
|
ButtonSound(name=j['name'], description=j['description'],
|
||||||
button_style = color_bg + color_fg, a=eval(var))
|
color_bg=j['color-bg'], color_fg=j['color-fg'],
|
||||||
|
decrease_icon=j['decrease-icon'], decrease_image=j['decrease-image'],
|
||||||
|
increase_icon=j['increase-icon'], increase_image=j['increase-image'],
|
||||||
|
mute_icon=j['mute-icon'], mute_image=j['mute-image'],
|
||||||
|
a=eval(var))
|
||||||
for i in button_dict:
|
for i in button_dict:
|
||||||
var = var_prefix+i
|
var = var_prefix+i
|
||||||
for j in button_dict[i]:
|
for j in button_dict[i]:
|
||||||
@@ -235,7 +283,7 @@ def application(request):
|
|||||||
vars()[var] = Div(classes="flex flex-wrap", a=wp)
|
vars()[var] = Div(classes="flex flex-wrap", a=wp)
|
||||||
Button(text=j['text'], btype=j['type'], command=j['command'],
|
Button(text=j['text'], btype=j['type'], command=j['command'],
|
||||||
color_bg=j['color-bg'], color_fg=j['color-fg'],
|
color_bg=j['color-bg'], color_fg=j['color-fg'],
|
||||||
icon=j['icon'], icon_image=j['icon-image'], a=eval(var))
|
icon=j['icon'], image=j['image'], a=eval(var))
|
||||||
|
|
||||||
if not wp.components:
|
if not wp.components:
|
||||||
# config not found or empty, therefore insert an empty div to not get an error
|
# config not found or empty, therefore insert an empty div to not get an error
|
||||||
|
|||||||
@@ -22,19 +22,30 @@
|
|||||||
# icon = Font Awesome name
|
# icon = Font Awesome name
|
||||||
# icon-image = path to svg file
|
# icon-image = path to svg file
|
||||||
#
|
#
|
||||||
# : N. optional group/row specification
|
# : N. optional group/row specification
|
||||||
# : NAME id, name of the button
|
# : NAME id, name of the button
|
||||||
# : color-bg background color
|
# : color-bg background color
|
||||||
# : color-bg forground color
|
# : color-bg forground color
|
||||||
# : command command(s) to run
|
# : command command(s) to run
|
||||||
# : icon use icon instead of NAME (Font Awesome), e.g.: fas fa-play
|
# : icon use icon instead of NAME (Font Awesome), e.g.: fas fa-play
|
||||||
# : icon-image absolute path to svg file
|
# : image absolute path to svg file
|
||||||
#
|
#
|
||||||
# [N.empty.NAME]
|
# [N.empty.NAME]
|
||||||
#
|
#
|
||||||
# : N. optional number to specify group/row
|
# : N. optional number to specify group/row
|
||||||
# : NAME id, name of the button
|
# : NAME id, name of the button
|
||||||
|
|
||||||
|
[default]
|
||||||
|
# volume-decrease-icon = fas fa-volume-down
|
||||||
|
# volume-increase-icon = fas fa-volume-up
|
||||||
|
# volume-mute-icon = fas fa-volume-off
|
||||||
|
# volume-mute-icon-alt = fas fa-volume-mute
|
||||||
|
# volume-mute-icon-alt =
|
||||||
|
# volume-decrease-image =
|
||||||
|
# volume-increase-image =
|
||||||
|
# volume-mute-image =
|
||||||
|
# volume-mute-image-alt =
|
||||||
|
|
||||||
[gui]
|
[gui]
|
||||||
width = 800
|
width = 800
|
||||||
height = 600
|
height = 600
|
||||||
|
|||||||
Reference in New Issue
Block a user