Link to fancybox content - javascript

Not quite sure how to explain this the best way, but i'll give it a go!
I have a php site that uses Fancybox. At the moment, if anyone clicks Login, an overlay appears with the login form. If someone clicks to post a new listing and they're not logged in, I'd like the fancybox overlay to appear again, allowing a user to login.
At the moment, I have a couple lines of php code that check if a session is active - if not, it redirects to a login page, I want this to activate a fancybox popup with the login form... if possible?
I'm not sure how best to achieve this? Any help would be awesome! :)

I'm not sure what programing language you are writing in besides jQuery, but a high-level solution might be to drop a cookie when the user logs in. Then, when they click to post a new listing, check for that cookie. If it's there, let them post. If not show the login window. Here's some pseudo code using the jQuery.Cookie plugin:
$(function(){
$('.login-button').click(function(){
//send login info via ajax
$(this).hide("slow",function(){
// drop a cookie
$.cookie( 'login', '1', { expires: 1, path: '/' } );
});
});
// When the post button is clicked, check for the cookie
// If there's no cookie, show the login box
$('.post-button').click(function(){
if( $.cookie('Login') === null ) {
$("#login-box").fancybox();
} else {
// do nothing
}
});
});

There can be multiple ways of doing so.
First of all, how are you identifying that someone is logged in? Suppose if I can do so with an if condition:
if(user==null) {
//no login
}
I can trigger the click of anchor link for LOGIN and thus, open the fancybox again.
if(user==null) {
$("a#login").trigger('click');
}
Hope it gives you some help.

Related

execute logout url in background

I´m working in a platform based on chamilo LMS. To run properly when the user logged in, a login is made with chamilo in the background using a hidden iframe, now I want to do the logout is similar idea, But I don´t want that the user knows he is logged in chamilo. I have the path to make de logout, Firstly I try with a hidden iframe but didn´t work because the path is from an input. Now I try using $.get('path'); but the console returns error for CORS policy. If anyone knows a solution for this or other ideas would be great.
My actual code is:
$('#logout').ready(function() {
$('#logout').click(function(e){
e.preventDefault();
$.get("logout pat");
});
});
As with login and due to CORS, you will need to blindly load the logout path using a hidden iframe:
$(function() {
$('#logout').click(function(e){
e.preventDefault();
$(`<iframe id="logout-frame" src="${logoutPath}" />`)
.css({display: 'none'})
.appendTo($('body'));
// Remove iframe after 500ms
setTimeout(() => $('#logout-frame').remove(), 500);
});
});

Detect if tag is in URL and then remove hidden class

