zoukankan      html  css  js  c++  java
  • 老版本订阅

    /*

     *    subscription
     *  by sunhw
     *
     *  参数:
     *
     *  example:
     *  <a href="###" class="wor-rss tool-subscription" data-listid="1" data-listtit="{data.channel.title}" data-listpic="http://www.fun.tv/img/1.jpg" title="">订阅</a>
     *  .subscriptioned 为已订阅状态
     *  .subnum 为订阅数 <b class="subnum">12121</b>

     *  订阅接口:
     *  http://api.fun.tv/ajax/subscribe/add/$id
     *  http://api.fun.tv/ajax/subscribe/cancel/$id

    */
    T.dom.ready(function(){
        var userid = F.user.userid || F.cookie.get('userid');
        var doc = doc || window.document;

        function handler(element, c_l_id){
            if(!element || !c_l_id) return;
            var isSubed = T.dom.hasClass(element, 'subscriptioned');
            if(!isSubed){
                postHandler({'subid': c_l_id,'subtype':'add'})
            }else{
                postHandler({'subid': c_l_id,'subtype':'cancel'})
            }

            function postHandler(options){
                options = options || {};
                //请求订阅数据
                var url = F.config.api + '/ajax/subscribe/' + options.subtype + '/' + options.subid;
                F.get(url, function(resp){
                    var json = T.json.parse(resp);
                    if(!json || json.status != 200){
                        return;
                    }
                    var data = json.data;
                    changeDom(data, options);
                });
            }

            function changeDom(data, options){
                var subTit = data.title || '';
                var subLogSrc = data.logo || '';
                var subNum = data.sub_num;

                function changeStatus(ags){
                    var node = ags.node || element;
                    if(ags.types == 'add'){
                        T.dom.addClass(node, 'subscriptioned');
                    }else{
                        T.dom.removeClass(node, 'subscriptioned');
                    }
                    node.innerHTML = ags.text;
                    T.setAttr(node, 'title',  ags.text);
                    var eleBrother = T.dom.next(node) || T.dom.prev(node);
                    var subNumDom = T.query('.subnum', eleBrother)[0];
                    if(subNumDom && eleBrother) subNumDom.innerHTML = subNum;
                }

                if(options.subtype == 'add'){
                    changeStatus({'text':'已订阅','types':'add'});
                    T.on(element, 'mouseover', function(){
                        if(T.dom.hasClass(element, 'subscriptioned')){
                            //现在还未见到设计图暂时插入文字,等设计图出来是用class
                            element.innerHTML = '取消订阅';
                            //T.dom.addClass(element, 'subhover');
                        }
                    });
                    T.on(element, 'mouseout', function(){
                        if(T.dom.hasClass(element, 'subscriptioned')){
                            element.innerHTML = '已订阅';
                            /*if(T.dom.hasClass(element, 'subhover')){
                                T.dom.removeClass(element, 'subhover');
                            }*/
                        }
                    });
                }else{
                    changeStatus({'text':'订阅','types':'cancel'});
                }

                //用于处理订阅按钮一致性
                T.observer.add(F.EventCenter.CHANGE_SUBBTN_STATUS, function(obj){
                    var arr = [];
                    T.each(T.query('.tool-subscription'), function(item){
                        if(T.dom.getAttr(item, 'data-id') == options.subid) {
                            arr.push(item);
                        }
                    });
                    if(arr.length > 1){
                        T.each(arr, function(item){
                            if(obj.status == 'add'){
                                changeStatus({'text':'已订阅','types':'add', 'node': item});
                            }else{
                                changeStatus({'text':'订阅','types':'cancel', 'node': item});
                            }
                        });
                    }
                });

                //用于订阅按钮间的通信,保持按钮一致性
                T.observer.send(F.EventCenter.CHANGE_SUBBTN_STATUS, {'status' : options.subtype});

                //给导航通信去掉已订阅的list或者channel
                T.observer.send(F.EventCenter.SUBSCRIBE_ + options.subtype.toUpperCase(), {
                    'listid' : options.subid,
                    'actType' : options.subtype,
                    'subTit' : subTit,
                    'subLogSrc' : subLogSrc
                });
            }
        }

        //用户退出清除cookie
        T.observer.add(F.EventCenter.USERLOGINOUT, function(){
            if(F.cookie.get('_subWindow')){
                F.cookie.del('_subWindow');
            }
        });

        //用于比对本地cookie于登录之后的channelid,发送通知给导航、后端
        function __contrast(){
            var conter = T.query('body')[0];
            var tpl = [
                '<div class="sub-shade z-act" id="subShade"></div>',
                '<div class="sub-window z-root" id="subWindow">',
                    '<p class="sub-txt">是否将本地订阅与观看历史同步至账号?</p>',
                    '<p class="sub-btns"><a href="javascript:;" id="subSubmit">同步</a><a href="javascript:;" id="subEsc">不同步</a></p>',
                    '<a href="javascript:;" class="sub-colse" id="subColseBtn" title="关闭">关闭</a>',
                '</div>'
            ].join('');

              T.dom.insertHTML(conter, 'afterBegin', tpl);

            var subColseBtn = T.get('subColseBtn');
            var subSubmit = T.get('subSubmit');
            var subEsc = T.get('subEsc');
            var subShade = T.get('subShade');
            var subWindow = T.get('subWindow');

            if(!subShade || !subWindow || !subColseBtn || !subSubmit || !subEsc) return;

            function resetPosition(){
                var width = T.page.getWidth() + 'px';
                var height = T.page.getHeight() + 'px';
                var left = Math.ceil(T.page.getViewWidth() / 2) + 'px';
                var top = Math.ceil(T.page.getViewHeight() / 2) + 'px';

                T.dom.setStyle(subShade, 'width', width);
                T.dom.setStyle(subShade, 'height', height);

                T.dom.setStyle(subWindow, 'left', left);
                T.dom.setStyle(subWindow, 'top', top);
            }

            resetPosition();

            function remove(ev){
                T.event.stop(T.event.get(ev));
                T.dom.remove(subWindow);
                T.dom.remove(subShade);
            }

            subColseBtn && T.on(subColseBtn, 'click', function(e){
                remove(e);
                F.cookie.set('_subWindow', 1);
            });

            subSubmit && T.on(subSubmit, 'click', function(e){
                remove(e);
                //发个请求给后端,通知同步fck上的channelid
                var url = F.config.api + '/ajax/sync_sub/sync/';
                F.get(url, function(){

                });
            });

            subEsc && T.on(subEsc, 'click', function(e){
                remove(e);
                F.cookie.set('_subWindow', 1);
            });

            T.on(window, 'resize', resetPosition);
        }

        //当登录用户并且本地_loaclids对比有增量,浮层展现
        function __init(){
            if(userid && F.cookie.get('_subWindow') != 1){
                var url = F.config.api + '/ajax/sync_sub/compare/';
                F.get(url, function(resp){
                    var json = T.json.parse(resp);
                    if(!json || json.status != 200) return;
                    var merge = json.data;
                    if(merge == true){
                        __contrast();
                    }
                });
            }else{
                return;
            }
        }

        //登录并且没有记录同步或者不同步的cookie
        if(userid){
            __init();
        }

        F.Event.delegate(doc, '.tool-subscription', 'click', function(e){
            T.event.stop(T.event.get(e));
            var attrId = T.getAttr(this, 'data-id');
            handler(this, attrId);
        });
    });

  • 相关阅读:
    Maven简介
    Activiti核心API
    Activiti数据库支持
    使用idea进行activiti工作流开发入门学习
    Activiti 工作流
    枚举其他用法
    枚举类的基本使用
    kotlin中抽象类
    kotlin中接口
    kotlin 类的继承
  • 原文地址:https://www.cnblogs.com/sunhw360/p/4140160.html
Copyright © 2011-2022 走看看