Namespace.register("U.CD.LO"); //注册布局 //此js虽然简单,但要整理一个逻辑还是比较费力,暂时如此了 //太多地方需要做宽高控制了,定义一些全局变量。 /*由于html设计原理的时效性,导致宽高不能auto,用js代码补齐*/ U.CD.LO.SetWH = function () { if (!document.body.clientHeight) { location.href = location.hef; } //如果没有客户端信息,则再次刷新本页 //在项目开始时全部用100%,保证用户能看到全貌,然后在此处最终定义宽高。 //纵向 $("#UCD_TOP")[0].style.height = "52px"; //下部内容,横向 $("#UCD_TT")[0].style.width = "160px"; //左边工具栏宽度 $("#UCD_CT")[0].style.width = document.body.offsetWidth - $("#UCD_TT")[0].offsetWidth - $('#UCD_RTree')[0].offsetWidth - 1 + "px"; //右边代码区域宽度 $("#UCD_Bottom")[0].style.height = $("#UCD_CT")[0].style.height = document.body.offsetHeight - $("#UCD_TOP")[0].offsetHeight + 'px'; //下部内容显示框高度 $("#UCD_CT_Top_Tab")[0].style.height = "30px"; //中间头部切换栏 $("#UCD_CT_BT")[0].style.height = "30px"; //中间底部命令行 $("#UCD_CT_CT")[0].style.height = $("#UCD_CT")[0].offsetHeight - $("#UCD_CT_BT")[0].offsetHeight - $("#UCD_CT_Top_Tab")[0].offsetHeight + 'px'; //$("#UCD_Bottom")[0].style.width = document.body.offsetWidth + 'px'; //视图 $("#UCD_CT_SM_IF")[0].style.height = document.body.offsetHeight + 'px'; // $("#UCD_CT_SM_IF")[0].style.width = document.body.offsetWidth + 'px'; //代码 $("#UCD_CT_HH_Code")[0].style.height = "40%"; //$("#UCD_CT_Code").css("width", $("#UCD_CT_HH_Code")[0].offsetWidth - $("#UCD_CT_HH_CT")[0].offsetWidth - 100 + "px"); /* //设置高度,高度无法100%;使用document.body.clientHeight必须CSS放前面?保证html body的值为100%,得不到,需要判断//window.screen.availWidth//document.documentElement.clientWidth //document.documentElement.innerWidth //$("#UCD_Bottom")[0].style.height = document.body.clientHeight -dfghdfhdfgdf //中间代码,代码结果窗口高度 var _ch = $("#UCD_Bottom")[0].clientHeight - $("#UCD_CT_Top_Tab")[0].clientHeight - $("#UCD_CT_BT")[0].clientHeight; if (_ch > 0) $("#UCD_CT_CT")[0].style.height = _ch - 4 + "px"; //代码窗口宽度,有可能小于0,判断一下 //var _cw = $("#UCD_CT_CT")[0].clientWidth - $("#UCD_CT_IF")[0].clientWidth - 2; //if (_cw > 0) $("#UCD_CT_HH_Code")[0].style.width = _cw + "px"; //工具栏控件区域高度 // $("#UCD_TT_Z")[0].style.height = $("#UCD_TT")[0].clientHeight - 37 + "px"; //$("#UCD_TT_Z")[0].style.height = $("#UCD_Bottom")[0].clientHeight - 26 -60 + "px"; //如果资源窗口没有显示,则扩大代码区域,_tt是左边工具栏宽度 _ct是中间区域宽度 _rt是右边区域宽度 6是分割线宽度 var _tt = $("#UCD_TT")[0], _ct = $("#UCD_CT")[0], _rt = $("#UCD_RTree")[0], _aw = document.body.clientWidth, _bk = 4; //如果资源管理器和工具栏都不可显示,则 if (_aw != 0) { //if (_tt.style.display == "none" && _rt.style.display == "none") { _ct.style.width = _aw - _bk + "px"; } // if (_tt.style.display == "none" && _rt.style.display == "block") { _ct.style.width = _aw - _rt.clientWidth - _bk + "px"; } // if (_tt.style.display == "block" && _rt.style.di8979splay == "none") { _ct.style.width = _aw - _tt.clientWidth - _bk + "px"; } // if (_tt.style.display == "block" && _rt.style.display == "block") { _ct.style.width = _aw - _tt.clientWidth - _rt.clientWidth - _bk + "px"; } } //结果显示窗口给固定宽高才能有滚动条。 var _if = $("#UCD_CT_SM_IF")[0], _ifct = $("#UCD_CT_IF")[0]; _if.width = _if.parentNode.clientWidth + "px"; //必须设置宽度才有效? //iframe的100%不起作用啊。 if (_ifct.clientHeight - 20 > 0) { _if.style.height = _ifct.clientHeight - 20 + "px"; } */ /* 暂时去掉::迭代 //代码区域宽度等于 包容器减去行号宽度 var _code = $("#UCD_CT_Code")[0], _hh = $("#UCD_CT_HH_CT")[0], _rq = $("#UCD_CT_HH_Code")[0] _code.style.width = _rq.clientWidth - _hh.clientWidth + "px"; */ } //单击左边分割线时,隐藏工具栏窗口?o为传递进来的控件类型 U.CD.LO.HEToolbar = function (o) { $("#UCD_TT")[0].style.display = $("#UCD_TT")[0].style.display == "none" ? "block" : "none"; U.CD.LO.SetWH(); } //关闭资源管理器影响的布局//关闭资源管理器 U.CD.LO.CloseZY = function () { $("#UCD_RTree")[0].style.display = "none"; U.CD.LO.SetWH(); } //打开资源管理器 U.CD.LO.OpenZY = function () { $("#UCD_RTree")[0].style.display = "block"; U.CD.LO.SetWH(); } //打开或者关闭资源管理器,在顶部菜单使用 U.CD.LO.OCZY = function () { // if (U.CD.U.IsUSelf() == false) { U.CD.U.LoginApply(); return; } $("#UCD_RTree")[0].style.display = $("#UCD_RTree")[0].style.display == "none" ? "block" : "none"; //$("#UCD_RTree")[0].style.display = "block"; U.CD.LO.SetWH(); } //视图全屏模式, U.CD.LO.View = function (div) { U.CD.LO.A(); var _a = $(".UCD_CT_BT_Com") for (var i = 0; i < _a.length; i++) { _a[i].style.background = " -webkit-linear-gradient(#fffffff, #d8d8d8)"; _a[i].style.color = "#020202"; } var _v = $("#UCD_CT_IF")[0], _c = $("#UCD_CT_HH_CT")[0], _if = $("#UCD_CT_SM_IF")[0] _c.style.display = "none"; _v.style.display = "block"; _v.style.height = "100%"; for (var i in $('.UCD_CT_BT_Com').length - 2) { $('.UCD_CT_BT_Com').css({ 'background': '-webkit-linear-gradient(#ffffff, #d8d8d8);', 'color': '#000' }) } $(div).css({ 'background': '-webkit-linear-gradient(top, rgb(81, 154, 251), rgb(21, 119, 230))', 'color': '#fff' }) U.CD.LO.SetWH(); test(); } //代码模式 U.CD.LO.Code = function (div) { U.CD.LO.A(); var _a = $(".UCD_CT_BT_Com") for (var i = 0; i < _a.length; i++) { _a[i].style.background = " -webkit-linear-gradient(#ffffff, #d8d8d8)"; _a[i].style.color = "#020202"; } var _v = $("#UCD_CT_IF")[0], _c = $("#UCD_CT_HH_Code")[0]; _v.style.display = "none"; _c.style.display = "block"; _c.style.height = "100%"; _c = $("#UCD_CT_HH_Code").Child(); for (var i = 0; i < _c.length; i++) { _c[i].style.height = "100%"; } for (var i in $('.UCD_CT_BT_Com').length - 2) { $('.UCD_CT_BT_Com').css({ 'background': '-webkit-linear-gradient(#ffffff, #d8d8d8);', 'color': '#000' }) } $(div).css({ 'background': '-webkit-linear-gradient(top, rgb(81, 154, 251), rgb(21, 119, 230))', 'color': '#fff' }) U.CD.LO.SetWH(); $("#UCD_CT_HH_Code")[0].style.height = "100%"; $("#UCD_CT_HH_CT")[0].style.height = "200%"; test(); } //拆分模式 U.CD.LO.Split = function (div) { U.CD.LO.A(); var _a = $(".UCD_CT_BT_Com") _a.css({ "-webkit-linear-gradient": "#ffffff, #d8d8d8", "color": "#020202" }); $(div).css({ "-webkit-linear-gradient": "#519afb, #1577e6", "color": "white" }); var _v = $("#UCD_CT_IF"), _c = $("#UCD_CT_HH_CT"); _v.css({ "height": "60%", "display": "block" }); _c.css({ "height": "40%", "display": "block" }); $('#UCD_CT_SM_IF').css({ 'margin-top': '0', 'width': '100%', 'height': '100%', 'border': '0' }) for (var i in $('.UCD_CT_BT_Com').length - 2) { $('.UCD_CT_BT_Com').css({ 'background': '-webkit-linear-gradient(#ffffff, #d8d8d8);', 'color': '#000' }) } $(div).css({ 'background': '-webkit-linear-gradient(top, rgb(81, 154, 251), rgb(21, 119, 230))', 'color': '#fff' }) test(); } //手机模式 U.CD.LO.Jude = true; U.CD.LO.Phone = function (_event) { var _a = $(".UCD_CT_BT_Com"), _f = $("#UCD_CT_SM_IF"), _Arr = { //手机模式的种类 "Galaxy S5": { w: 360, h: 640 }, "Nexus 5X": { w: 412, h: 732 }, "Iphone 5": { w: 320, h: 568 }, "Iphone 6": { w: 375, h: 667 }, "Iphone 6 Plus": { w: 414, h: 736 } }, i; $('#UCD_CT_IF')[0].style.display = 'block'; $("#UCD_CT_IF").css({ textAlign: "center", height: "100%", "border-right": "8px solid#7d7d7d", "min-width": "0px", "width": "40%" }); $("#UCD_CT_HH_Code").css({ "min-width": "0px", "height": "100%", "width": "calc(100% - 40.9%)" }); for (var i in $('.UCD_CT_BT_Com').length - 2) { $('.UCD_CT_BT_Com').css({ 'background': '-webkit-linear-gradient(#ffffff, #d8d8d8);', 'color': '#000' }) } _a[3].style.background = "-webkit-linear-gradient(#519afb, #1577e6)"; _a[3].style.color = "white"; $("#U_CD_LO_Window")[0].style = "display:block;width:65px;background:-webkit-linear-gradient(#ffffff, #d8d8d8);color:#020202"; $("#U_CD_LO_Window2")[0].style = "display:none;"; for (i in _Arr) { //判断是哪一个手机类型 改变样式大小 if (_event.srcElement.innerText == i) { _f.css({ "width": _Arr[i].w + "px", "height": _Arr[i].h + "px", "margin": "10% 2% 0 2%" }); document.getElementById('UCD_CT_SM_IF').contentWindow.document.body.style.zoom = 0.6; break; } } for (var i = 0; i < 5; i++) { _a[3].children[0].children[1].children[i].style = " background : -webkit-linear-gradient(#ffffff, #2d8d8d8)"; } _event.srcElement.style.background = "-webkit-linear-gradient(#519afb, #1577e6)"; _event.srcElement.style.color = 'white'; U.CD.LO.Jude = true; event.stopPropagation(); } U.CD.LO.judge = function () { if (U.CD.LO.Jude == false && $('.UCD_CT_BT_Com')[3].style.background == '-webkit-linear-gradient(top, rgb(81, 154, 251), rgb(21, 119, 230))') { U.CD.LO.Jude = false; event.stopPropagation(); } else { //取消手机模式 $('#UCD_CT_SM_IF').css({ "width": "100%", "height": "100%", "margin": "0%" }) $("#UCD_CT_IF").css({ "width": "100%", "height": "60%" }) $("#UCD_CT_HH_Code").css({ "width": "100%", "height": "40%" }) U.CD.LO.Jude = true; event.stopPropagation(); } if ($("#UCD_CT_BT div")[3].style.background == "-webkit-linear-gradient(top, rgb(81, 154, 251), rgb(21, 119, 230))" && event.srcElement.innerText.substr(0, 4) == "手机模式") { var _a = $(".UCD_CT_BT_Com"), _f = $("#UCD_CT_SM_IF"); _f.css({ "width": "100%", "height": "100%", "border": "0px" }) for (i = 0; i < _a.length; i++) { //改变按钮样式 _a[i].style.background = " -webkit-linear-gradient(#ffffff, #d8d8d8)"; _a[i].style.color = "#020202"; } for (var a = 0; a < $(".UCD_CT_BT_Com_Phone_List")[0].children.length; a++) { $(".UCD_CT_BT_Com_Phone_List")[0].children[a].style.background = "#fff"; $(".UCD_CT_BT_Com_Phone_List")[0].children[a].style.color = "#000" } document.getElementById('UCD_CT_SM_IF').contentWindow.document.body.style.zoom = 1; } test(); } U.CD.LO.Window = function () { //窗口模式 $('#UCD_CT_SM_IF').css({ "width": "100%", "height": "100%", "margin": "0%" }) $("#UCD_CT_IF").css({ "width": "100%", "height": "60%" }) $("#UCD_CT_HH_Code").css({ "width": "100%", "height": "40%" }) U.CD.LO.Jude = true; event.stopPropagation(); var _a = $(".UCD_CT_BT_Com"), _d = $("#U_CD_LO_Window")[0]; for (var i = 0; i < _a.length; i++) { _a[i].style.background = " -webkit-linear-gradient(#ffffff, #d8d8d8)"; _a[i].style.color = "#020202"; } document.getElementById('UCD_CT_SM_IF').contentWindow.document.body.style.zoom = "1"; _d.style = "background:-webkit-linear-gradient(#519afb, #1577e6);color:white;display:none"; document.getElementById('UCD_CT_SM_IF').style = "width:700px;border:1px solid "; $("#U_CD_LO_Window2")[0].style = "display:block;background:-webkit-linear-gradient(#519afb, #1577e6);color:white"; } //取消窗口模式 test = function () { // document.getElementById('UCD_CT_SM_IF').style = "width:100%;border:0px;"; // $("#U_CD_LO_Window")[0].style = "display:block;width:65px;background:-webkit-linear-gradient(#ffffff, #d8d8d8);color:#020202"; // $("#U_CD_LO_Window2")[0].style = "display:none;"; // document.getElementById('UCD_CT_SM_IF').contentWindow.document.body.style.zoom = "1"; } //取消对展示框 代码框的更改 U.CD.LO.A = function () { $("#UCD_CT_IF").css({ "height": "100%", "min-height": "400px", "width": "100%" }); $("#UCD_CT_HH_Code").css({ "height": "40%", "min-height": "1100px", "width": "100%" }); $("#UCD_CT_SM_IF").css({ "width": "", "height": "", "margin": "" }); }