I'm working with a react.js project and convert it into a mobile application, that part is ok, the idea is that the app must receive push notifications, once the user clicks the notification, it must change the react route, I've been trying this code but had not success the app doesn't change the route once the user clicks the notification, I had success getting the react-router instance, but i don't know how to use it properly to go to the desired route.
var app = {
initialize: function() {
this.bindEvents();
},
bindEvents: function() {
document.addEventListener('deviceready', this.onDeviceReady, false);
},
onDeviceReady: function() {
var mmjUser=localStorage.getItem("mmj-user");
if (mmjUser !== null) {
var push = PushNotification.init({
"android": {
"senderID": "491359499412",
"forceShow": 'true'
},
"ios": {
"alert": "true",
"badge": "true",
"sound": "true",
"senderID": "491359499412"},
"windows": {}
});
push.on('registration', function(data) {
console.log("registration event");
});
push.on('notification', function(data) {
console.log("notification event");
console.log(JSON.stringify(data));
var reactRouter=require('react-router');
reactRouter.HistoryLocation.replace('/waiting');
push.finish(function () {
console.log('finish successfully called');
});
});
push.on('error', function(e) {
console.log("push error");
});
}
}
};
app.initialize();
this is the reactRouter object that i'm getting
Thanks for your help!
Related
i'm using cordova-plugin-local-notification and I want the notification to trigger on setReminder() function. Please how can I do this
var app = {
// Application Constructor
initialize: function() {
document.addEventListener('deviceready', this.onDeviceReady.bind(this), false);
},
// deviceready Event Handler
//
// Bind any cordova events here. Common events are:
// 'pause', 'resume', etc.
onDeviceReady: function() {
this.receivedEvent('deviceready');
document.getElementById("setreminder").addEventListener("click", setReminder);
cordova.plugins.notification.local.registerPermission(function (granted) {
});
},
// Update DOM on a Received Event
receivedEvent: function(id) {
StatusBar.overlaysWebView(false);
StatusBar.backgroundColorByHexString('#4281F5');
StatusBar.styleDefault();
document.getElementById("setreminder").addEventListener("click", setReminder);
var sound = "js/when.mp3";
var date = new Date();
function setReminder() {
cordova.plugins.notification.local.schedule({
id: 1,
title: "IKD-FAD",
message: "Your Bus Is Almost Here!",
at: date,
sound: sound,
icon: "js/citybus.png"
});
}
}
};
app.initialize();
document.addEventListener("deviceready", ondeviceready, false);
function ondeviceready() {
}
function setReminder(btn) {
navigator.vibrate(1000);
cordova.plugins.notification.local.schedule({
id: 1,
title: btn.dataset.name,
text: "Your Bus Will Be At The Station In " + changedTime + " Minutes",
trigger: { in: btn.dataset.diff, unit: 'minute' },
sound: "file://js/when.mp3",
icon: "file://img/mmArtboard.png"
});
This fixed it for me
I'm in the following scenario: I've to open a page at Toastr notification click.
Consider the popup is shown in the real scenario when a notification arrives from SignalR. In the dojo I've created it's simpler since I've got an object called test
You can reach the dojo here
The code is the following:
$(function () {
var test ={"Message" : "ciao"};
toastr.options.onclick = function(e) {alert(test.Message); }
$('#error').click(function () {
// make it not dissappear
toastr.error("Noooo oo oo ooooo!!!", "Title", {
"timeOut": "0",
"extendedTImeout": "0"
});
});
$('#info').click(function () {
// title is optional
toastr.info("Info Message", "Title");
});
$('#warning').click(function () {
toastr.warning("Warning");
});
$('#success').click(function () {
toastr.success("YYEESSSSSSS");
});
});
I wish to pass the test object as a parameter, not as a global one
Hope it's not too late - but on similar case this helps to me:
toastr.options.onclick = function(e) {alert(this.data.Message); }
$('#error').click(function () {
// make it not dissappear
toastr.error("Noooo oo oo ooooo!!!", "Title", {
"timeOut": "0",
"extendedTImeout": "0",
"data": {"Message": "ciao error"}
});
});
$('#info').click(function () {
// title is optional
toastr.info("Info Message", "Title", {
"data": {"Message": "ciao info"}
});
});
$('#warning').click(function () {
toastr.warning("Warning");
});
$('#success').click(function () {
toastr.success("YYEESSSSSSS");
});
});
http://jsfiddle.net/pyob98fj/
i am trying to register the devuice fror push notification using the phonegap plugin. In the success action of the AJAX i call the registration action but its not alerting the registration ID. can anyone figure out it.
here the index.js
// Begin boilerplate code generated with Cordova project.
var app = {
// Application Constructor
initialize: function () {
this.bindEvents();
},
// Bind Event Listeners
//
// Bind any events that are required on startup. Common events are:
// 'load', 'deviceready', 'offline', and 'online'.
bindEvents: function () {
document.addEventListener('deviceready', this.onDeviceReady, false);
connectionStatus = navigator.onLine ? 'online' : 'offline';
if(connectionStatus !="online")
{
//$.mobile.changePage($("#seconddiv"));
window.location.replace("no-internet.html");
}
},
// deviceready Event Handler
//
// The scope of 'this' is the event. In order to call the 'receivedEvent'
// function, we must explicitly call 'app.receivedEvent(...);'
onDeviceReady: function () {
},
setupPush: function() {
console.log('calling push init');
var push = PushNotification.init({
"android": {
"senderID": "xxxxxxxxx"
},
"ios": {
"sound": true,
"vibration": true,
"badge": true
},
"windows": {}
});
console.log('after init');
push.on('registration', function(data) {
console.log('registration event: ' + data.registrationId);
var oldRegId = localStorage.getItem('registrationId');
if (oldRegId !== data.registrationId) {
// Save new registration ID
localStorage.setItem('registrationId', data.registrationId);
// Post registrationId to your app server as the value has changed
}
alert(localStorage.getItem('registrationId'));
var parentElement = document.getElementById('registration');
var listeningElement = parentElement.querySelector('.waiting');
var receivedElement = parentElement.querySelector('.received');
listeningElement.setAttribute('style', 'display:none;');
receivedElement.setAttribute('style', 'display:block;');
});
push.on('error', function(e) {
console.log("push error = " + e.message);
});
push.on('notification', function(data) {
console.log('notification event');
navigator.notification.alert(
data.message, // message
null, // callback
data.title, // title
'Ok' // buttonName
);
});
}
};
i call the app.setupPush(); inside the ajax success handler
here the signin.js
var KPSCtuts = KPSCtuts || {};
$("#btn-submit").click(function(){
var userName = $("#txt-username").val();
var password = $("#txt-password").val();
//alert(KPSCtuts.Settings.Url);
$("#loaderIcon").show();
$.ajax({
type: 'POST',
dataType: "json",
url: KPSCtuts.Settings.Url,
data:"username=" + userName + "&password=" + password + "&login=",
success: function (resp) {
if (resp.success === true) {
// Create session.
var today = new Date();
var expirationDate = new Date();
expirationDate.setTime(today.getTime() + KPSCtuts.Settings.sessionTimeoutInMSec);
KPSCtuts.Session.getInstance().set({
userProfileModel: resp.userProfileModel,
userId: resp.userId,
userName: resp.userName,
sessionId: resp.sessionId,
expirationDate: expirationDate,
keepSignedIn:$('#chck-rememberme').is(":checked")
});
app.setupPush();
// Go to main menu.
window.location.replace("index.html");
$("#loaderIcon").hide();
return;
} else {
if (resp.extras.msg) {
$("#ctn-err").html("<p>"+resp.extras.msg+"</p>");
$("#dlg-invalid-credentials").show();
$("#ctn-err").addClass("bi-ctn-err").slideDown();
$("#loaderIcon").hide();
}
}
},
error: function (e) {
//$.mobile.loading("hide");
//console.log(e.message);
// TODO: Use a friendlier error message below.
$("#ctn-err").html("<p>1-Oops! KPSCtuts had a problem and could not log you on. Please try again in a few minutes.</p>");
$("#ctn-err").addClass("bi-ctn-err").slideDown();
$("#loaderIcon").hide();
}
});
});
Try the registration code in onDeviceReady function.Registration ID will be same until you uninstall the app.
In HTML:
<body onload="onLoad()">
In Script:
function onLoad()
document.addEventListener("deviceready", onDeviceReady, false);
}
function onDeviceReady() {
var push = PushNotification.init({
"android": {
"senderID": "xxxxxxxxx"
},
"ios": {
"sound": true,
"vibration": true,
"badge": true
},
"windows": {}
});
push.on('registration', function(data) {
console.log('registration event: ' + data.registrationId);
});
push.on('error', function(e) {
console.log("push error = " + e.message);
});
push.on('notification', function(data) {
console.log('notification event');
navigator.notification.alert(
data.message, // message
null, // callback
data.title, // title
'Ok' // buttonName
);
});
}
I'm creating a single-page web app using the Parse JS library, which is an extension of Backbone.
My Router is set up as follows:
var AppRouter = Parse.Router.extend({
routes: {
"": "signup",
"signup": "signup",
"login": "login",
"logout": "logout",
"dashboard": "dashboard",
"history": "history",
"account": "account"
},
initialize: function(options) {
},
login: function() {
this.navigateTo(new LoginView(), false);
},
logout: function() {
Parse.User.logOut();
Parse.history.navigate("signup", true);
},
signup: function() {
this.navigateTo(new SignupView(), false);
},
dashboard: function() {
this.navigateTo(new DashboardView(), true);
},
history: function () {
this.navigateTo(new SentMailView(), true);
},
account: function () {
this.navigateTo(new AccountView(), true);
},
navigateTo: function(view, needsSignedIn) {
if (needsSignedIn && !Parse.User.current()) {
Parse.history.navigate("signup", true);
} else if (!needsSignedIn && Parse.User.current()) {
Parse.history.navigate("dashboard", true);
} else {
this.loadView(view);
}
},
loadView: function(view) {
this.view && (this.view.close ? this.view.close() : delete this);
this.view = view;
}
});
At the end of my main.js, I'm creating a new Router, View, and setting pushState to true:
new AppRouter;
new AppView;
Parse.history.start({pushState: true});
The problem I'm having is that occasionally (often when I first load a page of the app), none of the links work, and all they do is refresh the page. For instance, clicking on a link to '/history' does not load the history page, it just reloads the current page. Similarly, clicking a link to a bootstrap dropdown menu, which is just supposed to trigger a js call, will also reload the current page. Refreshing the browser (via the refresh button) usually fixes this, and then all the links work fine.
Any idea why this is happening?
Fixed it. The issue was being caused by an underlying view that wasn't being properly deleted. This view had a function that was being bound to the "click a" event -- a click on any element. The same function was being bound to click events on all links in the dashboard view, which I did not want.
I'd like to use Linkedin share functionality with my custom button, but the callback function won't be called on success, any idea?
This is my code:
var sh = IN.UI.Share().params(
{
url: "someUrl"
});
sh.success(function(){console.log('Linkedin share success')});
sh.place();
Created a mini-pen which you can view here https://codepen.io/craigiswayne/pen/Bqqbjz
Documentation on this subject can be found here: https://developer.linkedin.com/docs/share-on-linkedin
IN.Event.on(IN, 'systemReady', function() {
var shareLink = document.getElementById('shareLink');
shareLink.onclick = function(){
event.preventDefault();
var params = {
"comment": "Check out developer.linkedin.com! https://www.example.com",
"visibility": {
"code": "anyone"
}
};
IN.API.Raw("/people/~/shares?format=json")
.method("POST")
.body(JSON.stringify(params))
.result(function(xhrResult){
alert('success :)');
})
.error(function(errorObj){
alert('Error');
alert(errorObj.errorMessage);
});
};
});