Newbie when it comes to javascript and trying to get my head around triggering events in combination with tiles. What I would like to achieve is to trigger an popup iframe tile.
As far I´ve come is that I need a tile outside of config, so added the following just above the config var:
var iframe = {
position: [2, 0],
width: 3,
height: 3,
title: 'Test Iframe',
type: TYPES.POPUP_IFRAME,
id: {}, // using empty object for an unknown id
refresh: 10000, // 10 seconds
url: "http://www.xxx.com"
}
But completely lost when it comes to the event definition in config.js…Anyone that could give me a hint?
Would it be possible to have some sort of countdown timer (in seconds) on tileboard? I’d quite like to add a visual 10 second timer that is started by clicking a tile.
Anyone managed to find a solution to trigger a message from home assistant with data in the message…?
If you look at the example tiles the weather tile shows an example of this being done
First of all I love TileBoard and started using it on my 7" Raspi display for the wall.
But I had the problem that it is not possible to symlink the config.js or a optional secrets.js due to restrictions of the built-in Home-Assistant web server, when using TileBoard in the Home-Assistant www/ directory. Since I’ve added TileBoard as a git-submodule in my HA-Config repository, symlinking was the only chance to have my config in the repository.
Then I found a security issue with my configuration… Of course it is all Javascript and since my Home-Assistant instance is callable from the www, it was also possibly to call TileBoard directly, including the secrets.js file… But it should only be available for internal use cases and not be as publicly accessible as my Home Assistant.
tldr;
So long story short… I’ve created a simple Docker Container for TileBoard just serving the files with a Python3 web server
So you can decide if you want to expose it with Traefik (and even an own domain and https) to the web or not.
I did this by setting up a timer in HA (Countdown kitchen timer - #15 by Flipso) and then displaying it. I press a tile in Tileboard to activate the HA automation. Once it is active another tile becomes visible in Tileboard and shows the timer. When tmer is finished lights flash and the tile is hidden again. My child uses this to time how long until their cup of tea is ready.
As an aside before Google broke the integration with HA I was using a similar approach to display the current status of my Google timers in TielBoard - which was really useful.)
{
position: [0, 3], // [x, y]
width: 1,
type: TYPES.SENSOR,
title: 'Tea Timer running',
id: 'counter.timer_counter',
customStyles: {'color': '#d469f4','font-weight':'900'},
state: false,
hidden:function(item, entity){
if (entity.state==240) {return true}
else {return false}
},
filter: function (value) {
var minutes = Math.floor(value / 60);
var seconds = value - minutes * 60;
var final;
if(seconds<=9){ final = minutes +':0'+seconds;}
else{ final = minutes +':'+seconds;}
return final;
}
This looks to be exactly what I’m after. None of my timers are currently longer than 1 minute so I should be able to simplify things also. Thanks very much.
@cgarwood, regarding your actions to launch Netflix and Spotify. I copied your code and my android 6 phone tries to open these links in a few other apps. But not in Spotify or Netflix. Are you aware of any change in the way apps are launched from the browser? Or is this very device/version dependent?
Are you using Fully Kiosk Browser or a different browser? I’ve only tested those links in Fully, so they may not work in Chrome, Safari, or other mobile browsers.
I need some help, Im trying to display the light tile settings (where the brightness slider is) not as a part of the tile, but as we have on the alarm tile, so it will overlay the screen and you can change all the settings of the light.
I tried changing the z-index but the elements of the second group are on the top anyway, is there anyway to do it?
Found a strange bug, and though I’d ask here before filing an issue on github.
I have a simple slider tile (based on the example) on a regular page. MOBILE theme. No fancy addons.
Sliding works perfectly on my Galaxy S8, but my wife’s iPhone 10 (iOS 13.2) doesn’t slide. When sliding over the slider, it switches pages.
I’ve debugged it and found the problem is that page-container catches the swipe action instead of the slider catching it.
By removing lines 70-71 in index.html (hm-swipe and hm-recognizer-options attributes of the page-container div) I’ve solved the problem (but removed the slide-to-switch-page functionality).
I managed to make a fullscreen pop-up for the light, and I have all the sliders config there (that was in the light div before) but the sliders are not showing up, anybody knows how to bind them? (no idea why the gif is so small)