I have a form on my contract form, which submits to a third party site and then I can define a URL to return the user to. I currently return the user to the same /contact page but I wanted to give them a message that it had submitted (since ajax forms don't work with the third party) and I don't want to have a whole page for it.
Therefore I had the idea to return the user to /contact#thanks
I have some code on my site which goes like this:
<div id="alert" class="hidden">Form Submitted. We will reply soon.</div>
Now I want a small bit of javascript on my page which detects if the URL has the #thanks tag on it, as above, and then removes the hidden class from my alert div. Is javascript able to detect this and if so, how do I go about it?
Include jquery and script. I test and work
$(document).ready(function(){
if(window.location.hash) {
$("#alert").show()
}
});
Siii = Yes use hash
I'm not totally sure that I've understood what are you trying to achieve, but this might help you:
if (window.location.hash === '#thanks') {
document.getElementById('alert').classList.remove('hidden');
}

call php function when browser back button clicked

How can I call a PHP Function when Browser Back button clicked or right click then clicked BACK item then prevent page to redirect to login page when user is still logged-in.
I found this (Pressing back button redirects the logged user to log out?) to prevent page to redirect to other page when user clicked browser back button and user is still logged in, but I didn't know where to put those codes and how to call that function.
Can someone explain this thoroughly to accomplish my problem or provide some DEMO(JSFiddle) for better understanding?
You could use a header redirect on the login page to check if the user is logged in, but this will have to be called before any page data is sent:
if(isset($_SESSION['username'])){
header("Location: home.php");
}
You can try to use this:
jQuery(document).ready(function($) {
if (window.history && window.history.pushState) {
window.history.pushState('forward', null, './#forward');
$(window).on('popstate', function() {
alert('Back button was pressed.'); //here you know that the back button is pressed
});
}
});
You can find the answer Here
What this does, it checks with JS if the back button was pushed and if so, you can perform whatever action you want. If a redirect is what you need, use window.location = "http://www.yoururl.com"; OR window.navigate("http://www.yoururl.com"); //works only with IE
Alternatively, you can place an jquery ajax call there, that sends posted requests back to a certain page, and you can check them like:
if(isset($_POST['ajax_response_from_js_script']) {
//call PHP function
}
Hope it helps!
Keep on coding!
Ares.

javascript login popup in opencart

Friends I am having a strange issue with no idea what went wrong.
my company asked me to show a opopup with login options in opencart i.e. user cant browse products unless he/she register or login.
i used the following script to do that
ISSUE
it works fine once or twice after that the popup shows blank.
Codes
<script type="text/javascript">
$(document).ready(function(){
$("#logpop").append('<div id="loginbox" class="loginbox"></div>');var a=$("#welcome a").first().html();
$("#welcome a").first().html('<span class="login"></span>');$("#welcome a .login").html(a);-1!=$("#welcome a[href]").first().attr("href").indexOf("register")?($("#loginbox").load("index.php?route=account/login .right form"), $("#loginbox").css("right","50px")):
($("#loginbox").load("index.php?route=account/account #content"),$("#loginbox").css("right","40px"));
$("#welcome > a .login").live("hover",function(){$("#welcome").addClass("active");$("#loginbox .breadcrumb").remove();$("#loginbox h1").remove();});
});
$(document).ready(function(){
-1==$(location).attr("href").indexOf("account/logout")&&$.cookie("url",$(location).attr("href"));$("#welcome a").first().removeAttr("href");$("#logpop").first().css("display","none");$("#login_dimming").first().css("display","none");
});
</script>
friends can you please help me fix this problem
Instead of doing this via JS I'd suggest implementing a preAction that will check whether the user is logged-in and if not, it will redirect to the login/register screen.
How to implement a preAction: look into index.php where a preAction for maintenance mode is registered:
// Maintenance Mode
$controller->addPreAction(new Action('common/maintenance'));
You can add a new one:
// Logged-in user required
$controller->addPreAction(new Action('common/login'));
and then of course look into the catalog/controller/common/maintenance.php to see how it is done. You can implement something similar in Your new catalog/controller/common/login.php:
<?php
class ControllerCommonLogin extends Controller {
public function index() {
if (!$this->customer->isLogged()) {
return $this->forward('account/login');
}
}
}
This is much easier, more MVC and better way of checking whether user is logged-in before he can start shopping.

jqm data-rel="back" issue

imagine the following scenario:
i have a jquery-mobile formular, it´s results are linking to its resultpage.
on the resultpage i have this back button:
this works fine to just update the content and keep the submitted form data,
but
what if a user came from a search-engine or similiar extern link, then my back button links back to the searchengine/externLink .
so how do i Differentiate between those who came from my form or anywhere else in a jqm-way ?
i have a "start-search-page" i would love to link to if the user didn´t came from the search and i don´t want to miss the ajax-link from my search to the resultpage, use the same button and idealy i don´t have to set any cookie.
is there any hint or smarter attempt than check the server url from document.referrer ?
thanks in advance
You can check current page url using below code:
var prevUrl = $.mobile.activePage.data('url');
in case u want to perform different actions based on previous URL.
then on save the URL in the global javascript variable and on click of the button check the previous URL and do the your functionality. eg
Before Navigating to page:
var prevUrl = $.mobile.activePage.data('url');
on click of button:
if (prevUrl=="myurl") {
//do something
$.mobile.changePage('#search')
}
else {
$.mobile.changePage('#nothing')
}

Categories

Resources