detail 相关js功能上传

@@ -9,11 +9,15 @@ var $ = require('jquery'),
     box = require('../plugin/box'),
     imgZoom = require('../plugin/imgZoom'),
     tools = require('yoho-tools'),
-    mulLine = require('mlellipsis');
+    mustache = require('mustache'),
+    mulLine = require('mlellipsis'),
+    flip = require("../plugin/flip"),
+    slide = require("../plugin/photoslide");
 
 require('lazyload');
 require('../plugin/slider');
 require('../plugin/comment');
+require('../plugin/content-paging');
 
 exports.init = function() {
     var shareUrl = $(".share").attr("data-link"),
@@ -25,34 +29,58 @@ exports.init = function() {
         data,
         cidNum;
 
-    //底部数据相关变量
-    var adItem = '', //边栏广告
-        sideVideoTpl = '', //边栏视频模板
-        sideVideoData = '', //边栏视频数据
-        sideVideoHtml = '', //边栏视频渲染的html
-        sidePostTpl = '', //边栏relatedpost模板
-        sidePostData = '', //边栏relatedpost数据
-        sidePostHtml = ''; //边栏relatedpost渲染的html
+    //边栏数据相关变量
+    var adItem, //边栏广告
+        sideVideoTpl, //边栏视频模板
+        sideVideoData, //边栏视频数据
+        sideVideoHtml, //边栏视频渲染的html
+        sidePostTpl, //边栏relatedpost模板
+        sidePostData, //边栏relatedpost数据
+        sidePostHtml; //边栏relatedpost渲染的html
 
     //related-post截行相关变量
-    var relatedPost = '',
-        postList = '', //post列表
-        totalLineNum = '', //总行数
-        titleLineNum = '', //title行数
-        subTitleLineNum = ''; //subtitle行数
+    var relatedPost,
+        postList, //post列表
+        totalLineNum, //总行数
+        titleLineNum, //title行数
+        subTitleLineNum; //subtitle行数
 
     //滑出边栏小视频side-video播放区域暂停相关变量
-    var relatedPostsOffsetTop = '',
-        relatedPostsTop = '',
-        relatedPostsMarginLeft = '';
+    var relatedPostsOffsetTop,
+        relatedPostsTop,
+        relatedPostsMarginLeft;
 
     //页面滑动热播位置变化相关变量
-    var detailBodyOffsetTop = '',
-        relatedPostsOffsetHeightTop = '',
-        distance = '',
-        eleTop = '',
-        detailBodyHeight = '';
+    var detailBodyOffsetTop,
+        relatedPostsOffsetHeightTop,
+        distance,
+        eleTop,
+        detailBodyHeight;
 
+    //底部数据相关变量
+    var bottomPostTpl, //底部relatedpost模板
+        bottomPostData, //底部relatedpost数据
+        bottomPostHtml; //底部relatedpost渲染的html
+
+    //态度设置相关变量
+    var exType = 0,
+        isCancel = 0,
+        attitudeData,
+        attitudeDataWowIcon,
+        attitudeWowNum,
+        attitudeDataWtfIcon,
+        attitudeWtfNum,
+        attitudeDataZzzIcon,
+        attitudeZzzNum;
+
+    //兼容视频，IE等相关变量
+    var video,
+        ieVideo,
+        ipadVideo,
+        browser,
+        b_version,
+        version,
+        trim_Version;
 
     //初始化截行插件
     mulLine.init();
@@ -165,8 +193,8 @@ exports.init = function() {
             }
 
             sideVideoHtml = mustache.render(sideVideoTpl, sideVideoData);
-
             $('.detail-side').append($(sideVideoHtml));
+
             if (navigator.userAgent.indexOf('iPad') !== -1) {
                 // 封面视频播放器替换为H5的VIDEO标签
                 if (!!$('.video-area').find('object').size()) {
@@ -186,7 +214,7 @@ exports.init = function() {
             $('.detail-side').append($(sidePostHtml));
 
             //边栏related-post根据行数截取字符
-            relatedPost = relatedPost;
+            relatedPost = $('.side-related-posts');
             postList = relatedPost.find("li");
             if (postList.length > 0) {
                 totalLineNum = 3;
@@ -284,73 +312,333 @@ exports.init = function() {
                 attitude = data.attitude,
                 commentnum = data.commentnum;
 
-            //新品播报
-            var relatedPostItem = '';
-            for (var i = 0; i < relatedPost.length; i++) {
-                if (relatedPost[i].isVideo == true) {
-                    relatedPostItem = '<li>' +
-                        '<a href="' + relatedPost[i].link + '" target="_blank" onclick="relatedClickEvent();">' +
-                        '<div class="pic"><img src="' + relatedPost[i].cover + '" alt="" /><span class="play-icon"></span></div>' +
-                        '<div class="post-title"><h4>' + relatedPost[i].title + '</h4><p>' + relatedPost[i].subtitle + '</p></div>' +
-                        '</a>' +
-                        '</li>';
-                } else {
-                    relatedPostItem = '<li>' +
-                        '<a href="' + relatedPost[i].link + '" target="_blank">' +
-                        '<div class="pic"><img src="' + relatedPost[i].cover + '" alt="" /></div>' +
-                        '<div class="post-title"><h4>' + relatedPost[i].title + '</h4><p>' + relatedPost[i].subtitle + '</p></div>' +
-                        '</a>' +
-                        '</li>';
+            //底部related-post
+            bottomPostTpl = $('#bottom-related-posts').html();
+            bottomPostData = {
+                relatedPost: {
+                    postList: data.related
                 }
-                $(".postslist").append(relatedPostItem);
-
-                //新品播报根据行数截取字符
-                var citems = $(".related-posts li");
-                var totalLineNum = 3;
-                if (citems.length > 0) {
-                    citems.each(function(index, obj) {
-                        var self = $(obj);
-                        var titleLineNum = self.find("h4").getTextLineNumber("title");
-                        var subTitleLineNum = self.find("p").getTextLineNumber("subtitle");
-                        if (titleLineNum > 2) {
-                            self.find("h4").mlellipsis(2);
-                            titleLineNum = 2;
-                        }
-                        if (subTitleLineNum > totalLineNum - titleLineNum) {
-                            self.find("p").mlellipsis(totalLineNum - titleLineNum, "detail");
-                        }
+            }
+            bottomPostHtml = mustache.render(bottomPostTpl, bottomPostData);
+            $('.detail-body').append($(bottomPostHtml));
 
-                    });
-                }
-            };
+            postList = $('.related-posts').find("li");
+            postList.eq(5).nextAll().hide();
+
+            //底部related-post根据行数截取字符
+            if (postList.length > 0) {
+                postList.each(function(index, obj) {
+                    totalLineNum = 3;
+                    titleLineNum = $(obj).find('h3').getTextLineNumber('title');
+                    subTitleLineNum = $(obj).find('p').getTextLineNumber('subtitle');
+                    if (titleLineNum > 2) {
+                        $(obj).find('h3').mlellipsis(2);
+                        titleLineNum = 2;
+                    }
+                    if (subTitleLineNum > totalLineNum - titleLineNum) {
+                        $(obj).find('p').mlellipsis(totalLineNum - titleLineNum, 'detail');
+                    }
+                });
+            }
 
             //上一篇下一篇
-            if (prevnext.prev.title) {
+            if (data.prevnext.prev.title) {
                 $(".news-next-prev .prev").show();
                 $(".news-next-prev .prev").find("a").attr("href", prevnext.prev.link).attr("title", prevnext.prev.title).attr("onclick", "prevOrNextClickEvent();");
             }
-            if (prevnext.next.title) {
+            if (data.prevnext.next.title) {
                 $(".news-next-prev .next").show();
                 $(".news-next-prev .next").find("a").attr("href", prevnext.next.link).attr("title", prevnext.next.title).attr("onclick", "prevOrNextClickEvent();");
             }
 
             //态度
-            if (attitude.userWow > 0) {
+            if (data.attitude.userWow > 0) {
                 $(".stats-btn .wow").addClass("current");
             };
-            if (attitude.userWtf > 0) {
+            if (data.attitude.userWtf > 0) {
                 $(".stats-btn .wtf").addClass("current");
             };
-            if (attitude.userZzz > 0) {
+            if (data.attitude.userZzz > 0) {
                 $(".stats-btn .zzz").addClass("current");
             };
-            setattitude(attitude.wowCount, attitude.zzzCount, attitude.wtfCount);
+            setattitude(data.attitude.wowCount, data.attitude.zzzCount, data.attitude.wtfCount);
 
-            if (commentnum > 0) {
-                $(".comment-num").text(commentnum);
+            if (data.commentnum > 0) {
+                $(".comment-num").text(data.commentnum);
             } else {
-                $(".comment-num").html('<img src="' + YohoConfig.resUrl + '/res/new/boys/images/mobile/comment-mobile.png">');
+                $(".comment-num").html('<img src="' + YohoConfig.resUrl + '/assets/images/mobile/comment-mobile.png">');
             }
         }
     });
-}
\ No newline at end of file
+
+    //态度设置
+    $(".stats-btn").on("click", "li", function() {
+        if ($(this).index() == 3) return;
+        exType = $(this).index() + 1;
+        isCancel = 0;
+
+        if ($(this).hasClass("current")) {
+            isCancel = 1;
+        }
+
+        attitudeData = {
+            id: ajaxParam.id,
+            exType: exType,
+            isCancel: isCancel
+        };
+
+        $.ajax({
+            type: 'POST',
+            url: YohoConfig.mainUrl + '/channel/detail/setattitude',
+            data: attitudeData,
+            dataType: 'json',
+            success: function(response) {
+                $(".stats-btn").find("li").removeClass("current");
+
+                if (response.data.userWow > 0) {
+                    $(".stats-btn .wow").addClass("current");
+                };
+                if (response.data.userWtf > 0) {
+                    $(".stats-btn .wtf").addClass("current");
+                };
+                if (response.data.userZzz > 0) {
+                    $(".stats-btn .zzz").addClass("current");
+                };
+                setattitude(response.data.wowCount, response.data.zzzCount, response.data.wtfCount);
+            }
+        });
+    });
+
+    /*
+     * 态度设置函数
+     * @param：三种态度的数值
+     */
+    function setattitude(wow, zzz, wtf) {
+        attitudeDataWowIcon = $(".stats-btn .wow").find("img");
+        attitudeWowNum = $(".stats-btn .wow").find("i");
+        attitudeDataZzzIcon = $(".stats-btn .zzz").find("img");
+        attitudeZzzNum = $(".stats-btn .zzz").find("i");
+        attitudeDataWtfIcon = $(".stats-btn .wtf").find("img");
+        attitudeWtfNum = $(".stats-btn .wtf").find("i");
+        if (wow == 0) {
+            attitudeDataWowIcon.show();
+            attitudeWowNum.hide();
+        } else {
+            attitudeWowNum.text(wow).show();
+            attitudeDataWowIcon.hide();
+        };
+
+        if (zzz == 0) {
+            attitudeDataZzzIcon.show();
+            attitudeZzzNum.hide();
+        } else {
+            attitudeZzzNum.text(zzz).show();
+            attitudeDataZzzIcon.hide();
+        };
+
+        if (wtf == 0) {
+            attitudeDataWtfIcon.show();
+            attitudeWtfNum.hide();
+        } else {
+            attitudeWtfNum.text(wtf).show();
+            attitudeDataWtfIcon.hide();
+        };
+    }
+
+    //relatedpost的loadmore事件
+    $('.detail-body').on('click.loadMore', '.load-more', function() {
+        $(this).fadeOut(500, function() {
+            $('.related-posts').find('li').show();
+        });
+    })
+
+    //翻转
+    flip.init({
+        wrapClass: ".yohoboy-flip",
+        operate: "mouse"
+    });
+
+    //hr分页
+    $(".detail-body").contentPaging();
+
+    //兼容以前视频视频的大小
+    video = $(".text-body").find("embed");
+    ieVideo = $(".text-body").find("object");
+    ipadVideo = $(".text-body").find("video");
+    if ($(window).width() >= 1200) {
+        video.css({
+            "width": "738px",
+            "height": "415px"
+        });
+        ieVideo.css({
+            "width": "738px",
+            "height": "415px"
+        })
+    } else if ($(window).width() <= 768) {
+        ipadVideo.css({
+            "width": "460px",
+            "height": "259px"
+        });
+        video.css({
+            "width": "460px",
+            "height": "259px"
+        });
+        ieVideo.css({
+            "width": "460px",
+            "height": "259px"
+        });
+    } else {
+        video.css({
+            "width": "630px",
+            "height": "354px"
+        });
+        ieVideo.css({
+            "width": "630px",
+            "height": "354px"
+        });
+    };
+
+    //检测ie版本,ie7/8采用1024分辨率
+    browser = navigator.appName;
+    b_version = navigator.appVersion;
+    version = b_version.split(";");
+    if (version.length > 1) {
+        var trim_Version = version[1].replace(/[ ]/g, "");
+        if (browser == "Microsoft Internet Explorer" && trim_Version == "MSIE8.0" || browser == "Microsoft Internet Explorer" && trim_Version == "MSIE7.0") {
+            ieVideo.css({
+                "width": "630px",
+                "height": "354px"
+            })
+        }
+    }
+
+    //ipad横竖屏切换
+    $(window).resize(function() {
+        clearTimeout(timer);
+        var timer = setTimeout(function() {
+            $(".detail-slide-piclist").slider('resize');
+        }, 0)
+    });
+    slide.initSlide();
+
+    //视频内容右下角浮层小视频同步播放
+    exports.videoMiniPlayer = function() {
+        var videoPlace = $(".detail-video"),
+            videoWrap = $('.video-wrap'),
+            video = videoWrap.find("object"),
+            videoIpad = videoWrap.find("video"),
+            videoHeight,
+            videoOffsetHeight,
+            headerNavHeight,
+            scrollTop,
+            smallVideoMarginLeft;
+
+        if (video.size() > 0) {
+            $(window).on("resize", function() {
+                $(".detail-video").css({
+                    "width": videoIpad.outerWidth(),
+                    "height": videoIpad.outerHeight()
+                })
+            }).resize();
+            videoWrap.addClass("suspend");
+
+            videoHeight = videoWrap.outerHeight();
+            videoOffsetHeight = videoWrap.offset().top;
+            headerNavHeight = $("#minEnterprise").height();
+            scrollTop = videoHeight + videoOffsetHeight - headerNavHeight;
+
+
+            $(window).on("scroll", function() {
+                if ($(window).scrollTop() > scrollTop && !videoWrap.hasClass("current") && !videoWrap.hasClass("close") && !videoWrap.hasClass("suspend") && !videoWrap.hasClass("stop")) {
+                    videoWrap.css("opacity", 0);
+                    videoWrap.addClass("current");
+
+                    smallVideoMarginLeft = $(".detail-container").width() / 2 - videoWrap.outerWidth();
+                    videoWrap.css("margin-left", smallVideoMarginLeft);
+                    videoWrap.animate({
+                        "opacity": 1
+                    }, 1000);
+                } else if ($(window).scrollTop() < scrollTop) {
+                    videoWrap.css("opacity", 1);
+                    videoWrap.removeClass("close").removeClass("current").removeAttr("style");
+                }
+            });
+
+            //小视频关闭按钮
+            $(".video-close-btn").on("click", function() {
+                videoWrap.animate({
+                    "opacity": 0
+                }, 500, function() {
+                    videoWrap.addClass("close").removeClass("current");
+                });
+
+            })
+        }
+    };
+
+
+}
+
+window.updateState = function() {
+    seajs.use("channel/detail", function(detail) {
+        detail.updateLogin();
+    });
+};
+
+
+window.picLimited = function() {
+    seajs.use("jquery/1.8.3/jquery.js", function($) {
+        if ($(".text-body") <= 0) return;
+        $(".text-body").find("img").css("max-width", "700px");
+    });
+};
+
+window.normarlPlayer = function() {
+    seajs.use("jquery/1.8.3/jquery.js", function($) {
+        $(".video-wrap").removeClass("current");
+    });
+};
+
+window.stopPlayer = function() {
+    seajs.use('jquery/1.8.3/jquery.js', function($) {
+        if ($(".video-wrap").hasClass("current")) {
+            $(".video-wrap").animate({
+                "opacity": 0
+            }, 500, function() {
+                $(".video-wrap").addClass("stop").removeClass("current");
+            });
+        } else {
+            $(".video-wrap").addClass("stop").removeClass("current");
+        }
+    });
+};
+
+window.suspendPlayer = function() {
+    seajs.use("jquery/1.8.3/jquery.js", function($) {
+        $(".video-wrap").addClass("suspend");
+    });
+};
+
+window.startPlayer = function() {
+    seajs.use("jquery/1.8.3/jquery.js", function($) {
+        $(".video-wrap").removeClass("stop").removeClass("suspend");
+    });
+};
+
+//视频不能同时播放
+window.thisMovie = function(movieName) {
+    if (navigator.appName.indexOf("Microsoft") != -1) {
+        return window[movieName];
+    } else {
+        return document[movieName];
+    }
+};
+
+window.StopAnotherMovie = function(id) {
+    seajs.use("jquery/1.8.3/jquery.js", function($) {
+        var allVideo = $("body").find("embed");
+        allVideo.each(function() {
+            window.StopMovie();
+        });
+    });
+};
\ No newline at end of file

@@ -7,8 +7,8 @@ var $ = require("jquery"),
     validate = require("./validate"),
     box = require("./box"),
     tools = require("yoho-tools"),
-    tips = require("./tips");
-mustache = require("mustache");
+    tips = require("./tips"),
+    mustache = require('mustache');
 require("./login");
 
 (function(global, undefined) {