UseStudio.CloudFront/controls/pc/BasicControl/kongjian.js

Namespace.register("U.Control.BasicControl");

//
U.Control.BasicControl.A = function () {


};
var U_Control_BasicControl_div2;
var U_Control_BasicControl_div3;
window.onload = function () {
    U.Control.BasicControl.file();
    U.Control.BasicControl.ul();
    U.Control.BasicControl.table();
    U.Control.BasicControl.select();
}
//生成文件上传控件
U.Control.BasicControl.file = function () {
    var div = $$('div', { 'class': 'fileUpload btn btn-primary' });
    $$('label', { 'for': 'upload', 'innerHTML': '上传图片' }, div);
    U_Control_BasicControl_div2 = $$('div', { 'class': 'file-name' }, div);
    U_Control_BasicControl_div3 = $$('input', { 'class': 'upload', 'id': 'upload' }, div);
    return div
};
//生成select元素
U.Control.BasicControl.select = function () {
    var form1 = $$('form', { 'class': 'form1', 'runat': 'server', 'style': {'position':'absolute'} });
    var form2 = $$('div', { 'class': 'formdiv' }, form1);
    var form3 = $$('select', { 'class': 'select' }, form2);
    $$('option', { 'value': 1, 'innerHTML': '操作' }, form3);
    $$('option', { 'value': 1, 'innerHTML': '栏目设置' }, form3);
    $$('option', { 'value': 1, 'innerHTML': '更多设置' }, form3);
    $$('option', { 'value': 1, 'innerHTML': '更多选项' }, form3);
    return form1;
}
//生成ul控件
U.Control.BasicControl.ul = function () {
    //ul li 创建
    var form1 = $$('ul', { 'id': 'ul0', 'class': 'ul' });
    $$('li', { 'class': 'li', 'id': 'li0', 'innerHTML' : '新闻资讯'}, form1);
    $$('li', { 'class': 'li', 'id': 'li1', 'innerHTML': '体育竞技' }, form1);
    $$('li', { 'class': 'li', 'id': 'li2', 'innerHTML': '体育竞技' }, form1);
    $$('li', { 'class': 'li', 'id': 'li3', 'innerHTML': '体育竞技' }, form1);
    $$('li', { 'class': 'li', 'id': 'li4', 'innerHTML': '体育竞技' }, form1);
    return form1;
}

//生成表格元素
U.Control.BasicControl.table = function () {
    //table 创建

    var form1 = $$('table', { 'class': 'table', 'id': 'table0' });
    //tbody 创建
    var form2 = $$('tbody', { 'id': 'tbody0' }, form1);
    //tr 创建
    var form3 = $$('tr', { 'id': 'tr0' }, form2);
    var form4 = $$('tr', { 'id': 'tr1' }, form2);

    $$('td', { 'id': 'td0' }, form3);
    $$('td', { 'id': 'td1' }, form3);

    $$('td', { 'id': 'td2' }, form4);
    $$('td', { 'id': 'td3' }, form4);

    $(form1).addAttrArray({ "cellspacing": "0" })
    $(form1).addAttrArray({ "border": "1" })
    return form1;
}

//实现文件上传美化
U.Control.BasicControl.fileupdate = function () {
    var uploadInput = U_Control_BasicControl_div3; //使用强大ufrom文件上传按钮获取
    uploadInput.addEventListener('change', function () {//当文件上传时触发函数
        U_Control_BasicControl_div2.innerHTML = uploadInput.files[0].name; //将文件名显示在文件上传框
    });
};


U.Control.BasicControl.Img = function () {
    var a = $$("div", { "class": "yanzRight" });
    var b = $$("input", { "style": { "margin-top": "5px", "float": "left" }, "id": "st18", "name": "evidence", "type": "file" }, a);
    b.onchange = function () { previewImage(this, 5) }
    var c = $$("span", { "class": "dui", "id": "imgOrder_dui", "style": { "display": "none"} }, a);
    var d = $$("div", { "id": "preview5", "style": { "margin-left": "150px", "clear": "both", "padding-top": "15px"} }, a);
    var img = $$("img", { "src": "", "alt": "", "id": "imghead5", "height": "200px;", "width": "200px", "style": { "display": "none"} }, d);
    return a;
}

function previewImage(file, imgNum) {
    console.log(1)
    var MAXWIDTH = 200;
    var MAXHEIGHT = 200;
//    var div = document.getElementById('preview' + imgNum);
    var div = $("#UCD_CT_SM_IF")[0].contentWindow.document.getElementById('preview' + imgNum);
    if (file.files && file.files[0]) {
        div.innerHTML = '<img id=imghead' + imgNum + '>';
//        var img = document.getElementById('imghead' + imgNum + '');
        var img = $("#UCD_CT_SM_IF")[0].contentWindow.document.getElementById('imghead' + imgNum + ''); ;
        img.onload = function () {
            var rect = clacImgZoomParam(MAXWIDTH, MAXHEIGHT, img.offsetWidth, img.offsetHeight);
            img.width = rect.width;
            img.height = rect.height;
            //         img.style.marginLeft = rect.left+'px';
            img.style.marginTop = rect.top + 'px';
        }
        var reader = new FileReader();
        reader.onload = function (evt) { img.src = evt.target.result; }
        reader.readAsDataURL(file.files[0]);
    }
    else //
    {
        var sFilter = 'filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(sizingMethod=scale,src="';
        file.select();
        var src = document.selection.createRange().text;
        div.innerHTML = '<img id=imghead' + imgNum + '>';
        var img = document.getElementById('imghead2');
        img.filters.item('DXImageTransform.Microsoft.AlphaImageLoader').src = src;
        var rect = clacImgZoomParam(MAXWIDTH, MAXHEIGHT, img.offsetWidth, img.offsetHeight);
        status = ('rect:' + rect.top + ',' + rect.left + ',' + rect.width + ',' + rect.height);
        div.innerHTML = "<div id=divhead" + imgNum + " style='width:" + rect.width + "px;height:" + rect.height + "px;margin-top:" + rect.top + "px;" + sFilter + src + "\"'></div>";
    }
}
function clacImgZoomParam(maxWidth, maxHeight, width, height) {
    var param = { top: 0, left: 0, width: width, height: height };
    if (width > maxWidth || height > maxHeight) {
        rateWidth = width / maxWidth;
        rateHeight = height / maxHeight;

        if (rateWidth > rateHeight) {
            param.width = maxWidth;
            param.height = Math.round(height / rateWidth);
        } else {
            param.width = Math.round(width / rateHeight);
            param.height = maxHeight;
        }
    }
    param.left = Math.round((maxWidth - param.width) / 2);
    param.top = Math.round((maxHeight - param.height) / 2);
    return param;
}