Skip to content

json转HTML #6

Open
Open
@zuopf769

Description

@zuopf769

var hasMathSvg = function () {
// debug
// return true;
// 选择答案后需要重新刷新结果会出现闪动,不太好解决,暂时关闭SVG模式
return false;
if(typeof currentAndroidVer !== 'undefined' && currentAndroidVer > 15){
return true;
}
return false;
};
var cloneObject = function(obj) {
return JSON.parse(JSON.stringify(obj));
};

var objEach = function (source, iterator) {
var returnValue;
var key;
var item;

if ('function' === typeof iterator) {
    for (key in source) {
        if (source.hasOwnProperty(key)) {
            item = source[key];
            returnValue = iterator.call(source, item, key);

            if (returnValue === false) {
                break;
            }
        }
    }
}
return source;

};

var each = function (source, iterator, thisObject) {
var returnValue;
var item;
var i;
var len = source.length;

if ('function' === typeof iterator) {
    for (i = 0; i < len; i++) {
        item = source[i];
        returnValue = iterator.call(thisObject || source, item, i);

        if (returnValue === false) {
            break;
        }
    }
}

return source;

};

var isArray = function (source) {
return '[object Array]' === Object.prototype.toString.call(source);
};

var isObject = function (source) {
return 'function' === typeof source || !!(source && 'object' === typeof source);
};

var encodeHTML = function (source) {
return String(source).replace(/</g, '<').replace(/⌀/g, 'Ø')
.replace(/>/g, '>').replace(/"/g, '"').replace(/'/g, ''');
};

var parseQuestion = function (data, opt) {
var proxy = function (func, context) {
return function () {
return func.apply(context, [].slice.call(arguments, 0));
};
};
opt = opt || {};
var parseNormalTag = proxy(this.parseNormalTag, this);
var parseImgTag = proxy(this.parseImgTag, this);
var parseBrTag = proxy(this.parseBrTag, this);
var parseTableTag = proxy(this.parseTableTag, this);
var parseObj = proxy(this.parseObj, this);

this.winWidth = opt.winWidth || document.body.clientWidth;
this.paddingWidth = opt.paddingWidth || 14;
this.optionsScaleVal = opt.optionsScaleVal || 0.8;

this.level = 0;
this.data = data || {};
this.setOpt(opt);
this.parseTagList = {
    span: parseNormalTag,
    h2: parseNormalTag,
    h3: parseNormalTag,
    h4: parseNormalTag,
    p: parseNormalTag,
    div: parseNormalTag,
    img: parseImgTag,
    br: parseBrTag,
    table: parseTableTag,
    obj: parseObj

};
this.parseObjList = {
    math: this.parseMath

};

};
parseQuestion['hasMathSvg'] = function () {
return hasMathSvg();
}
parseQuestion.prototype = {
parseNormalTag: function (data, isEncode) {
if (!data.hasOwnProperty('t')) {
return '';
}

    data.r = data.r || [];
    data.c = data.c || '';

    var attr = '';
    var tag;
    var className;
    var content;
    var hasClass;

    tag = encodeHTML(data.t);
    className = encodeHTML(isArray(data.r) ? data.r.join(' ') : data.r);
    content = data.c;

    if (isEncode === true) {
        content = encodeHTML(content);
    };

    hasClass = data.r.length;

    return '<' + tag + (hasClass ? ' class="' + className + '"' : '') + (data.inlineStyle ? ' style="'
    + data.inlineStyle + '"' : '') + ' ' + attr + ' ' + '>' + content + '</' + tag + '>';
},
parseImgTag: function (data, opt) {
    opt = opt || {};
    var imgUrl = data.src;
    if (isHttps() && imgUrl) {
        imgUrl = imgUrl.replace(/http:\/\/hiphotos.baidu.com/g, 'https://gss0.baidu.com/7LsWdDW5_xN3otqbppnN2DJv');
    }
    var width = parseInt(data.w || data.width, 10) || 0;
    var height = parseInt(data.h || data.height, 10) || 0;
    var maxWidth = Math.ceil(this.winWidth - this.paddingWidth * 2) * (opt.scaleVal || 1);
    var scaleVal = this.scaleImg(width, height, maxWidth);
    return '<img src="' + imgUrl + '" data-lazysrc="' + imgUrl + '" ' + (width > 0 ? (' width="' + scaleVal.width + 'px"') : ' ')
    + (height > 0 ? (' height="' + scaleVal.height + 'px"') : ' ') + ' class="scale-img" ' + '/>';
},
parseBrTag: function (data) {
    var tag = 'br';
    var className;
    var classNamePrefix;

    if (data.hasOwnProperty('datatype')) {
        className = classNamePrefix + data.datatype;
        tag = 'span';
    }

    return '<' + tag + ' ' + (className ? ('class="' + className + '"') : '') + '/>';
},
parseMath: function (data) {
    var rawdata;
    var tmpl = '<span class="math-box" data-value="__VALUE__">'
    + '</span><span class="math-output">$$__VALUE__$$</span>';

    if (hasMathSvg()) {
        if (data.hasOwnProperty('c')) {
            rawdata = data.c.rawdata;
            return tmpl.replace(/__VALUE__/g, rawdata);
        }
    }
    else {
        if (data.hasOwnProperty('data') && isArray(data.data)) {
            return this.parseImgTag(data.data[0], {
                scaleVal: 2.5

            }).replace('<img', '<img datatype="math"');
        }
    }
    return '';
},
parseTableTag: function (data) {
    if (data.hasOwnProperty('bg-img')) {
        return this.parseImgTag(data['bg-img']);
    }
    return '';
},
parseObj: function (data) {
    var result = '';
    if (!data.hasOwnProperty('datatype') || !this.parseObjList.hasOwnProperty(data.datatype)) {
        return result;
    }
    result = this.parseObjList[data.datatype].call(this, data);
    return result;
},
parseChild: function (data, opt) {
    data = cloneObject(data);
    var me = this;
    var args = arguments;
    var result = [];

    data.level = this.level++;

    if (!this.parseTagList[data.t]) {
        return '';
    }

    if (isArray(data.c)) {
        each(data.c, function (item, i) {
            if (isArray(item.c)) {
                result.push(me.parseChild(item, opt));
            }
            else if (item.hasOwnProperty('t')) {
                if ('img br obj table'.match(item.t)) {
                    result.push(me.parseTagList[item.t](item, opt));
                }
                else {
                    result.push(me.parseTagList[item.t](item, true, opt));
                }

            }
        }, me);

        data.c = result.join('');
        return me.parseTagList[data.t](data, opt);
    }

    return me.parseTagList[data.t](data, true, opt);
},
parseBdjson: function (data, opt) {
    var me = this;
    var result = [];

    if (isArray(data)) {
        each(data, function (item, i) {
            if (!item.hasOwnProperty('t')) {
                return false;
            }

            item.level = me.level++;
            var content = me.parseChild(item, opt);
            me.level = 0;

            result.push(content);
        }, me);

    }
    else if (isObject(data)) {
        if (!data.hasOwnProperty('t')) {
            return false;
        }

        data.level = me.level++;
        var content = me.parseChild(data, opt);
        me.level = 0;

        result.push(content);
    }
    else if (typeof data === 'string') {
        return data;
    }
    else {
        return '';
    }

    return result.join('');
},
parseStem: function (data) {
    if (!data || !isArray(data)) {
        return "";
    }

    return this.parseBdjson(data);
},
parseOptions: function (data, opt) {
    if (!data){
        return
    }
    opt = opt || {};
    data = cloneObject(data);
    var me = this;
    var prefix = [
        'A',
        'B',
        'C',
        'D',
        'E',
        'F'
    ];
    var result = [];
    if (!data) {
        return '';
    }
    if (!isArray(data)) {
        throw new Error('parseOptions parse error');
    }

    // 选项都是nbsp
    var isNull = false;
    var count = 0;
    $.each(data[0], function(index, item){
        if (item.ret[0].c === '&nbsp;' || (item.ret[0].c && item.ret[0].c.length == 0)) {
            isNull = true;
            count ++;
        }
    });
    if (isNull && count == data[0].length) {
        return '';
    }

    objEach(data[0], function (item, i) {
        if (!item.ret || !isArray(item.ret)) {
            return;
        }
        if (!item.ret[0].c || !isArray(item.ret[0].c)) {
            item.ret[0].c = [
                {
                    c: item.ret[0].c,
                    t: 'span'

                }
            ];
        }
        var container = {
            t: 'div',
            r: [opt.optionClassname||'']
        }
        var optResult = {
            t: 'span',
            r: ['prefix'],
            c: prefix[i]
        };
        if(opt.review && item.yes == true ){
            if (item.selected || me.data.que_info.type == 'sc') {
                container.r.push('correct-opt');
            }else {
                container.r.push('missed-opt');
            }
        }
        if(opt.review && item.yes != true && item.selected){
            container.r.push('incorrect-opt');
        }
        if(item.selected){
            container.r.push('selected-opt');
        }
        item.ret[0].c.unshift(optResult);
        container.c = item.ret;
        result.push(me.parseBdjson(container, {
            scaleVal: me.optionsScaleVal
        }));
        // result.push(me.parseBdjson(item.ret));
    });
    return result.join('');
},
parseAnswer: function (data, options) {
    var result = [];
    var me = this;
    if (!data) {
        return '';
    }
    if (!isArray(data) && !isArray(options)) {
        throw new Error('parseAnswer parse error');
    }
    if (isArray(options)) {
        var prefix = [
            'A',
            'B',
            'C',
            'D',
            'E',
            'F'
        ];
        var r = [];
        each(options[0], function (item, i) {
            if (~~item.yes) {
                r.push(prefix[i]);
            }
        });
        result.push(me.parseBdjson({
            t: 'span',
            c: r.join(',')

        }));
    }
    else {
        if (data[0] instanceof Array) {
            data = data[0];
        }
        var isMultStep = data[0]
            && data[0].datatype
            && data[0].datatype === 'question_method';

        if (isMultStep) {
            var steps = [];
            var rewData = data[0].c;
            each(rewData, function (item, i) {
                steps.push({
                    html: me.parseBdjson(item.c),
                    score: item.que_info ? item.que_info.score : 0
                });
            });
            return steps;
        }
        each(data, function (item, i) {
            result.push(me.parseBdjson(item));
        });
    }

    return result.join('');
},
parseAnalysis: function (data) {
    var result = [];
    var me = this;
    if (!data) {
        return '';
    }
    if (!isArray(data)) {
        throw new Error('parseAnalysis parse error');
    }

    each(data, function (item, i) {
        result.push(me.parseBdjson(item));
    });

    return result.join('');

},
parseSkill: function (data) {
    var me = this;
    var result = [];
    if (!data) {
        return '';
    }
    if (!isArray(data)) {
        throw new Error('parseSkill parse error');
    }

    each(data, function (item, i) {
        result.push(me.parseBdjson(item));
    });

    return result.join('');
},
parseErrorPoint: function (data) {
    var me = this;
    var result = [];
    if (!data) {
        return '';
    }
    if (!isArray(data)) {
        throw new Error('parseSkill parse error');
    }

    each(data, function (item, i) {
        result.push(me.parseBdjson(item));
    });

    return result.join('');
},
parseTeach: function (data) {
    var me = this;
    var result = [];
    if (!data) {
        return '';
    }
    if (!isArray(data)) {
        throw new Error('parseSkill parse error');
    }

    each(data, function (item, i) {
        result.push(me.parseBdjson(item));
    });

    return result.join('');
},
parseKnowPoint: function(data) {
    var me = this;
    var result = [];
    if (!data) {
        return '';
    }
    each(data, function (item, i) {
        result.push('<span class="point">' + item + '</span>');
    });
    return result.join('');
},
parseChildren: function(data, opt) {
    if(!data || data.length == 0){
        return '';
    }
    var me = this;
    var arr =[];
    each(data, function(item,index) {
        if(opt && typeof opt.subque_index == 'number' && opt.subque_index != index){
            return;
        }
        arr.push(me.getRenderData({
            data: item,
            opt: opt
        }))
    })
    return arr;
},
parseDirection: function (data) {
    // if (!data || !isArray(data)) {
    //     return "";
    // }

    return this.parseBdjson(data);
},
scaleImg: function (width, height, maxWidth) {
    var scaleVal;

    if (width > maxWidth) {
        scaleVal = maxWidth / width;
        width = Math.ceil(maxWidth);
        height = Math.ceil(height * scaleVal);
    }

    return {
        width: width,
        height: height

    };

},
setOpt: function(opt) {
    this.opt = opt || {};
},
getAnswerOptions:function (options) {
    var ret = [];
    if(isArray(options)){
        each(options[0], function (item, i) {
            if (~~item.yes) {
                ret.push(i);
            }
        });
        return ret;
    }else{
        return false;
    }
},
getRenderData: function (options) {

    var bdjson;
    var opt;
    if(isObject(options)){
        bdjson = options.data || this.data;
        opt = $.extend({},this.opt, options.opt)
    }else{
        bdjson = this.data
    }
    var queAnswerOptions = this.getAnswerOptions(bdjson.que_options);

    return {
        queStem: this.parseStem(bdjson.que_stem, opt),
        queOptions: this.parseOptions(bdjson.que_options, opt),
        queAnswer: this.parseAnswer(bdjson.que_answer, bdjson.que_options, opt),
        queAnswerOptions: queAnswerOptions,
        checkQueAnswerOptions:function (result) {
            if(!isArray(result) || !isArray(queAnswerOptions)){
                return false;
            }
            var ret = true;
            for(var i = 0; i < queAnswerOptions.length; i++){
                if(result.indexOf(queAnswerOptions[i]) === -1){
                    ret = false;
                }
            }
            for(var i = 0; i < result.length; i++){
                if(queAnswerOptions.indexOf(result[i]) === -1){
                    ret = false;
                }
            }
            return ret;
        },
        queAnalysis: this.parseAnalysis(bdjson.que_info.analysis || '', opt),
        queInfo: bdjson.que_info,
        queSkill: this.parseSkill(bdjson.que_info.skill, opt),
        queErrorPoint: this.parseErrorPoint(bdjson.que_info.error_point, opt),
        queTeach: this.parseTeach(bdjson.que_info.discard, opt),
        queKnowPoint: this.parseKnowPoint(bdjson.que_info.know_point_v2, opt),
        queChildren: this.parseChildren(bdjson.c, opt),
        queDirection: this.parseDirection(bdjson.que_info.direction, opt)
    };
}

};

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions