From d400bc312b72a1380bf3349892416bd39d07e921 Mon Sep 17 00:00:00 2001 From: Matt Bernhardt Date: Tue, 23 Aug 2016 15:52:05 -0400 Subject: [PATCH 01/19] First steps towards building an API harvester --- functions.php | 1 + js/additional-posts.js | 28 ++++++++++++++++++++++++++++ 2 files changed, 29 insertions(+) create mode 100644 js/additional-posts.js diff --git a/functions.php b/functions.php index 464b1bb..a5441b7 100644 --- a/functions.php +++ b/functions.php @@ -37,6 +37,7 @@ function add_styles() { function add_scripts() { wp_enqueue_script( 'lazyload', get_stylesheet_directory_uri() . '/js/lazyload.js', array( 'jquery' ), '', true ); wp_enqueue_script( 'myScripts', get_stylesheet_directory_uri() . '/js/myScripts.js', array( 'lazyload' ), '', true ); + wp_enqueue_script( 'additional-posts', get_stylesheet_directory_uri() . '/js/additional-posts.js', array( 'jquery' ), '', true ); } add_action( 'wp_enqueue_scripts', 'add_scripts' ); diff --git a/js/additional-posts.js b/js/additional-posts.js new file mode 100644 index 0000000..04418a9 --- /dev/null +++ b/js/additional-posts.js @@ -0,0 +1,28 @@ +/*! + * Additional Posts Loader + * + * This is called by markup at the bottom of certain page templates. It then + * polls the WP JSON API for more news stories, and transforms the returned + * JSON objects into rendered HTML. + * + */ + +window.mitlibnews = window.mitlibnews || {}; + +window.mitlibnews.loader = { + + /** + * Initialize + */ + initialize : function() { + console.log('MIT Libraries News Loader initialized'); + }, + + /** + * Post Loader + */ + loadPosts : function() { + console.log('Loading more posts...'); + } + +} From 362a73b8a702d1e59473254aca4a06b417ab5575 Mon Sep 17 00:00:00 2001 From: Matt Bernhardt Date: Thu, 25 Aug 2016 08:46:57 -0400 Subject: [PATCH 02/19] Sets up initialization and first call to load posts --- functions.php | 2 +- js/additional-posts.js | 69 ++++++++++++++++++++++++++++++++++++++++-- js/myScripts.js | 9 ++++-- 3 files changed, 75 insertions(+), 5 deletions(-) diff --git a/functions.php b/functions.php index a5441b7..be8b6e0 100644 --- a/functions.php +++ b/functions.php @@ -36,8 +36,8 @@ function add_styles() { */ function add_scripts() { wp_enqueue_script( 'lazyload', get_stylesheet_directory_uri() . '/js/lazyload.js', array( 'jquery' ), '', true ); - wp_enqueue_script( 'myScripts', get_stylesheet_directory_uri() . '/js/myScripts.js', array( 'lazyload' ), '', true ); wp_enqueue_script( 'additional-posts', get_stylesheet_directory_uri() . '/js/additional-posts.js', array( 'jquery' ), '', true ); + wp_enqueue_script( 'myScripts', get_stylesheet_directory_uri() . '/js/myScripts.js', array( 'lazyload', 'additional-posts' ), '', true ); } add_action( 'wp_enqueue_scripts', 'add_scripts' ); diff --git a/js/additional-posts.js b/js/additional-posts.js index 04418a9..2b74d32 100644 --- a/js/additional-posts.js +++ b/js/additional-posts.js @@ -19,10 +19,75 @@ window.mitlibnews.loader = { }, /** - * Post Loader + * Simple Post Loader */ loadPosts : function() { console.log('Loading more posts...'); - } + $.ajax({ + url: '/news/wp-json/posts', + data: { + filter: { + 'posts_per_page': 9, + 'offset': 10, + } + }, + dataType: 'json', + type: 'GET', + success: function(data) { + console.log(data); + }, + error: function() { + console.log("Error"); + } + }); + }, + + /** + * Load More - Archive + */ + loadArchive : function() { + console.log('Loading Archive posts...'); + $.ajax({ + url: '/news/wp-json/posts', + data: { + filter: { + 'posts_per_page': 9, + 'offset': 10, + } + }, + dataType: 'json', + type: 'GET', + success: function(data) { + console.log(data); + }, + error: function() { + console.log("Error"); + } + }); + }, + + /** + * Load More - Bibliotech Posts + */ + + /** + * Load More - by Category + */ + + /** + * Load More - Event Posts + */ + + /** + * Load More - Generic + */ + + /** + * Load More - News Posts + */ + + /** + * Load More - Search Results + */ } diff --git a/js/myScripts.js b/js/myScripts.js index 7d5ed16..856aab8 100644 --- a/js/myScripts.js +++ b/js/myScripts.js @@ -1,5 +1,3 @@ - - (function($) { //lazy loading @@ -12,6 +10,13 @@ //category force selection of all news $('input:checkbox[id=in-category-43]').attr('checked',true); + // Additional Posts loader + var APloader = window.mitlibnews.loader; + // TODO: is initialization necessary? + APloader.initialize(); + // TODO: add parameters for what type of load, and offset/posts_per_page + APloader.loadPosts(); + })(jQuery); From ccd2dbfea80dc0f2faa66c9b3ca2b4d79d52a77b Mon Sep 17 00:00:00 2001 From: Matt Bernhardt Date: Mon, 29 Aug 2016 16:44:14 -0400 Subject: [PATCH 03/19] More detail in simple loader, improved calling from base script --- js/additional-posts.js | 7 ++++--- js/myScripts.js | 2 +- 2 files changed, 5 insertions(+), 4 deletions(-) diff --git a/js/additional-posts.js b/js/additional-posts.js index 2b74d32..b73f310 100644 --- a/js/additional-posts.js +++ b/js/additional-posts.js @@ -21,19 +21,20 @@ window.mitlibnews.loader = { /** * Simple Post Loader */ - loadPosts : function() { + loadPosts : function(offset, posts_per_page) { console.log('Loading more posts...'); $.ajax({ url: '/news/wp-json/posts', data: { filter: { - 'posts_per_page': 9, - 'offset': 10, + 'posts_per_page': posts_per_page, + 'offset': offset, } }, dataType: 'json', type: 'GET', success: function(data) { + console.log(typeof(data)); console.log(data); }, error: function() { diff --git a/js/myScripts.js b/js/myScripts.js index 856aab8..607835a 100644 --- a/js/myScripts.js +++ b/js/myScripts.js @@ -15,7 +15,7 @@ // TODO: is initialization necessary? APloader.initialize(); // TODO: add parameters for what type of load, and offset/posts_per_page - APloader.loadPosts(); + APloader.loadPosts(10, 9); })(jQuery); From e48e48c8eac3bbc8124d9b1a669c10eb0e71977a Mon Sep 17 00:00:00 2001 From: Matt Bernhardt Date: Mon, 29 Aug 2016 17:32:31 -0400 Subject: [PATCH 04/19] Starts to flesh out a renderer inside success action --- index.php | 2 +- js/additional-posts.js | 14 +++++++++++--- 2 files changed, 12 insertions(+), 4 deletions(-) diff --git a/index.php b/index.php index 535a6b0..f128232 100644 --- a/index.php +++ b/index.php @@ -89,7 +89,7 @@
-
+
" ) ); + $(cardBody).append( document.createTextNode( value.title ) ); + $("#mitlibnews").append( card ); + }); }, error: function() { console.log("Error"); From 4281588737032fedae082122dd80c69621d4e9ee Mon Sep 17 00:00:00 2001 From: Matt Bernhardt Date: Mon, 29 Aug 2016 17:41:47 -0400 Subject: [PATCH 05/19] Adds jshint step to Grunt for testing --- .jshintrc | 24 ++++++++++++++++++++++++ Gruntfile.js | 2 ++ package.json | 1 + tasks/options/jshint.js | 9 +++++++++ 4 files changed, 36 insertions(+) create mode 100644 .jshintrc create mode 100644 tasks/options/jshint.js diff --git a/.jshintrc b/.jshintrc new file mode 100644 index 0000000..82c5d44 --- /dev/null +++ b/.jshintrc @@ -0,0 +1,24 @@ +{ + "curly" : true, + "eqeqeq" : true, + "immed" : true, + "latedef" : true, + "newcap" : true, + "noarg" : true, + "sub" : true, + "undef" : true, + "boss" : true, + "eqnull" : true, + "node" : true, + "es5" : false, + "globals" : { + "it" : false, + "xit" : false, + "describe" : false, + "xdescribe" : false, + "beforeEach" : false, + "afterEach" : false, + "expect" : false, + "spyOn" : false + } +} \ No newline at end of file diff --git a/Gruntfile.js b/Gruntfile.js index 32d98cd..c71da96 100644 --- a/Gruntfile.js +++ b/Gruntfile.js @@ -32,6 +32,8 @@ module.exports = function(grunt) { require('load-grunt-tasks')(grunt); // There are basically three phases of building the production theme: + // 1) Testing / linting + grunt.registerTask('test', ['jshint', ]); // 1) Javascript preparation (concatenating and uglifying scripts) // (coming soon) // 2) Stylesheet preparation (SASS, autoprefixing, and minification) diff --git a/package.json b/package.json index f86127d..6f85f63 100644 --- a/package.json +++ b/package.json @@ -22,6 +22,7 @@ "devDependencies": { "glob": "^7.0.5", "grunt": "^1.0.1", + "grunt-contrib-jshint": "^1.0.0", "grunt-gitinfo": "^0.1.8", "grunt-replace": "^1.0.1" }, diff --git a/tasks/options/jshint.js b/tasks/options/jshint.js new file mode 100644 index 0000000..05590e3 --- /dev/null +++ b/tasks/options/jshint.js @@ -0,0 +1,9 @@ +module.exports = { + all: [ + 'Gruntfile.js', + // 'js/**/*.js', + ], + options: { + jshintrc: '.jshintrc' + } +} From 9cedcd5785cc7605bc8932807ea9a88be2af15f1 Mon Sep 17 00:00:00 2001 From: Matt Bernhardt Date: Tue, 30 Aug 2016 15:45:46 -0400 Subject: [PATCH 06/19] Add render function, postcontent getter/setter, and other details Signed-off-by: Matt Bernhardt --- js/additional-posts.js | 156 ++++++++++++++++++++++++++++++++++++----- 1 file changed, 137 insertions(+), 19 deletions(-) diff --git a/js/additional-posts.js b/js/additional-posts.js index f1efde2..ac43fff 100644 --- a/js/additional-posts.js +++ b/js/additional-posts.js @@ -7,48 +7,66 @@ * */ +var window, document, jQuery; + window.mitlibnews = window.mitlibnews || {}; window.mitlibnews.loader = { + /** + * Properties + */ + container : '', + offset: 0, + page: 1, + postcontent: '', + /** * Initialize */ initialize : function() { - console.log('MIT Libraries News Loader initialized'); + console.log('MIT Libraries News Loader initializing...'); + // Identify container that will receive post cards. + this.container = document.getElementById('mitlibnews-container'); + // The type of query is identified by data attribute on the container. + this.setPostcontent(); + console.log('Initialization complete.'); }, /** * Simple Post Loader */ - loadPosts : function(offset, posts_per_page) { - $.ajax({ + loadPosts : function(posts_per_page) { + console.log('Loading ' + posts_per_page + ' posts'); + console.log('Filter: '); + var filter = { + 'posts_per_page': posts_per_page, + }; + console.log(filter); + jQuery.ajax({ url: '/news/wp-json/posts', data: { - filter: { - 'posts_per_page': posts_per_page, - 'offset': offset, - } + filter: filter, + page: this.page, }, dataType: 'json', type: 'GET', success: function(data) { - $.each(data, function( index, value ) { - card = document.createElement( "div" ); - $(card).addClass( "no-padding-left-mobile col-xs-12 col-xs-B-6 col-sm-6 col-md-4 col-lg-4" ); - cardBody = document.createElement( "div" ); - $(cardBody).addClass( "flex-item blueTop eventsBox no-image" ); - $(card).append( cardBody ); - $(cardBody).append( document.createTextNode( value.ID ) ); - $(cardBody).append( document.createTextNode( "
" ) ); - $(cardBody).append( document.createTextNode( value.title ) ); - $("#mitlibnews").append( card ); + console.log(posts_per_page + ' posts loaded'); + // identify targeted container + var target = window.mitlibnews.loader.getContainer(); + jQuery.each(data, function( index, value ) { + jQuery(target).append( window.mitlibnews.loader.renderCard(value) ); }); + window.mitlibnews.loader.setPage( window.mitlibnews.loader.getPage() + 1); + console.log('New page: '); + console.log(window.mitlibnews.loader.getPage()); }, error: function() { console.log("Error"); } }); + console.log(''); }, /** @@ -56,7 +74,7 @@ window.mitlibnews.loader = { */ loadArchive : function() { console.log('Loading Archive posts...'); - $.ajax({ + jQuery.ajax({ url: '/news/wp-json/posts', data: { filter: { @@ -99,4 +117,104 @@ window.mitlibnews.loader = { * Load More - Search Results */ -} + /** + * Card Renderer + * + * This takes a JSON object representing a post, and returns relevant markup + */ + renderCard : function(post) { + var card, cardBody, cardContainer, cardCategory; + console.log(post); + + // Card outer element + card = document.createElement( 'div' ); + // TODO: Is this string of classes standard? + jQuery(card).addClass( 'no-padding-left-mobile col-xs-12 col-xs-B-6 col-sm-6 col-md-4 col-lg-4' ); + + // Card inner element + cardBody = document.createElement( 'div' ); + // TODO: Is this string of classes standard? + jQuery(cardBody).addClass( 'flex-item blueTop eventsBox no-image' ); + // TODO: need an onClick attribute? + jQuery(card).append( cardBody ); + + // interiorCardContainer + cardContainer = document.createElement( 'div' ); + jQuery(cardContainer).addClass( 'interiorCardContainer' ); + jQuery(cardBody).append( cardContainer ); + + jQuery(cardContainer).append( document.createTextNode( post.ID ) ); + jQuery(cardContainer).append( document.createElement( 'br' ) ); + jQuery(cardContainer).append( document.createTextNode( post.title ) ); + + // category element + cardCategory = document.createElement( 'div' ); + jQuery(cardCategory).addClass( 'category-post' ); + // TODO: Bibliotech class + jQuery(cardBody).append( cardCategory ); + + return card; + }, + + /** + * Get Container + */ + getContainer : function() { + return document.getElementById('mitlibnews-container'); + }, + + /** + * Get Offset + */ + getOffset : function() { + console.log("Retrieving offset value of " + this.offset); + return this.offset; + }, + + /** + * Get Page + */ + getPage : function() { + return this.page; + }, + + /** + * Get Container + */ + getPostcontent : function() { + return this.postcontent; + }, + + /** + * Set Offset + */ + setOffset : function(value) { + console.log("Replacing offset value of " + this.offset + " with " + value); + this.offset = value; + return this.getOffset(); + }, + + /** + * Set Page + */ + setPage : function(value) { + console.log("Replacing page value of " + this.page + " with " + value); + this.page = value; + }, + + /** + * Set Post Content + */ + setPostcontent : function(value) { + // The default value is 'all'. + this.postcontent = 'all'; + // If everything is not set, just use the default. + if ( !this.container || !this.container.dataset || !this.container.dataset.postcontent ) { + console.log( 'Post content attribute not found! Using default value.' ); + return true; + } + // If we're still here, use the real value. + this.postcontent = this.container.dataset.postcontent; + return true; + } +}; From 488bc5511af2858db7f377facbc2f06cfb0bdccc Mon Sep 17 00:00:00 2001 From: Matt Bernhardt Date: Tue, 30 Aug 2016 15:46:13 -0400 Subject: [PATCH 07/19] Add jshint review to additional-posts.js and myScripts.js Signed-off-by: Matt Bernhardt --- tasks/options/jshint.js | 2 ++ 1 file changed, 2 insertions(+) diff --git a/tasks/options/jshint.js b/tasks/options/jshint.js index 05590e3..47a0496 100644 --- a/tasks/options/jshint.js +++ b/tasks/options/jshint.js @@ -2,6 +2,8 @@ module.exports = { all: [ 'Gruntfile.js', // 'js/**/*.js', + 'js/additional-posts.js', + 'js/myScripts.js', ], options: { jshintrc: '.jshintrc' From caf07bf9ee76ed470eba1a5d23114e0171faac00 Mon Sep 17 00:00:00 2001 From: Matt Bernhardt Date: Tue, 30 Aug 2016 15:46:30 -0400 Subject: [PATCH 08/19] Clean myScripts.js, update for new syntaxes Signed-off-by: Matt Bernhardt --- js/myScripts.js | 45 ++++++++++++++++----------------------------- 1 file changed, 16 insertions(+), 29 deletions(-) diff --git a/js/myScripts.js b/js/myScripts.js index 607835a..8da7988 100644 --- a/js/myScripts.js +++ b/js/myScripts.js @@ -1,40 +1,27 @@ +var window, jQuery, APloader; + (function($) { - + //lazy loading - $("img.img-responsive").lazyload({ - effect : "fadeIn", - effectspeed: 450 , - failure_limit: 999999 - }); + $("img.img-responsive").lazyload({ + effect : "fadeIn", + effectspeed: 450 , + failure_limit: 999999 + }); - //category force selection of all news + //category force selection of all news $('input:checkbox[id=in-category-43]').attr('checked',true); // Additional Posts loader - var APloader = window.mitlibnews.loader; + APloader = window.mitlibnews.loader; // TODO: is initialization necessary? APloader.initialize(); // TODO: add parameters for what type of load, and offset/posts_per_page - APloader.loadPosts(10, 9); - -})(jQuery); - - - - - - - - - - - - - - - - - - + APloader.loadPosts(9); + $("#mitlibnews-another").click(function() { + // TODO: read data attribute in 'show more' markup that determines what type of 'more' to show + APloader.loadPosts(9); + }); +})(jQuery); From bbe139313dd231aae5da45b4d12b759483b6c704 Mon Sep 17 00:00:00 2001 From: Matt Bernhardt Date: Tue, 30 Aug 2016 15:47:06 -0400 Subject: [PATCH 09/19] Implement markup on author page for demonstration. --- author.php | 16 +++++++++------- inc/more-posts.php | 6 +++--- 2 files changed, 12 insertions(+), 10 deletions(-) diff --git a/author.php b/author.php index 2b746a8..18efa38 100644 --- a/author.php +++ b/author.php @@ -6,16 +6,17 @@ * @since Twenty Twelve 1.0 */ -get_header(); ?> +get_header(); - +get_template_part( 'inc/sub-header' ); +?> +
-
+ - -
-
+
+
-
+
@@ -143,6 +144,7 @@
+
diff --git a/inc/more-posts.php b/inc/more-posts.php index bf49fcf..6894cbc 100644 --- a/inc/more-posts.php +++ b/inc/more-posts.php @@ -10,8 +10,8 @@
-
- - +
+ +
From aeff83385d8f1b4813da8ac3b31115689df1323c Mon Sep 17 00:00:00 2001 From: Matt Bernhardt Date: Tue, 30 Aug 2016 16:44:17 -0400 Subject: [PATCH 10/19] Empty author template in preparation Signed-off-by: Matt Bernhardt --- author.php | 114 +++-------------------------------------------------- 1 file changed, 6 insertions(+), 108 deletions(-) diff --git a/author.php b/author.php index 18efa38..6ec373c 100644 --- a/author.php +++ b/author.php @@ -34,118 +34,16 @@

' . get_the_author( '', false ) . '' ); ?>

- - - - - ">
- /* - If a user has filled out their description, show a bio on their entries. - - if ( get_the_author_meta( 'description' ) ) : ?> -
-
- -
-
-

-

-
-
- - - -
+
+
- - - - - - -
-
post_type ) { the_field( 'external_link' ); -} else { echo get_post_permalink();} ?>"'> - - - - - - <?php the_title();?> - - - - post_type ) { ?> -

- -

- -

- -

- - - - - - + - - - - -
- -
"; - echo "
 Bibliotech"; - } else { - $category = get_the_category(); - $rCat = count( $category ); - $r = rand( 0, $rCat -1 ); - echo '' . $category[ $r ]->cat_name . ''; - } ?> - - -
-
-
- -
- - - - - - - -
+ - - - -
-
- -
+
From 9d8c792ce9c2c6b1edf135db5ebc16f588190e7f Mon Sep 17 00:00:00 2001 From: Matt Bernhardt Date: Tue, 30 Aug 2016 16:44:40 -0400 Subject: [PATCH 11/19] More fleshing out additional-posts.js Signed-off-by: Matt Bernhardt --- js/additional-posts.js | 82 ++++++++++++++++++++++++------------------ 1 file changed, 48 insertions(+), 34 deletions(-) diff --git a/js/additional-posts.js b/js/additional-posts.js index ac43fff..d9aa412 100644 --- a/js/additional-posts.js +++ b/js/additional-posts.js @@ -38,17 +38,12 @@ window.mitlibnews.loader = { */ loadPosts : function(posts_per_page) { console.log('Loading ' + posts_per_page + ' posts'); - console.log('Filter: '); - var filter = { - 'posts_per_page': posts_per_page, - }; - console.log(filter); + console.log('Query: '); + var query = this.buildQuery(posts_per_page); + console.log(query); jQuery.ajax({ url: '/news/wp-json/posts', - data: { - filter: filter, - page: this.page, - }, + data: query, dataType: 'json', type: 'GET', success: function(data) { @@ -94,28 +89,25 @@ window.mitlibnews.loader = { }, /** - * Load More - Bibliotech Posts - */ - - /** - * Load More - by Category - */ - - /** - * Load More - Event Posts - */ - - /** - * Load More - Generic - */ - - /** - * Load More - News Posts - */ - - /** - * Load More - Search Results + * Build query + * + * This builds the data object used to query the JSON API. */ + buildQuery : function(posts_per_page) { + var query = {}; + var filter = { + 'posts_per_page': posts_per_page, + }; + // If author mode, add that filter + if ( this.postcontent === 'author' ) { + filter.author = this.container.dataset.postauthor; + } + query = { + filter: filter, + page: this.page, + }; + return query; + }, /** * Card Renderer @@ -123,7 +115,7 @@ window.mitlibnews.loader = { * This takes a JSON object representing a post, and returns relevant markup */ renderCard : function(post) { - var card, cardBody, cardContainer, cardCategory; + var card, cardBody, cardContainer, cardCategory, cardTitle, cardLink; console.log(post); // Card outer element @@ -143,9 +135,31 @@ window.mitlibnews.loader = { jQuery(cardContainer).addClass( 'interiorCardContainer' ); jQuery(cardBody).append( cardContainer ); - jQuery(cardContainer).append( document.createTextNode( post.ID ) ); - jQuery(cardContainer).append( document.createElement( 'br' ) ); - jQuery(cardContainer).append( document.createTextNode( post.title ) ); + // Card image + + // Card icon + + // Card title + cardTitle = document.createElement( 'h2' ); + jQuery(cardTitle).addClass( 'entry-title title-post' ); + + // Card link + cardLink = document.createElement( 'a' ); + jQuery(cardLink).attr( 'href', 'http://www.cnn.com' ); + jQuery(cardLink).append( document.createTextNode( post.title ) ); + + // Card excerpt + + // Card dateline + + // Card category + + // Card date + + // Assemble pieces + jQuery(cardTitle).append( cardLink ); + jQuery(cardContainer).append( cardTitle ); + jQuery(cardContainer).append( document.createTextNode( post.excerpt ) ); // category element cardCategory = document.createElement( 'div' ); From 099e6b5af6646b08bdb958d6937cc2f5d8c086b1 Mon Sep 17 00:00:00 2001 From: Matt Bernhardt Date: Wed, 31 Aug 2016 09:04:29 -0400 Subject: [PATCH 12/19] Removes trailing commas, per CodeClimate --- Gruntfile.js | 2 +- tasks/options/jshint.js | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/Gruntfile.js b/Gruntfile.js index c71da96..390254e 100644 --- a/Gruntfile.js +++ b/Gruntfile.js @@ -33,7 +33,7 @@ module.exports = function(grunt) { // There are basically three phases of building the production theme: // 1) Testing / linting - grunt.registerTask('test', ['jshint', ]); + grunt.registerTask('test', ['jshint']); // 1) Javascript preparation (concatenating and uglifying scripts) // (coming soon) // 2) Stylesheet preparation (SASS, autoprefixing, and minification) diff --git a/tasks/options/jshint.js b/tasks/options/jshint.js index 47a0496..c3e42db 100644 --- a/tasks/options/jshint.js +++ b/tasks/options/jshint.js @@ -3,7 +3,7 @@ module.exports = { 'Gruntfile.js', // 'js/**/*.js', 'js/additional-posts.js', - 'js/myScripts.js', + 'js/myScripts.js' ], options: { jshintrc: '.jshintrc' From 8b7554575b27f04514553c76a536b95b65fda920 Mon Sep 17 00:00:00 2001 From: Matt Bernhardt Date: Wed, 31 Aug 2016 14:36:21 -0400 Subject: [PATCH 13/19] Adds detail to card rendering, including jQueryUI Datepicker --- functions.php | 2 +- js/additional-posts.js | 105 ++++++++++++++++++++++++++++++++++------- 2 files changed, 88 insertions(+), 19 deletions(-) diff --git a/functions.php b/functions.php index be8b6e0..15e1af1 100644 --- a/functions.php +++ b/functions.php @@ -36,7 +36,7 @@ function add_styles() { */ function add_scripts() { wp_enqueue_script( 'lazyload', get_stylesheet_directory_uri() . '/js/lazyload.js', array( 'jquery' ), '', true ); - wp_enqueue_script( 'additional-posts', get_stylesheet_directory_uri() . '/js/additional-posts.js', array( 'jquery' ), '', true ); + wp_enqueue_script( 'additional-posts', get_stylesheet_directory_uri() . '/js/additional-posts.js', array( 'jquery', 'jquery-ui-datepicker' ), '', true ); wp_enqueue_script( 'myScripts', get_stylesheet_directory_uri() . '/js/myScripts.js', array( 'lazyload', 'additional-posts' ), '', true ); } add_action( 'wp_enqueue_scripts', 'add_scripts' ); diff --git a/js/additional-posts.js b/js/additional-posts.js index d9aa412..1d6d5a6 100644 --- a/js/additional-posts.js +++ b/js/additional-posts.js @@ -101,11 +101,11 @@ window.mitlibnews.loader = { // If author mode, add that filter if ( this.postcontent === 'author' ) { filter.author = this.container.dataset.postauthor; + } else if ( 'bibliotech' === this.postcontent ) { + query.type = 'bibliotech'; } - query = { - filter: filter, - page: this.page, - }; + query.filter = filter; + query.page = this.page; return query; }, @@ -115,7 +115,14 @@ window.mitlibnews.loader = { * This takes a JSON object representing a post, and returns relevant markup */ renderCard : function(post) { - var card, cardBody, cardContainer, cardCategory, cardTitle, cardLink; + // Main card containers + var card, cardBody, cardContainer, cardFooter; + // Card content elements + var cardTitle, cardLink, cardExcerpt, cardCategory, cardDate, cardDateContainer, cardDateValue, cardImage, cardIcon; + // Bibliotech-specific containers + var cardBibliotechIcon, cardBibliotechInner, cardBibliotechLink; + // Random number + var cardRandomIndex; console.log(post); // Card outer element @@ -128,44 +135,106 @@ window.mitlibnews.loader = { // TODO: Is this string of classes standard? jQuery(cardBody).addClass( 'flex-item blueTop eventsBox no-image' ); // TODO: need an onClick attribute? - jQuery(card).append( cardBody ); // interiorCardContainer cardContainer = document.createElement( 'div' ); jQuery(cardContainer).addClass( 'interiorCardContainer' ); - jQuery(cardBody).append( cardContainer ); // Card image // Card icon // Card title + // There are different classes for spotlights and other cards cardTitle = document.createElement( 'h2' ); jQuery(cardTitle).addClass( 'entry-title title-post' ); + if ( 'spotlights' === post.type ) { + jQuery(cardTitle).addClass( 'spotlights' ); + } else { + jQuery(cardTitle).addClass( 'classCheck' ); + } // Card link + // This is a custom field for spotlight cards, but a post URL otherwise cardLink = document.createElement( 'a' ); - jQuery(cardLink).attr( 'href', 'http://www.cnn.com' ); + if ( 'spotlight' === post.type ) { + // Spotlights link to a custom field + jQuery(cardLink).attr( 'href', post.meta.external_link ); + } else { + jQuery(cardLink).attr( 'href', post.link ); + } jQuery(cardLink).append( document.createTextNode( post.title ) ); // Card excerpt + cardExcerpt = document.createElement( 'div' ); + jQuery(cardExcerpt) + .addClass( 'excerpt-post classCheck' ) + .html( post.excerpt ); + + // Card footer + cardFooter = document.createElement( 'div' ); + jQuery(cardFooter).addClass( 'category-post' ); + + // Card Bibliotech footer + if ( 'bibliotech' === post.type ) { + // Bibliotech icon + cardBibliotechIcon = document.createElement( 'div' ); + // TODO: spelling error + jQuery(cardBibliotechIcon).addClass( 'bilbioImg bilbioTechIcon' ); - // Card dateline + // Bibliotech inner element + cardBibliotechInner = document.createElement( 'div' ); + jQuery(cardBibliotechInner) + .addClass( 'biblioPadding' ) + .append( document.createTextNode( '\u00A0' ) ); - // Card category + // Bibliotech link + cardBibliotechLink = document.createElement( 'a' ); + jQuery(cardBibliotechLink) + .attr( 'href', '/news/bibliotech-index/' ) + .attr( 'title', 'Bibliotech' ) + .append( document.createTextNode( 'Bibliotech' ) ); + } + + // Card category link + cardCategory = document.createElement( 'a' ); + // Pick a random category + cardRandomIndex = Math.floor( Math.random() * post.terms.category.length ); + jQuery(cardCategory) + .attr( 'title', post.terms.category[cardRandomIndex].name ) + .attr( 'href', post.terms.category[cardRandomIndex].link ) + .html( post.terms.category[cardRandomIndex].name ); - // Card date + // Card date container + cardDateContainer = document.createElement( 'span' ); + jQuery(cardDateContainer).addClass( 'mitDate' ); + // Card time + cardDateValue = jQuery.datepicker.formatDate('MM d, yy', new Date( post.modified ) ); + cardDate = document.createElement( 'time' ); + jQuery(cardDate) + .addClass( 'updated' ) + .attr( 'datetime', cardDateValue ) + .append( document.createTextNode( cardDateValue ) ); // Assemble pieces - jQuery(cardTitle).append( cardLink ); + jQuery(card).append( cardBody ); + jQuery(cardBody).append( cardContainer ); + jQuery(cardBody).append( cardFooter ); jQuery(cardContainer).append( cardTitle ); - jQuery(cardContainer).append( document.createTextNode( post.excerpt ) ); + jQuery(cardContainer).append( cardExcerpt ); + jQuery(cardTitle).append( cardLink ); + // If bibliotech, append specific footer + if ( 'bibliotech' === post.type ) { + jQuery(cardFooter).addClass( 'Bibliotech' ); + jQuery(cardFooter).append( cardBibliotechIcon ); + jQuery(cardFooter).append( cardBibliotechInner ); + jQuery(cardBibliotechInner).append( cardBibliotechLink ); + } else { + jQuery(cardFooter).append( cardCategory ); + jQuery(cardFooter).append( cardDateContainer ); + jQuery(cardDateContainer).append( cardDate ); - // category element - cardCategory = document.createElement( 'div' ); - jQuery(cardCategory).addClass( 'category-post' ); - // TODO: Bibliotech class - jQuery(cardBody).append( cardCategory ); + } return card; }, From 076b5e90ca05fd8e27110f3c29769d9454da3b84 Mon Sep 17 00:00:00 2001 From: Matt Bernhardt Date: Wed, 31 Aug 2016 15:01:20 -0400 Subject: [PATCH 14/19] Render card excerpt HTML correctly. --- js/additional-posts.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/js/additional-posts.js b/js/additional-posts.js index 1d6d5a6..6544a9a 100644 --- a/js/additional-posts.js +++ b/js/additional-posts.js @@ -163,7 +163,7 @@ window.mitlibnews.loader = { } else { jQuery(cardLink).attr( 'href', post.link ); } - jQuery(cardLink).append( document.createTextNode( post.title ) ); + jQuery(cardLink).html( post.title ); // Card excerpt cardExcerpt = document.createElement( 'div' ); From 078f83f86aa8d9031e32a2dd9a54fd079bd00ca6 Mon Sep 17 00:00:00 2001 From: Matt Bernhardt Date: Wed, 31 Aug 2016 16:46:02 -0400 Subject: [PATCH 15/19] Adds image and event support to card rendering --- js/additional-posts.js | 61 +++++++++++++++++++++++++++++++++++++++++- 1 file changed, 60 insertions(+), 1 deletion(-) diff --git a/js/additional-posts.js b/js/additional-posts.js index 6544a9a..75650fd 100644 --- a/js/additional-posts.js +++ b/js/additional-posts.js @@ -119,6 +119,7 @@ window.mitlibnews.loader = { var card, cardBody, cardContainer, cardFooter; // Card content elements var cardTitle, cardLink, cardExcerpt, cardCategory, cardDate, cardDateContainer, cardDateValue, cardImage, cardIcon; + var cardEventContainer, cardEventDate, cardEventTime, cardEventDateValue, cardEventTimeValue; // Bibliotech-specific containers var cardBibliotechIcon, cardBibliotechInner, cardBibliotechLink; // Random number @@ -133,7 +134,7 @@ window.mitlibnews.loader = { // Card inner element cardBody = document.createElement( 'div' ); // TODO: Is this string of classes standard? - jQuery(cardBody).addClass( 'flex-item blueTop eventsBox no-image' ); + jQuery(cardBody).addClass( 'flex-item blueTop eventsBox' ); // TODO: need an onClick attribute? // interiorCardContainer @@ -141,6 +142,20 @@ window.mitlibnews.loader = { jQuery(cardContainer).addClass( 'interiorCardContainer' ); // Card image + if ( post.meta.listImg ) { + // Image has been declared + jQuery(cardBody).addClass( 'has-image' ); + cardImage = document.createElement( 'img' ); + jQuery(cardImage) + .attr( 'src', post.meta.listImg) + .attr( 'width', '100%' ) + .attr( 'height', '111' ) + .attr( 'alt', post.title ) + .addClass('img-responsive'); + } else { + // No image + jQuery(cardBody).addClass( 'no-image' ); + } // Card icon @@ -165,6 +180,42 @@ window.mitlibnews.loader = { } jQuery(cardLink).html( post.title ); + // Card event + if ( post.meta.event_date ) { + // The event_date field is stored as YYYYMMDD, which is not a format that js Date objects can parse + // So we do this ourselves, remembering that month is zero-based. + cardEventDateValue = new Date( + post.meta.event_date.substring(0,4), + post.meta.event_date.substring(4,6) - 1, + post.meta.event_date.substring(6,8) + ); + // Event container + cardEventContainer = document.createElement( 'div' ); + jQuery(cardEventContainer) + .addClass( 'events classCheck' ) + .html( '' ); + // Event date + cardEventDate = document.createElement( 'span' ); + jQuery(cardEventDate) + .addClass( 'event' ) + .append( document.createTextNode( jQuery.datepicker.formatDate('MM d, yy', new Date( cardEventDateValue ) ) ) ); + // Event time + cardEventTimeValue = ''; + if ( post.meta.event_start_time ) { + cardEventTimeValue += post.meta.event_start_time; + } + if ( post.meta.event_start_time && post.meta.event_end_time ) { + cardEventTimeValue += ' - '; + } + if ( post.meta.event_end_time ) { + cardEventTimeValue += post.meta.event_end_time; + } + cardEventTime = document.createElement( 'span' ); + jQuery(cardEventTime) + .addClass( 'time' ) + .html( cardEventTimeValue ); + } + // Card excerpt cardExcerpt = document.createElement( 'div' ); jQuery(cardExcerpt) @@ -220,7 +271,15 @@ window.mitlibnews.loader = { jQuery(card).append( cardBody ); jQuery(cardBody).append( cardContainer ); jQuery(cardBody).append( cardFooter ); + if ( post.meta.listImg ) { + jQuery(cardContainer).append( cardImage ); + } jQuery(cardContainer).append( cardTitle ); + if ( post.meta.event_date ) { + jQuery(cardContainer).append( cardEventContainer ); + jQuery(cardEventContainer).append( cardEventDate ); + jQuery(cardEventContainer).append( cardEventTime ); + } jQuery(cardContainer).append( cardExcerpt ); jQuery(cardTitle).append( cardLink ); // If bibliotech, append specific footer From f9513ec2aa1a07c5470c744aff4d227c2ac8592f Mon Sep 17 00:00:00 2001 From: Matt Bernhardt Date: Thu, 1 Sep 2016 12:53:09 -0400 Subject: [PATCH 16/19] Cause 'show more' button to change when end of list is reached --- inc/more-posts.php | 2 +- js/additional-posts.js | 15 ++++++++++++++- 2 files changed, 15 insertions(+), 2 deletions(-) diff --git a/inc/more-posts.php b/inc/more-posts.php index 6894cbc..c6b4b51 100644 --- a/inc/more-posts.php +++ b/inc/more-posts.php @@ -12,6 +12,6 @@
- +
diff --git a/js/additional-posts.js b/js/additional-posts.js index 75650fd..794e4b8 100644 --- a/js/additional-posts.js +++ b/js/additional-posts.js @@ -47,7 +47,11 @@ window.mitlibnews.loader = { dataType: 'json', type: 'GET', success: function(data) { - console.log(posts_per_page + ' posts loaded'); + console.log(posts_per_page + ' posts requested'); + console.log(data.length + ' posts received'); + if ( data.length < posts_per_page) { + window.mitlibnews.loader.hideMore(); + } // identify targeted container var target = window.mitlibnews.loader.getContainer(); jQuery.each(data, function( index, value ) { @@ -56,6 +60,7 @@ window.mitlibnews.loader = { window.mitlibnews.loader.setPage( window.mitlibnews.loader.getPage() + 1); console.log('New page: '); console.log(window.mitlibnews.loader.getPage()); + }, error: function() { console.log("Error"); @@ -298,6 +303,14 @@ window.mitlibnews.loader = { return card; }, + /** + * Hide "Show more" button + */ + hideMore : function() { + jQuery("#mitlibnews-another").remove(); + jQuery("#mitlibnews-nomore").attr('style', ''); + }, + /** * Get Container */ From 90a17ba6dc75ecb4862a4324eb65b31f04fb0c81 Mon Sep 17 00:00:00 2001 From: Matt Bernhardt Date: Thu, 1 Sep 2016 13:33:20 -0400 Subject: [PATCH 17/19] Changes 'show more' button to just disappear at the end --- inc/more-posts.php | 3 +-- js/additional-posts.js | 1 - 2 files changed, 1 insertion(+), 3 deletions(-) diff --git a/inc/more-posts.php b/inc/more-posts.php index c6b4b51..a218486 100644 --- a/inc/more-posts.php +++ b/inc/more-posts.php @@ -11,7 +11,6 @@
- - +
diff --git a/js/additional-posts.js b/js/additional-posts.js index 794e4b8..0546fc1 100644 --- a/js/additional-posts.js +++ b/js/additional-posts.js @@ -308,7 +308,6 @@ window.mitlibnews.loader = { */ hideMore : function() { jQuery("#mitlibnews-another").remove(); - jQuery("#mitlibnews-nomore").attr('style', ''); }, /** From 12c24929348557473fb86278d45ab318fb541565 Mon Sep 17 00:00:00 2001 From: Matt Bernhardt Date: Thu, 1 Sep 2016 14:23:18 -0400 Subject: [PATCH 18/19] Adds uglify step to grunt build, renames a few properties --- Gruntfile.js | 6 +++--- functions.php | 6 +++--- js/{additional-posts.js => mitlibnews-more.js} | 0 js/{myScripts.js => mitlibnews.js} | 0 package.json | 1 + tasks/options/jshint.js | 5 ++--- tasks/options/uglify.js | 10 ++++++++++ 7 files changed, 19 insertions(+), 9 deletions(-) rename js/{additional-posts.js => mitlibnews-more.js} (100%) rename js/{myScripts.js => mitlibnews.js} (100%) create mode 100644 tasks/options/uglify.js diff --git a/Gruntfile.js b/Gruntfile.js index 390254e..62eacdd 100644 --- a/Gruntfile.js +++ b/Gruntfile.js @@ -32,15 +32,15 @@ module.exports = function(grunt) { require('load-grunt-tasks')(grunt); // There are basically three phases of building the production theme: - // 1) Testing / linting + // 0) Testing / linting grunt.registerTask('test', ['jshint']); // 1) Javascript preparation (concatenating and uglifying scripts) - // (coming soon) + grunt.registerTask('javascript', ['uglify']); // 2) Stylesheet preparation (SASS, autoprefixing, and minification) // (coming soon) // 3) Appending the most recent git commit to the theme version grunt.registerTask('release', ['gitinfo', 'replace']); // The default task performs all three phases. - grunt.registerTask('default', ['release']); + grunt.registerTask('default', ['test', 'javascript', 'release']); }; diff --git a/functions.php b/functions.php index 15e1af1..a03f24a 100644 --- a/functions.php +++ b/functions.php @@ -32,12 +32,12 @@ function add_styles() { add_action( 'wp_enqueue_scripts', 'add_styles' ); /** - * Add LazyLoad and MyScripts for all users + * Add LazyLoad and MITLibNews for all users */ function add_scripts() { wp_enqueue_script( 'lazyload', get_stylesheet_directory_uri() . '/js/lazyload.js', array( 'jquery' ), '', true ); - wp_enqueue_script( 'additional-posts', get_stylesheet_directory_uri() . '/js/additional-posts.js', array( 'jquery', 'jquery-ui-datepicker' ), '', true ); - wp_enqueue_script( 'myScripts', get_stylesheet_directory_uri() . '/js/myScripts.js', array( 'lazyload', 'additional-posts' ), '', true ); + wp_enqueue_script( 'mitlibnews-more', get_stylesheet_directory_uri() . '/js/build/mitlibnews-more.min.js', array( 'jquery', 'jquery-ui-datepicker' ), '', true ); + wp_enqueue_script( 'mitlibnews', get_stylesheet_directory_uri() . '/js/build/mitlibnews.min.js', array( 'lazyload', 'mitlibnews-more' ), '', true ); } add_action( 'wp_enqueue_scripts', 'add_scripts' ); diff --git a/js/additional-posts.js b/js/mitlibnews-more.js similarity index 100% rename from js/additional-posts.js rename to js/mitlibnews-more.js diff --git a/js/myScripts.js b/js/mitlibnews.js similarity index 100% rename from js/myScripts.js rename to js/mitlibnews.js diff --git a/package.json b/package.json index 6f85f63..421a17b 100644 --- a/package.json +++ b/package.json @@ -23,6 +23,7 @@ "glob": "^7.0.5", "grunt": "^1.0.1", "grunt-contrib-jshint": "^1.0.0", + "grunt-contrib-uglify": "^2.0.0", "grunt-gitinfo": "^0.1.8", "grunt-replace": "^1.0.1" }, diff --git a/tasks/options/jshint.js b/tasks/options/jshint.js index c3e42db..d098c68 100644 --- a/tasks/options/jshint.js +++ b/tasks/options/jshint.js @@ -1,9 +1,8 @@ module.exports = { all: [ 'Gruntfile.js', - // 'js/**/*.js', - 'js/additional-posts.js', - 'js/myScripts.js' + 'js/mitlibnews.js', + 'js/mitlibnews-more.js' ], options: { jshintrc: '.jshintrc' diff --git a/tasks/options/uglify.js b/tasks/options/uglify.js new file mode 100644 index 0000000..b4f728d --- /dev/null +++ b/tasks/options/uglify.js @@ -0,0 +1,10 @@ +module.exports = { + build: { + src: 'js/mitlibnews.js', + dest: 'js/build/mitlibnews.min.js' + }, + loadMore: { + src: 'js/mitlibnews-more.js', + dest: 'js/build/mitlibnews-more.min.js' + } +} \ No newline at end of file From 66a4cbda6b670290baa7ae9704afdca3846ee069 Mon Sep 17 00:00:00 2001 From: Matt Bernhardt Date: Thu, 1 Sep 2016 15:41:36 -0400 Subject: [PATCH 19/19] Adds LazyLoad to the NPM build process --- functions.php | 2 +- js/lazyload.js | 15 --------------- package.json | 1 + tasks/options/uglify.js | 4 ++++ 4 files changed, 6 insertions(+), 16 deletions(-) delete mode 100644 js/lazyload.js diff --git a/functions.php b/functions.php index a03f24a..023a134 100644 --- a/functions.php +++ b/functions.php @@ -35,7 +35,7 @@ function add_styles() { * Add LazyLoad and MITLibNews for all users */ function add_scripts() { - wp_enqueue_script( 'lazyload', get_stylesheet_directory_uri() . '/js/lazyload.js', array( 'jquery' ), '', true ); + wp_enqueue_script( 'lazyload', get_stylesheet_directory_uri() . '/js/build/jquery.lazyload.min.js', array( 'jquery' ), '', true ); wp_enqueue_script( 'mitlibnews-more', get_stylesheet_directory_uri() . '/js/build/mitlibnews-more.min.js', array( 'jquery', 'jquery-ui-datepicker' ), '', true ); wp_enqueue_script( 'mitlibnews', get_stylesheet_directory_uri() . '/js/build/mitlibnews.min.js', array( 'lazyload', 'mitlibnews-more' ), '', true ); } diff --git a/js/lazyload.js b/js/lazyload.js deleted file mode 100644 index 3e4a5f4..0000000 --- a/js/lazyload.js +++ /dev/null @@ -1,15 +0,0 @@ -(function($,window,document,undefined){var $window=$(window);$.fn.lazyload=function(options){var elements=this;var $container;var settings={threshold:0,failure_limit:0,event:"scroll",effect:"show",container:window,data_attribute:"original",skip_invisible:true,appear:null,load:null,placeholder:"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsQAAA7EAZUrDhsAAAANSURBVBhXYzh8+PB/AAffA0nNPuCLAAAAAElFTkSuQmCC"};function update(){var counter=0;elements.each(function(){var $this=$(this);if(settings.skip_invisible&&!$this.is(":visible")){return;} -if($.abovethetop(this,settings)||$.leftofbegin(this,settings)){}else if(!$.belowthefold(this,settings)&&!$.rightoffold(this,settings)){$this.trigger("appear");counter=0;}else{if(++counter>settings.failure_limit){return false;}}});} -if(options){if(undefined!==options.failurelimit){options.failure_limit=options.failurelimit;delete options.failurelimit;} -if(undefined!==options.effectspeed){options.effect_speed=options.effectspeed;delete options.effectspeed;} -$.extend(settings,options);} -$container=(settings.container===undefined||settings.container===window)?$window:$(settings.container);if(0===settings.event.indexOf("scroll")){$container.bind(settings.event,function(){return update();});} -this.each(function(){var self=this;var $self=$(self);self.loaded=false;if($self.attr("src")===undefined||$self.attr("src")===false){if($self.is("img")){$self.attr("src",settings.placeholder);}} -$self.one("appear",function(){if(!this.loaded){if(settings.appear){var elements_left=elements.length;settings.appear.call(self,elements_left,settings);} -$("").bind("load",function(){var original=$self.attr("data-"+settings.data_attribute);$self.hide();if($self.is("img")){$self.attr("src",original);}else{$self.css("background-image","url('"+original+"')");} -$self[settings.effect](settings.effect_speed);self.loaded=true;var temp=$.grep(elements,function(element){return!element.loaded;});elements=$(temp);if(settings.load){var elements_left=elements.length;settings.load.call(self,elements_left,settings);}}).attr("src",$self.attr("data-"+settings.data_attribute));}});if(0!==settings.event.indexOf("scroll")){$self.bind(settings.event,function(){if(!self.loaded){$self.trigger("appear");}});}});$window.bind("resize",function(){update();});if((/(?:iphone|ipod|ipad).*os 5/gi).test(navigator.appVersion)){$window.bind("pageshow",function(event){if(event.originalEvent&&event.originalEvent.persisted){elements.each(function(){$(this).trigger("appear");});}});} -$(document).ready(function(){update();});return this;};$.belowthefold=function(element,settings){var fold;if(settings.container===undefined||settings.container===window){fold=(window.innerHeight?window.innerHeight:$window.height())+$window.scrollTop();}else{fold=$(settings.container).offset().top+$(settings.container).height();} -return fold<=$(element).offset().top-settings.threshold;};$.rightoffold=function(element,settings){var fold;if(settings.container===undefined||settings.container===window){fold=$window.width()+$window.scrollLeft();}else{fold=$(settings.container).offset().left+$(settings.container).width();} -return fold<=$(element).offset().left-settings.threshold;};$.abovethetop=function(element,settings){var fold;if(settings.container===undefined||settings.container===window){fold=$window.scrollTop();}else{fold=$(settings.container).offset().top;} -return fold>=$(element).offset().top+settings.threshold+$(element).height();};$.leftofbegin=function(element,settings){var fold;if(settings.container===undefined||settings.container===window){fold=$window.scrollLeft();}else{fold=$(settings.container).offset().left;} -return fold>=$(element).offset().left+settings.threshold+$(element).width();};$.inviewport=function(element,settings){return!$.rightoffold(element,settings)&&!$.leftofbegin(element,settings)&&!$.belowthefold(element,settings)&&!$.abovethetop(element,settings);};$.extend($.expr[":"],{"below-the-fold":function(a){return $.belowthefold(a,{threshold:0});},"above-the-top":function(a){return!$.belowthefold(a,{threshold:0});},"right-of-screen":function(a){return $.rightoffold(a,{threshold:0});},"left-of-screen":function(a){return!$.rightoffold(a,{threshold:0});},"in-viewport":function(a){return $.inviewport(a,{threshold:0});},"above-the-fold":function(a){return!$.belowthefold(a,{threshold:0});},"right-of-fold":function(a){return $.rightoffold(a,{threshold:0});},"left-of-fold":function(a){return!$.rightoffold(a,{threshold:0});}});})(jQuery,window,document); \ No newline at end of file diff --git a/package.json b/package.json index 421a17b..41b63a9 100644 --- a/package.json +++ b/package.json @@ -28,6 +28,7 @@ "grunt-replace": "^1.0.1" }, "dependencies": { + "jquery-lazyload": "^1.9.7", "load-grunt-tasks": "^3.5.0" } } diff --git a/tasks/options/uglify.js b/tasks/options/uglify.js index b4f728d..9c432a1 100644 --- a/tasks/options/uglify.js +++ b/tasks/options/uglify.js @@ -6,5 +6,9 @@ module.exports = { loadMore: { src: 'js/mitlibnews-more.js', dest: 'js/build/mitlibnews-more.min.js' + }, + lazyLoad: { + src: 'node_modules/jquery-lazyload/jquery.lazyload.js', + dest: 'js/build/jquery.lazyload.min.js' } } \ No newline at end of file