[livejournal] r23377: LJSUP-14180: Replace lj-like buttons wit...

U   trunk/htdocs/js/jquery_fn.js

Modified: trunk/htdocs/js/jquery_fn.js
===================================================================
--- trunk/htdocs/js/jquery_fn.js	2012-11-28 08:38:20 UTC (rev 23376)
+++ trunk/htdocs/js/jquery_fn.js	2012-11-28 10:51:22 UTC (rev 23377)
@@ -454,19 +454,28 @@
 }(jQuery));
 
 /**
- * Parse lj-likes plugin
- * It parses all elements with class 'lj-like', uncomment their content
- * and parse with LiveJournal.parseLikeButtons()
- *
+ * @author Valeriy Vasin (valeriy.vasin@sup.com)
+ * @description Parse lj-likes plugin
+ *              It parses all elements with class 'lj-like', uncomment their content
+ *              and parse with LiveJournal.parseLikeButtons()
  * @todo Move plugin to separate file
  */
 ;(function ($) {
 	'use strict';
 
-	// empty collection that will contain not parsed lj-like elements
-	// that are currently on the page
-	var _likes = $();
+	var
+		/**
+		 * Empty collection that will contain not parsed lj-like elements
+		 * that are currently on the page
+		 */
+		_likes = $(),
 
+		/**
+		 * Placeholder that will be prepended before .lj-like
+		 * Notice: listener for click on it will be on document.body
+		 */
+		_placeholderTemplate = '<div style="height: 25px; background-color: red;" class="lj-likes-placeholder"></div>';
+
 	/**
 	 * Remove comments inside node and parse likes
 	 * @param  {Object} node jQuery node
@@ -532,6 +541,19 @@
 		// handle scroll event, for mobile devices we don't threshold lazyLoad
 		// because it fires only at the end of scrolling (iOS)
 		$(window).on('scroll', LJ.Support.touch ? lazyLoad : LJ.threshold(lazyLoad, 1000));
+
+		/**
+		 * Handle likes placeholder clicks
+		 * @todo Provide setup of click handler only when first
+		 * lj-like with placeholder option found
+		 */
+		$(document.body).on('click', '.lj-likes-placeholder', function () {
+			var placeholder = $(this),
+				likes = placeholder.next();
+
+			placeholder.remove();
+			parse(likes);
+		});
 	});
 
 	$.fn.ljLikes = function (opts) {
@@ -560,6 +582,21 @@
 			this.used = true;
 		});
 
+		// handle likes with placeholder option
+		likes.each(function () {
+			if ( $(this).data('placeholder') ) {
+				$(this).before(_placeholderTemplate);
+
+				// attribute for quick access
+				this.placeholder = true;
+			}
+		});
+
+		likes = likes.filter(function () {
+			return !this.placeholder;
+		});
+
+
 		if ( !opts.lazy ) {
 			// not lazy: immediately parsing
 			likes.each(function () {