NPM react-native-custom-timer-notification - reactjs

Hello friends, I'm in doubt, I was wondering if you guys can help me. I'm doing a project in React Native where I need push notifications to contain a timer/countdown and that they can pause/start tasks and that countdown. It's been a challenge for me. I would like to do as the notifications of the app Pomodoro, which pause tasks through them and warn you how much time is left to finish a task. I found nothing about on the internet
I just found the dependency react-native-custom-timer-notification in the NPM website, if you know any other dependency that you can do that, please pass me
Usage
payload sent will be received when click or canceled
title Title of the notification
body Body of the notification
id unique number
date Time at which zero comes
import { TimerNotification, onEvent } from "react-native-custom-timer-notification";
// ...
// onclick and cancel listner
onEvent(event=>{
console.log(event)
});
// Remove timer
RemoveTimer(160211114);
//Trigger notification
TimerNotification({
payload: JSON.stringify('notificationOpen?.data'),
title: 'My notification',
body: 'Much longer text that cannot fit one line... ',
id: 160211114,
remove: false, // optional
foreground: false,
date: new Date(Date.now() + 20000),
isCountDown: true, // false for positive timer
setCustomContentView:true // optional
});

now react-native-custom-timer-notification v0.8 supports full scale custom notification. i think this might help you in this case. https://www.npmjs.com/package/react-native-custom-timer-notification

Related

Discord.js Bot Status

No, I am not asking how to set my bot's status. I am asking how to make my bot's status change every 5-7 seconds to another status. How would I make this:
client.user.setActivity(`dsc.gg/ultraa | ?help | ${client.guilds.cache.size} servers`, { type: 'WATCHING' });
change every few seconds to be like "It's frosty out there", and "420 servers", and "?help | dsc.gg/ultraa". How would I make those statuses rotate between each other?
Note: This code is for Discord.js V13.3.1
For a rotating status, as you would describe, you would do this by placing some code in the ready event that changes the status after a set period of time. This will require the util package which can be installed using:
npm: npm install util
yarn: yarn install util
Once you have the package installed, you will create a function called wait. It's a simple way to wait without blocking the rest of the script.
const wait = require('util').promisify(setTimeout);
This function will serve our primary purpose, making the delay between switching the statuses. Then, we will use setInterval to continuously loop between the statuses.
<Client>.on('ready', async () => {
// ...
setInterval(async () => {
client.user.setPresence({ activities: [{ name: `Status1`, type: `PLAYING` }] });
await wait(5000); // Wait 5 seconds
client.user.setPresence({ activities: [{ name: `Status2`, type: `PLAYING` }] });
await wait(5000); // Wait 5 seconds
});
});
As you can see, there are two line that repeat themselves. That is: <Client>.user.setPresence(...) and await wait(5000). The wait function will block the status from updating itself too early. You can edit the amount of time set by converting the seconds to milliseconds (5 seconds becomes 5000). The other portion sets the bot's status. The type shows what the bot is doing. The valid values for this are found in the docs. You can simply copy and paste the two lines and add more statuses as needed.
client.user.setPresence({ activities: [{ name: `Status`, type: `PLAYING` }] });
For Simple Status

analytics().logEvent() return null and not tracking the event in console

I want to use firebase analytics in react native. I have added the lib,
but when i use the await analytics().logEvent("event_name") it returns null and event is also not added in firebase analytic console.
Any one have any idea what's wrong?
<Button
title="Add To Basket"
onPress={async () =>
await analytics().logEvent('basket', {
id: 3745092,
item: 'mens grey t-shirt',
description: ['round neck', 'long sleeved'],
size: 'L',
})
}
/>
I had the same issue when I started with analytics.
Firebase says it takes around 24 hours for the events to be visible on console.
Also the logEvent has a return type of void, hence you see null being returned. So don't worry regarding that aspect unless you have an error.
So, I would suggest you to wait for the changes to be reflected.
For Development purposes we would need to see Realtime events, and Firebase has DebugView for that. For details, refer this document:
https://firebase.google.com/docs/analytics/debugview

Request Deferrer with Service Worker in PWA

