Jquery social share script

JavaScript
21

Ok, now we’re back to where we were last night.
For whatever reason the jQuery library is not being included in the page when a user logs in.

When I compare the <head> section of the page between a) being not logged in and b) being logged in, the following section is missing (i.e. it is present in case a), but not b))

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
	$('a.login-window').click(function() {
		
		// Getting the variable's value from a link
		var loginBox = this.hash;

		//Fade in the Popup and add close button
		$(loginBox).fadeIn(300);
		
		//Set the center alignment padding + border
		var popMargTop = ($(loginBox).height() + 24) / 2;
		var popMargLeft = ($(loginBox).width() + 24) / 2;
		
		$(loginBox).css({
			'margin-top' : -popMargTop,
			'margin-left' : -popMargLeft
		});
		
		// Add the mask to body
		$('body').append('<div id="mask"></div>');
		$('#mask').fadeIn(300);
		
		return false;
	});
	
	// When clicking on the button close or the mask layer the popup closed
	$('a.close, #mask').live('click', function() {
	  $('#mask , .login-popup').fadeOut(300 , function() {
		$('#mask').remove();
	});
	return false;
	});
	
	$('#navbar_username').focus(function() {
		$('#navbar_username').parent().addClass('active');
	});
	$('#navbar_username').blur(function() {
		$('#navbar_username').parent().removeClass('active');
	});
	$('#navbar_password').focus(function() {
		$('#navbar_password_hint').parent().addClass('active');
	});
	$('#navbar_password').blur(function() {
		$('#navbar_password_hint').parent().removeClass('active');
	});

});
</script>

Can you check the templates and find out where that code is coming form?

22

That’s the headinclude template, it’s wrapped in an ‘if’ conditional

<vb:if condition="$show['guest']"><script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
	$('a.login-window').click(function() {
		
		// Getting the variable's value from a link 
		var loginBox = this.hash;


		//Fade in the Popup and add close button
		$(loginBox).fadeIn(300);
		
		//Set the center alignment padding + border
		var popMargTop = ($(loginBox).height() + 24) / 2; 
		var popMargLeft = ($(loginBox).width() + 24) / 2; 
		
		$(loginBox).css({ 
			'margin-top' : -popMargTop,
			'margin-left' : -popMargLeft
		});
		
		// Add the mask to body
		$('body').append('<div id="mask"></div>');
		$('#mask').fadeIn(300);
		
		return false;
	});
	
	// When clicking on the button close or the mask layer the popup closed
	$('a.close, #mask').live('click', function() { 
	  $('#mask , .login-popup').fadeOut(300 , function() {
		$('#mask').remove();  
	}); 
	return false;
	});
	
	$('#navbar_username').focus(function() {
		$('#navbar_username').parent().addClass('active');
	}); 
	$('#navbar_username').blur(function() {
		$('#navbar_username').parent().removeClass('active');
	}); 
	$('#navbar_password').focus(function() {
		$('#navbar_password_hint').parent().addClass('active');
	}); 
	$('#navbar_password').blur(function() {
		$('#navbar_password_hint').parent().removeClass('active');
	}); 


});
</script>
</vb:if>
23

Ah ha, now we’re getting somewhere.

Could you try moving the jQuery include out of the conditional block.

So it’s like this:

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js"></script>

<vb:if condition="$show['guest']">
<script type="text/javascript">
  $(document).ready(function() {
    $('a.login-window').click(function() {

This should then hopefully mean that jQuery is included on the page whether you are logged in or not.

24

Bingo you nailed it! Thank you Pullo :slight_smile:

Works, logged in or out.

25

Nice one!
I knew we’d get there in the end.
:slight_smile: