@scrounger und alle anderen Profis hier,
ich habe mich jetzt auch mal an einen html Widget versucht, echt coole Sache.
[image: 1636274106607-41465945-92b8-4fb9-a285-2c541caee286-image.png]
Export:
Spoiler
<div class='vis-widget materialdesign-widget materialdesign-button materialdesign-button-html-element'
style='width: 70px; height: 70px; position: absolute; top: 35px; left: 10px; display: flex; align-items: center;'
mdw-type='state_vertical'
mdw-oid='homee.0.Homee-0.Homeegrams.26.active'
mdw-buttonStyle='raised'
mdw-vibrateOnMobilDevices='50'
mdw-textFontFamily='#mdwTheme:vis-materialdesign.0.fonts.button.vertical.text'
mdw-textFontSize='#mdwTheme:vis-materialdesign.0.fontSizes.button.vertical.text'
mdw-alignment='center'
mdw-mdwButtonPrimaryColor='#mdwTheme:vis-materialdesign.0.colors.button.vertical.primary'
mdw-mdwButtonSecondaryColor='#mdwTheme:vis-materialdesign.0.colors.button.vertical.secondary'
mdw-image='/vis.0/main/img/Meine Icons/Gewerke/Heizung_An.png'
mdw-iconPosition='top'
mdw-iconHeight='66'
mdw-autoLockAfter='10'
mdw-lockIconTop='5'
mdw-lockIconLeft='5'
mdw-lockIconColor='#mdwTheme:vis-materialdesign.0.colors.button.lock_icon'
mdw-lockFilterGrayscale='30'
></div>
<div class='vis-widget materialdesign-widget materialdesign-value materialdesign-value-html-element'
style='width: calc(100% - 100px); height: 25px; position: absolute; top: 5px; left: 90px; display: flex; align-items: center;'
mdw-debug='false'
mdw-oid='linkeddevices.0.Heizung.Wohnzimmer.1.Temperatur'
mdw-targetType='auto'
mdw-textAlign='end'
mdw-valueLabelWidth='4'
mdw-valuesFontColor='#2e2e2e'
mdw-valuesFontFamily='#mdwTheme:vis-materialdesign.0.fonts.value.text'
mdw-valuesFontSize='15'
mdw-prepandText='Heizung Wohnzimmer Links'
mdw-prepandTextColor='#d7cec1'
mdw-prepandTextFontFamily='#mdwTheme:vis-materialdesign.0.fonts.value.prepand'
mdw-prepandTextFontSize='15'
mdw-appendTextColor='#mdwTheme:vis-materialdesign.0.colors.value.append'
mdw-appendTextFontFamily='#mdwTheme:vis-materialdesign.0.fonts.value.append'
mdw-appendTextFontSize='#mdwTheme:vis-materialdesign.0.fontSizes.value.append'
mdw-imageColor='#mdwTheme:vis-materialdesign.0.colors.value.icon'
mdw-iconPosition='left'
mdw-effectFontColor='#mdwTheme:vis-materialdesign.0.colors.value.effect'
mdw-effectFontSize='#mdwTheme:vis-materialdesign.0.fontSizes.value.effect'
mdw-effectDuration='750'
></div>
<div class='vis-widget materialdesign-widget materialdesign-value materialdesign-value-html-element'
style='width: 25%; height: 20px; position: absolute; top: 30px; left: 90px; display: flex; align-items: center;'
mdw-debug='false'
mdw-oid='linkeddevices.0.Heizung.Wohnzimmer.1.Modus'
mdw-targetType='auto'
mdw-textAlign='end'
mdw-valueLabelWidth='4'
mdw-valuesFontColor='#2e2e2e'
mdw-valuesFontFamily='#mdwTheme:vis-materialdesign.0.fonts.value.text'
mdw-valuesFontSize='#mdwTheme:vis-materialdesign.0.fontSizes.value.text'
mdw-prepandText='Modus:'
mdw-prepandTextColor='#mdwTheme:vis-materialdesign.0.colors.value.prepand'
mdw-prepandTextFontFamily='#mdwTheme:vis-materialdesign.0.fonts.value.prepand'
mdw-prepandTextFontSize='#mdwTheme:vis-materialdesign.0.fontSizes.value.prepand'
mdw-appendText=''
mdw-appendTextColor='#mdwTheme:vis-materialdesign.0.colors.value.append'
mdw-appendTextFontFamily='#mdwTheme:vis-materialdesign.0.fonts.value.append'
mdw-appendTextFontSize='#mdwTheme:vis-materialdesign.0.fontSizes.value.append'
mdw-minDecimals=''
mdw-imageColor='#mdwTheme:vis-materialdesign.0.colors.value.icon'
mdw-iconPosition='left'
mdw-effectFontColor='#mdwTheme:vis-materialdesign.0.colors.value.effect'
mdw-effectFontSize='#mdwTheme:vis-materialdesign.0.fontSizes.value.effect'
mdw-effectDuration='750'
></div>
<div class='vis-widget materialdesign-widget materialdesign-select materialdesign-select-html-element'
style='width: 180px; height: 38px; position: absolute; top: 12px; left: calc(100% - 185px); display: flex; align-items: center;'
mdw-oid='linkeddevices.0.Heizung.Wohnzimmer.1.Modus'
mdw-inputType='text'
mdw-vibrateOnMobilDevices='50'
mdw-inputLayout='text'
mdw-inputAlignment='right'
mdw-inputLayoutBorderColor='#mdwTheme:vis-materialdesign.0.colors.input.border'
mdw-inputLayoutBorderColorHover='#mdwTheme:vis-materialdesign.0.colors.input.border_hover'
mdw-inputLayoutBorderColorSelected='#mdwTheme:vis-materialdesign.0.colors.input.border_selected'
mdw-inputTextFontFamily='#mdwTheme:vis-materialdesign.0.fonts.input.text'
mdw-inputTextFontSize='12'
mdw-inputTextColor='#mdwTheme:vis-materialdesign.0.colors.input.text'
mdw-inputLabelText=''
mdw-inputLabelColor='#mdwTheme:vis-materialdesign.0.colors.input.label'
mdw-inputLabelColorSelected='#mdwTheme:vis-materialdesign.0.colors.input.label_selected'
mdw-inputLabelFontFamily='#mdwTheme:vis-materialdesign.0.fonts.input.label'
mdw-inputLabelFontSize='#mdwTheme:vis-materialdesign.0.fontSizes.input.label'
mdw-inputAppendixColor='#mdwTheme:vis-materialdesign.0.colors.input.appendix'
mdw-inputAppendixFontSize='#mdwTheme:vis-materialdesign.0.fontSizes.input.appendix'
mdw-inputAppendixFontFamily='#mdwTheme:vis-materialdesign.0.fonts.input.appendix'
mdw-inputMessageFontFamily='#mdwTheme:vis-materialdesign.0.fonts.input.message'
mdw-inputMessageFontSize='#mdwTheme:vis-materialdesign.0.fontSizes.input.message'
mdw-inputMessageColor='#mdwTheme:vis-materialdesign.0.colors.input.message'
mdw-inputCounterColor='#mdwTheme:vis-materialdesign.0.colors.input.counter'
mdw-inputCounterFontSize='#mdwTheme:vis-materialdesign.0.fontSizes.input.counter'
mdw-inputCounterFontFamily='#mdwTheme:vis-materialdesign.0.fonts.input.counter'
mdw-clearIconColor='#mdwTheme:vis-materialdesign.0.colors.input.icon_clear'
mdw-collapseIconColor='#mdwTheme:vis-materialdesign.0.colors.input.icon_collapse'
mdw-listDataMethod='inputPerEditor'
mdw-countSelectItems='4'
mdw-listPosition='auto'
mdw-listItemBackgroundColor='#mdwTheme:vis-materialdesign.0.colors.input.menu.background'
mdw-listItemBackgroundHoverColor='#mdwTheme:vis-materialdesign.0.colors.input.menu.hover'
mdw-listItemBackgroundSelectedColor='#mdwTheme:vis-materialdesign.0.colors.input.menu.selected'
mdw-listItemRippleEffectColor='#mdwTheme:vis-materialdesign.0.colors.input.menu.effect'
mdw-showSelectedIcon='prepend-inner'
mdw-listIconColor='#mdwTheme:vis-materialdesign.0.colors.input.menu.icon'
mdw-listItemFontSize='#mdwTheme:vis-materialdesign.0.fontSizes.input.dropdown.text'
mdw-listItemFont='#mdwTheme:vis-materialdesign.0.fonts.input.dropdown.text'
mdw-listItemFontColor='#mdwTheme:vis-materialdesign.0.colors.input.menu.text'
mdw-listItemSubFontSize='#mdwTheme:vis-materialdesign.0.fontSizes.input.dropdown.subText'
mdw-listItemSubFont='#mdwTheme:vis-materialdesign.0.fonts.input.dropdown.subText'
mdw-listItemSubFontColor='#mdwTheme:vis-materialdesign.0.colors.input.menu.subText'
mdw-listItemValueFontSize='#mdwTheme:vis-materialdesign.0.fontSizes.input.dropdown.value'
mdw-listItemValueFont='#mdwTheme:vis-materialdesign.0.fonts.input.dropdown.value'
mdw-listItemValueFontColor='#mdwTheme:vis-materialdesign.0.colors.input.menu.value'
mdw-value0='0'
mdw-label0='Aus'
mdw-value1='1'
mdw-label1='Normal'
mdw-value2='2'
mdw-label2='Energiesparend'
mdw-value3='3'
mdw-label3='Boost'
mdw-value4='4'
mdw-label4='Manuell'
></div>
<div class='vis-widget materialdesign-widget materialdesign-value materialdesign-value-html-element'
style='width: 25%; height: 20px; position: absolute; top: 50px; left: 90px; display: flex; align-items: center;'
mdw-debug='false'
mdw-oid='linkeddevices.0.Heizung.Wohnzimmer.1.Ventilstellung'
mdw-targetType='auto'
mdw-textAlign='end'
mdw-valueLabelWidth='4'
mdw-valuesFontColor='#mdwTheme:vis-materialdesign.0.colors.value.text'
mdw-valuesFontFamily='#mdwTheme:vis-materialdesign.0.fonts.value.text'
mdw-valuesFontSize='#mdwTheme:vis-materialdesign.0.fontSizes.value.text'
mdw-prepandText='Ventilstellung:'
mdw-prepandTextColor='#mdwTheme:vis-materialdesign.0.colors.value.prepand'
mdw-prepandTextFontFamily='#mdwTheme:vis-materialdesign.0.fonts.value.prepand'
mdw-prepandTextFontSize='#mdwTheme:vis-materialdesign.0.fontSizes.value.prepand'
mdw-appendText='%'
mdw-appendTextColor='#mdwTheme:vis-materialdesign.0.colors.value.append'
mdw-appendTextFontFamily='#mdwTheme:vis-materialdesign.0.fonts.value.append'
mdw-appendTextFontSize='#mdwTheme:vis-materialdesign.0.fontSizes.value.append'
mdw-minDecimals='2'
mdw-imageColor='#mdwTheme:vis-materialdesign.0.colors.value.icon'
mdw-iconPosition='left'
mdw-effectFontColor='#mdwTheme:vis-materialdesign.0.colors.value.effect'
mdw-effectFontSize='#mdwTheme:vis-materialdesign.0.fontSizes.value.effect'
mdw-effectDuration='750'
></div>
<div class='vis-widget materialdesign-widget materialdesign-value materialdesign-value-html-element'
style='width: 25%; height: 20px; position: absolute; top: 70px; left: 90px; display: flex; align-items: center;'
mdw-debug='false'
mdw-oid='linkeddevices.0.Heizung.Wohnzimmer.1.Solltemperatur'
mdw-targetType='auto'
mdw-textAlign='end'
mdw-valueLabelWidth='4'
mdw-valuesFontColor='#mdwTheme:vis-materialdesign.0.colors.value.text'
mdw-valuesFontFamily='#mdwTheme:vis-materialdesign.0.fonts.value.text'
mdw-valuesFontSize='#mdwTheme:vis-materialdesign.0.fontSizes.value.text'
mdw-prepandText='Soll-Temperatur:'
mdw-prepandTextColor='#mdwTheme:vis-materialdesign.0.colors.value.prepand'
mdw-prepandTextFontFamily='#mdwTheme:vis-materialdesign.0.fonts.value.prepand'
mdw-prepandTextFontSize='#mdwTheme:vis-materialdesign.0.fontSizes.value.prepand'
mdw-appendText='°C'
mdw-appendTextColor='#mdwTheme:vis-materialdesign.0.colors.value.append'
mdw-appendTextFontFamily='#mdwTheme:vis-materialdesign.0.fonts.value.append'
mdw-appendTextFontSize='#mdwTheme:vis-materialdesign.0.fontSizes.value.append'
mdw-minDecimals='2'
mdw-imageColor='#mdwTheme:vis-materialdesign.0.colors.value.icon'
mdw-iconPosition='left'
mdw-effectFontColor='#mdwTheme:vis-materialdesign.0.colors.value.effect'
mdw-effectFontSize='#mdwTheme:vis-materialdesign.0.fontSizes.value.effect'
mdw-effectDuration='750'
></div>
<div class='vis-widget materialdesign-widget materialdesign-value materialdesign-value-html-element'
style='width: 25%; height: 20px; position: absolute; top: 90px; left: 90px; display: flex; align-items: center;'
mdw-debug='false'
mdw-oid='linkeddevices.0.Heizung.Wohnzimmer.1.Temperatur'
mdw-targetType='auto'
mdw-textAlign='end'
mdw-valueLabelWidth='4'
mdw-valuesFontColor='#mdwTheme:vis-materialdesign.0.colors.value.text'
mdw-valuesFontFamily='#mdwTheme:vis-materialdesign.0.fonts.value.text'
mdw-valuesFontSize='#mdwTheme:vis-materialdesign.0.fontSizes.value.text'
mdw-prepandText='Ist-Temperatur:'
mdw-prepandTextColor='#mdwTheme:vis-materialdesign.0.colors.value.prepand'
mdw-prepandTextFontFamily='#mdwTheme:vis-materialdesign.0.fonts.value.prepand'
mdw-prepandTextFontSize='#mdwTheme:vis-materialdesign.0.fontSizes.value.prepand'
mdw-appendText='°C'
mdw-appendTextColor='#mdwTheme:vis-materialdesign.0.colors.value.append'
mdw-appendTextFontFamily='#mdwTheme:vis-materialdesign.0.fonts.value.append'
mdw-appendTextFontSize='#mdwTheme:vis-materialdesign.0.fontSizes.value.append'
mdw-minDecimals='2'
mdw-imageColor='#mdwTheme:vis-materialdesign.0.colors.value.icon'
mdw-iconPosition='left'
mdw-effectFontColor='#mdwTheme:vis-materialdesign.0.colors.value.effect'
mdw-effectFontSize='#mdwTheme:vis-materialdesign.0.fontSizes.value.effect'
mdw-effectDuration='750'
></div>
<div class='vis-widget materialdesign-widget materialdesign-value materialdesign-value-html-element'
style='width: calc(30% - 15px); height: 20px; position: absolute; top: 50px; left: 70%; display: flex; align-items: center;'
mdw-debug='false'
mdw-oid='linkeddevices.0.Heizung.Wohnzimmer.4.CO2'
mdw-targetType='auto'
mdw-textAlign='end'
mdw-valueLabelWidth='4'
mdw-valuesFontColor='#mdwTheme:vis-materialdesign.0.colors.value.text'
mdw-valuesFontFamily='#mdwTheme:vis-materialdesign.0.fonts.value.text'
mdw-valuesFontSize='#mdwTheme:vis-materialdesign.0.fontSizes.value.text'
mdw-prepandText='CO2:'
mdw-prepandTextColor='#mdwTheme:vis-materialdesign.0.colors.value.prepand'
mdw-prepandTextFontFamily='#mdwTheme:vis-materialdesign.0.fonts.value.prepand'
mdw-prepandTextFontSize='#mdwTheme:vis-materialdesign.0.fontSizes.value.prepand'
mdw-appendText='ppm'
mdw-appendTextColor='#mdwTheme:vis-materialdesign.0.colors.value.append'
mdw-appendTextFontFamily='#mdwTheme:vis-materialdesign.0.fonts.value.append'
mdw-appendTextFontSize='#mdwTheme:vis-materialdesign.0.fontSizes.value.append'
mdw-minDecimals='0'
mdw-imageColor='#mdwTheme:vis-materialdesign.0.colors.value.icon'
mdw-iconPosition='left'
mdw-effectFontColor='#mdwTheme:vis-materialdesign.0.colors.value.effect'
mdw-effectFontSize='#mdwTheme:vis-materialdesign.0.fontSizes.value.effect'
mdw-effectDuration='750'
></div>
<div class='vis-widget materialdesign-widget materialdesign-value materialdesign-value-html-element'
style='width: calc(30% - 15px); height: 20px; position: absolute; top: 70px; left: 70%; display: flex; align-items: center;'
mdw-debug='false'
mdw-oid='linkeddevices.0.Heizung.Wohnzimmer.4.Luftdruck'
mdw-targetType='auto'
mdw-textAlign='end'
mdw-valueLabelWidth='4'
mdw-valuesFontColor='#mdwTheme:vis-materialdesign.0.colors.value.text'
mdw-valuesFontFamily='#mdwTheme:vis-materialdesign.0.fonts.value.text'
mdw-valuesFontSize='#mdwTheme:vis-materialdesign.0.fontSizes.value.text'
mdw-prepandText='Luftdruck:'
mdw-prepandTextColor='#mdwTheme:vis-materialdesign.0.colors.value.prepand'
mdw-prepandTextFontFamily='#mdwTheme:vis-materialdesign.0.fonts.value.prepand'
mdw-prepandTextFontSize='#mdwTheme:vis-materialdesign.0.fontSizes.value.prepand'
mdw-appendText='mBar'
mdw-appendTextColor='#mdwTheme:vis-materialdesign.0.colors.value.append'
mdw-appendTextFontFamily='#mdwTheme:vis-materialdesign.0.fonts.value.append'
mdw-appendTextFontSize='#mdwTheme:vis-materialdesign.0.fontSizes.value.append'
mdw-minDecimals='0'
mdw-imageColor='#mdwTheme:vis-materialdesign.0.colors.value.icon'
mdw-iconPosition='left'
mdw-effectFontColor='#mdwTheme:vis-materialdesign.0.colors.value.effect'
mdw-effectFontSize='#mdwTheme:vis-materialdesign.0.fontSizes.value.effect'
mdw-effectDuration='750'
></div>
<div class='vis-widget materialdesign-widget materialdesign-value materialdesign-value-html-element'
style='width: calc(30% - 15px); height: 20px; position: absolute; top: 90px; left: 70%; display: flex; align-items: center;'
mdw-debug='false'
mdw-oid='linkeddevices.0.Heizung.Wohnzimmer.4.Luftfeuchtigkeit'
mdw-targetType='auto'
mdw-textAlign='end'
mdw-valueLabelWidth='4'
mdw-valuesFontColor='#mdwTheme:vis-materialdesign.0.colors.value.text'
mdw-valuesFontFamily='#mdwTheme:vis-materialdesign.0.fonts.value.text'
mdw-valuesFontSize='#mdwTheme:vis-materialdesign.0.fontSizes.value.text'
mdw-prepandText='Luftfeuchtigkeit:'
mdw-prepandTextColor='#mdwTheme:vis-materialdesign.0.colors.value.prepand'
mdw-prepandTextFontFamily='#mdwTheme:vis-materialdesign.0.fonts.value.prepand'
mdw-prepandTextFontSize='#mdwTheme:vis-materialdesign.0.fontSizes.value.prepand'
mdw-appendText='%'
mdw-appendTextColor='#mdwTheme:vis-materialdesign.0.colors.value.append'
mdw-appendTextFontFamily='#mdwTheme:vis-materialdesign.0.fonts.value.append'
mdw-appendTextFontSize='#mdwTheme:vis-materialdesign.0.fontSizes.value.append'
mdw-minDecimals='2'
mdw-imageColor='#mdwTheme:vis-materialdesign.0.colors.value.icon'
mdw-iconPosition='left'
mdw-effectFontColor='#mdwTheme:vis-materialdesign.0.colors.value.effect'
mdw-effectFontSize='#mdwTheme:vis-materialdesign.0.fontSizes.value.effect'
mdw-effectDuration='750'
></div>
<div class='vis-widget materialdesign-widget materialdesign-value materialdesign-value-html-element'
style='width: calc(100% - 100px); height: 20px; position: absolute; top: 115px; left: 90px; display: flex; align-items: center;'
mdw-debug='false'
mdw-oid='linkeddevices.0.Heizung.Wohnzimmer.1.Solltemperatur'
mdw-targetType='auto'
mdw-overrideText='8Std 20Min'
mdw-textAlign='end'
mdw-valueLabelWidth='4'
mdw-valuesFontColor='#mdwTheme:vis-materialdesign.0.colors.value.text'
mdw-valuesFontFamily='#mdwTheme:vis-materialdesign.0.fonts.value.text'
mdw-valuesFontSize='#mdwTheme:vis-materialdesign.0.fontSizes.value.text'
mdw-prepandText='Änderung Solltemperatur vor:'
mdw-prepandTextColor='#mdwTheme:vis-materialdesign.0.colors.value.prepand'
mdw-prepandTextFontFamily='#mdwTheme:vis-materialdesign.0.fonts.value.prepand'
mdw-prepandTextFontSize='#mdwTheme:vis-materialdesign.0.fontSizes.value.prepand'
mdw-appendTextColor='#mdwTheme:vis-materialdesign.0.colors.value.append'
mdw-appendTextFontFamily='#mdwTheme:vis-materialdesign.0.fonts.value.append'
mdw-appendTextFontSize='#mdwTheme:vis-materialdesign.0.fontSizes.value.append'
mdw-imageColor='#mdwTheme:vis-materialdesign.0.colors.value.icon'
mdw-iconPosition='left'
mdw-effectFontColor='#mdwTheme:vis-materialdesign.0.colors.value.effect'
mdw-effectFontSize='#mdwTheme:vis-materialdesign.0.fontSizes.value.effect'
mdw-effectDuration='750'
></div>
<div class='vis-widget materialdesign-widget materialdesign-button materialdesign-button-html-element'
style='width: 60px; height: 60px; box-shadow: 0px 0px 23px 6px rgba(0,0,0,0.75); position: absolute; top: 50px; left: calc(25% + 110px); display: flex; align-items: center;'
mdw-type='addition_vertical'
mdw-oid='linkeddevices.0.Heizung.Wohnzimmer.1.Solltemperatur'
mdw-buttonStyle='raised'
mdw-value='-0.5'
mdw-minmax='8'
mdw-vibrateOnMobilDevices='50'
mdw-textFontFamily='#mdwTheme:vis-materialdesign.0.fonts.button.vertical.text'
mdw-textFontSize='#mdwTheme:vis-materialdesign.0.fontSizes.button.vertical.text'
mdw-alignment='center'
mdw-mdwButtonPrimaryColor='#mdwTheme:vis-materialdesign.0.colors.button.vertical.primary'
mdw-mdwButtonSecondaryColor='#mdwTheme:vis-materialdesign.0.colors.button.vertical.secondary'
mdw-image='/icons-mfd-png/control_minus.png'
mdw-iconPosition='top'
mdw-iconHeight='50'
></div>
<div class='vis-widget materialdesign-widget materialdesign-button materialdesign-button-html-element'
style='width: 60px; height: 60px; box-shadow: 0px 0px 23px 6px rgba(0,0,0,0.75);position: absolute; top: 50px; left: calc(70% - 80px); display: flex; align-items: center;'
mdw-type='addition_vertical'
mdw-oid='linkeddevices.0.Heizung.Wohnzimmer.1.Solltemperatur'
mdw-buttonStyle='raised'
mdw-value='+0.5'
mdw-minmax='24'
mdw-vibrateOnMobilDevices='50'
mdw-textFontFamily='#mdwTheme:vis-materialdesign.0.fonts.button.vertical.text'
mdw-textFontSize='#mdwTheme:vis-materialdesign.0.fontSizes.button.vertical.text'
mdw-alignment='center'
mdw-mdwButtonPrimaryColor='#mdwTheme:vis-materialdesign.0.colors.button.vertical.primary'
mdw-mdwButtonSecondaryColor='#mdwTheme:vis-materialdesign.0.colors.button.vertical.secondary'
mdw-image='/icons-mfd-png/control_plus.png'
mdw-iconPosition='top'
mdw-iconHeight='50'
></div>
Nun aber meine Frage:
Besteht die Möglichkeit, sich mit diesem Widget, über ein Script, eine dynamische Liste zu generieren? Ähnlich wie beim Adapterstatus
Wenn ja, gibt es dazu schon Beispiele, wie ich das am besten umsetze?
Meine Kenntnisse mit Javascript begrenzen sich leider nur auf kopieren und anpassen.