framework7 Login page - javascript

I am trying to redirect my app at the beginning if a var is present on LocalStorage. If not then the user should fill the login page. Success at login and the user is redirected to page2.html
Tried with window.location.href and it doesn't work.
Can someone please help me with his matter?
Thanks

var app = new Framework7({
on: {
pageInit: function() {
if(localStorage.loggedIn != 1 || localStorage.loggedIn == 'undefined'){
//not logged in , redirect to login page
this.router.navigate('/login-screen-page/');
}else{
// Login
this.router.navigate('/dashboard-page/');
}
}
}
});

Change this.router.navigate('/login-screen-page/'); to app.views.main.router.navigate("/login-screen-page/")

Related

Authenticate on button click using jQuery

So I am stuck on a specific piece and I can't seem to figure it out, so what I'm attempting to do is that I have a button and when it's clicked, it will open the link in the window and the users will authenticate and then it will redirect back to the page with a code from Instagram.
What I'm attempting to do:
When someone clicks on the #insta-auth button, it will open the getAuthentication function link in the same tab.
So let's say that window.location.origin is https://test.com/, the Instagram URL will return it as https://test.com/?code=debsfbdfb.
For some reason, I attempted onclick="" and $().onClick and nothing has worked so far, all help would be appreciated!
The snippet shows the button.
// Setup out Instagram object
var FHInstagram = window.FHInstagram || {};
FHInstagram.name = "";
FHInstagram.version = "2.0.0";
(function ($, window, document, undefined) {
// Define our Instagram object
const Instagram = {
APP_ID: '32222516',
API_URL: 'https://graph.instagram.com/',
API_OAUTH: 'https://api.instagram.com/oauth/authorize',
API_OAUTH_TOKEN_URL: 'https://api.instagram.com/oauth/access_token',
API_FIELDS: 'caption,media_url,media_type,permalink,timestamp,username',
// Authenticate Instagram
getAuthentication: function () {
return "https://api.instagram.com/oauth/authorize?client_id=" + this.APP_ID + "&redirect_uri=" + window.location.origin + "&scope=user_profile,user_media&response_type=code";
},
};
})(jQuery, window, document);
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<button id="insta-authenticate">Authenticate Instagram</button>
$('#insta-authenticate').on('click', function() {
-- do your instagram stuff here, getAuthentication();
}

How to get the web page to redirect?

The thing is that is not working is that the page does not redirect to another page, weather if it is wrong or right. I want the page to redirect to another page if the user guesses the generated word right.
you just need to preventDefault the form submission,
use this code to prevent it
document.querySelector('form').addEventListener('submit', (e) => {
e.preventDefault();
})
function myFunction() {
if (document.getElementById("Enter_the_word").value == "KEYBOARD") {
location.href = 'index4.html';
} else {
location.href = "index.html";
}
}
Your code has no issues but please try this reversed condition. If it helps you.
MY EDITED CODE BELOW -----------------
var answerArr = ['KEYBOARD','MATH','FOOTBALL'];
if(answerArr.includes('MATH')){
location.href = 'index4.html';
}else{
location.href = 'index4.html';
}
Like this

How banking application logout if user submit valid URL from address bar

I need to logout an user if he/she tries to submit any valid URL from the address bar?
I tried jQuery on items below but it is not working.
window.location.href
window.unload
unload code
(window).unload(
function(event) {
//code to handle
});
location href code
(function() //create a scope so 'location' is not global
{ var location = window.location.href;
setInterval(function()
{
if(location != window.location.href)
{
location = window.location.href;
window.location.changed(location);
}
}, 1000);
}
)();
window.location.changed = function(e)
{ console.log(e);//outputs http://newhref.com
//this is fired when the window changes location
}

Posting facebook status

I'm trying to figure out how to use PhantomJS. I wrote the script below to try and automate posting a Facebook status. As far as I'm aware, the script isn't even logging in, which I'm unsure why. My code is below:
var page = require('webpage').create();
page.open('https://www.facebook.com/', function() {
page.includeJs("//code.jquery.com/jquery-1.11.0.min.js", function() {
page.evaluate(function() {
// Login
$('#email').val('email_here'); // Set email
$('#pass').val('password_here'); // Set PW
$('#u_0_4').click();
// Set status
$('#u_0_1p').val('123');
$('#u_0_1f').submit();
});
phantom.exit()
});
});
I'm not sure why the script won't work, or even to get some sort of error message output so I can figure out why my script isn't working.
Here is code for Loging in facebook i have written this in javascript it login's and takes a screen shot of your facebook home page..
var page = require('webpage').create();
var fillLoginInfo = function(){
var frm = document.getElementById("login_form");
frm.elements["email"].value = 'your fb email/username';
frm.elements["pass"].value = 'password';
frm.submit();
}
page.onLoadFinished = function(){
if(page.title == "Welcome to Facebook - Log In, Sign Up or Learn More"){
page.evaluate(fillLoginInfo);
return;
}
else
page.render('./screens/some.png');
console.log("completed");
phantom.exit();
}
page.open('https://www.facebook.com/');
Find this on Github: https://github.com/manishjo/Automation/blob/master/facebook_automation/fbScreenshot.js
Still trying to find out after login how to Post msg.
Thanks,
Manish Joshi

FB.login pop up is blocked when page on load

I'm facing an issue when calling FB.login when page on load, the FB.login pop up is block by the browser. Currently I know I've to call FB.login after a user click event but I've to do it this way due to the business logic from client.
FB.api('/me/permissions', function(response2) {
var permsArray = response2.data[0];
var permsNeeded = ["user_events"];
var permsToPrompt = [];
for (var i in permsNeeded) {
if (permsArray[permsNeeded[i]] == null) {
permsToPrompt.push(permsNeeded[i]);
}
}
if (permsToPrompt.length > 0) {
promptForPerms(permsToPrompt);
}
});
var promptForPerms = function(perms) {
FB.login(function(response) {
}, {scope: perms.join(',')});
};
Is there any solution to call FB.login() without user click event? Or is there any tweak for this? Appreciate for the help.
You're not going to be able to code your way around the popup blocker, unfortunately.
The way to solve this is by redirecting the user to the Facebook permissions dialog when the page loads as described in the docs for manually building a login flow.
You first need to detect if the user is authenticated / connected with your application already and only redirect if they are not connected. This is best done in the window.fbAsyncInit function like this:
window.fbAsyncInit = function() {
var myAppID = 'YOUR APPLICATION ID';
FB.init({ appId: myAppID });
FB.getLoginStatus(function(response) {
if ('connected' != response.status) {
window.location.href = 'https://www.facebook.com/dialog/oauth' +
'?client_id=' + myAppID +
'&scope=user_events' +
'&redirect_uri=' + encodeURIComponent(document.URL);
} else {
alert('welcome to my app');
}
});
};
The other option is to adjust your user journey slightly; perhaps if the user is not connected then you could display an overlay with a message asking them to authenticate and a button which when clicked calls FB.login.

Categories

Resources