I never tried the HA builtin REST command thing, so I’m not sure. What does the response body look like ?
Maybe try with http instead of https. Also be careful about the double quotes in the version attribute, they look a little strange. You can probably just leave them away. If it still won’t work, try to issue the request with curl on the command line and see if that works
curl --request PUT --upload-file myrequest.xml http://admin:pass@camip/ISAPI/PTZCtrl/channels/1/continuous
Hi,
is it possible to have a group icon that only does a page reload/refresh on touch?
and if so: how 
I saw that there are various commands, including “refresh” and “reload”, but i have no idea how i can use it - please help, thanks.
Is it possible to set ENTITY_SIZES.SMALL just to specific item (all other I want to keep as BIG).
Thanks!
today I’m playing with TYPES.DEVICE_TRACKER.
is there a simple way to set an action on the tile to display a popup with big map and device_tracker located on it ?
Pair of questions about TYPES.CAMERA_STREAM
After the Camera Popup closed, player still fetching stream. How can I stop this?
HLS.js not working with wallpanel on Android 6.0.1 and FireOS 5 (Android 5.1). Somebody know recipe to fix?
Edit: Install/Update Android System WebView from Play Store to resolve this.
Hi all, in this huge huge huge topic 
.
I’m looking for a way to give some of my tiles a different color.
Is this possible and what part of code do I need?
I’ve looked in this topic, but couldn’t find an answer. Or maybe missed it…
You can download the webfonts from Material Design Icons or from GitHub and place them on an internal web server or locally where you have your config.js file. Then edit your Index.html file and find the line that has the href to materialdesignicons.min.css and change it to point to your local copy.
Search this topic for customStyles. For instance, if you want the tile color to be teal, add this:
customStyles: {
'background-color': 'teal'
},
You can also use a function instead of an object.
The forum doesn’t allow me more than three consecutive replies so I had to combine these into one.
I don’t believe DEVICE_TRACKER is clickable but I think you can do a CUSTOM tile and open a POPUP_IFRAME using a function to get the lat/lon coordinates from the device you are tracking. Then open the map url with the coordinates.
I haven’t tried this yet because I haven’t updated my Tileboard files to the latest version so I can’t open an iframe popup but from what I can see, this should be doable.
I’ll give it a try later tonight and will let you know if I was successful or not.
EDIT: I tried this and it would work except google is sending X-Frame-Options=sameorigin so the content in the iframe must originate from the same url. I don’t know of a way around this short of rewriting the headers.
How about creating a custom entry in custom.css.
.-icon-kodi-size .item-entity--icon {
font-size: 20px;
}
For the tile you want to adjust add:
classes: ['-icon-kodi-size'],
How do you get the background of a tile to refresh after you click on it or it’s updated? For example:
{
position: [0, 1],
type: TYPES.LIGHT,
id: 'light.one',
states: {
on: "On",
off: "Off"
},
title: 'Light',
bg: function (item, entity) {
if (entity.state == 'on') {
return item.bg = 'images/custombg1.png';
}
else {
return item.bg = 'images/custombg2.jpg'
}
},
}
In the above, every time I refresh the page I get the correct background depending on the state, which means the code works. But I want it to change as soon as the state changes or I click on the tile. How to achieve this?
Just change your function of bg to return url string.
return 'images/custombg1.png';
I was able to get this working in the iframe popup by using a different method of accessing google maps that requires it be used in an iframe. I set up a custom tile that when clicked, sets a global variable with the device tracker I want to zoom in on then opens a POPUP_IFRAME tile with a function that creates and returns the url. Increase the zoom variable to zoom out. I’m not the best javascript programmer so this may not be the best way to access the device clicked but it works.
var CURRENT_DEVICE_TRACKED = 'NONE';
var OPEN_MAP_TILE = {
position: [0, 3],
type: TYPES.POPUP_IFRAME,
id: {},
width: 3,
height: 2,
url: function () {
var lat = this.states[CURRENT_DEVICE_TRACKED].attributes.latitude;
var lon = this.states[CURRENT_DEVICE_TRACKED].attributes.longitude;
var zoom = '.0025';
var url = "https://maps.google.com/maps?q=@" + lat + "," + lon + "&ll=" + lat + "," + lon + "&spn=" + zoom + "," + zoom + "&t=h&hl=en&output=embed";
return (url);
}
};
{
position: [0, 1],
type: TYPES.CUSTOM,
title: 'KHouse75',
id: { },
width: 1,
height: 1,
icon: 'mdi-google-maps',
action: function(item, entity) {
CURRENT_DEVICE_TRACKED = 'device_tracker.life360_khouse75';
return this.$scope.openPopupIframe(OPEN_MAP_TILE, OPEN_MAP_TILE.id);
}
},
I recently updated my Tileboard to the latest code and discovered that the popup type tiles have a new title bar that pushed the image down 50px. This causes the bottom of the image to not be visible. Is there any provision in the code for removing the Title Bar and bringing back the X overlay or is there a way to adjust the size of the popup window so the bottom of the image isn’t cut off?
Here’s what it looks like in the latest version:
Here’s what it looks like in the older version I was running.
thank you … this is exactly what I have been looking for 
I did tried to add your action function directly to TYPES.DEVICE_TRACKER and also works
I managed a workaround for this. In custom.css I globally set the title bar to 0px for all the pop-up-tile entries and copied the popup–close entries from the old main.css to the new custom.css as popup-close. I can now see the entire window and can close it as well.
Added these to custom.css:
.camera-popup-title,
.door-entry-popup-title,
.iframe-popup-title,
.history-popup-title {
height: 0px;
}
.camera-popup-close,
.door-entry-popup-close,
.iframe-popup-close,
.history-popup-close {
position: absolute;
text-align: center;
right: 15px;
top: 15px;
color: rgba(255, 255, 255, 0.6);
background: rgba(0, 0, 0, 0.2);
width: 70px;
height: 70px;
line-height: 70px;
font-size: 50px;
z-index: 3;
cursor: pointer;
}
EDIT/UPDATE:
For those who want to keep the title bar as is but fix the image being cut off at the bottom, the height of the below elements need to be changed from 100% to calc(100% - 50px). I just added these to custom.css to override what’s in main.css. The only issue is the image is slightly smaller since you’re losing 50px of height.
.camera-popup--camera,
.door-entry-popup--camera,
.iframe-popup--camera {
height: calc(100% - 50px);
}
.camera-popup--iframe,
.door-entry-popup--iframe,
.iframe-popup--iframe {
height: calc(100% - 50px);
}
just wondering is is possible to divide config file into smaller pieces ? currently my config is 3,5k lines long and it would be much more convenient to work with it if I could e.g. have each room in separate file.
Splitting the configuration:
Define vars in separate JS files, then merge them into CONFIG. like this:
{
position: [0, 1],
width: 3,
height: 1,
type: TYPES.CUSTOM,
id: {},
icons: angular.merge(weather_icons,{}),
customHtml: angular.merge(weather_forecast_list_html_lovalace,{}),
provider: 'weather.gismeteo',
forecast_mode: 'hourly',
filters: angular.merge(weather_forecast_list_filters),
},
Hi
I’m looking for a way to open a configurable popup using the action or secondaryAction of any tile. By configurable I mean that the popup layout could contain other tiles, like in door entry tile. Only without the camera component and callable from any tile type.
For example, a long press on a weather tile (over secondaryAction) could open a popup with more detailed weather info. Or a security sensor tile showing if any door or window is currently open (over a template sensor) could open a popup that gives detailed info on every individual window and door status in the house. I’m targeting a phone with this, so screen space is a premium. I’d like to avoid an additional dedicated page for this. And I think that opening additional context sensitive info by long pressing a tile is pretty intuitive.
So anyone know if this can be achieved with stock TileBoard in some way I overlooked, or did anyone implemented this already ? If not I’m going to code it myself, but I’d rather not reinvent the wheel if it was already done
thanks !
Anyone found a way to replace the side/bottm menu buttons from mdi to an actual image ?
(Post Edited)
Found out that the Climate button didnt really worked (unable to set preset_mode on
generic Zwave climate controller and on Sensibo), Not sure if it was done for a specific controller.
Modifications i have done to support a more generic way:
main.js:
$scope.climateFanSpeed = function (item, entity) {
var value = entity.attributes.fan_mode;
return value;
};
$scope.setClimateFanMode = function ($event, item, entity, option) {
$event.preventDefault();
$event.stopPropagation();
sendItemData(item, {
type: "call_service",
domain: "climate",
service: "set_fan_mode",
service_data: {
entity_id: item.id,
fan_mode: option
}
});
$scope.closeActiveSelect();
return false;
};
$scope.setClimateMode = function ($event, item, entity, option) {
$event.preventDefault();
$event.stopPropagation();
sendItemData(item, {
type: "call_service",
domain: "climate",
service: "set_hvac_mode",
service_data: {
entity_id: item.id,
hvac_mode: option
}
});
$scope.closeActiveSelect();
return false;
};
on the index.html
<div ng-if="item.type === TYPES.CLIMATE"
class="item-entity-container">
<div>
<div class="item-button -center-right"
ng-if="entity.attributes.temperature && entity.state !== 'off'"
ng-click="increaseClimateTemp($event, item, entity)">
<i class="mdi mdi-arrow-up-bold"></i>
</div>
<div class="item-button -bottom-right"
ng-if="entity.attributes.temperature && entity.state !== 'off'"
ng-click="decreaseClimateTemp($event, item, entity)">
<i class="mdi mdi-arrow-down-bold"></i>
</div>
</div>
<!-- Climate Mode -->
<div class="item-climate">
<div class="item-climate--mode" ng-if="entity.attributes.temperature"
ng-click="openSelect(item)">
<span ng-bind="climateTarget(item, entity)"></span>
<span ng-if="(_unit = entityUnit(item, entity))"
class="item-climate--target--unit" ng-bind="_unit"></span>
</div>
<div ng-if="selectOpened(item)" class="item-select"
ng-style="itemSelectStyles(entity, entity.attributes.hvac_modes)">
<div class="item-select--option"
ng-repeat="option in entity.attributes.hvac_modes track by $index"
ng-class="{'-active': option === entity.state}"
ng-click="setClimateMode($event, item, entity, option)">
<span ng-bind="option"></span>
</div>
</div>
</div>
<!-- Climate Fan Mode -->
<div class="item-climate--mode" ng-if="entity.attributes.temperature"
ng-click="openSelect(seconditem)">
<span ng-bind="entity.attributes.fan_mode"></span>
</div>
<div ng-if="selectOpened(seconditem)" class="item-select"
ng-style="itemSelectStyles(entity, entity.attributes.fan_modes)">
<div class="item-select--option"
ng-repeat="option in entity.attributes.fan_modes track by $index"
ng-class="{'-active': option === entity.attributes.fan_mode}"
ng-click="setClimateFanMode($event, item, entity, option)">
<span ng-bind="option"></span>
</div>
</div>
</div>
To-Do (If Possible, New to This…)
Rather having a list, It would be nice to do it as Alarm Button
since mdi icons available for all AC Modes, And AC Speeds.
