Skip to content

Commit

Permalink
Likes: move inline js to separate file, enqueued in footer
Browse files Browse the repository at this point in the history 
Makes it easier to manipulate that js later on
Fixes Automattic#868
  • Loading branch information
@jeherve
jeherve committed Aug 8, 2014
1 parent ec822e2 commit 8585077
Show file tree
Hide file tree
Showing 2 changed files with 233 additions and 236 deletions.
237 changes: 1 addition & 236 deletions modules/likes.php
View file
Expand Up @@ -552,6 +552,7 @@ function action_init() {
wp_enqueue_script( 'jquery_inview', plugins_url( '_inc/jquery.inview.js', dirname(__FILE__) ), array( 'jquery' ), JETPACK__VERSION, false );
wp_enqueue_script( 'jetpack_resize', plugins_url( '_inc/jquery.jetpack-resize.js' , dirname(__FILE__) ), array( 'jquery' ), JETPACK__VERSION, false );
wp_enqueue_style( 'jetpack_likes', plugins_url( 'likes/style.css', __FILE__ ), array(), JETPACK__VERSION );
wp_enqueue_script( 'jetpack_likes_queuehandler', plugins_url( 'likes/queuehandler.js' , __FILE__ ), array( 'jquery' ), JETPACK__VERSION, true );

} else {
add_filter( 'post_flair', array( &$this, 'post_likes' ), 30, 1 );
Expand Down Expand Up @@ -795,242 +796,6 @@ function likes_master() {
?>
<iframe src='<?php echo $src; ?>' scrolling='no' id='likes-master' name='likes-master' style='display:none;'></iframe>
<div id='likes-other-gravatars'><div class="likes-text"><?php echo $likersText; ?></div><ul class="wpl-avatars sd-like-gravatars"></ul></div>
<script type="text/javascript">
//<![CDATA[
var jetpackLikesWidgetQueue = [];
var jetpackLikesWidgetBatch = [];
var jetpackLikesMasterReady = false;

function JetpackLikespostMessage( message, target ) {
if ( "string" === typeof message ){
try{
message = JSON.parse( message );
}
catch(e) {
return;
}
}

pm( {
target: target,
type: 'likesMessage',
data: message,
origin: '*'
} );
}

function JetpackLikesBatchHandler() {
var requests = [];
jQuery( 'div.jetpack-likes-widget-unloaded' ).each( function( i ) {
if ( jetpackLikesWidgetBatch.indexOf( this.id ) > -1 )
return;
jetpackLikesWidgetBatch.push( this.id );
var regex = /like-(post|comment)-wrapper-(\d+)-(\d+)-(\w+)/;
var match = regex.exec( this.id );
if ( ! match || match.length != 5 )
return;

var info = {
blog_id: match[2],
width: this.width
};

if ( 'post' == match[1] ) {
info.post_id = match[3];
} else if ( 'comment' == match[1] ) {
info.comment_id = match[3];
}

info.obj_id = match[4];

requests.push( info );
});

if ( requests.length > 0 ) {
JetpackLikespostMessage( { event: 'initialBatch', requests: requests }, window.frames['likes-master'] );
}
}

function JetpackLikesMessageListener( event ) {
if ( "undefined" == typeof event.event )
return;

if ( 'masterReady' == event.event ) {
jQuery( document ).ready( function() {
jetpackLikesMasterReady = true;

var stylesData = {
event: 'injectStyles'
};

if ( jQuery( 'iframe.admin-bar-likes-widget' ).length > 0 ) {
JetpackLikespostMessage( { event: 'adminBarEnabled' }, window.frames[ 'likes-master' ] );

stylesData.adminBarStyles = {
background: jQuery( '#wpadminbar .quicklinks li#wp-admin-bar-wpl-like > a' ).css( 'background' ),
isRtl: ( 'rtl' == jQuery( '#wpadminbar' ).css( 'direction' ) )
};
}

if ( !window.addEventListener )
jQuery( '#wp-admin-bar-admin-bar-likes-widget' ).hide();

stylesData.textStyles = {
color: jQuery( '.sd-text-color').css( 'color' ),
fontFamily: jQuery( '.sd-text-color' ).css( 'font-family' ),
fontSize: jQuery( '.sd-text-color' ).css( 'font-size' ),
direction: jQuery( '.sd-text-color' ).css( 'direction' ),
fontWeight: jQuery( '.sd-text-color' ).css( 'font-weight' ),
fontStyle: jQuery( '.sd-text-color' ).css( 'font-style' ),
textDecoration: jQuery( '.sd-text-color' ).css('text-decoration')
};

stylesData.linkStyles = {
color: jQuery( '.sd-link-color' ).css('color'),
fontFamily: jQuery( '.sd-link-color' ).css('font-family'),
fontSize: jQuery( '.sd-link-color' ).css('font-size'),
textDecoration: jQuery( '.sd-link-color' ).css('text-decoration'),
fontWeight: jQuery( '.sd-link-color' ).css( 'font-weight' ),
fontStyle: jQuery( '.sd-link-color' ).css( 'font-style' )
};

JetpackLikespostMessage( stylesData, window.frames[ 'likes-master' ] );

JetpackLikesBatchHandler();

jQuery( document ).on( 'inview', 'div.jetpack-likes-widget-unloaded', function() {
jetpackLikesWidgetQueue.push( this.id );
});
});
}

if ( 'showLikeWidget' == event.event ) {
jQuery( '#' + event.id + ' .post-likes-widget-placeholder' ).fadeOut( 'fast', function() {
jQuery( '#' + event.id + ' .post-likes-widget' ).fadeIn( 'fast', function() {
JetpackLikespostMessage( { event: 'likeWidgetDisplayed', blog_id: event.blog_id, post_id: event.post_id, obj_id: event.obj_id }, window.frames['likes-master'] );
});
});
}

if ( 'clickReblogFlair' == event.event ) {
wpcom_reblog.toggle_reblog_box_flair( event.obj_id );
}

if ( 'showOtherGravatars' == event.event ) {
var $container = jQuery( '#likes-other-gravatars' );
var $list = $container.find( 'ul' );

$container.hide();
$list.html( '' );

$container.find( '.likes-text span' ).text( event.total );

jQuery.each( event.likers, function( i, liker ) {
$list.append( '<li class="' + liker.css_class + '"><a href="' + liker.profile_URL + '" class="wpl-liker" rel="nofollow" target="_parent"><img src="' + liker.avatar_URL + '" alt="' + liker.name + '" width="30" height="30" style="padding-right: 3px;" /></a></li>');
} );

var offset = jQuery( "[name='" + event.parent + "']" ).offset();

$container.css( 'left', offset.left + event.position.left - 10 + 'px' );
$container.css( 'top', offset.top + event.position.top - 33 + 'px' );

var rowLength = Math.floor( event.width / 37 );
var height = ( Math.ceil( event.likers.length / rowLength ) * 37 ) + 13;
if ( height > 204 ) {
height = 204;
}

$container.css( 'height', height + 'px' );
$container.css( 'width', rowLength * 37 - 7 + 'px' );

$list.css( 'width', rowLength * 37 + 'px' );

$container.fadeIn( 'slow' );

var scrollbarWidth = $list[0].offsetWidth - $list[0].clientWidth;
if ( scrollbarWidth > 0 ) {
$container.width( $container.width() + scrollbarWidth );
$list.width( $list.width() + scrollbarWidth );
}
}
}

pm.bind( 'likesMessage', function(e) { JetpackLikesMessageListener(e); } );

jQuery( document ).click( function( e ) {
var $container = jQuery( '#likes-other-gravatars' );

if ( $container.has( e.target ).length === 0 ) {
$container.fadeOut( 'slow' );
}
});

function JetpackLikesWidgetQueueHandler() {
var wrapperID;
if ( ! jetpackLikesMasterReady ) {
setTimeout( JetpackLikesWidgetQueueHandler, 500 );
return;
}

if ( jetpackLikesWidgetQueue.length > 0 ) {
// We may have a widget that needs creating now
var found = false;
while( jetpackLikesWidgetQueue.length > 0 ) {
// Grab the first member of the queue that isn't already loading.
wrapperID = jetpackLikesWidgetQueue.splice( 0, 1 )[0];
if ( jQuery( '#' + wrapperID ).hasClass( 'jetpack-likes-widget-unloaded' ) ) {
found = true;
break;
}
}
if ( ! found ) {
setTimeout( JetpackLikesWidgetQueueHandler, 500 );
return;
}
} else if ( jQuery( 'div.jetpack-likes-widget-unloaded' ).length > 0 ) {
// Grab any unloaded widgets for a batch request
JetpackLikesBatchHandler();

// Get the next unloaded widget
wrapperID = jQuery( 'div.jetpack-likes-widget-unloaded' ).first()[0].id;
if ( ! wrapperID ) {
// Everything is currently loaded
setTimeout( JetpackLikesWidgetQueueHandler, 500 );
return;
}
}

if ( 'undefined' === typeof wrapperID ) {
setTimeout( JetpackLikesWidgetQueueHandler, 500 );
return;
}

var $wrapper = jQuery( '#' + wrapperID );
$wrapper.find( 'iframe' ).remove();

if ( $wrapper.hasClass( 'slim-likes-widget' ) ) {
$wrapper.find( '.post-likes-widget-placeholder' ).after( "<iframe class='post-likes-widget jetpack-likes-widget' name='" + $wrapper.data( 'name' ) + "' height='22px' width='68px' frameBorder='0' scrolling='no' src='" + $wrapper.data( 'src' ) + "'></iframe>" );
} else {
$wrapper.find( '.post-likes-widget-placeholder' ).after( "<iframe class='post-likes-widget jetpack-likes-widget' name='" + $wrapper.data( 'name' ) + "' height='55px' width='100%' frameBorder='0' src='" + $wrapper.data( 'src' ) + "'></iframe>" );
}

$wrapper.removeClass( 'jetpack-likes-widget-unloaded' ).addClass( 'jetpack-likes-widget-loading' );

$wrapper.find( 'iframe' ).load( function( e ) {
var $iframe = jQuery( e.target );
$wrapper.removeClass( 'jetpack-likes-widget-loading' ).addClass( 'jetpack-likes-widget-loaded' );

JetpackLikespostMessage( { event: 'loadLikeWidget', name: $iframe.attr( 'name' ), width: $iframe.width() }, window.frames[ 'likes-master' ] );

if ( $wrapper.hasClass( 'slim-likes-widget' ) ) {
$wrapper.find( 'iframe' ).Jetpack( 'resizeable' );
}
});
setTimeout( JetpackLikesWidgetQueueHandler, 250 );
}
JetpackLikesWidgetQueueHandler();
//]]>
</script>
<?php
}

Expand Down

0 comments on commit 8585077

Please sign in to comment.