I am making a PWA where users can answer the forms. I want it to make also offline, so when a user fills out a form and does not have the internet connection, the reply will be uploaded when he is back online. For this, I want to catch the requests and send them when online. I wanted to base it on the following tutorial:
https://serviceworke.rs/request-deferrer_service-worker_doc.html
I have managed to implement the localStorage and ServiceWorker, but it seems the post messages are not caught correctly.
Here is the core function:
function tryOrFallback(fakeResponse) {
// Return a handler that...
return function(req, res) {
// If offline, enqueue and answer with the fake response.
if (!navigator.onLine) {
console.log('No network availability, enqueuing');
return;
// return enqueue(req).then(function() {
// // As the fake response will be reused but Response objects
// // are one use only, we need to clone it each time we use it.
// return fakeResponse.clone();
// });
}
console.log("LET'S FLUSH");
// If online, flush the queue and answer from network.
console.log('Network available! Flushing queue.');
return flushQueue().then(function() {
return fetch(req);
});
};
}
I use it with:
worker.post("mypath/add", tryOrFallback(new Response(null, {
status: 212,
body: JSON.stringify({
message: "HELLO"
}),
})));
The path is correct. It detects when the actual post event happens. However, I can't access the actual request (the one displayed in try or fallback "req" is basically empty) and the response, when displayed, has the custom status, but does not contain the message (the body is empty). So somehow I can detect when the POST is happening, but I can't get the actual message.
How to fix it?
Thank you in advance,
Grzegorz
Regarding your sample code, the way you're constructing your new Response is incorrect; you're supplying null for the response body. If you change it to the following, you're more likely to see what you're expecting:
new Response(JSON.stringify({message: "HELLO"}), {
status: 212,
});
But, for the use case you describe, I think the best solution would be to use the Background Sync API inside of your service worker. It will automatically take care of retrying your failed POST periodically.
Background Sync is currently only available in Chrome, so if you're concerned about that, or if you would prefer not to write all the code for it by hand, you could use the background sync library provided as part of the Workbox project. It will automatically fall back to explicit retries whenever the real Background Sync API isn't available.

Background Geolocation Plugin: Track location and update database every 5 minutes

I'm currently developing a mobile app using AngularJS / Ionic 3.
I need to track at all time, if my users are within a radius of 100m of a certain geolocation (let's call it "Home Location". I need to know at all time which user is at his home location, and who is not (even when the app is running in background or is closed/ terminated).
I thought to realize this, using the Ionic Native Background-Geolocation plugin and the cordova-plugin-background-geolocation. My plan was, to check the users geolocation every 5 minutes and compare it to the home.
Case 1) If the distance between the two locations is < 100m I know the user is "at home". I would then update the user node in my database (Firebase) to mark the user as isAtHome: true and add a current timestamp.
Case 2) If the user is not within 100m of his home location I would mark him as isAtHome: false and add a current timestamp.
I need to update my database even in case the user didn't move, because I need to know that I received a current signal. Otherwise I don't know if he didn't move or turned off his smartphone, for example.
If I want to know, who of my users is at his home location, I would check the isAtHome-attributes and if they are set to true, I would check the timestamp to be sure that I have up-to-date data and the data was written within the last 15 minutes.
I tried many different things, but I'm not sure how to realize this with the Cordova Background Geolocation Plugin and if it's even possible.
My question is:
Is it possible to check the users geolocation every 5 minutes (even in background / terminated state) and call a function that updates my firebase DB accordingly? As described, I need to receive the location even if the user didn't move within the last 5 minutes.
If it isn't possible: Does anybody have an idea, of how to approach the requirements on another way?
Thank you very much for your help!
As described in the cordova-plugin-background-geolocation says, you can configure an interval in milliseconds for the plugin to get the location, see this example from the plugin github page:
backgroundGeolocation.configure(callbackFn, failureFn, {
desiredAccuracy: 10,
stationaryRadius: 20,
distanceFilter: 30,
url: 'http://192.168.81.15:3000/locations',
httpHeaders: { 'X-FOO': 'bar' },
maxLocations: 1000,
// Android only section
locationProvider: backgroundGeolocation.provider.ANDROID_ACTIVITY_PROVIDER,
interval: 60000, // <-- here
fastestInterval: 5000,
activitiesInterval: 10000,
notificationTitle: 'Background tracking',
notificationText: 'enabled',
notificationIconColor: '#FEDD1E',
notificationIconLarge: 'mappointer_large',
notificationIconSmall: 'mappointer_small'
});
The case is this interval property works only for Android. I would sugest a workaround like this:
public getLocation: boolean = true; // CREATE A BOOLEAN TO KNOW IF YOU CAN GET LOCATION
backgroundGeolocation.start( // i've never used this plugin, so i'm assuming this is what starts de background watcher
() => {
if(getLocation == true){
this.getLocation = false; // SET TO FALSE SO IT DON'T DO YOUR FUNCTION THE NEXT TIME IT GETS THE LOCATION
// DO YOUR CODE TO SAVE AND CHECK YOUR DATA
// IT'S BETTER IF YOU USE A PROMISE, ASYNC/AWAIT FOR THE SAVING CODE
yourSavingCodeFunction().then(() => {
setTimeout(()=>{
// AFTER 5 MINUTES, SET THE GETLOCATION TO TRUE SO IT CAN DO YOUR FUNCTION AGAIN
this.getLocation = true;
}, 500000);
});
}
},
(error) => {
// Tracking has not started because of error
// you should adjust your app UI for example change switch element to indicate
// that service is not running
}
);
If you haven't thought about your cases 1 and 2 we can work on this too. Hope this helps or can give you some ideas :D

WMS GetFeatureInfo; multiple layers, different sources

I'm developing a web application using GeoExt, OpenLayers and having my own GeoServer to serve various maps. Still, I want to let the user add other WMS's if needed, to be able to play around with all desired layers.
Thus, my problem with the GetFeatureInfo request. Right now I have a toolbar button attached to geoext's map panel,
new GeoExt.Action({
iconCls: "feature",
map: map,
toggleGroup: "tools",
tooltip: "Feature",
control: featureControl
})
its control attribute being
var featureControl = new OpenLayers.Control.WMSGetFeatureInfo({
queryVisible: true,
drillDown: true,
infoFormat:"application/vnd.ogc.gml"
});
I've also defined an event listener to do what I really want once I receive the responses, but that is not relevant here. My problem is the following:
Considering the user clicks on a point where there are 2+ visible layers and at least one of them is from a different source, OpenLayers will have to do one AJAX request per different source and, from OpenLayers own documentation,
Triggered when a GetFeatureInfo response is received. The event
object has a text property with the body of the response (String), a
features property with an array of the parsed features, an xy property
with the position of the mouse click or hover event that triggered the
request, and a request property with the request itself. If drillDown
is set to true and multiple requests were issued to collect feature
info from all layers, text and request will only contain the response
body and request object of the last request.
so, yeah, it will obviously wont work like that right away. Having a look at the debugger I can clearly see that, giving two layers from different sources, it actually DOES the request, it's just that it doesn't wait for the first's response and jumps for the next one (obviously, being asynchronous). I've thought about doing the requests one-by-one, meaning doing the first one as stated above and once it's finished and the response saved, go for the next one. But I'm still getting used to the data structure GeoExt uses.
Is there any API (be it GeoExt or OpenLayers) option/method I'm missing? Any nice workarounds?
Thanks for reading :-)
PS: I'm sorry if I've not been clear enough, english is not my mother tongue. Let me know if something stated above was not clear enough :)
i Hope this help to someone else, I realized that: you're rigth this control make the request in asynchronous mode, but this is ok, no problem with that, the real problem is when the control handle the request and trigger the event "getfeatureinfo" so, i modified 2 methods for this control and it works!, so to do this i declare the control first, and then in the savage mode i modified the methods here is de code:
getInfo = new OpenLayers.Control.WMSGetFeatureInfo({ drillDown:true , queryVisible: true , maxFeatures:100 });
//then i declare a variable that help me to handle more than 1 request.....
getInfo.responses = [];
getInfo.handleResponse=function(xy, request) { var doc = request.responseXML;
if(!doc || !doc.documentElement) { doc = request.responseText; }
var features = this.format.read(doc);
if (this.drillDown === false) {
this.triggerGetFeatureInfo(request, xy, features);
} else {
this._requestCount++;
this._features = (this._features || []).concat(features);
if( this._numRequests > 1){
//if the num of RQ, (I mean more than 1 resource ), i put the Request in array, this is for maybe in a future i could be need other properties or methods from RQ, i dont know.
this.responses.push(request);}
else{
this.responses = request;}
if (this._requestCount === this._numRequests) {
//here i change the code....
//this.triggerGetFeatureInfo(request, xy, this._features.concat());
this.triggerGetFeatureInfo(this.responses, xy, this._features.concat());
delete this._features;
delete this._requestCount;
delete this._numRequests;
// I Adding this when the all info is done 4 reboot
this.responses=[];
}
}
}
getInfo.triggerGetFeatureInfo= function( request , xy , features) {
//finally i added this code for get all request.responseText's
if( isArray( request ) ){
text_rq = '';
for(i in request ){
text_rq += request[i].responseText;
}
}
else{
text_rq = request.responseText;
}
this.events.triggerEvent("getfeatureinfo", {
//text: request.responseText,
text : text_rq,
features: features,
request: request,
xy: xy
});
// Reset the cursor.
OpenLayers.Element.removeClass(this.map.viewPortDiv, "olCursorWait");}
Thanks, you bring me a way for discover my problem and here is the way i solved, i hope this can help to somebody else.
saheka's answer was almost perfect! Congratulations and thank you, I had the same problem, and with it I finally managed to solve it.
What I would change in your code:
isArray() does not work, change it like this: if(request instanceof Array) {...} at the first line of getInfo.triggerGetFeatureInfo()
to show the results in a popup this is the way:
My code:
getInfo.addPopup = function(map, text, xy) {
if(map.popups.length > 0) {
map.removePopup(map.popups[0]);
}
var popup = new OpenLayers.Popup.FramedCloud(
"anything",
map.getLonLatFromPixel(xy),
null,
text,
null,
true
);
map.addPopup(popup);
}
and in the getInfo.triggerGetFeatureInfo() function, after the last line, append:
this.addPopup(map, text_rq, xy);
A GetFeatureInfo request is send as a JavaScript Ajax call to the external server. So, the requests are likely blocked for security reasons. You'll have to send the requests to the external servers by a proxy on your own domain.
Then, configure this proxy in openlayers by setting OpenLayers.ProxyHost to the proper path. For example:
OpenLayers.ProxyHost = "/proxy_script";
See http://trac.osgeo.org/openlayers/wiki/FrequentlyAskedQuestions#ProxyHost for more background information.

Resources