I made a google Smart Home able to control a water heater pump with google smarthome touch control. What it need to control is desired temperature and mode (on off).
I was not able to make that work with the "heater" device so instead I use the "thermostat" device.
Everything work except one thing : the temperature range.
In my onSync request I enter a range between 60F° and 104F°, but it doesn't work on the device.
My min is 50F° and My max is 90F°
Here my onSync request.
function onSync(firebaseRef) { return async (body, headers) => {
return {
requestId: body.requestId,
payload: {
agentUserId: uId,
devices: [{
id: pId,
type: 'action.devices.types.THERMOSTAT',
traits: [
'action.devices.traits.TemperatureSetting',
],
name: {
defaultNames: ['My Heat Pump'],
name: 'Heat Pump',
nicknames: ['Pump'],
},
deviceInfo: {
manufacturer: 'test',
model: '1',
hwVersion: '1.0',
swVersion: '1.0.1',
},
willReportState: true,
attributes: {
// TemperatureSetting
availableThermostatModes: 'off,heat',
thermostatTemperatureRange: {
minThresholdCelsius: 15.555,
maxThresholdCelsius: 40.0
},
thermostatTemperatureUnit: 'F'
},
}],
},
};
}
}
Do you know how to get the good temperature range ?
Bonus : It is possible to have a temperature touch control working with something else like a heater ?
I had this answer from u/devunwired on Reddit:
In my onSync request I enter a range between 60F° and 104F°, but it
doesn't work on the device.
This is a known issue that the Google Home app does not currently render the temperature range provided (the value is respected in voice
queries). You can follow (and start) the feature request here:
b/154169625
Permalink: https://www.reddit.com/r/GoogleAssistantDev/comments/guoyih/temperaturesetting_temperature_range/fskfx4f/
Related
My situation is the following:
I have an array of game objects stored as an atom, each game in the array is of the same type and structure.
I have another atom which allows me to store the id of a game in the array that has been "targeted".
I have a selector which I can use to get the targeted game object by searching the array for a match between the game ids and the targeted game id I have stored.
Elsewhere in the application the game is rendered as a DOM element and calculations are made which I want to use to update the data in the game object in the global state.
It's this last step that's throwing me off. Should my selector be writable so I can update the game object? How do I do this?
This is a rough outline of the code I have:
export const gamesAtom = atom<GameData[]>({
key: 'games',
default: [
{
id: 1,
name: 'Bingo',
difficulty: 'easy',
},
{
id: 21,
name: 'Yahtzee',
difficulty: 'moderate',
},
{
id: 3,
name: 'Twister',
difficulty: 'hard',
},
],
});
export const targetGameIdAtom = atom<number | null>({
key: 'targetGameId',
default: null,
});
export const targetGameSelector = selector<GameData | undefined>({
key: 'targetGame',
get: ({ get }) => {
return get(gamesAtom).find(
(game: GameData) => game.id === get(selectedGameIdAtom)
);
},
// This is where I'm getting tripped up. Is this the place to do this? What would I write in here?
set: ({ set, get }, newValue) => {},
});
// Elsewhere in the application the data for the targetGame is pulled down and new values are provided for it. For example, perhaps I want to change the difficulty of Twister to "extreme" by sending up the newValue of {...targetGame, difficulty: 'extreme'}
Any help or being pointed in the right direction will be appreciated. Thanks!
I need quick help with React and Express. I have an array of data at my express server and fetched with react hooks useEffect. Currently, the response shows all the data on the same page, I want to display only 4 items per page? My React component has useState, useEffect and the JSX as normal. See my code below from Express. Any kind of help will be nice, thanks.
An array of data on Express server:
app.get('/api/surveyoptions', (req, res) => {
const surveyOptions = [
// { id: 5, title: "How often do you eat meat and dairy?" },
{ id: 1, name: "diet", label: "daily1", value: "daily1"},
{ id: 2, name: "diet", label: "daily2", value: "daily2" },
{ id: 3, name: "diet", label: "daily3", value: "daily3" },
{ id: 4, name: "diet", label: "daily4", value: "daily4" },
{ id: 5, name: "diet", label: "daily5", value: "daily5"},
{ id: 6, name: "diet", label: "daily6", value: "daily6" },
{ id: 7, name: "diet", label: "daily7", value: "daily7" },
{ id: 8, name: "diet", label: "daily8", value: "daily8" }
]
res.json(surveyOptions)
})
Not sure what your backend setup is and what database you're using, but in general you do something like this:
On frontend you make a request to the api, including the number of the page you need as a query parameter (e.g. you request '/api/surveyoptions?page=3').
*There are different styles of pagination: some prefer page number, some limit/offset. It really depends on the backend/database/etc. For short explanation of each style you can check this django-rest-framefork doc for example.
Server reads query params, finds pagination-related ones (e.g. we sent page=3, now server knows that we want the 3rd page of results), paginates results and send it back to the client. Server also should know how many items per page you want, or it could be a constant (e.g. always 10 items per page). Applying to your example, server would split surveyOptions array into chunks (10 items per chunk), and send you the 3rd one.
In react you store the page number in state, update it when user selects another page and sent along with the request as described in the first step.
i have the next datalayer of purchase to send google analytics:
dataLayer.push({
'event': 'ActivarTransaccion',
'ecommerce': {
'purchase': {
'actionField': {
'id': '46234462',
'affiliation': '001000',
'revenue': 189,
'tax': 0.00
},
'products': [{
'id': 'PGA720084778',
'name': 'PGA720084778',
'category': 'category',
'price': 189,
'brand': 'brand',
'quantity': 1,
'dimension1': '',
'dimension2': 'K 1200',
'dimension3': 'GT',
'dimension4': '',
'dimension5': 'A',
'dimension6': 'dim',
'dimension7': 'dim',
'dimension8': 'date',
'dimension9': 'moto',
'dimension10': 'cp',
'metric2': '42',
'metric3': '22',
'metric4': '10',
'metric5': '10',
'metric6': '189'
}]
}
}
});
However, the data is not sending to google analytics to register ecommerce, what is wrong, could you help me?
The code looks like it fires correctly. The data layer itself doesn't send to Google Analytics, so have you checked how your Google Tag Manager configuration is set up? The way this is structured here would mean that an event tag would send the data.
Creating a tag like below would tell the tag to fire on the 'ActivarTransaccion' data layer event and to use the data layer for the ecommerce information.
Tag type : Universal Analytics
Track type : Event (then add cat, action, label)
Enable Enhanced Ecommerce Features: true
Use Data Layer: true
Trigger: event equals ActivarTransaccion (custom event trigger)
Once that is complete and tested in the GTM debug mode, you will also have to enable Enhanced Ecommerce in the view by going to Admin > View Column > Enhanced Ecommerce Settings > Enable Ecommerce and Enable Enhanced Ecommerce.
If these are already done, the next step would be to check the logic on the site that dynamically pushes this code.
I'm using FineUploader in my React app to upload files to Azure Blob Storage. I'm currently using validation to make sure a user can only upload one file. I now want to add two more validations:
I want to allow only JPG and PNG files
I also want to make sure that the pixel size of the file user can upload must be at least 300x300 pixels. In other words, I want to impose both width and height requirements
How do I add these validations? Do I need a validation property inside options for each requirement or do they go into the existing one? My current validation looks like this:
// Omitted for brevity
constructor(props) {
super(props);
this.uploader = new FineUploaderAzure({
options: {
cors: {
expected: true,
sendCredentials: false
},
signature: {
endpoint: "some-url.com"
},
request: {
endpoint: "my-container-url"
},
validation: {
multiple: false
}
},
callbacks: {
onError: function (id, name, errorReason, xhrOrXdr) {
}
}
})
}
Assume react/fine-uploader don't change it, by Documentation, you should do it like this.
options: {
multiple: false,
cors: {
expected: true,
sendCredentials: false
},
signature: {
endpoint: "some-url.com"
},
request: {
endpoint: "my-container-url"
},
validation: {
allowedExtensions: ['jpeg', 'jpg', 'png'],
image:{
minHeight: 300,
minWidth: 300
}
}
}
PS. I didn't use fineuploader in react, so please see if this is working as well in react.
Answer to update
In case you want to have your own validation, first of all you should not use onError.
onError is invoked if and only if error occurs. You validate the image size, though the image doesn't match your criteria, it is NOT error.
Then you have two choice to do your validation, that depends on what effect you want. First you need to know the flow of events. It is:
onSubmit -> validation -> onValidate
The work (check is image or not) you most likely want can be done on both three places.
If you want it in the validation, then the answer I provided already made it (allowedExtensions: ['jpeg', 'jpg', 'png']). But let's say you want to make some customization of alert or other checking, you need to do it in onValidate.
callbacks:{
onValidate: function(data, button_container) {
console.log(data); //data.name && data.size
return false;
}
}
But please be reminded that in onValidate, you can only get back file name and file size, no other information.
If you want to also check the width & height, you probably need to take a look on this SO question (give OP a upvote if you find this is what you want.)
Following instructions as per Layers Simple example on tut: http://tombatossals.github.io/angular-leaflet-directive/#!/examples/layers-simple
Inclusion of below successfully loads on page, yet icon in top right to toggle different layers is not produced. No direction provided on repo as to ensure that it is produced.
$scope.layers = {
baselayers: {
osm: {
name: 'OpenStreetMap',
url: 'http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png',
type: 'xyz'
},
mapbox_light: {
name: 'Foo',
url: 'http://{s}.basemaps.cartocdn.com/light_nolabels/{z}/{x}/{y}.png',
type: 'xyz'
}
}
},
That seems to be a bug in the current 0.8.1 version of angular-leaflet-directive. Today I had the same problem. Going back to 0.7.15 and Layer Control is visible again.