Skip to content

Instantly share code, notes, and snippets.

@bram2202

bram2202/config.js

Created January 7, 2022 09:57
Show Gist options
  • Save bram2202/59ebf4e0ec3241fbad087d4f2f85d943 to your computer and use it in GitHub Desktop.
Save bram2202/59ebf4e0ec3241fbad087d4f2f85d943 to your computer and use it in GitHub Desktop.
Download ZIP
Tileboard_V2
Raw
config.js
var CONFIG = {
customTheme: CUSTOM_THEMES.HOMEKIT,
transition: TRANSITIONS.ANIMATED_GPU,
entitySize: ENTITY_SIZES.NORMAL,
tileSize: 150,
tileMargin: 6,
serverUrl: 'http://' + location.hostname + ':8123',
wsUrl: 'ws://' + location.hostname + ':8123/api/websocket',
authToken: "[REDACTED]",
debug: false,
pingConnection: true,
locale: 'nl',
events: [],
timeFormat: 24,
menuPosition: MENU_POSITIONS.LEFT,
hideScrollbar: false,
groupsAlign: GROUP_ALIGNS.HORIZONTALLY,
onReady: function () { },
pages: [
{
title: 'Main page',
bg: 'images/dark-abstract.jpg',
icon: 'mdi-home-outline',
header: { // https://github.com/resoai/TileBoard/wiki/Header-configuration
styles: {
margin: '10px 130px 0',
fontSize: '28px',
//position: initial
},
left: [
{
type: HEADER_ITEMS.DATETIME,
dateFormat: 'dd MMMM', //https://docs.angularjs.org/api/ng/filter/date
styles: {
margin: '0'
}
}
],
right: [
// Uncomment weather object to get weather in your header.
{
type: HEADER_ITEMS.WEATHER,
styles: {
margin: '0 0 0'
},
icon: '&weather.souverijnsakker.state',
icons: {
'clear-day': 'clear',
'clear-night': 'nt-clear',
'cloudy': 'cloudy',
'rain': 'rain',
'sleet': 'sleet',
'snow': 'snow',
'wind': 'hazy',
'fog': 'fog',
'partly-cloudy-day': 'partlycloudy',
'partly-cloudy-night': 'nt-partlycloudy'
},
fields: {
summary: '&weather.souverijnsakker.state',
temperature: '&weather.souverijnsakker.attributes.temperature',
temperatureUnit: '°'
}
}
]
},
groups: [
{
title: 'Scenes',
width: 1,
height: 5,
items: [
{
position: [0, 0],
id: 'script.routine_home',
title: 'Thuis',
type: TYPES.SCRIPT,
icons: {
on: "mdi-check-circle-outline",
off: "mdi-home-variant"
},
state: false,
},
{
position: [0, 1],
id: 'script.routine_sleep',
title: 'Slapen',
type: TYPES.SCRIPT,
icons: {
on: "mdi-check-circle-outline",
off: "mdi-bed"
},
state: false,
}
]
},
{
title: 'Info',
width: 2,
height: 5,
items: [
{
position: [0, 0],
type: TYPES.SENSOR,
title: 'Net huidig',
id: 'sensor.power_consumption_watt',
unit: 'Watt',
state: false
},
{
position: [1, 0],
type: TYPES.SENSOR,
title: 'Net dag',
id: 'sensor.total_power_consumption_day',
unit: 'kWh',
state: false
},
{
position: [0, 1],
type: TYPES.SENSOR,
title: 'PV huidig',
id: 'sensor.pv_ac_watt',
unit: 'Watt',
state: false
},
{
position: [1, 1],
type: TYPES.SENSOR,
title: 'PV Dag',
id: 'sensor.pv_generation_day',
unit: 'kWh',
state: false
},
{
position: [1, 2],
type: TYPES.SENSOR,
title: 'Gas Verbruik',
id: 'sensor.total_gas_consumption_day',
unit: 'm3',
state: false
}
]
},
{
title: 'Media',
width: 2,
height: 5,
items: [
{
position: [0, 0],
id: 'media_player.sonoskitchen',
title: 'Keuken',
type: TYPES.MEDIA_PLAYER,
hideSource: false,
textSource: 'Sorgente',
hideMuteButton: false,
state: false,
subtitle: '@attributes.media_title',
bgSuffix: '@attributes.entity_picture'
},
{
position: [1, 0],
id: 'media_player.jblbar',
title: 'Woonkamer',
type: TYPES.MEDIA_PLAYER,
hideSource: false,
textSource: 'Sorgente',
hideMuteButton: false,
state: false,
subtitle: '@attributes.media_title',
bgSuffix: '@attributes.entity_picture'
},
{
position: [0, 1],
id: 'script.setkitchen538',
type: TYPES.SCRIPT,
title: '538 keuken',
icons: {
on: "mdi-radio",
off: "mdi-radio"
},
state: false
},
{
position: [1, 1],
type: TYPES.SCRIPT,
id: 'script.setradio538jbl',
title: '538 huiskamer',
icons: {
on: "mdi-radio",
off: "mdi-radio"
},
state: false
},
]
}, {
title: '',
width: 1,
height: 5,
items: [
{
position: [0, 0],
title: 'Tablet',
id: 'light.galaxy_tab_a7_screen',
type: TYPES.LIGHT,
states: {
on: "Aan",
off: "Uit"
},
icons: {
on: "mdi-tablet-dashboard",
off: "mdi-tablet-dashboard",
unavailable: "mdi-alert-circle-outline"
},
},
{
position: [0, 1],
type: TYPES.SENSOR,
title: 'Afval',
id: 'sensor.afvalwijzer_today',
state: false
}
]
}
]
},
{
title: 'Lights page',
bg: 'images/bg2.png',
icon: 'mdi-lightbulb-on',
groups: [
{
title: 'Woonkamer',
width: 2,
height: 5,
items: [
{
position: [0, 0],
title: 'TV',
id: 'light.livingroom_tv',
type: TYPES.LIGHT,
states: {
on: "Aan",
off: "Uit"
},
icons: {
on: "mdi-lightbulb-on",
off: "mdi-lightbulb",
unavailable: "mdi-alert-circle-outline"
},
sliders: [
{
title: 'Felheid',
vertical: true,
field: 'brightness',
max: 255,
min: 0,
step: 5,
request: {
type: "call_service",
domain: "light",
service: "turn_on",
field: "brightness"
}
},
{
title: 'Color temp',
field: 'color_temp',
max: 588,
min: 153,
step: 15,
request: {
type: "call_service",
domain: "light",
service: "turn_on",
field: "color_temp"
}
}
]
},
{
position: [1, 0],
title: '3poot',
id: 'light.livingroom_tripod',
type: TYPES.LIGHT,
states: {
on: "Aan",
off: "Uit"
},
icons: {
on: "mdi-lightbulb-on",
off: "mdi-lightbulb",
unavailable: "mdi-alert-circle-outline"
},
sliders: [
{
title: 'Brightness',
field: 'brightness',
max: 255,
min: 0,
step: 5,
request: {
type: "call_service",
domain: "light",
service: "turn_on",
field: "brightness"
}
},
{
title: 'Color temp',
field: 'color_temp',
max: 588,
min: 153,
step: 15,
request: {
type: "call_service",
domain: "light",
service: "turn_on",
field: "color_temp"
}
}
]
},
{
position: [0, 1],
title: 'Dressoir LED',
id: 'light.dresser_led',
type: TYPES.LIGHT,
states: {
on: "Aan",
off: "Uit"
},
icons: {
on: "mdi-lightbulb-on",
off: "mdi-lightbulb",
unavailable: "mdi-alert-circle-outline"
}
},
{
position: [1, 1],
title: 'Dressoir top',
id: 'light.dresser_top',
type: TYPES.LIGHT,
states: {
on: "Aan",
off: "Uit"
},
icons: {
on: "mdi-lightbulb-on",
off: "mdi-lightbulb",
unavailable: "mdi-alert-circle-outline"
},
sliders: [
{
title: 'Brightness',
field: 'brightness',
max: 255,
min: 0,
step: 5,
request: {
type: "call_service",
domain: "light",
service: "turn_on",
field: "brightness"
}
}
]
},
]
},
{
title: 'Keuken',
width: 1,
height: 5,
items: [
{
position: [0, 0],
title: 'Eettafel',
id: 'light.dinner_table',
type: TYPES.LIGHT,
states: {
on: "Aan",
off: "Uit"
},
icons: {
on: "mdi-lightbulb-on",
off: "mdi-lightbulb",
unavailable: "mdi-alert-circle-outline"
},
sliders: [
{
title: 'Brightness',
field: 'brightness',
max: 255,
min: 0,
step: 5,
request: {
type: "call_service",
domain: "light",
service: "turn_on",
field: "brightness"
}
}
]
},
{
position: [0, 1],
title: 'Coffee corner',
id: 'switch.kitchen_coffee',
type: TYPES.SWITCH,
states: {
on: "Aan",
off: "Uit"
},
icons: {
on: "mdi-lightbulb-on",
off: "mdi-lightbulb",
unavailable: "mdi-alert-circle-outline"
}
},
]
},
{
title: 'Tuin',
width: 1,
height: 5,
items: [
{
position: [0, 0],
title: 'Voor deur',
id: 'light.front_door_wall',
type: TYPES.LIGHT,
states: {
on: "Aan",
off: "Uit"
},
icons: {
on: "mdi-lightbulb-on",
off: "mdi-lightbulb",
unavailable: "mdi-alert-circle-outline"
},
sliders: [
{
title: 'Brightness',
field: 'brightness',
max: 255,
min: 0,
step: 5,
request: {
type: "call_service",
domain: "light",
service: "turn_on",
field: "brightness"
}
},
{
title: 'Color temp',
field: 'color_temp',
max: 588,
min: 153,
step: 15,
request: {
type: "call_service",
domain: "light",
service: "turn_on",
field: "color_temp"
}
}
]
},
{
position: [0, 1],
title: 'Tuin',
id: 'switch.garden',
type: TYPES.SWITCH,
states: {
on: "Aan",
off: "Uit"
},
icons: {
on: "mdi-lightbulb-on",
off: "mdi-lightbulb",
unavailable: "mdi-alert-circle-outline"
}
}
]
},
{
title: 'Slaapkamer',
width: 2,
height: 5,
items: [
{
position: [0, 0],
title: 'Kast Bram',
id: 'light.bedroom_closet_bram',
type: TYPES.LIGHT,
states: {
on: "Aan",
off: "Uit"
},
icons: {
on: "mdi-lightbulb-on",
off: "mdi-lightbulb",
unavailable: "mdi-alert-circle-outline"
},
sliders: [
{
title: 'Brightness',
field: 'brightness',
max: 255,
min: 0,
step: 5,
request: {
type: "call_service",
domain: "light",
service: "turn_on",
field: "brightness"
}
},
]
},
{
position: [1, 0],
title: 'Kast Danielle',
id: 'light.bedroom_closet_danielle',
type: TYPES.LIGHT,
states: {
on: "Aan",
off: "Uit"
},
icons: {
on: "mdi-lightbulb-on",
off: "mdi-lightbulb",
unavailable: "mdi-alert-circle-outline"
},
sliders: [
{
title: 'Brightness',
field: 'brightness',
max: 255,
min: 0,
step: 5,
request: {
type: "call_service",
domain: "light",
service: "turn_on",
field: "brightness"
}
},
]
},
{
position: [0, 1],
title: 'Kast Spiegel',
id: 'light.bedroom_closet_mirror',
type: TYPES.LIGHT,
states: {
on: "Aan",
off: "Uit"
},
icons: {
on: "mdi-lightbulb-on",
off: "mdi-lightbulb",
unavailable: "mdi-alert-circle-outline"
},
sliders: [
{
title: 'Brightness',
field: 'brightness',
max: 255,
min: 0,
step: 5,
request: {
type: "call_service",
domain: "light",
service: "turn_on",
field: "brightness"
}
},
]
}
]
},
{
title: 'Studeerkamer',
width: 2,
height: 5,
items: [
{
position: [0, 0],
title: 'PC',
id: 'light.studyroom_pc',
type: TYPES.LIGHT,
states: {
on: "Aan",
off: "Uit"
},
icons: {
on: "mdi-lightbulb-on",
off: "mdi-lightbulb",
unavailable: "mdi-alert-circle-outline"
},
sliders: [
{
title: 'Brightness',
field: 'brightness',
max: 255,
min: 0,
step: 5,
request: {
type: "call_service",
domain: "light",
service: "turn_on",
field: "brightness"
}
},
]
},
{
position: [1, 0],
title: 'Kast',
id: 'light.studyroom_closet',
type: TYPES.LIGHT,
states: {
on: "Aan",
off: "Uit"
},
icons: {
on: "mdi-lightbulb-on",
off: "mdi-lightbulb",
unavailable: "mdi-alert-circle-outline"
},
sliders: [
{
title: 'Brightness',
field: 'brightness',
max: 255,
min: 0,
step: 5,
request: {
type: "call_service",
domain: "light",
service: "turn_on",
field: "brightness"
}
},
]
},
{
position: [0, 1],
title: 'Printer',
id: 'light.studyroom_printer',
type: TYPES.LIGHT,
states: {
on: "Aan",
off: "Uit"
},
icons: {
on: "mdi-lightbulb-on",
off: "mdi-lightbulb",
unavailable: "mdi-alert-circle-outline"
},
sliders: [
{
title: 'Brightness',
field: 'brightness',
max: 255,
min: 0,
step: 5,
request: {
type: "call_service",
domain: "light",
service: "turn_on",
field: "brightness"
}
},
]
}
]
},
]
},
{
title: 'cam page',
bg: 'images/bg2.png',
icon: 'mdi-cctv',
groups: [
{
title: '',
width: 7,
height: 6,
items: [
{
position: [0, 0],
id: 'camera.driveway',
type: TYPES.CAMERA,
bgSize: 'contain',
width: 4,
height: 2,
state: false,
fullscreen: {
type: TYPES.CAMERA,
objFit: 'contain', // https://developer.mozilla.org/en-US/docs/Web/CSS/object-fit
id: 'camera.driveway', // Optional: camera entity to use on fullscreen, defaults to the tile camera entity if omitted
bufferLength: 5 // Optional: buffer length in seconds for the HLS buffer, default is 5 seconds
},
refresh: 1000, // can be number in milliseconds
},
{
position: [4, 0],
id: 'camera.garden',
type: TYPES.CAMERA,
bgSize: 'contain',
width: 4,
height: 2,
state: false,
fullscreen: {
type: TYPES.CAMERA,
objFit: 'contain', // https://developer.mozilla.org/en-US/docs/Web/CSS/object-fit
id: 'camera.garden', // Optional: camera entity to use on fullscreen, defaults to the tile camera entity if omitted
bufferLength: 5 // Optional: buffer length in seconds for the HLS buffer, default is 5 seconds
},
refresh: 1000, // can be number in milliseconds
},
{
position: [0, 2],
id: 'camera.garage',
type: TYPES.CAMERA,
bgSize: 'contain',
width: 4,
height: 2,
state: false,
fullscreen: {
type: TYPES.CAMERA,
objFit: 'contain', // https://developer.mozilla.org/en-US/docs/Web/CSS/object-fit
id: 'camera.garage', // Optional: camera entity to use on fullscreen, defaults to the tile camera entity if omitted
bufferLength: 5 // Optional: buffer length in seconds for the HLS buffer, default is 5 seconds
},
refresh: 1000, // can be number in milliseconds
}
]
}
]
},
{
title: 'weather',
bg: 'images/bg2.png',
icon: 'mdi-cloud',
groups: [
{
title: '',
width: 7,
height: 6,
items: [
{
position: [0, 0],
id: 'camera.buienradar',
type: TYPES.CAMERA,
bgSize: 'contain',
width: 4,
height: 4,
state: false,
refresh: 10000, // can be number in milliseconds
},
]
}
]
}
]
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment