tag.js 4.38 KB
/**
 * tag相关js
 * @author: yue.liu@yoho.cn
 * @date;2015/3/31
 */

var $ = require('jquery'),
    ellipsis = require('mlellipsis'),
    Mustache = require('mustache'),
    timer = null;

require('lazyload');

/**
 * 初始化页面加载时的文字截取和图片懒加载功能
 */
exports.init = function() {
    var tpl;
    //相关文章截取文字
    ellipsis.init();

    clearTimeout(timer);

    timer = setTimeout(function(){
        $('.tag-text').each(function() {
            $(this).mlellipsis(2);
        });
    }, 0);
    
    $(function() {
        var $tagList = $('#tag-list'),
            $loadMore = $('#load-more-info'),
            $loadStatus = $loadMore.children('.status'),
            $noMore = $loadStatus.filter('.no-more'),
            $loading = $loadStatus.filter('.loading'),
            winH = $(window).height(),
            loadMoreH = $loadMore.height(),
            canScroll = true,
            dataEnd = false;
        
        //请求相关数据
        var page = 1,
            query = $('#query').val(),
            gender = $('#gender').val();
        
        //定位登录提示相关变量
        var $loginTip = $('#login-tip'),
    		winW,
    		tipH,
    		tipW;
        //定位登录提示
    	winW = $(window).width();
    	
    	tipH = $loginTip.height();
    	tipW = $loginTip.width();
    	
    	$loginTip.css({
    		top: (winH - tipH) / 2,
    		left: (winW - tipW) / 2
    	});
        
        //读取模板
        $.get('/common/matchtpl', function(data) {
            tpl = data.data;
            Mustache.parse(tpl);
        });
        
        //文章点赞
        $('#container').delegate('.like-btn', 'touchstart', function(e) {
            var $cur = $(e.currentTarget),
                $info = $cur.closest('.tag-content'),
                id = $info.data('id');
                
            $.ajax({
                type: 'GET',
                url: '/favorite/praise',
                data: {
                    id: id
                }
            }).then(function(data) {
                if (data.code === 200) {
                    $cur.toggleClass('like');
                    //更新点赞数
                    $cur.next('span.like-count').text(data.data);
                } else if (data.code === 400) {
                    //提示登录信息
                    $('#login-tip').fadeIn(500, function() {
                        setTimeout(function() {
                           $('#login-tip').fadeOut(500);
                        }, 1000);
                    });
                }
            });
        });
        
        
       $(window).scroll(function() {
           var setting;
           
           if (!canScroll) {
               return;
           }
           
           if ($(window).scrollTop() + winH >= $(document).height() - loadMoreH) {
               if (!dataEnd) {
                   setting = {
                       page: page++,
                       query: query,
                       gender: gender
                   };
                   
                   canScroll = false;
                   $.ajax({
                       type: 'GET',
                       url: '/tag/loadMatchs',
                       data: setting
                   }).then(function(data) {
                       var html = '',
                           res,
                           i;
                       
                       if (data.success) {
                           if (data.end) {
                               dataEnd = true;
                               
                               $loading.addClass('hide');
                               $noMore.removeClass('hide');
                           }
                           
                           res = data.data;
                           for (i = 0; i < res.length; i++) {
                               html += Mustache.render(tpl, res[i]);
                           }
                           if (html !== '') {
                               $tagList.append(html);

                                //lazyload 不包含src即未加载的图片
                                $('img.lazy').lazyload({
                                    container: $tagList
                                });
                           }
                           canScroll = true;
                       }
                   });
               }
           }
       })
    });
};