Dialog.js 34 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893
  1. o2.require("MWF.widget.Dialog", null, false);
  2. o2.xDesktop.Dialog = o2.DDL = new Class({
  3. Extends: o2.widget.Dialog,
  4. options : {
  5. maxHeightPercent : "98%"
  6. },
  7. // _markShow: function(){
  8. //
  9. // if (this.options.mark){
  10. // if (!this.markNode){
  11. //
  12. // this.markNode = new Element("div", {
  13. // styles: this.css.mark
  14. // }).inject($(document.body));
  15. //
  16. // }
  17. //// if (this.options.markNode){
  18. //// var size = this.options.markNode.getComputedSize();
  19. //// var position = this.options.markNode.getPosition();
  20. //// alert(size.totalHeight);
  21. //// this.markNode.set("styles", {
  22. //// "height": size.totalHeight+"px",
  23. //// "width": size.totalWidth+"px",
  24. //// "top": position.y,
  25. //// "height": position.x
  26. //// });
  27. ////
  28. //// }else{
  29. // var size = MWF.getMarkSize();
  30. // this.markNode.set("styles", {
  31. // "height": size.y,
  32. // "width": size.x,
  33. // "top": "0xp",
  34. // "height": "0px"
  35. // });
  36. //// }
  37. //
  38. // this.markNode.setStyle("display", "block");
  39. // }
  40. // },
  41. _markShow: function(){
  42. if (this.options.mark){
  43. if (!this.markNode){
  44. var size = MWF.getMarkSize(this.options.maskNode);
  45. var topNode = this.options.container || $(document.body);
  46. this.markNode = new Element("iframe", {
  47. styles: this.css.mark
  48. }).inject(topNode);
  49. this.markNode.set("styles", {
  50. "height": size.y,
  51. "width": size.x
  52. });
  53. if (!this.markNode_up) this.markNode_up = new Element("div", { styles: this.css.mark }).inject(topNode);
  54. this.markNode_up.set("styles", {
  55. "height": size.y,
  56. "width": size.x
  57. });
  58. }
  59. this.markNode.setStyle("display", "block");
  60. }
  61. },
  62. getDialogNode: function(){
  63. this.width = this.options.width;
  64. this.height = this.options.height;
  65. this.node.set("styles", this.css.from);
  66. var topNode = this.options.container || $(document.body);
  67. this.node.inject(topNode);
  68. // this.node.addEvent("selectstart", function(e){
  69. // // e.preventDefault();
  70. // });
  71. this.title = this.node.getElement(".MWF_dialod_title");
  72. this.titleCenter = this.node.getElement(".MWF_dialod_title_center");
  73. this.titleText = this.node.getElement(".MWF_dialod_title_text");
  74. this.titleAction = this.node.getElement(".MWF_dialod_title_action");
  75. this.content = this.node.getElement(".MWF_dialod_content");
  76. this.bottom = this.node.getElement(".MWF_dialod_bottom");
  77. this.resizeNode = this.node.getElement(".MWF_dialod_bottom_resize");
  78. this.button = this.node.getElement(".MWF_dialod_button");
  79. if( (!this.options.buttonList || this.options.buttonList.length === 0) && ( !this.options.buttons ) ){
  80. this.button.setStyle("display","none");
  81. this.buttonDisable = true;
  82. }else{
  83. this.okButton = this.node.getElement(".MWF_dialod_ok_button");
  84. this.cancelButton = this.node.getElement(".MWF_dialod_cancel_button");
  85. }
  86. this.backAction = this.node.getElement(".MWF_dialod_Action_back");
  87. if (!this.options.isTitle) {
  88. this.title.destroy();
  89. this.title = null;
  90. this.titleCenter = null;
  91. this.titleRefresh = null;
  92. this.titleText = null;
  93. this.titleAction = null;
  94. }
  95. if (this.title) this.setTitleEvent();
  96. // if (this.titleText) this.getTitle();
  97. if (this.content) this.getContent();
  98. if (this.titleAction) this.getAction();
  99. if (this.resizeNode) this.setResizeNode();
  100. // if (this.button) this.getButton();
  101. if (this.content) this.setContentSize();
  102. if (this.backAction)this.backAction.addEvent("click", this.close.bind(this))
  103. },
  104. getButton: function(){
  105. for (i in this.options.buttons){
  106. var button = new Element("input", {
  107. "type": "button",
  108. "value": i,
  109. "styles": this.css.button,
  110. "class": "mainColor_bg",
  111. "events": {
  112. "click": this.options.buttons[i].bind(this)
  113. }
  114. }).inject(this.button);
  115. }
  116. if (this.options.buttonList){
  117. this.options.buttonList.each(function(bt){
  118. var styles = this.css.button;
  119. if( bt.type === "ok" && this.css.okButton )styles = this.css.okButton;
  120. if( bt.type === "cancel" && this.css.cancelButton )styles = this.css.cancelButton;
  121. if( bt.styles )styles = bt.styles;
  122. var button;
  123. if( bt.type === "ok" && this.okButton ){
  124. button = this.okButton;
  125. button.show();
  126. }else if( bt.type === "cancel" && this.cancelButton ){
  127. button = this.cancelButton;
  128. button.show();
  129. }else{
  130. button = new Element("input", {
  131. "type": "button"
  132. }).inject(this.button);
  133. }
  134. button.set({
  135. "value": bt.text,
  136. "title": bt.title,
  137. "styles": styles,
  138. "class": (bt.type!=="cancel") ? "mainColor_bg" : "",
  139. "events": {
  140. "click": function(e){bt.action.call(this, this, e)}.bind(this)
  141. }
  142. })
  143. }.bind(this));
  144. }
  145. },
  146. setTitleEvent: function(){
  147. var content;
  148. if( this.options.isMove ){
  149. if (layout.app) content = layout.app.content;
  150. if (layout.desktop.currentApp) content = layout.desktop.currentApp.content;
  151. this.containerDrag = new Drag.Move(this.node, {
  152. "handle": this.title,
  153. "container": this.options.container || this.markNode || content,
  154. "snap": 5
  155. });
  156. }
  157. },
  158. getAction: function(){
  159. //未完成................................
  160. if (this.options.isClose){
  161. this.closeAction = new Element("div", {"styles": this.css.closeAction}).inject(this.titleAction);
  162. this.closeAction.addEvent("click", this.close.bind(this));
  163. }
  164. if (this.options.isMax){
  165. this.maxAction = new Element("div", {"styles": this.css.maxAction}).inject(this.titleAction);
  166. this.maxAction.addEvent("click", this.maxSize.bind(this));
  167. this.restoreAction = new Element("div", {"styles": this.css.restoreAction}).inject(this.titleAction);
  168. this.restoreAction.hide();
  169. this.restoreAction.addEvent("click", this.restoreSize.bind(this));
  170. if (this.title){
  171. this.title.addEvent("dblclick", function(){
  172. this.switchMax();
  173. }.bind(this));
  174. }
  175. }
  176. },
  177. switchMax : function(){
  178. if( !this.isMax ){
  179. this.maxSize();
  180. }else{
  181. this.restoreSize();
  182. }
  183. },
  184. maxSize: function(){
  185. //if(!this.oldCoordinate)this.oldCoordinate = {
  186. // height : this.options.height,
  187. // width : this.options.width,
  188. // top : this.options.top,
  189. // left : this.options.left,
  190. // fromTop : this.options.fromTop,
  191. // fromLeft : this.options.fromLeft,
  192. // contentHeight : this.options.contentHeight,
  193. // contentWidth : this.options.contentWidth,
  194. // maxHeightPercent : this.options.maxHeightPercent,
  195. // maxHeight : this.options.maxHeight,
  196. // maxWidth : this.options.maxWidth
  197. //};
  198. //if( !this.oldSize ){
  199. // this.oldSize = {
  200. // "width" : this.width,
  201. // "height" : this.height
  202. // }
  203. //}
  204. if( !this.oldNodeSize ){
  205. this.oldNodeSize = {
  206. "width" : this.nodeWidth,
  207. "height" : this.nodeHeight
  208. }
  209. }
  210. if( !this.oldContentSize ){
  211. this.oldContentSize = {
  212. "width" : this.contentWidth,
  213. "height" : this.contentHeight
  214. }
  215. }
  216. var container = $(document.body);
  217. if (layout.desktop.currentApp){
  218. container = layout.desktop.currentApp.content;
  219. }else if (this.options.container){
  220. if (this.options.container.getSize().y<$(document.body).getSize().y){
  221. container = this.options.container;
  222. }
  223. }
  224. var containerSize = container.getSize();
  225. this.options.width = containerSize.x;
  226. this.options.height = containerSize.y;
  227. this.setContentSize( containerSize.y, containerSize.x );
  228. this.node.setStyles({
  229. width : containerSize.x + "px",
  230. height : containerSize.y + "px",
  231. top : "0px",
  232. left : "0px"
  233. });
  234. this.maxAction.setStyle("display","none");
  235. this.restoreAction.setStyle("display","");
  236. this.isMax = true;
  237. this.fireEvent("max");
  238. },
  239. restoreSize : function(){
  240. this.contentHeight = this.oldContentSize.height;
  241. this.contentWidth = this.oldContentSize.width;
  242. this.nodeHeight = this.oldNodeSize.height;
  243. this.nodeWidth = this.oldNodeSize.width;
  244. this.content.setStyles( this.oldContentSize );
  245. this.node.setStyles( this.oldNodeSize );
  246. this.reCenter();
  247. this.maxAction.setStyle("display","");
  248. this.restoreAction.setStyle("display","none");
  249. this.isMax = false;
  250. this.fireEvent("restore");
  251. },
  252. reCenter: function(){
  253. var size;
  254. if( this.node.offsetParent === null ){ //如果是隐藏的
  255. size = this.node.measure(function(){
  256. return this.getSize();
  257. });
  258. }else{
  259. size = this.node.getSize();
  260. }
  261. if( this.options.positionWidth ){
  262. size.x = parseInt(this.options.positionWidth);
  263. }
  264. if( this.options.positionHeight ){
  265. size.y = parseInt(this.options.positionHeight);
  266. }
  267. var container = $(document.body);
  268. if( this.options.positionNode && this.options.positionNode.getSize().y<$(document.body).getSize().y ){
  269. container = this.options.positionNode;
  270. }else if (layout.desktop.currentApp){
  271. container = layout.desktop.currentApp.content;
  272. }else{
  273. if (this.options.container){
  274. if (this.options.container.getSize().y<$(document.body).getSize().y){
  275. container = this.options.container;
  276. }
  277. }
  278. }
  279. var p = o2.getCenter(size, container, container);
  280. if (p.y< ( this.options.minTop || 0 ) ) p.y = this.options.minTop || 0;
  281. this.options.top = p.y;
  282. this.options.left = p.x;
  283. this.css.to.top = this.options.top+"px";
  284. this.css.to.left = this.options.left+"px";
  285. this.node.setStyles({
  286. "top": this.css.to.top,
  287. "left": this.css.to.left
  288. });
  289. },
  290. getOffsetY : function(node){
  291. return (node.getStyle("margin-top").toInt() || 0 ) +
  292. (node.getStyle("margin-bottom").toInt() || 0 ) +
  293. (node.getStyle("padding-top").toInt() || 0 ) +
  294. (node.getStyle("padding-bottom").toInt() || 0 )+
  295. (node.getStyle("border-top-width").toInt() || 0 ) +
  296. (node.getStyle("border-bottom-width").toInt() || 0 );
  297. },
  298. getOffsetX : function(node){
  299. return (node.getStyle("margin-left").toInt() || 0 ) +
  300. (node.getStyle("margin-right").toInt() || 0 ) +
  301. (node.getStyle("padding-left").toInt() || 0 ) +
  302. (node.getStyle("padding-right").toInt() || 0 )+
  303. (node.getStyle("border-left-width").toInt() || 0 ) +
  304. (node.getStyle("border-right-width").toInt() || 0 );
  305. },
  306. getMarginY : function(node){
  307. return (node.getStyle("margin-top").toInt() || 0 ) +
  308. (node.getStyle("margin-bottom").toInt() || 0 );
  309. },
  310. getMarginX : function(node){
  311. return (node.getStyle("margin-left").toInt() || 0 ) +
  312. (node.getStyle("margin-right").toInt() || 0 );
  313. },
  314. setContentHeightAuto : function(){
  315. var maxHeight = this.getMaxHeight();
  316. var offsetY = 0;
  317. var y = 0;
  318. //y = y + getOffsetY( this.title ) + this.title.getSize().y; //this.titleNode.getStyle("height").toInt();
  319. if( this.title )offsetY = offsetY + this.getOffsetY( this.title ) + this.title.getSize().y;
  320. if( this.bottom )offsetY = offsetY + this.getOffsetY( this.bottom ) + this.bottom.getSize().y;
  321. if( this.button && !this.buttonDisable )offsetY = offsetY + this.getOffsetY( this.button ) + this.button.getSize().y;
  322. if( this.content ){
  323. offsetY = offsetY + this.getMarginY( this.content );
  324. y = offsetY + this.content.getSize().y;
  325. }else{
  326. y = offsetY;
  327. }
  328. if ( typeOf(maxHeight) === "number" && y > maxHeight) {
  329. this.options.height = maxHeight;
  330. this.options.contentHeight = null;
  331. this.options.fromTop = this.options.fromTop.toFloat() - offsetY / 2;
  332. this.options.top = this.options.top.toFloat() - offsetY / 2;
  333. this.css.to.height = maxHeight + "px";
  334. this.css.to.top = this.options.top + "px";
  335. this.css.from.top = this.options.fromTop + "px";
  336. this.node.setStyles({
  337. "height": maxHeight
  338. });
  339. this.contentHeight = maxHeight - offsetY;
  340. if (this.content) {
  341. this.content.setStyles({
  342. "height" : maxHeight - offsetY,
  343. "overflow-y": "auto"
  344. })
  345. }
  346. }else{
  347. this.options.height = y;
  348. this.options.contentHeight = null;
  349. this.options.fromTop = this.options.fromTop.toFloat() - offsetY / 2;
  350. this.options.top = this.options.top.toFloat() - offsetY / 2;
  351. this.css.to.height = y + "px";
  352. this.css.to.top = this.options.top + "px";
  353. this.css.from.top = this.options.fromTop + "px";
  354. this.node.setStyles({
  355. "height": y
  356. });
  357. this.contentHeight = y - offsetY;
  358. if (this.content) {
  359. this.content.setStyles({
  360. "height" : y - offsetY,
  361. "overflow-y": "hidden"
  362. })
  363. }
  364. }
  365. },
  366. getMaxHeight : function(){
  367. var maxHeightPercent;
  368. if( this.options.maxHeightPercent ){
  369. maxHeightPercent = this.options.maxHeightPercent;
  370. if( typeOf(maxHeightPercent) === "string" && maxHeightPercent.substr(maxHeightPercent.length - 1, 1) === "%" ) {
  371. var containerHeight = ( this.options.positionNode || this.options.container || $(document.body)).getSize().y;
  372. maxHeightPercent = parseInt(containerHeight * parseInt(maxHeightPercent) / 100);
  373. if( maxHeightPercent + (this.options.minTop || 0) > containerHeight ){
  374. maxHeightPercent = containerHeight - (this.options.minTop)
  375. }
  376. }
  377. }
  378. var maxHeight;
  379. if( this.options.maxHeight && parseFloat( this.options.maxHeight ).toString() !== "NaN" ){
  380. maxHeight = parseFloat( this.options.maxHeight );
  381. if( typeOf(maxHeightPercent) === "number" ){
  382. maxHeight = Math.min( maxHeight, maxHeightPercent )
  383. }
  384. }else if( typeOf(maxHeightPercent) === "number" ){
  385. maxHeight = maxHeightPercent;
  386. }
  387. return maxHeight;
  388. },
  389. getNodeSize: function(){
  390. return {
  391. "height": this.nodeHeight+"px",
  392. "width": this.nodeWidth+"px"
  393. };
  394. },
  395. getContentSize: function(height, width){
  396. var nodeHeight, nodeWidth;
  397. if (!height){
  398. if (this.options.contentHeight){
  399. nodeHeight = height = this.options.contentHeight.toFloat();
  400. this.contentHeight = height;
  401. }else{
  402. height = this.options.height.toFloat();
  403. var maxHeight = this.getMaxHeight();
  404. if( typeOf(maxHeight) === "number" && maxHeight < height ){
  405. height = maxHeight;
  406. }
  407. this.nodeHeight = height;
  408. }
  409. }else{
  410. this.nodeHeight = height;
  411. }
  412. if (!width){
  413. if (this.options.contentWidth){
  414. nodeWidth = width = this.options.contentWidth.toFloat();
  415. this.contentWidth = width;
  416. }else{
  417. width = this.options.width.toFloat();
  418. this.nodeWidth = width;
  419. }
  420. }else{
  421. this.nodeWidth = width;
  422. }
  423. var offsetHeight = 0;
  424. var offsetWidth = 0;
  425. if (this.title){
  426. var h1 = this.title.getSize().y;
  427. var ptop1 = this.title.getStyle("padding-top").toFloat();
  428. var pbottom1 = this.title.getStyle("padding-bottom").toFloat();
  429. var mtop1 = this.title.getStyle("margin-top").toFloat();
  430. var mbottom1 = this.title.getStyle("margin-bottom").toFloat();
  431. offsetHeight += h1 + ptop1 + pbottom1 + mtop1 + mbottom1;
  432. }
  433. if (this.bottom){
  434. var h2 = this.bottom.getSize().y;
  435. var ptop2 = this.bottom.getStyle("padding-top").toFloat();
  436. var pbottom2 = this.bottom.getStyle("padding-bottom").toFloat();
  437. var mtop2 = this.bottom.getStyle("margin-top").toFloat();
  438. var mbottom2 = this.bottom.getStyle("margin-bottom").toFloat();
  439. offsetHeight += h2 + ptop2 + pbottom2 + mtop2 + mbottom2;
  440. }
  441. if (this.button && !this.buttonDisable){
  442. var h3 = this.button.getSize().y;
  443. var ptop3 = this.button.getStyle("padding-top").toFloat();
  444. var pbottom3 = this.button.getStyle("padding-bottom").toFloat();
  445. var mtop3 = this.button.getStyle("margin-top").toFloat();
  446. var mbottom3 = this.button.getStyle("margin-bottom").toFloat();
  447. offsetHeight += h3 + ptop3 + pbottom3 + mtop3 + mbottom3;
  448. }
  449. var ptop4 = this.content.getStyle("padding-top").toFloat();
  450. var pbottom4 = this.content.getStyle("padding-bottom").toFloat();
  451. var mtop4 = this.content.getStyle("margin-top").toFloat();
  452. var mbottom4 = this.content.getStyle("margin-bottom").toFloat();
  453. offsetHeight += ptop4 + pbottom4 + mtop4 + mbottom4;
  454. if (nodeHeight){
  455. nodeHeight = nodeHeight + offsetHeight+2;
  456. }else {
  457. height = height - offsetHeight;
  458. }
  459. //if (this.content.getParent().getStyle("overflow-x")!="hidden" ) height = height-18;
  460. var pleft = this.content.getStyle("padding-left").toFloat();
  461. var pright = this.content.getStyle("padding-right").toFloat();
  462. var mleft = this.content.getStyle("margin-left").toFloat();
  463. var mright = this.content.getStyle("margin-right").toFloat();
  464. offsetWidth = pleft+pright+mleft+mright;
  465. //width = width-pleft-pright-mleft-mright;
  466. //if (this.content.getParent().getStyle("overflow-y")!="hidden" ) width = width-18;
  467. if (nodeWidth){
  468. nodeWidth = nodeWidth+offsetWidth;
  469. }else{
  470. width = width-offsetWidth;
  471. }
  472. if (nodeHeight) {
  473. this.nodeHeight = nodeHeight;
  474. this.options.height = nodeHeight;
  475. this.options.contentHeight = null;
  476. this.options.fromTop = this.options.fromTop.toFloat()-offsetHeight/2;
  477. this.options.top = this.options.top.toFloat()-offsetHeight/2;
  478. this.css.to.height = nodeHeight+"px";
  479. this.css.to.top = this.options.top+"px";
  480. this.css.from.top = this.options.fromTop+"px";
  481. }else{
  482. this.contentHeight = height;
  483. }
  484. if (nodeWidth){
  485. this.nodeWidth = nodeWidth;
  486. this.options.width = nodeWidth;
  487. this.options.contentWidth = null;
  488. this.options.fromLeft = this.options.fromLeft.toFloat()-offsetWidth/2;
  489. this.options.left = this.options.left.toFloat()-offsetWidth/2;
  490. this.css.to.width = nodeWidth+"px";
  491. this.css.to.left = this.options.left+"px";
  492. this.css.from.left = this.options.fromLeft+"px";
  493. }else{
  494. this.contentWidth = width;
  495. }
  496. if (!height || height<0){
  497. this.content.setStyles({"overflow": "hidden", "height": "auto", "width": ""+width+"px"});
  498. height = this.content.getSize().y;
  499. var h = height + h1 + ptop1 + pbottom1 + mtop1 + mbottom1;
  500. h = h + h2 + ptop2 + pbottom2 + mtop2 + mbottom2;
  501. h = h + h3 + ptop3 + pbottom3 + mtop3 + mbottom3;
  502. h = h + ptop4 + pbottom4 + mtop4 + mbottom4;
  503. this.css.to.height = h;
  504. }
  505. // var ptop5 = this.node.getStyle("padding-top").toFloat();
  506. // var pbottom5 = this.node.getStyle("padding-bottom").toFloat();
  507. // height = height - ptop5 - pbottom5;
  508. return {"height": height+"px", "width": width+"px"};
  509. },
  510. setContentHeight: function(height){
  511. var nodeHeight;
  512. if (!height){
  513. if (this.options.contentHeight){
  514. nodeHeight = height = this.options.contentHeight.toFloat();
  515. this.contentHeight = height;
  516. }else{
  517. height = this.options.height.toFloat();
  518. var maxHeight = this.getMaxHeight();
  519. if( typeOf(maxHeight) === "number" && maxHeight < height ){
  520. height = maxHeight;
  521. }
  522. this.nodeHeight = height;
  523. }
  524. }else{
  525. this.nodeHeight = height;
  526. }
  527. var offsetHeight = 0;
  528. if (this.title){
  529. var h1 = this.title.getSize().y;
  530. //offsetHeight += h1 + this.getOffsetY(this.title);
  531. var ptop1 = this.title.getStyle("padding-top").toFloat();
  532. var pbottom1 = this.title.getStyle("padding-bottom").toFloat();
  533. var mtop1 = this.title.getStyle("margin-top").toFloat();
  534. var mbottom1 = this.title.getStyle("margin-bottom").toFloat();
  535. offsetHeight += h1 + ptop1 + pbottom1 + mtop1 + mbottom1;
  536. }
  537. if (this.bottom){
  538. var h2 = this.bottom.getSize().y;
  539. //offsetHeight += h2 + this.getOffsetY(this.bottom);
  540. var ptop2 = this.bottom.getStyle("padding-top").toFloat();
  541. var pbottom2 = this.bottom.getStyle("padding-bottom").toFloat();
  542. var mtop2 = this.bottom.getStyle("margin-top").toFloat();
  543. var mbottom2 = this.bottom.getStyle("margin-bottom").toFloat();
  544. offsetHeight += h2 + ptop2 + pbottom2 + mtop2 + mbottom2;
  545. }
  546. if (this.button && !this.buttonDisable){
  547. var h3 = this.button.getSize().y;
  548. //offsetHeight += h3 + this.getOffsetY(this.button);
  549. var ptop3 = this.button.getStyle("padding-top").toFloat();
  550. var pbottom3 = this.button.getStyle("padding-bottom").toFloat();
  551. var mtop3 = this.button.getStyle("margin-top").toFloat();
  552. var mbottom3 = this.button.getStyle("margin-bottom").toFloat();
  553. offsetHeight += h3 + ptop3 + pbottom3 + mtop3 + mbottom3;
  554. }
  555. //offsetHeight += this.getOffsetY(this.content);
  556. var ptop4 = this.content.getStyle("padding-top").toFloat();
  557. var pbottom4 = this.content.getStyle("padding-bottom").toFloat();
  558. var mtop4 = this.content.getStyle("margin-top").toFloat();
  559. var mbottom4 = this.content.getStyle("margin-bottom").toFloat();
  560. offsetHeight += ptop4 + pbottom4 + mtop4 + mbottom4;
  561. if (nodeHeight){
  562. nodeHeight = nodeHeight + offsetHeight+2;
  563. }else {
  564. height = height - offsetHeight;
  565. }
  566. if (nodeHeight) {
  567. this.nodeHeight = nodeHeight;
  568. this.options.height = nodeHeight;
  569. this.options.contentHeight = null;
  570. this.options.fromTop = this.options.fromTop.toFloat()-offsetHeight/2;
  571. this.options.top = this.options.top.toFloat()-offsetHeight/2;
  572. this.css.to.height = nodeHeight+"px";
  573. this.css.to.top = this.options.top+"px";
  574. this.css.from.top = this.options.fromTop+"px";
  575. }else{
  576. this.contentHeight = height;
  577. }
  578. //if (nodeWidth){
  579. // this.nodeWidth = nodeWidth;
  580. // this.options.width = nodeWidth;
  581. // this.options.contentWidth = null;
  582. // this.options.fromLeft = this.options.fromLeft.toFloat()-offsetWidth/2;
  583. // this.options.left = this.options.left.toFloat()-offsetWidth/2;
  584. // this.css.to.width = nodeWidth+"px";
  585. // this.css.to.left = this.options.left+"px";
  586. // this.css.from.left = this.options.fromLeft+"px";
  587. //}else{
  588. // this.contentWidth = width;
  589. //}
  590. if (!height || height<0){
  591. this.content.setStyles({"overflow": "hidden", "height": "auto"});
  592. height = this.content.getSize().y;
  593. var h = height + h1 + ptop1 + pbottom1 + mtop1 + mbottom1;
  594. h = h + h2 + ptop2 + pbottom2 + mtop2 + mbottom2;
  595. h = h + h3 + ptop3 + pbottom3 + mtop3 + mbottom3;
  596. h = h + ptop4 + pbottom4 + mtop4 + mbottom4;
  597. this.css.to.height = h;
  598. }else{
  599. this.content.setStyles( {"height" : height} )
  600. }
  601. },
  602. setContentWidthAuto : function(){
  603. var maxWidth = this.options.maxWidth || "100%";
  604. if( typeOf(maxWidth) === "string" && maxWidth.substr(maxWidth.length - 1, 1) === "%" ) {
  605. var containerWidth = ( this.options.positionNode || this.options.container || $(document.body)).getSize().x;
  606. maxWidth = parseInt(containerWidth * parseInt(maxWidth) / 100);
  607. }
  608. var offsetX = 0;
  609. var x = 0;
  610. if( this.content ){
  611. offsetX = offsetX + this.getMarginX( this.content );
  612. x = offsetX + this.content.getSize().x;
  613. }else{
  614. x = offsetX;
  615. }
  616. if ( x > maxWidth) {
  617. this.nodeWidth = maxWidth;
  618. this.options.width = maxWidth;
  619. this.options.contentWidth = null;
  620. this.options.fromLeft = this.options.fromLeft.toFloat() - offsetX / 2;
  621. this.options.left = this.options.left.toFloat() - offsetX / 2;
  622. this.css.to.width = maxWidth + "px";
  623. this.css.to.left = this.options.left + "px";
  624. this.css.from.left = this.options.fromLeft + "px";
  625. this.node.setStyles({
  626. "width": maxWidth
  627. });
  628. this.contentWidth = maxWidth - this.getOffsetX(this.content);
  629. if (this.content) {
  630. this.content.setStyles({
  631. "width" : this.contentWidth,
  632. "overflow-x": "auto"
  633. })
  634. }
  635. }else{
  636. this.nodeWidth = x;
  637. this.options.width = x;
  638. this.options.contentHeight = null;
  639. this.options.fromLeft = this.options.fromLeft.toFloat() - offsetX / 2;
  640. this.options.left = this.options.left.toFloat() - offsetX / 2;
  641. this.css.to.width = x + "px";
  642. this.css.to.left = this.options.left + "px";
  643. this.css.from.left = this.options.fromLeft + "px";
  644. this.node.setStyles({
  645. "width": x
  646. });
  647. this.contentWidth = x - this.getOffsetX(this.content);
  648. if (this.content) {
  649. this.content.setStyles({
  650. "width" : this.contentWidth,
  651. "overflow-x": "hidden"
  652. })
  653. }
  654. }
  655. },
  656. setContentWidth: function(width){
  657. var nodeWidth;
  658. if (!width){
  659. if (this.options.contentWidth){
  660. nodeWidth = width = this.options.contentWidth.toFloat();
  661. this.contentWidth = width;
  662. }else{
  663. width = this.options.width.toFloat();
  664. this.nodeWidth = width;
  665. }
  666. }else{
  667. this.nodeWidth = width;
  668. }
  669. var offsetWidth = 0;
  670. //if (this.content.getParent().getStyle("overflow-x")!="hidden" ) height = height-18;
  671. var pleft = this.content.getStyle("padding-left").toFloat();
  672. var pright = this.content.getStyle("padding-right").toFloat();
  673. var mleft = this.content.getStyle("margin-left").toFloat();
  674. var mright = this.content.getStyle("margin-right").toFloat();
  675. offsetWidth = pleft+pright+mleft+mright;
  676. //width = width-pleft-pright-mleft-mright;
  677. //if (this.content.getParent().getStyle("overflow-y")!="hidden" ) width = width-18;
  678. if (nodeWidth){
  679. nodeWidth = nodeWidth+offsetWidth;
  680. }else{
  681. var x = width;
  682. width = width-offsetWidth;
  683. }
  684. if (nodeWidth){
  685. this.nodeWidth = nodeWidth;
  686. this.options.width = nodeWidth;
  687. this.options.contentWidth = null;
  688. this.css.to.left = this.options.left+"px";
  689. this.css.from.left = this.options.fromLeft+"px";
  690. this.css.to.width = nodeWidth+"px";
  691. this.options.fromLeft = this.options.fromLeft.toFloat()-offsetWidth/2;
  692. this.options.left = this.options.left.toFloat()-offsetWidth/2;
  693. this.node.setStyle("width", nodeWidth )
  694. }else{
  695. this.contentWidth = width;
  696. this.node.setStyle("width", x )
  697. }
  698. this.content.setStyles( {"width" : width} )
  699. },
  700. setContentSize: function(height, width){
  701. debugger;
  702. //this.content.setStyle("height", this.getContentSize(height));
  703. // if (!this.options.height && !height){
  704. // this.content.setStyle("height", "auto");
  705. // this.content.setStyle("overflow", "hidden");
  706. // this.content.setStyle("width", "auto");
  707. // }else{
  708. var y = height;
  709. if (!y){
  710. if (this.options.contentHeight){
  711. y = this.options.contentHeight;
  712. }else{
  713. y = this.height;
  714. }
  715. }
  716. var x = width;
  717. if (!x){
  718. if (this.options.contentWidth){
  719. x = this.options.contentWidth;
  720. }else{
  721. x = this.width;
  722. }
  723. }
  724. if( y === "auto" || x === "auto" ){
  725. if( y === "auto" ){
  726. this.setContentHeightAuto();
  727. }else{
  728. this.setContentHeight( height );
  729. }
  730. if( x === "auto" ){
  731. this.setContentWidthAuto();
  732. }else{
  733. this.setContentWidth( width );
  734. }
  735. }else{
  736. this.content.setStyles(this.getContentSize(height, width));
  737. this.content.setStyle("width", "auto");
  738. }
  739. }
  740. });
  741. o2.DL.open = function(options){
  742. debugger;
  743. if (!options) options = {};
  744. if (!options.style) options.style = "user";
  745. //if (!options.transition) options.transition = Fx.Transitions.Back.easeOut;
  746. if (!options.duration) options.duration = 200;
  747. if (options.isClose!==false) options.isClose = true;
  748. var size;
  749. if ((!options.width || options.width=="auto") && !options.contentWidth){
  750. if (options.content){
  751. options.content.show();
  752. size = options.content.getComputedSize();
  753. options.contentWidth = size.totalWidth.toFloat();
  754. }
  755. }
  756. if ((!options.height || options.height=="auto") && !options.contentHeight){
  757. if (options.content){
  758. if (!size){
  759. options.content.show();
  760. size = options.content.getComputedSize();
  761. }
  762. options.contentHeight = size.totalHeight.toFloat()+2;
  763. }
  764. }
  765. if (!options.width && !options.contentWidth) options.width = 300;
  766. if (!options.height && !options.contentHeight) options.height = 150;
  767. if (!options.container && layout){
  768. if (layout.desktop.currentApp){
  769. options.container = layout.desktop.currentApp.content;
  770. }
  771. }
  772. var container = (options.positionNode || options.container || $(document.body));
  773. if( options.width !== "auto" && options.height !== "auto" ){
  774. //如果是百分比
  775. if( "string" == typeOf(options.width) && (1 < options.width.length && "%" == options.width.substr(options.width.length - 1, 1)) ){
  776. options.width = parseInt( container.getSize().x * parseInt(options.width, 10) / 100, 10);
  777. }
  778. if( "string" == typeOf(options.height) && (1 < options.height.length && "%" == options.height.substr(options.height.length - 1, 1)) ){
  779. options.height = parseInt( container.getSize().y * parseInt(options.height, 10) / 100, 10);
  780. }
  781. if ((options.top===undefined ) && (options.left===undefined)){
  782. var p = o2.getCenter({"x":(options.width || options.contentWidth), "y": (options.height || options.contentHeight+120)}, container, container);
  783. options.top = (p.y<0) ? 0 : p.y;
  784. options.left = (p.x<0) ? 0 : p.x;
  785. }
  786. if ((options.fromTop===undefined ) && (options.fromLeft===undefined)){
  787. var p = o2.getCenter({"x":(options.width || options.contentWidth)*0, "y": (options.height || options.contentHeight+120)*0}, container, container);
  788. options.fromTop = (p.y<0) ? 0 : p.y;
  789. options.fromLeft = (p.x<0) ? 0 : p.x;
  790. }
  791. if (options.offset){
  792. if (options.offset.y){
  793. options.top = options.top+options.offset.y.toInt();
  794. options.fromTop = options.fromTop+options.offset.y.toInt();
  795. }
  796. if (options.offset.x){
  797. options.left = options.left+options.offset.x.toInt();
  798. options.fromLeft = options.fromLeft+options.offset.x.toInt();
  799. }
  800. }
  801. if (options.top<0) options.top = 0;
  802. if (options.left<0) options.left = 0;
  803. if (options.fromTop<0) options.fromTop = 0;
  804. if (options.fromLeft<0) options.fromLeft = 0;
  805. }else{
  806. if(options.top===undefined )options.top = 0;
  807. if(options.left===undefined)options.left = 0;
  808. if(options.fromTop===undefined)options.fromTop = 0;
  809. if(options.fromLeft===undefined)options.fromLeft = 0;
  810. }
  811. options.mark = !(options.mask===false);
  812. var dlg = new o2.DDL(options);
  813. if( options.width === "auto" || options.height === "auto" ){
  814. dlg.reCenter();
  815. }
  816. dlg.show();
  817. return dlg;
  818. };