/** * Infinite scroll * ½ºÅ©·Ñ¿¡¼­ °¡Àå ¾Æ·¡ÂÊÀ¸·Î ³»·Á°¡¸é µ¥ÀÌÅ͸¦ Ãß°¡·Î ºÒ·¯µéÀδÙ. * * @param {Array} el * @param {Object} options * @return void */ function RGInfiniteScroll(el, options) { var self = this; var eventID = '.rgInfiniteScroll'; var bottomY = 0; // set public values this.$self = $(el); this.sets = $.extend({}, this.defaults, options); this.sets.ajaxOptions = $.extend({}, this.defaults.ajaxOptions, options.ajaxOptions); this.sets.loadOptions = $.extend({}, this.defaults.loadOptions, options.loadOptions); this.current = this.sets.startNumber; /* --------------------------------- PRIVATE FUNCTIONS -------------------------------- */ /** * init scroll event * * @Return void */ var scrollEvent = function() { self.$self.on('scroll' + eventID, function(){ // set bottom y bottomY = $(document).height() - $(window).height() - self.sets.bottomSpace; if ($(window).scrollTop() > bottomY) { // update current number self.current++; // load data if (self.sets.url) { if (self.sets.loadingAction) { self.sets.loadingAction(true); } switch(self.sets.method) { case 'load': self.load(self.current); break; case 'ajax': self.ajax(self.current); break; } } } }); }; /** * change url * ÆäÀÌÁö¹øÈ£¸¦ °»½ÅÇØ¼­ url ÁÖ¼Ò¸¦ ³Ñ°ÜÁØ´Ù. * * @Param {String} url * @Return {String} */ var changeUrl = function(url, n) { return url.replace('{page}', n); }; /* --------------------------------- PUBLIC FUNCTIONS -------------------------------- */ /** * load items (load) * * @Param {Number} n * @Return void */ this.load = function(n) { var options = null; var selector = null; if (this.sets.loadOptions) { options = this.sets.loadOptions; selector = (options.selector) ? ' ' + options.selector : ''; } else { return false; } // stop scroll event self.stop(); // update current this.current += (!n) ? 1 : 0; // n°ªÀÌ ¾øÀ¸¸é this.current¿¡¼­ ÇѰ³ ´õÇÑ´Ù. n = (n) ? n : this.current + 1; // load data $('
').load(changeUrl(this.sets.url, n) + selector, function(data, status){ var more = (status == 'success'); if (self.sets.loadingAction) { self.sets.loadingAction(false); } var $add = $(this).children(); options.target.append($add); if (options.complete) { var result = options.complete($add); more = (result) ? true : false; } if (more) { self.run(); } }); }; /** * load items (ajax) * * @Param {Number} n * @Return void */ this.ajax = function(n) { if (!this.sets.ajaxOptions) return false; // stop scroll event self.stop(); // update current this.current += (!n) ? 1 : 0; // n°ªÀÌ ¾øÀ¸¸é this.current¿¡¼­ ÇѰ³ ´õÇÑ´Ù. n = (n) ? n : this.current; // load data $.ajax({ url : changeUrl(this.sets.url, n) ,cache : false ,data : this.sets.ajaxOptions.data ,dataType : this.sets.ajaxOptions.dataType }).done(function(data, status){ if (self.sets.loadingAction) { self.sets.loadingAction(false); } if (self.sets.ajaxOptions.complete) { var more = self.sets.ajaxOptions.complete(data, status); if (more) { self.run(); } } }); }; /** * run * * @Param {Boolean} sw : RGInfiniteScroll°´Ã¼¸¦ ¸®ÅϹްí½ÍÀ¸¸é true * @Return {RGInfiniteScroll} */ this.run = function(sw) { // stop event this.stop(); // init events scrollEvent(); return (sw) ? this : null; }; /** * stop * * @Return {RGInfiniteScroll} */ this.stop = function() { this.$self.off('scroll' + eventID); }; /** * go to page * * @Param {Number} n : °ªÀÌ ¾øÀ¸¸é Ãʱ⠼³Á¤ÇÑ °ªÀ¸·Î ¼³Á¤ÇÑ´Ù. * @Return void */ this.setPageNumber = function(n) { this.current = (n) ? n : this.sets.startNumber; }; // run event this.run(); } // default values RGInfiniteScroll.prototype.defaults = { bottomSpace : 50 ,url : null ,startNumber : 1 ,method : 'load' ,ajaxOptions : { data : '' ,dataType : '' ,complete : function(data, status) { console.log(data); } } ,loadOptions : { target : null ,selector : '' ,complete : function(data) { console.log(data); return true; } } ,loadingAction : function(sw) { // sw is true are "loading.." // sw is false are "load complete" } } // set jQuery plugin ;(function($) { return $.fn.rgInfiniteScroll = function(options) { return new RGInfiniteScroll($(this), options).run(true); }; })(jQuery);